luxen-ui 0.1.0

package/dist/elements/dropdown-item/dropdown-item.js

@@ -0,0 +1,110 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m") throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _LuxenDropdownItem_value_accessor_storage, _LuxenDropdownItem_disabled_accessor_storage, _LuxenDropdownItem_type_accessor_storage, _LuxenDropdownItem_checked_accessor_storage;
+import { html, nothing, unsafeCSS } from 'lit';
+import { LuxenElement } from '../../shared/luxen-element';
+import { property } from 'lit/decorators.js';
+import hostStyles from '../../shared/styles/host.styles';
+import rawStyles from './dropdown-item.css?inline';
+const styles = unsafeCSS(rawStyles);
+/**
+ * A menu item for use inside `<l-dropdown>`.
+ *
+ * @slot - Label text.
+ * @slot prefix - Leading content (e.g. icon).
+ * @slot suffix - Trailing content.
+ *
+ * @cssproperty --color - Text color.
+ */
+export class LuxenDropdownItem extends LuxenElement {
+    constructor() {
+        super(...arguments);
+        _LuxenDropdownItem_value_accessor_storage.set(this, '');
+        _LuxenDropdownItem_disabled_accessor_storage.set(this, false);
+        _LuxenDropdownItem_type_accessor_storage.set(this, 'normal');
+        _LuxenDropdownItem_checked_accessor_storage.set(this, false);
+    }
+    /** The value associated with this item. */
+    get value() { return __classPrivateFieldGet(this, _LuxenDropdownItem_value_accessor_storage, "f"); }
+    set value(value) { __classPrivateFieldSet(this, _LuxenDropdownItem_value_accessor_storage, value, "f"); }
+    /** Disables the item. */
+    get disabled() { return __classPrivateFieldGet(this, _LuxenDropdownItem_disabled_accessor_storage, "f"); }
+    set disabled(value) { __classPrivateFieldSet(this, _LuxenDropdownItem_disabled_accessor_storage, value, "f"); }
+    /** The type of item: `normal` or `checkbox`. */
+    get type() { return __classPrivateFieldGet(this, _LuxenDropdownItem_type_accessor_storage, "f"); }
+    set type(value) { __classPrivateFieldSet(this, _LuxenDropdownItem_type_accessor_storage, value, "f"); }
+    /** Whether the checkbox item is checked. */
+    get checked() { return __classPrivateFieldGet(this, _LuxenDropdownItem_checked_accessor_storage, "f"); }
+    set checked(value) { __classPrivateFieldSet(this, _LuxenDropdownItem_checked_accessor_storage, value, "f"); }
+    /** Returns the text label of this item. */
+    getTextLabel() {
+        return (this.textContent ?? '').trim();
+    }
+    render() {
+        const isCheckbox = this.type === 'checkbox';
+        return html `
+      <div
+        class="item"
+        role=${isCheckbox ? 'menuitemcheckbox' : 'menuitem'}
+        aria-checked=${isCheckbox ? String(this.checked) : nothing}
+        aria-disabled=${this.disabled ? 'true' : nothing}
+        tabindex="-1"
+      >
+        ${isCheckbox
+            ? html `
+              <span
+                class="check"
+                aria-hidden="true"
+              >
+                <svg
+                  width="16"
+                  height="16"
+                  viewBox="0 0 16 16"
+                  fill="none"
+                >
+                  <path
+                    d="M3.5 8.5L6.5 11.5L12.5 4.5"
+                    stroke="currentColor"
+                    stroke-width="1.5"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                  />
+                </svg>
+              </span>
+            `
+            : html ` <slot name="prefix"></slot> `}
+        <span class="label"><slot></slot></span>
+        <slot name="suffix"></slot>
+      </div>
+    `;
+    }
+}
+_LuxenDropdownItem_value_accessor_storage = new WeakMap(), _LuxenDropdownItem_disabled_accessor_storage = new WeakMap(), _LuxenDropdownItem_type_accessor_storage = new WeakMap(), _LuxenDropdownItem_checked_accessor_storage = new WeakMap();
+LuxenDropdownItem.styles = [hostStyles, styles];
+__decorate([
+    property()
+], LuxenDropdownItem.prototype, "value", null);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LuxenDropdownItem.prototype, "disabled", null);
+__decorate([
+    property()
+], LuxenDropdownItem.prototype, "type", null);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LuxenDropdownItem.prototype, "checked", null);

