aeico-components 0.1.5 → 0.1.7

package/dist/chunks/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sources":["../../src/select/select.ts"],"sourcesContent":["import AeicoField from '../aeico-field';\nimport type { InferProps } from 'aeico';\nimport { html, tags } from 'aeico';\nimport { t } from 'aeico-localize';\nimport type {\n  SelectOptionValue,\n  SelectOption,\n  SelectOptions,\n  SelectPosition,\n  SelectMultiValue,\n} from './defines';\nimport style from '../styles/components/select.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport sizeCSS from '../styles/size.css?inline';\nimport SelectOptionElement from './select-option';\nimport '../tag/tag';\nimport { prop } from 'aeico';\n\n/**\n * Select component supporting single and multi-select modes, with options provided via both props and slots.\n * - `options` prop accepts an array of strings or objects with `value` and `label` for programmatic options.\n * - Slot content allows for declarative options using `<ae-select-option>` elements.\n * @example\n * <ae-select placeholder=\"Choose an option\" position=\"bottom\">\n *   <ae-select-option value=\"1\" label=\"Option 1\">Option 1</ae-select-option>\n *   <ae-select-option value=\"2\" label=\"Option 2\">Option 2</ae-select-option>\n * </ae-select>\n *\n */\nclass Select extends AeicoField<SelectOptionValue | SelectMultiValue> {\n  protected fieldElement = null;\n  private _isOpen = false;\n  private _triggerEl: HTMLElement | null = null;\n  private _dropdownEl: HTMLElement | null = null;\n  private _slotEl: HTMLSlotElement | null = null;\n  private _slotOptionData: Array<{ value: string; label: string }> = [];\n  private _selectedListEl: HTMLElement | null = null;\n\n  static tagName = 'select';\n\n  @prop({ type: Boolean, observe: false, reflect: false })\n  accessor _expanded: boolean = false;\n\n  @prop({ type: Array })\n  accessor options: SelectOptions | undefined;\n\n  @prop({ type: String })\n  accessor position: SelectPosition | undefined;\n\n  @prop({ type: String })\n  accessor placeholder: string | undefined;\n\n  @prop({ type: Boolean })\n  accessor multiple: boolean = false;\n\n  @prop({ type: Boolean })\n  accessor expandable: boolean = false;\n\n  // Override base class value prop to support both string and array (multi-select).\n  // Uses field decorator (not accessor) because TypeScript TS2611 disallows overriding\n  // a parent class data property (declare value?) with an accessor in a subclass.\n  @prop({\n    type: String,\n    parser: (v) => {\n      if (v === null || v === undefined) return undefined;\n      try {\n        return JSON.parse(v);\n      } catch {\n        return v;\n      }\n    },\n    formatter: (v) => {\n      if (v === null || v === undefined) return '';\n      if (Array.isArray(v)) return JSON.stringify(v);\n      // eslint-disable-next-line @typescript-eslint/no-base-to-string\n      return String(v);\n    },\n  })\n  override value: SelectOptionValue | SelectMultiValue | undefined = undefined;\n\n  // Override base class defaultValue so arrays are JSON-serialized to the attribute,\n  // matching the value prop's parser/formatter. Without this override, setting\n  // defaultValue = ['a', 'b'] would be serialized as String(['a','b']) = \"a,b\",\n  // and reset() would restore a single string \"a,b\" instead of the array.\n  @prop({\n    type: String,\n    parser: (v) => {\n      if (v === null || v === undefined) return undefined;\n      try {\n        return JSON.parse(v);\n      } catch {\n        return v;\n      }\n    },\n    formatter: (v) => {\n      if (v === null || v === undefined) return '';\n      if (Array.isArray(v)) return JSON.stringify(v);\n      // eslint-disable-next-line @typescript-eslint/no-base-to-string\n      return String(v);\n    },\n  })\n  override defaultValue: SelectOptionValue | SelectMultiValue | undefined = undefined;\n\n  protected static styles = [variables, sizeCSS, style];\n\n  protected writeValue(_value: SelectOptionValue | SelectMultiValue): void {\n    // Reactive re-render via this.value prop change handles the display update\n  }\n\n  protected getValue(): SelectOptionValue | SelectMultiValue {\n    if (this.multiple) return this._getMultiValues();\n\n    return this.value || '';\n  }\n\n  private _getMultiValues(): SelectMultiValue {\n    if (Array.isArray(this.value)) return this.value;\n    if (this.value != null && this.value !== '') return [this.value];\n\n    return [];\n  }\n\n  protected onDisabledChanged(_newValue: boolean): void {\n    // disabled is a reactive prop — render() already picks it up automatically\n  }\n\n  protected onUpdated(_changedProps: Map<string, unknown>): void {\n    if (!this.multiple || this.expandable) {\n      if (this._expanded) this._expanded = false;\n      return;\n    }\n    const list = this._selectedListEl;\n    if (!list) return;\n    const overflowing = list.scrollWidth > list.clientWidth + 1;\n    if (overflowing !== this._expanded) this._expanded = overflowing;\n  }\n\n  private _findLabel(value: SelectOptionValue): string {\n    const strVal = String(value);\n    if (Array.isArray(this.options)) {\n      for (const opt of this.options) {\n        if (this._isSelectOption(opt)) {\n          if (String(opt.value) === strVal) return t(opt.label, opt.label);\n        } else {\n          if (String(opt) === strVal) return strVal;\n        }\n      }\n    }\n\n    for (const opt of this._slotOptionData) {\n      if (opt.value === strVal) return opt.label;\n    }\n\n    return strVal;\n  }\n\n  private _onSlotChange(): void {\n    if (!this._slotEl) return;\n    const data: Array<{ value: string; label: string }> = [];\n    for (const el of this._slotEl.assignedElements({ flatten: true })) {\n      if (el.tagName.toLowerCase() !== 'ae-select-option') continue;\n      const optEl = el as SelectOptionElement;\n      data.push({\n        value: optEl.value ?? el.getAttribute('value') ?? '',\n        label: optEl.label || el.textContent?.trim() || '',\n      });\n    }\n    this._slotOptionData = data;\n    this.update();\n  }\n\n  private _toggleDropdown(): void {\n    if (this._isOpen) {\n      this._closeDropdown();\n    } else {\n      this._openDropdown();\n    }\n  }\n\n  private _openDropdown(): void {\n    this._isOpen = true;\n    this._syncOpenState();\n  }\n\n  private _closeDropdown(): void {\n    this._isOpen = false;\n    this._syncOpenState();\n  }\n\n  private _syncOpenState(): void {\n    this._triggerEl?.classList.toggle('open', this._isOpen);\n    this._dropdownEl?.classList.toggle('open', this._isOpen);\n  }\n\n  private readonly _handleOutsideClick = (e: Event): void => {\n    if (!e.composedPath().includes(this)) {\n      this._closeDropdown();\n    }\n  };\n\n  private readonly _handleOptionSelect = (e: Event): void => {\n    const { value, label } = (e as CustomEvent<{ value: string; label: string }>).detail;\n    if (!this._slotOptionData.find((o) => o.value === value)) {\n      this._slotOptionData = [\n        ...this._slotOptionData.filter((o) => o.value !== value),\n        { value, label },\n      ];\n    }\n    if (this.multiple) {\n      const current = this._getMultiValues();\n      const idx = current.findIndex((v) => String(v) === value);\n      const next: SelectMultiValue =\n        idx >= 0 ? current.filter((_, i) => i !== idx) : [...current, value];\n\n      this.setValue(next, { silent: false, action: 'change' });\n    } else {\n      this.setValue(value, { silent: false, action: 'change' });\n      this._closeDropdown();\n    }\n  };\n\n  connectedCallback() {\n    super.connectedCallback();\n    document.addEventListener('click', this._handleOutsideClick);\n    this.addEventListener('selectoption', this._handleOptionSelect);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener('click', this._handleOutsideClick);\n    this.removeEventListener('selectoption', this._handleOptionSelect);\n  }\n\n  private _syncSlotOptionsSelected(): void {\n    if (!this._slotEl) return;\n    const multiValues = this._getMultiValues();\n    for (const el of this._slotEl.assignedElements({ flatten: true })) {\n      if (el.tagName.toLowerCase() !== 'ae-select-option') continue;\n      const optEl = el as SelectOptionElement;\n      const optVal = optEl.value ?? el.getAttribute('value') ?? '';\n      const isSelected = this.multiple\n        ? multiValues.some((v) => String(v) === optVal)\n        : this.value != null && this.value !== '' && String(this.value) === optVal;\n      // undefined triggers removeAttribute via reactive setter\n      // (null would work too but undefined is type-safe for boolean | undefined)\n      optEl.selected = isSelected ? true : undefined;\n    }\n  }\n\n  render() {\n    const position = this.position || 'bottom';\n    const multiValues = this.multiple ? this._getMultiValues() : [];\n    const hasMultiSelection = this.multiple && multiValues.length > 0;\n    const selectedLabel =\n      !this.multiple && this.value != null && this.value !== ''\n        ? this._findLabel(this.value as SelectOptionValue)\n        : '';\n    const isDisabled = Boolean(this.disabled);\n    this._selectedListEl = null;\n\n    this._syncSlotOptionsSelected();\n\n    return html(({ div, span, slot }) => {\n      div({ className: 'container' }, () => {\n        this._triggerEl = div(\n          {\n            className: `trigger${this._isOpen ? ' open' : ''}${isDisabled ? ' disabled' : ''}`,\n            '@click': () => {\n              if (isDisabled) return;\n\n              this._toggleDropdown();\n            },\n          },\n          () => {\n            if (this.multiple) {\n              if (hasMultiSelection) {\n                this._selectedListEl = div(\n                  {\n                    className: `selected-list${!this.expandable ? ' selected-list--clipped' : ''}`,\n                  },\n                  () => {\n                    for (const v of multiValues) {\n                      const lbl = this._findLabel(v);\n                      tags.aeTag({\n                        key: `sel-${v}`,\n                        color: 'default',\n                        variant: 'faint',\n                        dismissible: true,\n                        disabled: isDisabled,\n                        textContent: lbl,\n                        '@dismiss': (e: Event) => {\n                          e.stopPropagation();\n                          if (isDisabled) return;\n\n                          const next = multiValues.filter((item) => String(item) !== String(v));\n                          this.setValue(next, { silent: false, action: 'change' });\n                        },\n                      });\n                    }\n                  },\n                );\n                if (!this.expandable && this._expanded) {\n                  span({ className: 'overflow-indicator', textContent: '…' });\n                }\n              } else {\n                span({ className: 'value placeholder', textContent: this.placeholder || '' });\n              }\n            } else {\n              if (selectedLabel) {\n                span({ className: 'value', textContent: selectedLabel });\n              } else {\n                span({ className: 'value placeholder', textContent: this.placeholder || '' });\n              }\n            }\n            span({ className: 'arrow', textContent: '▾' });\n          },\n        );\n\n        this._dropdownEl = div(\n          {\n            className: `dropdown position-${position}${this._isOpen ? ' open' : ''}`,\n          },\n          () => {\n            this._renderProgrammaticOptions();\n            this._slotEl = slot({\n              '@slotchange': () => this._onSlotChange(),\n            });\n          },\n        );\n\n        this.renderActionButtons();\n      });\n    });\n  }\n\n  private _renderProgrammaticOptions(): void {\n    if (!Array.isArray(this.options)) return;\n\n    const { aeSelectOption } = tags;\n    const multiValues = this.multiple ? this._getMultiValues() : [];\n    for (const opt of this.options) {\n      if (this._isSelectOption(opt)) {\n        const isSelected = this.multiple\n          ? multiValues.some((v) => String(v) === String(opt.value))\n          : this.value != null && String(opt.value) === String(this.value);\n        aeSelectOption({\n          key: `opt-${opt.value}`,\n          value: String(opt.value),\n          label: opt.label,\n          textContent: t(opt.label, opt.label),\n          selected: isSelected ? true : undefined,\n        });\n      } else {\n        const isSelected = this.multiple\n          ? multiValues.some((v) => String(v) === String(opt))\n          : this.value != null && String(opt) === String(this.value);\n        aeSelectOption({\n          key: `opt-${opt}`,\n          value: String(opt),\n          textContent: String(opt),\n          selected: isSelected ? true : undefined,\n        });\n      }\n    }\n  }\n\n  private _isSelectOption(option: unknown): option is SelectOption {\n    return (\n      option !== null &&\n      typeof option === 'object' &&\n      typeof (option as SelectOption).label === 'string' &&\n      (typeof (option as SelectOption).value === 'string' ||\n        typeof (option as SelectOption).value === 'number')\n    );\n  }\n}\n\nSelect.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-select': Select;\n  }\n}\n\nexport default Select;\nexport type SelectProps = InferProps<typeof Select>;\n"],"names":["_a","variables"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,mBAAA,YAAA,iBAAA,eAAA,kBAAA,eAAA,cAAA,gBAAA,IAAA,OAAA,YAAA,UAAA,WAAA,cAAA,WAAA;AA6BA,MAAM,gBAAe,iBAWnB,iBAAA,CAAC,KAAK,EAAE,MAAM,SAAS,SAAS,OAAO,SAAS,OAAO,CAAA,GAGvD,eAAA,CAAC,KAAK,EAAE,MAAM,OAAO,CAAA,GAGrB,gBAAA,CAAC,KAAK,EAAE,MAAM,QAAQ,CAAA,GAGtB,oBAAC,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,gBAAA,CAAC,KAAK,EAAE,MAAM,QAAA,CAAS,CAAA,GAGvB,kBAAA,CAAC,KAAK,EAAE,MAAM,SAAS,CAAA,GAMvB,aAAA,CAAC,KAAK;AAAA,EACJ,MAAM;AAAA,EACN,QAAQ,CAAC,MAAM;AACb,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI;AACF,aAAO,KAAK,MAAM,CAAC;AAAA,IACrB,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,WAAW,CAAC,MAAM;AAChB,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI,MAAM,QAAQ,CAAC,EAAG,QAAO,KAAK,UAAU,CAAC;AAE7C,WAAO,OAAO,CAAC;AAAA,EACjB;AACF,CAAC,CAAA,GAOD,qBAAC,KAAK;AAAA,EACJ,MAAM;AAAA,EACN,QAAQ,CAAC,MAAM;AACb,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI;AACF,aAAO,KAAK,MAAM,CAAC;AAAA,IACrB,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,WAAW,CAAC,MAAM;AAChB,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI,MAAM,QAAQ,CAAC,EAAG,QAAO,KAAK,UAAU,CAAC;AAE7C,WAAO,OAAO,CAAC;AAAA,EACjB;AACF,CAAC,IAvEkB,IAAiD;AAAA,EAAtE,cAAA;AAAA,UAAA,GAAA,SAAA;AACE,kBAAA,MAAU,gBAAe,IAAA;AACzB,kBAAA,MAAQ,WAAU,KAAA;AAClB,kBAAA,MAAQ,cAAiC,IAAA;AACzC,kBAAA,MAAQ,eAAkC,IAAA;AAC1C,kBAAA,MAAQ,WAAkC,IAAA;AAC1C,kBAAA,MAAQ,mBAA2D,EAAC;AACpE,kBAAA,MAAQ,mBAAsC,IAAA;AAK9C,iBAAA,MAAS,YAAqB,kBAA9B,OAAA,GAAA,MAA8B,KAAA,CAAA,GAA9B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,UAAT,kBAAA,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,WAAT,kBAAA,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,cAAT,kBAAA,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,WAAoB,kBAA7B,OAAA,IAAA,MAA6B,KAAA,CAAA,GAA7B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,aAAsB,kBAA/B,OAAA,IAAA,MAA+B,KAAA,CAAA,GAA/B,kBAAA,OAAA,IAAA,IAAA;AAsBA,kBAAA,MAAS,SAA0D,kBAAnE,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAuBA,kBAAA,MAAS,gBAAiE,kBAA1E,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AA6FA,kBAAA,MAAiB,uBAAsB,CAAC,MAAmB;AACzD,UAAI,CAAC,EAAE,aAAA,EAAe,SAAS,IAAI,GAAG;AACpC,aAAK,eAAA;AAAA,MACP;AAAA,IACF,CAAA;AAEA,kBAAA,MAAiB,uBAAsB,CAAC,MAAmB;AACzD,YAAM,EAAE,OAAO,MAAA,IAAW,EAAoD;AAC9E,UAAI,CAAC,KAAK,gBAAgB,KAAK,CAAC,MAAM,EAAE,UAAU,KAAK,GAAG;AACxD,aAAK,kBAAkB;AAAA,UACrB,GAAG,KAAK,gBAAgB,OAAO,CAAC,MAAM,EAAE,UAAU,KAAK;AAAA,UACvD,EAAE,OAAO,MAAA;AAAA,QAAM;AAAA,MAEnB;AACA,UAAI,KAAK,UAAU;AACjB,cAAM,UAAU,KAAK,gBAAA;AACrB,cAAM,MAAM,QAAQ,UAAU,CAAC,MAAM,OAAO,CAAC,MAAM,KAAK;AACxD,cAAM,OACJ,OAAO,IAAI,QAAQ,OAAO,CAAC,GAAG,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,KAAK;AAErE,aAAK,SAAS,MAAM,EAAE,QAAQ,OAAO,QAAQ,UAAU;AAAA,MACzD,OAAO;AACL,aAAK,SAAS,OAAO,EAAE,QAAQ,OAAO,QAAQ,UAAU;AACxD,aAAK,eAAA;AAAA,MACP;AAAA,IACF,CAAA;AAAA,EAAA;AAAA,EAlHU,WAAW,QAAoD;AAAA,EAEzE;AAAA,EAEU,WAAiD;AACzD,QAAI,KAAK,SAAU,QAAO,KAAK,gBAAA;AAE/B,WAAO,KAAK,SAAS;AAAA,EACvB;AAAA,EAEQ,kBAAoC;AAC1C,QAAI,MAAM,QAAQ,KAAK,KAAK,UAAU,KAAK;AAC3C,QAAI,KAAK,SAAS,QAAQ,KAAK,UAAU,GAAI,QAAO,CAAC,KAAK,KAAK;AAE/D,WAAO,CAAA;AAAA,EACT;AAAA,EAEU,kBAAkB,WAA0B;AAAA,EAEtD;AAAA,EAEU,UAAU,eAA2C;AAC7D,QAAI,CAAC,KAAK,YAAY,KAAK,YAAY;AACrC,UAAI,KAAK,UAAW,MAAK,YAAY;AACrC;AAAA,IACF;AACA,UAAM,OAAO,KAAK;AAClB,QAAI,CAAC,KAAM;AACX,UAAM,cAAc,KAAK,cAAc,KAAK,cAAc;AAC1D,QAAI,gBAAgB,KAAK,UAAW,MAAK,YAAY;AAAA,EACvD;AAAA,EAEQ,WAAW,OAAkC;AACnD,UAAM,SAAS,OAAO,KAAK;AAC3B,QAAI,MAAM,QAAQ,KAAK,OAAO,GAAG;AAC/B,iBAAW,OAAO,KAAK,SAAS;AAC9B,YAAI,KAAK,gBAAgB,GAAG,GAAG;AAC7B,cAAI,OAAO,IAAI,KAAK,MAAM,eAAe,EAAE,IAAI,OAAO,IAAI,KAAK;AAAA,QACjE,OAAO;AACL,cAAI,OAAO,GAAG,MAAM,OAAQ,QAAO;AAAA,QACrC;AAAA,MACF;AAAA,IACF;AAEA,eAAW,OAAO,KAAK,iBAAiB;AACtC,UAAI,IAAI,UAAU,OAAQ,QAAO,IAAI;AAAA,IACvC;AAEA,WAAO;AAAA,EACT;AAAA,EAEQ,gBAAsB;;AAC5B,QAAI,CAAC,KAAK,QAAS;AACnB,UAAM,OAAgD,CAAA;AACtD,eAAW,MAAM,KAAK,QAAQ,iBAAiB,EAAE,SAAS,KAAA,CAAM,GAAG;AACjE,UAAI,GAAG,QAAQ,YAAA,MAAkB,mBAAoB;AACrD,YAAM,QAAQ;AACd,WAAK,KAAK;AAAA,QACR,OAAO,MAAM,SAAS,GAAG,aAAa,OAAO,KAAK;AAAA,QAClD,OAAO,MAAM,WAASA,MAAA,GAAG,gBAAH,gBAAAA,IAAgB,WAAU;AAAA,MAAA,CACjD;AAAA,IACH;AACA,SAAK,kBAAkB;AACvB,SAAK,OAAA;AAAA,EACP;AAAA,EAEQ,kBAAwB;AAC9B,QAAI,KAAK,SAAS;AAChB,WAAK,eAAA;AAAA,IACP,OAAO;AACL,WAAK,cAAA;AAAA,IACP;AAAA,EACF;AAAA,EAEQ,gBAAsB;AAC5B,SAAK,UAAU;AACf,SAAK,eAAA;AAAA,EACP;AAAA,EAEQ,iBAAuB;AAC7B,SAAK,UAAU;AACf,SAAK,eAAA;AAAA,EACP;AAAA,EAEQ,iBAAuB;;AAC7B,KAAAA,MAAA,KAAK,eAAL,gBAAAA,IAAiB,UAAU,OAAO,QAAQ,KAAK;AAC/C,eAAK,gBAAL,mBAAkB,UAAU,OAAO,QAAQ,KAAK;AAAA,EAClD;AAAA,EA6BA,oBAAoB;AAClB,UAAM,kBAAA;AACN,aAAS,iBAAiB,SAAS,KAAK,mBAAmB;AAC3D,SAAK,iBAAiB,gBAAgB,KAAK,mBAAmB;AAAA,EAChE;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA;AACN,aAAS,oBAAoB,SAAS,KAAK,mBAAmB;AAC9D,SAAK,oBAAoB,gBAAgB,KAAK,mBAAmB;AAAA,EACnE;AAAA,EAEQ,2BAAiC;AACvC,QAAI,CAAC,KAAK,QAAS;AACnB,UAAM,cAAc,KAAK,gBAAA;AACzB,eAAW,MAAM,KAAK,QAAQ,iBAAiB,EAAE,SAAS,KAAA,CAAM,GAAG;AACjE,UAAI,GAAG,QAAQ,YAAA,MAAkB,mBAAoB;AACrD,YAAM,QAAQ;AACd,YAAM,SAAS,MAAM,SAAS,GAAG,aAAa,OAAO,KAAK;AAC1D,YAAM,aAAa,KAAK,WACpB,YAAY,KAAK,CAAC,MAAM,OAAO,CAAC,MAAM,MAAM,IAC5C,KAAK,SAAS,QAAQ,KAAK,UAAU,MAAM,OAAO,KAAK,KAAK,MAAM;AAGtE,YAAM,WAAW,aAAa,OAAO;AAAA,IACvC;AAAA,EACF;AAAA,EAEA,SAAS;AACP,UAAM,WAAW,KAAK,YAAY;AAClC,UAAM,cAAc,KAAK,WAAW,KAAK,gBAAA,IAAoB,CAAA;AAC7D,UAAM,oBAAoB,KAAK,YAAY,YAAY,SAAS;AAChE,UAAM,gBACJ,CAAC,KAAK,YAAY,KAAK,SAAS,QAAQ,KAAK,UAAU,KACnD,KAAK,WAAW,KAAK,KAA0B,IAC/C;AACN,UAAM,aAAa,QAAQ,KAAK,QAAQ;AACxC,SAAK,kBAAkB;AAEvB,SAAK,yBAAA;AAEL,WAAO,KAAK,CAAC,EAAE,KAAK,MAAM,WAAW;AACnC,UAAI,EAAE,WAAW,YAAA,GAAe,MAAM;AACpC,aAAK,aAAa;AAAA,UAChB;AAAA,YACE,WAAW,UAAU,KAAK,UAAU,UAAU,EAAE,GAAG,aAAa,cAAc,EAAE;AAAA,YAChF,UAAU,MAAM;AACd,kBAAI,WAAY;AAEhB,mBAAK,gBAAA;AAAA,YACP;AAAA,UAAA;AAAA,UAEF,MAAM;AACJ,gBAAI,KAAK,UAAU;AACjB,kBAAI,mBAAmB;AACrB,qBAAK,kBAAkB;AAAA,kBACrB;AAAA,oBACE,WAAW,gBAAgB,CAAC,KAAK,aAAa,4BAA4B,EAAE;AAAA,kBAAA;AAAA,kBAE9E,MAAM;AACJ,+BAAW,KAAK,aAAa;AAC3B,4BAAM,MAAM,KAAK,WAAW,CAAC;AAC7B,2BAAK,MAAM;AAAA,wBACT,KAAK,OAAO,CAAC;AAAA,wBACb,OAAO;AAAA,wBACP,SAAS;AAAA,wBACT,aAAa;AAAA,wBACb,UAAU;AAAA,wBACV,aAAa;AAAA,wBACb,YAAY,CAAC,MAAa;AACxB,4BAAE,gBAAA;AACF,8BAAI,WAAY;AAEhB,gCAAM,OAAO,YAAY,OAAO,CAAC,SAAS,OAAO,IAAI,MAAM,OAAO,CAAC,CAAC;AACpE,+BAAK,SAAS,MAAM,EAAE,QAAQ,OAAO,QAAQ,UAAU;AAAA,wBACzD;AAAA,sBAAA,CACD;AAAA,oBACH;AAAA,kBACF;AAAA,gBAAA;AAEF,oBAAI,CAAC,KAAK,cAAc,KAAK,WAAW;AACtC,uBAAK,EAAE,WAAW,sBAAsB,aAAa,KAAK;AAAA,gBAC5D;AAAA,cACF,OAAO;AACL,qBAAK,EAAE,WAAW,qBAAqB,aAAa,KAAK,eAAe,IAAI;AAAA,cAC9E;AAAA,YACF,OAAO;AACL,kBAAI,eAAe;AACjB,qBAAK,EAAE,WAAW,SAAS,aAAa,eAAe;AAAA,cACzD,OAAO;AACL,qBAAK,EAAE,WAAW,qBAAqB,aAAa,KAAK,eAAe,IAAI;AAAA,cAC9E;AAAA,YACF;AACA,iBAAK,EAAE,WAAW,SAAS,aAAa,KAAK;AAAA,UAC/C;AAAA,QAAA;AAGF,aAAK,cAAc;AAAA,UACjB;AAAA,YACE,WAAW,qBAAqB,QAAQ,GAAG,KAAK,UAAU,UAAU,EAAE;AAAA,UAAA;AAAA,UAExE,MAAM;AACJ,iBAAK,2BAAA;AACL,iBAAK,UAAU,KAAK;AAAA,cAClB,eAAe,MAAM,KAAK,cAAA;AAAA,YAAc,CACzC;AAAA,UACH;AAAA,QAAA;AAGF,aAAK,oBAAA;AAAA,MACP,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AAAA,EAEQ,6BAAmC;AACzC,QAAI,CAAC,MAAM,QAAQ,KAAK,OAAO,EAAG;AAElC,UAAM,EAAE,mBAAmB;AAC3B,UAAM,cAAc,KAAK,WAAW,KAAK,gBAAA,IAAoB,CAAA;AAC7D,eAAW,OAAO,KAAK,SAAS;AAC9B,UAAI,KAAK,gBAAgB,GAAG,GAAG;AAC7B,cAAM,aAAa,KAAK,WACpB,YAAY,KAAK,CAAC,MAAM,OAAO,CAAC,MAAM,OAAO,IAAI,KAAK,CAAC,IACvD,KAAK,SAAS,QAAQ,OAAO,IAAI,KAAK,MAAM,OAAO,KAAK,KAAK;AACjE,uBAAe;AAAA,UACb,KAAK,OAAO,IAAI,KAAK;AAAA,UACrB,OAAO,OAAO,IAAI,KAAK;AAAA,UACvB,OAAO,IAAI;AAAA,UACX,aAAa,EAAE,IAAI,OAAO,IAAI,KAAK;AAAA,UACnC,UAAU,aAAa,OAAO;AAAA,QAAA,CAC/B;AAAA,MACH,OAAO;AACL,cAAM,aAAa,KAAK,WACpB,YAAY,KAAK,CAAC,MAAM,OAAO,CAAC,MAAM,OAAO,GAAG,CAAC,IACjD,KAAK,SAAS,QAAQ,OAAO,GAAG,MAAM,OAAO,KAAK,KAAK;AAC3D,uBAAe;AAAA,UACb,KAAK,OAAO,GAAG;AAAA,UACf,OAAO,OAAO,GAAG;AAAA,UACjB,aAAa,OAAO,GAAG;AAAA,UACvB,UAAU,aAAa,OAAO;AAAA,QAAA,CAC/B;AAAA,MACH;AAAA,IACF;AAAA,EACF;AAAA,EAEQ,gBAAgB,QAAyC;AAC/D,WACE,WAAW,QACX,OAAO,WAAW,YAClB,OAAQ,OAAwB,UAAU,aACzC,OAAQ,OAAwB,UAAU,YACzC,OAAQ,OAAwB,UAAU;AAAA,EAEhD;AACF;AA1VA,QAAA,iBAAA,EAAA;AAYW,aAAA,oBAAA,QAAA;AAGA,WAAA,oBAAA,QAAA;AAGA,YAAA,oBAAA,QAAA;AAGA,eAAA,oBAAA,QAAA;AAGA,YAAA,oBAAA,QAAA;AAGA,cAAA,oBAAA,QAAA;AAfT,kBAAA,OAAA,GAAS,aADT,gBAXI,QAYK,UAAA;AAGT,kBAAA,OAAA,GAAS,WADT,cAdI,QAeK,QAAA;AAGT,kBAAA,OAAA,GAAS,YADT,eAjBI,QAkBK,SAAA;AAGT,kBAAA,OAAA,GAAS,eADT,kBApBI,QAqBK,YAAA;AAGT,kBAAA,OAAA,GAAS,YADT,eAvBI,QAwBK,SAAA;AAGT,kBAAA,OAAA,GAAS,cADT,iBA1BI,QA2BK,WAAA;AAsBT,kBAAA,OAAA,GAAS,SAjBT,YAhCI,MAAA;AAwEJ,kBAAA,OAAA,GAAS,gBAjBT,mBAvDI,MAAA;AAAN,oBAAA,OAAM,MAAA;AASJ,cATI,QASG,WAAU,QAAA;AAiEjB,cA1EI,QA0Ea,UAAS,CAACC,gBAAW,SAAS,KAAK,CAAA;AAkRtD,OAAO,SAAA;"}
+{"version":3,"file":"select.js","sources":["../../src/select/select.ts"],"sourcesContent":["import AeicoField from '../aeico-field';\nimport type { InferProps } from 'aeico';\nimport { html, tags } from 'aeico';\nimport type {\n  SelectOptionValue,\n  SelectOption,\n  SelectOptions,\n  SelectPosition,\n  SelectMultiValue,\n} from './defines';\nimport style from '../styles/components/select.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport sizeCSS from '../styles/size.css?inline';\nimport fieldLabelCSS from '../styles/components/field-label.css?inline';\nimport actionButtonCSS from '../styles/components/action-button.css?inline';\nimport SelectOptionElement from './select-option';\nimport '../tag/tag';\nimport { prop } from 'aeico';\n\n/**\n * Select component supporting single and multi-select modes, with options provided via both props and slots.\n * - `options` prop accepts an array of strings or objects with `value` and `label` for programmatic options.\n * - Slot content allows for declarative options using `<ae-select-option>` elements.\n * @example\n * <ae-select placeholder=\"Choose an option\" position=\"bottom\">\n *   <ae-select-option value=\"1\" label=\"Option 1\">Option 1</ae-select-option>\n *   <ae-select-option value=\"2\" label=\"Option 2\">Option 2</ae-select-option>\n * </ae-select>\n *\n */\nclass Select extends AeicoField<SelectOptionValue | SelectMultiValue> {\n  protected fieldElement: HTMLInputElement | null = null;\n  private _isOpen = false;\n  private _triggerEl: HTMLElement | null = null;\n  private _dropdownEl: HTMLElement | null = null;\n  private _slotEl: HTMLSlotElement | null = null;\n  private _slotOptionData: Array<{ value: string; label: string }> = [];\n  private _selectedListEl: HTMLElement | null = null;\n\n  static tagName = 'select';\n\n  @prop({ type: Boolean, observe: false, reflect: false })\n  accessor _expanded: boolean = false;\n\n  @prop({ type: Array })\n  accessor options: SelectOptions | undefined;\n\n  @prop({ type: String })\n  accessor position: SelectPosition | undefined;\n\n  @prop({ type: String })\n  accessor placeholder: string | undefined;\n\n  @prop({ type: Boolean })\n  accessor multiple: boolean = false;\n\n  @prop({ type: Boolean })\n  accessor expandable: boolean = false;\n\n  // Override base class value prop to support both string and array (multi-select).\n  // Uses field decorator (not accessor) because TypeScript TS2611 disallows overriding\n  // a parent class data property (declare value?) with an accessor in a subclass.\n  @prop({\n    type: String,\n    parser: (v) => {\n      if (v === null || v === undefined) return undefined;\n      try {\n        return JSON.parse(v);\n      } catch {\n        return v;\n      }\n    },\n    formatter: (v) => {\n      if (v === null || v === undefined) return '';\n      if (Array.isArray(v)) return JSON.stringify(v);\n      // eslint-disable-next-line @typescript-eslint/no-base-to-string\n      return String(v);\n    },\n  })\n  override value: SelectOptionValue | SelectMultiValue | undefined = undefined;\n\n  // Override base class defaultValue so arrays are JSON-serialized to the attribute,\n  // matching the value prop's parser/formatter. Without this override, setting\n  // defaultValue = ['a', 'b'] would be serialized as String(['a','b']) = \"a,b\",\n  // and reset() would restore a single string \"a,b\" instead of the array.\n  @prop({\n    type: String,\n    parser: (v) => {\n      if (v === null || v === undefined) return undefined;\n      try {\n        return JSON.parse(v);\n      } catch {\n        return v;\n      }\n    },\n    formatter: (v) => {\n      if (v === null || v === undefined) return '';\n      if (Array.isArray(v)) return JSON.stringify(v);\n      // eslint-disable-next-line @typescript-eslint/no-base-to-string\n      return String(v);\n    },\n  })\n  override defaultValue: SelectOptionValue | SelectMultiValue | undefined = undefined;\n\n  protected static styles = [variables, sizeCSS, fieldLabelCSS, actionButtonCSS, style];\n\n  protected writeValue(_value: SelectOptionValue | SelectMultiValue): void {\n    // Reactive re-render via this.value prop change handles the display update\n  }\n\n  protected getValue(): SelectOptionValue | SelectMultiValue {\n    if (this.multiple) return this._getMultiValues();\n\n    return this.value || '';\n  }\n\n  private _getMultiValues(): SelectMultiValue {\n    if (Array.isArray(this.value)) return this.value;\n    if (this.value != null && this.value !== '') return [this.value];\n\n    return [];\n  }\n\n  protected onDisabledChanged(_newValue: boolean): void {\n    // disabled is a reactive prop — render() already picks it up automatically\n  }\n\n  protected onUpdated(changedProps: Map<string, unknown>): void {\n    super.onUpdated(changedProps);\n    if (!this.multiple || this.expandable) {\n      if (this._expanded) this._expanded = false;\n      return;\n    }\n    const list = this._selectedListEl;\n    if (!list) return;\n    const overflowing = list.scrollWidth > list.clientWidth + 1;\n    if (overflowing !== this._expanded) this._expanded = overflowing;\n  }\n\n  private _findLabel(value: SelectOptionValue): string {\n    const strVal = String(value);\n    if (Array.isArray(this.options)) {\n      for (const opt of this.options) {\n        if (this._isSelectOption(opt)) {\n          if (String(opt.value) === strVal) return opt.label;\n        } else {\n          if (String(opt) === strVal) return strVal;\n        }\n      }\n    }\n\n    for (const opt of this._slotOptionData) {\n      if (opt.value === strVal) return opt.label;\n    }\n\n    return strVal;\n  }\n\n  private _onSlotChange(): void {\n    if (!this._slotEl) return;\n    const data: Array<{ value: string; label: string }> = [];\n    for (const el of this._slotEl.assignedElements({ flatten: true })) {\n      if (el.tagName.toLowerCase() !== 'ae-select-option') continue;\n      const optEl = el as SelectOptionElement;\n      data.push({\n        value: optEl.value ?? el.getAttribute('value') ?? '',\n        label: optEl.label || el.textContent?.trim() || '',\n      });\n    }\n    this._slotOptionData = data;\n    this.update();\n  }\n\n  private _toggleDropdown(): void {\n    if (this._isOpen) {\n      this._closeDropdown();\n    } else {\n      this._openDropdown();\n    }\n  }\n\n  private _openDropdown(): void {\n    this._isOpen = true;\n    this._syncOpenState();\n  }\n\n  private _closeDropdown(): void {\n    this._isOpen = false;\n    this._syncOpenState();\n  }\n\n  private _syncOpenState(): void {\n    this._triggerEl?.classList.toggle('open', this._isOpen);\n    this._dropdownEl?.classList.toggle('open', this._isOpen);\n  }\n\n  private readonly _handleOutsideClick = (e: Event): void => {\n    if (!e.composedPath().includes(this)) {\n      this._closeDropdown();\n    }\n  };\n\n  private readonly _handleOptionSelect = (e: Event): void => {\n    const { value, label } = (e as CustomEvent<{ value: string; label: string }>).detail;\n    if (!this._slotOptionData.find((o) => o.value === value)) {\n      this._slotOptionData = [\n        ...this._slotOptionData.filter((o) => o.value !== value),\n        { value, label },\n      ];\n    }\n    if (this.multiple) {\n      const current = this._getMultiValues();\n      const idx = current.findIndex((v) => String(v) === value);\n      const next: SelectMultiValue =\n        idx >= 0 ? current.filter((_, i) => i !== idx) : [...current, value];\n\n      this.setValue(next, { silent: false, action: 'change' });\n    } else {\n      this.setValue(value, { silent: false, action: 'change' });\n      this._closeDropdown();\n    }\n  };\n\n  connectedCallback() {\n    super.connectedCallback();\n    document.addEventListener('click', this._handleOutsideClick);\n    this.addEventListener('selectoption', this._handleOptionSelect);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener('click', this._handleOutsideClick);\n    this.removeEventListener('selectoption', this._handleOptionSelect);\n  }\n\n  private _syncSlotOptionsSelected(): void {\n    if (!this._slotEl) return;\n    const multiValues = this._getMultiValues();\n    for (const el of this._slotEl.assignedElements({ flatten: true })) {\n      if (el.tagName.toLowerCase() !== 'ae-select-option') continue;\n      const optEl = el as SelectOptionElement;\n      const optVal = optEl.value ?? el.getAttribute('value') ?? '';\n      const isSelected = this.multiple\n        ? multiValues.some((v) => String(v) === optVal)\n        : this.value != null && this.value !== '' && String(this.value) === optVal;\n      // undefined triggers removeAttribute via reactive setter\n      // (null would work too but undefined is type-safe for boolean | undefined)\n      optEl.selected = isSelected ? true : undefined;\n    }\n  }\n\n  render() {\n    const position = this.position || 'bottom';\n    const multiValues = this.multiple ? this._getMultiValues() : [];\n    const hasMultiSelection = this.multiple && multiValues.length > 0;\n    const selectedLabel =\n      !this.multiple && this.value != null && this.value !== ''\n        ? this._findLabel(this.value as SelectOptionValue)\n        : '';\n    const isDisabled = Boolean(this.disabled);\n    this._selectedListEl = null;\n\n    this._syncSlotOptionsSelected();\n\n    return html(({ div, span, slot }) => {\n      const id = this.getFieldId();\n      this.renderLabel(id);\n      div(\n        {\n          id,\n          'aria-labelledby': this.label ? `${id}-label` : undefined,\n          className: 'container field-body',\n        },\n        () => {\n          this._triggerEl = div(\n            {\n              className: `trigger${this._isOpen ? ' open' : ''}${isDisabled ? ' disabled' : ''}`,\n              '@click': () => {\n                if (isDisabled) return;\n\n                this._toggleDropdown();\n              },\n            },\n            () => {\n              if (this.multiple) {\n                if (hasMultiSelection) {\n                  this._selectedListEl = div(\n                    {\n                      className: `selected-list${!this.expandable ? ' selected-list--clipped' : ''}`,\n                    },\n                    () => {\n                      for (const v of multiValues) {\n                        const lbl = this._findLabel(v);\n                        tags.aeTag({\n                          key: `sel-${v}`,\n                          color: 'default',\n                          variant: 'faint',\n                          dismissible: true,\n                          disabled: isDisabled,\n                          textContent: lbl,\n                          '@dismiss': (e: Event) => {\n                            e.stopPropagation();\n                            if (isDisabled) return;\n\n                            const next = multiValues.filter((item) => String(item) !== String(v));\n                            this.setValue(next, { silent: false, action: 'change' });\n                          },\n                        });\n                      }\n                    },\n                  );\n                  if (!this.expandable && this._expanded) {\n                    span({ className: 'overflow-indicator', textContent: '…' });\n                  }\n                } else {\n                  span({ className: 'value placeholder', textContent: this.placeholder || '' });\n                }\n              } else {\n                if (selectedLabel) {\n                  span({ className: 'value', textContent: selectedLabel });\n                } else {\n                  span({ className: 'value placeholder', textContent: this.placeholder || '' });\n                }\n              }\n              span({ className: 'arrow', textContent: '▾' });\n            },\n          );\n\n          this._dropdownEl = div(\n            {\n              className: `dropdown position-${position}${this._isOpen ? ' open' : ''}`,\n            },\n            () => {\n              this._renderProgrammaticOptions();\n              this._slotEl = slot({\n                '@slotchange': () => this._onSlotChange(),\n              });\n            },\n          );\n\n          this.renderActionButtons();\n        },\n      );\n      this.renderHelperText();\n      this.renderError();\n\n      // Visually-hidden input so native form constraint validation works for `required`.\n      // type=\"text\" (not \"hidden\") is required — type=\"hidden\" is exempt from constraint validation.\n      const currentValue =\n        this.value != null &&\n        this.value !== '' &&\n        !(Array.isArray(this.value) && this.value.length === 0)\n          ? String(this.value)\n          : '';\n      this.fieldElement = tags.input({\n        key: 'validation-input',\n        type: 'text',\n        'aria-hidden': 'true',\n        tabIndex: -1,\n        required: Boolean(this.required),\n        value: currentValue,\n        style: {\n          position: 'absolute',\n          width: '0',\n          height: '0',\n          opacity: '0',\n          margin: '0',\n          padding: '0',\n          border: '0',\n          pointerEvents: 'none',\n          overflow: 'hidden',\n        },\n      });\n    });\n  }\n\n  private _renderProgrammaticOptions(): void {\n    if (!Array.isArray(this.options)) return;\n\n    const { aeSelectOption } = tags;\n    const multiValues = this.multiple ? this._getMultiValues() : [];\n    for (const opt of this.options) {\n      if (this._isSelectOption(opt)) {\n        const isSelected = this.multiple\n          ? multiValues.some((v) => String(v) === String(opt.value))\n          : this.value != null && String(opt.value) === String(this.value);\n        aeSelectOption({\n          key: `opt-${opt.value}`,\n          value: String(opt.value),\n          label: opt.label,\n          textContent: opt.label,\n          selected: isSelected ? true : undefined,\n        });\n      } else {\n        const isSelected = this.multiple\n          ? multiValues.some((v) => String(v) === String(opt))\n          : this.value != null && String(opt) === String(this.value);\n        aeSelectOption({\n          key: `opt-${opt}`,\n          value: String(opt),\n          textContent: String(opt),\n          selected: isSelected ? true : undefined,\n        });\n      }\n    }\n  }\n\n  private _isSelectOption(option: unknown): option is SelectOption {\n    return (\n      option !== null &&\n      typeof option === 'object' &&\n      typeof (option as SelectOption).label === 'string' &&\n      (typeof (option as SelectOption).value === 'string' ||\n        typeof (option as SelectOption).value === 'number')\n    );\n  }\n}\n\nSelect.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-select': Select;\n  }\n}\n\nexport default Select;\nexport type SelectProps = InferProps<typeof Select>;\n"],"names":["_a"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,mBAAA,YAAA,iBAAA,eAAA,kBAAA,eAAA,cAAA,gBAAA,IAAA,OAAA,YAAA,UAAA,WAAA,cAAA,WAAA;AA8BA,MAAM,gBAAe,iBAWnB,iBAAA,CAAC,KAAK,EAAE,MAAM,SAAS,SAAS,OAAO,SAAS,OAAO,CAAA,GAGvD,eAAA,CAAC,KAAK,EAAE,MAAM,OAAO,CAAA,GAGrB,gBAAA,CAAC,KAAK,EAAE,MAAM,QAAQ,CAAA,GAGtB,oBAAC,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,gBAAA,CAAC,KAAK,EAAE,MAAM,QAAA,CAAS,CAAA,GAGvB,kBAAA,CAAC,KAAK,EAAE,MAAM,SAAS,CAAA,GAMvB,aAAA,CAAC,KAAK;AAAA,EACJ,MAAM;AAAA,EACN,QAAQ,CAAC,MAAM;AACb,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI;AACF,aAAO,KAAK,MAAM,CAAC;AAAA,IACrB,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,WAAW,CAAC,MAAM;AAChB,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI,MAAM,QAAQ,CAAC,EAAG,QAAO,KAAK,UAAU,CAAC;AAE7C,WAAO,OAAO,CAAC;AAAA,EACjB;AACF,CAAC,CAAA,GAOD,qBAAC,KAAK;AAAA,EACJ,MAAM;AAAA,EACN,QAAQ,CAAC,MAAM;AACb,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI;AACF,aAAO,KAAK,MAAM,CAAC;AAAA,IACrB,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,WAAW,CAAC,MAAM;AAChB,QAAI,MAAM,QAAQ,MAAM,OAAW,QAAO;AAC1C,QAAI,MAAM,QAAQ,CAAC,EAAG,QAAO,KAAK,UAAU,CAAC;AAE7C,WAAO,OAAO,CAAC;AAAA,EACjB;AACF,CAAC,IAvEkB,IAAiD;AAAA,EAAtE,cAAA;AAAA,UAAA,GAAA,SAAA;AACE,kBAAA,MAAU,gBAAwC,IAAA;AAClD,kBAAA,MAAQ,WAAU,KAAA;AAClB,kBAAA,MAAQ,cAAiC,IAAA;AACzC,kBAAA,MAAQ,eAAkC,IAAA;AAC1C,kBAAA,MAAQ,WAAkC,IAAA;AAC1C,kBAAA,MAAQ,mBAA2D,EAAC;AACpE,kBAAA,MAAQ,mBAAsC,IAAA;AAK9C,iBAAA,MAAS,YAAqB,kBAA9B,OAAA,GAAA,MAA8B,KAAA,CAAA,GAA9B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,UAAT,kBAAA,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,WAAT,kBAAA,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,cAAT,kBAAA,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,WAAoB,kBAA7B,OAAA,IAAA,MAA6B,KAAA,CAAA,GAA7B,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,aAAsB,kBAA/B,OAAA,IAAA,MAA+B,KAAA,CAAA,GAA/B,kBAAA,OAAA,IAAA,IAAA;AAsBA,kBAAA,MAAS,SAA0D,kBAAnE,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAuBA,kBAAA,MAAS,gBAAiE,kBAA1E,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AA8FA,kBAAA,MAAiB,uBAAsB,CAAC,MAAmB;AACzD,UAAI,CAAC,EAAE,aAAA,EAAe,SAAS,IAAI,GAAG;AACpC,aAAK,eAAA;AAAA,MACP;AAAA,IACF,CAAA;AAEA,kBAAA,MAAiB,uBAAsB,CAAC,MAAmB;AACzD,YAAM,EAAE,OAAO,MAAA,IAAW,EAAoD;AAC9E,UAAI,CAAC,KAAK,gBAAgB,KAAK,CAAC,MAAM,EAAE,UAAU,KAAK,GAAG;AACxD,aAAK,kBAAkB;AAAA,UACrB,GAAG,KAAK,gBAAgB,OAAO,CAAC,MAAM,EAAE,UAAU,KAAK;AAAA,UACvD,EAAE,OAAO,MAAA;AAAA,QAAM;AAAA,MAEnB;AACA,UAAI,KAAK,UAAU;AACjB,cAAM,UAAU,KAAK,gBAAA;AACrB,cAAM,MAAM,QAAQ,UAAU,CAAC,MAAM,OAAO,CAAC,MAAM,KAAK;AACxD,cAAM,OACJ,OAAO,IAAI,QAAQ,OAAO,CAAC,GAAG,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,KAAK;AAErE,aAAK,SAAS,MAAM,EAAE,QAAQ,OAAO,QAAQ,UAAU;AAAA,MACzD,OAAO;AACL,aAAK,SAAS,OAAO,EAAE,QAAQ,OAAO,QAAQ,UAAU;AACxD,aAAK,eAAA;AAAA,MACP;AAAA,IACF,CAAA;AAAA,EAAA;AAAA,EAnHU,WAAW,QAAoD;AAAA,EAEzE;AAAA,EAEU,WAAiD;AACzD,QAAI,KAAK,SAAU,QAAO,KAAK,gBAAA;AAE/B,WAAO,KAAK,SAAS;AAAA,EACvB;AAAA,EAEQ,kBAAoC;AAC1C,QAAI,MAAM,QAAQ,KAAK,KAAK,UAAU,KAAK;AAC3C,QAAI,KAAK,SAAS,QAAQ,KAAK,UAAU,GAAI,QAAO,CAAC,KAAK,KAAK;AAE/D,WAAO,CAAA;AAAA,EACT;AAAA,EAEU,kBAAkB,WAA0B;AAAA,EAEtD;AAAA,EAEU,UAAU,cAA0C;AAC5D,UAAM,UAAU,YAAY;AAC5B,QAAI,CAAC,KAAK,YAAY,KAAK,YAAY;AACrC,UAAI,KAAK,UAAW,MAAK,YAAY;AACrC;AAAA,IACF;AACA,UAAM,OAAO,KAAK;AAClB,QAAI,CAAC,KAAM;AACX,UAAM,cAAc,KAAK,cAAc,KAAK,cAAc;AAC1D,QAAI,gBAAgB,KAAK,UAAW,MAAK,YAAY;AAAA,EACvD;AAAA,EAEQ,WAAW,OAAkC;AACnD,UAAM,SAAS,OAAO,KAAK;AAC3B,QAAI,MAAM,QAAQ,KAAK,OAAO,GAAG;AAC/B,iBAAW,OAAO,KAAK,SAAS;AAC9B,YAAI,KAAK,gBAAgB,GAAG,GAAG;AAC7B,cAAI,OAAO,IAAI,KAAK,MAAM,eAAe,IAAI;AAAA,QAC/C,OAAO;AACL,cAAI,OAAO,GAAG,MAAM,OAAQ,QAAO;AAAA,QACrC;AAAA,MACF;AAAA,IACF;AAEA,eAAW,OAAO,KAAK,iBAAiB;AACtC,UAAI,IAAI,UAAU,OAAQ,QAAO,IAAI;AAAA,IACvC;AAEA,WAAO;AAAA,EACT;AAAA,EAEQ,gBAAsB;;AAC5B,QAAI,CAAC,KAAK,QAAS;AACnB,UAAM,OAAgD,CAAA;AACtD,eAAW,MAAM,KAAK,QAAQ,iBAAiB,EAAE,SAAS,KAAA,CAAM,GAAG;AACjE,UAAI,GAAG,QAAQ,YAAA,MAAkB,mBAAoB;AACrD,YAAM,QAAQ;AACd,WAAK,KAAK;AAAA,QACR,OAAO,MAAM,SAAS,GAAG,aAAa,OAAO,KAAK;AAAA,QAClD,OAAO,MAAM,WAASA,MAAA,GAAG,gBAAH,gBAAAA,IAAgB,WAAU;AAAA,MAAA,CACjD;AAAA,IACH;AACA,SAAK,kBAAkB;AACvB,SAAK,OAAA;AAAA,EACP;AAAA,EAEQ,kBAAwB;AAC9B,QAAI,KAAK,SAAS;AAChB,WAAK,eAAA;AAAA,IACP,OAAO;AACL,WAAK,cAAA;AAAA,IACP;AAAA,EACF;AAAA,EAEQ,gBAAsB;AAC5B,SAAK,UAAU;AACf,SAAK,eAAA;AAAA,EACP;AAAA,EAEQ,iBAAuB;AAC7B,SAAK,UAAU;AACf,SAAK,eAAA;AAAA,EACP;AAAA,EAEQ,iBAAuB;;AAC7B,KAAAA,MAAA,KAAK,eAAL,gBAAAA,IAAiB,UAAU,OAAO,QAAQ,KAAK;AAC/C,eAAK,gBAAL,mBAAkB,UAAU,OAAO,QAAQ,KAAK;AAAA,EAClD;AAAA,EA6BA,oBAAoB;AAClB,UAAM,kBAAA;AACN,aAAS,iBAAiB,SAAS,KAAK,mBAAmB;AAC3D,SAAK,iBAAiB,gBAAgB,KAAK,mBAAmB;AAAA,EAChE;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA;AACN,aAAS,oBAAoB,SAAS,KAAK,mBAAmB;AAC9D,SAAK,oBAAoB,gBAAgB,KAAK,mBAAmB;AAAA,EACnE;AAAA,EAEQ,2BAAiC;AACvC,QAAI,CAAC,KAAK,QAAS;AACnB,UAAM,cAAc,KAAK,gBAAA;AACzB,eAAW,MAAM,KAAK,QAAQ,iBAAiB,EAAE,SAAS,KAAA,CAAM,GAAG;AACjE,UAAI,GAAG,QAAQ,YAAA,MAAkB,mBAAoB;AACrD,YAAM,QAAQ;AACd,YAAM,SAAS,MAAM,SAAS,GAAG,aAAa,OAAO,KAAK;AAC1D,YAAM,aAAa,KAAK,WACpB,YAAY,KAAK,CAAC,MAAM,OAAO,CAAC,MAAM,MAAM,IAC5C,KAAK,SAAS,QAAQ,KAAK,UAAU,MAAM,OAAO,KAAK,KAAK,MAAM;AAGtE,YAAM,WAAW,aAAa,OAAO;AAAA,IACvC;AAAA,EACF;AAAA,EAEA,SAAS;AACP,UAAM,WAAW,KAAK,YAAY;AAClC,UAAM,cAAc,KAAK,WAAW,KAAK,gBAAA,IAAoB,CAAA;AAC7D,UAAM,oBAAoB,KAAK,YAAY,YAAY,SAAS;AAChE,UAAM,gBACJ,CAAC,KAAK,YAAY,KAAK,SAAS,QAAQ,KAAK,UAAU,KACnD,KAAK,WAAW,KAAK,KAA0B,IAC/C;AACN,UAAM,aAAa,QAAQ,KAAK,QAAQ;AACxC,SAAK,kBAAkB;AAEvB,SAAK,yBAAA;AAEL,WAAO,KAAK,CAAC,EAAE,KAAK,MAAM,WAAW;AACnC,YAAM,KAAK,KAAK,WAAA;AAChB,WAAK,YAAY,EAAE;AACnB;AAAA,QACE;AAAA,UACE;AAAA,UACA,mBAAmB,KAAK,QAAQ,GAAG,EAAE,WAAW;AAAA,UAChD,WAAW;AAAA,QAAA;AAAA,QAEb,MAAM;AACJ,eAAK,aAAa;AAAA,YAChB;AAAA,cACE,WAAW,UAAU,KAAK,UAAU,UAAU,EAAE,GAAG,aAAa,cAAc,EAAE;AAAA,cAChF,UAAU,MAAM;AACd,oBAAI,WAAY;AAEhB,qBAAK,gBAAA;AAAA,cACP;AAAA,YAAA;AAAA,YAEF,MAAM;AACJ,kBAAI,KAAK,UAAU;AACjB,oBAAI,mBAAmB;AACrB,uBAAK,kBAAkB;AAAA,oBACrB;AAAA,sBACE,WAAW,gBAAgB,CAAC,KAAK,aAAa,4BAA4B,EAAE;AAAA,oBAAA;AAAA,oBAE9E,MAAM;AACJ,iCAAW,KAAK,aAAa;AAC3B,8BAAM,MAAM,KAAK,WAAW,CAAC;AAC7B,6BAAK,MAAM;AAAA,0BACT,KAAK,OAAO,CAAC;AAAA,0BACb,OAAO;AAAA,0BACP,SAAS;AAAA,0BACT,aAAa;AAAA,0BACb,UAAU;AAAA,0BACV,aAAa;AAAA,0BACb,YAAY,CAAC,MAAa;AACxB,8BAAE,gBAAA;AACF,gCAAI,WAAY;AAEhB,kCAAM,OAAO,YAAY,OAAO,CAAC,SAAS,OAAO,IAAI,MAAM,OAAO,CAAC,CAAC;AACpE,iCAAK,SAAS,MAAM,EAAE,QAAQ,OAAO,QAAQ,UAAU;AAAA,0BACzD;AAAA,wBAAA,CACD;AAAA,sBACH;AAAA,oBACF;AAAA,kBAAA;AAEF,sBAAI,CAAC,KAAK,cAAc,KAAK,WAAW;AACtC,yBAAK,EAAE,WAAW,sBAAsB,aAAa,KAAK;AAAA,kBAC5D;AAAA,gBACF,OAAO;AACL,uBAAK,EAAE,WAAW,qBAAqB,aAAa,KAAK,eAAe,IAAI;AAAA,gBAC9E;AAAA,cACF,OAAO;AACL,oBAAI,eAAe;AACjB,uBAAK,EAAE,WAAW,SAAS,aAAa,eAAe;AAAA,gBACzD,OAAO;AACL,uBAAK,EAAE,WAAW,qBAAqB,aAAa,KAAK,eAAe,IAAI;AAAA,gBAC9E;AAAA,cACF;AACA,mBAAK,EAAE,WAAW,SAAS,aAAa,KAAK;AAAA,YAC/C;AAAA,UAAA;AAGF,eAAK,cAAc;AAAA,YACjB;AAAA,cACE,WAAW,qBAAqB,QAAQ,GAAG,KAAK,UAAU,UAAU,EAAE;AAAA,YAAA;AAAA,YAExE,MAAM;AACJ,mBAAK,2BAAA;AACL,mBAAK,UAAU,KAAK;AAAA,gBAClB,eAAe,MAAM,KAAK,cAAA;AAAA,cAAc,CACzC;AAAA,YACH;AAAA,UAAA;AAGF,eAAK,oBAAA;AAAA,QACP;AAAA,MAAA;AAEF,WAAK,iBAAA;AACL,WAAK,YAAA;AAIL,YAAM,eACJ,KAAK,SAAS,QACd,KAAK,UAAU,MACf,EAAE,MAAM,QAAQ,KAAK,KAAK,KAAK,KAAK,MAAM,WAAW,KACjD,OAAO,KAAK,KAAK,IACjB;AACN,WAAK,eAAe,KAAK,MAAM;AAAA,QAC7B,KAAK;AAAA,QACL,MAAM;AAAA,QACN,eAAe;AAAA,QACf,UAAU;AAAA,QACV,UAAU,QAAQ,KAAK,QAAQ;AAAA,QAC/B,OAAO;AAAA,QACP,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,eAAe;AAAA,UACf,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH,CAAC;AAAA,EACH;AAAA,EAEQ,6BAAmC;AACzC,QAAI,CAAC,MAAM,QAAQ,KAAK,OAAO,EAAG;AAElC,UAAM,EAAE,mBAAmB;AAC3B,UAAM,cAAc,KAAK,WAAW,KAAK,gBAAA,IAAoB,CAAA;AAC7D,eAAW,OAAO,KAAK,SAAS;AAC9B,UAAI,KAAK,gBAAgB,GAAG,GAAG;AAC7B,cAAM,aAAa,KAAK,WACpB,YAAY,KAAK,CAAC,MAAM,OAAO,CAAC,MAAM,OAAO,IAAI,KAAK,CAAC,IACvD,KAAK,SAAS,QAAQ,OAAO,IAAI,KAAK,MAAM,OAAO,KAAK,KAAK;AACjE,uBAAe;AAAA,UACb,KAAK,OAAO,IAAI,KAAK;AAAA,UACrB,OAAO,OAAO,IAAI,KAAK;AAAA,UACvB,OAAO,IAAI;AAAA,UACX,aAAa,IAAI;AAAA,UACjB,UAAU,aAAa,OAAO;AAAA,QAAA,CAC/B;AAAA,MACH,OAAO;AACL,cAAM,aAAa,KAAK,WACpB,YAAY,KAAK,CAAC,MAAM,OAAO,CAAC,MAAM,OAAO,GAAG,CAAC,IACjD,KAAK,SAAS,QAAQ,OAAO,GAAG,MAAM,OAAO,KAAK,KAAK;AAC3D,uBAAe;AAAA,UACb,KAAK,OAAO,GAAG;AAAA,UACf,OAAO,OAAO,GAAG;AAAA,UACjB,aAAa,OAAO,GAAG;AAAA,UACvB,UAAU,aAAa,OAAO;AAAA,QAAA,CAC/B;AAAA,MACH;AAAA,IACF;AAAA,EACF;AAAA,EAEQ,gBAAgB,QAAyC;AAC/D,WACE,WAAW,QACX,OAAO,WAAW,YAClB,OAAQ,OAAwB,UAAU,aACzC,OAAQ,OAAwB,UAAU,YACzC,OAAQ,OAAwB,UAAU;AAAA,EAEhD;AACF;AAlYA,QAAA,iBAAA,EAAA;AAYW,aAAA,oBAAA,QAAA;AAGA,WAAA,oBAAA,QAAA;AAGA,YAAA,oBAAA,QAAA;AAGA,eAAA,oBAAA,QAAA;AAGA,YAAA,oBAAA,QAAA;AAGA,cAAA,oBAAA,QAAA;AAfT,kBAAA,OAAA,GAAS,aADT,gBAXI,QAYK,UAAA;AAGT,kBAAA,OAAA,GAAS,WADT,cAdI,QAeK,QAAA;AAGT,kBAAA,OAAA,GAAS,YADT,eAjBI,QAkBK,SAAA;AAGT,kBAAA,OAAA,GAAS,eADT,kBApBI,QAqBK,YAAA;AAGT,kBAAA,OAAA,GAAS,YADT,eAvBI,QAwBK,SAAA;AAGT,kBAAA,OAAA,GAAS,cADT,iBA1BI,QA2BK,WAAA;AAsBT,kBAAA,OAAA,GAAS,SAjBT,YAhCI,MAAA;AAwEJ,kBAAA,OAAA,GAAS,gBAjBT,mBAvDI,MAAA;AAAN,oBAAA,OAAM,MAAA;AASJ,cATI,QASG,WAAU,QAAA;AAiEjB,cA1EI,QA0Ea,UAAS,CAAC,WAAW,SAAS,eAAe,iBAAiB,KAAK,CAAA;AA0TtF,OAAO,SAAA;"}

package/dist/chunks/size.cjs

@@ -1,4 +1,4 @@
 "use strict";
-const sizeCSS = ':host([size="xs"]) { font-size: var(--size-xs); }\n:host([size="sm"]) { font-size: var(--size-s); }\n:host([size="md"]) { font-size: var(--size-m); }\n:host([size="lg"]) { font-size: var(--size-l); }\n:host([size="xl"]) { font-size: var(--size-xl); }\n:host([size="3xs"]) { font-size: var(--size-3xs); }\n:host([size="2xs"]) { font-size: var(--size-2xs); }\n';
+const sizeCSS = ':host([size="xs"]) { font-size: var(--ae-size-xs); }\n:host([size="sm"]) { font-size: var(--ae-size-s); }\n:host([size="md"]) { font-size: var(--ae-size-m); }\n:host([size="lg"]) { font-size: var(--ae-size-l); }\n:host([size="xl"]) { font-size: var(--ae-size-xl); }\n:host([size="3xs"]) { font-size: var(--ae-size-3xs); }\n:host([size="2xs"]) { font-size: var(--ae-size-2xs); }\n';
 exports.sizeCSS = sizeCSS;
 //# sourceMappingURL=size.cjs.map

package/dist/chunks/size.js

@@ -1,4 +1,4 @@
-const sizeCSS = ':host([size="xs"]) { font-size: var(--size-xs); }\n:host([size="sm"]) { font-size: var(--size-s); }\n:host([size="md"]) { font-size: var(--size-m); }\n:host([size="lg"]) { font-size: var(--size-l); }\n:host([size="xl"]) { font-size: var(--size-xl); }\n:host([size="3xs"]) { font-size: var(--size-3xs); }\n:host([size="2xs"]) { font-size: var(--size-2xs); }\n';
+const sizeCSS = ':host([size="xs"]) { font-size: var(--ae-size-xs); }\n:host([size="sm"]) { font-size: var(--ae-size-s); }\n:host([size="md"]) { font-size: var(--ae-size-m); }\n:host([size="lg"]) { font-size: var(--ae-size-l); }\n:host([size="xl"]) { font-size: var(--ae-size-xl); }\n:host([size="3xs"]) { font-size: var(--ae-size-3xs); }\n:host([size="2xs"]) { font-size: var(--ae-size-2xs); }\n';
 export {
   sizeCSS as s
 };

package/dist/chunks/slider.cjs

@@ -1,5 +1,5 @@
 "use strict";
-const aeicoField = require("./aeico-field.cjs");
+const actionButton = require("./action-button.cjs");
 const aeico = require("aeico");
 const variables = require("./variables.cjs");
 const size = require("./size.cjs");
@@ -8,10 +8,7 @@ const style = `:host {
   display: block;
   flex: 1;
   min-width: 0;
-  font-size: var(--size-base);
-
-  /* Default color when no [color] attribute — overridden by color.css :host([color=...]) */
-  --color-solid: var(--color-primary);
+  font-size: var(--ae-size-base);
 }
 
 .range-container {
@@ -34,8 +31,8 @@ input[type="range"] {
   appearance: none;
   width: 100%;
   height: 0.333em;
-  border-radius: 2px;
-  background: var(--border-subtle);
+  border-radius: var(--ae-radius-xs);
+  background: var(--ae-border-subtle);
   outline: none;
   cursor: pointer;
   margin: 0;
@@ -52,8 +49,8 @@ input[type="range"]::-webkit-slider-thumb {
   appearance: none;
   width: 1.167em;
   height: 1.167em;
-  border-radius: 50%;
-  background: var(--color-solid);
+  border-radius: var(--ae-radius-circle);
+  background: var(--ae-color-solid);
   cursor: pointer;
   transition: background 0.12s, transform 0.12s;
 }
@@ -61,21 +58,21 @@ input[type="range"]::-webkit-slider-thumb {
 .input-range::-webkit-slider-thumb:hover,
 .slider-input::-webkit-slider-thumb:hover,
 input[type="range"]:hover::-webkit-slider-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   transform: scale(1.1);
 }
 
 .input-range::-webkit-slider-thumb:active,
 .slider-input::-webkit-slider-thumb:active,
 input[type="range"]:active::-webkit-slider-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   transform: scale(1.2);
 }
 
 .input-range:focus::-webkit-slider-thumb,
 .slider-input:focus::-webkit-slider-thumb,
 input[type="range"]:focus::-webkit-slider-thumb {
-  background: var(--color-solid);
+  background: var(--ae-color-solid);
   outline: none;
   box-shadow: none;
 }
@@ -83,7 +80,7 @@ input[type="range"]:focus::-webkit-slider-thumb {
 .input-range:focus:hover::-webkit-slider-thumb,
 .slider-input:focus:hover::-webkit-slider-thumb,
 input[type="range"]:focus:hover::-webkit-slider-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   outline: none;
   box-shadow: none;
 }
@@ -91,7 +88,7 @@ input[type="range"]:focus:hover::-webkit-slider-thumb {
 .input-range:focus:active::-webkit-slider-thumb,
 .slider-input:focus:active::-webkit-slider-thumb,
 input[type="range"]:focus:active::-webkit-slider-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   outline: none;
   box-shadow: none;
 }
@@ -102,8 +99,8 @@ input[type="range"]::-moz-range-thumb {
   width: 1.167em;
   height: 1.167em;
   border: none;
-  border-radius: 50%;
-  background: var(--color-solid);
+  border-radius: var(--ae-radius-circle);
+  background: var(--ae-color-solid);
   cursor: pointer;
   transition: background 0.12s, transform 0.12s;
 }
@@ -111,21 +108,21 @@ input[type="range"]::-moz-range-thumb {
 .input-range::-moz-range-thumb:hover,
 .slider-input::-moz-range-thumb:hover,
 input[type="range"]:hover::-moz-range-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   transform: scale(1.1);
 }
 
 .input-range::-moz-range-thumb:active,
 .slider-input::-moz-range-thumb:active,
 input[type="range"]:active::-moz-range-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   transform: scale(1.2);
 }
 
 .input-range:focus::-moz-range-thumb,
 .slider-input:focus::-moz-range-thumb,
 input[type="range"]:focus::-moz-range-thumb {
-  background: var(--color-solid);
+  background: var(--ae-color-solid);
   outline: none;
   box-shadow: none;
 }
@@ -133,7 +130,7 @@ input[type="range"]:focus::-moz-range-thumb {
 .input-range:focus:hover::-moz-range-thumb,
 .slider-input:focus:hover::-moz-range-thumb,
 input[type="range"]:focus:hover::-moz-range-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   outline: none;
   box-shadow: none;
 }
@@ -141,7 +138,7 @@ input[type="range"]:focus:hover::-moz-range-thumb {
 .input-range:focus:active::-moz-range-thumb,
 .slider-input:focus:active::-moz-range-thumb,
 input[type="range"]:focus:active::-moz-range-thumb {
-  background: var(--color-solid-hover);
+  background: var(--ae-color-solid-hover);
   outline: none;
   box-shadow: none;
 }
@@ -169,55 +166,13 @@ input[type="range"]:disabled::-moz-range-thumb {
   min-width: 14px;
   text-align: center;
   font-size: 12px;
-  color: var(--color-text-muted);
+  color: var(--ae-color-text-muted);
   font-weight: 500;
   font-variant-numeric: tabular-nums;
   pointer-events: none;
   user-select: none;
 }
 
-.reset-btn {
-  width: 1.333em;
-  height: 1.333em;
-  border: none;
-  border-radius: var(--reset-btn-border-radius);
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: var(--reset-btn-bg);
-  color: var(--reset-btn-color);
-  transition: var(--reset-btn-transition);
-  flex-shrink: 0;
-}
-
-.reset-btn:hover {
-  background: var(--reset-btn-bg-hover);
-  color: var(--reset-btn-color-hover);
-}
-
-.clear-btn {
-  width: 1.333em;
-  height: 1.333em;
-  border: none;
-  border-radius: var(--clear-btn-border-radius);
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: var(--clear-btn-bg);
-  color: var(--clear-btn-color);
-  transition: var(--clear-btn-transition);
-  flex-shrink: 0;
-}
-
-.clear-btn:hover {
-  background: var(--clear-btn-bg-hover);
-  color: var(--clear-btn-color-hover);
-}
-
-
-
 .input-range,
 .slider-input,
 input[type="range"] {
@@ -246,10 +201,10 @@ input[type="range"]::-moz-range-thumb {
   width: 56px;
   padding: 0 4px;
   height: 22px;
-  border: 1px solid var(--border-subtle);
-  border-radius: 4px;
+  border: 1px solid var(--ae-border-subtle);
+  border-radius: var(--ae-radius-sm);
   background: transparent;
-  color: var(--color-text);
+  color: var(--ae-color-text);
   font-size: 12px;
   text-align: center;
   outline: none;
@@ -257,7 +212,7 @@ input[type="range"]::-moz-range-thumb {
 }
 
 .value-input:focus {
-  border-color: var(--color-solid);
+  border-color: var(--ae-color-solid);
 }
 
 .value-input:disabled {
@@ -270,8 +225,8 @@ input[type="range"]::-moz-range-thumb {
 :host([tracked]) input[type="range"] {
   background: linear-gradient(
     to right,
-    var(--color-solid) var(--fill-pct, 0%),
-    var(--border-subtle) var(--fill-pct, 0%)
+    var(--ae-color-solid) var(--fill-pct, 0%),
+    var(--ae-border-subtle) var(--fill-pct, 0%)
   );
 }
 
@@ -315,13 +270,13 @@ input[type="range"]::-moz-range-thumb {
   display: block;
   width: 1px;
   height: 4px;
-  background: var(--border-default, var(--border-subtle));
+  background: var(--ae-border-default, var(--ae-border-subtle));
   border-radius: 1px;
 }
 
 .mark-label {
   font-size: 10px;
-  color: var(--color-text-muted);
+  color: var(--ae-color-text-muted);
   white-space: nowrap;
 }
 
@@ -377,7 +332,7 @@ var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read fr
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
 var _marks_dec, _tracked_dec, _editable_dec, _step_dec, _max_dec, _min_dec, _percentage_dec, _options_dec, _a, _init, _options, _percentage, _min, _max, _step, _editable, _tracked, _marks;
-class Slider extends (_a = aeicoField.AeicoField, _options_dec = [aeico.prop({ type: Array })], _percentage_dec = [aeico.prop({ type: Boolean })], _min_dec = [aeico.prop({ type: Number })], _max_dec = [aeico.prop({ type: Number })], _step_dec = [aeico.prop({ type: Number })], _editable_dec = [aeico.prop({ type: Boolean })], _tracked_dec = [aeico.prop({ type: Boolean })], _marks_dec = [aeico.prop({
+class Slider extends (_a = actionButton.AeicoField, _options_dec = [aeico.prop({ type: Array })], _percentage_dec = [aeico.prop({ type: Boolean })], _min_dec = [aeico.prop({ type: Number })], _max_dec = [aeico.prop({ type: Number })], _step_dec = [aeico.prop({ type: Number })], _editable_dec = [aeico.prop({ type: Boolean })], _tracked_dec = [aeico.prop({ type: Boolean })], _marks_dec = [aeico.prop({
   type: Array,
   // bare attribute (<ae-slider marks>) → true; JSON array → MarkItem[]
   parser: (value) => {
@@ -536,10 +491,13 @@ class Slider extends (_a = aeicoField.AeicoField, _options_dec = [aeico.prop({ t
     const normalized = this._normalizeOptions();
     const attrs = this._getRangeAttrs(normalized);
     return aeico.html(({ div, input, span }) => {
-      div({ className: "range-container" }, () => {
+      const id = this.getFieldId();
+      this.renderLabel(id);
+      div({ className: "range-container field-body" }, () => {
         div({ key: "range-wrapper", className: "range-wrapper" }, () => {
           this.fieldElement = input({
             key: "range",
+            id,
             type: "range",
             min: attrs.min,
             max: attrs.max,
@@ -589,6 +547,8 @@ class Slider extends (_a = aeicoField.AeicoField, _options_dec = [aeico.prop({ t
         }
       });
       if (this.value != null) this.writeValue(this.value);
+      this.renderHelperText();
+      this.renderError();
     });
   }
   _onRangeInput() {
@@ -642,7 +602,7 @@ __decorateElement(_init, 4, "tracked", _tracked_dec, Slider, _tracked);
 __decorateElement(_init, 4, "marks", _marks_dec, Slider, _marks);
 __decoratorMetadata(_init, Slider);
 __publicField(Slider, "tagName", "slider");
-__publicField(Slider, "styles", [variables.styleVariables, size.sizeCSS, color.colorCSS, style]);
+__publicField(Slider, "styles", [variables.variables, size.sizeCSS, color.colorCSS, actionButton.fieldLabelCSS, actionButton.actionButtonCSS, style]);
 Slider.register();
 exports.Slider = Slider;
 //# sourceMappingURL=slider.cjs.map

package/dist/chunks/slider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"slider.cjs","sources":["../../src/slider/slider.ts"],"sourcesContent":["import AeicoField from '../aeico-field';\nimport type { InferProps } from 'aeico';\nimport { html, tags } from 'aeico';\nimport type { NormalizedOption, SliderMarks, SliderOption, SliderOptions } from './defines';\nimport style from '../styles/components/slider.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport sizeCSS from '../styles/size.css?inline';\nimport colorCSS from '../styles/color.css?inline';\nimport { prop } from 'aeico';\n\nclass Slider extends AeicoField {\n  protected fieldElement: HTMLInputElement | null = null;\n  private _valueLabel: HTMLSpanElement | null = null;\n  private _numberInput: HTMLInputElement | null = null;\n\n  private _boundOnRangeInput: () => void;\n  private _boundOnNumberInput: () => void;\n\n  static tagName = 'slider';\n\n  @prop({ type: Array })\n  accessor options: SliderOptions = [];\n\n  @prop({ type: Boolean })\n  accessor percentage = false;\n\n  @prop({ type: Number })\n  accessor min = 0;\n\n  @prop({ type: Number })\n  accessor max = 100;\n\n  @prop({ type: Number })\n  accessor step = 1;\n\n  @prop({ type: Boolean })\n  accessor editable = false;\n\n  @prop({ type: Boolean })\n  accessor tracked = false;\n\n  @prop({\n    type: Array,\n    // bare attribute (<ae-slider marks>) → true; JSON array → MarkItem[]\n    parser: (value: string | null) => {\n      if (value === null) return undefined;\n      if (value === '' || value === 'true') return true;\n      if (value === 'false') return false;\n      try {\n        return JSON.parse(value);\n      } catch {\n        return true;\n      }\n    },\n  })\n  accessor marks: SliderMarks | undefined;\n\n  protected static styles = [variables, sizeCSS, colorCSS, style];\n\n  constructor() {\n    super();\n    this._boundOnRangeInput = this._onRangeInput.bind(this);\n    this._boundOnNumberInput = this._onNumberInput.bind(this);\n  }\n\n  private _normalizeOptions(): NormalizedOption[] | null {\n    if (!Array.isArray(this.options) || this.options.length === 0) return null;\n\n    const opts = this.options.map((opt) =>\n      this._isSliderOption(opt)\n        ? { label: opt.label, value: String(opt.value) }\n        : { label: String(opt), value: String(opt) },\n    );\n\n    // Sort by numeric value if all values are numeric; otherwise keep original order\n    const allNumeric = opts.every((o) => o.value !== '' && !isNaN(Number(o.value)));\n\n    if (allNumeric) {\n      return [...opts]\n        .sort((a, b) => Number(a.value) - Number(b.value))\n        .map((o) => ({ ...o, rangeValue: Number(o.value) }));\n    } else {\n      return opts.map((o, i) => ({ ...o, rangeValue: i }));\n    }\n  }\n\n  private _getRangeAttrs(normalized: NormalizedOption[] | null): {\n    min: string;\n    max: string;\n    step: string;\n    inOptionsMode: boolean;\n  } {\n    if (normalized && normalized.length >= 1) {\n      const vals = normalized.map((o) => o.rangeValue);\n      const min = Math.min(...vals);\n      const max = Math.max(...vals);\n\n      // Compute step from minimum gap between adjacent sorted values\n      const sorted = [...vals].sort((a, b) => a - b);\n      let minGap = Infinity;\n      for (let i = 1; i < sorted.length; i++) {\n        const d = sorted[i] - sorted[i - 1];\n        if (d > 0 && d < minGap) minGap = d;\n      }\n\n      return {\n        min: String(min),\n        max: String(max),\n        step: minGap === Infinity ? '1' : String(minGap),\n        inOptionsMode: true,\n      };\n    }\n\n    return {\n      min: String(this.min),\n      max: String(this.max),\n      step: String(this.step),\n      inOptionsMode: false,\n    };\n  }\n\n  private _toRangeValue(value: string | undefined, normalized: NormalizedOption[] | null): string {\n    if (value == null || value === '') return '';\n    if (normalized) {\n      const found = normalized.find((o) => o.value === value);\n\n      return found !== undefined ? String(found.rangeValue) : '';\n    }\n\n    return value;\n  }\n\n  private _fromRangeValue(rv: string, normalized: NormalizedOption[] | null): string {\n    if (normalized) {\n      const n = Number(rv);\n\n      return normalized.find((o) => o.rangeValue === n)?.value ?? normalized[0]?.value ?? rv;\n    }\n    return rv;\n  }\n\n  private _displayLabel(value: string | undefined, normalized: NormalizedOption[] | null): string {\n    if (value == null || value === '') return '';\n    const label = normalized ? (normalized.find((o) => o.value === value)?.label ?? value) : value;\n\n    return this.percentage ? `${label}%` : label;\n  }\n\n  private _maxValueLabelWidth(\n    normalized: NormalizedOption[] | null,\n    attrs: { min: string; max: string },\n  ): string {\n    const candidates = normalized\n      ? normalized.map((o) => this._displayLabel(o.value, normalized))\n      : [this._displayLabel(attrs.min, null), this._displayLabel(attrs.max, null)];\n    const maxLen = Math.max(...candidates.map((l) => l.length), 1);\n\n    return `${maxLen}ch`;\n  }\n\n  private _updateTrackFill(): void {\n    if (!this.tracked || !this.fieldElement) return;\n    const min = Number(this.fieldElement.min);\n    const max = Number(this.fieldElement.max);\n    const val = Number(this.fieldElement.value);\n    const range = max - min || 1;\n    const pct = Math.max(0, Math.min(100, ((val - min) / range) * 100));\n    this.style.setProperty('--fill-pct', `${pct}%`);\n  }\n\n  private _getMarksData(\n    normalized: NormalizedOption[] | null,\n    attrs: { min: string; max: string; inOptionsMode: boolean },\n  ): Array<{ value: string; label: string; pct: number }> {\n    const minVal = Number(attrs.min);\n    const maxVal = Number(attrs.max);\n    const range = maxVal - minVal || 1;\n\n    const marks = this.marks;\n\n    // Custom marks array — purely visual, no snapping effect\n    if (Array.isArray(marks)) {\n      const result: Array<{ value: string; label: string; pct: number }> = [];\n      for (const m of marks) {\n        const isObj = m !== null && typeof m === 'object';\n        const numVal = isObj ? (m as { value: number }).value : m;\n        if (numVal < minVal || numVal > maxVal) continue;\n        const rawLabel = isObj ? (m.label ?? String(numVal)) : String(numVal);\n        result.push({\n          value: String(numVal),\n          label: this.percentage ? `${rawLabel}%` : rawLabel,\n          pct: ((numVal - minVal) / range) * 100,\n        });\n      }\n\n      return result;\n    }\n\n    // marks === true — auto-generate from options or free-mode endpoints\n    if (normalized) {\n      return normalized.map((o) => ({\n        value: o.value,\n        label: this.percentage ? `${o.label}%` : o.label,\n        pct: ((o.rangeValue - minVal) / range) * 100,\n      }));\n    }\n\n    // Free mode — show min and max endpoints only\n    return [\n      { value: attrs.min, label: this.percentage ? `${minVal}%` : String(minVal), pct: 0 },\n      { value: attrs.max, label: this.percentage ? `${maxVal}%` : String(maxVal), pct: 100 },\n    ];\n  }\n\n  protected writeValue(value: string): void {\n    const normalized = this._normalizeOptions();\n    const rv = this._toRangeValue(value, normalized);\n\n    if (this.fieldElement && rv !== '' && this.fieldElement.value !== rv) {\n      this.fieldElement.value = rv;\n    }\n\n    if (this._valueLabel) {\n      this._valueLabel.textContent = this._displayLabel(value, normalized);\n    }\n\n    // Sync number input only in free mode (options mode disables it)\n    if (this._numberInput && !normalized && this._numberInput.value !== rv) {\n      this._numberInput.value = rv;\n    }\n\n    this._updateTrackFill();\n  }\n\n  protected getValue(): string {\n    if (!this.fieldElement) return '';\n\n    return this._fromRangeValue(this.fieldElement.value, this._normalizeOptions());\n  }\n\n  render() {\n    const normalized = this._normalizeOptions();\n    const attrs = this._getRangeAttrs(normalized);\n\n    return html(({ div, input, span }) => {\n      div({ className: 'range-container' }, () => {\n        // Wrap range + optional marks in a column so marks don't push siblings\n        div({ key: 'range-wrapper', className: 'range-wrapper' }, () => {\n          this.fieldElement = input({\n            key: 'range',\n            type: 'range',\n            min: attrs.min,\n            max: attrs.max,\n            step: attrs.step,\n            '@input': this._boundOnRangeInput,\n            '@change': this.boundOnChange,\n          });\n\n          if (this.marks) {\n            const marksData = this._getMarksData(normalized, attrs);\n            div({ key: 'marks', className: 'marks-container' }, () => {\n              for (const m of marksData) {\n                tags.span(\n                  {\n                    key: `mark-${m.value}`,\n                    className: 'mark',\n                    style: { left: `${m.pct}%` },\n                  },\n                  () => {\n                    tags.span({ className: 'mark-label', textContent: m.label });\n                  },\n                );\n              }\n            });\n          }\n        });\n\n        this._valueLabel = span({\n          key: 'label',\n          className: 'value-label',\n          style: { minWidth: this._maxValueLabelWidth(normalized, attrs) },\n          textContent: this._displayLabel(this.value, normalized),\n        });\n\n        // Action buttons first so the number input can be toggled without disrupting button reuse\n        this.renderActionButtons();\n\n        if (this.editable) {\n          this._numberInput = input({\n            key: 'number',\n            type: 'number',\n            className: 'value-input',\n            min: attrs.min,\n            max: attrs.max,\n            step: attrs.step,\n            // Disabled in options mode: valid values are discrete, free text makes no sense\n            disabled: attrs.inOptionsMode,\n            '@input': this._boundOnNumberInput,\n          });\n        } else {\n          this._numberInput = null;\n        }\n      });\n\n      if (this.value != null) this.writeValue(this.value);\n    });\n  }\n\n  private _onRangeInput(): void {\n    if (!this.fieldElement) return;\n\n    const normalized = this._normalizeOptions();\n    const actualValue = this._fromRangeValue(this.fieldElement.value, normalized);\n\n    if (this._valueLabel) {\n      this._valueLabel.textContent = this._displayLabel(actualValue, normalized);\n    }\n    // Keep number input in sync during drag\n    if (this._numberInput && !normalized) {\n      this._numberInput.value = this.fieldElement.value;\n    }\n\n    this._updateTrackFill();\n  }\n\n  private _onNumberInput(): void {\n    if (!this._numberInput || !this.fieldElement) return;\n    const v = this._numberInput.value;\n\n    if (this.fieldElement.value === v) return;\n\n    this.fieldElement.value = v;\n    if (this._valueLabel) {\n      this._valueLabel.textContent = this._displayLabel(v, null);\n    }\n  }\n\n  public clear(options?: { silent?: boolean }): void {\n    const normalized = this._normalizeOptions();\n    const attrs = this._getRangeAttrs(normalized);\n    // Reset to the option whose rangeValue === min, or to attrs.min in free mode\n    const clearTo = normalized\n      ? (normalized.find((o) => String(o.rangeValue) === attrs.min)?.value ??\n        normalized[0]?.value ??\n        attrs.min)\n      : attrs.min;\n    this.setValue(clearTo, { ...options, action: 'clear' });\n  }\n\n  private _isSliderOption(opt: unknown): opt is SliderOption {\n    return opt !== null && typeof opt === 'object' && 'label' in opt && 'value' in opt;\n  }\n}\n\nSlider.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-slider': Slider;\n  }\n}\n\nexport default Slider;\nexport type SliderProps = InferProps<typeof Slider>;\n"],"names":["AeicoField","prop","_a","html","tags","variables","sizeCSS","colorCSS"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,YAAA,cAAA,eAAA,WAAA,UAAA,UAAA,iBAAA,cAAA,IAAA,OAAA,UAAA,aAAA,MAAA,MAAA,OAAA,WAAA,UAAA;AAUA,MAAM,gBAAe,KAAAA,uBAUnB,eAAA,CAACC,MAAAA,KAAK,EAAE,MAAM,MAAA,CAAO,CAAA,GAGrB,kBAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,CAAA,GAGvB,WAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,WAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,YAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,OAAA,CAAQ,CAAA,GAGtB,gBAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,CAAA,GAGvB,eAAA,CAACA,MAAAA,KAAK,EAAE,MAAM,QAAA,CAAS,CAAA,GAGvB,aAAA,CAACA,MAAAA,KAAK;AAAA,EACJ,MAAM;AAAA;AAAA,EAEN,QAAQ,CAAC,UAAyB;AAChC,QAAI,UAAU,KAAM,QAAO;AAC3B,QAAI,UAAU,MAAM,UAAU,OAAQ,QAAO;AAC7C,QAAI,UAAU,QAAS,QAAO;AAC9B,QAAI;AACF,aAAO,KAAK,MAAM,KAAK;AAAA,IACzB,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AACF,CAAC,IA5CkB,IAAW;AAAA,EAiD9B,cAAc;AACZ,UAAA;AAjDF,kBAAA,MAAU,gBAAwC,IAAA;AAClD,kBAAA,MAAQ,eAAsC,IAAA;AAC9C,kBAAA,MAAQ,gBAAwC,IAAA;AAEhD,kBAAA,MAAQ,oBAAA;AACR,kBAAA,MAAQ,qBAAA;AAKR,iBAAA,MAAS,UAAyB,kBAAlC,OAAA,GAAA,MAAkC,CAAA,CAAC,CAAA,GAAnC,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,aAAa,kBAAtB,OAAA,IAAA,MAAsB,KAAA,CAAA,GAAtB,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,MAAM,kBAAf,OAAA,IAAA,MAAe,CAAA,CAAA,GAAf,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,MAAM,kBAAf,OAAA,IAAA,MAAe,GAAA,CAAA,GAAf,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,OAAO,kBAAhB,OAAA,IAAA,MAAgB,CAAA,CAAA,GAAhB,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,WAAW,kBAApB,OAAA,IAAA,MAAoB,KAAA,CAAA,GAApB,kBAAA,OAAA,IAAA,IAAA;AAGA,iBAAA,MAAS,UAAU,kBAAnB,OAAA,IAAA,MAAmB,KAAA,CAAA,GAAnB,kBAAA,OAAA,IAAA,IAAA;AAgBA,iBAAA,MAAS,QAAT,kBAAA,OAAA,IAAA,IAAA,CAAA,GAAA,kBAAA,OAAA,IAAA,IAAA;AAME,SAAK,qBAAqB,KAAK,cAAc,KAAK,IAAI;AACtD,SAAK,sBAAsB,KAAK,eAAe,KAAK,IAAI;AAAA,EAC1D;AAAA,EAEQ,oBAA+C;AACrD,QAAI,CAAC,MAAM,QAAQ,KAAK,OAAO,KAAK,KAAK,QAAQ,WAAW,EAAG,QAAO;AAEtE,UAAM,OAAO,KAAK,QAAQ;AAAA,MAAI,CAAC,QAC7B,KAAK,gBAAgB,GAAG,IACpB,EAAE,OAAO,IAAI,OAAO,OAAO,OAAO,IAAI,KAAK,MAC3C,EAAE,OAAO,OAAO,GAAG,GAAG,OAAO,OAAO,GAAG,EAAA;AAAA,IAAE;AAI/C,UAAM,aAAa,KAAK,MAAM,CAAC,MAAM,EAAE,UAAU,MAAM,CAAC,MAAM,OAAO,EAAE,KAAK,CAAC,CAAC;AAE9E,QAAI,YAAY;AACd,aAAO,CAAC,GAAG,IAAI,EACZ,KAAK,CAAC,GAAG,MAAM,OAAO,EAAE,KAAK,IAAI,OAAO,EAAE,KAAK,CAAC,EAChD,IAAI,CAAC,OAAO,EAAE,GAAG,GAAG,YAAY,OAAO,EAAE,KAAK,EAAA,EAAI;AAAA,IACvD,OAAO;AACL,aAAO,KAAK,IAAI,CAAC,GAAG,OAAO,EAAE,GAAG,GAAG,YAAY,EAAA,EAAI;AAAA,IACrD;AAAA,EACF;AAAA,EAEQ,eAAe,YAKrB;AACA,QAAI,cAAc,WAAW,UAAU,GAAG;AACxC,YAAM,OAAO,WAAW,IAAI,CAAC,MAAM,EAAE,UAAU;AAC/C,YAAM,MAAM,KAAK,IAAI,GAAG,IAAI;AAC5B,YAAM,MAAM,KAAK,IAAI,GAAG,IAAI;AAG5B,YAAM,SAAS,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,GAAG,MAAM,IAAI,CAAC;AAC7C,UAAI,SAAS;AACb,eAAS,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;AACtC,cAAM,IAAI,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC;AAClC,YAAI,IAAI,KAAK,IAAI,OAAQ,UAAS;AAAA,MACpC;AAEA,aAAO;AAAA,QACL,KAAK,OAAO,GAAG;AAAA,QACf,KAAK,OAAO,GAAG;AAAA,QACf,MAAM,WAAW,WAAW,MAAM,OAAO,MAAM;AAAA,QAC/C,eAAe;AAAA,MAAA;AAAA,IAEnB;AAEA,WAAO;AAAA,MACL,KAAK,OAAO,KAAK,GAAG;AAAA,MACpB,KAAK,OAAO,KAAK,GAAG;AAAA,MACpB,MAAM,OAAO,KAAK,IAAI;AAAA,MACtB,eAAe;AAAA,IAAA;AAAA,EAEnB;AAAA,EAEQ,cAAc,OAA2B,YAA+C;AAC9F,QAAI,SAAS,QAAQ,UAAU,GAAI,QAAO;AAC1C,QAAI,YAAY;AACd,YAAM,QAAQ,WAAW,KAAK,CAAC,MAAM,EAAE,UAAU,KAAK;AAEtD,aAAO,UAAU,SAAY,OAAO,MAAM,UAAU,IAAI;AAAA,IAC1D;AAEA,WAAO;AAAA,EACT;AAAA,EAEQ,gBAAgB,IAAY,YAA+C;;AACjF,QAAI,YAAY;AACd,YAAM,IAAI,OAAO,EAAE;AAEnB,eAAOC,MAAA,WAAW,KAAK,CAAC,MAAM,EAAE,eAAe,CAAC,MAAzC,gBAAAA,IAA4C,YAAS,gBAAW,CAAC,MAAZ,mBAAe,UAAS;AAAA,IACtF;AACA,WAAO;AAAA,EACT;AAAA,EAEQ,cAAc,OAA2B,YAA+C;;AAC9F,QAAI,SAAS,QAAQ,UAAU,GAAI,QAAO;AAC1C,UAAM,QAAQ,eAAcA,MAAA,WAAW,KAAK,CAAC,MAAM,EAAE,UAAU,KAAK,MAAxC,gBAAAA,IAA2C,UAAS,QAAS;AAEzF,WAAO,KAAK,aAAa,GAAG,KAAK,MAAM;AAAA,EACzC;AAAA,EAEQ,oBACN,YACA,OACQ;AACR,UAAM,aAAa,aACf,WAAW,IAAI,CAAC,MAAM,KAAK,cAAc,EAAE,OAAO,UAAU,CAAC,IAC7D,CAAC,KAAK,cAAc,MAAM,KAAK,IAAI,GAAG,KAAK,cAAc,MAAM,KAAK,IAAI,CAAC;AAC7E,UAAM,SAAS,KAAK,IAAI,GAAG,WAAW,IAAI,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC;AAE7D,WAAO,GAAG,MAAM;AAAA,EAClB;AAAA,EAEQ,mBAAyB;AAC/B,QAAI,CAAC,KAAK,WAAW,CAAC,KAAK,aAAc;AACzC,UAAM,MAAM,OAAO,KAAK,aAAa,GAAG;AACxC,UAAM,MAAM,OAAO,KAAK,aAAa,GAAG;AACxC,UAAM,MAAM,OAAO,KAAK,aAAa,KAAK;AAC1C,UAAM,QAAQ,MAAM,OAAO;AAC3B,UAAM,MAAM,KAAK,IAAI,GAAG,KAAK,IAAI,MAAO,MAAM,OAAO,QAAS,GAAG,CAAC;AAClE,SAAK,MAAM,YAAY,cAAc,GAAG,GAAG,GAAG;AAAA,EAChD;AAAA,EAEQ,cACN,YACA,OACsD;AACtD,UAAM,SAAS,OAAO,MAAM,GAAG;AAC/B,UAAM,SAAS,OAAO,MAAM,GAAG;AAC/B,UAAM,QAAQ,SAAS,UAAU;AAEjC,UAAM,QAAQ,KAAK;AAGnB,QAAI,MAAM,QAAQ,KAAK,GAAG;AACxB,YAAM,SAA+D,CAAA;AACrE,iBAAW,KAAK,OAAO;AACrB,cAAM,QAAQ,MAAM,QAAQ,OAAO,MAAM;AACzC,cAAM,SAAS,QAAS,EAAwB,QAAQ;AACxD,YAAI,SAAS,UAAU,SAAS,OAAQ;AACxC,cAAM,WAAW,QAAS,EAAE,SAAS,OAAO,MAAM,IAAK,OAAO,MAAM;AACpE,eAAO,KAAK;AAAA,UACV,OAAO,OAAO,MAAM;AAAA,UACpB,OAAO,KAAK,aAAa,GAAG,QAAQ,MAAM;AAAA,UAC1C,MAAO,SAAS,UAAU,QAAS;AAAA,QAAA,CACpC;AAAA,MACH;AAEA,aAAO;AAAA,IACT;AAGA,QAAI,YAAY;AACd,aAAO,WAAW,IAAI,CAAC,OAAO;AAAA,QAC5B,OAAO,EAAE;AAAA,QACT,OAAO,KAAK,aAAa,GAAG,EAAE,KAAK,MAAM,EAAE;AAAA,QAC3C,MAAO,EAAE,aAAa,UAAU,QAAS;AAAA,MAAA,EACzC;AAAA,IACJ;AAGA,WAAO;AAAA,MACL,EAAE,OAAO,MAAM,KAAK,OAAO,KAAK,aAAa,GAAG,MAAM,MAAM,OAAO,MAAM,GAAG,KAAK,EAAA;AAAA,MACjF,EAAE,OAAO,MAAM,KAAK,OAAO,KAAK,aAAa,GAAG,MAAM,MAAM,OAAO,MAAM,GAAG,KAAK,IAAA;AAAA,IAAI;AAAA,EAEzF;AAAA,EAEU,WAAW,OAAqB;AACxC,UAAM,aAAa,KAAK,kBAAA;AACxB,UAAM,KAAK,KAAK,cAAc,OAAO,UAAU;AAE/C,QAAI,KAAK,gBAAgB,OAAO,MAAM,KAAK,aAAa,UAAU,IAAI;AACpE,WAAK,aAAa,QAAQ;AAAA,IAC5B;AAEA,QAAI,KAAK,aAAa;AACpB,WAAK,YAAY,cAAc,KAAK,cAAc,OAAO,UAAU;AAAA,IACrE;AAGA,QAAI,KAAK,gBAAgB,CAAC,cAAc,KAAK,aAAa,UAAU,IAAI;AACtE,WAAK,aAAa,QAAQ;AAAA,IAC5B;AAEA,SAAK,iBAAA;AAAA,EACP;AAAA,EAEU,WAAmB;AAC3B,QAAI,CAAC,KAAK,aAAc,QAAO;AAE/B,WAAO,KAAK,gBAAgB,KAAK,aAAa,OAAO,KAAK,mBAAmB;AAAA,EAC/E;AAAA,EAEA,SAAS;AACP,UAAM,aAAa,KAAK,kBAAA;AACxB,UAAM,QAAQ,KAAK,eAAe,UAAU;AAE5C,WAAOC,MAAAA,KAAK,CAAC,EAAE,KAAK,OAAO,WAAW;AACpC,UAAI,EAAE,WAAW,kBAAA,GAAqB,MAAM;AAE1C,YAAI,EAAE,KAAK,iBAAiB,WAAW,gBAAA,GAAmB,MAAM;AAC9D,eAAK,eAAe,MAAM;AAAA,YACxB,KAAK;AAAA,YACL,MAAM;AAAA,YACN,KAAK,MAAM;AAAA,YACX,KAAK,MAAM;AAAA,YACX,MAAM,MAAM;AAAA,YACZ,UAAU,KAAK;AAAA,YACf,WAAW,KAAK;AAAA,UAAA,CACjB;AAED,cAAI,KAAK,OAAO;AACd,kBAAM,YAAY,KAAK,cAAc,YAAY,KAAK;AACtD,gBAAI,EAAE,KAAK,SAAS,WAAW,kBAAA,GAAqB,MAAM;AACxD,yBAAW,KAAK,WAAW;AACzBC,sBAAAA,KAAK;AAAA,kBACH;AAAA,oBACE,KAAK,QAAQ,EAAE,KAAK;AAAA,oBACpB,WAAW;AAAA,oBACX,OAAO,EAAE,MAAM,GAAG,EAAE,GAAG,IAAA;AAAA,kBAAI;AAAA,kBAE7B,MAAM;AACJA,0BAAAA,KAAK,KAAK,EAAE,WAAW,cAAc,aAAa,EAAE,OAAO;AAAA,kBAC7D;AAAA,gBAAA;AAAA,cAEJ;AAAA,YACF,CAAC;AAAA,UACH;AAAA,QACF,CAAC;AAED,aAAK,cAAc,KAAK;AAAA,UACtB,KAAK;AAAA,UACL,WAAW;AAAA,UACX,OAAO,EAAE,UAAU,KAAK,oBAAoB,YAAY,KAAK,EAAA;AAAA,UAC7D,aAAa,KAAK,cAAc,KAAK,OAAO,UAAU;AAAA,QAAA,CACvD;AAGD,aAAK,oBAAA;AAEL,YAAI,KAAK,UAAU;AACjB,eAAK,eAAe,MAAM;AAAA,YACxB,KAAK;AAAA,YACL,MAAM;AAAA,YACN,WAAW;AAAA,YACX,KAAK,MAAM;AAAA,YACX,KAAK,MAAM;AAAA,YACX,MAAM,MAAM;AAAA;AAAA,YAEZ,UAAU,MAAM;AAAA,YAChB,UAAU,KAAK;AAAA,UAAA,CAChB;AAAA,QACH,OAAO;AACL,eAAK,eAAe;AAAA,QACtB;AAAA,MACF,CAAC;AAED,UAAI,KAAK,SAAS,KAAM,MAAK,WAAW,KAAK,KAAK;AAAA,IACpD,CAAC;AAAA,EACH;AAAA,EAEQ,gBAAsB;AAC5B,QAAI,CAAC,KAAK,aAAc;AAExB,UAAM,aAAa,KAAK,kBAAA;AACxB,UAAM,cAAc,KAAK,gBAAgB,KAAK,aAAa,OAAO,UAAU;AAE5E,QAAI,KAAK,aAAa;AACpB,WAAK,YAAY,cAAc,KAAK,cAAc,aAAa,UAAU;AAAA,IAC3E;AAEA,QAAI,KAAK,gBAAgB,CAAC,YAAY;AACpC,WAAK,aAAa,QAAQ,KAAK,aAAa;AAAA,IAC9C;AAEA,SAAK,iBAAA;AAAA,EACP;AAAA,EAEQ,iBAAuB;AAC7B,QAAI,CAAC,KAAK,gBAAgB,CAAC,KAAK,aAAc;AAC9C,UAAM,IAAI,KAAK,aAAa;AAE5B,QAAI,KAAK,aAAa,UAAU,EAAG;AAEnC,SAAK,aAAa,QAAQ;AAC1B,QAAI,KAAK,aAAa;AACpB,WAAK,YAAY,cAAc,KAAK,cAAc,GAAG,IAAI;AAAA,IAC3D;AAAA,EACF;AAAA,EAEO,MAAM,SAAsC;;AACjD,UAAM,aAAa,KAAK,kBAAA;AACxB,UAAM,QAAQ,KAAK,eAAe,UAAU;AAE5C,UAAM,UAAU,eACXF,MAAA,WAAW,KAAK,CAAC,MAAM,OAAO,EAAE,UAAU,MAAM,MAAM,GAAG,MAAzD,gBAAAA,IAA4D,YAC7D,gBAAW,CAAC,MAAZ,mBAAe,UACf,MAAM,MACN,MAAM;AACV,SAAK,SAAS,SAAS,EAAE,GAAG,SAAS,QAAQ,SAAS;AAAA,EACxD;AAAA,EAEQ,gBAAgB,KAAmC;AACzD,WAAO,QAAQ,QAAQ,OAAO,QAAQ,YAAY,WAAW,OAAO,WAAW;AAAA,EACjF;AACF;AAtVA,QAAA,iBAAA,EAAA;AAWW,WAAA,oBAAA,QAAA;AAGA,cAAA,oBAAA,QAAA;AAGA,OAAA,oBAAA,QAAA;AAGA,OAAA,oBAAA,QAAA;AAGA,QAAA,oBAAA,QAAA;AAGA,YAAA,oBAAA,QAAA;AAGA,WAAA,oBAAA,QAAA;AAgBA,SAAA,oBAAA,QAAA;AAlCT,kBAAA,OAAA,GAAS,WADT,cAVI,QAWK,QAAA;AAGT,kBAAA,OAAA,GAAS,cADT,iBAbI,QAcK,WAAA;AAGT,kBAAA,OAAA,GAAS,OADT,UAhBI,QAiBK,IAAA;AAGT,kBAAA,OAAA,GAAS,OADT,UAnBI,QAoBK,IAAA;AAGT,kBAAA,OAAA,GAAS,QADT,WAtBI,QAuBK,KAAA;AAGT,kBAAA,OAAA,GAAS,YADT,eAzBI,QA0BK,SAAA;AAGT,kBAAA,OAAA,GAAS,WADT,cA5BI,QA6BK,QAAA;AAgBT,kBAAA,OAAA,GAAS,SAdT,YA/BI,QA6CK,MAAA;AA7CX,oBAAA,OAAM,MAAA;AAQJ,cARI,QAQG,WAAU,QAAA;AAuCjB,cA/CI,QA+Ca,UAAS,CAACG,UAAAA,gBAAWC,KAAAA,SAASC,MAAAA,UAAU,KAAK,CAAA;AAyShE,OAAO,SAAA;;"}
+{"version":3,"file":"slider.cjs","sources":["../../src/slider/slider.ts"],"sourcesContent":["import AeicoField from '../aeico-field';\nimport type { InferProps } from 'aeico';\nimport { html, tags } from 'aeico';\nimport type { NormalizedOption, SliderMarks, SliderOption, SliderOptions } from './defines';\nimport style from '../styles/components/slider.css?inline';\nimport variables from '../styles/variables.css?inline';\nimport sizeCSS from '../styles/size.css?inline';\nimport colorCSS from '../styles/color.css?inline';\nimport fieldLabelCSS from '../styles/components/field-label.css?inline';\nimport actionButtonCSS from '../styles/components/action-button.css?inline';\nimport { prop } from 'aeico';\n\nclass Slider extends AeicoField {\n  protected fieldElement: HTMLInputElement | null = null;\n  private _valueLabel: HTMLSpanElement | null = null;\n  private _numberInput: HTMLInputElement | null = null;\n\n  private _boundOnRangeInput: () => void;\n  private _boundOnNumberInput: () => void;\n\n  static tagName = 'slider';\n\n  @prop({ type: Array })\n  accessor options: SliderOptions = [];\n\n  @prop({ type: Boolean })\n  accessor percentage = false;\n\n  @prop({ type: Number })\n  accessor min = 0;\n\n  @prop({ type: Number })\n  accessor max = 100;\n\n  @prop({ type: Number })\n  accessor step = 1;\n\n  @prop({ type: Boolean })\n  accessor editable = false;\n\n  @prop({ type: Boolean })\n  accessor tracked = false;\n\n  @prop({\n    type: Array,\n    // bare attribute (<ae-slider marks>) → true; JSON array → MarkItem[]\n    parser: (value: string | null) => {\n      if (value === null) return undefined;\n      if (value === '' || value === 'true') return true;\n      if (value === 'false') return false;\n      try {\n        return JSON.parse(value);\n      } catch {\n        return true;\n      }\n    },\n  })\n  accessor marks: SliderMarks | undefined;\n\n  protected static styles = [variables, sizeCSS, colorCSS, fieldLabelCSS, actionButtonCSS, style];\n\n  constructor() {\n    super();\n    this._boundOnRangeInput = this._onRangeInput.bind(this);\n    this._boundOnNumberInput = this._onNumberInput.bind(this);\n  }\n\n  private _normalizeOptions(): NormalizedOption[] | null {\n    if (!Array.isArray(this.options) || this.options.length === 0) return null;\n\n    const opts = this.options.map((opt) =>\n      this._isSliderOption(opt)\n        ? { label: opt.label, value: String(opt.value) }\n        : { label: String(opt), value: String(opt) },\n    );\n\n    // Sort by numeric value if all values are numeric; otherwise keep original order\n    const allNumeric = opts.every((o) => o.value !== '' && !isNaN(Number(o.value)));\n\n    if (allNumeric) {\n      return [...opts]\n        .sort((a, b) => Number(a.value) - Number(b.value))\n        .map((o) => ({ ...o, rangeValue: Number(o.value) }));\n    } else {\n      return opts.map((o, i) => ({ ...o, rangeValue: i }));\n    }\n  }\n\n  private _getRangeAttrs(normalized: NormalizedOption[] | null): {\n    min: string;\n    max: string;\n    step: string;\n    inOptionsMode: boolean;\n  } {\n    if (normalized && normalized.length >= 1) {\n      const vals = normalized.map((o) => o.rangeValue);\n      const min = Math.min(...vals);\n      const max = Math.max(...vals);\n\n      // Compute step from minimum gap between adjacent sorted values\n      const sorted = [...vals].sort((a, b) => a - b);\n      let minGap = Infinity;\n      for (let i = 1; i < sorted.length; i++) {\n        const d = sorted[i] - sorted[i - 1];\n        if (d > 0 && d < minGap) minGap = d;\n      }\n\n      return {\n        min: String(min),\n        max: String(max),\n        step: minGap === Infinity ? '1' : String(minGap),\n        inOptionsMode: true,\n      };\n    }\n\n    return {\n      min: String(this.min),\n      max: String(this.max),\n      step: String(this.step),\n      inOptionsMode: false,\n    };\n  }\n\n  private _toRangeValue(value: string | undefined, normalized: NormalizedOption[] | null): string {\n    if (value == null || value === '') return '';\n    if (normalized) {\n      const found = normalized.find((o) => o.value === value);\n\n      return found !== undefined ? String(found.rangeValue) : '';\n    }\n\n    return value;\n  }\n\n  private _fromRangeValue(rv: string, normalized: NormalizedOption[] | null): string {\n    if (normalized) {\n      const n = Number(rv);\n\n      return normalized.find((o) => o.rangeValue === n)?.value ?? normalized[0]?.value ?? rv;\n    }\n    return rv;\n  }\n\n  private _displayLabel(value: string | undefined, normalized: NormalizedOption[] | null): string {\n    if (value == null || value === '') return '';\n    const label = normalized ? (normalized.find((o) => o.value === value)?.label ?? value) : value;\n\n    return this.percentage ? `${label}%` : label;\n  }\n\n  private _maxValueLabelWidth(\n    normalized: NormalizedOption[] | null,\n    attrs: { min: string; max: string },\n  ): string {\n    const candidates = normalized\n      ? normalized.map((o) => this._displayLabel(o.value, normalized))\n      : [this._displayLabel(attrs.min, null), this._displayLabel(attrs.max, null)];\n    const maxLen = Math.max(...candidates.map((l) => l.length), 1);\n\n    return `${maxLen}ch`;\n  }\n\n  private _updateTrackFill(): void {\n    if (!this.tracked || !this.fieldElement) return;\n    const min = Number(this.fieldElement.min);\n    const max = Number(this.fieldElement.max);\n    const val = Number(this.fieldElement.value);\n    const range = max - min || 1;\n    const pct = Math.max(0, Math.min(100, ((val - min) / range) * 100));\n    this.style.setProperty('--fill-pct', `${pct}%`);\n  }\n\n  private _getMarksData(\n    normalized: NormalizedOption[] | null,\n    attrs: { min: string; max: string; inOptionsMode: boolean },\n  ): Array<{ value: string; label: string; pct: number }> {\n    const minVal = Number(attrs.min);\n    const maxVal = Number(attrs.max);\n    const range = maxVal - minVal || 1;\n\n    const marks = this.marks;\n\n    // Custom marks array — purely visual, no snapping effect\n    if (Array.isArray(marks)) {\n      const result: Array<{ value: string; label: string; pct: number }> = [];\n      for (const m of marks) {\n        const isObj = m !== null && typeof m === 'object';\n        const numVal = isObj ? (m as { value: number }).value : m;\n        if (numVal < minVal || numVal > maxVal) continue;\n        const rawLabel = isObj ? (m.label ?? String(numVal)) : String(numVal);\n        result.push({\n          value: String(numVal),\n          label: this.percentage ? `${rawLabel}%` : rawLabel,\n          pct: ((numVal - minVal) / range) * 100,\n        });\n      }\n\n      return result;\n    }\n\n    // marks === true — auto-generate from options or free-mode endpoints\n    if (normalized) {\n      return normalized.map((o) => ({\n        value: o.value,\n        label: this.percentage ? `${o.label}%` : o.label,\n        pct: ((o.rangeValue - minVal) / range) * 100,\n      }));\n    }\n\n    // Free mode — show min and max endpoints only\n    return [\n      { value: attrs.min, label: this.percentage ? `${minVal}%` : String(minVal), pct: 0 },\n      { value: attrs.max, label: this.percentage ? `${maxVal}%` : String(maxVal), pct: 100 },\n    ];\n  }\n\n  protected writeValue(value: string): void {\n    const normalized = this._normalizeOptions();\n    const rv = this._toRangeValue(value, normalized);\n\n    if (this.fieldElement && rv !== '' && this.fieldElement.value !== rv) {\n      this.fieldElement.value = rv;\n    }\n\n    if (this._valueLabel) {\n      this._valueLabel.textContent = this._displayLabel(value, normalized);\n    }\n\n    // Sync number input only in free mode (options mode disables it)\n    if (this._numberInput && !normalized && this._numberInput.value !== rv) {\n      this._numberInput.value = rv;\n    }\n\n    this._updateTrackFill();\n  }\n\n  protected getValue(): string {\n    if (!this.fieldElement) return '';\n\n    return this._fromRangeValue(this.fieldElement.value, this._normalizeOptions());\n  }\n\n  render() {\n    const normalized = this._normalizeOptions();\n    const attrs = this._getRangeAttrs(normalized);\n\n    return html(({ div, input, span }) => {\n      const id = this.getFieldId();\n      this.renderLabel(id);\n      div({ className: 'range-container field-body' }, () => {\n        // Wrap range + optional marks in a column so marks don't push siblings\n        div({ key: 'range-wrapper', className: 'range-wrapper' }, () => {\n          this.fieldElement = input({\n            key: 'range',\n            id,\n            type: 'range',\n            min: attrs.min,\n            max: attrs.max,\n            step: attrs.step,\n            '@input': this._boundOnRangeInput,\n            '@change': this.boundOnChange,\n          });\n\n          if (this.marks) {\n            const marksData = this._getMarksData(normalized, attrs);\n            div({ key: 'marks', className: 'marks-container' }, () => {\n              for (const m of marksData) {\n                tags.span(\n                  {\n                    key: `mark-${m.value}`,\n                    className: 'mark',\n                    style: { left: `${m.pct}%` },\n                  },\n                  () => {\n                    tags.span({ className: 'mark-label', textContent: m.label });\n                  },\n                );\n              }\n            });\n          }\n        });\n\n        this._valueLabel = span({\n          key: 'label',\n          className: 'value-label',\n          style: { minWidth: this._maxValueLabelWidth(normalized, attrs) },\n          textContent: this._displayLabel(this.value, normalized),\n        });\n\n        // Action buttons first so the number input can be toggled without disrupting button reuse\n        this.renderActionButtons();\n\n        if (this.editable) {\n          this._numberInput = input({\n            key: 'number',\n            type: 'number',\n            className: 'value-input',\n            min: attrs.min,\n            max: attrs.max,\n            step: attrs.step,\n            // Disabled in options mode: valid values are discrete, free text makes no sense\n            disabled: attrs.inOptionsMode,\n            '@input': this._boundOnNumberInput,\n          });\n        } else {\n          this._numberInput = null;\n        }\n      });\n\n      if (this.value != null) this.writeValue(this.value);\n      this.renderHelperText();\n      this.renderError();\n    });\n  }\n\n  private _onRangeInput(): void {\n    if (!this.fieldElement) return;\n\n    const normalized = this._normalizeOptions();\n    const actualValue = this._fromRangeValue(this.fieldElement.value, normalized);\n\n    if (this._valueLabel) {\n      this._valueLabel.textContent = this._displayLabel(actualValue, normalized);\n    }\n    // Keep number input in sync during drag\n    if (this._numberInput && !normalized) {\n      this._numberInput.value = this.fieldElement.value;\n    }\n\n    this._updateTrackFill();\n  }\n\n  private _onNumberInput(): void {\n    if (!this._numberInput || !this.fieldElement) return;\n    const v = this._numberInput.value;\n\n    if (this.fieldElement.value === v) return;\n\n    this.fieldElement.value = v;\n    if (this._valueLabel) {\n      this._valueLabel.textContent = this._displayLabel(v, null);\n    }\n  }\n\n  public clear(options?: { silent?: boolean }): void {\n    const normalized = this._normalizeOptions();\n    const attrs = this._getRangeAttrs(normalized);\n    // Reset to the option whose rangeValue === min, or to attrs.min in free mode\n    const clearTo = normalized\n      ? (normalized.find((o) => String(o.rangeValue) === attrs.min)?.value ??\n        normalized[0]?.value ??\n        attrs.min)\n      : attrs.min;\n    this.setValue(clearTo, { ...options, action: 'clear' });\n  }\n\n  private _isSliderOption(opt: unknown): opt is SliderOption {\n    return opt !== null && typeof opt === 'object' && 'label' in opt && 'value' in opt;\n  }\n}\n\nSlider.register();\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ae-slider': Slider;\n  }\n}\n\nexport default Slider;\nexport type SliderProps = InferProps<typeof Slider>;\n"],"names":["AeicoField","prop","_a","html","tags","variables","sizeCSS","colorCSS","fieldLabelCSS","actionButtonCSS"],"mappings":"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"}