Merge pull request #322 from web-ridge/date-picker-input-disableStatu…

…sBarPadding chore: add disableStatusBarPadding to date picker input
web-ridge · Sep 4, 2023 · a9cb8e7 · a9cb8e7
2 parents ef8d720 + 6265717
commit a9cb8e7
Show file tree

Hide file tree

Showing 7 changed files with 22 additions and 0 deletions.
diff --git a/docusaurus/docs/date-picker/input-date-picker.md b/docusaurus/docs/date-picker/input-date-picker.md
@@ -111,6 +111,10 @@ The end year when the component is rendered. Defaults to `2200`.
 `Type: boolean | undefined`  
 Flag indicating if the component should be enabled or not. Behavior similarly to `disabled`. Defaults to `true`.
 
+**disableStatusBarPadding**  
+`Type: boolean | undefined`  
+Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+
 **presentationStyle**
 `Type: 'fullScreen' | 'pageSheet' | 'formSheet' | 'overFullScreen'`
 Determines the visual presentation style of the date picker modal. This prop allows you to define how the modal appears on the screen when it is displayed.

diff --git a/docusaurus/docs/date-picker/multiple-dates-picker.md b/docusaurus/docs/date-picker/multiple-dates-picker.md
@@ -143,6 +143,10 @@ The edit icon used to toggle between calendar and input. Defaults to `pencil`. Y
 `Type: string | undefined`  
 The edit icon used to toggle between input and calendar. Defaults to `calendar`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
 
+**disableStatusBarPadding**  
+`Type: boolean | undefined`  
+Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+
 **presentationStyle**
 `Type: 'fullScreen' | 'pageSheet' | 'formSheet' | 'overFullScreen'`
 Determines the visual presentation style of the date picker modal. This prop allows you to define how the modal appears on the screen when it is displayed.

diff --git a/docusaurus/docs/date-picker/range-date-picker.md b/docusaurus/docs/date-picker/range-date-picker.md
@@ -150,6 +150,10 @@ The edit icon used to toggle between input and calendar. Defaults to `calendar`.
 `Type: boolean | undefined`  
 Flag indicating if the component should be enabled or not. Defaults to `true`.
 
+**disableStatusBarPadding**  
+`Type: boolean | undefined`  
+Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+
 **presentationStyle**
 `Type: 'fullScreen' | 'pageSheet' | 'formSheet' | 'overFullScreen'`
 Determines the visual presentation style of the date picker modal. This prop allows you to define how the modal appears on the screen when it is displayed.

diff --git a/docusaurus/docs/date-picker/single-date-picker.md b/docusaurus/docs/date-picker/single-date-picker.md
@@ -137,6 +137,10 @@ The edit icon used to toggle between input and calendar. Defaults to `calendar`.
 `Type: boolean | undefined`  
 Flag indicating if the component should be enabled or not. Defaults to `true`.
 
+**disableStatusBarPadding**  
+`Type: boolean | undefined`  
+Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+
 **presentationStyle**
 `Type: 'fullScreen' | 'pageSheet' | 'formSheet' | 'overFullScreen'`
 Determines the visual presentation style of the date picker modal. This prop allows you to define how the modal appears on the screen when it is displayed.

diff --git a/src/Date/DatePickerInput.shared.tsx b/src/Date/DatePickerInput.shared.tsx
@@ -21,6 +21,7 @@ export type DatePickerInputProps = {
   endYear?: number
   onChangeText?: (text: string | undefined) => void
   inputEnabled?: boolean
+  disableStatusBarPadding?: boolean
 } & Omit<
   React.ComponentProps<typeof TextInput>,
   'value' | 'onChange' | 'onChangeText' | 'inputMode'

diff --git a/src/Date/DatePickerInput.tsx b/src/Date/DatePickerInput.tsx
@@ -53,6 +53,7 @@ function DatePickerInput(
         startYear,
         endYear,
         inputEnabled,
+        disableStatusBarPadding,
       }) =>
         withModal ? (
           <DatePickerModal
@@ -70,6 +71,7 @@ function DatePickerInput(
             startYear={startYear ?? 1800}
             endYear={endYear ?? 2200}
             inputEnabled={inputEnabled}
+            disableStatusBarPadding={disableStatusBarPadding ?? false}
           />
         ) : null
       }

diff --git a/src/Date/DatePickerInputWithoutModal.tsx b/src/Date/DatePickerInputWithoutModal.tsx
@@ -28,6 +28,7 @@ function DatePickerInputWithoutModal(
     endYear,
     onChangeText,
     inputEnabled,
+    disableStatusBarPadding,
     ...rest
   }: DatePickerInputProps & {
     modal?: (params: {
@@ -41,6 +42,7 @@ function DatePickerInputWithoutModal(
       startYear: DatePickerInputProps['startYear']
       endYear: DatePickerInputProps['endYear']
       inputEnabled: DatePickerInputProps['inputEnabled']
+      disableStatusBarPadding: DatePickerInputProps['disableStatusBarPadding']
     }) => any
     inputButton?: React.ReactNode
   },
@@ -113,6 +115,7 @@ function DatePickerInputWithoutModal(
         startYear,
         endYear,
         inputEnabled,
+        disableStatusBarPadding,
       })}
     </>
   )