universal-datetime-picker 2.0.0

package/dist/rangeController-Bq35aBwe.d.mts

@@ -0,0 +1,271 @@
+import { Dayjs } from 'dayjs';
+
+type DateTimeMode = "datetime" | "date" | "time";
+/**
+ * How date and time panels are arranged when `mode="datetime"`.
+ * - `combined` (default): both panels visible at once (no Date/Time tabs)
+ * - `tabs`: separate Date / Time tabs (legacy layout)
+ */
+type DateTimeLayout = "combined" | "tabs";
+type DateTimeValue = Date | string | Dayjs | null;
+/**
+ * Time-only selection when `asString={false}` and `mode="time"`.
+ * `hour` is 1–12; `hour24` is 0–23.
+ */
+interface TimeValue {
+    hour: number;
+    hour24: number;
+    minute: number;
+    second: number;
+    ampm: "AM" | "PM";
+    formatted: string;
+}
+/** Value passed to `onChange` for DateTime / DateTimeInput. */
+type DateTimeChangeValue = Date | TimeValue | string | null;
+/** Optional chrome strings for UI labels (not a full i18n suite). */
+interface DateTimeLabels {
+    date?: string;
+    time?: string;
+    clear?: string;
+    close?: string;
+    ok?: string;
+    start?: string;
+    end?: string;
+    chooseDate?: string;
+    chooseDateRange?: string;
+    chooseMonth?: string;
+    chooseYear?: string;
+    previousMonth?: string;
+    nextMonth?: string;
+    previousYear?: string;
+    nextYear?: string;
+    selectEnd?: string;
+}
+declare const DEFAULT_LABELS: Required<DateTimeLabels>;
+/** Calendar drill-down panel for month / year selection. */
+type CalendarPanel = "day" | "month" | "year";
+/** Shared picker options (framework-agnostic). */
+interface DateTimeBaseOptions {
+    value?: DateTimeValue;
+    defaultValue?: DateTimeValue;
+    onChange?: (value: DateTimeChangeValue) => void;
+    asString?: boolean;
+    showSeconds?: boolean;
+    format?: string;
+    mode?: DateTimeMode;
+    layout?: DateTimeLayout;
+    minDate?: DateTimeValue;
+    maxDate?: DateTimeValue;
+    disablePastDates?: boolean;
+    disableFutureDates?: boolean;
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    use12Hours?: boolean;
+    inline?: boolean;
+    className?: string;
+    /** Inline style object or CSS string (vanilla / WC). */
+    style?: Partial<CSSStyleDeclaration> | string | Record<string, string | number>;
+    locale?: string;
+    labels?: DateTimeLabels;
+    theme?: "light" | "dark";
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    anchorEl?: HTMLElement | null;
+    popover?: boolean;
+}
+interface DateRangeValue {
+    start: Date | string | null;
+    end: Date | string | null;
+}
+interface DateTimeRangeOptions {
+    value?: {
+        start: DateTimeValue;
+        end: DateTimeValue;
+    } | null;
+    defaultValue?: {
+        start: DateTimeValue;
+        end: DateTimeValue;
+    } | null;
+    onChange?: (value: DateRangeValue) => void;
+    asString?: boolean;
+    format?: string;
+    minDate?: DateTimeValue;
+    maxDate?: DateTimeValue;
+    disablePastDates?: boolean;
+    disableFutureDates?: boolean;
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale?: string;
+    labels?: DateTimeLabels;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    inline?: boolean;
+    className?: string;
+    style?: Partial<CSSStyleDeclaration> | string | Record<string, string | number>;
+}
+interface CalendarDay {
+    date: Dayjs;
+    isCurrentMonth: boolean;
+    isCurrentDate: boolean;
+    isFuture: boolean;
+    isPast: boolean;
+    isWeekend: boolean;
+    isDisabled: boolean;
+    isSelected: boolean;
+    isInRange?: boolean;
+    isRangeStart?: boolean;
+    isRangeEnd?: boolean;
+}
+
+type Listener = () => void;
+interface PickerSnapshot {
+    draft: Dayjs;
+    viewMonth: Dayjs;
+    calPanel: CalendarPanel;
+    tab: "date" | "time";
+    showHours: boolean;
+    showMinutes: boolean;
+    showSecondsOpen: boolean;
+    showAmPm: boolean;
+    focusedDay: Dayjs;
+    open: boolean;
+    mode: DateTimeMode;
+    layout: DateTimeLayout;
+    showSeconds: boolean;
+    use12Hours: boolean;
+    inline: boolean;
+    popover: boolean;
+    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale: string;
+    labels: Required<DateTimeLabels>;
+    resolvedFormat: string;
+    asString: boolean | undefined;
+    className?: string;
+    theme?: "light" | "dark";
+    weeks: CalendarDay[][];
+    weekdayLabels: string[];
+    showDate: boolean;
+    showTime: boolean;
+    useTabs: boolean;
+    showDatePanel: boolean;
+    showTimePanel: boolean;
+    showModeTabs: boolean;
+    hour24: number;
+    hour12: number;
+    isAm: boolean;
+    hourOptions: string[];
+    displayHour: string;
+    displayMinute: string;
+    displaySecond: string;
+    minuteOptions: string[];
+}
+type PickerControllerOptions = DateTimeBaseOptions;
+declare class PickerController {
+    private listeners;
+    private options;
+    private draft;
+    private viewMonth;
+    private calPanel;
+    private tab;
+    private showHours;
+    private showMinutes;
+    private showSecondsOpen;
+    private showAmPm;
+    private focusedDay;
+    private open;
+    private snapshot;
+    constructor(options?: PickerControllerOptions);
+    subscribe: (listener: Listener) => (() => void);
+    getSnapshot: () => PickerSnapshot;
+    /** Stable for useSyncExternalStore — returns same reference until mutate. */
+    getServerSnapshot: () => PickerSnapshot;
+    setOptions(partial: Partial<PickerControllerOptions>): void;
+    private getResolvedFormat;
+    private getLabels;
+    private emit;
+    private buildSnapshot;
+    setOpen(open: boolean): void;
+    close(): void;
+    setTab(tab: "date" | "time"): void;
+    setCalPanel(panel: CalendarPanel): void;
+    setViewMonth(next: Dayjs | ((prev: Dayjs) => Dayjs)): void;
+    selectDay(day: Dayjs): void;
+    setHour(hourValue: number): void;
+    setMinute(minute: number): void;
+    setSecond(second: number): void;
+    setAmPm(isAm: boolean): void;
+    toggleHours(): void;
+    toggleMinutes(): void;
+    toggleSeconds(): void;
+    toggleAmPm(): void;
+    closeTimeColumns(): void;
+    selectHourOption(opt: string): void;
+    selectMinuteOption(opt: string): void;
+    selectSecondOption(opt: string): void;
+    selectAmPmOption(opt: string): void;
+    handleGridKeyDown(key: string): boolean;
+    confirm(): DateTimeChangeValue;
+    clear(): void;
+    /** Year window helpers for month/year panels */
+    yearWindowStart(year: number): number;
+    navigatePrev(): void;
+    navigateNext(): void;
+    selectMonth(monthIndex: number): void;
+    selectYear(year: number): void;
+}
+
+interface RangeSnapshot {
+    start: Dayjs | null;
+    end: Dayjs | null;
+    hoverEnd: Dayjs | null;
+    viewMonth: Dayjs;
+    focusedDay: Dayjs;
+    calPanel: CalendarPanel;
+    open: boolean;
+    inline: boolean;
+    format: string;
+    asString: boolean | undefined;
+    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale: string;
+    labels: Required<DateTimeLabels>;
+    className?: string;
+    weeks: CalendarDay[][];
+    weekdayLabels: string[];
+}
+declare class RangeController {
+    private listeners;
+    private options;
+    private start;
+    private end;
+    private hoverEnd;
+    private viewMonth;
+    private focusedDay;
+    private calPanel;
+    private open;
+    private snapshot;
+    constructor(options?: DateTimeRangeOptions);
+    private parseRange;
+    subscribe: (listener: Listener) => (() => void);
+    getSnapshot: () => RangeSnapshot;
+    getServerSnapshot: () => RangeSnapshot;
+    setOptions(partial: Partial<DateTimeRangeOptions>): void;
+    private getLabels;
+    private emit;
+    private buildSnapshot;
+    setOpen(open: boolean): void;
+    close(): void;
+    setCalPanel(panel: CalendarPanel): void;
+    setViewMonth(next: Dayjs | ((prev: Dayjs) => Dayjs)): void;
+    navigatePrev(): void;
+    navigateNext(): void;
+    selectMonth(monthIndex: number): void;
+    selectYear(year: number): void;
+    private emitRange;
+    pickDay(day: Dayjs): void;
+    setHoverEnd(day: Dayjs | null): void;
+    handleGridKeyDown(key: string): boolean;
+    confirm(): DateRangeValue | null;
+    clear(): void;
+}
+
+export { type CalendarDay as C, type DateTimeMode as D, type Listener as L, PickerController as P, RangeController as R, type TimeValue as T, type DateTimeValue as a, type CalendarPanel as b, DEFAULT_LABELS as c, type DateRangeValue as d, type DateTimeBaseOptions as e, type DateTimeChangeValue as f, type DateTimeLabels as g, type DateTimeLayout as h, type DateTimeRangeOptions as i, type PickerControllerOptions as j, type PickerSnapshot as k, type RangeSnapshot as l };