package/dist/elements/dropdown-item/index.d.ts

@@ -0,0 +1,8 @@
+import { LuxenDropdownItem } from './dropdown-item';
+export * from './dropdown-item';
+declare global {
+    interface HTMLElementTagNameMap {
+        'l-dropdown-item': LuxenDropdownItem;
+    }
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/dropdown-item/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/html/elements/dropdown-item/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACpD,cAAc,iBAAiB,CAAC;AAGhC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,iBAAiB,CAAC;KACtC;CACF"}

package/dist/elements/dropdown-item/index.js

@@ -0,0 +1,4 @@
+import { define } from '../../define';
+import { LuxenDropdownItem } from './dropdown-item';
+export * from './dropdown-item';
+define('dropdown-item', LuxenDropdownItem);

package/dist/elements/icon/icon.css

@@ -0,0 +1,10 @@
+:host {
+  --color: currentColor;
+
+  display: contents;
+  color: var(--color);
+}
+
+iconify-icon {
+  color: inherit;
+}

package/dist/elements/icon/icon.d.ts

@@ -0,0 +1,19 @@
+import 'iconify-icon';
+import type { PropertyValues } from 'lit';
+import { LuxenElement } from '../../shared/luxen-element';
+/**
+ * @summary An icon component that renders icons from any Iconify icon set. Decorative by default. Set `label` for meaningful icons.
+ * @customElement l-icon
+ *
+ * @cssproperty --color - The color of the icon. Defaults to `currentColor`.
+ */
+export declare class LuxenIcon extends LuxenElement {
+    static styles: import("lit").CSSResult[];
+    /** The icon name in Iconify format (e.g. `mdi:home`, `lucide:check`). */
+    name: string;
+    /** Accessible label. When set, the icon becomes meaningful (`role="img"` + `aria-label`). When absent, the icon is decorative. */
+    label?: string;
+    updated(changedProperties: PropertyValues<this>): void;
+    render(): import("lit").TemplateResult<1>;
+}
+//# sourceMappingURL=icon.d.ts.map

package/dist/elements/icon/icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/html/elements/icon/icon.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAM1D;;;;;GAKG;AACH,qBAAa,SAAU,SAAQ,YAAY;IACzC,OAAgB,MAAM,4BAAwB;IAE9C,yEAAyE;IAEzE,IAAI,SAAM;IAEV,kIAAkI;IAElI,KAAK,CAAC,EAAE,MAAM,CAAC;IAEN,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC;IAY/C,MAAM;CAQhB"}

package/dist/elements/icon/icon.js

@@ -0,0 +1,53 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import 'iconify-icon';
+import { html, unsafeCSS } from 'lit';
+import { property } from 'lit/decorators.js';
+import { LuxenElement } from '../../shared/luxen-element';
+import hostStyles from '../../shared/styles/host.styles';
+import rawStyles from './icon.css?inline';
+const styles = unsafeCSS(rawStyles);
+/**
+ * @summary An icon component that renders icons from any Iconify icon set. Decorative by default. Set `label` for meaningful icons.
+ * @customElement l-icon
+ *
+ * @cssproperty --color - The color of the icon. Defaults to `currentColor`.
+ */
+export class LuxenIcon extends LuxenElement {
+    constructor() {
+        super(...arguments);
+        /** The icon name in Iconify format (e.g. `mdi:home`, `lucide:check`). */
+        this.name = '';
+    }
+    updated(changedProperties) {
+        if (changedProperties.has('label')) {
+            if (this.label) {
+                this.setAttribute('role', 'img');
+                this.setAttribute('aria-label', this.label);
+            }
+            else {
+                this.removeAttribute('role');
+                this.removeAttribute('aria-label');
+            }
+        }
+    }
+    render() {
+        return html `
+      <iconify-icon
+        icon=${this.name}
+        aria-hidden="true"
+      ></iconify-icon>
+    `;
+    }
+}
+LuxenIcon.styles = [hostStyles, styles];
+__decorate([
+    property()
+], LuxenIcon.prototype, "name", void 0);
+__decorate([
+    property()
+], LuxenIcon.prototype, "label", void 0);

package/dist/elements/icon/index.d.ts

@@ -0,0 +1,8 @@
+import { LuxenIcon } from './icon';
+export * from './icon';
+declare global {
+    interface HTMLElementTagNameMap {
+        'l-icon': LuxenIcon;
+    }
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/icon/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/html/elements/icon/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACnC,cAAc,QAAQ,CAAC;AAGvB,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,SAAS,CAAC;KACrB;CACF"}

package/dist/elements/icon/index.js

@@ -0,0 +1,4 @@
+import { define } from '../../define';
+import { LuxenIcon } from './icon';
+export * from './icon';
+define('icon', LuxenIcon);

package/dist/elements/input-otp/index.d.ts

@@ -0,0 +1,8 @@
+import { LuxenInputOtp } from './input-otp';
+export * from './input-otp';
+declare global {
+    interface HTMLElementTagNameMap {
+        'l-input-otp': LuxenInputOtp;
+    }
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/input-otp/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/html/elements/input-otp/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,cAAc,aAAa,CAAC;AAG5B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,aAAa,CAAC;KAC9B;CACF"}

package/dist/elements/input-otp/index.js

@@ -0,0 +1,4 @@
+import { define } from '../../define';
+import { LuxenInputOtp } from './input-otp';
+export * from './input-otp';
+define('input-otp', LuxenInputOtp);

package/dist/elements/input-otp/input-otp.d.ts

@@ -0,0 +1,31 @@
+import { LuxenElement } from '../../shared/luxen-element';
+/**
+ * Enhances a child `<input>` with visual digit cells (Stripe-style OTP input).
+ *
+ * A single hidden `<input>` handles keyboard, paste, and autocomplete.
+ * Visual cells are rendered as real DOM elements with individual borders and focus ring.
+ *
+ * @summary Stripe-style OTP input with visual digit cells over a hidden native input.
+ * @customElement l-input-otp
+ *
+ * @cssproperty --digits - Number of digit boxes (default: 6). Must match input's maxlength.
+ * @cssproperty --size - Cell width and height (default: 2.75rem). Font size scales automatically.
+ * @cssproperty --gap - Space between cells (default: 0.5rem).
+ */
+export declare class LuxenInputOtp extends LuxenElement {
+    createRenderRoot(): this;
+    /** Position after which to insert a visual separator (e.g., 3 for a 3-3 grouping). */
+    separatorAfter?: number;
+    private _input;
+    private _container;
+    private _cells;
+    private _separatorEl;
+    private _initialized;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _setup;
+    private _teardown;
+    private _updateCells;
+    private _clearCells;
+}
+//# sourceMappingURL=input-otp.d.ts.map

package/dist/elements/input-otp/input-otp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-otp.d.ts","sourceRoot":"","sources":["../../../src/html/elements/input-otp/input-otp.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D;;;;;;;;;;;;GAYG;AACH,qBAAa,aAAc,SAAQ,YAAY;IACpC,gBAAgB;IAIzB,sFAAsF;IAEtF,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,OAAO,CAAC,MAAM,CAAoB;IAClC,OAAO,CAAC,UAAU,CAAkB;IACpC,OAAO,CAAC,MAAM,CAAwB;IACtC,OAAO,CAAC,YAAY,CAAgC;IACpD,OAAO,CAAC,YAAY,CAAS;IAEpB,iBAAiB;IAKjB,oBAAoB;IAO7B,OAAO,CAAC,MAAM;IA2Dd,OAAO,CAAC,SAAS;IAoBjB,OAAO,CAAC,YAAY,CAyBlB;IAEF,OAAO,CAAC,WAAW,CAIjB;CACH"}

package/dist/elements/input-otp/input-otp.js

@@ -0,0 +1,139 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { property } from 'lit/decorators.js';
+import { LuxenElement } from '../../shared/luxen-element';
+/**
+ * Enhances a child `<input>` with visual digit cells (Stripe-style OTP input).
+ *
+ * A single hidden `<input>` handles keyboard, paste, and autocomplete.
+ * Visual cells are rendered as real DOM elements with individual borders and focus ring.
+ *
+ * @summary Stripe-style OTP input with visual digit cells over a hidden native input.
+ * @customElement l-input-otp
+ *
+ * @cssproperty --digits - Number of digit boxes (default: 6). Must match input's maxlength.
+ * @cssproperty --size - Cell width and height (default: 2.75rem). Font size scales automatically.
+ * @cssproperty --gap - Space between cells (default: 0.5rem).
+ */
+export class LuxenInputOtp extends LuxenElement {
+    constructor() {
+        super(...arguments);
+        this._cells = [];
+        this._separatorEl = null;
+        this._initialized = false;
+        // --- Cell updates ---
+        this._updateCells = () => {
+            const value = this._input.value;
+            const maxLen = this._input.maxLength || 6;
+            const pos = Math.min(this._input.selectionStart ?? 0, maxLen - 1);
+            const isFocused = document.activeElement === this._input;
+            for (let i = 0; i < this._cells.length; i++) {
+                const cell = this._cells[i];
+                const span = cell.firstElementChild;
+                const char = value[i] ?? '';
+                span.textContent = char;
+                if (char) {
+                    cell.setAttribute('data-filled', '');
+                }
+                else {
+                    cell.removeAttribute('data-filled');
+                }
+                if (isFocused && i === pos) {
+                    cell.setAttribute('data-active', '');
+                }
+                else {
+                    cell.removeAttribute('data-active');
+                }
+            }
+        };
+        this._clearCells = () => {
+            for (const cell of this._cells) {
+                cell.removeAttribute('data-active');
+            }
+        };
+    }
+    createRenderRoot() {
+        return this;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        requestAnimationFrame(() => this._setup());
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this._teardown();
+    }
+    // --- Setup / Teardown ---
+    _setup() {
+        const input = this.querySelector('input');
+        if (!input)
+            return;
+        this._input = input;
+        // Derive digit count from --digits CSS custom property (default 6)
+        const digits = Number(getComputedStyle(this).getPropertyValue('--digits').trim()) || 6;
+        // Set sensible defaults — author can still override via HTML attributes
+        const defaults = {
+            type: 'text',
+            inputmode: 'numeric',
+            autocomplete: 'one-time-code',
+            maxlength: String(digits),
+            pattern: String.raw `\d{${digits}}`,
+        };
+        for (const [attr, value] of Object.entries(defaults)) {
+            if (!this._input.hasAttribute(attr)) {
+                this._input.setAttribute(attr, value);
+            }
+        }
+        // Build visual cells container
+        this._container = document.createElement('div');
+        this._container.className = 'l-input-otp-cells';
+        this._container.setAttribute('aria-hidden', 'true');
+        for (let i = 0; i < digits; i++) {
+            const cell = document.createElement('div');
+            cell.className = 'l-input-otp-cell';
+            cell.appendChild(document.createElement('span'));
+            this._cells.push(cell);
+            this._container.appendChild(cell);
+            // Insert separator after the specified position
+            if (this.separatorAfter && i === this.separatorAfter - 1 && i < digits - 1) {
+                this._separatorEl = document.createElement('span');
+                this._separatorEl.className = 'l-input-otp-separator';
+                this._container.appendChild(this._separatorEl);
+            }
+        }
+        // Wrap: insert container before input, then move input inside
+        this._input.replaceWith(this._container);
+        this._container.appendChild(this._input);
+        this._initialized = true;
+        // Populate cells if input already has a value (e.g. disabled with prefilled value)
+        this._updateCells();
+        // Events
+        this._input.addEventListener('input', this._updateCells);
+        this._input.addEventListener('click', this._updateCells);
+        this._input.addEventListener('keyup', this._updateCells);
+        this._input.addEventListener('focus', this._updateCells);
+        this._input.addEventListener('blur', this._clearCells);
+    }
+    _teardown() {
+        if (!this._initialized)
+            return;
+        this._input.removeEventListener('input', this._updateCells);
+        this._input.removeEventListener('click', this._updateCells);
+        this._input.removeEventListener('keyup', this._updateCells);
+        this._input.removeEventListener('focus', this._updateCells);
+        this._input.removeEventListener('blur', this._clearCells);
+        // Restore input to direct child
+        this._container.replaceWith(this._input);
+        this._separatorEl?.remove();
+        this._cells = [];
+        this._separatorEl = null;
+        this._initialized = false;
+    }
+}
+__decorate([
+    property({ type: Number, reflect: true, attribute: 'separator-after' })
+], LuxenInputOtp.prototype, "separatorAfter", void 0);

package/dist/elements/input-stepper/index.d.ts

@@ -0,0 +1,8 @@
+import { LuxenInputStepper } from './input-stepper';
+export * from './input-stepper';
+declare global {
+    interface HTMLElementTagNameMap {
+        'l-input-stepper': LuxenInputStepper;
+    }
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/input-stepper/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/html/elements/input-stepper/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACpD,cAAc,iBAAiB,CAAC;AAGhC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,iBAAiB,CAAC;KACtC;CACF"}

package/dist/elements/input-stepper/index.js

@@ -0,0 +1,4 @@
+import { define } from '../../define';
+import { LuxenInputStepper } from './input-stepper';
+export * from './input-stepper';
+define('input-stepper', LuxenInputStepper);

package/dist/elements/input-stepper/input-stepper.d.ts

@@ -0,0 +1,63 @@
+import { LuxenElement } from '../../shared/luxen-element';
+export type InputStepperSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/**
+ * A stepper control that enhances a native `<input type="number">` with
+ * decrement/increment buttons and an optional animated number track.
+ *
+ * @link https://www.nngroup.com/articles/input-steppers/
+ *
+ * @example
+ * ```html
+ * <l-input-stepper>
+ *   <input type="number" min="0" max="10" value="5" />
+ * </l-input-stepper>
+ * ```
+ *
+ * @event change - Fired when the value changes. Detail: `{ value: number }`.
+ */
+export declare class LuxenInputStepper extends LuxenElement {
+    createRenderRoot(): this;
+    /** Minimum allowed value. Falls back to the input's `min` attribute. */
+    min?: number;
+    /** Maximum allowed value. Falls back to the input's `max` attribute. */
+    max?: number;
+    /** Step increment. Falls back to the input's `step` attribute. */
+    step?: number;
+    /** Control size. */
+    size: InputStepperSize;
+    /** Enable the animated number roller overlay. */
+    withRoller: boolean;
+    /** Icon name for the decrement button. */
+    decrementIcon: string;
+    /** Icon name for the increment button. */
+    incrementIcon: string;
+    private _input;
+    private _decrementBtn;
+    private _incrementBtn;
+    private _valueWrapper;
+    private _trackDisplay;
+    private _track;
+    private _observer;
+    private _skipTransition;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    /** Decrease the value by one step. */
+    decrement(): void;
+    /** Increase the value by one step. */
+    increment(): void;
+    private _setup;
+    private _teardown;
+    private _createButton;
+    private _buildTrack;
+    private _rebuildTrackNumbers;
+    private _getConstraints;
+    private _syncConstraints;
+    private _applyValue;
+    private _updateTrack;
+    private _updateButtonStates;
+    private _onDecrement;
+    private _onIncrement;
+    private _onInputChange;
+}
+//# sourceMappingURL=input-stepper.d.ts.map

package/dist/elements/input-stepper/input-stepper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-stepper.d.ts","sourceRoot":"","sources":["../../../src/html/elements/input-stepper/input-stepper.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEhE;;;;;;;;;;;;;;GAcG;AACH,qBAAa,iBAAkB,SAAQ,YAAY;IACxC,gBAAgB;IAIzB,wEAAwE;IAExE,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,wEAAwE;IAExE,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,kEAAkE;IAElE,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,oBAAoB;IAEpB,IAAI,EAAE,gBAAgB,CAAQ;IAE9B,iDAAiD;IAEjD,UAAU,UAAS;IAEnB,0CAA0C;IAE1C,aAAa,SAAkB;IAE/B,0CAA0C;IAE1C,aAAa,SAAiB;IAE9B,OAAO,CAAC,MAAM,CAAiC;IAC/C,OAAO,CAAC,aAAa,CAAkC;IACvD,OAAO,CAAC,aAAa,CAAkC;IACvD,OAAO,CAAC,aAAa,CAA+B;IACpD,OAAO,CAAC,aAAa,CAA+B;IACpD,OAAO,CAAC,MAAM,CAA+B;IAC7C,OAAO,CAAC,SAAS,CAAiC;IAClD,OAAO,CAAC,eAAe,CAAS;IAEvB,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAS9C,sCAAsC;IACtC,SAAS;IAOT,sCAAsC;IACtC,SAAS;IAST,OAAO,CAAC,MAAM;IAsCd,OAAO,CAAC,SAAS;IAwBjB,OAAO,CAAC,aAAa;IAQrB,OAAO,CAAC,WAAW;IAenB,OAAO,CAAC,oBAAoB;IAgB5B,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,WAAW;IAUnB,OAAO,CAAC,YAAY;IAmBpB,OAAO,CAAC,mBAAmB;IAa3B,OAAO,CAAC,YAAY,CAA0B;IAC9C,OAAO,CAAC,YAAY,CAA0B;IAE9C,OAAO,CAAC,cAAc,CAWpB;CACH"}