@kalyx/react 0.2.2 → 0.4.0

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 (8) hide show
  1. package/CHANGELOG.md +45 -0
  2. package/dist/index.cjs +330 -268
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.cts +42 -5
  5. package/dist/index.d.ts +42 -5
  6. package/dist/index.js +331 -269
  7. package/dist/index.js.map +1 -1
  8. package/package.json +12 -4
package/dist/index.d.cts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as react from 'react';
2
2
  import { ReactNode, HTMLAttributes, InputHTMLAttributes, ButtonHTMLAttributes } from 'react';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
- import { ISODateString, DisabledRule, WeekStartsOn, DateAdapter, DateRange, CalendarGrid, TimeValue } from '@kalyx/core';
4
+ import { ISODateString, DisabledRule, WeekStartsOn, DateAdapter, DatePickerLabels, DateRange, RangePickerLabels, TimePickerLabels, DateTimePickerLabels, CalendarGrid, TimeValue } from '@kalyx/core';
5
5
  export { CalendarDay, DateAdapter, DateFnsAdapter, DateRange, DisabledRule, ISODateString, TimeValue } from '@kalyx/core';
6
6
 
7
7
  /**
@@ -41,12 +41,20 @@ interface DatePickerRootProps {
41
41
  displayFormat?: string;
42
42
  /** BCP 47 locale (e.g., "en-US", "ko-KR", "ja-JP") */
43
43
  locale?: string;
44
+ /**
45
+ * IANA timezone used for display and selection semantics (e.g., "Asia/Seoul").
46
+ * When set, the Input formats the value in this zone, Calendar highlights the matching civil
47
+ * day, and selecting a date emits the civil midnight of that day (UTC-ISO form).
48
+ */
49
+ displayTimezone?: string;
44
50
  /** Date adapter */
45
51
  adapter?: DateAdapter;
52
+ /** Override ARIA labels (defaults to English) */
53
+ labels?: Partial<DatePickerLabels>;
46
54
  /** Child components */
47
55
  children: ReactNode;
48
56
  }
49
- declare function DatePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, adapter, children, }: DatePickerRootProps): react_jsx_runtime.JSX.Element;
57
+ declare function DatePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, displayTimezone, adapter, labels: labelsProp, children, }: DatePickerRootProps): react_jsx_runtime.JSX.Element;
50
58
 
51
59
  interface DatePickerPopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
52
60
  children?: ReactNode;
@@ -211,12 +219,20 @@ interface RangePickerRootProps {
211
219
  displayFormat?: string;
212
220
  /** BCP 47 locale */
213
221
  locale?: string;
222
+ /**
223
+ * IANA timezone for display (e.g., "Asia/Seoul"). When set, inputs format in this zone,
224
+ * calendar highlighting uses civil-day comparison in this zone, and selected start/end are
225
+ * emitted as civil midnight of the clicked day in this zone (UTC-ISO form).
226
+ */
227
+ displayTimezone?: string;
214
228
  /** Date adapter */
215
229
  adapter?: DateAdapter;
230
+ /** Override ARIA labels (defaults to English) */
231
+ labels?: Partial<RangePickerLabels>;
216
232
  /** Child components */
217
233
  children: ReactNode;
218
234
  }
219
- declare function RangePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, adapter, children, }: RangePickerRootProps): react_jsx_runtime.JSX.Element;
235
+ declare function RangePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, displayTimezone, adapter, labels: labelsProp, children, }: RangePickerRootProps): react_jsx_runtime.JSX.Element;
220
236
 
221
237
  interface RangePickerPopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
222
238
  children?: ReactNode;
@@ -367,14 +383,21 @@ interface TimePickerRootProps {
367
383
  step?: number;
368
384
  /** Whether to display seconds */
369
385
  withSeconds?: boolean;
386
+ /**
387
+ * IANA timezone used to interpret time. When set, the hour/minute controls read and write
388
+ * the time as observed in this zone.
389
+ */
390
+ displayTimezone?: string;
370
391
  /** Whether entire picker is disabled */
371
392
  disabled?: boolean;
372
393
  /** Read-only */
373
394
  readOnly?: boolean;
395
+ /** Override ARIA labels (defaults to English) */
396
+ labels?: Partial<TimePickerLabels>;
374
397
  /** Child components */
375
398
  children: ReactNode;
376
399
  }
377
- declare function TimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, withSeconds, disabled, readOnly, children, }: TimePickerRootProps): react_jsx_runtime.JSX.Element;
400
+ declare function TimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, withSeconds, displayTimezone, disabled, readOnly, labels: labelsProp, children, }: TimePickerRootProps): react_jsx_runtime.JSX.Element;
378
401
 
