@m3e/web 2.5.15 → 2.6.0

package/dist/src/timepicker/TimepickerElement.d.ts

@@ -0,0 +1,266 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+import { TimeParts } from "@m3e/web/core";
+import "@m3e/web/core/a11y";
+import "@m3e/web/button";
+import "@m3e/web/icon-button";
+import { TimepickerVariant } from "./TimepickerVariant";
+import { TimepickerMode } from "./TimepickerMode";
+import { TimepickerOrientation } from "./TimepickerOrientation";
+import { TimepickerFormat } from "./TimepickerFormat";
+import "./TimepickerDialElement";
+import "./TimepickerInputElement";
+declare const M3eTimepickerElement_base: import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").SuppressInitialAnimationMixin> & import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").ReconnectedCallbackMixin> & import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").AttachInternalsMixin> & import("../core/shared/mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * Presents a time picker on a temporary surface.
+ * @description
+ * The `m3e-timepicker` component provides a time-selection experience consistent
+ * with Material 3 guidance for layout, motion, and accessibility. It displays a
+ * temporary surface that allows users to choose a time using both keyboard-based
+ * input and clock-face dial controls.
+ *
+ * While open, the picker ensures users can review their selection and complete
+ * the interaction through confirm, dismiss, or toggle actions, making updates
+ * intentional and accessible.
+ *
+ * It accepts and emits plain `Date` values, allowing applications to apply their
+ * own formatting, parsing, and localization.
+ *
+ * @tag m3e-timepicker
+ *
+ * @attr variant - The appearance variant of the picker.
+ * @attr mode - The mode in which to select time.
+ * @attr orientation - The orientation of the picker.
+ * @attr date - The selected date.
+ * @attr format - Whether to use a 12‑hour or 24‑hour clock.
+ * @attr max-time - The maximum time that can be selected.
+ * @attr min-time - The minimum time that can be selected.
+ * @attr confirm-label - Label given to the button used apply the selected date and close the picker.
+ * @attr dismiss-label - Label given to the button used discard the selected date and close the picker.
+ * @attr dial-label - Label given to the the picker when in dial mode.
+ * @attr input-label - Label given to the the picker when in input mode.
+ * @attr hour-label - Label for the hour field.
+ * @attr minute-label - Label for the minute field.
+ * @attr mode-toggle-label - The accessible label given to the mode toggle button.
+ * @attr hide-mode-toggle - Whether to hide the mode toggle button.
+ * @attr period-toggle-label - The accessible label given to the period toggle.
+ *
+ * @fires change - Dispatched when the selected time is confirmed.
+ * @fires beforetoggle - Dispatched before the picker toggles.
+ * @fires toggle - Dispatched when the picker toggles.
+ *
+ * @cssprop --m3e-timepicker-container-padding-block - Block padding inside the picker container.
+ * @cssprop --m3e-timepicker-container-padding-inline - Inline padding inside the picker container.
+ * @cssprop --m3e-timepicker-container-color - Background color of the picker container.
+ * @cssprop --m3e-timepicker-container-elevation - Box shadow / elevation of the picker container.
+ * @cssprop --m3e-timepicker-docked-container-color - Background color of the docked picker container.
+ * @cssprop --m3e-timepicker-docked-container-shape - Border radius of the docked picker container.
+ * @cssprop --m3e-timepicker-modal-container-color - Background color of the modal picker container.
+ * @cssprop --m3e-timepicker-modal-container-shape - Border radius of the modal picker container.
+ * @cssprop --m3e-timepicker-headline-color - Color of the headline.
+ * @cssprop --m3e-timepicker-headline-font-size - Font size of the headline.
+ * @cssprop --m3e-timepicker-headline-font-weight - Font weight of the headline.
+ * @cssprop --m3e-timepicker-headline-line-height - Line height of the headline.
+ * @cssprop --m3e-timepicker-headline-tracking - Letter spacing of the headline.
+ * @cssprop --m3e-timepicker-headline-top-space - Top margin above the headline.
+ * @cssprop --m3e-timepicker-actions-space - Space above the action buttons.
+ * @cssprop --m3e-timepicker-label-input-space - Space between Label and the input.
+ * @cssprop --m3e-timepicker-vertical-input-dial-space - Space between the input and dial in vertical orientation.
+ * @cssprop --m3e-timepicker-horizontal-input-dial-space - Space between the input and dial in horizontal orientation.
+ * @cssprop --m3e-timepicker-input-field-container-width - Width of the input field container.
+ * @cssprop --m3e-timepicker-input-field-height - Height of the input fields.
+ * @cssprop --m3e-timepicker-input-field-container-shape - Corner radius of the input field container.
+ * @cssprop --m3e-timepicker-input-field-font-size - Font size of the input field text.
+ * @cssprop --m3e-timepicker-input-field-font-weight - Font weight of the input field text.
+ * @cssprop --m3e-timepicker-input-field-line-height - Line height of the input field text.
+ * @cssprop --m3e-timepicker-input-field-tracking - Letter spacing of the input field text.
+ * @cssprop --m3e-timepicker-input-field-label-unselected-color - Text color of unselected input field labels.
+ * @cssprop --m3e-timepicker-input-field-unselected-container-color - Background color of unselected input fields.
+ * @cssprop --m3e-timepicker-input-field-label-selected-color - Text color of selected input field labels.
+ * @cssprop --m3e-timepicker-input-field-selected-container-color - Background color of selected input fields.
+ * @cssprop --m3e-timepicker-input-field-label-invalid-color - Text color of invalid input field labels.
+ * @cssprop --m3e-timepicker-input-field-invalid-container-color - Background color of invalid input fields.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-color - Text color of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-font-size - Font size of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-font-weight - Font weight of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-line-height - Line height of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-tracking - Letter spacing of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-separator-width - Width of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-color - Color of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-font-size - Font size of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-font-weight - Font weight of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-tracking - Letter spacing of the field separator.
+ * @cssprop --m3e-timepicker-input-horizontal-period-toggle-space - Space between the fields and period toggle in horizontal orientation.
+ * @cssprop --m3e-timepicker-input-vertical-period-toggle-space - Space between the fields and period toggle in vertical orientation.
+ * @cssprop --m3e-timepicker-dial-container-size - Size of the dial container.
+ * @cssprop --m3e-timepicker-dial-container-shape - Corner radius of the dial container.
+ * @cssprop --m3e-timepicker-dial-container-color - Background color of the dial container.
+ * @cssprop --m3e-timepicker-dial-inset - Inset offset applied to the dial surface.
+ * @cssprop --m3e-timepicker-dial-center-size - Size of the dial center.
+ * @cssprop --m3e-timepicker-dial-handle-color - Color of the active handle.
+ * @cssprop --m3e-timepicker-dial-handle-size - Size of the handle.
+ * @cssprop --m3e-timepicker-dial-handle-disabled-color - Color of a disabled handle.
+ * @cssprop --m3e-timepicker-dial-handle-disabled-opacity - Opacity of a disabled handle.
+ * @cssprop --m3e-timepicker-dial-dial-inset - Inset applied to the handle area.
+ * @cssprop --m3e-timepicker-dial-numeral-size - Size of the dial numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-color - Text color of inactive numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-shape - Corner radius of the numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-font-size - Font size of the outer numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-font-weight - Font weight of the outer numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-line-height - Line height of the outer numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-tracking - Letter spacing of the outer numerals.
+ * @cssprop --m3e-timepicker-dial-inner-numeral-font-size - Font size of the inner numerals.
+ * @cssprop --m3e-timepicker-dial-inner-numeral-font-weight - Font weight of the inner numerals.
+ * @cssprop --m3e-timepicker-dial-inner-numeral-line-height - Line height of the inner numerals.
+ * @cssprop --m3e-timepicker-dial-inner-numeral-tracking - Letter spacing of the inner numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-active-color - Color of active numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-disabled-color - Color of disabled numerals.
+ * @cssprop --m3e-timepicker-dial-numeral-disabled-opacity - Opacity of disabled numerals.
+ * @cssprop --m3e-timepicker-dial-handle-center-size - Size of the handle center indicator.
+ */
+export declare class M3eTimepickerElement extends M3eTimepickerElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** @private */ private _open;
+    /** @private */ private readonly _input;
+    /** @private */ _invalid: boolean;
+    /** @private */ private _variant?;
+    /** @private */ private _orientation?;
+    /** @private */ private _mode?;
+    /**
+     * The appearance variant of the picker.
+     * @default "docked"
+     */
+    variant: TimepickerVariant;
+    /**
+     * The mode in which to select time.
+     * @default "dial"
+     */
+    mode: TimepickerMode;
+    /**
+     * The orientation of the picker.
+     * @default "vertical"
+     */
+    orientation: TimepickerOrientation;
+    /**
+     * The selected date.
+     * @default null
+     */
+    date: Date | null;
+    /**
+     * Whether to use a 12‑hour or 24‑hour clock.
+     * @default "12"
+     */
+    format: TimepickerFormat;
+    /**
+     * The minimum time that can be selected.
+     * @default null
+     */
+    minTime: TimeParts | null;
+    /**
+     * The maximum time that can be selected.
+     * @default null
+     */
+    maxTime: TimeParts | null;
+    /** A function used to determine whether a time cannot be selected. */
+    blackoutTimes?: (time: TimeParts) => boolean;
+    /**
+     * Whether to hide the mode toggle button.
+     * @default false
+     */
+    hideModeToggle: boolean;
+    /**
+     * Label given to the button used apply the selected date and close the picker.
+     * @default "OK"
+     */
+    confirmLabel: string;
+    /**
+     * Label given to the button used discard the selected date and close the picker.
+     * @default "Cancel"
+     */
+    dismissLabel: string;
+    /**
+     * Label given to the the picker when in dial mode.
+     * @default "Select time"
+     */
+    dialLabel: string;
+    /**
+     * Label given to the the picker when in input mode.
+     * @default "Edit time"
+     */
+    inputLabel: string;
+    /**
+     * Label for the hour field.
+     * @default "Hour"
+     */
+    hourLabel: string;
+    /**
+     * Label for the minute field.
+     * @default "Minute"
+     */
+    minuteLabel: string;
+    /**
+     * The accessible label given to the mode toggle button.
+     * @default "Toggle input picker"
+     */
+    modeToggleLabel: string;
+    /**
+     * The accessible label given to the period toggle.
+     * @default "AM or PM"
+     */
+    periodToggleLabel: string;
+    /** Whether the picker is open. */
+    get isOpen(): boolean;
+    /** The current variant applied to the picker. */
+    get currentVariant(): Exclude<TimepickerVariant, "auto">;
+    /** The current orientation applied to the picker. */
+    get currentOrientation(): Exclude<TimepickerOrientation, "auto">;
+    /** The current input mode applied to the picker. */
+    get currentMode(): Exclude<TimepickerMode, "auto">;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    reconnectedCallback(): void;
+    /**
+     * Opens the picker.
+     * @param {HTMLElement} trigger The element that triggered the picker.
+     * @param {HTMLElement | undefined} anchor The element used to position the picker.
+     * @returns {Promise<void>} A `Promise` that resolves when the picker is opened.
+     */
+    show(trigger: HTMLElement, anchor?: HTMLElement): Promise<void>;
+    /**
+     * Hides the picker.
+     * @param {boolean} [restoreFocus=false] Whether to restore focus to the picker's trigger.
+     */
+    hide(restoreFocus?: boolean): void;
+    /**
+     * Toggles the picker.
+     * @param {HTMLElement} trigger The element that triggered the picker.
+     * @param {HTMLElement | undefined} anchor The element used to position the picker.
+     * @returns {Promise<void>} A `Promise` that resolves when the picker is opened or closed.
+     */
+    toggle(trigger: HTMLElement, anchor?: HTMLElement): Promise<void>;
+    /** @inheritdoc */
+    protected render(): unknown;
+    /** @inheritdoc */
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+}
+interface M3eTimepickerElementEventMap extends HTMLElementEventMap {
+    beforetoggle: ToggleEvent;
+    toggle: ToggleEvent;
+}
+export interface M3eTimepickerElement {
+    addEventListener<K extends keyof M3eTimepickerElementEventMap>(type: K, listener: (this: M3eTimepickerElement, ev: M3eTimepickerElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof M3eTimepickerElementEventMap>(type: K, listener: (this: M3eTimepickerElement, ev: M3eTimepickerElementEventMap[K]) => void, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-timepicker": M3eTimepickerElement;
+    }
+}
+export {};
+//# sourceMappingURL=TimepickerElement.d.ts.map

package/dist/src/timepicker/TimepickerElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerElement.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerElement.ts"],"names":[],"mappings":"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"}

package/dist/src/timepicker/TimepickerFormat.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the time formats used by a timepicker. */
+export type TimepickerFormat = "12" | "24" | "auto";
+//# sourceMappingURL=TimepickerFormat.d.ts.map

package/dist/src/timepicker/TimepickerFormat.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerFormat.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerFormat.ts"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC"}

package/dist/src/timepicker/TimepickerInputElement.d.ts

@@ -0,0 +1,110 @@
+import { CSSResultGroup, PropertyValues } from "lit";
+import { TimepickerOrientation } from "./TimepickerOrientation";
+import { TimepickerInputElementBase } from "./TimepickerInputElementBase";
+import "./TimepickerInputPeriodToggleElement";
+declare const M3eTimepickerInputElement_base: import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").HtmlForMixin> & typeof TimepickerInputElementBase;
+/**
+ * A keyboard‑based time surface for choosing hours and minutes.
+ * @description
+ * The `m3e-timepicker-input` component provides a keyboard-focused time
+ * entry surface, allowing users to type or navigate hour and minute fields,
+ * toggle AM/PM, and receive accessible validation feedback.
+ *
+ * @tag m3e-timepicker-input
+ *
+ * @attr format - Whether to use a 12‑hour or 24‑hour clock.
+ * @attr hide-labels - Whether to hide field labels.
+ * @attr hour - The hour, in 24-hour time, from 0..23.
+ * @attr max-time - The maximum time that can be selected.
+ * @attr min-time - The minimum time that can be selected.
+ * @attr minute - The minute, from 0..59.
+ * @attr orientation - The orientation of the input.
+ * @attr period - The 12-hour time period.
+ * @attr view - The view used to input time.
+ * @attr hour-label - The label for the hour field.
+ * @attr minute-label - The label for the minute field.
+ * @attr period-toggle-label - The accessible label given to the period toggle.
+ *
+ * @fires change - Dispatched when the selected time changes.
+ * @fires view-change - Dispatched when the view changes.
+ *
+ * @cssprop --m3e-timepicker-input-field-container-width - Width of the input field container.
+ * @cssprop --m3e-timepicker-input-field-height - Height of the input fields.
+ * @cssprop --m3e-timepicker-input-field-container-shape - Corner radius of the input field container.
+ * @cssprop --m3e-timepicker-input-field-font-size - Font size of the input field text.
+ * @cssprop --m3e-timepicker-input-field-font-weight - Font weight of the input field text.
+ * @cssprop --m3e-timepicker-input-field-line-height - Line height of the input field text.
+ * @cssprop --m3e-timepicker-input-field-tracking - Letter spacing of the input field text.
+ * @cssprop --m3e-timepicker-input-field-label-unselected-color - Text color of unselected input field labels.
+ * @cssprop --m3e-timepicker-input-field-unselected-container-color - Background color of unselected input fields.
+ * @cssprop --m3e-timepicker-input-field-label-selected-color - Text color of selected input field labels.
+ * @cssprop --m3e-timepicker-input-field-selected-container-color - Background color of selected input fields.
+ * @cssprop --m3e-timepicker-input-field-label-invalid-color - Text color of invalid input field labels.
+ * @cssprop --m3e-timepicker-input-field-invalid-container-color - Background color of invalid input fields.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-color - Text color of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-font-size - Font size of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-font-weight - Font weight of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-line-height - Line height of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-supporting-text-tracking - Letter spacing of supporting labels.
+ * @cssprop --m3e-timepicker-input-field-separator-width - Width of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-color - Color of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-font-size - Font size of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-font-weight - Font weight of the field separator.
+ * @cssprop --m3e-timepicker-input-field-separator-tracking - Letter spacing of the field separator.
+ * @cssprop --m3e-timepicker-input-horizontal-period-toggle-space - Space between the fields and period toggle in horizontal orientation.
+ * @cssprop --m3e-timepicker-input-vertical-period-toggle-space - Space between the fields and period toggle in vertical orientation.
+ */
+export declare class M3eTimepickerInputElement extends M3eTimepickerInputElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /**
+     * The orientation of the input.
+     * @default "horizontal"
+     */
+    orientation: Exclude<TimepickerOrientation, "auto">;
+    /**
+     * Whether to hide field labels.
+     * @default false
+     */
+    hideLabels: boolean;
+    /**
+     * The label for the hour field.
+     * @default "Hour"
+     */
+    hourLabel: string;
+    /**
+     * The label for the minute field.
+     * @default "Minute"
+     */
+    minuteLabel: string;
+    /**
+     * The accessible label given to the period toggle.
+     * @default "AM or PM"
+     */
+    periodToggleLabel: string;
+    /** @inheritdoc */
+    attach(control: HTMLElement): void;
+    /** @inheritdoc */
+    detach(): void;
+    /** @inheritdoc */
+    protected willUpdate(_changedProperties: PropertyValues<this>): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+interface M3eTimepickerInputElementEventMap extends HTMLElementEventMap {
+    "view-change": CustomEvent;
+}
+export interface M3eTimepickerInputElement {
+    addEventListener<K extends keyof M3eTimepickerInputElementEventMap>(type: K, listener: (this: M3eTimepickerInputElement, ev: M3eTimepickerInputElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof M3eTimepickerInputElementEventMap>(type: K, listener: (this: M3eTimepickerInputElement, ev: M3eTimepickerInputElementEventMap[K]) => void, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-timepicker-input": M3eTimepickerInputElement;
+    }
+}
+export {};
+//# sourceMappingURL=TimepickerInputElement.d.ts.map

package/dist/src/timepicker/TimepickerInputElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerInputElement.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerInputElement.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,cAAc,EAAiB,cAAc,EAAE,MAAM,KAAK,CAAC;AAOzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAGhE,OAAO,EAAE,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AAG1E,OAAO,sCAAsC,CAAC;;AAE9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AACH,qBACa,yBAA0B,SAAQ,8BAAmC;;IAChF,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAsHpC;IAKF;;;OAGG;IAC0B,WAAW,EAAE,OAAO,CAAC,qBAAqB,EAAE,MAAM,CAAC,CAAgB;IAEhG;;;OAGG;IACoD,UAAU,UAAS;IAE1E;;;OAGG;IACoC,SAAS,SAAU;IAE1D;;;OAGG;IACsC,WAAW,SAAY;IAEhE;;;OAGG;IAC6C,iBAAiB,SAAc;IAE/E,kBAAkB;IACT,MAAM,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAU3C,kBAAkB;IACT,MAAM,IAAI,IAAI;IAQvB,kBAAkB;cACC,UAAU,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IA+B7E,kBAAkB;cACC,MAAM,IAAI,OAAO;CA+RrC;AAED,UAAU,iCAAkC,SAAQ,mBAAmB;IACrE,aAAa,EAAE,WAAW,CAAC;CAC5B;AAED,MAAM,WAAW,yBAAyB;IACxC,gBAAgB,CAAC,CAAC,SAAS,MAAM,iCAAiC,EAChE,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,CAAC,IAAI,EAAE,yBAAyB,EAAE,EAAE,EAAE,iCAAiC,CAAC,CAAC,CAAC,KAAK,IAAI,EAC7F,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAC1C,IAAI,CAAC;IAER,gBAAgB,CACd,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,EAC5C,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,GAC1C,IAAI,CAAC;IAER,mBAAmB,CAAC,CAAC,SAAS,MAAM,iCAAiC,EACnE,IAAI,EAAE,CAAC,EACP,QAAQ,EAAE,CAAC,IAAI,EAAE,yBAAyB,EAAE,EAAE,EAAE,iCAAiC,CAAC,CAAC,CAAC,KAAK,IAAI,EAC7F,OAAO,CAAC,EAAE,OAAO,GAAG,oBAAoB,GACvC,IAAI,CAAC;IAER,mBAAmB,CACjB,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,kCAAkC,EAC5C,OAAO,CAAC,EAAE,OAAO,GAAG,oBAAoB,GACvC,IAAI,CAAC;CACT;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,yBAAyB,CAAC;KACnD;CACF"}

package/dist/src/timepicker/TimepickerInputElementBase.d.ts

@@ -0,0 +1,69 @@
+import { LitElement, PropertyValues } from "lit";
+import { TimepickerFormat } from "./TimepickerFormat";
+import { TimepickerView } from "./TimepickerView";
+import { TimepickerPeriod } from "./TimepickerPeriod";
+import { TimeParts } from "../core";
+/** A base implementation for an element used to input time. This class must be inherited. */
+export declare class TimepickerInputElementBase extends LitElement {
+    #private;
+    /**
+     * The hour, in 24-hour time, from 0..23.
+     * @default null
+     */
+    get hour(): number | null;
+    set hour(value: number | null);
+    /**
+     * The minute, from 0..59.
+     * @default null
+     */
+    get minute(): number | null;
+    set minute(value: number | null);
+    /**
+     * Whether to use a 12‑hour or 24‑hour clock.
+     * @default "12"
+     */
+    format: TimepickerFormat;
+    /**
+     * The view used to input time.
+     * @default "hour"
+     */
+    view: TimepickerView;
+    /**
+     * The 12-hour time period.
+     * @default "am"
+     */
+    period: TimepickerPeriod;
+    /**
+     * The minimum time that can be selected.
+     * @default null
+     */
+    minTime: TimeParts | null;
+    /**
+     * The maximum time that can be selected.
+     * @default null
+     */
+    maxTime: TimeParts | null;
+    /** A function used to determine whether a time cannot be selected. */
+    blackoutTimes?: (time: TimeParts) => boolean;
+    /** The hour in 12‑hour time from 1..12. */
+    get hourOfPeriod(): number | null;
+    set hourOfPeriod(value: number | null);
+    /** The current time format. */
+    get currentFormat(): Exclude<TimepickerFormat, "auto">;
+    /** @inheritdoc */
+    protected willUpdate(_changedProperties: PropertyValues<this>): void;
+    /**
+     * Determines whether the given hour is disabled.
+     * @param {number} hour The hour to test.
+     * @returns Whether `hour` is disabled.
+     */
+    isHourDisabled(hour: number): boolean;
+    /**
+     * Determines whether the given minute of an hour is disabled.
+     * @param {number} hour The hour to test.
+     * @param {number} minute The minute to test.
+     * @returns Whether `minute` is disabled for `hour`.
+     */
+    isMinuteDisabled(hour: number, minute: number): boolean;
+}
+//# sourceMappingURL=TimepickerInputElementBase.d.ts.map

package/dist/src/timepicker/TimepickerInputElementBase.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerInputElementBase.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerInputElementBase.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAGjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAiB,SAAS,EAAE,MAAM,SAAS,CAAC;AAEnD,6FAA6F;AAC7F,qBAAa,0BAA2B,SAAQ,UAAU;;IAKxD;;;OAGG;IACH,IAAgC,IAAI,IAAI,MAAM,GAAG,IAAI,CAEpD;IACD,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAE5B;IAED;;;OAGG;IACH,IAAgC,MAAM,IAAI,MAAM,GAAG,IAAI,CAEtD;IACD,IAAI,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAE9B;IAED;;;OAGG;IACS,MAAM,EAAE,gBAAgB,CAAQ;IAE5C;;;OAGG;IACS,IAAI,EAAE,cAAc,CAAU;IAE1C;;;OAGG;IACS,MAAM,EAAE,gBAAgB,CAAQ;IAE5C;;;OAGG;IAC4D,OAAO,EAAE,SAAS,GAAG,IAAI,CAAQ;IAEhG;;;OAGG;IAC4D,OAAO,EAAE,SAAS,GAAG,IAAI,CAAQ;IAEhG,sEAAsE;IAC1D,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;IAEzD,2CAA2C;IAC3C,IAAI,YAAY,IAAI,MAAM,GAAG,IAAI,CAIhC;IACD,IAAI,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAOpC;IAED,+BAA+B;IAC/B,IAAI,aAAa,IAAI,OAAO,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAErD;IAED,kBAAkB;cACC,UAAU,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAuB7E;;;;OAIG;IACH,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAerC;;;;;OAKG;IACH,gBAAgB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO;CAmBxD"}

package/dist/src/timepicker/TimepickerInputPeriodToggleElement.d.ts

@@ -0,0 +1,18 @@
+import { CSSResultGroup, LitElement } from "lit";
+import { TimepickerOrientation } from "./TimepickerOrientation";
+import { TimepickerPeriod } from "./TimepickerPeriod";
+declare const M3eTimepickerInputPeriodToggleElement_base: import("../core/shared/mixins/Constructor").Constructor & typeof LitElement;
+/** @internal An internal element responsible for selecting a time period (AM/PM). */
+export declare class M3eTimepickerInputPeriodToggleElement extends M3eTimepickerInputPeriodToggleElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** The 12-hour time period. */
+    period: TimepickerPeriod;
+    /** The orientation of the toggle. */
+    orientation: Exclude<TimepickerOrientation, "auto">;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+export {};
+//# sourceMappingURL=TimepickerInputPeriodToggleElement.d.ts.map

package/dist/src/timepicker/TimepickerInputPeriodToggleElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerInputPeriodToggleElement.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerInputPeriodToggleElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAa,MAAM,KAAK,CAAC;AAMvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;;AAEtD,qFAAqF;AACrF,qBACa,qCAAsC,SAAQ,0CAA8B;;IACvF,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAgIpC;IAEF,+BAA+B;IACnB,MAAM,EAAE,gBAAgB,CAAQ;IAE5C,qCAAqC;IACR,WAAW,EAAE,OAAO,CAAC,qBAAqB,EAAE,MAAM,CAAC,CAAc;IAE9F,kBAAkB;cACC,MAAM,IAAI,OAAO;CAkGrC"}

package/dist/src/timepicker/TimepickerMode.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the modes in which users can input time using a timepicker. */
+export type TimepickerMode = "dial" | "input";
+//# sourceMappingURL=TimepickerMode.d.ts.map

package/dist/src/timepicker/TimepickerMode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerMode.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerMode.ts"],"names":[],"mappings":"AAAA,4EAA4E;AAC5E,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,CAAC"}

package/dist/src/timepicker/TimepickerOrientation.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the possible layout orientations of a timepicker. */
+export type TimepickerOrientation = "horizontal" | "vertical" | "auto";
+//# sourceMappingURL=TimepickerOrientation.d.ts.map

package/dist/src/timepicker/TimepickerOrientation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerOrientation.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerOrientation.ts"],"names":[],"mappings":"AAAA,kEAAkE;AAClE,MAAM,MAAM,qBAAqB,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CAAC"}

package/dist/src/timepicker/TimepickerPeriod.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Represents the 12‑hour clock period.
+ *
+ * `"am"` indicates the time range from midnight to noon.
+ * `"pm"` indicates the time range from noon to midnight.
+ */
+export type TimepickerPeriod = "am" | "pm";
+//# sourceMappingURL=TimepickerPeriod.d.ts.map

package/dist/src/timepicker/TimepickerPeriod.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerPeriod.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerPeriod.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,CAAC"}

package/dist/src/timepicker/TimepickerToggleElement.d.ts

@@ -0,0 +1,21 @@
+import { ActionElementBase } from "@m3e/web/core";
+declare const M3eTimepickerToggleElement_base: import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").HtmlForMixin> & typeof ActionElementBase;
+/**
+ * An element, nested within a clickable element, used to toggle a timepicker.
+ * @tag m3e-timepicker-toggle
+ */
+export declare class M3eTimepickerToggleElement extends M3eTimepickerToggleElement_base {
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    _onClick(): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-timepicker-toggle": M3eTimepickerToggleElement;
+    }
+}
+export {};
+//# sourceMappingURL=TimepickerToggleElement.d.ts.map

package/dist/src/timepicker/TimepickerToggleElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerToggleElement.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerToggleElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,iBAAiB,EAAW,MAAM,eAAe,CAAC;;AAK1E;;;GAGG;AACH,qBACa,0BAA2B,SAAQ,+BAA0B;IACxE,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAQlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAQrC,kBAAkB;IACT,QAAQ,IAAI,IAAI;CAK1B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,0BAA0B,CAAC;KACrD;CACF"}

package/dist/src/timepicker/TimepickerVariant.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the various appearance variants of a timepicker. */
+export type TimepickerVariant = "docked" | "modal" | "auto";
+//# sourceMappingURL=TimepickerVariant.d.ts.map

package/dist/src/timepicker/TimepickerVariant.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerVariant.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerVariant.ts"],"names":[],"mappings":"AAAA,iEAAiE;AACjE,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC"}

package/dist/src/timepicker/TimepickerView.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the possible views of a timepicker. */
+export type TimepickerView = "hour" | "minute";
+//# sourceMappingURL=TimepickerView.d.ts.map

package/dist/src/timepicker/TimepickerView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimepickerView.d.ts","sourceRoot":"","sources":["../../../src/timepicker/TimepickerView.ts"],"names":[],"mappings":"AAAA,oDAAoD;AACpD,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,QAAQ,CAAC"}

package/dist/src/timepicker/index.d.ts

@@ -0,0 +1,11 @@
+export * from "./TimepickerDialElement";
+export * from "./TimepickerElement";
+export * from "./TimepickerFormat";
+export * from "./TimepickerInputElement";
+export * from "./TimepickerMode";
+export * from "./TimepickerOrientation";
+export * from "./TimepickerPeriod";
+export * from "./TimepickerToggleElement";
+export * from "./TimepickerVariant";
+export * from "./TimepickerView";
+//# sourceMappingURL=index.d.ts.map

package/dist/src/timepicker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/timepicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,kBAAkB,CAAC;AACjC,cAAc,yBAAyB,CAAC;AACxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC"}