diff --git a/docusaurus/docs/date-picker/input-date-picker.md b/docusaurus/docs/date-picker/input-date-picker.md
index 58d8cf67..208fb84f 100644
--- a/docusaurus/docs/date-picker/input-date-picker.md
+++ b/docusaurus/docs/date-picker/input-date-picker.md
@@ -39,111 +39,115 @@ View an interactive [Expo snack](https://snack.expo.dev/@fitzwabs/react-native-p
 
 ## Props
 
-**locale (Required)**  
-`Type: String`  
-A locale can be composed of both a base language, the country (territory) of use, and possibly codeset (which is usually assumed). For example, German is de.
+**animationType**  
+`Type: 'slide' | 'fade' | 'none' | undefined`  
+The animation used when opening the date picker modal. Defaults to `'slide'`.
 
-**label (Required)**  
-`Type: String`  
-The label used to display in the component.
+**disableCalendarIcon**  
+`Type: boolean | undefined`  
+Flag indicating if the calendar icon should be disabled. When set to `true`, the calendar icon will be disabled and users won't be able to click it to open the date picker modal. Defaults to `false`.
 
-**value (Required)**  
-`Type: Date | undefined`  
-The value used to populate the component.
+**disableStatusBarPadding**  
+`Type: boolean | undefined`  
+Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
 
-**inputMode (Required)**  
-`Type: String`  
-The type of input needed for the the picker component.
+**endYear**  
+`Type: number | undefined`  
+The end year when the component is rendered. Defaults to `2200`.
 
-**onChange**  
-`Type: Function`  
-Callback event when the component date mask length matches the text input length.
+**hasError**  
+`Type: boolean | undefined`  
+Flag indicating if the the component should display error styles.
 
-**onChangeText**  
-`Type: Function`  
-Callback event when the component text input changes.
+**hideValidationErrors**  
+`Type: boolean | undefined`  
+Flag indicating if the the component should hide error styles along with the `helperText` component displaying the error message.
 
-**mode**  
-`Type: 'flat' | 'outlined'`  
-See [react-native-paper text-input](https://callstack.github.io/react-native-paper/text-input.html#mode).
+**iconColor**  
+`Type: String`  
+Sets the color of the icon.
 
 **iconSize**  
 `Type: Number`  
 Specifies the size of the icon in pixels.
 
-**iconColor**  
-`Type: String`  
-Sets the color of the icon.
-
 **iconStyle**  
 `Type: React.CSSProperties`  
 Defines the CSS styles for the icon element.
 
-**validRange**  
-`Type: {
-  startDate: Date | undefined,
-  endDate: Date | undefined,
-  disabledDates: Date[] | undefined
-}`  
-Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
-
-**withDateFormatInLabel**
+**inputEnabled**  
 `Type: boolean | undefined`  
-Flag indicating if the date format should be inside the components label.
+Flag indicating if the component should be enabled or not. Behavior similarly to `disabled`. Defaults to `true`.
 
-**hasError**  
-`Type: boolean | undefined`  
-Flag indicating if the the component should display error styles.
+**inputMode (Required)**  
+`Type: String`  
+The type of input needed for the the picker component.
 
-**hideValidationErrors**  
-`Type: boolean | undefined`  
-Flag indicating if the the component should hide error styles along with the `helperText` component displaying the error message.
+**label (Required)**  
+`Type: String`  
+The label used to display in the component.
+
+**locale (Required)**  
+`Type: String`  
+A locale can be composed of both a base language, the country (territory) of use, and possibly codeset (which is usually assumed). For example, German is de.
+
+**mode**  
+`Type: 'flat' | 'outlined'`  
+See [react-native-paper text-input](https://callstack.github.io/react-native-paper/text-input.html#mode).
+
+**onChange**  
+`Type: Function`  
+Callback event when the component date mask length matches the text input length.
+
+**onChangeText**  
+`Type: Function`  
+Callback event when the component text input changes.
 
 **onValidationError**  
 `Type: Function | undefined`  
 Callback used to return any error messages from the components validation.
 
+**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.
+
+- `'fullScreen'`: Presents the modal as a full-screen overlay.
+- `'pageSheet'`: Displays the modal as a card-style sheet that covers a portion of the screen.
+- `'formSheet'`: Renders the modal as a smaller form-style sheet.
+- `'overFullScreen'`: Overlays the modal on top of the content, allowing interaction with the underlying content.
+
+For example, if you set `presentationStyle` to `'pageSheet'`, the modal will be presented as a card-like sheet.
+
 **saveLabelDisabled**  
 `Type: boolean | undefined`  
 Flag indicating if the save label should be disabled and unable to receive events. Defaults to `false`.
 
-**uppercase**  
+**startWeekOnMonday**  
 `Type: boolean | undefined`  
-Flag indicating if the text in the component should be uppercase. Defaults to `true`.
+Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
 
 **startYear**  
 `Type: number | undefined`  
 The start year when the component is rendered. Defaults to `1800`.
 
-**endYear**  
-`Type: number | undefined`  
-The end year when the component is rendered. Defaults to `2200`.
-
-**startWeekOnMonday**  
-`Type: boolean | undefined`  
-Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
-
-**inputEnabled**  
-`Type: boolean | undefined`  
-Flag indicating if the component should be enabled or not. Behavior similarly to `disabled`. Defaults to `true`.
-
-**disableStatusBarPadding**  
+**uppercase**  
 `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.
+Flag indicating if the text in the component should be uppercase. Defaults to `true`.
 
-- `'fullScreen'`: Presents the modal as a full-screen overlay.
-- `'pageSheet'`: Displays the modal as a card-style sheet that covers a portion of the screen.
-- `'formSheet'`: Renders the modal as a smaller form-style sheet.
-- `'overFullScreen'`: Overlays the modal on top of the content, allowing interaction with the underlying content.
+**validRange**  
+`Type: {
+  startDate: Date | undefined,
+  endDate: Date | undefined,
+  disabledDates: Date[] | undefined
+}`  
+Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
 
-**animationType**  
-`Type: 'slide' | 'fade' | 'none' | undefined`  
-The animation used when opening the date picker modal. Defaults to `'slide'`.
+**value (Required)**  
+`Type: Date | undefined`  
+The value used to populate the component.
 
-For example, if you set `presentationStyle` to `'pageSheet'`, the modal will be presented as a card-like sheet.
+**withDateFormatInLabel**
+`Type: boolean | undefined`  
+Flag indicating if the date format should be inside the components label.
 
 - Other [react-native TextInput props](https://reactnative.dev/docs/textinput#props).\*
diff --git a/docusaurus/docs/date-picker/multiple-dates-picker.md b/docusaurus/docs/date-picker/multiple-dates-picker.md
index 571ebe4b..9e4bd751 100644
--- a/docusaurus/docs/date-picker/multiple-dates-picker.md
+++ b/docusaurus/docs/date-picker/multiple-dates-picker.md
@@ -55,6 +55,42 @@ View an interactive [Expo snack](https://snack.expo.dev/@fitzwabs/react-native-p
 
 ## Props
 
+**animationType**  
+`Type: String | undefined`  
+The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
+
+**calendarIcon**  
+`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/).
+
+**closeIcon**  
+`Type: string | undefined`  
+The icon used to close the component. Defaults to `close`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+
+**dates (Required)**  
+`Type: Date[]`  
+The date values used to populate the component.
+
+**disableStatusBarPadding**  
+`Type: boolean | undefined`  
+Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+
+**editIcon**  
+`Type: string | undefined`  
+The edit icon used to toggle between calendar and input. Defaults to `pencil`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+
+**endLabel**  
+`Type: String | undefined`  
+The label used as the suffix to the ending date in the component. Defaults to `'To'`.
+
+**endYear**  
+`Type: number | undefined`  
+The end year when the component is rendered. Defaults to `2200`.
+
+**label**  
+`Type: String | undefined`  
+The label used as the header in the component. Defaults to `'Select date'`.
+
 **locale (Required)**  
 `Type: String`  
 A locale can be composed of both a base language, the country (territory) of use, and possibly codeset (which is usually assumed). For example, German is de.
@@ -63,37 +99,21 @@ A locale can be composed of both a base language, the country (territory) of use
 `Type: 'single' | 'multiple' | 'range'`  
 The selection type for the date picker. For this example it is `"multiple"`.
 
-**visible (Required)**  
-`Type: boolean`  
-Flag indicating if the component should be displayed.
+**moreLabel**  
+`Type: String | undefined`  
+The label used display when multiple dates have been selected in the component. Defaults to `'More'`.
 
-**onDismiss (Required)**  
+**onChange**  
 `Type: Function`  
-The action to take when the component is closed.
-
-**dates (Required)**  
-`Type: Date[]`  
-The date values used to populate the component.
+Event handler when the component changes.
 
 **onConfirm (Required)**  
 `Type: Function`  
 The action to take when the date is selected.
 
-**moreLabel**  
-`Type: String | undefined`  
-The label used display when multiple dates have been selected in the component. Defaults to `'More'`.
-
-**validRange**  
-`Type: {
-  startDate: Date | undefined,
-  endDate: Date | undefined,
-  disabledDates: Date[] | undefined
-}`  
-Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
-
-**onChange**  
+**onDismiss (Required)**  
 `Type: Function`  
-Event handler when the component changes.
+The action to take when the component is closed.
 
 **saveLabel**  
 `Type: String | undefined`  
@@ -103,53 +123,33 @@ The label used confirm a date selection. Defaults to `'Save'`.
 `Type: boolean | undefined`  
 Flag indicating if the save label should be disabled and unable to receive events. Defaults to `false`.
 
-**uppercase**  
-`Type: boolean | undefined`  
-Flag indicating if the text in the component should be uppercase. Defaults to `true`.
-
-**label**  
-`Type: String | undefined`  
-The label used as the header in the component. Defaults to `'Select date'`.
-
 **startLabel**  
 `Type: String | undefined`  
 The label used as the prefix to the starting date in the component. Defaults to `'From'`.
 
-**endLabel**  
-`Type: String | undefined`  
-The label used as the suffix to the ending date in the component. Defaults to `'To'`.
-
-**animationType**  
-`Type: String | undefined`  
-The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
+**startWeekOnMonday**  
+`Type: boolean | undefined`  
+Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
 
 **startYear**  
 `Type: number | undefined`  
 The start year when the component is rendered. Defaults to `1800`.
 
-**endYear**  
-`Type: number | undefined`  
-The end year when the component is rendered. Defaults to `2200`.
-
-**startWeekOnMonday**  
+**uppercase**  
 `Type: boolean | undefined`  
-Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
-
-**closeIcon**  
-`Type: string | undefined`  
-The icon used to close the component. Defaults to `close`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
-
-**editIcon**  
-`Type: string | undefined`  
-The edit icon used to toggle between calendar and input. Defaults to `pencil`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+Flag indicating if the text in the component should be uppercase. Defaults to `true`.
 
-**calendarIcon**  
-`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/).
+**validRange**  
+`Type: {
+  startDate: Date | undefined,
+  endDate: Date | undefined,
+  disabledDates: Date[] | undefined
+}`  
+Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
 
-**disableStatusBarPadding**  
-`Type: boolean | undefined`  
-Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+**visible (Required)**  
+`Type: boolean`  
+Flag indicating if the component should be displayed.
 
 **presentationStyle**
 `Type: 'fullScreen' | 'pageSheet' | 'formSheet' | 'overFullScreen'`
diff --git a/docusaurus/docs/date-picker/range-date-picker.md b/docusaurus/docs/date-picker/range-date-picker.md
index 76e09a78..67fcdbe6 100644
--- a/docusaurus/docs/date-picker/range-date-picker.md
+++ b/docusaurus/docs/date-picker/range-date-picker.md
@@ -58,6 +58,46 @@ View an interactive [Expo snack](https://snack.expo.dev/@fitzwabs/react-native-p
 
 ## Props
 
+**animationType**  
+`Type: String | undefined`  
+The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
+
+**calendarIcon**  
+`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/).
+
+**closeIcon**  
+`Type: string | undefined`  
+The icon used to close the component. Defaults to `close`. 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`.
+
+**editIcon**  
+`Type: string | undefined`  
+The edit icon used to toggle between calendar and input. Defaults to `pencil`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+
+**endDate (Required)**  
+`Type: Date`  
+The end date value used to populate the component.
+
+**endLabel**  
+`Type: String | undefined`  
+The label used as the suffix to the ending date in the component. Defaults to `'To'`.
+
+**endYear**  
+`Type: number | undefined`  
+The end year when the component is rendered. Defaults to `2200`.
+
+**inputEnabled**  
+`Type: boolean | undefined`  
+Flag indicating if the component should be enabled or not. Defaults to `true`.
+
+**label**  
+`Type: String | undefined`  
+The label used as the header in the component. Defaults to `'Select date'`.
+
 **locale (Required)**  
 `Type: String`  
 A locale can be composed of both a base language, the country (territory) of use, and possibly codeset (which is usually assumed). For example, German is de.
@@ -66,37 +106,17 @@ A locale can be composed of both a base language, the country (territory) of use
 `Type: 'single' | 'multiple' | 'range'`  
 The selection type for the date picker. For this example it is `"range"`.
 
-**visible (Required)**  
-`Type: boolean`  
-Flag indicating if the component should be displayed.
-
-**onDismiss (Required)**  
+**onChange**  
 `Type: Function`  
-The action to take when the component is closed.
-
-**startDate (Required)**  
-`Type: Date`  
-The start date value used to populate the component.
-
-**endDate (Required)**  
-`Type: Date`  
-The end date value used to populate the component.
+Event handler when the component changes.
 
 **onConfirm (Required)**  
 `Type: Function`  
 The action to take when the date is selected.
 
-**validRange**  
-`Type: {
-  startDate: Date | undefined,
-  endDate: Date | undefined,
-  disabledDates: Date[] | undefined
-}`  
-Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
-
-**onChange**  
+**onDismiss (Required)**  
 `Type: Function`  
-Event handler when the component changes.
+The action to take when the component is closed.
 
 **saveLabel**  
 `Type: String | undefined`  
@@ -106,57 +126,37 @@ The label used confirm a date selection. Defaults to `'Save'`.
 `Type: boolean | undefined`  
 Flag indicating if the save label should be disabled and unable to receive events. Defaults to `false`.
 
-**uppercase**  
-`Type: boolean | undefined`  
-Flag indicating if the text in the component should be uppercase. Defaults to `true`.
-
-**label**  
-`Type: String | undefined`  
-The label used as the header in the component. Defaults to `'Select date'`.
+**startDate (Required)**  
+`Type: Date`  
+The start date value used to populate the component.
 
 **startLabel**  
 `Type: String | undefined`  
 The label used as the prefix to the starting date in the component. Defaults to `'From'`.
 
-**endLabel**  
-`Type: String | undefined`  
-The label used as the suffix to the ending date in the component. Defaults to `'To'`.
-
-**animationType**  
-`Type: String | undefined`  
-The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
+**startWeekOnMonday**  
+`Type: boolean | undefined`  
+Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
 
 **startYear**  
 `Type: number | undefined`  
 The start year when the component is rendered. Defaults to `1800`.
 
-**endYear**  
-`Type: number | undefined`  
-The end year when the component is rendered. Defaults to `2200`.
-
-**startWeekOnMonday**  
+**uppercase**  
 `Type: boolean | undefined`  
-Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
-
-**closeIcon**  
-`Type: string | undefined`  
-The icon used to close the component. Defaults to `close`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
-
-**editIcon**  
-`Type: string | undefined`  
-The edit icon used to toggle between calendar and input. Defaults to `pencil`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
-
-**calendarIcon**  
-`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/).
+Flag indicating if the text in the component should be uppercase. Defaults to `true`.
 
