@api-client/ui 0.5.5 → 0.5.6

package/build/src/md/date-picker/ui-date-picker-input.js

@@ -0,0 +1,397 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { LitElement, html } from 'lit';
+import { customElement, property, state, query } from 'lit/decorators.js';
+import { inputStyles } from './internals/DatePicker.styles.js';
+import { formatDate, parseDate } from './internals/DatePickerUtils.js';
+import './internals/DatePickerCalendar.js';
+import '../../md/text-field/ui-outlined-text-field.js';
+import '../../md/icons/ui-icon.js';
+/**
+ * A docked date picker that opens from a text field input.
+ * Ideal for forms and date selection in medium to large layouts.
+ *
+ * ## Usage
+ *
+ * ```html
+ * <ui-date-picker-input
+ *   label="Select date"
+ *   placeholder="MM/DD/YYYY"
+ *   .value=${new Date()}
+ * ></ui-date-picker-input>
+ * ```
+ *
+ * ### Custom date format
+ * ```html
+ * <ui-date-picker-input
+ *   label="Birth date"
+ *   .dateFormat=${date => date.toLocaleDateString('en-GB')}
+ * ></ui-date-picker-input>
+ * ```
+ */
+let UiDatePickerInput = (() => {
+    let _classDecorators = [customElement('ui-date-picker-input')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = LitElement;
+    let _label_decorators;
+    let _label_initializers = [];
+    let _label_extraInitializers = [];
+    let _placeholder_decorators;
+    let _placeholder_initializers = [];
+    let _placeholder_extraInitializers = [];
+    let _value_decorators;
+    let _value_initializers = [];
+    let _value_extraInitializers = [];
+    let _disabled_decorators;
+    let _disabled_initializers = [];
+    let _disabled_extraInitializers = [];
+    let _required_decorators;
+    let _required_initializers = [];
+    let _required_extraInitializers = [];
+    let _errorMessage_decorators;
+    let _errorMessage_initializers = [];
+    let _errorMessage_extraInitializers = [];
+    let _error_decorators;
+    let _error_initializers = [];
+    let _error_extraInitializers = [];
+    let _minDate_decorators;
+    let _minDate_initializers = [];
+    let _minDate_extraInitializers = [];
+    let _maxDate_decorators;
+    let _maxDate_initializers = [];
+    let _maxDate_extraInitializers = [];
+    let _disabledDates_decorators;
+    let _disabledDates_initializers = [];
+    let _disabledDates_extraInitializers = [];
+    let _locale_decorators;
+    let _locale_initializers = [];
+    let _locale_extraInitializers = [];
+    let _dateFormat_decorators;
+    let _dateFormat_initializers = [];
+    let _dateFormat_extraInitializers = [];
+    let __isOpen_decorators;
+    let __isOpen_initializers = [];
+    let __isOpen_extraInitializers = [];
+    let __inputValue_decorators;
+    let __inputValue_initializers = [];
+    let __inputValue_extraInitializers = [];
+    let __textField_decorators;
+    let __textField_initializers = [];
+    let __textField_extraInitializers = [];
+    var UiDatePickerInput = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _label_decorators = [property({ type: String })];
+            _placeholder_decorators = [property({ type: String })];
+            _value_decorators = [property({ type: Object })];
+            _disabled_decorators = [property({ type: Boolean })];
+            _required_decorators = [property({ type: Boolean })];
+            _errorMessage_decorators = [property({ type: String })];
+            _error_decorators = [property({ type: Boolean })];
+            _minDate_decorators = [property({ type: Object })];
+            _maxDate_decorators = [property({ type: Object })];
+            _disabledDates_decorators = [property({ type: Array })];
+            _locale_decorators = [property({ type: String })];
+            _dateFormat_decorators = [property({ type: Object })];
+            __isOpen_decorators = [state()];
+            __inputValue_decorators = [state()];
+            __textField_decorators = [query('ui-outlined-text-field')];
+            __esDecorate(this, null, _label_decorators, { kind: "accessor", name: "label", static: false, private: false, access: { has: obj => "label" in obj, get: obj => obj.label, set: (obj, value) => { obj.label = value; } }, metadata: _metadata }, _label_initializers, _label_extraInitializers);
+            __esDecorate(this, null, _placeholder_decorators, { kind: "accessor", name: "placeholder", static: false, private: false, access: { has: obj => "placeholder" in obj, get: obj => obj.placeholder, set: (obj, value) => { obj.placeholder = value; } }, metadata: _metadata }, _placeholder_initializers, _placeholder_extraInitializers);
+            __esDecorate(this, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
+            __esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
+            __esDecorate(this, null, _required_decorators, { kind: "accessor", name: "required", static: false, private: false, access: { has: obj => "required" in obj, get: obj => obj.required, set: (obj, value) => { obj.required = value; } }, metadata: _metadata }, _required_initializers, _required_extraInitializers);
+            __esDecorate(this, null, _errorMessage_decorators, { kind: "accessor", name: "errorMessage", static: false, private: false, access: { has: obj => "errorMessage" in obj, get: obj => obj.errorMessage, set: (obj, value) => { obj.errorMessage = value; } }, metadata: _metadata }, _errorMessage_initializers, _errorMessage_extraInitializers);
+            __esDecorate(this, null, _error_decorators, { kind: "accessor", name: "error", static: false, private: false, access: { has: obj => "error" in obj, get: obj => obj.error, set: (obj, value) => { obj.error = value; } }, metadata: _metadata }, _error_initializers, _error_extraInitializers);
+            __esDecorate(this, null, _minDate_decorators, { kind: "accessor", name: "minDate", static: false, private: false, access: { has: obj => "minDate" in obj, get: obj => obj.minDate, set: (obj, value) => { obj.minDate = value; } }, metadata: _metadata }, _minDate_initializers, _minDate_extraInitializers);
+            __esDecorate(this, null, _maxDate_decorators, { kind: "accessor", name: "maxDate", static: false, private: false, access: { has: obj => "maxDate" in obj, get: obj => obj.maxDate, set: (obj, value) => { obj.maxDate = value; } }, metadata: _metadata }, _maxDate_initializers, _maxDate_extraInitializers);
+            __esDecorate(this, null, _disabledDates_decorators, { kind: "accessor", name: "disabledDates", static: false, private: false, access: { has: obj => "disabledDates" in obj, get: obj => obj.disabledDates, set: (obj, value) => { obj.disabledDates = value; } }, metadata: _metadata }, _disabledDates_initializers, _disabledDates_extraInitializers);
+            __esDecorate(this, null, _locale_decorators, { kind: "accessor", name: "locale", static: false, private: false, access: { has: obj => "locale" in obj, get: obj => obj.locale, set: (obj, value) => { obj.locale = value; } }, metadata: _metadata }, _locale_initializers, _locale_extraInitializers);
+            __esDecorate(this, null, _dateFormat_decorators, { kind: "accessor", name: "dateFormat", static: false, private: false, access: { has: obj => "dateFormat" in obj, get: obj => obj.dateFormat, set: (obj, value) => { obj.dateFormat = value; } }, metadata: _metadata }, _dateFormat_initializers, _dateFormat_extraInitializers);
+            __esDecorate(this, null, __isOpen_decorators, { kind: "accessor", name: "_isOpen", static: false, private: false, access: { has: obj => "_isOpen" in obj, get: obj => obj._isOpen, set: (obj, value) => { obj._isOpen = value; } }, metadata: _metadata }, __isOpen_initializers, __isOpen_extraInitializers);
+            __esDecorate(this, null, __inputValue_decorators, { kind: "accessor", name: "_inputValue", static: false, private: false, access: { has: obj => "_inputValue" in obj, get: obj => obj._inputValue, set: (obj, value) => { obj._inputValue = value; } }, metadata: _metadata }, __inputValue_initializers, __inputValue_extraInitializers);
+            __esDecorate(this, null, __textField_decorators, { kind: "accessor", name: "_textField", static: false, private: false, access: { has: obj => "_textField" in obj, get: obj => obj._textField, set: (obj, value) => { obj._textField = value; } }, metadata: _metadata }, __textField_initializers, __textField_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            UiDatePickerInput = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        static styles = inputStyles;
+        static shadowRootOptions = {
+            mode: 'open',
+            delegatesFocus: true,
+        };
+        #label_accessor_storage = __runInitializers(this, _label_initializers, ''
+        /**
+         * Placeholder text for the input
+         */
+        );
+        /**
+         * The label for the input field
+         */
+        get label() { return this.#label_accessor_storage; }
+        set label(value) { this.#label_accessor_storage = value; }
+        #placeholder_accessor_storage = (__runInitializers(this, _label_extraInitializers), __runInitializers(this, _placeholder_initializers, 'MM/DD/YYYY'
+        /**
+         * The currently selected date
+         */
+        ));
+        /**
+         * Placeholder text for the input
+         */
+        get placeholder() { return this.#placeholder_accessor_storage; }
+        set placeholder(value) { this.#placeholder_accessor_storage = value; }
+        #value_accessor_storage = (__runInitializers(this, _placeholder_extraInitializers), __runInitializers(this, _value_initializers, null
+        /**
+         * Whether the date picker is disabled
+         */
+        ));
+        /**
+         * The currently selected date
+         */
+        get value() { return this.#value_accessor_storage; }
+        set value(value) { this.#value_accessor_storage = value; }
+        #disabled_accessor_storage = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _disabled_initializers, false
+        /**
+         * Whether the input is required
+         */
+        ));
+        /**
+         * Whether the date picker is disabled
+         */
+        get disabled() { return this.#disabled_accessor_storage; }
+        set disabled(value) { this.#disabled_accessor_storage = value; }
+        #required_accessor_storage = (__runInitializers(this, _disabled_extraInitializers), __runInitializers(this, _required_initializers, false
+        /**
+         * Error message to display
+         */
+        ));
+        /**
+         * Whether the input is required
+         */
+        get required() { return this.#required_accessor_storage; }
+        set required(value) { this.#required_accessor_storage = value; }
+        #errorMessage_accessor_storage = (__runInitializers(this, _required_extraInitializers), __runInitializers(this, _errorMessage_initializers, ''
+        /**
+         * Whether the input has an error state
+         */
+        ));
+        /**
+         * Error message to display
+         */
+        get errorMessage() { return this.#errorMessage_accessor_storage; }
+        set errorMessage(value) { this.#errorMessage_accessor_storage = value; }
+        #error_accessor_storage = (__runInitializers(this, _errorMessage_extraInitializers), __runInitializers(this, _error_initializers, false
+        /**
+         * Minimum selectable date
+         */
+        ));
+        /**
+         * Whether the input has an error state
+         */
+        get error() { return this.#error_accessor_storage; }
+        set error(value) { this.#error_accessor_storage = value; }
+        #minDate_accessor_storage = (__runInitializers(this, _error_extraInitializers), __runInitializers(this, _minDate_initializers, undefined
+        /**
+         * Maximum selectable date
+         */
+        ));
+        /**
+         * Minimum selectable date
+         */
+        get minDate() { return this.#minDate_accessor_storage; }
+        set minDate(value) { this.#minDate_accessor_storage = value; }
+        #maxDate_accessor_storage = (__runInitializers(this, _minDate_extraInitializers), __runInitializers(this, _maxDate_initializers, undefined
+        /**
+         * Array of disabled dates
+         */
+        ));
+        /**
+         * Maximum selectable date
+         */
+        get maxDate() { return this.#maxDate_accessor_storage; }
+        set maxDate(value) { this.#maxDate_accessor_storage = value; }
+        #disabledDates_accessor_storage = (__runInitializers(this, _maxDate_extraInitializers), __runInitializers(this, _disabledDates_initializers, undefined
+        /**
+         * Locale for date formatting
+         */
+        ));
+        /**
+         * Array of disabled dates
+         */
+        get disabledDates() { return this.#disabledDates_accessor_storage; }
+        set disabledDates(value) { this.#disabledDates_accessor_storage = value; }
+        #locale_accessor_storage = (__runInitializers(this, _disabledDates_extraInitializers), __runInitializers(this, _locale_initializers, undefined
+        /**
+         * Custom date format function
+         */
+        ));
+        /**
+         * Locale for date formatting
+         */
+        get locale() { return this.#locale_accessor_storage; }
+        set locale(value) { this.#locale_accessor_storage = value; }
+        #dateFormat_accessor_storage = (__runInitializers(this, _locale_extraInitializers), __runInitializers(this, _dateFormat_initializers, undefined));
+        /**
+         * Custom date format function
+         */
+        get dateFormat() { return this.#dateFormat_accessor_storage; }
+        set dateFormat(value) { this.#dateFormat_accessor_storage = value; }
+        #_isOpen_accessor_storage = (__runInitializers(this, _dateFormat_extraInitializers), __runInitializers(this, __isOpen_initializers, false));
+        get _isOpen() { return this.#_isOpen_accessor_storage; }
+        set _isOpen(value) { this.#_isOpen_accessor_storage = value; }
+        #_inputValue_accessor_storage = (__runInitializers(this, __isOpen_extraInitializers), __runInitializers(this, __inputValue_initializers, ''));
+        get _inputValue() { return this.#_inputValue_accessor_storage; }
+        set _inputValue(value) { this.#_inputValue_accessor_storage = value; }
+        #_textField_accessor_storage = (__runInitializers(this, __inputValue_extraInitializers), __runInitializers(this, __textField_initializers, void 0));
+        get _textField() { return this.#_textField_accessor_storage; }
+        set _textField(value) { this.#_textField_accessor_storage = value; }
+        connectedCallback() {
+            super.connectedCallback();
+            this._updateInputValue();
+            document.addEventListener('click', this._handleDocumentClick.bind(this));
+        }
+        disconnectedCallback() {
+            super.disconnectedCallback();
+            document.removeEventListener('click', this._handleDocumentClick.bind(this));
+        }
+        willUpdate(changedProperties) {
+            if (changedProperties.has('value')) {
+                this._updateInputValue();
+            }
+        }
+        updated(changedProperties) {
+            if (changedProperties.has('_isOpen') && this._isOpen) {
+                // Set anchor name on text field for CSS Anchor Positioning API
+                if (this._textField) {
+                    // Using setProperty since anchorName is not in TypeScript types yet
+                    this._textField.style.setProperty('anchor-name', '--ui-date-picker-anchor');
+                }
+            }
+        }
+        _updateInputValue() {
+            if (this.value) {
+                this._inputValue = this.dateFormat ? this.dateFormat(this.value) : formatDate(this.value, this.locale);
+            }
+            else {
+                this._inputValue = '';
+            }
+        }
+        _handleDocumentClick(event) {
+            if (!this.contains(event.target)) {
+                this._isOpen = false;
+            }
+        }
+        _handleInputClick() {
+            if (!this.disabled) {
+                this._isOpen = !this._isOpen;
+            }
+        }
+        _handleInputChange(event) {
+            const target = event.target;
+            this._inputValue = target.value;
+            const parsedDate = parseDate(this._inputValue);
+            if (parsedDate) {
+                this.value = parsedDate;
+                this._dispatchChangeEvent();
+            }
+        }
+        _handleCalendarDateSelect(event) {
+            this.value = event.detail.date;
+            this._isOpen = false;
+            this._dispatchChangeEvent();
+        }
+        _handleCalendarDateCancel() {
+            this._isOpen = false;
+        }
+        _handleKeyDown(event) {
+            switch (event.key) {
+                case 'Escape':
+                    this._isOpen = false;
+                    break;
+                case 'ArrowDown':
+                    if (!this._isOpen) {
+                        event.preventDefault();
+                        this._isOpen = true;
+                    }
+                    break;
+                case 'Enter':
+                    if (this._isOpen) {
+                        event.preventDefault();
+                        this._isOpen = false;
+                    }
+                    break;
+            }
+        }
+        _dispatchChangeEvent() {
+            this.dispatchEvent(new CustomEvent('change', {
+                detail: {
+                    value: this.value,
+                    formattedValue: this._inputValue,
+                },
+                bubbles: true,
+                composed: true,
+            }));
+        }
+        _renderCalendarIcon() {
+            return html `
+      <ui-icon slot="suffix" icon="calendarToday" @click=${this._handleInputClick} style="cursor: pointer;"></ui-icon>
+    `;
+        }
+        _renderDropdown() {
+            if (!this._isOpen)
+                return null;
+            const currentDate = this.value || new Date();
+            return html `
+      <div class="dropdown-container">
+        <ui-date-picker-calendar
+          .year=${currentDate.getFullYear()}
+          .month=${currentDate.getMonth()}
+          .selectedDate=${this.value}
+          .minDate=${this.minDate}
+          .maxDate=${this.maxDate}
+          .disabledDates=${this.disabledDates}
+          .locale=${this.locale}
+          showActions
+          @date-select=${this._handleCalendarDateSelect}
+          @date-cancel=${this._handleCalendarDateCancel}
+        ></ui-date-picker-calendar>
+      </div>
+    `;
+        }
+        render() {
+            return html `
+      <div class="input-container">
+        ${this._isOpen ? html `<div class="backdrop" @click=${() => (this._isOpen = false)}></div>` : ''}
+        <ui-outlined-text-field
+          .label=${this.label}
+          .placeholder=${this.placeholder}
+          .value=${this._inputValue}
+          .disabled=${this.disabled}
+          .required=${this.required}
+          .errorMessage=${this.errorMessage}
+          .error=${this.error}
+          readonly
+          @click=${this._handleInputClick}
+          @input=${this._handleInputChange}
+          @keydown=${this._handleKeyDown}
+        >
+          ${this._renderCalendarIcon()}
+        </ui-outlined-text-field>
+        ${this._renderDropdown()}
+      </div>
+    `;
+        }
+        constructor() {
+            super(...arguments);
+            __runInitializers(this, __textField_extraInitializers);
+        }
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return UiDatePickerInput = _classThis;
+})();
+export { UiDatePickerInput };
+//# sourceMappingURL=ui-date-picker-input.js.map

package/build/src/md/date-picker/ui-date-picker-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-date-picker-input.js","sourceRoot":"","sources":["../../../../src/md/date-picker/ui-date-picker-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, TemplateResult } from 'lit'\nimport { customElement, property, state, query } from 'lit/decorators.js'\nimport { inputStyles } from './internals/DatePicker.styles.js'\nimport { formatDate, parseDate } from './internals/DatePickerUtils.js'\nimport type { DateSelectEvent } from './internals/DatePickerCalendar.js'\nimport './internals/DatePickerCalendar.js'\nimport '../../md/text-field/ui-outlined-text-field.js'\nimport '../../md/icons/ui-icon.js'\n\n/**\n * A docked date picker that opens from a text field input.\n * Ideal for forms and date selection in medium to large layouts.\n *\n * ## Usage\n *\n * ```html\n * <ui-date-picker-input\n *   label=\"Select date\"\n *   placeholder=\"MM/DD/YYYY\"\n *   .value=${new Date()}\n * ></ui-date-picker-input>\n * ```\n *\n * ### Custom date format\n * ```html\n * <ui-date-picker-input\n *   label=\"Birth date\"\n *   .dateFormat=${date => date.toLocaleDateString('en-GB')}\n * ></ui-date-picker-input>\n * ```\n */\n@customElement('ui-date-picker-input')\nexport class UiDatePickerInput extends LitElement {\n  static override styles = inputStyles\n  static override shadowRootOptions: ShadowRootInit = {\n    mode: 'open',\n    delegatesFocus: true,\n  }\n\n  /**\n   * The label for the input field\n   */\n  @property({ type: String }) accessor label = ''\n\n  /**\n   * Placeholder text for the input\n   */\n  @property({ type: String }) accessor placeholder = 'MM/DD/YYYY'\n\n  /**\n   * The currently selected date\n   */\n  @property({ type: Object }) accessor value: Date | null = null\n\n  /**\n   * Whether the date picker is disabled\n   */\n  @property({ type: Boolean }) accessor disabled = false\n\n  /**\n   * Whether the input is required\n   */\n  @property({ type: Boolean }) accessor required = false\n\n  /**\n   * Error message to display\n   */\n  @property({ type: String }) accessor errorMessage = ''\n\n  /**\n   * Whether the input has an error state\n   */\n  @property({ type: Boolean }) accessor error = false\n\n  /**\n   * Minimum selectable date\n   */\n  @property({ type: Object }) accessor minDate: Date | undefined = undefined\n\n  /**\n   * Maximum selectable date\n   */\n  @property({ type: Object }) accessor maxDate: Date | undefined = undefined\n\n  /**\n   * Array of disabled dates\n   */\n  @property({ type: Array }) accessor disabledDates: Date[] | undefined = undefined\n\n  /**\n   * Locale for date formatting\n   */\n  @property({ type: String }) accessor locale: string | undefined = undefined\n\n  /**\n   * Custom date format function\n   */\n  @property({ type: Object }) accessor dateFormat: ((date: Date) => string) | undefined = undefined\n\n  @state() private accessor _isOpen = false\n\n  @state() private accessor _inputValue = ''\n\n  @query('ui-outlined-text-field') private accessor _textField!: HTMLElement\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    this._updateInputValue()\n    document.addEventListener('click', this._handleDocumentClick.bind(this))\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback()\n    document.removeEventListener('click', this._handleDocumentClick.bind(this))\n  }\n\n  override willUpdate(changedProperties: Map<string | number | symbol, unknown>): void {\n    if (changedProperties.has('value')) {\n      this._updateInputValue()\n    }\n  }\n\n  override updated(changedProperties: Map<string | number | symbol, unknown>): void {\n    if (changedProperties.has('_isOpen') && this._isOpen) {\n      // Set anchor name on text field for CSS Anchor Positioning API\n      if (this._textField) {\n        // Using setProperty since anchorName is not in TypeScript types yet\n        this._textField.style.setProperty('anchor-name', '--ui-date-picker-anchor')\n      }\n    }\n  }\n\n  private _updateInputValue(): void {\n    if (this.value) {\n      this._inputValue = this.dateFormat ? this.dateFormat(this.value) : formatDate(this.value, this.locale)\n    } else {\n      this._inputValue = ''\n    }\n  }\n\n  private _handleDocumentClick(event: Event): void {\n    if (!this.contains(event.target as Node)) {\n      this._isOpen = false\n    }\n  }\n\n  private _handleInputClick(): void {\n    if (!this.disabled) {\n      this._isOpen = !this._isOpen\n    }\n  }\n\n  private _handleInputChange(event: Event): void {\n    const target = event.target as HTMLInputElement\n    this._inputValue = target.value\n\n    const parsedDate = parseDate(this._inputValue)\n    if (parsedDate) {\n      this.value = parsedDate\n      this._dispatchChangeEvent()\n    }\n  }\n\n  private _handleCalendarDateSelect(event: CustomEvent<DateSelectEvent>): void {\n    this.value = event.detail.date\n    this._isOpen = false\n    this._dispatchChangeEvent()\n  }\n\n  private _handleCalendarDateCancel(): void {\n    this._isOpen = false\n  }\n\n  private _handleKeyDown(event: KeyboardEvent): void {\n    switch (event.key) {\n      case 'Escape':\n        this._isOpen = false\n        break\n      case 'ArrowDown':\n        if (!this._isOpen) {\n          event.preventDefault()\n          this._isOpen = true\n        }\n        break\n      case 'Enter':\n        if (this._isOpen) {\n          event.preventDefault()\n          this._isOpen = false\n        }\n        break\n    }\n  }\n\n  private _dispatchChangeEvent(): void {\n    this.dispatchEvent(\n      new CustomEvent('change', {\n        detail: {\n          value: this.value,\n          formattedValue: this._inputValue,\n        },\n        bubbles: true,\n        composed: true,\n      })\n    )\n  }\n\n  private _renderCalendarIcon(): TemplateResult {\n    return html`\n      <ui-icon slot=\"suffix\" icon=\"calendarToday\" @click=${this._handleInputClick} style=\"cursor: pointer;\"></ui-icon>\n    `\n  }\n\n  private _renderDropdown(): TemplateResult | null {\n    if (!this._isOpen) return null\n\n    const currentDate = this.value || new Date()\n\n    return html`\n      <div class=\"dropdown-container\">\n        <ui-date-picker-calendar\n          .year=${currentDate.getFullYear()}\n          .month=${currentDate.getMonth()}\n          .selectedDate=${this.value}\n          .minDate=${this.minDate}\n          .maxDate=${this.maxDate}\n          .disabledDates=${this.disabledDates}\n          .locale=${this.locale}\n          showActions\n          @date-select=${this._handleCalendarDateSelect}\n          @date-cancel=${this._handleCalendarDateCancel}\n        ></ui-date-picker-calendar>\n      </div>\n    `\n  }\n\n  override render(): TemplateResult {\n    return html`\n      <div class=\"input-container\">\n        ${this._isOpen ? html`<div class=\"backdrop\" @click=${() => (this._isOpen = false)}></div>` : ''}\n        <ui-outlined-text-field\n          .label=${this.label}\n          .placeholder=${this.placeholder}\n          .value=${this._inputValue}\n          .disabled=${this.disabled}\n          .required=${this.required}\n          .errorMessage=${this.errorMessage}\n          .error=${this.error}\n          readonly\n          @click=${this._handleInputClick}\n          @input=${this._handleInputChange}\n          @keydown=${this._handleKeyDown}\n        >\n          ${this._renderCalendarIcon()}\n        </ui-outlined-text-field>\n        ${this._renderDropdown()}\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ui-date-picker-input': UiDatePickerInput\n  }\n\n  interface HTMLElementEventMap {\n    change: CustomEvent<{\n      value: Date | null\n      formattedValue: string\n    }>\n  }\n}\n"]}

package/build/src/md/date-picker/ui-date-picker-modal-input.d.ts

@@ -0,0 +1,119 @@
+import { LitElement, TemplateResult } from 'lit';
+import { DateRange } from './internals/DatePickerUtils.js';
+import '../../md/dialog/ui-dialog.js';
+import '../../md/button/ui-button.js';
+import '../../md/icon-button/ui-icon-button.js';
+import '../../md/text-field/ui-outlined-text-field.js';
+import '../../md/icons/ui-icon.js';
+export interface ModalInputDatePickerChangeEvent {
+    range: DateRange;
+    formattedRange: {
+        start: string | null;
+        end: string | null;
+    };
+}
+/**
+ * A modal date input picker for manual date entry using keyboard.
+ * Ideal for compact layouts and precise date entry.
+ *
+ * ## Usage
+ *
+ * ```html
+ * <ui-date-picker-modal-input
+ *   .open=${true}
+ *   .selectedRange=${{ start: new Date(), end: null }}
+ *   @date-input-change=${this.handleRangeChange}
+ *   @close=${this.handleClose}
+ * ></ui-date-picker-modal-input>
+ * ```
+ *
+ * ### Single date mode
+ * ```html
+ * <ui-date-picker-modal-input
+ *   .rangeMode=${false}
+ *   .selectedDate=${new Date()}
+ * ></ui-date-picker-modal-input>
+ * ```
+ */
+export declare class UiDatePickerModalInput extends LitElement {
+    static styles: import("lit").CSSResult;
+    /**
+     * Whether the modal is open
+     */
+    accessor open: boolean;
+    /**
+     * The modal title
+     */
+    accessor title: string;
+    /**
+     * Whether to use range mode (two date inputs) or single date mode
+     */
+    accessor rangeMode: boolean;
+    /**
+     * Label for the start date (or single date)
+     */
+    accessor startLabel: string;
+    /**
+     * Label for the end date (only used in range mode)
+     */
+    accessor endLabel: string;
+    /**
+     * Placeholder for date inputs
+     */
+    accessor placeholder: string;
+    /**
+     * The selected date (single mode)
+     */
+    accessor selectedDate: Date | null;
+    /**
+     * The selected date range (range mode)
+     */
+    accessor selectedRange: DateRange | null;
+    /**
+     * Minimum selectable date
+     */
+    accessor minDate: Date | undefined;
+    /**
+     * Maximum selectable date
+     */
+    accessor maxDate: Date | undefined;
+    /**
+     * Locale for date formatting
+     */
+    accessor locale: string | undefined;
+    private accessor _startInput;
+    private accessor _endInput;
+    private accessor _startError;
+    private accessor _endError;
+    connectedCallback(): void;
+    willUpdate(changedProperties: Map<string | number | symbol, unknown>): void;
+    private _updateInputValues;
+    private _validateDate;
+    private _handleStartInput;
+    private _handleEndInput;
+    private _handleCancel;
+    private _handleConfirm;
+    private _dispatchChangeEvent;
+    private _dispatchCloseEvent;
+    private _renderHeader;
+    private _renderInputs;
+    private _renderActions;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ui-date-picker-modal-input': UiDatePickerModalInput;
+    }
+    interface HTMLElementEventMap {
+        'date-input-change': CustomEvent<ModalInputDatePickerChangeEvent | {
+            date: Date;
+            formattedDate: string;
+        }>;
+        'modal-input-close': CustomEvent<{
+            confirmed: boolean;
+            date?: Date | null;
+            range?: DateRange | null;
+        }>;
+    }
+}
+//# sourceMappingURL=ui-date-picker-modal-input.d.ts.map

package/build/src/md/date-picker/ui-date-picker-modal-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-date-picker-modal-input.d.ts","sourceRoot":"","sources":["../../../../src/md/date-picker/ui-date-picker-modal-input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAA;AAGtD,OAAO,EAAE,SAAS,EAAyB,MAAM,gCAAgC,CAAA;AACjF,OAAO,8BAA8B,CAAA;AACrC,OAAO,8BAA8B,CAAA;AACrC,OAAO,wCAAwC,CAAA;AAC/C,OAAO,+CAA+C,CAAA;AACtD,OAAO,2BAA2B,CAAA;AAElC,MAAM,WAAW,+BAA+B;IAC9C,KAAK,EAAE,SAAS,CAAA;IAChB,cAAc,EAAE;QACd,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;QACpB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAA;KACnB,CAAA;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBACa,sBAAuB,SAAQ,UAAU;IACpD,OAAgB,MAAM,0BAAc;IAEpC;;OAEG;IAC0B,QAAQ,CAAC,IAAI,UAAQ;IAElD;;OAEG;IACH,SAA8C,KAAK,SAAgB;IAEnE;;OAEG;IAC0B,QAAQ,CAAC,SAAS,UAAO;IAEtD;;OAEG;IACyB,QAAQ,CAAC,UAAU,SAAe;IAE9D;;OAEG;IACyB,QAAQ,CAAC,QAAQ,SAAa;IAE1D;;OAEG;IACyB,QAAQ,CAAC,WAAW,SAAe;IAE/D;;OAEG;IACyB,QAAQ,CAAC,YAAY,EAAE,IAAI,GAAG,IAAI,CAAO;IAErE;;OAEG;IACyB,QAAQ,CAAC,aAAa,EAAE,SAAS,GAAG,IAAI,CAAO;IAE3E;;OAEG;IACyB,QAAQ,CAAC,OAAO,EAAE,IAAI,GAAG,SAAS,CAAY;IAE1E;;OAEG;IACyB,QAAQ,CAAC,OAAO,EAAE,IAAI,GAAG,SAAS,CAAY;IAE1E;;OAEG;IACyB,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAY;IAElE,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAK;IAEjC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAK;IAE/B,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAK;IAEjC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAK;IAE/B,iBAAiB,IAAI,IAAI;IAKzB,UAAU,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAMpF,OAAO,CAAC,kBAAkB;IAS1B,OAAO,CAAC,aAAa;IAmBrB,OAAO,CAAC,iBAAiB;IAuBzB,OAAO,CAAC,eAAe;IAkBvB,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,cAAc;IAmCtB,OAAO,CAAC,oBAAoB;IA+B5B,OAAO,CAAC,mBAAmB;IAc3B,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,aAAa;IA8CrB,OAAO,CAAC,cAAc;IAab,MAAM,IAAI,cAAc;CAOlC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,4BAA4B,EAAE,sBAAsB,CAAA;KACrD;IAED,UAAU,mBAAmB;QAC3B,mBAAmB,EAAE,WAAW,CAC5B,+BAA+B,GAC/B;YACE,IAAI,EAAE,IAAI,CAAA;YACV,aAAa,EAAE,MAAM,CAAA;SACtB,CACJ,CAAA;QACD,mBAAmB,EAAE,WAAW,CAAC;YAC/B,SAAS,EAAE,OAAO,CAAA;YAClB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;YAClB,KAAK,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;SACzB,CAAC,CAAA;KACH;CACF"}