@startupjs-ui/date-time-picker 0.1.13 → 0.1.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/README.mdx +11 -5
  3. package/components/Calendar/Header/index.tsx +1 -1
  4. package/package.json +13 -13
package/CHANGELOG.md CHANGED
@@ -3,6 +3,22 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [0.1.19](https://github.com/startupjs/startupjs-ui/compare/v0.1.18...v0.1.19) (2026-03-17)
7
+
8
+ **Note:** Version bump only for package @startupjs-ui/date-time-picker
9
+
10
+
11
+
12
+
13
+
14
+ ## [0.1.16](https://github.com/startupjs/startupjs-ui/compare/v0.1.15...v0.1.16) (2026-02-10)
15
+
16
+ **Note:** Version bump only for package @startupjs-ui/date-time-picker
17
+
18
+
19
+
20
+
21
+
6
22
  ## [0.1.13](https://github.com/startupjs/startupjs-ui/compare/v0.1.12...v0.1.13) (2026-02-03)
7
23
 
8
24
  **Note:** Version bump only for package @startupjs-ui/date-time-picker
package/README.mdx CHANGED
@@ -5,7 +5,13 @@ import { Sandbox } from '@startupjs-ui/docs'
5
5
 
6
6
  # DateTimePicker
7
7
 
8
- DateTimePicker allows to display and change the date and time.
8
+ DateTimePicker allows the user to display and select a date and time. It renders a text input that opens a picker when tapped.
9
+
10
+ Use the `date` prop to set the current value as a timestamp and the `onChangeDate` callback to receive the selected timestamp. The picker supports several modes via the `mode` prop: `'date'`, `'time'`, `'datetime'` (default), or `'countdown'`.
11
+
12
+ Additional props include `style` for custom root styles, `contentStyle` for the picker content container, `size` (`'s'`, `'m'`, `'l'`, defaults to `'m'`) for the input size, `display` for the native picker display mode (defaults to `'spinner'`), `dateFormat` for custom date formatting (using moment format strings), `locale` for localization (falls back to the device locale), and `timezone` for specifying an IANA timezone (defaults to auto-detected).
13
+
14
+ You can constrain the selectable range with `minDate` and `maxDate` (both timestamps), disable specific days with `disabledDays`, set a date range highlight with `range`, control the time step with `timeInterval` (defaults to `5` minutes), and force 24-hour format with `is24Hour`. The component also supports `disabled`, `readonly`, `placeholder`, `renderInput` for a custom input renderer, `ref` for imperative access, and `testID`/`calendarTestID` for testing.
9
15
 
10
16
  ```jsx
11
17
  import { DateTimePicker } from 'startupjs-ui'
@@ -26,9 +32,9 @@ return (
26
32
 
27
33
  ## Managing visibility
28
34
 
29
- There are three options for managing visiblity of a `DateTimePicker`:
35
+ There are three ways to manage the visibility of a DateTimePicker:
30
36
 
31
- 1. By passing the scoped model to the `$visible` property from the state of which visibility is controlled.
37
+ 1. **Scoped model** -- pass a scoped model to the `$visible` prop, which automatically controls the picker's open/close state.
32
38
 
33
39
  ```jsx example
34
40
  const $visible = $()
@@ -43,7 +49,7 @@ return (
43
49
  )
44
50
  ```
45
51
 
46
- 2. By passing the `visible`, `onRequestOpen` and `onRequestClose` properties that determines whether `DateTimePicker` is visible.
52
+ 2. **Controlled** -- pass the `visible`, `onRequestOpen`, and `onRequestClose` props to manually control when the picker opens and closes.
47
53
 
48
54
  ```jsx example
49
55
  const $visible = $()
@@ -61,7 +67,7 @@ return (
61
67
  )
62
68
  ```
63
69
 
64
- 3. Uncontrolled.
70
+ 3. **Uncontrolled** -- if neither `$visible` nor `visible` is provided, the component manages its own visibility internally.
65
71
 
66
72
  ```jsx example
67
73
  const [date, setDate] = useState()
package/components/Calendar/Header/index.tsx CHANGED
@@ -108,7 +108,7 @@ const Years = observer(function YearsComponent ({
108
108
  const years = useMemo(() => {
109
109
  return new Array(yearsDiff + 1).fill(minYear).map((year, index) => {
110
110
  return year + index
111
- })
111
+ }).reverse()
112
112
  }, [yearsDiff, minYear])
113
113
 
114
114
  const getItemLayout = useCallback((data: any, index: number) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@startupjs-ui/date-time-picker",
3
- "version": "0.1.13",
3
+ "version": "0.1.19",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -10,17 +10,17 @@
10
10
  "dependencies": {
11
11
  "@fortawesome/free-solid-svg-icons": "^7.1.0",
12
12
  "@react-native-community/datetimepicker": "^8.4.4",
13
- "@startupjs-ui/abstract-popover": "^0.1.11",
14
- "@startupjs-ui/button": "^0.1.13",
15
- "@startupjs-ui/core": "^0.1.11",
16
- "@startupjs-ui/div": "^0.1.13",
17
- "@startupjs-ui/divider": "^0.1.11",
18
- "@startupjs-ui/drawer": "^0.1.11",
19
- "@startupjs-ui/flat-list": "^0.1.11",
20
- "@startupjs-ui/icon": "^0.1.13",
21
- "@startupjs-ui/popover": "^0.1.13",
22
- "@startupjs-ui/span": "^0.1.13",
23
- "@startupjs-ui/text-input": "^0.1.13",
13
+ "@startupjs-ui/abstract-popover": "^0.1.19",
14
+ "@startupjs-ui/button": "^0.1.19",
15
+ "@startupjs-ui/core": "^0.1.19",
16
+ "@startupjs-ui/div": "^0.1.19",
17
+ "@startupjs-ui/divider": "^0.1.19",
18
+ "@startupjs-ui/drawer": "^0.1.19",
19
+ "@startupjs-ui/flat-list": "^0.1.19",
20
+ "@startupjs-ui/icon": "^0.1.19",
21
+ "@startupjs-ui/popover": "^0.1.19",
22
+ "@startupjs-ui/span": "^0.1.19",
23
+ "@startupjs-ui/text-input": "^0.1.19",
24
24
  "moment-timezone": "^0.5.31",
25
25
  "react-native-safe-area-context": "^5.6.0"
26
26
  },
@@ -29,5 +29,5 @@
29
29
  "react-native": "*",
30
30
  "startupjs": "*"
31
31
  },
32
- "gitHead": "5cfdccf2bdae3873e968289a3e6b938fad02101a"
32
+ "gitHead": "bfcca786dc363f42a09b6eef4feb7ca8139302fc"
33
33
  }