-**inputEnabled**  
-`Type: boolean | undefined`  
-Flag indicating if the component should be enabled or not. Defaults to `true`.
+**validRange**  
+`Type: {
+  startDate: Date | undefined,
+  endDate: Date | undefined,
+  disabledDates: Date[] | undefined
+}`  
+Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
 
-**disableStatusBarPadding**  
-`Type: boolean | undefined`  
-Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+**visible (Required)**  
+`Type: boolean`  
+Flag indicating if the component should be displayed.
 
 **presentationStyle**
 `Type: 'fullScreen' | 'pageSheet' | 'formSheet' | 'overFullScreen'`
diff --git a/docusaurus/docs/date-picker/single-date-picker.md b/docusaurus/docs/date-picker/single-date-picker.md
index b6482c9a..16c39035 100644
--- a/docusaurus/docs/date-picker/single-date-picker.md
+++ b/docusaurus/docs/date-picker/single-date-picker.md
@@ -57,6 +57,42 @@ View an interactive [Expo snack](https://snack.expo.dev/@fitzwabs/react-native-p
 
 ## Props
 
+**animationType**  
+`Type: String | undefined`  
+The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
+
+**calendarIcon**  
+`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/).
+
+**closeIcon**  
+`Type: string | undefined`  
+The icon used to close the component. Defaults to `close`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+
+**date (Required)**  
+`Type: Date`  
+The date value used to populate the component.
+
+**disableStatusBarPadding**  
+`Type: boolean | undefined`  
+Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+
+**editIcon**  
+`Type: string | undefined`  
+The edit icon used to toggle between calendar and input. Defaults to `pencil`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+
+**endYear**  
+`Type: number | undefined`  
+The end year when the component is rendered. Defaults to `2200`.
+
+**inputEnabled**  
+`Type: boolean | undefined`  
+Flag indicating if the component should be enabled or not. Defaults to `true`.
+
+**label**  
+`Type: String | undefined`  
+The label used as the header in the component. Defaults to `'Select date'`.
+
 **locale (Required)**  
 `Type: String`  
 A locale can be composed of both a base language, the country (territory) of use, and possibly codeset (which is usually assumed). For example, German is de.
@@ -65,33 +101,17 @@ A locale can be composed of both a base language, the country (territory) of use
 `Type: 'single' | 'multiple' | 'range'`  
 The selection type for the date picker. For this example it is `"single"`.
 
-**visible (Required)**  
-`Type: boolean`  
-Flag indicating if the component should be displayed.
-
-**onDismiss (Required)**  
+**onChange**  
 `Type: Function`  
-The action to take when the component is closed.
-
-**date (Required)**  
-`Type: Date`  
-The date value used to populate the component.
+Event handler when the component changes.
 
 **onConfirm (Required)**  
 `Type: Function`  
 The action to take when the date is selected.
 
-**validRange**  
-`Type: {
-  startDate: Date | undefined,
-  endDate: Date | undefined,
-  disabledDates: Date[] | undefined
-}`  
-Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
-
-**onChange**  
+**onDismiss (Required)**  
 `Type: Function`  
-Event handler when the component changes.
+The action to take when the component is closed.
 
 **saveLabel**  
 `Type: String | undefined`  
@@ -101,49 +121,29 @@ The label used confirm a date selection. Defaults to `'Save'`.
 `Type: boolean | undefined`  
 Flag indicating if the save label should be disabled and unable to receive events. Defaults to `false`.
 
-**uppercase**  
+**startWeekOnMonday**  
 `Type: boolean | undefined`  
-Flag indicating if the text in the component should be uppercase. Defaults to `true`.
-
-**label**  
-`Type: String | undefined`  
-The label used as the header in the component. Defaults to `'Select date'`.
-
-**animationType**  
-`Type: String | undefined`  
-The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
+Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
 
 **startYear**  
 `Type: number | undefined`  
 The start year when the component is rendered. Defaults to `1800`.
 
-**endYear**  
-`Type: number | undefined`  
-The end year when the component is rendered. Defaults to `2200`.
-
-**startWeekOnMonday**  
+**uppercase**  
 `Type: boolean | undefined`  
-Flag indicating if calendar grid sould show monday as the first column. Defaults to `false`.
-
-**closeIcon**  
-`Type: string | undefined`  
-The icon used to close the component. Defaults to `close`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
-
-**editIcon**  
-`Type: string | undefined`  
-The edit icon used to toggle between calendar and input. Defaults to `pencil`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
-
-**calendarIcon**  
-`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/).
+Flag indicating if the text in the component should be uppercase. Defaults to `true`.
 
