@nxgt/material 3.38.0 → 3.41.0

package/dist/lib/components/ui/dates/date-range-field/date-range-field.types.d.ts

@@ -70,5 +70,5 @@ export type DateRangeFieldProps = {
     surface?: 'auto' | 'popover' | 'sheet';
     /** Called as the calendar opens and closes (a half-picked range is final once it closes). */
     onOpenChange?: (open: boolean) => void;
-} & Omit<CalendarProps, 'mode' | 'label' | 'onSelect' | 'disabled'>;
+} & Omit<CalendarProps, 'mode' | 'label' | 'onSelect' | 'disabled' | 'timeZone'>;
 export {};

package/dist/lib/components/ui/dates/picker-popover/hero-text.d.ts

@@ -7,6 +7,7 @@ import { DateRange } from '../calendar/calendar.js';
 export declare function heroDate(date: Date | undefined, code: string, empty: string, options?: {
     withTime?: boolean;
     today?: Date;
+    floating?: boolean;
 }): string;
 /** A range as "Oct 12 – Oct 16" ("Oct 12 – …" while the end is missing); `empty` with no start. */
 export declare function heroRange(range: DateRange | undefined, code: string, empty: string, options?: {

package/dist/lib/components/ui/dates/picker-trigger/floating-clock.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The zone a date or time field edits in, when it does: its parts then hold
+ * floating dates (the wall clock, read through UTC getters, `@/lib/zoned-floating`)
+ * instead of machine-local ones. `undefined` outside a zoned field.
+ */
+export declare const FloatingClockContext: import('react').Context<string | undefined>;
+export declare const useFloatingZone: () => string | undefined;

package/dist/lib/components/ui/dates/picker-trigger/typed-day.d.ts

@@ -24,3 +24,11 @@ export declare function acceptsDay(date: Date, bounds: TypedBounds): boolean;
  * was given, the calendar keeps the day unpickable, and the form refuses it.
  */
 export declare function settleDay(date: Date, bounds: TypedBounds): Date | undefined;
+/**
+ * The bounds of a zoned field's typed day: floating `minDate` / `maxDate`
+ * compared by day, and the day rule against the day as react-day-picker
+ * reads it (a local `Date` at noon).
+ */
+export declare function acceptsFloatingDay(date: Date, bounds: TypedBounds): boolean;
+/** `settleDay` for a zoned field's floating day. */
+export declare function settleFloatingDay(date: Date, bounds: TypedBounds): Date | undefined;

package/dist/lib/components/ui/dates/picker-trigger/use-zoned-date-props.d.ts

@@ -0,0 +1,38 @@
+import { Matcher } from 'react-day-picker';
+type Bounds = {
+    minDate?: Date;
+    maxDate?: Date;
+    disablePast?: boolean;
+    disableFuture?: boolean;
+    today?: Date;
+};
+/**
+ * What `DateField` needs to edit in `timeZone`: the value and its callback as
+ * floating dates (`useZonedValue`), the calendar's props with the bounds,
+ * today and the day rule in the zone. Without a zone everything passes
+ * through unchanged and `zone` is `undefined`.
+ */
+export declare function useZonedDateProps<P extends Bounds>({ value, onValueChange, timeZone, props, dayRule, }: {
+    value?: Date;
+    onValueChange?: (value?: Date) => void;
+    timeZone?: string;
+    props: P;
+    dayRule?: Matcher | Matcher[];
+}): {
+    props: P;
+    dayRule: Matcher | Matcher[] | undefined;
+    zone: string | undefined;
+    value: Date | undefined;
+    onValueChange: ((value?: Date) => void) | undefined;
+};
+/** What `TimeField` needs to edit in `timeZone`: the value and its callback as floating dates. */
+export declare function useZonedTimeProps(model: {
+    value?: Date;
+    onValueChange?: (value?: Date) => void;
+    timeZone?: string;
+}): {
+    zone: string | undefined;
+    value: Date | undefined;
+    onValueChange: ((value?: Date) => void) | undefined;
+};
+export {};

package/dist/lib/components/ui/dates/picker-trigger/use-zoned-value.d.ts

@@ -0,0 +1,20 @@
+/**
+ * The value of a field that edits in a time zone. The field's `value` is
+ * the true instant; every part inside works on its wall clock in `timeZone`
+ * as a floating date (`floatingOf`: read through UTC getters, so no
+ * machine zone or clock change moves it), and what it emits is turned back
+ * into the instant (`zonedInstant`; a time in a gap moves forward, a repeated
+ * one keeps the occurrence being edited).
+ *
+ * Without a `timeZone` the value and the callback pass through unchanged.
+ * `zone` is the name `Intl` knows it by (`UTC` for an unknown one).
+ */
+export declare function useZonedValue({ value, onValueChange, timeZone, }: {
+    value?: Date;
+    onValueChange?: (value?: Date) => void;
+    timeZone?: string;
+}): {
+    zone: string | undefined;
+    value: Date | undefined;
+    onValueChange: ((value?: Date) => void) | undefined;
+};

package/dist/lib/components/ui/dates/picker-trigger/zoned-bounds.d.ts

@@ -0,0 +1,16 @@
+type Bounds = {
+    minDate?: Date;
+    maxDate?: Date;
+    disablePast?: boolean;
+    disableFuture?: boolean;
+};
+/**
+ * A field's day bounds as floating dates (`floatingOf`) in `zone`: `minDate`
+ * and `maxDate` (instants) as the wall clock they are in the zone, and
+ * `disablePast` / `disableFuture` resolved against today in the zone (not
+ * the machine's), so a field for Europe/Paris refuses yesterday's Paris date
+ * even where it is still the 3rd. The two flags come back unset: they are
+ * already in `minDate` / `maxDate`. Bounds are compared by day.
+ */
+export declare function zonedBounds({ minDate, maxDate, disablePast, disableFuture }: Bounds, zone: string, now?: Date): Bounds;
+export {};

package/dist/lib/components/ui/dates/picker-trigger/zoned-matchers.d.ts

@@ -0,0 +1,8 @@
+import { Matcher } from 'react-day-picker';
+/**
+ * A field's day rule (`disabledDays`) with the instants in it moved into the
+ * zone: a `Date`, `{ before }`, `{ after }`, `{ from, to }` and the lists of
+ * them name the days they fall on in `zone`, not on the machine. A function,
+ * `{ dayOfWeek }` and the like are given the zone's days already and stay.
+ */
+export declare function zonedMatchers(rule: Matcher | Matcher[] | undefined, zone: string): Matcher | Matcher[] | undefined;

package/dist/lib/components/ui/dates/time-field/time-field.d.ts

@@ -30,6 +30,19 @@ export type TimeFieldProps = {
      * row of times such as opening hours. `'default'` is 44px.
      */
     size?: 'default' | 'sm';
+    /**
+     * An IANA zone (`Europe/Paris`) the time is read and written in.
+     * `value` and `onValueChange` stay the true instant: 09:30 typed with
+     * `Europe/Paris` is `07:30Z` in summer and `08:30Z` in winter, whatever
+     * zone the browser runs in, and the field shows the value's Paris wall
+     * clock. The time lands on the value's day in the zone (today in the zone
+     * when there is no value). A time that does not exist (the clocks go
+     * forward) moves to the end of the gap; one that happens twice (they go
+     * back) is the first occurrence, unless the value already holds the
+     * second. An unknown name is `UTC`. Without it the machine's zone is
+     * used, as before.
+     */
+    timeZone?: string;
 } & Pick<TimePickerProps, 'variant' | 'hourCycle' | 'minuteStep'> & Omit<ComponentProps<'div'>, 'onChange'>;
 /**
  * A time, picked in a popover on a desktop and in a bottom sheet on a phone. Both
@@ -39,4 +52,4 @@ export type TimeFieldProps = {
  * field's root `div`, which holds the `Label`, the trigger and the helper
  * text.
  */
-export declare function TimeField({ value, size, label, helperText, error, onValueChange, placeholder, className, disabled, onBlur, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, variant, hourCycle, minuteStep, entry: _entry, clearable, surface, ...rest }: TimeFieldProps): import("react").JSX.Element;
+export declare function TimeField({ value: instant, timeZone, size, label, helperText, error, onValueChange: emit, placeholder, className, disabled, onBlur, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, variant, hourCycle, minuteStep, entry: _entry, clearable, surface, ...rest }: TimeFieldProps): import("react").JSX.Element;

package/dist/lib/components/ui/dates/time-field/time-form-field.d.ts

@@ -1,5 +1,9 @@
 import { UseControllerProps } from 'react-hook-form';
 import { TimeFieldProps } from './time-field.js';
-export declare function TimeFormField<T extends Record<string, any>>({ control, name, asString, ...props }: {
+export declare function TimeFormField<T extends Record<string, any>>({ control, name, asString, timeZone, ...props }: {
+    /**
+     * The form holds `HH:mm` instead of a `Date`. That string is the wall
+     * clock itself, so `timeZone` has no effect with it.
+     */
     asString?: boolean;
 } & Pick<UseControllerProps<T>, 'control' | 'name'> & Omit<TimeFieldProps, 'name'>): import("react").JSX.Element;

package/dist/lib/components/ui/dates/time-field/time-string-field.d.ts

@@ -1,5 +1,5 @@
 import { TimeFieldProps } from './time-field.js';
-export type TimeStringFieldProps = Omit<TimeFieldProps, 'value' | 'onValueChange'> & {
+export type TimeStringFieldProps = Omit<TimeFieldProps, 'value' | 'onValueChange' | 'timeZone'> & {
     /** The time as `HH:mm` (`'09:30'`); empty or malformed shows an empty field. */
     value?: string;
     /** The new `HH:mm`, or `undefined` once the field is emptied. */
@@ -9,6 +9,7 @@ export type TimeStringFieldProps = Omit<TimeFieldProps, 'value' | 'onValueChange
  * A `TimeField` whose value is an `HH:mm` string instead of a `Date`: what
  * a stored time of day (opening hours, a schedule) holds. It is the same
  * field (`size`, `surface`, the picker, the typed segments), so it keeps no
- * look of its own.
+ * look of its own. A time of day written as text has no instant, so there is
+ * no `timeZone`: the string is the wall clock.
  */
 export declare function TimeStringField({ value, onValueChange, ...props }: TimeStringFieldProps): import("react").JSX.Element;