package/dist/rangeController-Bq35aBwe.d.ts

@@ -0,0 +1,271 @@
+import { Dayjs } from 'dayjs';
+
+type DateTimeMode = "datetime" | "date" | "time";
+/**
+ * How date and time panels are arranged when `mode="datetime"`.
+ * - `combined` (default): both panels visible at once (no Date/Time tabs)
+ * - `tabs`: separate Date / Time tabs (legacy layout)
+ */
+type DateTimeLayout = "combined" | "tabs";
+type DateTimeValue = Date | string | Dayjs | null;
+/**
+ * Time-only selection when `asString={false}` and `mode="time"`.
+ * `hour` is 1–12; `hour24` is 0–23.
+ */
+interface TimeValue {
+    hour: number;
+    hour24: number;
+    minute: number;
+    second: number;
+    ampm: "AM" | "PM";
+    formatted: string;
+}
+/** Value passed to `onChange` for DateTime / DateTimeInput. */
+type DateTimeChangeValue = Date | TimeValue | string | null;
+/** Optional chrome strings for UI labels (not a full i18n suite). */
+interface DateTimeLabels {
+    date?: string;
+    time?: string;
+    clear?: string;
+    close?: string;
+    ok?: string;
+    start?: string;
+    end?: string;
+    chooseDate?: string;
+    chooseDateRange?: string;
+    chooseMonth?: string;
+    chooseYear?: string;
+    previousMonth?: string;
+    nextMonth?: string;
+    previousYear?: string;
+    nextYear?: string;
+    selectEnd?: string;
+}
+declare const DEFAULT_LABELS: Required<DateTimeLabels>;
+/** Calendar drill-down panel for month / year selection. */
+type CalendarPanel = "day" | "month" | "year";
+/** Shared picker options (framework-agnostic). */
+interface DateTimeBaseOptions {
+    value?: DateTimeValue;
+    defaultValue?: DateTimeValue;
+    onChange?: (value: DateTimeChangeValue) => void;
+    asString?: boolean;
+    showSeconds?: boolean;
+    format?: string;
+    mode?: DateTimeMode;
+    layout?: DateTimeLayout;
+    minDate?: DateTimeValue;
+    maxDate?: DateTimeValue;
+    disablePastDates?: boolean;
+    disableFutureDates?: boolean;
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    use12Hours?: boolean;
+    inline?: boolean;
+    className?: string;
+    /** Inline style object or CSS string (vanilla / WC). */
+    style?: Partial<CSSStyleDeclaration> | string | Record<string, string | number>;
+    locale?: string;
+    labels?: DateTimeLabels;
+    theme?: "light" | "dark";
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    anchorEl?: HTMLElement | null;
+    popover?: boolean;
+}
+interface DateRangeValue {
+    start: Date | string | null;
+    end: Date | string | null;
+}
+interface DateTimeRangeOptions {
+    value?: {
+        start: DateTimeValue;
+        end: DateTimeValue;
+    } | null;
+    defaultValue?: {
+        start: DateTimeValue;
+        end: DateTimeValue;
+    } | null;
+    onChange?: (value: DateRangeValue) => void;
+    asString?: boolean;
+    format?: string;
+    minDate?: DateTimeValue;
+    maxDate?: DateTimeValue;
+    disablePastDates?: boolean;
+    disableFutureDates?: boolean;
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale?: string;
+    labels?: DateTimeLabels;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    inline?: boolean;
+    className?: string;
+    style?: Partial<CSSStyleDeclaration> | string | Record<string, string | number>;
+}
+interface CalendarDay {
+    date: Dayjs;
+    isCurrentMonth: boolean;
+    isCurrentDate: boolean;
+    isFuture: boolean;
+    isPast: boolean;
+    isWeekend: boolean;
+    isDisabled: boolean;
+    isSelected: boolean;
+    isInRange?: boolean;
+    isRangeStart?: boolean;
+    isRangeEnd?: boolean;
+}
+
+type Listener = () => void;
+interface PickerSnapshot {
+    draft: Dayjs;
+    viewMonth: Dayjs;
+    calPanel: CalendarPanel;
+    tab: "date" | "time";
+    showHours: boolean;
+    showMinutes: boolean;
+    showSecondsOpen: boolean;
+    showAmPm: boolean;
+    focusedDay: Dayjs;
+    open: boolean;
+    mode: DateTimeMode;
+    layout: DateTimeLayout;
+    showSeconds: boolean;
+    use12Hours: boolean;
+    inline: boolean;
+    popover: boolean;
+    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale: string;
+    labels: Required<DateTimeLabels>;
+    resolvedFormat: string;
+    asString: boolean | undefined;
+    className?: string;
+    theme?: "light" | "dark";
+    weeks: CalendarDay[][];
+    weekdayLabels: string[];
+    showDate: boolean;
+    showTime: boolean;
+    useTabs: boolean;
+    showDatePanel: boolean;
+    showTimePanel: boolean;
+    showModeTabs: boolean;
+    hour24: number;
+    hour12: number;
+    isAm: boolean;
+    hourOptions: string[];
+    displayHour: string;
+    displayMinute: string;
+    displaySecond: string;
+    minuteOptions: string[];
+}
+type PickerControllerOptions = DateTimeBaseOptions;
+declare class PickerController {
+    private listeners;
+    private options;
+    private draft;
+    private viewMonth;
+    private calPanel;
+    private tab;
+    private showHours;
+    private showMinutes;
+    private showSecondsOpen;
+    private showAmPm;
+    private focusedDay;
+    private open;
+    private snapshot;
+    constructor(options?: PickerControllerOptions);
+    subscribe: (listener: Listener) => (() => void);
+    getSnapshot: () => PickerSnapshot;
+    /** Stable for useSyncExternalStore — returns same reference until mutate. */
+    getServerSnapshot: () => PickerSnapshot;
+    setOptions(partial: Partial<PickerControllerOptions>): void;
+    private getResolvedFormat;
+    private getLabels;
+    private emit;
+    private buildSnapshot;
+    setOpen(open: boolean): void;
+    close(): void;
+    setTab(tab: "date" | "time"): void;
+    setCalPanel(panel: CalendarPanel): void;
+    setViewMonth(next: Dayjs | ((prev: Dayjs) => Dayjs)): void;
+    selectDay(day: Dayjs): void;
+    setHour(hourValue: number): void;
+    setMinute(minute: number): void;
+    setSecond(second: number): void;
+    setAmPm(isAm: boolean): void;
+    toggleHours(): void;
+    toggleMinutes(): void;
+    toggleSeconds(): void;
+    toggleAmPm(): void;
+    closeTimeColumns(): void;
+    selectHourOption(opt: string): void;
+    selectMinuteOption(opt: string): void;
+    selectSecondOption(opt: string): void;
+    selectAmPmOption(opt: string): void;
+    handleGridKeyDown(key: string): boolean;
+    confirm(): DateTimeChangeValue;
+    clear(): void;
+    /** Year window helpers for month/year panels */
+    yearWindowStart(year: number): number;
+    navigatePrev(): void;
+    navigateNext(): void;
+    selectMonth(monthIndex: number): void;
+    selectYear(year: number): void;
+}
+
+interface RangeSnapshot {
+    start: Dayjs | null;
+    end: Dayjs | null;
+    hoverEnd: Dayjs | null;
+    viewMonth: Dayjs;
+    focusedDay: Dayjs;
+    calPanel: CalendarPanel;
+    open: boolean;
+    inline: boolean;
+    format: string;
+    asString: boolean | undefined;
+    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    locale: string;
+    labels: Required<DateTimeLabels>;
+    className?: string;
+    weeks: CalendarDay[][];
+    weekdayLabels: string[];
+}
+declare class RangeController {
+    private listeners;
+    private options;
+    private start;
+    private end;
+    private hoverEnd;
+    private viewMonth;
+    private focusedDay;
+    private calPanel;
+    private open;
+    private snapshot;
+    constructor(options?: DateTimeRangeOptions);
+    private parseRange;
+    subscribe: (listener: Listener) => (() => void);
+    getSnapshot: () => RangeSnapshot;
+    getServerSnapshot: () => RangeSnapshot;
+    setOptions(partial: Partial<DateTimeRangeOptions>): void;
+    private getLabels;
+    private emit;
+    private buildSnapshot;
+    setOpen(open: boolean): void;
+    close(): void;
+    setCalPanel(panel: CalendarPanel): void;
+    setViewMonth(next: Dayjs | ((prev: Dayjs) => Dayjs)): void;
+    navigatePrev(): void;
+    navigateNext(): void;
+    selectMonth(monthIndex: number): void;
+    selectYear(year: number): void;
+    private emitRange;
+    pickDay(day: Dayjs): void;
+    setHoverEnd(day: Dayjs | null): void;
+    handleGridKeyDown(key: string): boolean;
+    confirm(): DateRangeValue | null;
+    clear(): void;
+}
+
+export { type CalendarDay as C, type DateTimeMode as D, type Listener as L, PickerController as P, RangeController as R, type TimeValue as T, type DateTimeValue as a, type CalendarPanel as b, DEFAULT_LABELS as c, type DateRangeValue as d, type DateTimeBaseOptions as e, type DateTimeChangeValue as f, type DateTimeLabels as g, type DateTimeLayout as h, type DateTimeRangeOptions as i, type PickerControllerOptions as j, type PickerSnapshot as k, type RangeSnapshot as l };