-**inputEnabled**  
-`Type: boolean | undefined`  
-Flag indicating if the component should be enabled or not. Defaults to `true`.
+**validRange**  
+`Type: {
+  startDate: Date | undefined,
+  endDate: Date | undefined,
+  disabledDates: Date[] | undefined
+}`  
+Limits which dates the user can navigate to and where events can go. Dates outside of the valid range will be grayed-out.
 
-**disableStatusBarPadding**  
-`Type: boolean | undefined`  
-Flag indicating if the status bar padding should be enabled or not. Defaults to `false`.
+**visible (Required)**  
+`Type: boolean`  
+Flag indicating if the component should be displayed.
 
 **presentationStyle**
 `Type: `'overFullScreen' | 'pageSheet' | undefined`
diff --git a/docusaurus/docs/time-picker.md b/docusaurus/docs/time-picker.md
index 37bc8b51..f789993b 100644
--- a/docusaurus/docs/time-picker.md
+++ b/docusaurus/docs/time-picker.md
@@ -54,66 +54,66 @@ View an interactive [Expo snack](https://snack.expo.dev/@fitzwabs/react-native-p
 
 ## Props
 
-**locale (Required)**  
-`Type: String`  
-A locale can be composed of both a base language, the country (territory) of use, and possibly codeset (which is usually assumed). For example, German is de.
+**animationType**  
+`Type: String | undefined`  
+The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
 
-**visible (Required)**  
-`Type: boolean`  
-Flag indicating if the component should be displayed.
+**cancelLabel**  
+`Type: String | undefined`  
+The label that will close the component. Defaults to `'Cancel'`.
 
-**onDismiss (Required)**  
-`Type: Function`  
-The action to take when the component is closed.
+**clockIcon**  
+`Type: string | undefined`  
+The icon used to toggle between time picker and input. Defaults to `clock-outline`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
 
-**onConfirm (Required)**  
-`Type: Function`  
-The action to take when the date is selected.
+**confirmLabel**  
+`Type: String | undefined`  
+The label that will confirm the component selection. Defaults to `'Ok'`.
+
+**defaultInputType**
+`Type: 'picker' | 'keyboard'`
+Which input type to use by default. Defaults to the clock-face picker.
 
 **hours**  
 `Type: number | undefined`  
 The hours values used to populate the component. Defaults to the current hour.
 
-**minutes**  
-`Type: number | undefined`  
-The minutes values used to populate the component. Defaults to the current minutes.
+**inputFontSize**
+`Type: number | undefined`
+Font size of the time input. Defaults to 57. Useful when using a custom font.
+
+**keyboardIcon**  
+`Type: string | undefined`  
+The icon used to toggle between the OS input. Defaults to `keyboard-outline`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
 
 **label**  
 `Type: String | undefined`  
 The label used as the header in the component. Defaults to `'Select time'`.
 
-**uppercase**  
-`Type: boolean | undefined`  
-Flag indicating if the text in the component should be uppercase. Defaults to `true`.
-
-**cancelLabel**  
-`Type: String | undefined`  
-The label that will close the component. Defaults to `'Cancel'`.
+**locale (Required)**  
+`Type: String`  
+A locale can be composed of both a base language, the country (territory) of use, and possibly codeset (which is usually assumed). For example, German is de.
 
-**confirmLabel**  
-`Type: String | undefined`  
-The label that will confirm the component selection. Defaults to `'Ok'`.
+**minutes**  
+`Type: number | undefined`  
+The minutes values used to populate the component. Defaults to the current minutes.
 
-**animationType**  
-`Type: String | undefined`  
-The animation used when opening the component. Defaults to `'slide'` on ios/android and `'none'` on web.
+**onConfirm (Required)**  
+`Type: Function`  
+The action to take when the date is selected.
 
-**keyboardIcon**  
-`Type: string | undefined`  
-The icon used to toggle between the OS input. Defaults to `keyboard-outline`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+**onDismiss (Required)**  
+`Type: Function`  
+The action to take when the component is closed.
 
-**clockIcon**  
-`Type: string | undefined`  
-The icon used to toggle between time picker and input. Defaults to `clock-outline`. You can pass the name of an icon from [MaterialCommunityIcons](https://materialdesignicons.com/).
+**uppercase**  
+`Type: boolean | undefined`  
+Flag indicating if the text in the component should be uppercase. Defaults to `true`.
 
 **use24HourClock**
 `Type: boolean | undefined`
 Flag indicating if the time input should use the 24 hours clock. Defaults to the system clock.
 
-**inputFontSize**
-`Type: number | undefined`
-Font size of the time input. Defaults to 57. Useful when using a custom font.
-
-**defaultInputType**
-`Type: 'picker' | 'keyboard'`
-Which input type to use by default. Defaults to the clock-face picker.
+**visible (Required)**  
+`Type: boolean`  
+Flag indicating if the component should be displayed.
diff --git a/src/Date/DatePickerInput.shared.tsx b/src/Date/DatePickerInput.shared.tsx
index eefb7e84..890ab2d5 100644
--- a/src/Date/DatePickerInput.shared.tsx
+++ b/src/Date/DatePickerInput.shared.tsx
@@ -14,6 +14,7 @@ export type DatePickerInputProps = {
   hasError?: boolean
   onValidationError?: ((error: string | null) => void) | undefined
   calendarIcon?: string
+  disableCalendarIcon?: boolean
   iconSize?: number
   iconStyle?: CSSProperties
   iconColor?: string
diff --git a/src/Date/DatePickerInput.tsx b/src/Date/DatePickerInput.tsx
index 1a781144..a9cefe6c 100644
--- a/src/Date/DatePickerInput.tsx
+++ b/src/Date/DatePickerInput.tsx
@@ -11,6 +11,7 @@ function DatePickerInput(
   {
     withModal = true,
     calendarIcon = 'calendar',
+    disableCalendarIcon = false,
     animationType = Platform.select({ web: 'none', default: 'slide' }),
     presentationStyle = 'overFullScreen',
     ...rest
@@ -44,7 +45,7 @@ function DatePickerInput(
             icon={calendarIcon}
             color={rest.iconColor ?? undefined}
             forceTextInputFocus={false}
-            disabled={rest.disabled}
+            disabled={rest.disabled || disableCalendarIcon}
             onPress={() => setVisible(true)}
             style={rest.iconStyle as StyleProp<ViewStyle>}
             testID={`${rest.testID || 'date-picker'}-icon-button`}
diff --git a/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap b/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap
index ef3df8c2..8282d073 100644
--- a/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap
+++ b/src/__tests__/Date/__snapshots__/CalendarEdit.test.tsx.snap
@@ -265,7 +265,7 @@ exports[`renders CalendarEdit 1`] = `
             }
             testID="text-input-flat"
             underlineColorAndroid="transparent"
-            value="06/06/2025"
+            value="06/08/2025"
             withModal={false}
           />
         </View>
diff --git a/src/__tests__/Date/__snapshots__/DatePickerInput.test.tsx.snap b/src/__tests__/Date/__snapshots__/DatePickerInput.test.tsx.snap
index 496dad89..09a4bd1c 100644
--- a/src/__tests__/Date/__snapshots__/DatePickerInput.test.tsx.snap
+++ b/src/__tests__/Date/__snapshots__/DatePickerInput.test.tsx.snap
@@ -258,7 +258,7 @@ exports[`renders DatePickerInput 1`] = `
             }
             testID="text-input-flat"
             underlineColorAndroid="transparent"
-            value="06/06/2025"
+            value="06/08/2025"
           />
         </View>
         <View
diff --git a/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap b/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap
index 6dc64347..d9d24ce3 100644
--- a/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap
+++ b/src/__tests__/Date/__snapshots__/DatePickerInputWithoutModal.test.tsx.snap
@@ -256,7 +256,7 @@ exports[`renders DatePickerInputWithoutModal 1`] = `
           }
           testID="text-input-flat"
           underlineColorAndroid="transparent"
-          value="06/06/2025"
+          value="06/08/2025"
         />
       </View>
     </View>