calendar-2k 1.0.19 → 1.0.20
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.
- package/README.md +13 -13
- package/build/Calendar2k.types.d.ts +1 -1
- package/build/Calendar2kView.js +15 -15
- package/package.json +3 -2
- package/src/Calendar2k.types.ts +1 -1
- package/src/Calendar2kView.tsx +21 -19
package/README.md
CHANGED
|
@@ -139,19 +139,19 @@ export default function App() {
|
|
|
139
139
|
|
|
140
140
|
## Props
|
|
141
141
|
|
|
142
|
-
| Prop | Type
|
|
143
|
-
| --------------- |
|
|
144
|
-
| `onChangeDate` | `(value: DateValueType) => void`
|
|
145
|
-
| `value` | `DateValueType`
|
|
146
|
-
| `locales` | `Intl.LocalesArgument`
|
|
147
|
-
| `mode` | `"date" \| "time" \| "datetime"`
|
|
148
|
-
| `color` | `string`
|
|
149
|
-
| `min` | `Date`
|
|
150
|
-
| `max` | `Date`
|
|
151
|
-
| `disableDate` | `(date: Date) => boolean`
|
|
152
|
-
| `placeholder` | `string`
|
|
153
|
-
| `customTrigger` | `React.ReactNode`
|
|
154
|
-
| `disabled` | `boolean`
|
|
142
|
+
| Prop | Type | Required | Description |
|
|
143
|
+
| --------------- | ------------------------------------------- | -------- | --------------------------------------------------------------------------------------------------------- |
|
|
144
|
+
| `onChangeDate` | `(value: DateValueType) => void` | ❌ | Callback fired when the user selects a date or range |
|
|
145
|
+
| `value` | `DateValueType` | ❌ | Current selected value — a `Date` or `{ start: Date, end: Date }` object |
|
|
146
|
+
| `locales` | `Intl.LocalesArgument` | ❌ | Locale for displaying month/day names and time format (e.g. `"fr"`, `"en-US"`). Defaults to device locale |
|
|
147
|
+
| `mode` | `"date" \| "time" \| "datetime"` | ❌ | Picker mode |
|
|
148
|
+
| `color` | `string` | ❌ | Accent color for the picker UI (any valid CSS/RN color) |
|
|
149
|
+
| `min` | `Date` | ❌ | Earliest selectable date — all dates before this are automatically disabled |
|
|
150
|
+
| `max` | `Date` | ❌ | Latest selectable date — all dates after this are automatically disabled |
|
|
151
|
+
| `disableDate` | `(date: Date) => boolean` | ❌ | Function to disable specific dates — return `true` to disable |
|
|
152
|
+
| `placeholder` | `string` | ❌ | Text shown in the trigger button when no date is selected yet |
|
|
153
|
+
| `customTrigger` | `(onToggle: () => void) => React.ReactNode` | ❌ | Custom element to replace the default trigger button |
|
|
154
|
+
| `disabled` | `boolean` | ❌ | Disables the entire picker — the trigger becomes non-interactive |
|
|
155
155
|
|
|
156
156
|
---
|
|
157
157
|
|
|
@@ -15,7 +15,7 @@ export type Calendar2kViewProps = {
|
|
|
15
15
|
max?: Date;
|
|
16
16
|
disableDate?: (date: Date) => boolean;
|
|
17
17
|
placeholder?: string;
|
|
18
|
-
customTrigger?: React.ReactNode;
|
|
18
|
+
customTrigger?: (onToggle: () => void) => React.ReactNode;
|
|
19
19
|
disabled?: boolean;
|
|
20
20
|
};
|
|
21
21
|
export type DayColumnProps = {
|
package/build/Calendar2kView.js
CHANGED
|
@@ -243,25 +243,25 @@ function Calendar2kView(_a) {
|
|
|
243
243
|
</ui_1.KView>);
|
|
244
244
|
}
|
|
245
245
|
return (<>
|
|
246
|
-
<react_native_1.Pressable onPress={onToggle} disabled={disabled} style={{
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
246
|
+
{customTrigger ? (customTrigger(onToggle)) : (<react_native_1.Pressable onPress={onToggle} disabled={disabled} style={{
|
|
247
|
+
width: "100%",
|
|
248
|
+
borderWidth: 1,
|
|
249
|
+
borderColor: "#0003",
|
|
250
|
+
paddingHorizontal: 16,
|
|
251
|
+
paddingVertical: 10,
|
|
252
|
+
borderRadius: 8,
|
|
253
|
+
backgroundColor: "white",
|
|
254
|
+
flexDirection: "row",
|
|
255
|
+
gap: 10,
|
|
256
|
+
alignItems: "center",
|
|
257
|
+
}}>
|
|
258
|
+
<>
|
|
259
259
|
<Icon_1.default mode={mode}/>
|
|
260
260
|
<ui_1.KText fontSize={16} color={value ? undefined : "#0007"}>
|
|
261
261
|
{datetimeOuput}
|
|
262
262
|
</ui_1.KText>
|
|
263
|
-
</>
|
|
264
|
-
|
|
263
|
+
</>
|
|
264
|
+
</react_native_1.Pressable>)}
|
|
265
265
|
<react_native_1.Modal animationType="slide" visible={isOpen} transparent onRequestClose={onToggle}>
|
|
266
266
|
<ui_1.KView flex={1} justifyContent="flex-end">
|
|
267
267
|
{isOpen && <Backdrop_1.default onPress={onToggle}/>}
|
package/package.json
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "calendar-2k",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.20",
|
|
4
4
|
"description": "The fastest fully customizable Expo date & time picker, written in TypeScript, supporting Expo Go, single date, time, date range, time range, datetime range selection, flexible date disabling, and dynamic color theming for iOS and Android.",
|
|
5
5
|
"main": "build/Calendar2kView.js",
|
|
6
6
|
"types": "build/Calendar2k.types.d.ts",
|
|
7
7
|
"scripts": {
|
|
8
|
-
"build": "tsc && cp -r src/assets build/assets"
|
|
8
|
+
"build": "tsc && cp -r src/assets build/assets",
|
|
9
|
+
"release": "npm run build && npm version patch && npm publish"
|
|
9
10
|
},
|
|
10
11
|
"exports": {
|
|
11
12
|
".": {
|
package/src/Calendar2k.types.ts
CHANGED
package/src/Calendar2kView.tsx
CHANGED
|
@@ -198,31 +198,33 @@ export default function Calendar2kView({
|
|
|
198
198
|
|
|
199
199
|
return (
|
|
200
200
|
<>
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
201
|
+
{customTrigger ? (
|
|
202
|
+
customTrigger(onToggle)
|
|
203
|
+
) : (
|
|
204
|
+
<Pressable
|
|
205
|
+
onPress={onToggle}
|
|
206
|
+
disabled={disabled}
|
|
207
|
+
style={{
|
|
208
|
+
width: "100%",
|
|
209
|
+
borderWidth: 1,
|
|
210
|
+
borderColor: "#0003",
|
|
211
|
+
paddingHorizontal: 16,
|
|
212
|
+
paddingVertical: 10,
|
|
213
|
+
borderRadius: 8,
|
|
214
|
+
backgroundColor: "white",
|
|
215
|
+
flexDirection: "row",
|
|
216
|
+
gap: 10,
|
|
217
|
+
alignItems: "center",
|
|
218
|
+
}}
|
|
219
|
+
>
|
|
218
220
|
<>
|
|
219
221
|
<Icon mode={mode} />
|
|
220
222
|
<KText fontSize={16} color={value ? undefined : "#0007"}>
|
|
221
223
|
{datetimeOuput}
|
|
222
224
|
</KText>
|
|
223
225
|
</>
|
|
224
|
-
|
|
225
|
-
|
|
226
|
+
</Pressable>
|
|
227
|
+
)}
|
|
226
228
|
<Modal
|
|
227
229
|
animationType="slide"
|
|
228
230
|
visible={isOpen}
|