@greypan/web-ui 2.1.5 → 2.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/README.CN.md +52 -36
  2. package/README.md +55 -36
  3. package/dist/assets/glass.js.map +1 -1
  4. package/dist/components/avatar/index.js +1 -1
  5. package/dist/components/avatar/index.js.map +1 -1
  6. package/dist/components/back-top/index.js +1 -1
  7. package/dist/components/back-top/index.js.map +1 -1
  8. package/dist/components/button/index.d.ts +6 -1
  9. package/dist/components/button/index.js +35 -14
  10. package/dist/components/button/index.js.map +1 -1
  11. package/dist/components/button/style.js +1 -1
  12. package/dist/components/button/style.js.map +1 -1
  13. package/dist/components/checkbox/index.d.ts +0 -3
  14. package/dist/components/checkbox/index.js.map +1 -1
  15. package/dist/components/checkbox/style.js +1 -1
  16. package/dist/components/checkbox/style.js.map +1 -1
  17. package/dist/components/context-menu/index.d.ts +4 -3
  18. package/dist/components/context-menu/index.js +47 -50
  19. package/dist/components/context-menu/index.js.map +1 -1
  20. package/dist/components/dialog/index.d.ts +1 -1
  21. package/dist/components/dialog/index.js +20 -19
  22. package/dist/components/dialog/index.js.map +1 -1
  23. package/dist/components/dialog/style.js +1 -1
  24. package/dist/components/dialog/style.js.map +1 -1
  25. package/dist/components/drawer/index.d.ts +2 -3
  26. package/dist/components/drawer/index.js +41 -31
  27. package/dist/components/drawer/index.js.map +1 -1
  28. package/dist/components/drawer/style.js +1 -1
  29. package/dist/components/drawer/style.js.map +1 -1
  30. package/dist/components/dropdown/index.d.ts +2 -9
  31. package/dist/components/dropdown/index.js +55 -51
  32. package/dist/components/dropdown/index.js.map +1 -1
  33. package/dist/components/dropdown-item/index.d.ts +0 -1
  34. package/dist/components/dropdown-item/index.js.map +1 -1
  35. package/dist/components/dropdown-item/style.js +1 -1
  36. package/dist/components/dropdown-item/style.js.map +1 -1
  37. package/dist/components/empty/index.js.map +1 -1
  38. package/dist/components/input/index.d.ts +1 -0
  39. package/dist/components/input/index.js +27 -14
  40. package/dist/components/input/index.js.map +1 -1
  41. package/dist/components/input/style.js +1 -1
  42. package/dist/components/input/style.js.map +1 -1
  43. package/dist/components/input-number/index.d.ts +3 -0
  44. package/dist/components/input-number/index.js +11 -3
  45. package/dist/components/input-number/index.js.map +1 -1
  46. package/dist/components/input-number/style.js +1 -1
  47. package/dist/components/input-number/style.js.map +1 -1
  48. package/dist/components/layout/style.js +1 -1
  49. package/dist/components/layout/style.js.map +1 -1
  50. package/dist/components/option/index.js +1 -1
  51. package/dist/components/option/index.js.map +1 -1
  52. package/dist/components/option/style.js +1 -1
  53. package/dist/components/option/style.js.map +1 -1
  54. package/dist/components/popover/index.d.ts +1 -5
  55. package/dist/components/popover/index.js +41 -36
  56. package/dist/components/popover/index.js.map +1 -1
  57. package/dist/components/radio/index.d.ts +0 -3
  58. package/dist/components/radio/index.js.map +1 -1
  59. package/dist/components/radio/style.js +1 -1
  60. package/dist/components/radio/style.js.map +1 -1
  61. package/dist/components/segmented/index.js +6 -2
  62. package/dist/components/segmented/index.js.map +1 -1
  63. package/dist/components/segmented/style.js +1 -1
  64. package/dist/components/segmented/style.js.map +1 -1
  65. package/dist/components/segmented-trigger/index.js +1 -1
  66. package/dist/components/segmented-trigger/index.js.map +1 -1
  67. package/dist/components/segmented-trigger/style.js +1 -1
  68. package/dist/components/segmented-trigger/style.js.map +1 -1
  69. package/dist/components/select/index.d.ts +1 -0
  70. package/dist/components/select/index.js +11 -6
  71. package/dist/components/select/index.js.map +1 -1
  72. package/dist/components/slider/index.d.ts +0 -2
  73. package/dist/components/slider/index.js +1 -1
  74. package/dist/components/slider/index.js.map +1 -1
  75. package/dist/components/spinner/index.d.ts +0 -2
  76. package/dist/components/spinner/index.js.map +1 -1
  77. package/dist/components/svg-draw-lines/index.d.ts +0 -2
  78. package/dist/components/svg-draw-lines/index.js.map +1 -1
  79. package/dist/components/switch/index.d.ts +0 -1
  80. package/dist/components/switch/index.js.map +1 -1
  81. package/dist/components/switch/style.js +1 -1
  82. package/dist/components/switch/style.js.map +1 -1
  83. package/dist/components/textarea/index.d.ts +1 -0
  84. package/dist/components/textarea/index.js +47 -33
  85. package/dist/components/textarea/index.js.map +1 -1
  86. package/dist/components/textarea/style.js +1 -1
  87. package/dist/components/textarea/style.js.map +1 -1
  88. package/dist/components/theme/index.d.ts +0 -2
  89. package/dist/components/theme/index.js.map +1 -1
  90. package/dist/components/theme/style.js +1 -1
  91. package/dist/components/theme/style.js.map +1 -1
  92. package/dist/components/toast/manager.js.map +1 -1
  93. package/dist/components/toast/style.js +1 -1
  94. package/dist/components/toast/style.js.map +1 -1
  95. package/dist/components/toast/toast.d.ts +0 -4
  96. package/dist/components/toast/toast.js +14 -6
  97. package/dist/components/toast/toast.js.map +1 -1
  98. package/dist/components/toast/types.d.ts +0 -3
  99. package/dist/components/tooltip/index.d.ts +1 -0
  100. package/dist/components/tooltip/index.js +31 -30
  101. package/dist/components/tooltip/index.js.map +1 -1
  102. package/dist/shared/events/user-change.js +17 -0
  103. package/dist/shared/events/user-change.js.map +1 -0
  104. package/dist/shared/normalize/index.js.map +1 -1
  105. package/dist/shared/overlay/native-dialog-presence.js +8 -3
  106. package/dist/shared/overlay/native-dialog-presence.js.map +1 -1
  107. package/dist/shared/overlay/overlay.js.map +1 -1
  108. package/dist/shared/overlay/portal.js +3 -1
  109. package/dist/shared/overlay/portal.js.map +1 -1
  110. package/dist/shared/overlay/presence.js.map +1 -1
  111. package/package.json +9 -4
@@ -41,8 +41,7 @@ var h = class extends c {
41
41
  let t = e.target;
42
42
  t.removeEventListener("click", this._handleOptionClick), t.removeEventListener("pointerover", this._handleOptionPointerOver), t.removeEventListener("pointerdown", this._handleOptionPointerDown), t.removeEventListener("option-update", this._onOptionUpdate), this._options = this._options.filter((e) => e !== t);
43
43
  }, this._onSlotChange = () => {
44
- let e = this.portal && this._panel.getPanel() ? [...this._panel.getPanel().querySelectorAll("web-ui-option")] : [...this.querySelectorAll("web-ui-option")];
45
- this._options = e, this._ensureOptionIds(), this._syncSelected();
44
+ this._options = this._queryOptions(), this._ensureOptionIds(), this._syncSelected();
46
45
  }, this._handleOptionClick = (e) => {
47
46
  if (!(e.currentTarget instanceof HTMLElement)) return;
48
47
  let t = e.currentTarget;
@@ -114,8 +113,12 @@ var h = class extends c {
114
113
  this.isConnected && this._onSlotChange();
115
114
  });
116
115
  }
116
+ _queryOptions() {
117
+ let e = this.portal ? this._panel.getPanel() : null, t = e ? [...e.querySelectorAll("web-ui-option")] : [];
118
+ return t.length > 0 ? t : [...this.querySelectorAll("web-ui-option")];
119
+ }
117
120
  willUpdate() {
118
- this._options = this.portal && this._panel.getPanel() ? [...this._panel.getPanel().querySelectorAll("web-ui-option")] : [...this.querySelectorAll("web-ui-option")], this._ensureOptionIds(), this._syncSelected();
121
+ this._options = this._queryOptions(), this._ensureOptionIds(), this._syncSelected();
119
122
  }