package/dist/rangeRenderer-AVv6PJbW.d.mts

@@ -0,0 +1,21 @@
+import { j as PickerControllerOptions, P as PickerController, i as DateTimeRangeOptions, R as RangeController } from './rangeController-Bq35aBwe.mjs';
+
+interface DateTimePickerHandle {
+    update: (options: Partial<PickerControllerOptions>) => void;
+    destroy: () => void;
+    getController: () => PickerController;
+}
+/**
+ * Mount a date/time picker into `target` (or as overlay/popover).
+ * Returns `{ update, destroy }` for imperative control.
+ */
+declare function createDateTimePicker(target: HTMLElement, options?: PickerControllerOptions): DateTimePickerHandle;
+
+interface DateTimeRangePickerHandle {
+    update: (options: Partial<DateTimeRangeOptions>) => void;
+    destroy: () => void;
+    getController: () => RangeController;
+}
+declare function createDateTimeRangePicker(target: HTMLElement, options?: DateTimeRangeOptions): DateTimeRangePickerHandle;
+
+export { type DateTimePickerHandle as D, type DateTimeRangePickerHandle as a, createDateTimeRangePicker as b, createDateTimePicker as c };

package/dist/rangeRenderer-a3hFk-kK.d.ts

@@ -0,0 +1,21 @@
+import { j as PickerControllerOptions, P as PickerController, i as DateTimeRangeOptions, R as RangeController } from './rangeController-Bq35aBwe.js';
+
+interface DateTimePickerHandle {
+    update: (options: Partial<PickerControllerOptions>) => void;
+    destroy: () => void;
+    getController: () => PickerController;
+}
+/**
+ * Mount a date/time picker into `target` (or as overlay/popover).
+ * Returns `{ update, destroy }` for imperative control.
+ */
+declare function createDateTimePicker(target: HTMLElement, options?: PickerControllerOptions): DateTimePickerHandle;
+
+interface DateTimeRangePickerHandle {
+    update: (options: Partial<DateTimeRangeOptions>) => void;
+    destroy: () => void;
+    getController: () => RangeController;
+}
+declare function createDateTimeRangePicker(target: HTMLElement, options?: DateTimeRangeOptions): DateTimeRangePickerHandle;
+
+export { type DateTimePickerHandle as D, type DateTimeRangePickerHandle as a, createDateTimeRangePicker as b, createDateTimePicker as c };