379
402
  interface TimePickerHourListClassNames {
380
403
  root?: string;
@@ -483,8 +506,16 @@ interface DateTimePickerRootProps {
483
506
  displayFormat?: string;
484
507
  /** BCP 47 locale */
485
508
  locale?: string;
509
+ /**
510
+ * IANA timezone used for display (e.g., "Asia/Seoul"). When set, Calendar highlights match
511
+ * civil days in this zone, TimePicker reads/writes the time in this zone, and the Input
512
+ * formats the combined date+time in this zone.
513
+ */
514
+ displayTimezone?: string;
486
515
  /** Date adapter */
487
516
  adapter?: DateAdapter;
517
+ /** Override ARIA labels (defaults to English) */
518
+ labels?: Partial<DateTimePickerLabels>;
488
519
  /** Child components */
489
520
  children: ReactNode;
490
521
  }
@@ -500,7 +531,7 @@ interface DateTimePickerRootProps {
500
531
  * - Changing time in TimePicker -> changes only the time, preserves the date
501
532
  * - Escape / outside click -> close the popover (commit)
502
533
  */
503
- declare function DateTimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, disabled, readOnly, weekStartsOn, displayFormat, locale, adapter, children, }: DateTimePickerRootProps): react_jsx_runtime.JSX.Element;
534
+ declare function DateTimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, disabled, readOnly, weekStartsOn, displayFormat, locale, displayTimezone, adapter, labels: labelsProp, children, }: DateTimePickerRootProps): react_jsx_runtime.JSX.Element;
504
535
 
505
536
  interface DateTimePickerInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'type'> {
506
537
  }
@@ -561,6 +592,8 @@ interface UseDatePickerOptions {
561
592
  weekStartsOn?: WeekStartsOn;
562
593
  /** Date adapter */
563
594
  adapter?: DateAdapter;
595
+ /** IANA timezone for display (see DatePickerRoot#displayTimezone) */
596
+ displayTimezone?: string;
564
597
  }
565
598
  interface UseDatePickerReturn {
566
599
  /** Currently selected date (ISO string) */
@@ -626,6 +659,8 @@ interface UseRangePickerOptions {
626
659
  weekStartsOn?: WeekStartsOn;
627
660
  /** Date adapter */
628
661
  adapter?: DateAdapter;
662
+ /** IANA timezone for display (see RangePickerRoot#displayTimezone) */
663
+ displayTimezone?: string;
629
664
  }
630
665
  interface UseRangePickerReturn {
631
666
  /** Currently selected range */
@@ -691,6 +726,8 @@ interface UseTimePickerOptions {
691
726
  step?: number;
692
727
  /** Whether seconds are shown */
693
728
  withSeconds?: boolean;
729
+ /** IANA timezone for time interpretation (see TimePickerRoot#displayTimezone) */
730
+ displayTimezone?: string;
694
731
  }
695
732
  interface UseTimePickerReturn {
696
733
  /** Current ISO datetime value */
package/dist/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as react from 'react';
2
2
  import { ReactNode, HTMLAttributes, InputHTMLAttributes, ButtonHTMLAttributes } from 'react';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
- import { ISODateString, DisabledRule, WeekStartsOn, DateAdapter, DateRange, CalendarGrid, TimeValue } from '@kalyx/core';
4
+ import { ISODateString, DisabledRule, WeekStartsOn, DateAdapter, DatePickerLabels, DateRange, RangePickerLabels, TimePickerLabels, DateTimePickerLabels, CalendarGrid, TimeValue } from '@kalyx/core';
5
5
  export { CalendarDay, DateAdapter, DateFnsAdapter, DateRange, DisabledRule, ISODateString, TimeValue } from '@kalyx/core';
6
6
 
7
7
  /**
@@ -41,12 +41,20 @@ interface DatePickerRootProps {
41
41
  displayFormat?: string;
42
42
  /** BCP 47 locale (e.g., "en-US", "ko-KR", "ja-JP") */
43
43
  locale?: string;
44
+ /**
45
+ * IANA timezone used for display and selection semantics (e.g., "Asia/Seoul").
46
+ * When set, the Input formats the value in this zone, Calendar highlights the matching civil
47
+ * day, and selecting a date emits the civil midnight of that day (UTC-ISO form).
48
+ */
49
+ displayTimezone?: string;
44
50
  /** Date adapter */
45
51
  adapter?: DateAdapter;
52
+ /** Override ARIA labels (defaults to English) */
53
+ labels?: Partial<DatePickerLabels>;
46
54
  /** Child components */
47
55
  children: ReactNode;
48
56
  }
49
- declare function DatePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, adapter, children, }: DatePickerRootProps): react_jsx_runtime.JSX.Element;
57
+ declare function DatePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, displayTimezone, adapter, labels: labelsProp, children, }: DatePickerRootProps): react_jsx_runtime.JSX.Element;
50
58
 
51
59
  interface DatePickerPopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
52
60
  children?: ReactNode;
@@ -211,12 +219,20 @@ interface RangePickerRootProps {
211
219
  displayFormat?: string;
212
220
  /** BCP 47 locale */
213
221
  locale?: string;
222
+ /**
223
+ * IANA timezone for display (e.g., "Asia/Seoul"). When set, inputs format in this zone,
224
+ * calendar highlighting uses civil-day comparison in this zone, and selected start/end are
225
+ * emitted as civil midnight of the clicked day in this zone (UTC-ISO form).
226
+ */
227
+ displayTimezone?: string;
214
228
  /** Date adapter */
215
229
  adapter?: DateAdapter;
230
+ /** Override ARIA labels (defaults to English) */
231
+ labels?: Partial<RangePickerLabels>;
216
232
  /** Child components */
217
233
  children: ReactNode;
218
234
  }
