diff --git a/README.md b/README.md index f79f73e3..53b690cb 100644 --- a/README.md +++ b/README.md @@ -137,6 +137,7 @@ export default function ReadMeExampleSingle() { // }} // onChange={} // same props as onConfirm but triggered without confirmed by user // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select date" // optional // animationType="slide" // optional, default is 'slide' on ios/android and 'none' on web /> @@ -192,6 +193,7 @@ export default function ReadMeExampleRange() { // }} // onChange={} // same props as onConfirm but triggered without confirmed by user // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select period" // optional // startLabel="From" // optional // endLabel="To" // optional @@ -245,6 +247,7 @@ export default function ReadMeExampleMultiple() { // disabledDates: [new Date()] // optional // }} // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select period" // optional // startLabel="From" // optional // endLabel="To" // optional @@ -307,6 +310,7 @@ export default function TimePickerPage() { hours={12} // default: current hours minutes={14} // default: current minutes label="Select time" // optional, default 'Select time' + uppercase={false} // optional, default is true cancelLabel="Cancel" // optional, default: 'Cancel' confirmLabel="Ok" // optional, default: 'Ok' animationType="fade" // optional, default is 'none' diff --git a/example/src/App.tsx b/example/src/App.tsx index a391218c..ab308109 100644 --- a/example/src/App.tsx +++ b/example/src/App.tsx @@ -315,6 +315,7 @@ function App() { onConfirm={onChangeRange} // locale={'nl'} // optional // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select period" // optional // startLabel="From" // optional // endLabel="To" // optional @@ -335,6 +336,7 @@ function App() { // endDate: new Date(), // optional }} // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select date" // optional // animationType="slide" // optional, default is 'slide' on ios/android and 'none' on web /> @@ -352,6 +354,7 @@ function App() { // moreLabel="more" // optional, if multiple are selected this will show if we can't show all dates // onChange={onChangeMulti} // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select date" // optional // animationType="slide" // optional, default is 'slide' on ios/android and 'none' on web /> diff --git a/example/src/ReadMeExampleMultiple.tsx b/example/src/ReadMeExampleMultiple.tsx index 28fe25ee..6dc50b57 100644 --- a/example/src/ReadMeExampleMultiple.tsx +++ b/example/src/ReadMeExampleMultiple.tsx @@ -37,6 +37,7 @@ export default function ReadMeExampleMultiple() { // }} // locale={'nl'} // optional // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select period" // optional // startLabel="From" // optional // endLabel="To" // optional diff --git a/example/src/ReadMeExampleRange.tsx b/example/src/ReadMeExampleRange.tsx index 283ba2eb..0d6c470c 100644 --- a/example/src/ReadMeExampleRange.tsx +++ b/example/src/ReadMeExampleRange.tsx @@ -44,6 +44,7 @@ export default function ReadMeExampleRange() { // onChange={} // same props as onConfirm but triggered without confirmed by user // locale={'nl'} // optional // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select period" // optional // startLabel="From" // optional // endLabel="To" // optional diff --git a/example/src/ReadMeExampleSingle.tsx b/example/src/ReadMeExampleSingle.tsx index aaeb97a1..a1ab002d 100644 --- a/example/src/ReadMeExampleSingle.tsx +++ b/example/src/ReadMeExampleSingle.tsx @@ -37,6 +37,7 @@ export default function ReadMeExampleSingle() { // }} // onChange={} // same props as onConfirm but triggered without confirmed by user // saveLabel="Save" // optional + // uppercase={false} // optional, default is true // label="Select date" // optional // animationType="slide" // optional, default is 'slide' on ios/android and 'none' on web /> diff --git a/src/Date/DatePickerModalContent.tsx b/src/Date/DatePickerModalContent.tsx index 28307b35..3f5fa180 100644 --- a/src/Date/DatePickerModalContent.tsx +++ b/src/Date/DatePickerModalContent.tsx @@ -142,6 +142,7 @@ export function DatePickerModalContent( onSave={onInnerConfirm} onDismiss={onDismiss} saveLabel={props.saveLabel} + uppercase={props.uppercase ?? true} disableSafeTop={disableSafeTop} /> diff --git a/src/Date/DatePickerModalContentHeader.tsx b/src/Date/DatePickerModalContentHeader.tsx index d0c9e2d8..2a04d7f8 100644 --- a/src/Date/DatePickerModalContentHeader.tsx +++ b/src/Date/DatePickerModalContentHeader.tsx @@ -12,6 +12,7 @@ export interface HeaderPickProps { label?: string emptyLabel?: string saveLabel?: string + uppercase?: boolean headerSeparator?: string startLabel?: string endLabel?: string @@ -48,7 +49,7 @@ function getLabel( export default function DatePickerModalContentHeader( props: HeaderContentProps ) { - const { onToggle, collapsed, mode, moreLabel } = props + const { onToggle, collapsed, mode, moreLabel, uppercase } = props const label = getLabel(props.locale, props.mode, props.label) @@ -57,7 +58,7 @@ export default function DatePickerModalContentHeader( return ( - {label.toUpperCase()} + {uppercase ? label.toUpperCase() : label} {mode === 'range' ? ( diff --git a/src/Date/DatePickerModalHeader.tsx b/src/Date/DatePickerModalHeader.tsx index 0f5f8117..7f7e7e49 100644 --- a/src/Date/DatePickerModalHeader.tsx +++ b/src/Date/DatePickerModalHeader.tsx @@ -8,6 +8,7 @@ import { getTranslation } from '../translations/utils' export interface DatePickerModalHeaderProps { disableSafeTop?: boolean saveLabel?: string + uppercase?: boolean onDismiss: () => void onSave: () => void locale: string | undefined @@ -43,6 +44,7 @@ export default function DatePickerModalHeader( +