package/dist/style.css

@@ -0,0 +1 @@
+:root{--ctp-primary: #7cb342;--ctp-primary-dark: #558b2f;--ctp-primary-alt: #8bc34a;--ctp-surface: #ffffff;--ctp-surface-elevated: #ffffff;--ctp-muted: #f3f4f3;--ctp-muted-text: #6b7280;--ctp-fg: #1f2937;--ctp-fg-muted: #9ca3af;--ctp-weekend: transparent;--ctp-disabled: #d1d5db;--ctp-danger: #dc2626;--ctp-overlay: rgba(15, 23, 42, 0.45);--ctp-shadow: 0 10px 30px rgba(15, 23, 42, 0.12), 0 2px 8px rgba(15, 23, 42, 0.06);--ctp-border: #e5e7eb;--ctp-border-radius: 12px;--ctp-width: 320px;--ctp-font-size: 14px;--ctp-focus: #7cb342;--ctp-today: #7cb342;--ctp-selected-bg: #558b2f;--ctp-selected-fg: #ffffff;--ctp-hover-bg: color-mix(in srgb, var(--ctp-primary) 16%, white);--ctp-range-bg: color-mix(in srgb, var(--ctp-primary) 28%, white);--ctp-range-fg: #1f2937;--ctp-z-index: 1000;--ctp-day-size: 36px;--ctp-transition: 150ms ease}[data-ctp-theme=dark]{--ctp-primary: #9ccc65;--ctp-primary-dark: #aed581;--ctp-primary-alt: #8bc34a;--ctp-surface: #1f2937;--ctp-surface-elevated: #273549;--ctp-muted: #374151;--ctp-muted-text: #9ca3af;--ctp-fg: #f3f4f6;--ctp-fg-muted: #9ca3af;--ctp-weekend: transparent;--ctp-disabled: #4b5563;--ctp-danger: #f87171;--ctp-overlay: rgba(0, 0, 0, 0.6);--ctp-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);--ctp-border: #374151;--ctp-focus: #9ccc65;--ctp-today: #9ccc65;--ctp-selected-bg: #8bc34a;--ctp-selected-fg: #14201a;--ctp-hover-bg: color-mix(in srgb, var(--ctp-primary) 22%, #1f2937);--ctp-range-bg: color-mix(in srgb, var(--ctp-primary) 32%, #1f2937);--ctp-range-fg: #f3f4f6}[data-ctp-theme=light]{--ctp-primary: #7cb342;--ctp-primary-dark: #558b2f;--ctp-primary-alt: #8bc34a;--ctp-surface: #ffffff;--ctp-surface-elevated: #ffffff;--ctp-muted: #f3f4f3;--ctp-muted-text: #6b7280;--ctp-fg: #1f2937;--ctp-fg-muted: #9ca3af;--ctp-weekend: transparent;--ctp-disabled: #d1d5db;--ctp-danger: #dc2626;--ctp-overlay: rgba(15, 23, 42, 0.45);--ctp-shadow: 0 10px 30px rgba(15, 23, 42, 0.12), 0 2px 8px rgba(15, 23, 42, 0.06);--ctp-border: #e5e7eb;--ctp-focus: #7cb342;--ctp-today: #7cb342;--ctp-selected-bg: #558b2f;--ctp-selected-fg: #ffffff;--ctp-hover-bg: color-mix(in srgb, var(--ctp-primary) 16%, white);--ctp-range-bg: color-mix(in srgb, var(--ctp-primary) 28%, white);--ctp-range-fg: #1f2937}@media(prefers-reduced-motion: reduce){:root{--ctp-transition: 0ms}}.ctp-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.ctp-calendar-time-picker-absolute-container{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;background-color:var(--ctp-overlay);overflow:auto;z-index:var(--ctp-z-index)}.ctp-input-root{display:inline-flex;flex-direction:column;gap:4px}.ctp-input{font:inherit;color:var(--ctp-fg);padding:10px 12px;border:1px solid var(--ctp-border);border-radius:8px;min-width:220px;background:var(--ctp-surface);cursor:pointer;transition:border-color var(--ctp-transition),box-shadow var(--ctp-transition)}.ctp-input:hover:not(:disabled){border-color:color-mix(in srgb, var(--ctp-primary) 50%, var(--ctp-border))}.ctp-input:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:2px;border-color:var(--ctp-focus)}.ctp-input:disabled{cursor:not-allowed;opacity:.6}.ctp-calendar-time-picker{width:var(--ctp-width);max-width:calc(100vw - 24px);background-color:var(--ctp-surface-elevated);color:var(--ctp-fg);font-size:var(--ctp-font-size);border:1px solid var(--ctp-border);box-shadow:var(--ctp-shadow);border-radius:var(--ctp-border-radius);z-index:calc(var(--ctp-z-index) + 1);overflow:hidden;animation:ctp-popover-in var(--ctp-transition)}.ctp-calendar-time-picker.ctp-mode-time{width:200px}.ctp-calendar-time-picker.ctp-mode-time.ctp-use-12h{width:220px}.ctp-calendar-time-picker.ctp-mode-time.ctp-no-seconds{width:180px}.ctp-calendar-time-picker.ctp-mode-time.ctp-no-seconds.ctp-use-12h{width:200px}.ctp-mode-time .ctp-main-time{height:auto;min-height:0;padding:6px 8px 2px}.ctp-mode-time .ctp-main-time-header,.ctp-mode-time .ctp-main-time-body{padding:6px 0;gap:8px}.ctp-mode-time .ctp-main-time-body{position:static;top:auto;left:auto;margin-top:0;transform:none}.ctp-calendar-time-picker.ctp-mode-time{overflow:visible}.ctp-mode-time .ctp-main-time,.ctp-mode-time .ctp-main-time-body,.ctp-mode-time .ctp-box-time{overflow:visible}.ctp-mode-time .ctp-overflow-hours,.ctp-mode-time .ctp-overflow-minutes,.ctp-mode-time .ctp-overflow-seconds,.ctp-mode-time .ctp-overflow-am-pm{margin-top:0;z-index:3}.ctp-mode-time .ctp-footer{padding:8px;gap:4px}.ctp-mode-time .ctp-footer button{padding:5px 8px;font-size:.85em}.ctp-calendar-time-picker.ctp-popover{z-index:calc(var(--ctp-z-index) + 2)}@keyframes ctp-popover-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion: reduce){.ctp-calendar-time-picker{animation:none}}.ctp-header{display:flex;justify-content:center;align-items:center;padding:12px 14px;border-bottom:1px solid var(--ctp-border)}.ctp-range-title{font-weight:600;color:var(--ctp-primary-dark)}.ctp-button-container{display:flex;gap:4px;padding:3px;background:var(--ctp-muted);border-radius:999px}.ctp-button-container>*{padding:6px 16px;border-radius:999px;background-color:rgba(0,0,0,0);color:var(--ctp-muted-text);z-index:0;position:relative;cursor:pointer;display:inline-block;border:none;font:inherit;transition:background-color var(--ctp-transition),color var(--ctp-transition)}.ctp-button-container>*.ctp-active{background-color:var(--ctp-surface);color:var(--ctp-fg);box-shadow:0 1px 2px rgba(15,23,42,.08);z-index:1}.ctp-button-container>*:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:1px}.ctp-date.ctp-active{margin-right:0}.ctp-time.ctp-active{margin-left:0}.ctp-body .ctp-month-year{display:flex;justify-content:space-between;align-items:center;color:var(--ctp-fg);padding:8px 12px 0;font-weight:600}.ctp-prev-month,.ctp-next-month{cursor:pointer;padding:6px 10px;background:rgba(0,0,0,0);border:none;color:inherit;font-size:1.25rem;line-height:1;border-radius:8px}.ctp-prev-month:hover,.ctp-next-month:hover{background:var(--ctp-muted)}.ctp-prev-month:focus-visible,.ctp-next-month:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:1px}.ctp-current-month{font:inherit;font-weight:600;color:inherit;background:rgba(0,0,0,0);border:none;padding:4px 8px;border-radius:8px;cursor:pointer;line-height:1.2}button.ctp-current-month:hover{background:var(--ctp-muted)}button.ctp-current-month:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:1px}span.ctp-current-month{cursor:default}.ctp-main-calendar{display:grid;gap:4px;grid-template-columns:repeat(7, 1fr);padding:10px 14px 14px}.ctp-month-grid,.ctp-year-grid{display:grid;gap:6px;grid-template-columns:repeat(3, 1fr);padding:10px 14px 14px;min-height:calc(var(--ctp-day-size)*6 + 20px + 20px)}.ctp-box-month,.ctp-box-year{width:100%;min-height:calc(var(--ctp-day-size) + 8px);padding:8px 4px;border-radius:8px;background-color:rgba(0,0,0,0);border:none;font:inherit;color:inherit;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color var(--ctp-transition),color var(--ctp-transition)}.ctp-box-month:hover,.ctp-box-year:hover{background-color:var(--ctp-hover-bg);color:var(--ctp-fg)}.ctp-box-month:focus-visible,.ctp-box-year:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:1px}.ctp-box-month.ctp-current,.ctp-box-year.ctp-current{color:var(--ctp-today);font-weight:700;box-shadow:inset 0 0 0 1px var(--ctp-today)}.ctp-box-month.ctp-current:hover,.ctp-box-year.ctp-current:hover{color:var(--ctp-today)}.ctp-main-calendar .ctp-box{text-align:center}.ctp-box-days{color:var(--ctp-fg-muted);font-size:.8em;font-weight:600;text-transform:uppercase;letter-spacing:.02em;padding:4px 0}.ctp-box-date{width:100%;min-height:var(--ctp-day-size);padding:0;border-radius:8px;background-color:rgba(0,0,0,0);border:none;font:inherit;color:inherit;display:inline-flex;align-items:center;justify-content:center;position:relative;transition:background-color var(--ctp-transition),color var(--ctp-transition)}.ctp-box-date:not(.not-current-month):not(.disabled-date):not(:disabled){cursor:pointer}.ctp-box-date:not(.not-current-month):not(.disabled-date):not(:disabled):not(.selected):not(.ctp-range-start):not(.ctp-range-end):hover{background-color:var(--ctp-hover-bg);color:var(--ctp-fg)}.ctp-box-date:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:1px;z-index:1}.ctp-box-date.weekend-day:not(.selected):not(.ctp-in-range):not(.ctp-range-start):not(.ctp-range-end){color:var(--ctp-muted-text)}.ctp-box-date.selected,.ctp-box-date.ctp-range-start,.ctp-box-date.ctp-range-end{background-color:var(--ctp-selected-bg);color:var(--ctp-selected-fg)}.ctp-box-date.ctp-in-range:not(.selected):not(.ctp-range-start):not(.ctp-range-end){background-color:var(--ctp-range-bg);color:var(--ctp-range-fg);border-radius:0}.ctp-box-date.ctp-in-range:not(.selected):not(.ctp-range-start):not(.ctp-range-end):hover{background-color:color-mix(in srgb, var(--ctp-primary) 40%, var(--ctp-range-bg));color:var(--ctp-range-fg)}.ctp-box-date.ctp-range-start{border-radius:8px 0 0 8px}.ctp-box-date.ctp-range-end{border-radius:0 8px 8px 0}.ctp-box-date.ctp-range-start.ctp-range-end{border-radius:8px}.ctp-box-date.ctp-today:not(.selected):not(.ctp-range-start):not(.ctp-range-end)::after{content:"";position:absolute;bottom:5px;left:50%;width:4px;height:4px;border-radius:50%;background:var(--ctp-today);transform:translateX(-50%)}.ctp-box-date.not-current-month{cursor:not-allowed;color:var(--ctp-fg-muted);background-color:rgba(0,0,0,0);opacity:.45}.ctp-box-date.disabled-date:not(.not-current-month),.ctp-box-date:disabled:not(.not-current-month){cursor:not-allowed;background-color:rgba(0,0,0,0);color:var(--ctp-disabled);opacity:.7}.ctp-main-time{height:250px;position:relative}.ctp-layout-combined .ctp-body-calendar-time{border-top:1px solid var(--ctp-border);padding-bottom:8px}.ctp-layout-combined .ctp-main-time{height:auto;min-height:88px;padding:4px 0 12px}.ctp-layout-combined .ctp-main-time-body{position:static;top:auto;left:auto;margin-top:0;transform:none}.ctp-section-label{font-size:.75rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ctp-fg-muted);padding:10px 14px 0}.ctp-main-time-header,.ctp-main-time-body{display:grid;gap:10px;grid-template-rows:30px;grid-template-columns:repeat(3, 36px);padding:10px 0;width:140px;margin:auto}.ctp-use-12h .ctp-main-time-header,.ctp-use-12h .ctp-main-time-body{grid-template-columns:repeat(4, 36px);width:180px}.ctp-no-seconds .ctp-main-time-header,.ctp-no-seconds .ctp-main-time-body{grid-template-columns:repeat(2, 36px);width:92px}.ctp-no-seconds.ctp-use-12h .ctp-main-time-header,.ctp-no-seconds.ctp-use-12h .ctp-main-time-body{grid-template-columns:repeat(3, 36px);width:132px}.ctp-main-time-header .ctp-box,.ctp-main-time-body .ctp-box{display:flex;justify-content:center;align-items:center;color:var(--ctp-fg-muted);font-size:.8em;font-weight:600}.ctp-box-time.not-opened .ctp-hour,.ctp-box-time.not-opened .ctp-minute,.ctp-box-time.not-opened .ctp-second,.ctp-box-time.not-opened .ctp-am-pm{background-color:var(--ctp-selected-bg);color:var(--ctp-selected-fg)}.ctp-box-time{position:relative}.ctp-box-time .ctp-initial-time{display:none;border:none;font:inherit;padding:6px;border-radius:6px;cursor:pointer;min-width:36px}.ctp-box-time .ctp-initial-time:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:1px}.ctp-box-time.not-opened .ctp-initial-time{display:block}.ctp-overflow-hours,.ctp-overflow-minutes,.ctp-overflow-seconds,.ctp-overflow-am-pm{max-height:170px;overflow:auto;position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:-23px;border:1px solid var(--ctp-border);border-radius:8px;z-index:2;background:var(--ctp-surface-elevated);padding:6px;box-shadow:var(--ctp-shadow)}.ctp-overflow-hours::-webkit-scrollbar,.ctp-overflow-minutes::-webkit-scrollbar,.ctp-overflow-seconds::-webkit-scrollbar,.ctp-overflow-am-pm::-webkit-scrollbar{width:0}.ctp-overflow-hours.not-visible,.ctp-overflow-minutes.not-visible,.ctp-overflow-seconds.not-visible,.ctp-overflow-am-pm.not-visible{display:none}.ctp-hour,.ctp-minute,.ctp-second,.ctp-am-pm{cursor:pointer;padding:5px 8px;border-radius:5px;background-color:var(--ctp-muted);border:none;font:inherit;color:var(--ctp-fg)}.ctp-hour:focus-visible,.ctp-minute:focus-visible,.ctp-second:focus-visible,.ctp-am-pm:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:1px}.ctp-main-time-body{position:absolute;top:50%;left:50%;margin-top:15px;transform:translate(-50%, -50%)}.ctp-footer{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;gap:8px;border-top:1px solid var(--ctp-border);background:color-mix(in srgb, var(--ctp-muted) 60%, var(--ctp-surface))}.ctp-footer button{background-color:var(--ctp-primary);color:#fff;border:none;padding:7px 12px;font-weight:600;border-radius:8px;cursor:pointer;font:inherit;transition:filter var(--ctp-transition)}.ctp-footer button:hover:not(:disabled){filter:brightness(0.96)}.ctp-footer button:focus-visible{outline:2px solid var(--ctp-focus);outline-offset:2px}.ctp-footer button:disabled{opacity:.5;cursor:not-allowed}.ctp-footer button.close-button{background-color:var(--ctp-danger)}.ctp-footer button.ctp-cancel{background-color:var(--ctp-muted);color:var(--ctp-fg);margin-left:auto}

package/dist/svelte/index.d.mts

@@ -0,0 +1,11 @@
+export { defineCustomElements } from '../wc/index.mjs';
+import '../rangeRenderer-AVv6PJbW.mjs';
+import '../rangeController-Bq35aBwe.mjs';
+import 'dayjs';
+
+/** Svelte action: mounts nothing; ensures custom elements are defined. */
+declare function calendarTime(_node: HTMLElement): {
+    destroy?: () => void;
+};
+
+export { calendarTime };

package/dist/svelte/index.d.ts

@@ -0,0 +1,11 @@
+export { defineCustomElements } from '../wc/index.js';
+import '../rangeRenderer-a3hFk-kK.js';
+import '../rangeController-Bq35aBwe.js';
+import 'dayjs';
+
+/** Svelte action: mounts nothing; ensures custom elements are defined. */
+declare function calendarTime(_node: HTMLElement): {
+    destroy?: () => void;
+};
+
+export { calendarTime };