120
123
  updated(e) {
121
124
  (e.has("portal") || e.has("overlayContainer")) && requestAnimationFrame(() => this._reconfigureOverlay()), e.has("noScrollLock") && this._syncScrollLock(), this._syncOpenAttribute(), this._syncValidity();
@@ -227,24 +230,26 @@ var h = class extends c {
227
230
  this._panel.reconfigure(this._isOpen);
228
231
  }
229
232
  render() {
233
+ let e = `${this.localName}-listbox`, t = !this.portal && this._isOpen && this._activeIndex >= 0 ? this._options[this._activeIndex]?.id ?? u : u;
230
234
  return l`
231
235
  <div class="wui-select-inner">
232
236
  <div
233
237
  class="wui-glass select-trigger"
234
238
  ?data-custom-trigger=${this._hasTriggerSlot}
235
239
  @click=${this._togglePopup}
236
- tabindex=${this._isDisabled ? -1 : 0}
240
+ tabindex=${this._isDisabled ? "-1" : "0"}
237
241
  role="combobox"
238
242
  aria-expanded=${this._isOpen}
239
243
  aria-haspopup="listbox"
244
+ aria-controls=${this.portal ? u : e}
240
245
  aria-disabled=${String(this._isDisabled)}
241
- aria-activedescendant=${this._isOpen && this._activeIndex >= 0 ? this._options[this._activeIndex]?.id : u}
246
+ aria-activedescendant=${t}
242
247
  >
243
248
  <slot name="trigger" @slotchange=${this._onTriggerSlotChange}></slot>
244
249
  ${this._hasTriggerSlot ? u : l`<span class="label">${this._selectedLabel}</span>`}
245
250
  <web-ui-icon class="arrow" .icon=${n}></web-ui-icon>
246
251
  </div>
247
- <div class="wui-glass select-overlay wui-floating-panel" hidden role="listbox">
252
+ <div class="wui-glass select-overlay wui-floating-panel" hidden role="listbox" id=${e}>
248
253
  <div class="select-scroll">
249
254
  <div class="select-content">
250
255
  <slot @slotchange=${this._onSlotChange}></slot>
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/select/index.ts"],"sourcesContent":["import { html, LitElement, nothing, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport '@/components/icon'\nimport '@/components/option'\nimport glass from '@/assets/glass.css?inline'\nimport overlayMotion from '@/assets/overlay-motion.css?inline'\nimport type { WebUiOption } from '@/components/option'\nimport { lucideChevronDown } from '@/icons'\nimport { defineAnchoredPanel } from '@/shared/overlay/anchored-panel'\nimport { createOverlayPortal } from '@/shared/overlay/portal'\nimport type { OverlayContainer, OverlayPortal } from '@/shared/overlay/portal'\nimport { createScrollLockLease } from '@/shared/scroll-lock/scroll-lock'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-select')\nexport class WebUiSelect extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(overlayMotion), unsafeCSS(style)]\n\n static formAssociated = true\n\n // ElementInternals 实例,在 connectedCallback 中初始化\n private _internals?: ElementInternals\n @state() private _formDisabled = false\n\n @property({ type: String, reflect: true }) placeholder = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n @property({ type: Boolean, reflect: true }) portal = false\n @property({ type: Boolean, reflect: true, attribute: 'no-scroll-lock' }) noScrollLock = false\n @property({ attribute: false }) overlayContainer?: OverlayContainer\n @property({ type: String, reflect: true }) name = ''\n\n // value 使用内部状态 + 访问器模式,在变更时同步 ElementInternals\n @state() private _value = ''\n get value(): string {\n return this._value\n }\n set value(v: string) {\n const old = this._value\n this._value = v\n this._internals?.setFormValue?.(v)\n this.toggleAttribute('data-has-value', !!v)\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n @state() private _isOpen = false\n @state() private _activeIndex = -1\n @state() private _selectedLabel = ''\n @state() private _hasTriggerSlot = false\n\n private _options: WebUiOption[] = []\n private readonly _scrollLock = createScrollLockLease()\n private readonly _panel = defineAnchoredPanel().make({\n getAnchor: () => this.shadowRoot?.querySelector<HTMLElement>('.select-trigger') ?? null,\n getLocalPanel: () => this.shadowRoot?.querySelector<HTMLElement>('.select-overlay') ?? null,\n getPositioning: () => ({ placement: 'bottom-start', offset: 4, strategy: this.portal ? 'fixed' : 'absolute' }),\n isPortal: () => this.portal,\n createPortal: () => this._createPortal()\n })\n\n get isOpen(): boolean {\n return this._isOpen\n }\n\n get open(): boolean {\n return this._isOpen\n }\n\n private _onClickOutside = (e: MouseEvent) => {\n if (\n this._isOpen &&\n e.target instanceof Node &&\n !this.contains(e.target) &&\n !this._panel.getPanel()?.contains(e.target)\n ) {\n this._close()\n }\n }\n\n private _onFocusOut = () => {\n requestAnimationFrame(() => {\n if (this._isOpen && !this.matches(':focus-within') && !this._panel.getPanel()?.matches(':focus-within')) {\n this._close()\n }\n })\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this._internals = this.attachInternals()\n // 同步 HTML 属性中预设的 value,补全访问器模式不处理 attribute 反射\n const attrValue = this.getAttribute('value')\n if (attrValue !== null) {\n this._value = attrValue\n this.toggleAttribute('data-has-value', !!attrValue)\n }\n this._internals?.setFormValue?.(this._value)\n this.addEventListener('option-register', this._onOptionRegister)\n this.addEventListener('option-unregister', this._onOptionUnregister)\n this.addEventListener('keydown', this._onKeydown)\n this.addEventListener('focusout', this._onFocusOut)\n document.addEventListener('click', this._onClickOutside)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this.removeEventListener('option-register', this._onOptionRegister)\n this.removeEventListener('option-unregister', this._onOptionUnregister)\n this.removeEventListener('keydown', this._onKeydown)\n this.removeEventListener('focusout', this._onFocusOut)\n document.removeEventListener('click', this._onClickOutside)\n this._options.forEach(o => {\n o.removeEventListener('click', this._handleOptionClick)\n o.removeEventListener('pointerover', this._handleOptionPointerOver)\n o.removeEventListener('pointerdown', this._handleOptionPointerDown)\n o.removeEventListener('option-update', this._onOptionUpdate)\n })\n this._close()\n this._panel.dispose()\n this._scrollLock.release()\n }\n\n override firstUpdated() {\n requestAnimationFrame(() => {\n if (this.isConnected) this._onSlotChange()\n })\n }\n\n override willUpdate() {\n this._options =\n this.portal && this._panel.getPanel()\n ? [...this._panel.getPanel()!.querySelectorAll<WebUiOption>('web-ui-option')]\n : [...this.querySelectorAll<WebUiOption>('web-ui-option')]\n this._ensureOptionIds()\n this._syncSelected()\n }\n\n override updated(changed: PropertyValues) {\n if (changed.has('portal') || changed.has('overlayContainer'))\n requestAnimationFrame(() => this._reconfigureOverlay())\n if (changed.has('noScrollLock')) this._syncScrollLock()\n this._syncOpenAttribute()\n this._syncValidity()\n }\n\n formResetCallback() {\n this.value = this.getAttribute('value') || ''\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n private _syncValidity() {\n if (!this._internals || typeof this._internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this.value) this._internals.setValidity({})\n else this._internals.setValidity({ valueMissing: true }, '请选择一项')\n }\n\n private _syncOpenAttribute() {\n this.toggleAttribute('open', this._isOpen)\n }\n\n private _onTriggerSlotChange = (e: Event) => {\n const slot = e.target as HTMLSlotElement\n const hasContent = slot.assignedElements().length > 0\n if (this._hasTriggerSlot === hasContent) return\n this._hasTriggerSlot = hasContent\n this._reconfigureOverlay()\n }\n\n private _syncSelected() {\n this._options.forEach(o => {\n o.selected = o.value === this.value\n })\n if (!this.value) {\n this._selectedLabel = this.placeholder\n return\n }\n const option = this._options.find(o => o.value === this.value)\n this._selectedLabel = option?.label || this.placeholder\n }\n\n private _ensureOptionIds() {\n this._options.forEach((option, index) => {\n if (!option.id) option.id = `${this.localName}-option-${index}`\n })\n }\n\n private _onOptionRegister = (e: Event) => {\n if (!(e.target instanceof HTMLElement)) return\n const target = e.target as WebUiOption\n target.addEventListener('click', this._handleOptionClick)\n target.addEventListener('pointerover', this._handleOptionPointerOver)\n target.addEventListener('pointerdown', this._handleOptionPointerDown)\n target.addEventListener('option-update', this._onOptionUpdate)\n this._options.push(target)\n this._ensureOptionIds()\n this._syncSelected()\n }\n\n private _onOptionUnregister = (e: Event) => {\n if (!(e.target instanceof HTMLElement)) return\n const target = e.target as WebUiOption\n target.removeEventListener('click', this._handleOptionClick)\n target.removeEventListener('pointerover', this._handleOptionPointerOver)\n target.removeEventListener('pointerdown', this._handleOptionPointerDown)\n target.removeEventListener('option-update', this._onOptionUpdate)\n this._options = this._options.filter(o => o !== target)\n }\n\n private _onSlotChange = () => {\n const options =\n this.portal && this._panel.getPanel()\n ? [...this._panel.getPanel()!.querySelectorAll<WebUiOption>('web-ui-option')]\n : [...this.querySelectorAll<WebUiOption>('web-ui-option')]\n this._options = options\n this._ensureOptionIds()\n this._syncSelected()\n }\n\n private _handleOptionClick = (e: Event) => {\n if (!(e.currentTarget instanceof HTMLElement)) return\n const option = e.currentTarget as WebUiOption\n if (option.disabled) return\n this.value = option.value\n this._close()\n this._notifyValueChange()\n }\n\n private _onOptionUpdate = () => {\n this._syncSelected()\n this._syncActiveOption()\n }\n\n private _handleOptionPointerOver = (e: PointerEvent) => {\n if (e.pointerType === 'touch') return\n if (!this._isOpen || this._activeIndex < 0 || !(e.currentTarget instanceof HTMLElement)) return\n\n // 指针接管后只保留 :hover,避免键盘激活项与悬停项同时高亮。\n this._activeIndex = -1\n this._syncActiveOption()\n }\n\n private _handleOptionPointerDown = (e: PointerEvent) => {\n // 保持 trigger 焦点,避免 focusout 在 click 前关闭浮层。\n e.preventDefault()\n }\n\n private _onKeydown = (e: KeyboardEvent) => {\n if (this._isDisabled) return\n\n switch (e.key) {\n case 'Escape':\n if (this._isOpen) {\n this._close()\n e.preventDefault()\n }\n break\n case 'ArrowDown':\n e.preventDefault()\n if (!this._isOpen) {\n this._open(true)\n } else {\n this._navigateActive(1)\n }\n break\n case 'ArrowUp':\n e.preventDefault()\n if (!this._isOpen) this._open(true)\n else this._navigateActive(-1)\n break\n case 'Enter':\n if (this._isOpen && this._activeIndex >= 0) {\n const option = this._options[this._activeIndex]\n if (option && !option.disabled) {\n this.value = option.value\n this._notifyValueChange()\n }\n this._close()\n e.preventDefault()\n }\n break\n }\n }\n\n private _navigateActive(delta: number) {\n const enabled = this._options.filter(o => !o.disabled)\n if (!enabled.length) return\n\n const selectedOption = this._options.find(option => option.value === this.value && !option.disabled)\n const currentIdx =\n this._activeIndex >= 0\n ? enabled.indexOf(this._options[this._activeIndex])\n : selectedOption\n ? enabled.indexOf(selectedOption)\n : delta > 0\n ? -1\n : 0\n let nextIdx = currentIdx + delta\n if (nextIdx < 0) nextIdx = enabled.length - 1\n if (nextIdx >= enabled.length) nextIdx = 0\n\n const nextOption = enabled[nextIdx]\n this._activeIndex = this._options.indexOf(nextOption)\n\n this._syncActiveOption()\n }\n\n private _open(isKeyboardNavigation = false) {\n if (this._isDisabled || this._isOpen) return\n this._isOpen = true\n this._dispatchOpenChange()\n this._syncSelected()\n if (isKeyboardNavigation) this._setInitialActiveOption()\n else this._syncActiveOption()\n this._syncScrollLock()\n if (this.portal) {\n requestAnimationFrame(() => {\n if (this._isOpen) this._openOverlay(isKeyboardNavigation)\n })\n } else {\n this._openOverlay(isKeyboardNavigation)\n }\n }\n\n private _close() {\n if (!this._isOpen) return\n this._isOpen = false\n this._dispatchOpenChange()\n this._activeIndex = -1\n this._options.forEach(o => o.removeAttribute('active'))\n this._syncScrollLock(false)\n void this._closeOverlay()\n }\n\n private _dispatchOpenChange() {\n this.dispatchEvent(\n new CustomEvent('open-change', {\n detail: { open: this._isOpen },\n bubbles: true,\n composed: true\n })\n )\n }\n\n private _setInitialActiveOption() {\n const selectedIndex = this._options.findIndex(option => option.value === this.value && !option.disabled)\n const firstEnabledIndex = this._options.findIndex(option => !option.disabled)\n this._activeIndex = selectedIndex >= 0 ? selectedIndex : firstEnabledIndex\n this._syncActiveOption()\n }\n\n private _syncActiveOption() {\n this._options.forEach((option, index) => option.toggleAttribute('active', index === this._activeIndex))\n }\n\n private _notifyValueChange() {\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n\n private _syncScrollLock(isOpen = this._isOpen) {\n this._scrollLock.sync(isOpen && !this.noScrollLock)\n }\n\n private _togglePopup() {\n if (this._isDisabled) return\n if (this._isOpen) this._close()\n else this._open()\n }\n\n private _openOverlay(isKeyboardNavigation = false) {\n const panel = !this.portal ? this._panel.getPanel() : null\n if (panel) panel.style.width = `${this._getDesiredWidth()}px`\n this._panel.open(isKeyboardNavigation)\n }\n\n private _getDesiredWidth(): number {\n const trigger = this.shadowRoot?.querySelector<HTMLElement>('.select-trigger')\n const triggerWidth = trigger?.offsetWidth || 0\n\n const options = [...this.querySelectorAll<WebUiOption>('web-ui-option')]\n let maxOptionWidth = 0\n options.forEach(opt => {\n const label = opt.shadowRoot?.querySelector<HTMLElement>('.option-label')\n const w = label?.scrollWidth || opt.scrollWidth || 0\n if (w > maxOptionWidth) maxOptionWidth = w\n })\n\n return Math.max(120, triggerWidth, maxOptionWidth)\n }\n\n private _createPortal(): OverlayPortal {\n const desiredWidth = this._getDesiredWidth()\n\n const portal = createOverlayPortal({\n container: this.overlayContainer,\n target: this,\n style: `${glass}\\n${overlayMotion}\\n${style}`,\n className: 'wui-glass select-overlay portal wui-floating-panel'\n })\n portal.panel.style.width = `${desiredWidth}px`\n portal.panel.setAttribute('role', 'listbox')\n const scroll = document.createElement('div')\n scroll.className = 'select-scroll'\n const content = document.createElement('div')\n content.className = 'select-content'\n scroll.append(content)\n portal.panel.append(scroll)\n portal.moveContent(Array.from(this.children), content)\n return portal\n }\n\n private async _closeOverlay() {\n await this._panel.close(() => this._isOpen)\n }\n\n private _reconfigureOverlay() {\n if (!this.portal) {\n const panel = this._panel.getPanel()\n if (panel) panel.style.width = `${this._getDesiredWidth()}px`\n }\n this._panel.reconfigure(this._isOpen)\n }\n\n override render() {\n return html`\n <div class=\"wui-select-inner\">\n <div\n class=\"wui-glass select-trigger\"\n ?data-custom-trigger=${this._hasTriggerSlot}\n @click=${this._togglePopup}\n tabindex=${this._isDisabled ? -1 : 0}\n role=\"combobox\"\n aria-expanded=${this._isOpen}\n aria-haspopup=\"listbox\"\n aria-disabled=${String(this._isDisabled)}\n aria-activedescendant=${this._isOpen && this._activeIndex >= 0\n ? this._options[this._activeIndex]?.id\n : nothing}\n >\n <slot name=\"trigger\" @slotchange=${this._onTriggerSlotChange}></slot>\n ${!this._hasTriggerSlot ? html`<span class=\"label\">${this._selectedLabel}</span>` : nothing}\n <web-ui-icon class=\"arrow\" .icon=${lucideChevronDown}></web-ui-icon>\n </div>\n <div class=\"wui-glass select-overlay wui-floating-panel\" hidden role=\"listbox\">\n <div class=\"select-scroll\">\n <div class=\"select-content\">\n <slot @slotchange=${this._onSlotChange}></slot>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n 'open-change': CustomEvent<{ open: boolean }>\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-select': WebUiSelect\n }\n}\n"],"mappings":";;;;;;;;;;;;;AAiBO,IAAM,IAAN,cAA0B,EAAW;;EA8OpB,aAvOW,KAAA,gBAAA,IAEwB,KAAA,cAAA,IACF,KAAA,WAAA,IACA,KAAA,WAAA,IACF,KAAA,SAAA,IACmC,KAAA,eAAA,IAEtC,KAAA,OAAA,IAGxB,KAAA,SAAA,IAgBC,KAAA,UAAA,IACK,KAAA,eAAA,IACE,KAAA,iBAAA,IACC,KAAA,kBAAA,IAED,KAAA,WAAA,CAAC,GACJ,KAAA,cAAA,EAAsB,GAC3B,KAAA,SAAA,EAAoB,CAAC,CAAC,KAAK;GACnD,iBAAiB,KAAK,YAAY,cAA2B,iBAAiB,KAAK;GACnF,qBAAqB,KAAK,YAAY,cAA2B,iBAAiB,KAAK;GACvF,uBAAuB;IAAE,WAAW;IAAgB,QAAQ;IAAG,UAAU,KAAK,SAAS,UAAU;GAAW;GAC5G,gBAAgB,KAAK;GACrB,oBAAoB,KAAK,cAAc;EACzC,CAAC,GAU0B,KAAA,mBAAA,MAAkB;GAC3C,AACE,KAAK,WACL,EAAE,kBAAkB,QACpB,CAAC,KAAK,SAAS,EAAE,MAAM,KACvB,CAAC,KAAK,OAAO,SAAS,CAAC,EAAE,SAAS,EAAE,MAAM,KAE1C,KAAK,OAAO;EAEhB,GAE4B,KAAA,oBAAA;GAC1B,4BAA4B;IAC1B,AAAI,KAAK,WAAW,CAAC,KAAK,QAAQ,eAAe,KAAK,CAAC,KAAK,OAAO,SAAS,CAAC,EAAE,QAAQ,eAAe,KACpG,KAAK,OAAO;GAEhB,CAAC;EACH,GA8EgC,KAAA,wBAAA,MAAa;GAE3C,IAAM,IADO,EAAE,OACS,iBAAiB,CAAC,CAAC,SAAS;GAChD,KAAK,oBAAoB,MAC7B,KAAK,kBAAkB,GACvB,KAAK,oBAAoB;EAC3B,GAoB6B,KAAA,qBAAA,MAAa;GACxC,IAAI,EAAE,EAAE,kBAAkB,cAAc;GACxC,IAAM,IAAS,EAAE;GAOjB,AANA,EAAO,iBAAiB,SAAS,KAAK,kBAAkB,GACxD,EAAO,iBAAiB,eAAe,KAAK,wBAAwB,GACpE,EAAO,iBAAiB,eAAe,KAAK,wBAAwB,GACpE,EAAO,iBAAiB,iBAAiB,KAAK,eAAe,GAC7D,KAAK,SAAS,KAAK,CAAM,GACzB,KAAK,iBAAiB,GACtB,KAAK,cAAc;EACrB,GAE+B,KAAA,uBAAA,MAAa;GAC1C,IAAI,EAAE,EAAE,kBAAkB,cAAc;GACxC,IAAM,IAAS,EAAE;GAKjB,AAJA,EAAO,oBAAoB,SAAS,KAAK,kBAAkB,GAC3D,EAAO,oBAAoB,eAAe,KAAK,wBAAwB,GACvE,EAAO,oBAAoB,eAAe,KAAK,wBAAwB,GACvE,EAAO,oBAAoB,iBAAiB,KAAK,eAAe,GAChE,KAAK,WAAW,KAAK,SAAS,QAAO,MAAK,MAAM,CAAM;EACxD,GAE8B,KAAA,sBAAA;GAC5B,IAAM,IACJ,KAAK,UAAU,KAAK,OAAO,SAAS,IAChC,CAAC,GAAG,KAAK,OAAO,SAAS,CAAC,CAAE,iBAA8B,eAAe,CAAC,IAC1E,CAAC,GAAG,KAAK,iBAA8B,eAAe,CAAC;GAG7D,AAFA,KAAK,WAAW,GAChB,KAAK,iBAAiB,GACtB,KAAK,cAAc;EACrB,GAE8B,KAAA,sBAAA,MAAa;GACzC,IAAI,EAAE,EAAE,yBAAyB,cAAc;GAC/C,IAAM,IAAS,EAAE;GACb,EAAO,aACX,KAAK,QAAQ,EAAO,OACpB,KAAK,OAAO,GACZ,KAAK,mBAAmB;EAC1B,GAEgC,KAAA,wBAAA;GAE9B,AADA,KAAK,cAAc,GACnB,KAAK,kBAAkB;EACzB,GAEoC,KAAA,4BAAA,MAAoB;GAClD,EAAE,gBAAgB,YAClB,CAAC,KAAK,WAAW,KAAK,eAAe,KAAK,EAAE,EAAE,yBAAyB,iBAG3E,KAAK,eAAe,IACpB,KAAK,kBAAkB;EACzB,GAEoC,KAAA,4BAAA,MAAoB;GAEtD,EAAE,eAAe;EACnB,GAEsB,KAAA,cAAA,MAAqB;GACrC,UAAK,aAET,QAAQ,EAAE,KAAV;IACE,KAAK;KACH,AAAI,KAAK,YACP,KAAK,OAAO,GACZ,EAAE,eAAe;KAEnB;IACF,KAAK;KAEH,AADA,EAAE,eAAe,GACZ,KAAK,UAGR,KAAK,gBAAgB,CAAC,IAFtB,KAAK,MAAM,EAAI;KAIjB;IACF,KAAK;KAEH,AADA,EAAE,eAAe,GACZ,KAAK,UACL,KAAK,gBAAgB,EAAE,IADT,KAAK,MAAM,EAAI;KAElC;IACF,KAAK;KACH,IAAI,KAAK,WAAW,KAAK,gBAAgB,GAAG;MAC1C,IAAM,IAAS,KAAK,SAAS,KAAK;MAMlC,AALI,KAAU,CAAC,EAAO,aACpB,KAAK,QAAQ,EAAO,OACpB,KAAK,mBAAmB,IAE1B,KAAK,OAAO,GACZ,EAAE,eAAe;KACnB;KACA;GACJ;EACF;;;EAhRyB,KAAA,SAAA;GAAC,EAAU,CAAK;GAAG,EAAU,CAAa;GAAG,EAAU,CAAK;EAAC;;;EAE9D,KAAA,iBAAA;;CAgBxB,IAAI,QAAgB;EAClB,OAAO,KAAK;CACd;CACA,IAAI,MAAM,GAAW;EACnB,IAAM,IAAM,KAAK;EAIjB,AAHA,KAAK,SAAS,GACd,KAAK,YAAY,eAAe,CAAC,GACjC,KAAK,gBAAgB,kBAAkB,CAAC,CAAC,CAAC,GAC1C,KAAK,cAAc,SAAS,CAAG;CACjC;CAEA,IAAY,cAAuB;EACjC,OAAO,KAAK,YAAY,KAAK;CAC/B;CAiBA,IAAI,SAAkB;EACpB,OAAO,KAAK;CACd;CAEA,IAAI,OAAgB;EAClB,OAAO,KAAK;CACd;CAqBA,oBAA6B;EAE3B,AADA,MAAM,kBAAkB,GACxB,KAAK,aAAa,KAAK,gBAAgB;EAEvC,IAAM,IAAY,KAAK,aAAa,OAAO;EAU3C,AATI,MAAc,SAChB,KAAK,SAAS,GACd,KAAK,gBAAgB,kBAAkB,CAAC,CAAC,CAAS,IAEpD,KAAK,YAAY,eAAe,KAAK,MAAM,GAC3C,KAAK,iBAAiB,mBAAmB,KAAK,iBAAiB,GAC/D,KAAK,iBAAiB,qBAAqB,KAAK,mBAAmB,GACnE,KAAK,iBAAiB,WAAW,KAAK,UAAU,GAChD,KAAK,iBAAiB,YAAY,KAAK,WAAW,GAClD,SAAS,iBAAiB,SAAS,KAAK,eAAe;CACzD;CAEA,uBAAgC;EAe9B,AAdA,MAAM,qBAAqB,GAC3B,KAAK,oBAAoB,mBAAmB,KAAK,iBAAiB,GAClE,KAAK,oBAAoB,qBAAqB,KAAK,mBAAmB,GACtE,KAAK,oBAAoB,WAAW,KAAK,UAAU,GACnD,KAAK,oBAAoB,YAAY,KAAK,WAAW,GACrD,SAAS,oBAAoB,SAAS,KAAK,eAAe,GAC1D,KAAK,SAAS,SAAQ,MAAK;GAIzB,AAHA,EAAE,oBAAoB,SAAS,KAAK,kBAAkB,GACtD,EAAE,oBAAoB,eAAe,KAAK,wBAAwB,GAClE,EAAE,oBAAoB,eAAe,KAAK,wBAAwB,GAClE,EAAE,oBAAoB,iBAAiB,KAAK,eAAe;EAC7D,CAAC,GACD,KAAK,OAAO,GACZ,KAAK,OAAO,QAAQ,GACpB,KAAK,YAAY,QAAQ;CAC3B;CAEA,eAAwB;EACtB,4BAA4B;GAC1B,AAAI,KAAK,eAAa,KAAK,cAAc;EAC3C,CAAC;CACH;CAEA,aAAsB;EAMpB,AALA,KAAK,WACH,KAAK,UAAU,KAAK,OAAO,SAAS,IAChC,CAAC,GAAG,KAAK,OAAO,SAAS,CAAC,CAAE,iBAA8B,eAAe,CAAC,IAC1E,CAAC,GAAG,KAAK,iBAA8B,eAAe,CAAC,GAC7D,KAAK,iBAAiB,GACtB,KAAK,cAAc;CACrB;CAEA,QAAiB,GAAyB;EAKxC,CAJI,EAAQ,IAAI,QAAQ,KAAK,EAAQ,IAAI,kBAAkB,MACzD,4BAA4B,KAAK,oBAAoB,CAAC,GACpD,EAAQ,IAAI,cAAc,KAAG,KAAK,gBAAgB,GACtD,KAAK,mBAAmB,GACxB,KAAK,cAAc;CACrB;CAEA,oBAAoB;EAClB,KAAK,QAAQ,KAAK,aAAa,OAAO,KAAK;CAC7C;CAEA,qBAAqB,GAAmB;EACtC,KAAK,gBAAgB;CACvB;CAEA,gBAAwB;EAClB,CAAC,KAAK,cAAc,OAAO,KAAK,WAAW,eAAgB,eAC3D,KAAK,eAAe,CAAC,KAAK,YAAY,KAAK,QAAO,KAAK,WAAW,YAAY,CAAC,CAAC,IAC/E,KAAK,WAAW,YAAY,EAAE,cAAc,GAAK,GAAG,OAAO;CAClE;CAEA,qBAA6B;EAC3B,KAAK,gBAAgB,QAAQ,KAAK,OAAO;CAC3C;CAUA,gBAAwB;EAItB,IAHA,KAAK,SAAS,SAAQ,MAAK;GACzB,EAAE,WAAW,EAAE,UAAU,KAAK;EAChC,CAAC,GACG,CAAC,KAAK,OAAO;GACf,KAAK,iBAAiB,KAAK;GAC3B;EACF;EACA,IAAM,IAAS,KAAK,SAAS,MAAK,MAAK,EAAE,UAAU,KAAK,KAAK;EAC7D,KAAK,iBAAiB,GAAQ,SAAS,KAAK;CAC9C;CAEA,mBAA2B;EACzB,KAAK,SAAS,SAAS,GAAQ,MAAU;GACvC,AAAgB,EAAO,OAAK,GAAG,KAAK,UAAU,UAAU;EAC1D,CAAC;CACH;CAmGA,gBAAwB,GAAe;EACrC,IAAM,IAAU,KAAK,SAAS,QAAO,MAAK,CAAC,EAAE,QAAQ;EACrD,IAAI,CAAC,EAAQ,QAAQ;EAErB,IAAM,IAAiB,KAAK,SAAS,MAAK,MAAU,EAAO,UAAU,KAAK,SAAS,CAAC,EAAO,QAAQ,GAS/F,KAPF,KAAK,gBAAgB,IACjB,EAAQ,QAAQ,KAAK,SAAS,KAAK,aAAa,IAChD,IACE,EAAQ,QAAQ,CAAc,IAC9B,IAAQ,IACN,KACA,KACiB;EAE3B,AADI,IAAU,MAAG,IAAU,EAAQ,SAAS,IACxC,KAAW,EAAQ,WAAQ,IAAU;EAEzC,IAAM,IAAa,EAAQ;EAG3B,AAFA,KAAK,eAAe,KAAK,SAAS,QAAQ,CAAU,GAEpD,KAAK,kBAAkB;CACzB;CAEA,MAAc,IAAuB,IAAO;EACtC,KAAK,eAAe,KAAK,YAC7B,KAAK,UAAU,IACf,KAAK,oBAAoB,GACzB,KAAK,cAAc,GACf,IAAsB,KAAK,wBAAwB,IAClD,KAAK,kBAAkB,GAC5B,KAAK,gBAAgB,GACjB,KAAK,SACP,4BAA4B;GAC1B,AAAI,KAAK,WAAS,KAAK,aAAa,CAAoB;EAC1D,CAAC,IAED,KAAK,aAAa,CAAoB;CAE1C;CAEA,SAAiB;EACV,KAAK,YACV,KAAK,UAAU,IACf,KAAK,oBAAoB,GACzB,KAAK,eAAe,IACpB,KAAK,SAAS,SAAQ,MAAK,EAAE,gBAAgB,QAAQ,CAAC,GACtD,KAAK,gBAAgB,EAAK,GAC1B,KAAU,cAAc;CAC1B;CAEA,sBAA8B;EAC5B,KAAK,cACH,IAAI,YAAY,eAAe;GAC7B,QAAQ,EAAE,MAAM,KAAK,QAAQ;GAC7B,SAAS;GACT,UAAU;EACZ,CAAC,CACH;CACF;CAEA,0BAAkC;EAChC,IAAM,IAAgB,KAAK,SAAS,WAAU,MAAU,EAAO,UAAU,KAAK,SAAS,CAAC,EAAO,QAAQ,GACjG,IAAoB,KAAK,SAAS,WAAU,MAAU,CAAC,EAAO,QAAQ;EAE5E,AADA,KAAK,eAAe,KAAiB,IAAI,IAAgB,GACzD,KAAK,kBAAkB;CACzB;CAEA,oBAA4B;EAC1B,KAAK,SAAS,SAAS,GAAQ,MAAU,EAAO,gBAAgB,UAAU,MAAU,KAAK,YAAY,CAAC;CACxG;CAEA,qBAA6B;EAE3B,AADA,KAAK,cAAc,IAAI,MAAM,SAAS;GAAE,SAAS;GAAM,UAAU;EAAK,CAAC,CAAC,GACxE,KAAK,cAAc,IAAI,MAAM,UAAU;GAAE,SAAS;GAAM,UAAU;EAAK,CAAC,CAAC;CAC3E;CAEA,gBAAwB,IAAS,KAAK,SAAS;EAC7C,KAAK,YAAY,KAAK,KAAU,CAAC,KAAK,YAAY;CACpD;CAEA,eAAuB;EACjB,KAAK,gBACL,KAAK,UAAS,KAAK,OAAO,IACzB,KAAK,MAAM;CAClB;CAEA,aAAqB,IAAuB,IAAO;EACjD,IAAM,IAAS,KAAK,SAAkC,OAAzB,KAAK,OAAO,SAAS;EAElD,AADI,MAAO,EAAM,MAAM,QAAQ,GAAG,KAAK,iBAAiB,EAAE,MAC1D,KAAK,OAAO,KAAK,CAAoB;CACvC;CAEA,mBAAmC;EAEjC,IAAM,IADU,KAAK,YAAY,cAA2B,iBAAiB,CAAA,EAC/C,eAAe,GAEvC,IAAU,CAAC,GAAG,KAAK,iBAA8B,eAAe,CAAC,GACnE,IAAiB;EAOrB,OANA,EAAQ,SAAQ,MAAO;GAErB,IAAM,IADQ,EAAI,YAAY,cAA2B,eAAe,CAAA,EACvD,eAAe,EAAI,eAAe;GACnD,AAAI,IAAI,MAAgB,IAAiB;EAC3C,CAAC,GAEM,KAAK,IAAI,KAAK,GAAc,CAAc;CACnD;CAEA,gBAAuC;EACrC,IAAM,IAAe,KAAK,iBAAiB,GAErC,IAAS,EAAoB;GACjC,WAAW,KAAK;GAChB,QAAQ;GACR,OAAO,GAAG,EAAM,IAAI,EAAc,IAAI;GACtC,WAAW;EACb,CAAC;EAED,AADA,EAAO,MAAM,MAAM,QAAQ,GAAG,EAAa,KAC3C,EAAO,MAAM,aAAa,QAAQ,SAAS;EAC3C,IAAM,IAAS,SAAS,cAAc,KAAK;EAC3C,EAAO,YAAY;EACnB,IAAM,IAAU,SAAS,cAAc,KAAK;EAK5C,OAJA,EAAQ,YAAY,kBACpB,EAAO,OAAO,CAAO,GACrB,EAAO,MAAM,OAAO,CAAM,GAC1B,EAAO,YAAY,MAAM,KAAK,KAAK,QAAQ,GAAG,CAAO,GAC9C;CACT;CAEA,MAAc,gBAAgB;EAC5B,MAAM,KAAK,OAAO,YAAY,KAAK,OAAO;CAC5C;CAEA,sBAA8B;EAC5B,IAAI,CAAC,KAAK,QAAQ;GAChB,IAAM,IAAQ,KAAK,OAAO,SAAS;GACnC,AAAI,MAAO,EAAM,MAAM,QAAQ,GAAG,KAAK,iBAAiB,EAAE;EAC5D;EACA,KAAK,OAAO,YAAY,KAAK,OAAO;CACtC;CAEA,SAAkB;EAChB,OAAO,CAAI;;;;iCAIkB,KAAK,gBAAgB;mBACnC,KAAK,aAAa;qBAChB,KAAK,cAAc,KAAK,EAAE;;0BAErB,KAAK,QAAQ;;0BAEb,OAAO,KAAK,WAAW,EAAE;kCACjB,KAAK,WAAW,KAAK,gBAAgB,IACzD,KAAK,SAAS,KAAK,aAAa,EAAE,KAClC,EAAQ;;6CAEuB,KAAK,qBAAqB;YAC1D,KAAK,kBAA4E,IAA1D,CAAI,uBAAuB,KAAK,eAAe,SAAmB;6CACzD,EAAkB;;;;;kCAK7B,KAAK,cAAc;;;;;;CAMnD;AAOF;AA5bG,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,iBAAA,KAAA,CAAA,GAEN,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA,GACxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GACzC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,YAAA,KAAA,CAAA,GACzC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GACzC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;AAAiB,CAAC,CAAA,GAAA,EAAA,WAAA,gBAAA,KAAA,CAAA,GACtE,EAAA,CAAA,EAAS,EAAE,WAAW,GAAM,CAAC,CAAA,GAAA,EAAA,WAAA,oBAAA,KAAA,CAAA,GAC7B,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GAGxC,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,UAAA,KAAA,CAAA,GAgBN,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,WAAA,KAAA,CAAA,GACN,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,gBAAA,KAAA,CAAA,GACN,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,kBAAA,KAAA,CAAA,GACN,EAAA,CAAA,EAAM,CAAA,GAAA,EAAA,WAAA,mBAAA,KAAA,CAAA,GAtCR,IAAA,EAAA,CAAA,EAAc,eAAe,CAAA,GAAA,CAAA"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/select/index.ts"],"sourcesContent":["import { html, LitElement, nothing, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport '@/components/icon'\nimport '@/components/option'\nimport glass from '@/assets/glass.css?inline'\nimport overlayMotion from '@/assets/overlay-motion.css?inline'\nimport type { WebUiOption } from '@/components/option'\nimport { lucideChevronDown } from '@/icons'\nimport { defineAnchoredPanel } from '@/shared/overlay/anchored-panel'\nimport { createOverlayPortal } from '@/shared/overlay/portal'\nimport type { OverlayContainer, OverlayPortal } from '@/shared/overlay/portal'\nimport { createScrollLockLease } from '@/shared/scroll-lock/scroll-lock'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-select')\nexport class WebUiSelect extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(overlayMotion), unsafeCSS(style)]\n\n static formAssociated = true\n\n // ElementInternals 实例,在 connectedCallback 中初始化\n private _internals?: ElementInternals\n @state() private _formDisabled = false\n\n @property({ type: String, reflect: true }) placeholder = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n @property({ type: Boolean, reflect: true }) portal = false\n @property({ type: Boolean, reflect: true, attribute: 'no-scroll-lock' }) noScrollLock = false\n @property({ attribute: false }) overlayContainer?: OverlayContainer\n @property({ type: String, reflect: true }) name = ''\n\n // value 使用内部状态 + 访问器模式,在变更时同步 ElementInternals\n @state() private _value = ''\n get value(): string {\n return this._value\n }\n set value(v: string) {\n const old = this._value\n this._value = v\n this._internals?.setFormValue?.(v)\n this.toggleAttribute('data-has-value', !!v)\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n @state() private _isOpen = false\n @state() private _activeIndex = -1\n @state() private _selectedLabel = ''\n @state() private _hasTriggerSlot = false\n\n private _options: WebUiOption[] = []\n private readonly _scrollLock = createScrollLockLease()\n private readonly _panel = defineAnchoredPanel().make({\n getAnchor: () => this.shadowRoot?.querySelector<HTMLElement>('.select-trigger') ?? null,\n getLocalPanel: () => this.shadowRoot?.querySelector<HTMLElement>('.select-overlay') ?? null,\n getPositioning: () => ({ placement: 'bottom-start', offset: 4, strategy: this.portal ? 'fixed' : 'absolute' }),\n isPortal: () => this.portal,\n createPortal: () => this._createPortal()\n })\n\n get isOpen(): boolean {\n return this._isOpen\n }\n\n get open(): boolean {\n return this._isOpen\n }\n\n private _onClickOutside = (e: MouseEvent) => {\n if (\n this._isOpen &&\n e.target instanceof Node &&\n !this.contains(e.target) &&\n !this._panel.getPanel()?.contains(e.target)\n ) {\n this._close()\n }\n }\n\n private _onFocusOut = () => {\n requestAnimationFrame(() => {\n if (this._isOpen && !this.matches(':focus-within') && !this._panel.getPanel()?.matches(':focus-within')) {\n this._close()\n }\n })\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this._internals = this.attachInternals()\n // 同步 HTML 属性中预设的 value,补全访问器模式不处理 attribute 反射\n const attrValue = this.getAttribute('value')\n if (attrValue !== null) {\n this._value = attrValue\n this.toggleAttribute('data-has-value', !!attrValue)\n }\n this._internals?.setFormValue?.(this._value)\n this.addEventListener('option-register', this._onOptionRegister)\n this.addEventListener('option-unregister', this._onOptionUnregister)\n this.addEventListener('keydown', this._onKeydown)\n this.addEventListener('focusout', this._onFocusOut)\n document.addEventListener('click', this._onClickOutside)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this.removeEventListener('option-register', this._onOptionRegister)\n this.removeEventListener('option-unregister', this._onOptionUnregister)\n this.removeEventListener('keydown', this._onKeydown)\n this.removeEventListener('focusout', this._onFocusOut)\n document.removeEventListener('click', this._onClickOutside)\n this._options.forEach(o => {\n o.removeEventListener('click', this._handleOptionClick)\n o.removeEventListener('pointerover', this._handleOptionPointerOver)\n o.removeEventListener('pointerdown', this._handleOptionPointerDown)\n o.removeEventListener('option-update', this._onOptionUpdate)\n })\n this._close()\n this._panel.dispose()\n this._scrollLock.release()\n }\n\n override firstUpdated() {\n requestAnimationFrame(() => {\n if (this.isConnected) this._onSlotChange()\n })\n }\n\n private _queryOptions(): WebUiOption[] {\n const panel = this.portal ? this._panel.getPanel() : null\n const panelOptions = panel ? [...panel.querySelectorAll<WebUiOption>('web-ui-option')] : []\n // 面板内容仅在浮层打开、moveContent 之后存在;关闭时回退 light DOM,\n // 否则 portal select 首次加载时 _options 为空,trigger 显示不出已选值。\n return panelOptions.length > 0 ? panelOptions : [...this.querySelectorAll<WebUiOption>('web-ui-option')]\n }\n\n override willUpdate() {\n this._options = this._queryOptions()\n this._ensureOptionIds()\n this._syncSelected()\n }\n\n override updated(changed: PropertyValues) {\n if (changed.has('portal') || changed.has('overlayContainer'))\n requestAnimationFrame(() => this._reconfigureOverlay())\n if (changed.has('noScrollLock')) this._syncScrollLock()\n this._syncOpenAttribute()\n this._syncValidity()\n }\n\n formResetCallback() {\n this.value = this.getAttribute('value') || ''\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n private _syncValidity() {\n if (!this._internals || typeof this._internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this.value) this._internals.setValidity({})\n else this._internals.setValidity({ valueMissing: true }, '请选择一项')\n }\n\n private _syncOpenAttribute() {\n this.toggleAttribute('open', this._isOpen)\n }\n\n private _onTriggerSlotChange = (e: Event) => {\n const slot = e.target as HTMLSlotElement\n const hasContent = slot.assignedElements().length > 0\n if (this._hasTriggerSlot === hasContent) return\n this._hasTriggerSlot = hasContent\n this._reconfigureOverlay()\n }\n\n private _syncSelected() {\n this._options.forEach(o => {\n o.selected = o.value === this.value\n })\n if (!this.value) {\n this._selectedLabel = this.placeholder\n return\n }\n const option = this._options.find(o => o.value === this.value)\n this._selectedLabel = option?.label || this.placeholder\n }\n\n private _ensureOptionIds() {\n this._options.forEach((option, index) => {\n if (!option.id) option.id = `${this.localName}-option-${index}`\n })\n }\n\n private _onOptionRegister = (e: Event) => {\n if (!(e.target instanceof HTMLElement)) return\n const target = e.target as WebUiOption\n target.addEventListener('click', this._handleOptionClick)\n target.addEventListener('pointerover', this._handleOptionPointerOver)\n target.addEventListener('pointerdown', this._handleOptionPointerDown)\n target.addEventListener('option-update', this._onOptionUpdate)\n this._options.push(target)\n this._ensureOptionIds()\n this._syncSelected()\n }\n\n private _onOptionUnregister = (e: Event) => {\n if (!(e.target instanceof HTMLElement)) return\n const target = e.target as WebUiOption\n target.removeEventListener('click', this._handleOptionClick)\n target.removeEventListener('pointerover', this._handleOptionPointerOver)\n target.removeEventListener('pointerdown', this._handleOptionPointerDown)\n target.removeEventListener('option-update', this._onOptionUpdate)\n this._options = this._options.filter(o => o !== target)\n }\n\n private _onSlotChange = () => {\n this._options = this._queryOptions()\n this._ensureOptionIds()\n this._syncSelected()\n }\n\n private _handleOptionClick = (e: Event) => {\n if (!(e.currentTarget instanceof HTMLElement)) return\n const option = e.currentTarget as WebUiOption\n if (option.disabled) return\n this.value = option.value\n this._close()\n this._notifyValueChange()\n }\n\n private _onOptionUpdate = () => {\n this._syncSelected()\n this._syncActiveOption()\n }\n\n private _handleOptionPointerOver = (e: PointerEvent) => {\n if (e.pointerType === 'touch') return\n if (!this._isOpen || this._activeIndex < 0 || !(e.currentTarget instanceof HTMLElement)) return\n\n // 指针接管后只保留 :hover,避免键盘激活项与悬停项同时高亮。\n this._activeIndex = -1\n this._syncActiveOption()\n }\n\n private _handleOptionPointerDown = (e: PointerEvent) => {\n // 保持 trigger 焦点,避免 focusout 在 click 前关闭浮层。\n e.preventDefault()\n }\n\n private _onKeydown = (e: KeyboardEvent) => {\n if (this._isDisabled) return\n\n switch (e.key) {\n case 'Escape':\n if (this._isOpen) {\n this._close()\n e.preventDefault()\n }\n break\n case 'ArrowDown':\n e.preventDefault()\n if (!this._isOpen) {\n this._open(true)\n } else {\n this._navigateActive(1)\n }\n break\n case 'ArrowUp':\n e.preventDefault()\n if (!this._isOpen) this._open(true)\n else this._navigateActive(-1)\n break\n case 'Enter':\n if (this._isOpen && this._activeIndex >= 0) {\n const option = this._options[this._activeIndex]\n if (option && !option.disabled) {\n this.value = option.value\n this._notifyValueChange()\n }\n this._close()\n e.preventDefault()\n }\n break\n }\n }\n\n private _navigateActive(delta: number) {\n const enabled = this._options.filter(o => !o.disabled)\n if (!enabled.length) return\n\n const selectedOption = this._options.find(option => option.value === this.value && !option.disabled)\n const currentIdx =\n this._activeIndex >= 0\n ? enabled.indexOf(this._options[this._activeIndex])\n : selectedOption\n ? enabled.indexOf(selectedOption)\n : delta > 0\n ? -1\n : 0\n let nextIdx = currentIdx + delta\n if (nextIdx < 0) nextIdx = enabled.length - 1\n if (nextIdx >= enabled.length) nextIdx = 0\n\n const nextOption = enabled[nextIdx]\n this._activeIndex = this._options.indexOf(nextOption)\n\n this._syncActiveOption()\n }\n\n private _open(isKeyboardNavigation = false) {\n if (this._isDisabled || this._isOpen) return\n this._isOpen = true\n this._dispatchOpenChange()\n this._syncSelected()\n if (isKeyboardNavigation) this._setInitialActiveOption()\n else this._syncActiveOption()\n this._syncScrollLock()\n if (this.portal) {\n requestAnimationFrame(() => {\n if (this._isOpen) this._openOverlay(isKeyboardNavigation)\n })\n } else {\n this._openOverlay(isKeyboardNavigation)\n }\n }\n\n private _close() {\n if (!this._isOpen) return\n this._isOpen = false\n this._dispatchOpenChange()\n this._activeIndex = -1\n this._options.forEach(o => o.removeAttribute('active'))\n this._syncScrollLock(false)\n void this._closeOverlay()\n }\n\n private _dispatchOpenChange() {\n this.dispatchEvent(\n new CustomEvent('open-change', {\n detail: { open: this._isOpen },\n bubbles: true,\n composed: true\n })\n )\n }\n\n private _setInitialActiveOption() {\n const selectedIndex = this._options.findIndex(option => option.value === this.value && !option.disabled)\n const firstEnabledIndex = this._options.findIndex(option => !option.disabled)\n this._activeIndex = selectedIndex >= 0 ? selectedIndex : firstEnabledIndex\n this._syncActiveOption()\n }\n\n private _syncActiveOption() {\n this._options.forEach((option, index) => option.toggleAttribute('active', index === this._activeIndex))\n }\n\n private _notifyValueChange() {\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n\n private _syncScrollLock(isOpen = this._isOpen) {\n this._scrollLock.sync(isOpen && !this.noScrollLock)\n }\n\n private _togglePopup() {\n if (this._isDisabled) return\n if (this._isOpen) this._close()\n else this._open()\n }\n\n private _openOverlay(isKeyboardNavigation = false) {\n const panel = !this.portal ? this._panel.getPanel() : null\n if (panel) panel.style.width = `${this._getDesiredWidth()}px`\n this._panel.open(isKeyboardNavigation)\n }\n\n private _getDesiredWidth(): number {\n const trigger = this.shadowRoot?.querySelector<HTMLElement>('.select-trigger')\n const triggerWidth = trigger?.offsetWidth || 0\n\n const options = [...this.querySelectorAll<WebUiOption>('web-ui-option')]\n let maxOptionWidth = 0\n options.forEach(opt => {\n const label = opt.shadowRoot?.querySelector<HTMLElement>('.option-label')\n const w = label?.scrollWidth || opt.scrollWidth || 0\n if (w > maxOptionWidth) maxOptionWidth = w\n })\n\n return Math.max(120, triggerWidth, maxOptionWidth)\n }\n\n private _createPortal(): OverlayPortal {\n const desiredWidth = this._getDesiredWidth()\n\n const portal = createOverlayPortal({\n container: this.overlayContainer,\n target: this,\n style: `${glass}\\n${overlayMotion}\\n${style}`,\n className: 'wui-glass select-overlay portal wui-floating-panel'\n })\n portal.panel.style.width = `${desiredWidth}px`\n portal.panel.setAttribute('role', 'listbox')\n const scroll = document.createElement('div')\n scroll.className = 'select-scroll'\n const content = document.createElement('div')\n content.className = 'select-content'\n scroll.append(content)\n portal.panel.append(scroll)\n portal.moveContent(Array.from(this.children), content)\n return portal\n }\n\n private async _closeOverlay() {\n await this._panel.close(() => this._isOpen)\n }\n\n private _reconfigureOverlay() {\n if (!this.portal) {\n const panel = this._panel.getPanel()\n if (panel) panel.style.width = `${this._getDesiredWidth()}px`\n }\n this._panel.reconfigure(this._isOpen)\n }\n\n override render() {\n // portal 模式下 options 被 moveContent 移入浮层 shadow root,id 引用无法跨树作用域\n // 解析,因此 activedescendant 仅在非 portal 模式输出;aria-controls 同理指向同根内 listbox\n const listboxId = `${this.localName}-listbox`\n const activeDescendant =\n !this.portal && this._isOpen && this._activeIndex >= 0\n ? (this._options[this._activeIndex]?.id ?? nothing)\n : nothing\n\n return html`\n <div class=\"wui-select-inner\">\n <div\n class=\"wui-glass select-trigger\"\n ?data-custom-trigger=${this._hasTriggerSlot}\n @click=${this._togglePopup}\n tabindex=${this._isDisabled ? '-1' : '0'}\n role=\"combobox\"\n aria-expanded=${this._isOpen}\n aria-haspopup=\"listbox\"\n aria-controls=${this.portal ? nothing : listboxId}\n aria-disabled=${String(this._isDisabled)}\n aria-activedescendant=${activeDescendant}\n >\n <slot name=\"trigger\" @slotchange=${this._onTriggerSlotChange}></slot>\n ${!this._hasTriggerSlot ? html`<span class=\"label\">${this._selectedLabel}</span>` : nothing}\n <web-ui-icon class=\"arrow\" .icon=${lucideChevronDown}></web-ui-icon>\n </div>\n <div class=\"wui-glass select-overlay wui-floating-panel\" hidden role=\"listbox\" id=${listboxId}>\n <div class=\"select-scroll\">\n <div class=\"select-content\">\n <slot @slotchange=${this._onSlotChange}></slot>\n </div>\n </div>\n </div>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n 'open-change': CustomEvent<{ open: boolean }>\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-select': WebUiSelect\n }\n}\n"],"mappings":"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"}
@@ -30,9 +30,7 @@ export declare class WebUiSlider extends LitElement {
30
30
  formResetCallback(): void;
31
31
  formDisabledCallback(disabled: boolean): void;
32
32
  updated(): void;
33
- /** 将焦点移至滑块,供表单或外部控制使用 */
34
33
  focus(options?: FocusOptions): void;
35
- /** 移除滑块焦点 */
36
34
  blur(): void;
37
35
  private get _slider();
38
36
  private get _range();
@@ -160,7 +160,7 @@ var f = class extends i {
160
160
  class=${e}
161
161
  style=${d({ "--percent": `${this._percent}%` })}
162
162
  role="slider"
163
- tabindex=${this._isDisabled ? -1 : 0}
163
+ tabindex=${this._isDisabled ? "-1" : "0"}
164
164
  aria-label="滑块"
165
165
  aria-orientation=${this.vertical ? "vertical" : "horizontal"}
166
166
  aria-valuemin=${this.min}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/slider/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\n\nimport glass from '@/assets/glass.css?inline'\nimport { normalizeNumber } from '@/shared/normalize'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-slider')\nexport class WebUiSlider extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n static formAssociated = true\n\n // ElementInternals 实例,在 connectedCallback 中初始化\n private _internals?: ElementInternals\n @state() private _formDisabled = false\n\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) marks = false\n @property({ type: Boolean, reflect: true }) vertical = false\n @property({ type: String, reflect: true }) name = ''\n @property({ type: Boolean, reflect: true }) required = false\n\n // value 使用访问器模式同步 ElementInternals\n private _value = 0\n private _initialValue = 0\n @property({ type: Number, reflect: true })\n get value(): number {\n return this._value\n }\n set value(v: number) {\n const normalized = normalizeNumber(v, -Infinity, Infinity, 0)\n const old = this._value\n this._value = normalized\n this._internals?.setFormValue?.(String(normalized))\n this.requestUpdate('value', old)\n }\n\n private _min = 0\n @property({ type: Number, reflect: true })\n get min(): number {\n return this._min\n }\n set min(v: number) {\n this._min = normalizeNumber(v, -Infinity, Infinity, 0)\n }\n\n private _max = 100\n @property({ type: Number, reflect: true })\n get max(): number {\n return this._max\n }\n set max(v: number) {\n this._max = normalizeNumber(v, -Infinity, Infinity, 100)\n }\n\n private _step = 1\n @property({ type: Number, reflect: true })\n get step(): number {\n return this._step\n }\n set step(v: number) {\n this._step = normalizeNumber(v, -Infinity, Infinity, 1)\n }\n\n @state() private _dragging = false\n // 避免未改变数值的点击被误认为一次表单提交\n private _interactionStartValue: number | undefined\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this._internals = this.attachInternals()\n this._initialValue = Number(this.getAttribute('value')) || 0\n this._internals?.setFormValue?.(String(this._value))\n }\n\n override willUpdate(changed: Map<string, unknown>) {\n if (changed.has('value') || changed.has('min') || changed.has('max') || changed.has('step')) {\n const normalizedValue = this._normalizeValue(this.value)\n if (normalizedValue !== this.value) this.value = normalizedValue\n }\n }\n\n formResetCallback() {\n this.value = this._initialValue\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n override updated() {\n if (!this._internals || typeof this._internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required) this._internals.setValidity({})\n else this._internals.setValidity({})\n }\n\n /** 将焦点移至滑块,供表单或外部控制使用 */\n override focus(options?: FocusOptions) {\n this._slider?.focus(options)\n }\n\n /** 移除滑块焦点 */\n override blur() {\n this._slider?.blur()\n }\n\n private get _slider(): HTMLDivElement | null {\n return this.renderRoot.querySelector<HTMLDivElement>('[role=\"slider\"]')\n }\n\n private get _range(): number {\n return Math.max(0, this.max - this.min)\n }\n\n private get _percent(): number {\n return this._range === 0 ? 0 : ((this.value - this.min) / this._range) * 100\n }\n\n private get _markValues(): number[] {\n if (!this.marks || this._range === 0) return []\n const count = Math.min(100, Math.floor(this._range / this._safeStep))\n return Array.from({ length: count + 1 }, (_, index) => this.min + index * this._safeStep)\n }\n\n private get _safeStep(): number {\n return Number.isFinite(this.step) && this.step > 0 ? this.step : 1\n }\n\n private _normalizeValue(value: number): number {\n if (!Number.isFinite(value)) return this.min\n const lower = Math.min(this.min, this.max)\n const upper = Math.max(this.min, this.max)\n const clamped = Math.min(upper, Math.max(lower, value))\n const steps = Math.round((clamped - lower) / this._safeStep)\n return Number((lower + steps * this._safeStep).toFixed(this._precision))\n }\n\n private get _precision(): number {\n return Math.max(this._decimalPlaces(this.min), this._decimalPlaces(this.max), this._decimalPlaces(this._safeStep))\n }\n\n private _decimalPlaces(value: number): number {\n const [, decimal = ''] = String(value).split('.')\n return decimal.length\n }\n\n private _setValue(value: number): boolean {\n if (this._isDisabled) return false\n const nextValue = this._normalizeValue(value)\n if (nextValue === this.value) return false\n this.value = nextValue\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n return true\n }\n\n private _setValueFromPointer(event: PointerEvent): boolean {\n const track = event.currentTarget as HTMLElement\n const rect = track.getBoundingClientRect()\n if (this.vertical) {\n if (rect.height <= 0) return false\n // 视觉上的数值从下往上增长,与坐标系相反。\n const ratio = Math.min(1, Math.max(0, 1 - (event.clientY - rect.top) / rect.height))\n return this._setValue(this.min + ratio * this._range)\n }\n if (rect.width <= 0) return false\n const ratio = Math.min(1, Math.max(0, (event.clientX - rect.left) / rect.width))\n return this._setValue(this.min + ratio * this._range)\n }\n\n private _handlePointerDown(event: PointerEvent) {\n if (this._isDisabled) return\n const track = event.currentTarget as HTMLElement\n track.setPointerCapture?.(event.pointerId)\n this._interactionStartValue = this.value\n this._dragging = true\n this._setValueFromPointer(event)\n }\n\n private _handlePointerMove(event: PointerEvent) {\n if (!this._dragging) return\n this._setValueFromPointer(event)\n }\n\n private _handlePointerUp(event: PointerEvent) {\n if (!this._dragging) return\n this._setValueFromPointer(event)\n this._dragging = false\n if (this._interactionStartValue !== this.value) {\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n this._interactionStartValue = undefined\n }\n\n private _handleKeyDown(event: KeyboardEvent) {\n if (this._isDisabled) return\n const pageStep = this._safeStep * 10\n const keyValues: Record<string, number> = {\n ArrowDown: this.value - this._safeStep,\n ArrowLeft: this.value - this._safeStep,\n ArrowUp: this.value + this._safeStep,\n ArrowRight: this.value + this._safeStep,\n PageDown: this.value - pageStep,\n PageUp: this.value + pageStep,\n Home: this.min,\n End: this.max\n }\n const nextValue = keyValues[event.key]\n if (nextValue === undefined) return\n event.preventDefault()\n if (this._setValue(nextValue)) this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n\n override render() {\n const trackClass = classMap({\n 'wui-slider-track': true,\n 'is-disabled': this._isDisabled\n })\n const thumbClass = classMap({\n 'wui-slider-thumb': true,\n 'wui-glass': true,\n 'is-dragging': this._dragging\n })\n const trackStyle = styleMap({ '--percent': `${this._percent}%` })\n\n return html`\n <div\n class=${trackClass}\n style=${trackStyle}\n role=\"slider\"\n tabindex=${this._isDisabled ? -1 : 0}\n aria-label=\"滑块\"\n aria-orientation=${this.vertical ? 'vertical' : 'horizontal'}\n aria-valuemin=${this.min}\n aria-valuemax=${this.max}\n aria-valuenow=${this.value}\n aria-disabled=${String(this._isDisabled)}\n @keydown=${this._handleKeyDown}\n @pointerdown=${this._handlePointerDown}\n @pointermove=${this._handlePointerMove}\n @pointerup=${this._handlePointerUp}\n @pointercancel=${this._handlePointerUp}\n >\n <div class=\"wui-slider-progress\"></div>\n <div class=\"wui-slider-marks\">\n ${this._markValues.map(\n mark =>\n html`<span\n class=\"wui-slider-mark\"\n style=${styleMap({ '--percent': `${((mark - this.min) / this._range) * 100}%` })}\n ></span>`\n )}\n </div>\n <div class=${thumbClass}></div>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-slider': WebUiSlider\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/slider/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\n\nimport glass from '@/assets/glass.css?inline'\nimport { normalizeNumber } from '@/shared/normalize'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-slider')\nexport class WebUiSlider extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n static formAssociated = true\n\n // ElementInternals 实例,在 connectedCallback 中初始化\n private _internals?: ElementInternals\n @state() private _formDisabled = false\n\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) marks = false\n @property({ type: Boolean, reflect: true }) vertical = false\n @property({ type: String, reflect: true }) name = ''\n @property({ type: Boolean, reflect: true }) required = false\n\n // value 使用访问器模式同步 ElementInternals\n private _value = 0\n private _initialValue = 0\n @property({ type: Number, reflect: true })\n get value(): number {\n return this._value\n }\n set value(v: number) {\n const normalized = normalizeNumber(v, -Infinity, Infinity, 0)\n const old = this._value\n this._value = normalized\n this._internals?.setFormValue?.(String(normalized))\n this.requestUpdate('value', old)\n }\n\n private _min = 0\n @property({ type: Number, reflect: true })\n get min(): number {\n return this._min\n }\n set min(v: number) {\n this._min = normalizeNumber(v, -Infinity, Infinity, 0)\n }\n\n private _max = 100\n @property({ type: Number, reflect: true })\n get max(): number {\n return this._max\n }\n set max(v: number) {\n this._max = normalizeNumber(v, -Infinity, Infinity, 100)\n }\n\n private _step = 1\n @property({ type: Number, reflect: true })\n get step(): number {\n return this._step\n }\n set step(v: number) {\n this._step = normalizeNumber(v, -Infinity, Infinity, 1)\n }\n\n @state() private _dragging = false\n // 避免未改变数值的点击被误认为一次表单提交\n private _interactionStartValue: number | undefined\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this._internals = this.attachInternals()\n this._initialValue = Number(this.getAttribute('value')) || 0\n this._internals?.setFormValue?.(String(this._value))\n }\n\n override willUpdate(changed: Map<string, unknown>) {\n if (changed.has('value') || changed.has('min') || changed.has('max') || changed.has('step')) {\n const normalizedValue = this._normalizeValue(this.value)\n if (normalizedValue !== this.value) this.value = normalizedValue\n }\n }\n\n formResetCallback() {\n this.value = this._initialValue\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n override updated() {\n if (!this._internals || typeof this._internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required) this._internals.setValidity({})\n else this._internals.setValidity({})\n }\n\n // 将焦点移至滑块,供表单或外部控制使用\n override focus(options?: FocusOptions) {\n this._slider?.focus(options)\n }\n\n // 移除滑块焦点\n override blur() {\n this._slider?.blur()\n }\n\n private get _slider(): HTMLDivElement | null {\n return this.renderRoot.querySelector<HTMLDivElement>('[role=\"slider\"]')\n }\n\n private get _range(): number {\n return Math.max(0, this.max - this.min)\n }\n\n private get _percent(): number {\n return this._range === 0 ? 0 : ((this.value - this.min) / this._range) * 100\n }\n\n private get _markValues(): number[] {\n if (!this.marks || this._range === 0) return []\n const count = Math.min(100, Math.floor(this._range / this._safeStep))\n return Array.from({ length: count + 1 }, (_, index) => this.min + index * this._safeStep)\n }\n\n private get _safeStep(): number {\n return Number.isFinite(this.step) && this.step > 0 ? this.step : 1\n }\n\n private _normalizeValue(value: number): number {\n if (!Number.isFinite(value)) return this.min\n const lower = Math.min(this.min, this.max)\n const upper = Math.max(this.min, this.max)\n const clamped = Math.min(upper, Math.max(lower, value))\n const steps = Math.round((clamped - lower) / this._safeStep)\n return Number((lower + steps * this._safeStep).toFixed(this._precision))\n }\n\n private get _precision(): number {\n return Math.max(this._decimalPlaces(this.min), this._decimalPlaces(this.max), this._decimalPlaces(this._safeStep))\n }\n\n private _decimalPlaces(value: number): number {\n const [, decimal = ''] = String(value).split('.')\n return decimal.length\n }\n\n private _setValue(value: number): boolean {\n if (this._isDisabled) return false\n const nextValue = this._normalizeValue(value)\n if (nextValue === this.value) return false\n this.value = nextValue\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n return true\n }\n\n private _setValueFromPointer(event: PointerEvent): boolean {\n const track = event.currentTarget as HTMLElement\n const rect = track.getBoundingClientRect()\n if (this.vertical) {\n if (rect.height <= 0) return false\n // 视觉上的数值从下往上增长,与坐标系相反。\n const ratio = Math.min(1, Math.max(0, 1 - (event.clientY - rect.top) / rect.height))\n return this._setValue(this.min + ratio * this._range)\n }\n if (rect.width <= 0) return false\n const ratio = Math.min(1, Math.max(0, (event.clientX - rect.left) / rect.width))\n return this._setValue(this.min + ratio * this._range)\n }\n\n private _handlePointerDown(event: PointerEvent) {\n if (this._isDisabled) return\n const track = event.currentTarget as HTMLElement\n track.setPointerCapture?.(event.pointerId)\n this._interactionStartValue = this.value\n this._dragging = true\n this._setValueFromPointer(event)\n }\n\n private _handlePointerMove(event: PointerEvent) {\n if (!this._dragging) return\n this._setValueFromPointer(event)\n }\n\n private _handlePointerUp(event: PointerEvent) {\n if (!this._dragging) return\n this._setValueFromPointer(event)\n this._dragging = false\n if (this._interactionStartValue !== this.value) {\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n this._interactionStartValue = undefined\n }\n\n private _handleKeyDown(event: KeyboardEvent) {\n if (this._isDisabled) return\n const pageStep = this._safeStep * 10\n const keyValues: Record<string, number> = {\n ArrowDown: this.value - this._safeStep,\n ArrowLeft: this.value - this._safeStep,\n ArrowUp: this.value + this._safeStep,\n ArrowRight: this.value + this._safeStep,\n PageDown: this.value - pageStep,\n PageUp: this.value + pageStep,\n Home: this.min,\n End: this.max\n }\n const nextValue = keyValues[event.key]\n if (nextValue === undefined) return\n event.preventDefault()\n if (this._setValue(nextValue)) this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n\n override render() {\n const trackClass = classMap({\n 'wui-slider-track': true,\n 'is-disabled': this._isDisabled\n })\n const thumbClass = classMap({\n 'wui-slider-thumb': true,\n 'wui-glass': true,\n 'is-dragging': this._dragging\n })\n const trackStyle = styleMap({ '--percent': `${this._percent}%` })\n\n return html`\n <div\n class=${trackClass}\n style=${trackStyle}\n role=\"slider\"\n tabindex=${this._isDisabled ? '-1' : '0'}\n aria-label=\"滑块\"\n aria-orientation=${this.vertical ? 'vertical' : 'horizontal'}\n aria-valuemin=${this.min}\n aria-valuemax=${this.max}\n aria-valuenow=${this.value}\n aria-disabled=${String(this._isDisabled)}\n @keydown=${this._handleKeyDown}\n @pointerdown=${this._handlePointerDown}\n @pointermove=${this._handlePointerMove}\n @pointerup=${this._handlePointerUp}\n @pointercancel=${this._handlePointerUp}\n >\n <div class=\"wui-slider-progress\"></div>\n <div class=\"wui-slider-marks\">\n ${this._markValues.map(\n mark =>\n html`<span\n class=\"wui-slider-mark\"\n style=${styleMap({ '--percent': `${((mark - this.min) / this._range) * 100}%` })}\n ></span>`\n )}\n </div>\n <div class=${thumbClass}></div>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-slider': WebUiSlider\n }\n}\n"],"mappings":"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"}
@@ -3,13 +3,11 @@ export declare class WebUiSpinner extends LitElement {
3
3
  static styles: import('lit').CSSResult;
4
4
  size: number;
5
5
  description: string;
6
- /** 显示全屏居中 spinner(自动创建并挂载) */
7
6
  static show(options?: {
8
7
  size?: number;
9
8
  duration?: number;
10
9
  description?: string;
11
10
  }): WebUiSpinner;
12
- /** 隐藏并销毁全屏 spinner */
13
11
  static hide(): void;
14
12
  /** @internal 当前命令式实例 */
15
13
  static _current?: WebUiSpinner;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/spinner/index.ts"],"sourcesContent":["import { html, LitElement, nothing, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\n\nimport style from './style.css?inline'\n\nconst LEAF_COUNT = 8\n\nexport class WebUiSpinner extends LitElement {\n static override styles = unsafeCSS(style)\n\n @property({ type: Number, reflect: true }) size = 24\n @property({ type: String }) description = ''\n\n /** 显示全屏居中 spinner(自动创建并挂载) */\n static show(options?: { size?: number; duration?: number; description?: string }): WebUiSpinner {\n const el = document.createElement('web-ui-spinner')\n el._imperative = true\n if (options?.size) el.size = options.size\n if (options?.description) el.description = options.description\n document.body.appendChild(el)\n if (options?.duration && options.duration > 0) {\n el._timer = window.setTimeout(() => WebUiSpinner.hide(), options.duration)\n }\n return el\n }\n\n /** 隐藏并销毁全屏 spinner */\n static hide() {\n if (WebUiSpinner._current?._timer) {\n clearTimeout(WebUiSpinner._current._timer)\n WebUiSpinner._current._timer = undefined\n }\n WebUiSpinner._current?.remove()\n WebUiSpinner._current = undefined\n }\n\n /** @internal 当前命令式实例 */\n static _current?: WebUiSpinner\n\n /** @internal */\n _imperative = false\n /** @internal */\n _timer?: ReturnType<typeof setTimeout>\n\n override connectedCallback() {\n super.connectedCallback()\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'status')\n }\n if (!this.hasAttribute('aria-label')) {\n this.setAttribute('aria-label', '加载中')\n }\n if (this._imperative) {\n WebUiSpinner._current?.remove()\n WebUiSpinner._current = this\n this.classList.add('wui-spinner-overlay')\n }\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n if (this._timer) {\n clearTimeout(this._timer)\n this._timer = undefined\n }\n }\n\n protected override updated(props: PropertyValues) {\n super.updated(props)\n if (props.has('size')) {\n this.style.setProperty('--wui-spinner-size', `${this.size}px`)\n }\n }\n\n override render() {\n const spinner = html`\n <div class=\"wui-spinner\">\n ${repeat(\n Array.from({ length: LEAF_COUNT }, (_, i) => i),\n i =>\n html`<span\n style=\"transform:rotate(${i * 45}deg);animation-delay:calc(-${LEAF_COUNT - i} / ${LEAF_COUNT} * 0.8s)\"\n ></span>`\n )}\n </div>\n ${this.description ? html`<div class=\"spinner-description\">${this.description}</div>` : nothing}\n <slot name=\"description\"></slot>\n `\n return this._imperative ? html`<div class=\"wui-spinner-overlay\">${spinner}</div>` : spinner\n }\n\n declare readonly $events: Record<string, never>\n}\n\n@customElement('web-ui-spinner')\nexport class WebUiSpinnerElement extends WebUiSpinner {}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-spinner': WebUiSpinner\n }\n}\n"],"mappings":";;;;;;AAMA,IAAM,IAAa,GAEN,IAAb,MAAa,UAAqB,EAAW;;EAiC7B,aA9BoC,KAAA,OAAA,IACR,KAAA,cAAA,IA6B5B,KAAA,cAAA;;;EAhCW,KAAA,SAAA,EAAU,CAAK;;CAMxC,OAAO,KAAK,GAAoF;EAC9F,IAAM,IAAK,SAAS,cAAc,gBAAgB;EAQlD,OAPA,EAAG,cAAc,IACb,GAAS,SAAM,EAAG,OAAO,EAAQ,OACjC,GAAS,gBAAa,EAAG,cAAc,EAAQ,cACnD,SAAS,KAAK,YAAY,CAAE,GACxB,GAAS,YAAY,EAAQ,WAAW,MAC1C,EAAG,SAAS,OAAO,iBAAiB,EAAa,KAAK,GAAG,EAAQ,QAAQ,IAEpE;CACT;CAGA,OAAO,OAAO;EAMZ,AALI,EAAa,UAAU,WACzB,aAAa,EAAa,SAAS,MAAM,GACzC,EAAa,SAAS,SAAS,KAAA,IAEjC,EAAa,UAAU,OAAO,GAC9B,EAAa,WAAW,KAAA;CAC1B;CAUA,oBAA6B;EAQ3B,AAPA,MAAM,kBAAkB,GACnB,KAAK,aAAa,MAAM,KAC3B,KAAK,aAAa,QAAQ,QAAQ,GAE/B,KAAK,aAAa,YAAY,KACjC,KAAK,aAAa,cAAc,KAAK,GAEnC,KAAK,gBACP,EAAa,UAAU,OAAO,GAC9B,EAAa,WAAW,MACxB,KAAK,UAAU,IAAI,qBAAqB;CAE5C;CAEA,uBAAgC;EAE9B,AADA,MAAM,qBAAqB,GAC3B,AAEE,KAAK,YADL,aAAa,KAAK,MAAM,GACV,KAAA;CAElB;CAEA,QAA2B,GAAuB;EAEhD,AADA,MAAM,QAAQ,CAAK,GACf,EAAM,IAAI,MAAM,KAClB,KAAK,MAAM,YAAY,sBAAsB,GAAG,KAAK,KAAK,GAAG;CAEjE;CAEA,SAAkB;EAChB,IAAM,IAAU,CAAI;;UAEd,EACA,MAAM,KAAK,EAAE,QAAQ,EAAW,IAAI,GAAG,MAAM,CAAC,IAC9C,MACE,CAAI;wCACwB,IAAI,GAAG,6BAA6B,IAAa,EAAE,KAAK,EAAW;qBAEnG,EAAE;;QAEF,KAAK,cAAc,CAAI,oCAAoC,KAAK,YAAY,UAAU,EAAQ;;;EAGlG,OAAO,KAAK,cAAc,CAAI,oCAAoC,EAAQ,UAAU;CACtF;AAGF;AAlFG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GACxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA;AAoFrB,IAAM,IAAN,cAAkC,EAAa,CAAC;AADtD,IAAA,EAAA,CAAA,EAAc,gBAAgB,CAAA,GAAA,CAAA"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/spinner/index.ts"],"sourcesContent":["import { html, LitElement, nothing, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { repeat } from 'lit/directives/repeat.js'\n\nimport style from './style.css?inline'\n\nconst LEAF_COUNT = 8\n\nexport class WebUiSpinner extends LitElement {\n static override styles = unsafeCSS(style)\n\n @property({ type: Number, reflect: true }) size = 24\n @property({ type: String }) description = ''\n\n // 显示全屏居中 spinner(自动创建并挂载)\n static show(options?: { size?: number; duration?: number; description?: string }): WebUiSpinner {\n const el = document.createElement('web-ui-spinner')\n el._imperative = true\n if (options?.size) el.size = options.size\n if (options?.description) el.description = options.description\n document.body.appendChild(el)\n if (options?.duration && options.duration > 0) {\n el._timer = window.setTimeout(() => WebUiSpinner.hide(), options.duration)\n }\n return el\n }\n\n // 隐藏并销毁全屏 spinner\n static hide() {\n if (WebUiSpinner._current?._timer) {\n clearTimeout(WebUiSpinner._current._timer)\n WebUiSpinner._current._timer = undefined\n }\n WebUiSpinner._current?.remove()\n WebUiSpinner._current = undefined\n }\n\n /** @internal 当前命令式实例 */\n static _current?: WebUiSpinner\n\n /** @internal */\n _imperative = false\n /** @internal */\n _timer?: ReturnType<typeof setTimeout>\n\n override connectedCallback() {\n super.connectedCallback()\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'status')\n }\n if (!this.hasAttribute('aria-label')) {\n this.setAttribute('aria-label', '加载中')\n }\n if (this._imperative) {\n WebUiSpinner._current?.remove()\n WebUiSpinner._current = this\n this.classList.add('wui-spinner-overlay')\n }\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n if (this._timer) {\n clearTimeout(this._timer)\n this._timer = undefined\n }\n }\n\n protected override updated(props: PropertyValues) {\n super.updated(props)\n if (props.has('size')) {\n this.style.setProperty('--wui-spinner-size', `${this.size}px`)\n }\n }\n\n override render() {\n const spinner = html`\n <div class=\"wui-spinner\">\n ${repeat(\n Array.from({ length: LEAF_COUNT }, (_, i) => i),\n i =>\n html`<span\n style=\"transform:rotate(${i * 45}deg);animation-delay:calc(-${LEAF_COUNT - i} / ${LEAF_COUNT} * 0.8s)\"\n ></span>`\n )}\n </div>\n ${this.description ? html`<div class=\"spinner-description\">${this.description}</div>` : nothing}\n <slot name=\"description\"></slot>\n `\n return this._imperative ? html`<div class=\"wui-spinner-overlay\">${spinner}</div>` : spinner\n }\n\n declare readonly $events: Record<string, never>\n}\n\n@customElement('web-ui-spinner')\nexport class WebUiSpinnerElement extends WebUiSpinner {}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-spinner': WebUiSpinner\n }\n}\n"],"mappings":";;;;;;AAMA,IAAM,IAAa,GAEN,IAAb,MAAa,UAAqB,EAAW;;EAiC7B,aA9BoC,KAAA,OAAA,IACR,KAAA,cAAA,IA6B5B,KAAA,cAAA;;;EAhCW,KAAA,SAAA,EAAU,CAAK;;CAMxC,OAAO,KAAK,GAAoF;EAC9F,IAAM,IAAK,SAAS,cAAc,gBAAgB;EAQlD,OAPA,EAAG,cAAc,IACb,GAAS,SAAM,EAAG,OAAO,EAAQ,OACjC,GAAS,gBAAa,EAAG,cAAc,EAAQ,cACnD,SAAS,KAAK,YAAY,CAAE,GACxB,GAAS,YAAY,EAAQ,WAAW,MAC1C,EAAG,SAAS,OAAO,iBAAiB,EAAa,KAAK,GAAG,EAAQ,QAAQ,IAEpE;CACT;CAGA,OAAO,OAAO;EAMZ,AALI,EAAa,UAAU,WACzB,aAAa,EAAa,SAAS,MAAM,GACzC,EAAa,SAAS,SAAS,KAAA,IAEjC,EAAa,UAAU,OAAO,GAC9B,EAAa,WAAW,KAAA;CAC1B;CAUA,oBAA6B;EAQ3B,AAPA,MAAM,kBAAkB,GACnB,KAAK,aAAa,MAAM,KAC3B,KAAK,aAAa,QAAQ,QAAQ,GAE/B,KAAK,aAAa,YAAY,KACjC,KAAK,aAAa,cAAc,KAAK,GAEnC,KAAK,gBACP,EAAa,UAAU,OAAO,GAC9B,EAAa,WAAW,MACxB,KAAK,UAAU,IAAI,qBAAqB;CAE5C;CAEA,uBAAgC;EAE9B,AADA,MAAM,qBAAqB,GAC3B,AAEE,KAAK,YADL,aAAa,KAAK,MAAM,GACV,KAAA;CAElB;CAEA,QAA2B,GAAuB;EAEhD,AADA,MAAM,QAAQ,CAAK,GACf,EAAM,IAAI,MAAM,KAClB,KAAK,MAAM,YAAY,sBAAsB,GAAG,KAAK,KAAK,GAAG;CAEjE;CAEA,SAAkB;EAChB,IAAM,IAAU,CAAI;;UAEd,EACA,MAAM,KAAK,EAAE,QAAQ,EAAW,IAAI,GAAG,MAAM,CAAC,IAC9C,MACE,CAAI;wCACwB,IAAI,GAAG,6BAA6B,IAAa,EAAE,KAAK,EAAW;qBAEnG,EAAE;;QAEF,KAAK,cAAc,CAAI,oCAAoC,KAAK,YAAY,UAAU,EAAQ;;;EAGlG,OAAO,KAAK,cAAc,CAAI,oCAAoC,EAAQ,UAAU;CACtF;AAGF;AAlFG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,QAAA,KAAA,CAAA,GACxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,eAAA,KAAA,CAAA;AAoFrB,IAAM,IAAN,cAAkC,EAAa,CAAC;AADtD,IAAA,EAAA,CAAA,EAAc,gBAAgB,CAAA,GAAA,CAAA"}
@@ -22,9 +22,7 @@ export declare class WebUiSvgDrawLines extends LitElement {
22
22
  */
23
23
  private collectGeometryElements;
24
24
  private animateElement;
25
- /** Z → explicit line back to start + 0.1px extra, forcing render of the closing segment */
26
25
  private fixPathGap;
27
- /** 首次 slot 内容稳定后自动播放一次 */
28
26
  private handleSlotChange;
29
27
  disconnectedCallback(): void;
30
28
  render(): import('lit').TemplateResult<1>;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/svg-draw-lines/index.ts"],"sourcesContent":["import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { normalizeNumber } from '@/shared/normalize'\nimport { findNearestTheme } from '@/shared/theme/theme-scope'\n\nimport style from './style.css?inline'\n\nconst GEOMETRY_SELECTOR = 'path, rect, circle, line, polyline, polygon, ellipse'\n\ninterface AnimationRun {\n animations: Animation[]\n restoreQueue: Map<SVGGeometryElement, { dasharray: string | null; dashoffset: string | null }>\n patchedD: Map<SVGGeometryElement, string>\n}\n\n@customElement('web-ui-svg-draw-lines')\nexport class WebUiSvgDrawLines extends LitElement {\n static override styles = unsafeCSS(style)\n\n @property({ type: Number, reflect: true })\n get duration(): number {\n return this._duration\n }\n set duration(v: number) {\n const old = this._duration\n this._duration = normalizeNumber(v, 0, 30000, 1000)\n this.requestUpdate('duration', old)\n }\n private _duration = 1000\n\n @property({ type: String, reflect: true }) easing = 'linear'\n\n private _activeRun: AnimationRun | undefined\n private _hasAutoPlayed = false\n /**\n * 停止当前播放并重新开始。每次调用重新收集子树中的几何元素。\n * 所有元素同时开始并行的 stroke-dashoffset 动画。\n * 无目标或当前主题范围启用 reduced motion 时立即 resolve。\n */\n async replay(): Promise<void> {\n this.cancelAll()\n\n if (this._isReducedMotion()) return\n\n const targets = this.collectGeometryElements()\n if (targets.length === 0) return\n\n const run: AnimationRun = {\n animations: [],\n restoreQueue: new Map(),\n patchedD: new Map()\n }\n this._activeRun = run\n\n await Promise.all(targets.map(el => this.animateElement(el, run)))\n\n // A later replay owns the current DOM state and must not be cleaned up here.\n if (this._activeRun === run) this.finishRun(run)\n }\n\n private cancelAll() {\n if (this._activeRun) this.finishRun(this._activeRun)\n }\n\n private _isReducedMotion(): boolean {\n const theme = findNearestTheme(this)\n if (theme) return theme.isReducedMotion()\n\n try {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches\n } catch {\n return false\n }\n }\n\n private finishRun(run: AnimationRun) {\n run.animations.forEach(anim => anim.cancel())\n\n // The animation temporarily mutates consumer-owned SVG nodes, so always restore them.\n for (const [el, cached] of run.restoreQueue) {\n el.style.strokeDasharray = cached.dasharray ?? ''\n el.style.strokeDashoffset = cached.dashoffset ?? ''\n }\n\n for (const [el, d] of run.patchedD) {\n el.setAttribute('d', d)\n }\n\n if (this._activeRun === run) this._activeRun = undefined\n }\n\n /**\n * 深度遍历组件的 light DOM 子节点与开放 Shadow Root,\n * 收集所有 SVGGeometryElement。closed shadow root 跳过。\n */\n private collectGeometryElements(): SVGGeometryElement[] {\n const elements: SVGGeometryElement[] = []\n const seen = new Set<SVGGeometryElement>()\n\n const walk = (root: Node) => {\n // Collect SVG geometry from this subtree\n if (root instanceof Element || root instanceof DocumentFragment) {\n root.querySelectorAll(GEOMETRY_SELECTOR).forEach(el => {\n // instanceof SVGGeometryElement 在 jsdom 中未定义,使用 duck-type 检查\n if (\n typeof (el as unknown as Record<string, unknown>).getTotalLength === 'function' &&\n !seen.has(el as unknown as SVGGeometryElement)\n ) {\n seen.add(el as unknown as SVGGeometryElement)\n elements.push(el as unknown as SVGGeometryElement)\n }\n })\n }\n\n // Recurse into children and open shadow roots\n if (root instanceof Element) {\n for (const child of root.children) walk(child)\n if (root.shadowRoot) walk(root.shadowRoot)\n } else if (root instanceof ShadowRoot) {\n for (const child of root.children) walk(child)\n }\n }\n\n for (const child of this.children) walk(child)\n return elements\n }\n\n private animateElement(el: SVGGeometryElement, run: AnimationRun): Promise<void> {\n return new Promise(resolve => {\n // Save inline styles once per animation cycle\n if (!run.restoreQueue.has(el)) {\n run.restoreQueue.set(el, {\n dasharray: el.style.strokeDasharray,\n dashoffset: el.style.strokeDashoffset\n })\n }\n\n // Gap fix for paths ending with Z/z\n if (el.tagName === 'path') {\n const d = el.getAttribute('d')\n if (d && /[Zz]\\s*$/.test(d) && !run.patchedD.has(el)) {\n run.patchedD.set(el, d)\n el.setAttribute('d', this.fixPathGap(el, d))\n }\n }\n\n const strokeWidth = parseFloat(getComputedStyle(el).strokeWidth) || 0\n const len = el.getTotalLength() + strokeWidth\n\n el.style.strokeDasharray = `${len}`\n el.style.strokeDashoffset = `${len}`\n\n const anim = el.animate([{ strokeDashoffset: `${len}` }, { strokeDashoffset: '0' }], {\n duration: this.duration,\n easing: this.easing,\n fill: 'forwards'\n })\n\n run.animations.push(anim)\n\n anim.onfinish = () => {\n resolve()\n }\n\n anim.oncancel = () => {\n resolve()\n }\n })\n }\n\n /** Z → explicit line back to start + 0.1px extra, forcing render of the closing segment */\n private fixPathGap(pathEl: SVGPathElement, d: string): string {\n pathEl.setAttribute('d', d)\n const p0 = pathEl.getPointAtLength(0)\n const p1 = pathEl.getPointAtLength(0.1)\n return d.replace(/[Zz]\\s*$/, `L${p0.x.toFixed(3)} ${p0.y.toFixed(3)} L${p1.x.toFixed(3)} ${p1.y.toFixed(3)}`)\n }\n\n /** 首次 slot 内容稳定后自动播放一次 */\n private handleSlotChange() {\n if (this._hasAutoPlayed) return\n this._hasAutoPlayed = true\n void this.replay()\n }\n\n override disconnectedCallback() {\n this.cancelAll()\n super.disconnectedCallback()\n }\n\n override render() {\n return html`<slot @slotchange=${this.handleSlotChange}></slot>`\n }\n\n declare readonly $events: Record<string, never>\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-svg-draw-lines': WebUiSvgDrawLines\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/svg-draw-lines/index.ts"],"sourcesContent":["import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { normalizeNumber } from '@/shared/normalize'\nimport { findNearestTheme } from '@/shared/theme/theme-scope'\n\nimport style from './style.css?inline'\n\nconst GEOMETRY_SELECTOR = 'path, rect, circle, line, polyline, polygon, ellipse'\n\ninterface AnimationRun {\n animations: Animation[]\n restoreQueue: Map<SVGGeometryElement, { dasharray: string | null; dashoffset: string | null }>\n patchedD: Map<SVGGeometryElement, string>\n}\n\n@customElement('web-ui-svg-draw-lines')\nexport class WebUiSvgDrawLines extends LitElement {\n static override styles = unsafeCSS(style)\n\n @property({ type: Number, reflect: true })\n get duration(): number {\n return this._duration\n }\n set duration(v: number) {\n const old = this._duration\n this._duration = normalizeNumber(v, 0, 30000, 1000)\n this.requestUpdate('duration', old)\n }\n private _duration = 1000\n\n @property({ type: String, reflect: true }) easing = 'linear'\n\n private _activeRun: AnimationRun | undefined\n private _hasAutoPlayed = false\n /**\n * 停止当前播放并重新开始。每次调用重新收集子树中的几何元素。\n * 所有元素同时开始并行的 stroke-dashoffset 动画。\n * 无目标或当前主题范围启用 reduced motion 时立即 resolve。\n */\n async replay(): Promise<void> {\n this.cancelAll()\n\n if (this._isReducedMotion()) return\n\n const targets = this.collectGeometryElements()\n if (targets.length === 0) return\n\n const run: AnimationRun = {\n animations: [],\n restoreQueue: new Map(),\n patchedD: new Map()\n }\n this._activeRun = run\n\n await Promise.all(targets.map(el => this.animateElement(el, run)))\n\n // A later replay owns the current DOM state and must not be cleaned up here.\n if (this._activeRun === run) this.finishRun(run)\n }\n\n private cancelAll() {\n if (this._activeRun) this.finishRun(this._activeRun)\n }\n\n private _isReducedMotion(): boolean {\n const theme = findNearestTheme(this)\n if (theme) return theme.isReducedMotion()\n\n try {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches\n } catch {\n return false\n }\n }\n\n private finishRun(run: AnimationRun) {\n run.animations.forEach(anim => anim.cancel())\n\n // The animation temporarily mutates consumer-owned SVG nodes, so always restore them.\n for (const [el, cached] of run.restoreQueue) {\n el.style.strokeDasharray = cached.dasharray ?? ''\n el.style.strokeDashoffset = cached.dashoffset ?? ''\n }\n\n for (const [el, d] of run.patchedD) {\n el.setAttribute('d', d)\n }\n\n if (this._activeRun === run) this._activeRun = undefined\n }\n\n /**\n * 深度遍历组件的 light DOM 子节点与开放 Shadow Root,\n * 收集所有 SVGGeometryElement。closed shadow root 跳过。\n */\n private collectGeometryElements(): SVGGeometryElement[] {\n const elements: SVGGeometryElement[] = []\n const seen = new Set<SVGGeometryElement>()\n\n const walk = (root: Node) => {\n // Collect SVG geometry from this subtree\n if (root instanceof Element || root instanceof DocumentFragment) {\n root.querySelectorAll(GEOMETRY_SELECTOR).forEach(el => {\n // instanceof SVGGeometryElement 在 jsdom 中未定义,使用 duck-type 检查\n if (\n typeof (el as unknown as Record<string, unknown>).getTotalLength === 'function' &&\n !seen.has(el as unknown as SVGGeometryElement)\n ) {\n seen.add(el as unknown as SVGGeometryElement)\n elements.push(el as unknown as SVGGeometryElement)\n }\n })\n }\n\n // Recurse into children and open shadow roots\n if (root instanceof Element) {\n for (const child of root.children) walk(child)\n if (root.shadowRoot) walk(root.shadowRoot)\n } else if (root instanceof ShadowRoot) {\n for (const child of root.children) walk(child)\n }\n }\n\n for (const child of this.children) walk(child)\n return elements\n }\n\n private animateElement(el: SVGGeometryElement, run: AnimationRun): Promise<void> {\n return new Promise(resolve => {\n // Save inline styles once per animation cycle\n if (!run.restoreQueue.has(el)) {\n run.restoreQueue.set(el, {\n dasharray: el.style.strokeDasharray,\n dashoffset: el.style.strokeDashoffset\n })\n }\n\n // Gap fix for paths ending with Z/z\n if (el.tagName === 'path') {\n const d = el.getAttribute('d')\n if (d && /[Zz]\\s*$/.test(d) && !run.patchedD.has(el)) {\n run.patchedD.set(el, d)\n el.setAttribute('d', this.fixPathGap(el, d))\n }\n }\n\n const strokeWidth = parseFloat(getComputedStyle(el).strokeWidth) || 0\n const len = el.getTotalLength() + strokeWidth\n\n el.style.strokeDasharray = `${len}`\n el.style.strokeDashoffset = `${len}`\n\n const anim = el.animate([{ strokeDashoffset: `${len}` }, { strokeDashoffset: '0' }], {\n duration: this.duration,\n easing: this.easing,\n fill: 'forwards'\n })\n\n run.animations.push(anim)\n\n anim.onfinish = () => {\n resolve()\n }\n\n anim.oncancel = () => {\n resolve()\n }\n })\n }\n\n // Z → explicit line back to start + 0.1px extra, forcing render of the closing segment\n private fixPathGap(pathEl: SVGPathElement, d: string): string {\n pathEl.setAttribute('d', d)\n const p0 = pathEl.getPointAtLength(0)\n const p1 = pathEl.getPointAtLength(0.1)\n return d.replace(/[Zz]\\s*$/, `L${p0.x.toFixed(3)} ${p0.y.toFixed(3)} L${p1.x.toFixed(3)} ${p1.y.toFixed(3)}`)\n }\n\n // 首次 slot 内容稳定后自动播放一次\n private handleSlotChange() {\n if (this._hasAutoPlayed) return\n this._hasAutoPlayed = true\n void this.replay()\n }\n\n override disconnectedCallback() {\n this.cancelAll()\n super.disconnectedCallback()\n }\n\n override render() {\n return html`<slot @slotchange=${this.handleSlotChange}></slot>`\n }\n\n declare readonly $events: Record<string, never>\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-svg-draw-lines': WebUiSvgDrawLines\n }\n}\n"],"mappings":"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"}
@@ -19,7 +19,6 @@ export declare class WebUiSwitch extends LitElement {
19
19
  formDisabledCallback(disabled: boolean): void;
20
20
  updated(): void;
21
21
  private _syncFormValue;
22
- /** 用户点击切换开关状态,阻止 label 默认行为避免原生 checkbox 重复触发 */
23
22
  private handleClick;
24
23
  private handlePointerDown;
25
24
  private handlePointerUp;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/switch/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\n\nimport '@/components/icon'\nimport glass from '@/assets/glass.css?inline'\nimport { lucideLoaderCircle } from '@/icons'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-switch')\nexport class WebUiSwitch extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n static formAssociated = true\n\n private _internals?: ElementInternals\n @state() private _formDisabled = false\n\n @state() private _checked = false\n\n get checked(): boolean {\n return this._checked\n }\n\n set checked(v: boolean) {\n const old = this._checked\n this._checked = v\n this._syncFormValue()\n this.requestUpdate('checked', old)\n }\n\n @property({ type: String, reflect: true }) name = ''\n @property({ type: String }) value = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n @property({ type: Boolean, reflect: true }) loading = false\n @state() private pressed = false\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n override connectedCallback() {\n super.connectedCallback()\n if (this._internals) return\n this._internals = this.attachInternals()\n if (this.hasAttribute('checked')) {\n this._checked = true\n }\n this._syncFormValue()\n }\n\n formResetCallback() {\n this.checked = this.hasAttribute('checked')\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n override updated() {\n this._syncFormValue()\n if (!this._internals || typeof this._internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this._checked) this._internals.setValidity({})\n else this._internals.setValidity({ valueMissing: true }, '请启用此项')\n }\n\n private _syncFormValue() {\n this._internals?.setFormValue?.(this._checked ? this.value || 'on' : null)\n }\n\n /** 用户点击切换开关状态,阻止 label 默认行为避免原生 checkbox 重复触发 */\n private handleClick(e: Event) {\n e.preventDefault()\n if (this._isDisabled || this.loading) return\n const old = this._checked\n this._checked = !old\n this._syncFormValue()\n this.requestUpdate('checked', old)\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n\n private handlePointerDown() {\n if (this._isDisabled || this.loading) return\n this.pressed = true\n }\n\n private handlePointerUp() {\n this.pressed = false\n }\n\n private handlePointerLeave() {\n this.pressed = false\n }\n\n override render() {\n const trackCls = {\n 'wui-switch-track': true,\n 'is-open': this._checked,\n 'is-disabled': this._isDisabled || this.loading\n }\n const thumbCls = {\n 'wui-switch-thumb': true,\n 'wui-glass': this.pressed,\n 'is-pressed': this.pressed\n }\n\n return html`\n <label\n class=${classMap(trackCls)}\n role=\"switch\"\n aria-checked=${String(this._checked)}\n @click=${this.handleClick}\n @pointerdown=${this.handlePointerDown}\n @pointerup=${this.handlePointerUp}\n @pointercancel=${this.handlePointerUp}\n @pointerleave=${this.handlePointerLeave}\n >\n <input\n type=\"checkbox\"\n .checked=${this._checked}\n ?disabled=${this._isDisabled || this.loading}\n class=\"sr-only\"\n />\n <div class=${classMap(thumbCls)}>\n ${this.loading\n ? html`<div class=\"wui-switch-loading\">\n <web-ui-icon .icon=${lucideLoaderCircle} size=\"14\" color=\"#08f\" spin></web-ui-icon>\n </div>`\n : ''}\n </div>\n </label>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-switch': WebUiSwitch\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/switch/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\n\nimport '@/components/icon'\nimport glass from '@/assets/glass.css?inline'\nimport { lucideLoaderCircle } from '@/icons'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-switch')\nexport class WebUiSwitch extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n static formAssociated = true\n\n private _internals?: ElementInternals\n @state() private _formDisabled = false\n\n @state() private _checked = false\n\n get checked(): boolean {\n return this._checked\n }\n\n set checked(v: boolean) {\n const old = this._checked\n this._checked = v\n this._syncFormValue()\n this.requestUpdate('checked', old)\n }\n\n @property({ type: String, reflect: true }) name = ''\n @property({ type: String }) value = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n @property({ type: Boolean, reflect: true }) loading = false\n @state() private pressed = false\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n override connectedCallback() {\n super.connectedCallback()\n if (this._internals) return\n this._internals = this.attachInternals()\n if (this.hasAttribute('checked')) {\n this._checked = true\n }\n this._syncFormValue()\n }\n\n formResetCallback() {\n this.checked = this.hasAttribute('checked')\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n override updated() {\n this._syncFormValue()\n if (!this._internals || typeof this._internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this._checked) this._internals.setValidity({})\n else this._internals.setValidity({ valueMissing: true }, '请启用此项')\n }\n\n private _syncFormValue() {\n this._internals?.setFormValue?.(this._checked ? this.value || 'on' : null)\n }\n\n // 用户点击切换开关状态,阻止 label 默认行为避免原生 checkbox 重复触发\n private handleClick(e: Event) {\n e.preventDefault()\n if (this._isDisabled || this.loading) return\n const old = this._checked\n this._checked = !old\n this._syncFormValue()\n this.requestUpdate('checked', old)\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n\n private handlePointerDown() {\n if (this._isDisabled || this.loading) return\n this.pressed = true\n }\n\n private handlePointerUp() {\n this.pressed = false\n }\n\n private handlePointerLeave() {\n this.pressed = false\n }\n\n override render() {\n const trackCls = {\n 'wui-switch-track': true,\n 'is-open': this._checked,\n 'is-disabled': this._isDisabled || this.loading\n }\n const thumbCls = {\n 'wui-switch-thumb': true,\n 'wui-glass': this.pressed,\n 'is-pressed': this.pressed\n }\n\n return html`\n <label\n class=${classMap(trackCls)}\n role=\"switch\"\n aria-checked=${String(this._checked)}\n @click=${this.handleClick}\n @pointerdown=${this.handlePointerDown}\n @pointerup=${this.handlePointerUp}\n @pointercancel=${this.handlePointerUp}\n @pointerleave=${this.handlePointerLeave}\n >\n <input\n type=\"checkbox\"\n .checked=${this._checked}\n ?disabled=${this._isDisabled || this.loading}\n class=\"sr-only\"\n />\n <div class=${classMap(thumbCls)}>\n ${this.loading\n ? html`<div class=\"wui-switch-loading\">\n <web-ui-icon .icon=${lucideLoaderCircle} size=\"14\" color=\"#08f\" spin></web-ui-icon>\n </div>`\n : ''}\n </div>\n </label>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-switch': WebUiSwitch\n }\n}\n"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  //#region src/components/switch/style.css?inline
2
- var e = "*,:before,:after{box-sizing:border-box}:host{display:inline-block}:host([disabled]){cursor:not-allowed}.sr-only{white-space:nowrap;clip-path:inset(50%);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.wui-switch-track{cursor:pointer;-webkit-user-select:none;user-select:none;background-color:var(--wui-color-surface-raised-deep,#e5e5ea);outline-offset:2px;width:48px;height:24px;transition:background-color var(--wui-duration-fast,.16s) ease;border-radius:2147483647px;outline:3px solid #0000;justify-content:space-between;align-items:center;display:flex;position:relative}.wui-switch-track:focus-visible{outline-color:var(--wui-focus-ring,#08f6)}.wui-switch-track.is-open{background-color:var(--wui-color-accent,#08f)}.wui-switch-track.is-disabled{cursor:not-allowed;opacity:.4}.wui-switch-thumb{width:20px;height:20px;transition:width var(--wui-duration-press,.12s) cubic-bezier(.4, 0, .2, 1), transform var(--wui-duration-fast,.16s) cubic-bezier(.4, 0, .2, 1), border-radius var(--wui-duration-press,.12s) cubic-bezier(.4, 0, .2, 1), background-color var(--wui-duration-press,.12s) ease;border-radius:2147483647px;position:absolute;top:2px;left:2px;overflow:hidden}.wui-switch-thumb.is-pressed{background-color:#0000;border-radius:2147483647px;width:32px}.wui-switch-thumb:not(.is-pressed){background-color:var(--wui-color-surface,#fff);box-shadow:1px 2px 6px #0003}.wui-switch-track.is-open .wui-switch-thumb{transform:translate(24px)}.wui-switch-track.is-open .wui-switch-thumb.is-pressed{transform:translate(12px)}.wui-switch-loading{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}";
2
+ var e = "*,:before,:after{box-sizing:border-box}:host{display:inline-block}:host([disabled]){cursor:not-allowed}.sr-only{white-space:nowrap;clip-path:inset(50%);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.wui-switch-track{cursor:pointer;-webkit-user-select:none;user-select:none;background-color:var(--wui-color-surface-raised-deep,#e5e5ea);outline-offset:2px;width:48px;height:24px;transition:background-color var(--wui-duration-trigger,.16s) ease;border-radius:2147483647px;outline:3px solid #0000;justify-content:space-between;align-items:center;display:flex;position:relative}.wui-switch-track:focus-within{outline-color:var(--wui-focus-ring,#08f6)}.wui-switch-track.is-open{background-color:var(--wui-color-accent,#08f)}.wui-switch-track.is-disabled{cursor:not-allowed;opacity:.4}.wui-switch-thumb{width:20px;height:20px;transition:width var(--wui-duration-press,80ms) cubic-bezier(.4, 0, .2, 1), transform var(--wui-duration-trigger,.16s) cubic-bezier(.4, 0, .2, 1), border-radius var(--wui-duration-press,80ms) cubic-bezier(.4, 0, .2, 1), background-color var(--wui-duration-press,80ms) ease;border-radius:2147483647px;position:absolute;top:2px;left:2px;overflow:hidden}.wui-switch-thumb.is-pressed{background-color:#0000;border-radius:2147483647px;width:32px}.wui-switch-thumb:not(.is-pressed){background-color:var(--wui-color-surface,#fff);box-shadow:1px 2px 6px #0003}.wui-switch-track.is-open .wui-switch-thumb{transform:translate(24px)}.wui-switch-track.is-open .wui-switch-thumb.is-pressed{transform:translate(12px)}.wui-switch-loading{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}";
3
3
  //#endregion
4
4
  export { e as default };
5
5
 
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/switch/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n display: inline-block;\n}\n\n:host([disabled]) {\n cursor: not-allowed;\n}\n\n/*\n标准视觉隐藏技术(sr-only):\n业内标准的“屏幕阅读器专用”隐藏方案。\n把复选框缩放到 1x1 像素,但保留在 dom 中,\n既让肉眼看不见,又能让读屏软件识别,并允许键盘用户通过空格键切换状态。\n*/\n.sr-only {\n position: absolute;\n\n overflow: hidden;\n\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n border: 0;\n\n white-space: nowrap;\n\n clip-path: inset(50%);\n}\n\n.wui-switch-track {\n cursor: pointer;\n user-select: none;\n\n position: relative;\n\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n width: 48px;\n height: 24px;\n border-radius: calc(infinity * 1px);\n\n background-color: var(--wui-color-surface-raised-deep, #e5e5ea);\n outline: 3px solid transparent;\n outline-offset: 2px;\n\n transition: background-color var(--wui-duration-fast, 160ms) ease;\n\n &:focus-visible {\n outline-color: var(--wui-focus-ring, rgb(0 136 255 / 0.4));\n }\n\n &.is-open {\n background-color: var(--wui-color-accent, #08f);\n }\n\n &.is-disabled {\n cursor: not-allowed;\n opacity: 0.4;\n }\n}\n\n.wui-switch-thumb {\n position: absolute;\n top: 2px;\n left: 2px;\n\n overflow: hidden;\n\n width: 20px;\n height: 20px;\n border-radius: calc(infinity * 1px);\n\n transition:\n width var(--wui-duration-press, 120ms) cubic-bezier(0.4, 0, 0.2, 1),\n transform var(--wui-duration-fast, 160ms) cubic-bezier(0.4, 0, 0.2, 1),\n border-radius var(--wui-duration-press, 120ms) cubic-bezier(0.4, 0, 0.2, 1),\n background-color var(--wui-duration-press, 120ms) ease;\n\n &.is-pressed {\n width: 32px;\n border-radius: calc(infinity * 1px);\n background-color: transparent;\n }\n\n &:not(.is-pressed) {\n background-color: var(--wui-color-surface, #fff);\n box-shadow: 1px 2px 6px rgb(0 0 0 / 0.2);\n }\n}\n\n.wui-switch-track.is-open .wui-switch-thumb {\n transform: translateX(24px);\n\n &.is-pressed {\n transform: translateX(12px);\n }\n}\n\n.wui-switch-loading {\n pointer-events: none;\n\n position: absolute;\n inset: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n}\n"],"mappings":""}
1
+ {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/switch/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n display: inline-block;\n}\n\n:host([disabled]) {\n cursor: not-allowed;\n}\n\n/*\n标准视觉隐藏技术(sr-only):\n业内标准的“屏幕阅读器专用”隐藏方案。\n把复选框缩放到 1x1 像素,但保留在 dom 中,\n既让肉眼看不见,又能让读屏软件识别,并允许键盘用户通过空格键切换状态。\n*/\n.sr-only {\n position: absolute;\n\n overflow: hidden;\n\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n border: 0;\n\n white-space: nowrap;\n\n clip-path: inset(50%);\n}\n\n.wui-switch-track {\n cursor: pointer;\n user-select: none;\n\n position: relative;\n\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n width: 48px;\n height: 24px;\n border-radius: calc(infinity * 1px);\n\n background-color: var(--wui-color-surface-raised-deep, #e5e5ea);\n outline: 3px solid transparent;\n outline-offset: 2px;\n\n transition: background-color var(--wui-duration-trigger, 160ms) ease;\n\n /* 实际获得焦点的是内部 sr-only 的 checkbox,track 本身不可聚焦;\n :focus-visible 在 track 上永不匹配,需用 :focus-within 让键盘焦点环生效 */\n &:focus-within {\n outline-color: var(--wui-focus-ring, rgb(0 136 255 / 0.4));\n }\n\n &.is-open {\n background-color: var(--wui-color-accent, #08f);\n }\n\n &.is-disabled {\n cursor: not-allowed;\n opacity: 0.4;\n }\n}\n\n.wui-switch-thumb {\n position: absolute;\n top: 2px;\n left: 2px;\n\n overflow: hidden;\n\n width: 20px;\n height: 20px;\n border-radius: calc(infinity * 1px);\n\n transition:\n width var(--wui-duration-press, 80ms) cubic-bezier(0.4, 0, 0.2, 1),\n transform var(--wui-duration-trigger, 160ms) cubic-bezier(0.4, 0, 0.2, 1),\n border-radius var(--wui-duration-press, 80ms) cubic-bezier(0.4, 0, 0.2, 1),\n background-color var(--wui-duration-press, 80ms) ease;\n\n &.is-pressed {\n width: 32px;\n border-radius: calc(infinity * 1px);\n background-color: transparent;\n }\n\n &:not(.is-pressed) {\n background-color: var(--wui-color-surface, #fff);\n box-shadow: 1px 2px 6px rgb(0 0 0 / 0.2);\n }\n}\n\n.wui-switch-track.is-open .wui-switch-thumb {\n transform: translateX(24px);\n\n &.is-pressed {\n transform: translateX(12px);\n }\n}\n\n.wui-switch-loading {\n pointer-events: none;\n\n position: absolute;\n inset: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n}\n"],"mappings":""}
@@ -14,6 +14,7 @@ export declare class WebUiTextarea extends LitElement {
14
14
  minlength: number | undefined;
15
15
  maxlength: number | undefined;
16
16
  autosize: boolean;
17
+ maxHeight: number;
17
18
  ariaLabel: string | null;
18
19
  ariaLabelledby: string | undefined;
19
20
  private _value;