219
- declare function RangePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, adapter, children, }: RangePickerRootProps): react_jsx_runtime.JSX.Element;
235
+ declare function RangePickerRoot({ value: controlledValue, defaultValue, onChange, disabled, readOnly, weekStartsOn, displayFormat, locale, displayTimezone, adapter, labels: labelsProp, children, }: RangePickerRootProps): react_jsx_runtime.JSX.Element;
220
236
 
221
237
  interface RangePickerPopoverProps extends Omit<HTMLAttributes<HTMLDivElement>, 'role'> {
222
238
  children?: ReactNode;
@@ -367,14 +383,21 @@ interface TimePickerRootProps {
367
383
  step?: number;
368
384
  /** Whether to display seconds */
369
385
  withSeconds?: boolean;
386
+ /**
387
+ * IANA timezone used to interpret time. When set, the hour/minute controls read and write
388
+ * the time as observed in this zone.
389
+ */
390
+ displayTimezone?: string;
370
391
  /** Whether entire picker is disabled */
371
392
  disabled?: boolean;
372
393
  /** Read-only */
373
394
  readOnly?: boolean;
395
+ /** Override ARIA labels (defaults to English) */
396
+ labels?: Partial<TimePickerLabels>;
374
397
  /** Child components */
375
398
  children: ReactNode;
376
399
  }
377
- declare function TimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, withSeconds, disabled, readOnly, children, }: TimePickerRootProps): react_jsx_runtime.JSX.Element;
400
+ declare function TimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, withSeconds, displayTimezone, disabled, readOnly, labels: labelsProp, children, }: TimePickerRootProps): react_jsx_runtime.JSX.Element;
378
401
 
379
402
  interface TimePickerHourListClassNames {
380
403
  root?: string;
@@ -483,8 +506,16 @@ interface DateTimePickerRootProps {
483
506
  displayFormat?: string;
484
507
  /** BCP 47 locale */
485
508
  locale?: string;
509
+ /**
510
+ * IANA timezone used for display (e.g., "Asia/Seoul"). When set, Calendar highlights match
511
+ * civil days in this zone, TimePicker reads/writes the time in this zone, and the Input
512
+ * formats the combined date+time in this zone.
513
+ */
514
+ displayTimezone?: string;
486
515
  /** Date adapter */
487
516
  adapter?: DateAdapter;
517
+ /** Override ARIA labels (defaults to English) */
518
+ labels?: Partial<DateTimePickerLabels>;
488
519
  /** Child components */
489
520
  children: ReactNode;
490
521
  }
@@ -500,7 +531,7 @@ interface DateTimePickerRootProps {
500
531
  * - Changing time in TimePicker -> changes only the time, preserves the date
501
532
  * - Escape / outside click -> close the popover (commit)
502
533
  */
503
- declare function DateTimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, disabled, readOnly, weekStartsOn, displayFormat, locale, adapter, children, }: DateTimePickerRootProps): react_jsx_runtime.JSX.Element;
534
+ declare function DateTimePickerRoot({ value: controlledValue, defaultValue, onChange, format, step, disabled, readOnly, weekStartsOn, displayFormat, locale, displayTimezone, adapter, labels: labelsProp, children, }: DateTimePickerRootProps): react_jsx_runtime.JSX.Element;
504
535
 
505
536
  interface DateTimePickerInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'type'> {
506
537
  }
@@ -561,6 +592,8 @@ interface UseDatePickerOptions {
561
592
  weekStartsOn?: WeekStartsOn;
562
593
  /** Date adapter */
563
594
  adapter?: DateAdapter;
595
+ /** IANA timezone for display (see DatePickerRoot#displayTimezone) */
596
+ displayTimezone?: string;
564
597
  }
565
598
  interface UseDatePickerReturn {
566
599
  /** Currently selected date (ISO string) */
@@ -626,6 +659,8 @@ interface UseRangePickerOptions {
626
659
  weekStartsOn?: WeekStartsOn;
627
660
  /** Date adapter */
628
661
  adapter?: DateAdapter;
662
+ /** IANA timezone for display (see RangePickerRoot#displayTimezone) */
663
+ displayTimezone?: string;
629
664
  }
630
665
  interface UseRangePickerReturn {
631
666
  /** Currently selected range */
@@ -691,6 +726,8 @@ interface UseTimePickerOptions {
691
726
  step?: number;
692
727
  /** Whether seconds are shown */
693
728
  withSeconds?: boolean;
729
+ /** IANA timezone for time interpretation (see TimePickerRoot#displayTimezone) */
730
+ displayTimezone?: string;
694
731
  }
695
732
  interface UseTimePickerReturn {
696
733
  /** Current ISO datetime value */