@greypan/web-ui 10.0.0 → 10.1.1
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.
- package/README.CN.md +39 -1
- package/README.md +43 -1
- package/dist/components/autocomplete/index.js +62 -60
- package/dist/components/autocomplete/index.js.map +1 -1
- package/dist/components/avatar/index.js +5 -5
- package/dist/components/avatar/index.js.map +1 -1
- package/dist/components/back-top/index.js.map +1 -1
- package/dist/components/badge/index.js +5 -5
- package/dist/components/button/index.js +5 -5
- package/dist/components/button/index.js.map +1 -1
- package/dist/components/checkbox/index.js.map +1 -1
- package/dist/components/collapse/index.js +1 -1
- package/dist/components/collapse/index.js.map +1 -1
- package/dist/components/collapse/style.js +1 -1
- package/dist/components/collapse/style.js.map +1 -1
- package/dist/components/context-menu/index.d.ts +16 -0
- package/dist/components/context-menu/index.js +71 -66
- package/dist/components/context-menu/index.js.map +1 -1
- package/dist/components/dialog/index.js +39 -37
- package/dist/components/dialog/index.js.map +1 -1
- package/dist/components/drawer/index.js +64 -62
- package/dist/components/drawer/index.js.map +1 -1
- package/dist/components/dropdown-item/index.js.map +1 -1
- package/dist/components/editable-text/index.js +4 -4
- package/dist/components/empty/index.js.map +1 -1
- package/dist/components/empty/style.js +1 -1
- package/dist/components/empty/style.js.map +1 -1
- package/dist/components/image-preview/index.js.map +1 -1
- package/dist/components/input/index.js +5 -5
- package/dist/components/input/index.js.map +1 -1
- package/dist/components/input-number/index.js.map +1 -1
- package/dist/components/layout/index.js.map +1 -1
- package/dist/components/option/index.js.map +1 -1
- package/dist/components/segmented/index.js +17 -7
- package/dist/components/segmented/index.js.map +1 -1
- package/dist/components/select/index.js +45 -43
- package/dist/components/select/index.js.map +1 -1
- package/dist/components/switch/index.js.map +1 -1
- package/dist/components/textarea/index.js +8 -8
- package/dist/components/textarea/index.js.map +1 -1
- package/dist/components/toast/manager.js +1 -1
- package/dist/components/toast/manager.js.map +1 -1
- package/dist/components/toast/toast.js.map +1 -1
- package/dist/scrollbars/index.js.map +1 -1
- package/dist/scrollbars/internal.js +6 -0
- package/dist/scrollbars/internal.js.map +1 -0
- package/dist/scrollbars/style.css +1 -1
- package/dist/shared/menu-portal/menu-portal.js +16 -14
- package/dist/shared/menu-portal/menu-portal.js.map +1 -1
- package/dist/shared/overlay/overlay-root.js +13 -12
- package/dist/shared/overlay/overlay-root.js.map +1 -1
- package/dist/shared/overlay/overlay.js +33 -33
- package/dist/vite/index.d.ts +28 -0
- package/dist/vite/index.js +16 -0
- package/dist/vite/index.js.map +1 -0
- package/package.json +5 -1
- package/dist/node_modules/.pnpm/@floating-ui_core@1.8.0/node_modules/@floating-ui/core/dist/floating-ui.core.js +0 -246
- package/dist/node_modules/.pnpm/@floating-ui_core@1.8.0/node_modules/@floating-ui/core/dist/floating-ui.core.js.map +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_dom@1.8.0/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +0 -324
- package/dist/node_modules/.pnpm/@floating-ui_dom@1.8.0/node_modules/@floating-ui/dom/dist/floating-ui.dom.js.map +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +0 -100
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js.map +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +0 -102
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.12/node_modules/@floating-ui/utils/dist/floating-ui.utils.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/option/index.ts"],"sourcesContent":["import { html, LitElement, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/option/index.ts"],"sourcesContent":["import '@/components/icon'\n\nimport { html, LitElement, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { heroiconsCheck16Solid } from '@/icons'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-option')\nexport class WebUiOption extends LitElement {\n static override styles = unsafeCSS(style)\n\n @property({ type: String, reflect: true }) value = ''\n @property({ type: String })\n get label(): string {\n return this._label || this._getSlottedLabel()\n }\n set label(value: string) {\n const old = this.label\n this._label = value\n this.requestUpdate('label', old)\n }\n private _label = ''\n private _slottedLabel = ''\n\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) selected = false\n\n override connectedCallback() {\n super.connectedCallback()\n this.dispatchEvent(\n new CustomEvent('option-register', {\n bubbles: true,\n composed: true,\n detail: { value: this.value, label: this.label, disabled: this.disabled }\n })\n )\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this.dispatchEvent(\n new CustomEvent('option-unregister', {\n bubbles: true,\n composed: true,\n detail: { value: this.value }\n })\n )\n }\n\n override updated(changed: PropertyValues) {\n if (changed.has('value') || changed.has('label') || changed.has('disabled')) {\n this.dispatchEvent(\n new CustomEvent('option-update', {\n bubbles: true,\n composed: true\n })\n )\n }\n }\n\n private _onLabelSlotChange = () => {\n const label = this._getSlottedLabel()\n if (label === this._slottedLabel) return\n\n const old = this._label || this._slottedLabel\n this._slottedLabel = label\n this.requestUpdate('label', old)\n }\n\n private _getSlottedLabel(): string {\n return [...this.childNodes]\n .filter(node => !(node instanceof HTMLElement && node.slot))\n .map(node => node.textContent)\n .join('')\n .trim()\n }\n\n override render() {\n return html`\n <div class=\"option-label\">\n <web-ui-icon class=\"check\" size=\"16\" .icon=${heroiconsCheck16Solid}></web-ui-icon>\n <slot name=\"prefix\"></slot>\n <span class=\"content-wrap\">${this._label || html`<slot @slotchange=${this._onLabelSlotChange}></slot>`}</span>\n <slot name=\"suffix\"></slot>\n </div>\n `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-option': WebUiOption\n }\n}\n"],"mappings":";;;;;;;AAUO,IAAM,IAAN,cAA0B,EAAW;;EAoDP,aAjDgB,KAAA,QAAA,IAUlC,KAAA,SAAA,IACO,KAAA,gBAAA,IAE+B,KAAA,WAAA,IACA,KAAA,WAAA,IAmCpB,KAAA,2BAAA;GACjC,IAAM,IAAQ,KAAK,iBAAiB;GACpC,IAAI,MAAU,KAAK,eAAe;GAElC,IAAM,IAAM,KAAK,UAAU,KAAK;GAEhC,AADA,KAAK,gBAAgB,GACrB,KAAK,cAAc,SAAS,CAAG;EACjC;;;EA1DyB,KAAA,SAAA,EAAU,CAAK;;CAGxC,IACI,QAAgB;EAClB,OAAO,KAAK,UAAU,KAAK,iBAAiB;CAC9C;CACA,IAAI,MAAM,GAAe;EACvB,IAAM,IAAM,KAAK;EAEjB,AADA,KAAK,SAAS,GACd,KAAK,cAAc,SAAS,CAAG;CACjC;CAOA,oBAA6B;EAE3B,AADA,MAAM,kBAAkB,GACxB,KAAK,cACH,IAAI,YAAY,mBAAmB;GACjC,SAAS;GACT,UAAU;GACV,QAAQ;IAAE,OAAO,KAAK;IAAO,OAAO,KAAK;IAAO,UAAU,KAAK;GAAS;EAC1E,CAAC,CACH;CACF;CAEA,uBAAgC;EAE9B,AADA,MAAM,qBAAqB,GAC3B,KAAK,cACH,IAAI,YAAY,qBAAqB;GACnC,SAAS;GACT,UAAU;GACV,QAAQ,EAAE,OAAO,KAAK,MAAM;EAC9B,CAAC,CACH;CACF;CAEA,QAAiB,GAAyB;EACxC,CAAI,EAAQ,IAAI,OAAO,KAAK,EAAQ,IAAI,OAAO,KAAK,EAAQ,IAAI,UAAU,MACxE,KAAK,cACH,IAAI,YAAY,iBAAiB;GAC/B,SAAS;GACT,UAAU;EACZ,CAAC,CACH;CAEJ;CAWA,mBAAmC;EACjC,OAAO,CAAC,GAAG,KAAK,UAAU,CAAC,CACxB,QAAO,MAAQ,EAAE,aAAgB,eAAe,EAAK,KAAK,CAAC,CAC3D,KAAI,MAAQ,EAAK,WAAW,CAAC,CAC7B,KAAK,EAAE,CAAC,CACR,KAAK;CACV;CAEA,SAAkB;EAChB,OAAO,CAAI;;qDAEsC,EAAsB;;qCAEtC,KAAK,UAAU,CAAI,qBAAqB,KAAK,mBAAmB,UAAU;;;;CAI7G;AACF;AA5EG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,KAAA,CAAA,GACxC,EAAA,CAAA,EAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,EAAA,WAAA,SAAA,IAAA,GAYzB,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,GAlB3C,IAAA,EAAA,CAAA,EAAc,eAAe,CAAA,GAAA,CAAA"}
|
|
@@ -113,22 +113,32 @@ var C = class extends r(m) {
|
|
|
113
113
|
let i = r.getBoundingClientRect();
|
|
114
114
|
if (!(e.clientX >= i.left && e.clientX <= i.right && e.clientY >= i.top && e.clientY <= i.bottom)) return;
|
|
115
115
|
this._pressed = !0;
|
|
116
|
-
let a = this.getBoundingClientRect(), o = r.getBoundingClientRect(), s = o.left - a.left, c = o.width, l = t[0].getBoundingClientRect(),
|
|
116
|
+
let a = this.getBoundingClientRect(), o = r.getBoundingClientRect(), s = o.left - a.left, c = o.width, l = s + c / 2, p = t[0].getBoundingClientRect(), m = t[t.length - 1].getBoundingClientRect(), h = p.left - a.left, g = m.right - a.left, _ = n.map((e) => {
|
|
117
117
|
let t = e.getBoundingClientRect();
|
|
118
|
-
return
|
|
119
|
-
|
|
118
|
+
return {
|
|
119
|
+
center: t.left - a.left + t.width / 2,
|
|
120
|
+
width: t.width
|
|
121
|
+
};
|
|
122
|
+
}), v = _.map((e) => e.center), y = (e) => {
|
|
123
|
+
let t = l + e, n = f(t, v), r = n === -1 ? c : _[n]?.width ?? c, i = d(t - r / 2, h, g - r);
|
|
124
|
+
return {
|
|
125
|
+
left: i,
|
|
126
|
+
width: r,
|
|
127
|
+
center: i + r / 2
|
|
128
|
+
};
|
|
129
|
+
};
|
|
120
130
|
this._dragGestureHandle?.destroy(), this._dragGestureHandle = u(e, {
|
|
121
131
|
axis: "x",
|
|
122
132
|
threshold: 6,
|
|
123
133
|
onMove: (e) => {
|
|
124
134
|
this._isDragging = !0;
|
|
125
|
-
let t =
|
|
126
|
-
this.style.setProperty("--indicator-left", `${t}px`), this.style.setProperty("--indicator-width", `${
|
|
135
|
+
let { left: t, width: n } = y(e.deltaX);
|
|
136
|
+
this.style.setProperty("--indicator-left", `${t}px`), this.style.setProperty("--indicator-width", `${n}px`);
|
|
127
137
|
},
|
|
128
138
|
onEnd: (e) => {
|
|
129
139
|
let t = this._isDragging;
|
|
130
140
|
if (this._isDragging = !1, this._pressed = !1, t) {
|
|
131
|
-
let t =
|
|
141
|
+
let t = y(e.deltaX).center, i = r;
|
|
132
142
|
if (e.velocityX > 300) {
|
|
133
143
|
let e = n.indexOf(r);
|
|
134
144
|
i = e !== -1 && e < n.length - 1 ? n[e + 1] : n[n.length - 1];
|
|
@@ -136,7 +146,7 @@ var C = class extends r(m) {
|
|
|
136
146
|
let e = n.indexOf(r);
|
|
137
147
|
i = e > 0 ? n[e - 1] : n[0];
|
|
138
148
|
} else {
|
|
139
|
-
let e = f(t,
|
|
149
|
+
let e = f(t, v);
|
|
140
150
|
e !== -1 && n[e] && (i = n[e]);
|
|
141
151
|
}
|
|
142
152
|
i.value === this._value ? this._updateIndicator() : (this.value = i.value, this._groupController.sync(), this.dispatchEvent(new Event("input", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/segmented/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 glass from '@/assets/glass.css?inline'\nimport { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, snapToNearest } from '@/shared/gesture/physics'\nimport { defineGroupCoordinator, GroupController } from '@/shared/group-management'\nimport { normalizeLiteral } from '@/shared/normalize'\nimport { parseDuration } from '@/shared/theme/duration'\n\nimport type { WebUiSegmentedTrigger } from '../segmented-trigger'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\nconst ALLOWED_VARIANTS = ['inset', 'raised'] as const\n\n/*\n * 指示器移动时长取 `--wui-duration-trigger`,与 CSS 里 left / width 那两条 transition 同一个值。\n * 读不到 token 或格式不符时兜底 160(CSS 的 fallback 同值),负值钳到 0。\n *\n * reduced-motion 下不需要额外分支:theme 已把该 token 归零,settle 窗口随之变成 0,\n * 落定门自动退化成「每一步都直接落定」,而那本来就是 0ms 过渡的观感。\n */\nfunction triggerDuration(el: HTMLElement): number {\n const parsed = parseDuration(getComputedStyle(el).getPropertyValue('--wui-duration-trigger'))\n return parsed === null ? 160 : Math.max(0, parsed)\n}\n\n@customElement('web-ui-segmented')\nexport class WebUiSegmented extends FormAssociated(LitElement) {\n // 轨道是不透明实体面:底色取 surface(浅色即 page,深色即 surface-raised 档)、无\n // backdrop blur,描边环与投影仍由\n // .wui-glass 提供且全状态同值;指示器恒挂同一配方,静止态由 surface-segmented 实色\n // 盖住玻璃输出,按压与拖拽态才透出玻璃。\n // variant=\"raised\" 切回经典形态:flat 灰轨道(surface-segmented、无环无投影)+\n // 实体白指示器(surface-selected + 柔投影),按压/拖拽态两变体同为透明玻璃;\n // 视觉差异全部由 :host([variant=...]) 规则承载,见 style.css。\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n @property({ type: String, reflect: true }) name = ''\n\n @property({ type: String, reflect: true })\n get variant(): 'inset' | 'raised' {\n return this._variant\n }\n set variant(v: string) {\n const old = this._variant\n this._variant = normalizeLiteral(v, ALLOWED_VARIANTS, 'inset')\n this.requestUpdate('variant', old)\n }\n private _variant: 'inset' | 'raised' = 'inset'\n\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n\n @state() private _value = ''\n @state() private _indicatorReady = false\n @state() private _settling = false\n @state() private _pressed = false\n @state() private _isDragging = false\n\n private _dragGestureHandle: DragGestureHandle | null = null\n /*\n * 飞行令牌 + 世代号(与 web-ui-theme 的 View Transition 飞行门同构)。\n *\n * 缺陷形态:指示器的 left / width 带着 160ms 过渡,而快速连点会连着改 value。若每次改值\n * 都照常起一段过渡,第二段过渡要从**第一段的插值中途**重新起步——指示器于是永远慢半拍,\n * 连点结束时还要再等一整轮才停到终值,与「已经选到第几项」对不上。\n *\n * 门的作用:上一段移动还在飞行时到达的新值**直接落定**——不排队、不重启插值。\n * 落定这一趟自己也要占一段飞行窗口,否则第三次连点又会在落定途中起一段新过渡。\n * 世代号用来丢弃过期回调:窗口到期时若已经有更新的飞行在跑(快速连点会连开窗口),\n * 旧定时器只能提前退出,否则它会把新一轮的落定状态一并清掉、门形同虚设。\n */\n private _settleFlight: object | null = null\n private _settleRequest = 0\n private _settleTimer: number | undefined\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = null\n clearTimeout(this._settleTimer)\n this._settleTimer = undefined\n }\n\n private readonly _groupController = new GroupController(\n this,\n defineGroupCoordinator<WebUiSegmentedTrigger, string>({\n host: this,\n getItems: () => [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')],\n getValue: () => this._value,\n setValue: value => {\n this.value = value\n },\n getDisabled: () => this._isDisabled,\n isItem: (target): target is WebUiSegmentedTrigger =>\n target instanceof HTMLElement && target.matches('web-ui-segmented-trigger'),\n isItemSelected: (trigger, value) => trigger.value === value,\n getNextValue: (trigger, value) => (trigger.checked ? trigger.value : value),\n valuesEqual: (a, b) => a === b,\n copyValue: value => value,\n setItemSelected: (trigger, selected) => {\n trigger.checked = selected\n },\n dispatchValueChange: () => {\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n }).make(),\n { afterSync: () => requestAnimationFrame(() => void this._updateIndicator()) }\n )\n\n get value(): string {\n return this._value\n }\n\n set value(v: string) {\n const old = this._value\n this._value = v\n this._formAssociation.sync()\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\n }\n\n private async _updateIndicator() {\n const triggers = this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')\n let left = 0\n let width = 0\n\n triggers.forEach(trigger => {\n if (trigger.value === this._value) {\n const triggerRect = trigger.getBoundingClientRect()\n const groupRect = this.getBoundingClientRect()\n left = triggerRect.left - groupRect.left\n width = triggerRect.width\n }\n })\n\n // 上一段移动还在飞行 → 这次直接落定(_settling 关掉 left / width 过渡,见 style.css)。\n // 落定这一趟自己也要占飞行窗口,所以放在写定位**之前**开窗:窗口一开,第三次连点\n // 落到的仍是本趟的终值,而不是一个刚起步的插值。\n //\n // 首帧定位不开窗:那是初始化而不是一次「移动」,没有前一段飞行可言。开了窗反而会让\n // 「挂载后 160ms 内的第一次点击」直接落定——那次点击本该是用户看到的第一段动画。\n const landing = this._indicatorReady ? this._openSettleFlight() : false\n\n /*\n * 落定这一趟必须等 `.is-settling` 真的进了 DOM 再写定位。\n *\n * `_settling` 是 Lit 的 reactive state:`classMap` 要等一次异步更新才落到元素上,而\n * `--indicator-left` 是同步写的内联样式。顺序反了的话就是「先改位置、过渡仍开着、\n * 下一帧才补上关过渡的 class」——浏览器已经按插值起跑,异步补上的 class 只是把一段\n * 插值中途掐掉,落定表现为一次跳变而不是直接落定,且掐在哪一帧取决于调度。\n */\n if (landing) await this.updateComplete\n\n this.style.setProperty('--indicator-left', `${left}px`)\n this.style.setProperty('--indicator-width', `${width}px`)\n\n // 首帧只完成定位:先把当前定位以「未启用 left/width transition」状态提交为 before 值,\n // 再打开移动动画。若同一趟里 set 定位与启用 transition,浏览器会把 0→选项 当作一次过渡。\n if (!this._indicatorReady) {\n const indicator = this.renderRoot.querySelector<HTMLElement>('.wui-segmented-indicator')\n void indicator?.offsetWidth\n this._indicatorReady = true\n }\n }\n\n /*\n * 开一段飞行窗口:窗口内到达的改值一律落定,窗口到期才恢复插值过渡。\n *\n * 返回本次是否**落定**(飞行中到达的新值)。\n *\n * 时长取 `--wui-duration-trigger`(与 CSS 里 left / width 那两条过渡同一个值),所以\n * reduced-motion 下它就是 0ms——窗口立即到期,落定门自动退化成「每步都落定」,\n * 那正是 0ms 过渡本来的观感,不需要额外分支。\n *\n * 窗口每次改值都从零重开一整段时长(清掉旧定时器、世代号前进),而不是接着算剩余时长:\n * 剩余时长会让连续落定的窗口越缩越短,最后一次连点反倒拿到一段完整过渡——正是这个门\n * 要消除的那种观感。\n */\n private _openSettleFlight(): boolean {\n const wasFlying = this._settleTimer !== undefined\n const flight = {}\n this._settleFlight = flight\n const request = ++this._settleRequest\n clearTimeout(this._settleTimer)\n\n const duration = triggerDuration(this)\n if (duration === 0) {\n // 没有飞行就没有门可守:直接清掉落定态,让后续改值照常走 CSS 的过渡判定\n //(此时该过渡本身就是 0ms)。\n this._settleTimer = undefined\n this._settleFlight = null\n this._settling = false\n return false\n }\n\n // 已经在飞行中 → 这一趟是落定,保持落定态;否则是正常起一段过渡,先退出落定态。\n this._settling = wasFlying\n this._settleTimer = setTimeout(() => {\n this._settleTimer = undefined\n // 世代号校验:窗口被后续改值重开过,旧回调不得清掉新一轮的落定态。\n if (this._settleRequest !== request || this._settleFlight !== flight) return\n this._settleFlight = null\n this._settling = false\n }, duration)\n return wasFlying\n }\n\n private handlePointerDown(e: PointerEvent) {\n if (this._isDisabled) return\n const triggers = [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')]\n const enabledTriggers = triggers.filter(t => !t.disabled)\n if (enabledTriggers.length === 0) return\n\n const activeTrigger = triggers.find(t => t.value === this._value)\n if (!activeTrigger || activeTrigger.disabled) return\n\n const activeTriggerRect = activeTrigger.getBoundingClientRect()\n const isPressedOnActive =\n e.clientX >= activeTriggerRect.left &&\n e.clientX <= activeTriggerRect.right &&\n e.clientY >= activeTriggerRect.top &&\n e.clientY <= activeTriggerRect.bottom\n\n if (!isPressedOnActive) return\n\n this._pressed = true\n\n const groupRect = this.getBoundingClientRect()\n const initialTriggerRect = activeTrigger.getBoundingClientRect()\n const initialLeft = initialTriggerRect.left - groupRect.left\n const initialWidth = initialTriggerRect.width\n\n const firstTriggerRect = triggers[0].getBoundingClientRect()\n const lastTriggerRect = triggers[triggers.length - 1].getBoundingClientRect()\n const minLeft = firstTriggerRect.left - groupRect.left\n const maxLeft = lastTriggerRect.right - groupRect.left - initialWidth\n\n const enabledCenters = enabledTriggers.map(t => {\n const r = t.getBoundingClientRect()\n return r.left - groupRect.left + r.width / 2\n })\n\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = attachDragGesture(e, {\n axis: 'x',\n threshold: 6,\n onMove: info => {\n this._isDragging = true\n const currentLeft = clamp(initialLeft + info.deltaX, minLeft, maxLeft)\n this.style.setProperty('--indicator-left', `${currentLeft}px`)\n this.style.setProperty('--indicator-width', `${initialWidth}px`)\n },\n onEnd: info => {\n const wasDragging = this._isDragging\n this._isDragging = false\n this._pressed = false\n\n if (wasDragging) {\n const currentLeft = clamp(initialLeft + info.deltaX, minLeft, maxLeft)\n const currentCenter = currentLeft + initialWidth / 2\n\n let targetTrigger = activeTrigger\n if (info.velocityX > 300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx !== -1 && currentIdx < enabledTriggers.length - 1) {\n targetTrigger = enabledTriggers[currentIdx + 1]\n } else {\n targetTrigger = enabledTriggers[enabledTriggers.length - 1]\n }\n } else if (info.velocityX < -300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx > 0) {\n targetTrigger = enabledTriggers[currentIdx - 1]\n } else {\n targetTrigger = enabledTriggers[0]\n }\n } else {\n const nearestIdx = snapToNearest(currentCenter, enabledCenters)\n if (nearestIdx !== -1 && enabledTriggers[nearestIdx]) {\n targetTrigger = enabledTriggers[nearestIdx]\n }\n }\n\n if (targetTrigger.value !== this._value) {\n this.value = targetTrigger.value\n this._groupController.sync()\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n } else {\n void this._updateIndicator()\n }\n }\n this.requestUpdate()\n },\n onCancel: () => {\n this._isDragging = false\n this._pressed = false\n void this._updateIndicator()\n this.requestUpdate()\n }\n })\n }\n\n private handlePointerUp() {\n this._pressed = false\n }\n\n private handlePointerLeave() {\n if (!this._dragGestureHandle?.isDragging()) {\n this._pressed = false\n }\n }\n\n private readonly _formAssociation = defineFormAssociation<string>({\n host: this,\n initialize: () => {\n const attrValue = this.getAttribute('value')\n if (attrValue !== null && this._value === '') this._value = attrValue\n },\n getState: () => this._value,\n setState: value => {\n this.value = value\n },\n getFormValue: () => (this.name && this._value ? this._value : null),\n getFormState: () => this._value,\n restoreState: state => {\n if (typeof state === 'string') this.value = state\n }\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n override formDisabledCallback(disabled: boolean) {\n this._formAssociation.setDisabled(disabled)\n this._groupController.sync()\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n 'wui-glass': true,\n 'wui-segmented': true,\n 'is-disabled': this._isDisabled,\n 'is-pressed': this._pressed,\n 'is-dragging': this._isDragging,\n 'is-indicator-ready': this._indicatorReady,\n 'is-settling': this._settling\n })}\n role=\"listbox\"\n aria-orientation=\"horizontal\"\n @pointerdown=${this.handlePointerDown}\n @pointerup=${this.handlePointerUp}\n @pointercancel=${this.handlePointerUp}\n @pointerleave=${this.handlePointerLeave}\n >\n <span class=\"wui-glass wui-segmented-indicator\"></span>\n <slot></slot>\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-segmented': WebUiSegmented\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/segmented/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 glass from '@/assets/glass.css?inline'\nimport { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, snapToNearest } from '@/shared/gesture/physics'\nimport { defineGroupCoordinator, GroupController } from '@/shared/group-management'\nimport { normalizeLiteral } from '@/shared/normalize'\nimport { parseDuration } from '@/shared/theme/duration'\n\nimport type { WebUiSegmentedTrigger } from '../segmented-trigger'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\nconst ALLOWED_VARIANTS = ['inset', 'raised'] as const\n\n/*\n * 指示器移动时长取 `--wui-duration-trigger`,与 CSS 里 left / width 那两条 transition 同一个值。\n * 读不到 token 或格式不符时兜底 160(CSS 的 fallback 同值),负值钳到 0。\n *\n * reduced-motion 下不需要额外分支:theme 已把该 token 归零,settle 窗口随之变成 0,\n * 落定门自动退化成「每一步都直接落定」,而那本来就是 0ms 过渡的观感。\n */\nfunction triggerDuration(el: HTMLElement): number {\n const parsed = parseDuration(getComputedStyle(el).getPropertyValue('--wui-duration-trigger'))\n return parsed === null ? 160 : Math.max(0, parsed)\n}\n\n@customElement('web-ui-segmented')\nexport class WebUiSegmented extends FormAssociated(LitElement) {\n // 轨道是不透明实体面:底色取 surface(浅色即 page,深色即 surface-raised 档)、无\n // backdrop blur,描边环与投影仍由\n // .wui-glass 提供且全状态同值;指示器恒挂同一配方,静止态由 surface-segmented 实色\n // 盖住玻璃输出,按压与拖拽态才透出玻璃。\n // variant=\"raised\" 切回经典形态:flat 灰轨道(surface-segmented、无环无投影)+\n // 实体白指示器(surface-selected + 柔投影),按压/拖拽态两变体同为透明玻璃;\n // 视觉差异全部由 :host([variant=...]) 规则承载,见 style.css。\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n @property({ type: String, reflect: true }) name = ''\n\n @property({ type: String, reflect: true })\n get variant(): 'inset' | 'raised' {\n return this._variant\n }\n set variant(v: string) {\n const old = this._variant\n this._variant = normalizeLiteral(v, ALLOWED_VARIANTS, 'inset')\n this.requestUpdate('variant', old)\n }\n private _variant: 'inset' | 'raised' = 'inset'\n\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) required = false\n\n @state() private _value = ''\n @state() private _indicatorReady = false\n @state() private _settling = false\n @state() private _pressed = false\n @state() private _isDragging = false\n\n private _dragGestureHandle: DragGestureHandle | null = null\n /*\n * 飞行令牌 + 世代号(与 web-ui-theme 的 View Transition 飞行门同构)。\n *\n * 缺陷形态:指示器的 left / width 带着 160ms 过渡,而快速连点会连着改 value。若每次改值\n * 都照常起一段过渡,第二段过渡要从**第一段的插值中途**重新起步——指示器于是永远慢半拍,\n * 连点结束时还要再等一整轮才停到终值,与「已经选到第几项」对不上。\n *\n * 门的作用:上一段移动还在飞行时到达的新值**直接落定**——不排队、不重启插值。\n * 落定这一趟自己也要占一段飞行窗口,否则第三次连点又会在落定途中起一段新过渡。\n * 世代号用来丢弃过期回调:窗口到期时若已经有更新的飞行在跑(快速连点会连开窗口),\n * 旧定时器只能提前退出,否则它会把新一轮的落定状态一并清掉、门形同虚设。\n */\n private _settleFlight: object | null = null\n private _settleRequest = 0\n private _settleTimer: number | undefined\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = null\n clearTimeout(this._settleTimer)\n this._settleTimer = undefined\n }\n\n private readonly _groupController = new GroupController(\n this,\n defineGroupCoordinator<WebUiSegmentedTrigger, string>({\n host: this,\n getItems: () => [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')],\n getValue: () => this._value,\n setValue: value => {\n this.value = value\n },\n getDisabled: () => this._isDisabled,\n isItem: (target): target is WebUiSegmentedTrigger =>\n target instanceof HTMLElement && target.matches('web-ui-segmented-trigger'),\n isItemSelected: (trigger, value) => trigger.value === value,\n getNextValue: (trigger, value) => (trigger.checked ? trigger.value : value),\n valuesEqual: (a, b) => a === b,\n copyValue: value => value,\n setItemSelected: (trigger, selected) => {\n trigger.checked = selected\n },\n dispatchValueChange: () => {\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n }).make(),\n { afterSync: () => requestAnimationFrame(() => void this._updateIndicator()) }\n )\n\n get value(): string {\n return this._value\n }\n\n set value(v: string) {\n const old = this._value\n this._value = v\n this._formAssociation.sync()\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\n }\n\n private async _updateIndicator() {\n const triggers = this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')\n let left = 0\n let width = 0\n\n triggers.forEach(trigger => {\n if (trigger.value === this._value) {\n const triggerRect = trigger.getBoundingClientRect()\n const groupRect = this.getBoundingClientRect()\n left = triggerRect.left - groupRect.left\n width = triggerRect.width\n }\n })\n\n // 上一段移动还在飞行 → 这次直接落定(_settling 关掉 left / width 过渡,见 style.css)。\n // 落定这一趟自己也要占飞行窗口,所以放在写定位**之前**开窗:窗口一开,第三次连点\n // 落到的仍是本趟的终值,而不是一个刚起步的插值。\n //\n // 首帧定位不开窗:那是初始化而不是一次「移动」,没有前一段飞行可言。开了窗反而会让\n // 「挂载后 160ms 内的第一次点击」直接落定——那次点击本该是用户看到的第一段动画。\n const landing = this._indicatorReady ? this._openSettleFlight() : false\n\n /*\n * 落定这一趟必须等 `.is-settling` 真的进了 DOM 再写定位。\n *\n * `_settling` 是 Lit 的 reactive state:`classMap` 要等一次异步更新才落到元素上,而\n * `--indicator-left` 是同步写的内联样式。顺序反了的话就是「先改位置、过渡仍开着、\n * 下一帧才补上关过渡的 class」——浏览器已经按插值起跑,异步补上的 class 只是把一段\n * 插值中途掐掉,落定表现为一次跳变而不是直接落定,且掐在哪一帧取决于调度。\n */\n if (landing) await this.updateComplete\n\n this.style.setProperty('--indicator-left', `${left}px`)\n this.style.setProperty('--indicator-width', `${width}px`)\n\n // 首帧只完成定位:先把当前定位以「未启用 left/width transition」状态提交为 before 值,\n // 再打开移动动画。若同一趟里 set 定位与启用 transition,浏览器会把 0→选项 当作一次过渡。\n if (!this._indicatorReady) {\n const indicator = this.renderRoot.querySelector<HTMLElement>('.wui-segmented-indicator')\n void indicator?.offsetWidth\n this._indicatorReady = true\n }\n }\n\n /*\n * 开一段飞行窗口:窗口内到达的改值一律落定,窗口到期才恢复插值过渡。\n *\n * 返回本次是否**落定**(飞行中到达的新值)。\n *\n * 时长取 `--wui-duration-trigger`(与 CSS 里 left / width 那两条过渡同一个值),所以\n * reduced-motion 下它就是 0ms——窗口立即到期,落定门自动退化成「每步都落定」,\n * 那正是 0ms 过渡本来的观感,不需要额外分支。\n *\n * 窗口每次改值都从零重开一整段时长(清掉旧定时器、世代号前进),而不是接着算剩余时长:\n * 剩余时长会让连续落定的窗口越缩越短,最后一次连点反倒拿到一段完整过渡——正是这个门\n * 要消除的那种观感。\n */\n private _openSettleFlight(): boolean {\n const wasFlying = this._settleTimer !== undefined\n const flight = {}\n this._settleFlight = flight\n const request = ++this._settleRequest\n clearTimeout(this._settleTimer)\n\n const duration = triggerDuration(this)\n if (duration === 0) {\n // 没有飞行就没有门可守:直接清掉落定态,让后续改值照常走 CSS 的过渡判定\n //(此时该过渡本身就是 0ms)。\n this._settleTimer = undefined\n this._settleFlight = null\n this._settling = false\n return false\n }\n\n // 已经在飞行中 → 这一趟是落定,保持落定态;否则是正常起一段过渡,先退出落定态。\n this._settling = wasFlying\n this._settleTimer = setTimeout(() => {\n this._settleTimer = undefined\n // 世代号校验:窗口被后续改值重开过,旧回调不得清掉新一轮的落定态。\n if (this._settleRequest !== request || this._settleFlight !== flight) return\n this._settleFlight = null\n this._settling = false\n }, duration)\n return wasFlying\n }\n\n private handlePointerDown(e: PointerEvent) {\n if (this._isDisabled) return\n const triggers = [...this.querySelectorAll<WebUiSegmentedTrigger>('web-ui-segmented-trigger')]\n const enabledTriggers = triggers.filter(t => !t.disabled)\n if (enabledTriggers.length === 0) return\n\n const activeTrigger = triggers.find(t => t.value === this._value)\n if (!activeTrigger || activeTrigger.disabled) return\n\n const activeTriggerRect = activeTrigger.getBoundingClientRect()\n const isPressedOnActive =\n e.clientX >= activeTriggerRect.left &&\n e.clientX <= activeTriggerRect.right &&\n e.clientY >= activeTriggerRect.top &&\n e.clientY <= activeTriggerRect.bottom\n\n if (!isPressedOnActive) return\n\n this._pressed = true\n\n const groupRect = this.getBoundingClientRect()\n const initialTriggerRect = activeTrigger.getBoundingClientRect()\n const initialLeft = initialTriggerRect.left - groupRect.left\n const initialWidth = initialTriggerRect.width\n // 拇指中心跟手:left 与宽度分开写(宽度取 hover 项的),中心才是稳定的那个量——\n // 宽度一变,center = left + width/2 就会漂,用它去选吸附目标会跟着抖。\n const initialCenter = initialLeft + initialWidth / 2\n\n const firstTriggerRect = triggers[0].getBoundingClientRect()\n const lastTriggerRect = triggers[triggers.length - 1].getBoundingClientRect()\n const minLeft = firstTriggerRect.left - groupRect.left\n const trackRight = lastTriggerRect.right - groupRect.left\n\n const enabledSlots = enabledTriggers.map(t => {\n const r = t.getBoundingClientRect()\n return { center: r.left - groupRect.left + r.width / 2, width: r.width }\n })\n const enabledCenters = enabledSlots.map(slot => slot.center)\n\n /*\n * 某一帧的拇指几何。\n *\n * 宽度跟随当前 hover 的可用项(#222):trigger 宽度不等是常态(interweave 设置\n * dialog 顶部即此形),宽度恒等于按下那一项会让拇指与它滑过的那项始终对不齐。\n * 取「离拇指中心最近的可用项」而不是「离指针最近的项」:松手吸附用的是同一个判据,\n * 于是拖拽中预览到的宽度就是松手会落到的那一项,不会在松手时二次变形。\n *\n * 宽度变了之后 maxLeft 必须跟着换算(`trackRight − width`),否则更宽的拇指会被\n * 钳在按初始宽度算出的位置上,从轨道右端探出去。\n *\n * 等宽时 width 恒为 initialWidth,`initialCenter + deltaX − initialWidth/2` 恒等于\n * `initialLeft + deltaX`,这一整套与改动前的逐字行为一致。\n */\n const frameAt = (deltaX: number) => {\n const center = initialCenter + deltaX\n const nearest = snapToNearest(center, enabledCenters)\n const width = nearest === -1 ? initialWidth : (enabledSlots[nearest]?.width ?? initialWidth)\n const left = clamp(center - width / 2, minLeft, trackRight - width)\n return { left, width, center: left + width / 2 }\n }\n\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = attachDragGesture(e, {\n axis: 'x',\n threshold: 6,\n onMove: info => {\n this._isDragging = true\n const { left, width } = frameAt(info.deltaX)\n this.style.setProperty('--indicator-left', `${left}px`)\n this.style.setProperty('--indicator-width', `${width}px`)\n },\n onEnd: info => {\n const wasDragging = this._isDragging\n this._isDragging = false\n this._pressed = false\n\n if (wasDragging) {\n const currentCenter = frameAt(info.deltaX).center\n\n let targetTrigger = activeTrigger\n if (info.velocityX > 300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx !== -1 && currentIdx < enabledTriggers.length - 1) {\n targetTrigger = enabledTriggers[currentIdx + 1]\n } else {\n targetTrigger = enabledTriggers[enabledTriggers.length - 1]\n }\n } else if (info.velocityX < -300) {\n const currentIdx = enabledTriggers.indexOf(activeTrigger)\n if (currentIdx > 0) {\n targetTrigger = enabledTriggers[currentIdx - 1]\n } else {\n targetTrigger = enabledTriggers[0]\n }\n } else {\n const nearestIdx = snapToNearest(currentCenter, enabledCenters)\n if (nearestIdx !== -1 && enabledTriggers[nearestIdx]) {\n targetTrigger = enabledTriggers[nearestIdx]\n }\n }\n\n if (targetTrigger.value !== this._value) {\n this.value = targetTrigger.value\n this._groupController.sync()\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n } else {\n void this._updateIndicator()\n }\n }\n this.requestUpdate()\n },\n onCancel: () => {\n this._isDragging = false\n this._pressed = false\n void this._updateIndicator()\n this.requestUpdate()\n }\n })\n }\n\n private handlePointerUp() {\n this._pressed = false\n }\n\n private handlePointerLeave() {\n if (!this._dragGestureHandle?.isDragging()) {\n this._pressed = false\n }\n }\n\n private readonly _formAssociation = defineFormAssociation<string>({\n host: this,\n initialize: () => {\n const attrValue = this.getAttribute('value')\n if (attrValue !== null && this._value === '') this._value = attrValue\n },\n getState: () => this._value,\n setState: value => {\n this.value = value\n },\n getFormValue: () => (this.name && this._value ? this._value : null),\n getFormState: () => this._value,\n restoreState: state => {\n if (typeof state === 'string') this.value = state\n }\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n override formDisabledCallback(disabled: boolean) {\n this._formAssociation.setDisabled(disabled)\n this._groupController.sync()\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n 'wui-glass': true,\n 'wui-segmented': true,\n 'is-disabled': this._isDisabled,\n 'is-pressed': this._pressed,\n 'is-dragging': this._isDragging,\n 'is-indicator-ready': this._indicatorReady,\n 'is-settling': this._settling\n })}\n role=\"listbox\"\n aria-orientation=\"horizontal\"\n @pointerdown=${this.handlePointerDown}\n @pointerup=${this.handlePointerUp}\n @pointercancel=${this.handlePointerUp}\n @pointerleave=${this.handlePointerLeave}\n >\n <span class=\"wui-glass wui-segmented-indicator\"></span>\n <slot></slot>\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-segmented': WebUiSegmented\n }\n}\n"],"mappings":"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"}
|
|
@@ -5,22 +5,23 @@ import n from "../../icons/generated/lucide-chevron-down.js";
|
|
|
5
5
|
import { installPointerFocusSuppression as r } from "../../shared/focus/pointer-focus.js";
|
|
6
6
|
import { FormAssociated as i, FormAssociationController as a, defineFormAssociation as o } from "../../shared/form-association/index.js";
|
|
7
7
|
import s from "../../assets/overlay-motion.js";
|
|
8
|
-
import
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import y from "
|
|
16
|
-
import
|
|
17
|
-
import {
|
|
8
|
+
import c from "../../scrollbars/internal.js";
|
|
9
|
+
import { dispatchOpenChangeEvent as l } from "../../shared/open-state/index.js";
|
|
10
|
+
import { createComboboxOpenController as u, createOptionListenerBinding as d, handleComboboxFocusOut as f, nextWrappingIndex as p } from "../../shared/option-portal/combobox-shell.js";
|
|
11
|
+
import { defineOptionPortal as m } from "../../shared/option-portal/index.js";
|
|
12
|
+
import { defineAnchoredPanel as h } from "../../shared/overlay/anchored-panel.js";
|
|
13
|
+
import { defineOpenOverlay as g } from "../../shared/overlay/open-overlay.js";
|
|
14
|
+
import { applyOverlayVariables as _, defineOverlayPortal as v } from "../../shared/overlay/portal.js";
|
|
15
|
+
import { defineScrollLockLease as y } from "../../shared/scroll-lock/scroll-lock.js";
|
|
16
|
+
import b from "./style.js";
|
|
17
|
+
import { LitElement as x, html as S, nothing as C, unsafeCSS as w } from "lit";
|
|
18
|
+
import { customElement as T, property as E, state as D } from "lit/decorators.js";
|
|
18
19
|
//#region src/components/select/index.ts
|
|
19
|
-
var
|
|
20
|
+
var O;
|
|
20
21
|
r();
|
|
21
|
-
var
|
|
22
|
+
var k = class extends i(x) {
|
|
22
23
|
static {
|
|
23
|
-
|
|
24
|
+
O = this;
|
|
24
25
|
}
|
|
25
26
|
constructor(...e) {
|
|
26
27
|
super(...e), this.placeholder = "", this.disabled = !1, this.required = !1, this.portal = !1, this.noScrollLock = !1, this.name = "", this._value = "", this._formAssociation = o({
|
|
@@ -39,9 +40,9 @@ var O = class extends i(b) {
|
|
|
39
40
|
typeof e == "string" && (this.value = e);
|
|
40
41
|
},
|
|
41
42
|
syncValidity: () => this._syncValidity()
|
|
42
|
-
}).make(), this._formAssociationController = new a(this, this._formAssociation), this._isOpen = !1, this._activeIndex = -1, this._selectedLabel = "", this._hasTriggerSlot = !1, this._options = [], this._scrollLock =
|
|
43
|
+
}).make(), this._formAssociationController = new a(this, this._formAssociation), this._isOpen = !1, this._activeIndex = -1, this._selectedLabel = "", this._hasTriggerSlot = !1, this._options = [], this._scrollLock = y().make(), this._optionPortal = m().make({
|
|
43
44
|
element: this,
|
|
44
|
-
idPrefix: `web-ui-select-${++
|
|
45
|
+
idPrefix: `web-ui-select-${++O._nextInstanceId}`,
|
|
45
46
|
getPortal: () => this._portal,
|
|
46
47
|
getPortalContent: () => this._portalContent,
|
|
47
48
|
isOpen: () => this.portal && this._isOpen,
|
|
@@ -53,10 +54,10 @@ var O = class extends i(b) {
|
|
|
53
54
|
onImmediateSync: () => {
|
|
54
55
|
this._refreshOptions(), this._syncSelected(), this._syncActiveOption();
|
|
55
56
|
}
|
|
56
|
-
}), this._overlay =
|
|
57
|
+
}), this._overlay = g().make({
|
|
57
58
|
requestClose: () => this._close(),
|
|
58
59
|
isConnected: () => this.isConnected
|
|
59
|
-
}), this._panel =
|
|
60
|
+
}), this._panel = h().make({
|
|
60
61
|
getAnchor: () => this.shadowRoot?.querySelector(".select-trigger") ?? null,
|
|
61
62
|
getLocalPanel: () => this.shadowRoot?.querySelector(".select-overlay") ?? null,
|
|
62
63
|
getPositioning: () => ({
|
|
@@ -72,11 +73,11 @@ var O = class extends i(b) {
|
|
|
72
73
|
let t = e.composedPath().includes(this) || !!this._panel.getHandle()?.containsEvent(e);
|
|
73
74
|
this._isOpen && !t && this._close();
|
|
74
75
|
}, this._onFocusOut = () => {
|
|
75
|
-
|
|
76
|
+
f(this, () => this._panel.getHandle(), () => this._isOpen, () => this._close());
|
|
76
77
|
}, this._onTriggerSlotChange = (e) => {
|
|
77
78
|
let t = e.target.assignedElements().length > 0;
|
|
78
79
|
this._hasTriggerSlot !== t && (this._hasTriggerSlot = t, this._reconfigureOverlay());
|
|
79
|
-
}, this._optionListeners =
|
|
80
|
+
}, this._optionListeners = d({
|
|
80
81
|
onClick: (e) => this._handleOptionClick(e),
|
|
81
82
|
onPointerOver: (e) => this._handleOptionPointerOver(e),
|
|
82
83
|
onPointerDown: (e) => this._handleOptionPointerDown(e),
|
|
@@ -106,7 +107,7 @@ var O = class extends i(b) {
|
|
|
106
107
|
t && this._isLive(t) && !t.disabled && (this.value = t.value, this._notifyValueChange()), this._close(), e.preventDefault();
|
|
107
108
|
}
|
|
108
109
|
}
|
|
109
|
-
}, this._openController =
|
|
110
|
+
}, this._openController = u({
|
|
110
111
|
canOpen: () => !this._isDisabled,
|
|
111
112
|
getIsOpen: () => this._isOpen,
|
|
112
113
|
setIsOpen: (e) => {
|
|
@@ -127,9 +128,10 @@ var O = class extends i(b) {
|
|
|
127
128
|
}
|
|
128
129
|
static {
|
|
129
130
|
this.styles = [
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
131
|
+
w(t),
|
|
132
|
+
w(s),
|
|
133
|
+
w(c),
|
|
134
|
+
w(b)
|
|
133
135
|
];
|
|
134
136
|
}
|
|
135
137
|
get value() {
|
|
@@ -199,7 +201,7 @@ var O = class extends i(b) {
|
|
|
199
201
|
_navigateActive(e) {
|
|
200
202
|
let t = this._options.filter((e) => !e.disabled && this._isLive(e));
|
|
201
203
|
if (!t.length) return;
|
|
202
|
-
let n = this._options.find((e) => e.value === this.value && !e.disabled && this._isLive(e)), r = this._activeIndex >= 0 && this._isLive(this._options[this._activeIndex]) ? t.indexOf(this._options[this._activeIndex]) : n ? t.indexOf(n) : e > 0 ? -1 : 0, i = t[
|
|
204
|
+
let n = this._options.find((e) => e.value === this.value && !e.disabled && this._isLive(e)), r = this._activeIndex >= 0 && this._isLive(this._options[this._activeIndex]) ? t.indexOf(this._options[this._activeIndex]) : n ? t.indexOf(n) : e > 0 ? -1 : 0, i = t[p(t.length, r, e)];
|
|
203
205
|
this._activeIndex = this._options.indexOf(i), this._syncActiveOption();
|
|
204
206
|
}
|
|
205
207
|
_open(e = !1) {
|
|
@@ -209,7 +211,7 @@ var O = class extends i(b) {
|
|
|
209
211
|
this._openController.close();
|
|
210
212
|
}
|
|
211
213
|
_dispatchOpenChange() {
|
|
212
|
-
|
|
214
|
+
l(this, this._isOpen);
|
|
213
215
|
}
|
|
214
216
|
_setInitialActiveOption() {
|
|
215
217
|
let e = this._options.findIndex((e) => e.value === this.value && !e.disabled && this._isLive(e)), t = this._options.findIndex((e) => !e.disabled && this._isLive(e));
|
|
@@ -237,20 +239,20 @@ var O = class extends i(b) {
|
|
|
237
239
|
this._panel.open(e), this._syncOverlayInert();
|
|
238
240
|
}
|
|
239
241
|
_createPortal() {
|
|
240
|
-
let e =
|
|
242
|
+
let e = v().make({
|
|
241
243
|
container: this.overlayContainer,
|
|
242
244
|
target: this,
|
|
243
|
-
style: `${t}\n${s}\n${
|
|
245
|
+
style: `${t}\n${s}\n${b}`,
|
|
244
246
|
className: "wui-glass select-overlay portal wui-floating-panel",
|
|
245
247
|
onContentChange: () => this._optionPortal.scheduleRefresh()
|
|
246
248
|
});
|
|
247
|
-
this._portal = e,
|
|
249
|
+
this._portal = e, _(e.panel, this, [
|
|
248
250
|
"--wui-overlay-min-width",
|
|
249
251
|
"--wui-select-max-width",
|
|
250
252
|
"--wui-select-max-height"
|
|
251
253
|
]), e.panel.setAttribute("role", "listbox");
|
|
252
254
|
let n = document.createElement("div");
|
|
253
|
-
n.className = "select-scroll";
|
|
255
|
+
n.className = "select-scroll wui-scroll";
|
|
254
256
|
let r = document.createElement("div");
|
|
255
257
|
return r.className = "select-content", this._portalContent = r, n.append(r), e.panel.append(n), e.moveContent(Array.from(this.children).filter((e) => e.slot !== "trigger"), r), e;
|
|
256
258
|
}
|
|
@@ -261,8 +263,8 @@ var O = class extends i(b) {
|
|
|
261
263
|
await this._panel.close(() => this._isOpen) && (this._portal = void 0, this._portalContent = void 0);
|
|
262
264
|
}
|
|
263
265
|
render() {
|
|
264
|
-
let e = `${this.localName}-listbox`, t = !this.portal && this._isOpen && this._activeIndex >= 0 ? this._options[this._activeIndex]?.id ??
|
|
265
|
-
return
|
|
266
|
+
let e = `${this.localName}-listbox`, t = !this.portal && this._isOpen && this._activeIndex >= 0 ? this._options[this._activeIndex]?.id ?? C : C;
|
|
267
|
+
return S`
|
|
266
268
|
<div class="wui-select-inner">
|
|
267
269
|
<div
|
|
268
270
|
class="wui-glass select-trigger"
|
|
@@ -272,16 +274,16 @@ var O = class extends i(b) {
|
|
|
272
274
|
role="combobox"
|
|
273
275
|
aria-expanded=${this._isOpen}
|
|
274
276
|
aria-haspopup="listbox"
|
|
275
|
-
aria-controls=${this.portal ?
|
|
277
|
+
aria-controls=${this.portal ? C : e}
|
|
276
278
|
aria-disabled=${String(this._isDisabled)}
|
|
277
279
|
aria-activedescendant=${t}
|
|
278
280
|
>
|
|
279
281
|
<slot name="trigger" @slotchange=${this._onTriggerSlotChange}></slot>
|
|
280
|
-
${this._hasTriggerSlot ?
|
|
282
|
+
${this._hasTriggerSlot ? C : S`<span class="label">${this._selectedLabel}</span>`}
|
|
281
283
|
<web-ui-icon class="arrow" .icon=${n}></web-ui-icon>
|
|
282
284
|
</div>
|
|
283
285
|
<div class="select-overlay wui-floating-panel wui-glass" hidden role="listbox" id=${e}>
|
|
284
|
-
<div class="select-scroll">
|
|
286
|
+
<div class="select-scroll wui-scroll">
|
|
285
287
|
<div class="select-content">
|
|
286
288
|
<slot @slotchange=${this._onSlotChange}></slot>
|
|
287
289
|
</div>
|
|
@@ -291,30 +293,30 @@ var O = class extends i(b) {
|
|
|
291
293
|
`;
|
|
292
294
|
}
|
|
293
295
|
};
|
|
294
|
-
e([
|
|
296
|
+
e([E({
|
|
295
297
|
type: String,
|
|
296
298
|
reflect: !0
|
|
297
|
-
})],
|
|
299
|
+
})], k.prototype, "placeholder", void 0), e([E({
|
|
298
300
|
type: Boolean,
|
|
299
301
|
reflect: !0
|
|
300
|
-
})],
|
|
302
|
+
})], k.prototype, "disabled", void 0), e([E({
|
|
301
303
|
type: Boolean,
|
|
302
304
|
reflect: !0
|
|
303
|
-
})],
|
|
305
|
+
})], k.prototype, "required", void 0), e([E({
|
|
304
306
|
type: Boolean,
|
|
305
307
|
reflect: !0
|
|
306
|
-
})],
|
|
308
|
+
})], k.prototype, "portal", void 0), e([E({
|
|
307
309
|
type: Boolean,
|
|
308
310
|
reflect: !0,
|
|
309
311
|
attribute: "no-scroll-lock"
|
|
310
|
-
})],
|
|
312
|
+
})], k.prototype, "noScrollLock", void 0), e([E({ attribute: !1 })], k.prototype, "overlayContainer", void 0), e([E({
|
|
311
313
|
type: String,
|
|
312
314
|
reflect: !0
|
|
313
|
-
})],
|
|
315
|
+
})], k.prototype, "name", void 0), e([D()], k.prototype, "_value", void 0), e([E({
|
|
314
316
|
type: String,
|
|
315
317
|
reflect: !0
|
|
316
|
-
})],
|
|
318
|
+
})], k.prototype, "value", null), e([D()], k.prototype, "_isOpen", void 0), e([D()], k.prototype, "_activeIndex", void 0), e([D()], k.prototype, "_selectedLabel", void 0), e([D()], k.prototype, "_hasTriggerSlot", void 0), k = O = e([T("web-ui-select")], k);
|
|
317
319
|
//#endregion
|
|
318
|
-
export {
|
|
320
|
+
export { k as WebUiSelect };
|
|
319
321
|
|
|
320
322
|
//# sourceMappingURL=index.js.map
|
|
@@ -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 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 { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { dispatchOpenChangeEvent } from '@/shared/open-state'\nimport {\n createComboboxOpenController,\n createOptionListenerBinding,\n defineOptionPortal,\n handleComboboxFocusOut,\n nextWrappingIndex\n} from '@/shared/option-portal'\nimport { defineAnchoredPanel } from '@/shared/overlay/anchored-panel'\nimport { defineOpenOverlay } from '@/shared/overlay/open-overlay'\nimport {\n applyOverlayVariables,\n defineOverlayPortal,\n type OverlayContainer,\n type OverlayPortal\n} from '@/shared/overlay/portal'\nimport { defineScrollLockLease } from '@/shared/scroll-lock/scroll-lock'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\n@customElement('web-ui-select')\nexport class WebUiSelect extends FormAssociated(LitElement) {\n static override styles = [unsafeCSS(glass), unsafeCSS(overlayMotion), unsafeCSS(style)]\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 // @property + reflect 让它与 input/textarea/slider/input-number 的 value 反射语义保持一致。\n @state() private _value = ''\n @property({ type: String, reflect: true })\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._formAssociation.sync()\n this.toggleAttribute('data-has-value', !!v)\n this.requestUpdate('value', old)\n }\n\n private readonly _formAssociation = defineFormAssociation<string>({\n host: this,\n initialize: () => {\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 },\n getState: () => this._value,\n setState: value => {\n this.value = value\n },\n getFormValue: () => this._value,\n getFormState: () => this._value,\n restoreState: state => {\n if (typeof state === 'string') this.value = state\n },\n syncValidity: () => this._syncValidity()\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\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 _portal?: OverlayPortal\n private _portalContent?: HTMLElement\n private readonly _scrollLock = defineScrollLockLease().make()\n\n private static _nextInstanceId = 0\n\n // option 注册表 / portal 同步 / 微任务调度收敛到 shared 模块(autocomplete 同款)\n private readonly _optionPortal = defineOptionPortal().make({\n element: this,\n // 实例级前缀保证多实例同时展开时 option id 不冲突(aria 引用按 id 定位)\n idPrefix: `web-ui-select-${++WebUiSelect._nextInstanceId}`,\n getPortal: () => this._portal,\n getPortalContent: () => this._portalContent,\n isOpen: () => this.portal && this._isOpen,\n getMigratableNodes: () => [...this.querySelectorAll<WebUiOption>('web-ui-option')],\n hasUpdated: () => this.hasUpdated,\n requestUpdate: () => this.requestUpdate(),\n bindOption: option => this._bindOption(option),\n unbindOption: option => this._unbindOption(option),\n onImmediateSync: () => {\n this._refreshOptions()\n this._syncSelected()\n this._syncActiveOption()\n }\n })\n /*\n * 开启态浮层承载「我开着吗」(issue #120 Block 1):本组件不再在 keydown 里自行关闭,\n * 只声明「我开着」。宿主级监听在 portal 模式下收不到面板内的 Escape,正是原实现的\n * 缺陷来源;改由唯一仲裁者在 document 捕获阶段判定最内层。\n *\n * 宿主接口除 requestClose 外只再提供一个 isConnected(仅供惰性回收读取):开启状态是\n * 声明而非询问,仲裁时不再回头问 isOpen()。\n */\n private readonly _overlay = defineOpenOverlay().make({\n requestClose: () => this._close(),\n isConnected: () => this.isConnected\n })\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: () => ({\n placement: 'bottom-start',\n offset: 4,\n // 面板宽度统一为 max(内容, trigger, --wui-overlay-min-width),内容自适应展开\n minAnchorWidth: true,\n strategy: this.portal ? 'fixed' : 'absolute'\n }),\n isPortal: () => this.portal,\n createPortal: () => this._createPortal(),\n openOverlay: this._overlay\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 // 在监听器内部判定:composedPath() 在派发结束后会被清空。\n const isInside = e.composedPath().includes(this) || !!this._panel.getHandle()?.containsEvent(e)\n if (this._isOpen && !isInside) {\n this._close()\n }\n }\n\n private _onFocusOut = () => {\n handleComboboxFocusOut(\n this,\n () => this._panel.getHandle(),\n () => this._isOpen,\n () => this._close()\n )\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this._optionPortal.bindHost()\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._optionPortal.dispose()\n this.removeEventListener('keydown', this._onKeydown)\n this.removeEventListener('focusout', this._onFocusOut)\n document.removeEventListener('click', this._onClickOutside)\n this._options.forEach(this._unbindOption)\n this._options = []\n this._portal = undefined\n this._portalContent = undefined\n this._close()\n // 撤销登记由 _panel.dispose() 完成(句柄归它持有),不再需要单独 dispose 仲裁者。\n this._panel.dispose()\n this._scrollLock.release()\n }\n\n override firstUpdated() {\n requestAnimationFrame(() => {\n if (this.isConnected) this._optionPortal.scheduleRefresh()\n })\n }\n\n override willUpdate() {\n this._refreshOptions()\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._syncOverlayInert()\n this._syncValidity()\n }\n\n private _syncValidity() {\n const internals = this._formAssociation.getInternals()\n if (!internals || typeof internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this.value) internals.setValidity({})\n else internals.setValidity({ valueMissing: true }, '请选择一项')\n }\n\n private _syncOpenAttribute() {\n this.toggleAttribute('open', this._isOpen)\n }\n\n /*\n * 禁用态不响应 Escape。仲裁者仍在(吞掉按键并压掉原生 cancel),只是不走关闭入口\n * —— 与旧的「跳过候选」语义不同:旧语义放任事件落到下层浮层,把外层一起关掉。\n * 每次渲染后同步即可覆盖 disabled 属性与表单禁用两条来源。\n */\n private _syncOverlayInert() {\n this._panel.getHandle()?.setInert(this._isDisabled)\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 readonly _optionListeners = createOptionListenerBinding({\n // 惰性解引用:handler 字段声明在后者仍可在调用期取到\n onClick: event => this._handleOptionClick(event),\n onPointerOver: event => this._handleOptionPointerOver(event),\n onPointerDown: event => this._handleOptionPointerDown(event),\n onUpdate: () => this._onOptionUpdate()\n })\n private _bindOption = (option: WebUiOption) => this._optionListeners.bind(option)\n private _unbindOption = (option: WebUiOption) => this._optionListeners.unbind(option)\n\n private _refreshOptions() {\n const activeOption = this._options[this._activeIndex]\n // diff 绑定/解绑与激活索引按 option 身份保持在 shared 内完成,\n // 避免移除中间项后激活静默偏移到相邻项\n const next = this._optionPortal.refresh(this._options, activeOption)\n this._options = next.options\n this._activeIndex = next.activeIndex\n // 非 portal 模式 aria-activedescendant 引用真实 option id,需保证已分配\n this._optionPortal.ensureOptionIds(this._options)\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 || !this._isLive(option)) 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 // slotchange 不冒泡,只能由模板内 slot 自行监听;稳定引用避免 Lit 重挂载\n private _onSlotChange = () => {\n this._optionPortal.scheduleRefresh()\n }\n\n // slotchange/unregister 的刷新依赖 Lit 渲染调度;键盘或 click 事件可能先于其触发,\n // 已从 DOM 移除或被移出 Select/portal 面板的选项不得再被激活或选中。\n private _isLive(option: WebUiOption): boolean {\n const panel = this.portal ? this._panel.getPanel() : null\n return option.isConnected && (this.contains(option) || (!!panel && panel.contains(option)))\n }\n\n private _onKeydown = (e: KeyboardEvent) => {\n if (this._isDisabled) return\n\n // Escape 不在本组件处理:由共享仲裁者在 document 捕获阶段归属(issue #120 Block 1)。\n switch (e.key) {\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 && this._isLive(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\n private _navigateActive(delta: number) {\n const enabled = this._options.filter(o => !o.disabled && this._isLive(o))\n if (!enabled.length) return\n\n const selectedOption = this._options.find(\n option => option.value === this.value && !option.disabled && this._isLive(option)\n )\n const currentIdx =\n this._activeIndex >= 0 && this._isLive(this._options[this._activeIndex])\n ? enabled.indexOf(this._options[this._activeIndex])\n : selectedOption\n ? enabled.indexOf(selectedOption)\n : delta > 0\n ? -1\n : 0\n const nextOption = enabled[nextWrappingIndex(enabled.length, currentIdx, delta)]\n this._activeIndex = this._options.indexOf(nextOption)\n\n this._syncActiveOption()\n }\n\n // 开合生命周期不变量(guard / 派发顺序 / scroll-lock 配对 / portal rAF dance)\n // 收敛在 shared combobox-shell;select 只注入差异点\n private readonly _openController = createComboboxOpenController({\n canOpen: () => !this._isDisabled,\n getIsOpen: () => this._isOpen,\n setIsOpen: open => {\n this._isOpen = open\n },\n dispatchOpenChange: () => this._dispatchOpenChange(),\n syncScrollLock: open => this._syncScrollLock(open),\n isPortal: () => this.portal,\n openOverlay: isKeyboardNavigation => this._openOverlay(isKeyboardNavigation),\n closeOverlay: () => void this._closeOverlay(),\n onOpen: isKeyboardNavigation => {\n this._syncSelected()\n if (isKeyboardNavigation) this._setInitialActiveOption()\n else this._syncActiveOption()\n },\n onAfterClose: () => {\n this._activeIndex = -1\n this._options.forEach(o => o.removeAttribute('active'))\n }\n })\n\n private _open(isKeyboardNavigation = false) {\n this._openController.open(isKeyboardNavigation)\n }\n\n private _close() {\n this._openController.close()\n }\n\n private _dispatchOpenChange() {\n dispatchOpenChangeEvent(this, this._isOpen)\n }\n\n private _setInitialActiveOption() {\n const selectedIndex = this._options.findIndex(\n option => option.value === this.value && !option.disabled && this._isLive(option)\n )\n const firstEnabledIndex = this._options.findIndex(option => !option.disabled && this._isLive(option))\n this._activeIndex = selectedIndex >= 0 ? selectedIndex : firstEnabledIndex\n this._syncActiveOption()\n }\n\n private _syncActiveOption() {\n this._options.forEach((option, index) =>\n option.toggleAttribute('active', index === this._activeIndex && this._isLive(option))\n )\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 this._panel.open(isKeyboardNavigation)\n // 新会话的句柄刚建立,惰性状态需按当前 disabled 重新同步。\n this._syncOverlayInert()\n }\n\n private _createPortal(): OverlayPortal {\n const portal = defineOverlayPortal().make({\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 onContentChange: () => this._optionPortal.scheduleRefresh()\n })\n this._portal = portal\n applyOverlayVariables(portal.panel, this, [\n '--wui-overlay-min-width',\n '--wui-select-max-width',\n '--wui-select-max-height'\n ])\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 this._portalContent = content\n scroll.append(content)\n portal.panel.append(scroll)\n // 自定义 trigger 必须留在宿主内,不能随 options 迁入 portal 面板\n portal.moveContent(\n Array.from(this.children).filter(child => child.slot !== 'trigger'),\n content\n )\n return portal\n }\n\n private _reconfigureOverlay() {\n // reconfigure 会 dispose 并按需重建 portal,旧引用必须同步失效\n this._portal = undefined\n this._portalContent = undefined\n this._panel.reconfigure(this._isOpen)\n /*\n * reconfigure 重新 claim = 新会话,inert 回到 false。实测这条重推是**冗余**的(摘掉本行\n * 全部用例仍绿):这条路径后面跟着一轮渲染,而 `updated()` 每次渲染都会调\n * `_syncOverlayInert()`。留在这里是不想依赖「这条路径必然跟着一次渲染」这个隐含前提。\n */\n this._syncOverlayInert()\n }\n\n private async _closeOverlay() {\n const closed = await this._panel.close(() => this._isOpen)\n // portal 已随关闭 dispose,与 autocomplete 对齐同步失效引用\n if (closed) {\n this._portal = undefined\n this._portalContent = undefined\n }\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=\"select-overlay wui-floating-panel wui-glass\" 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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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/select/index.ts"],"sourcesContent":["import '@/components/icon'\n\nimport { html, LitElement, nothing, type PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\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 internalScrollbars from '@/scrollbars/internal.css?inline'\nimport { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { dispatchOpenChangeEvent } from '@/shared/open-state'\nimport {\n createComboboxOpenController,\n createOptionListenerBinding,\n defineOptionPortal,\n handleComboboxFocusOut,\n nextWrappingIndex\n} from '@/shared/option-portal'\nimport { defineAnchoredPanel } from '@/shared/overlay/anchored-panel'\nimport { defineOpenOverlay } from '@/shared/overlay/open-overlay'\nimport {\n applyOverlayVariables,\n defineOverlayPortal,\n type OverlayContainer,\n type OverlayPortal\n} from '@/shared/overlay/portal'\nimport { defineScrollLockLease } from '@/shared/scroll-lock/scroll-lock'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\n@customElement('web-ui-select')\nexport class WebUiSelect extends FormAssociated(LitElement) {\n static override styles = [unsafeCSS(glass), unsafeCSS(overlayMotion), unsafeCSS(internalScrollbars), unsafeCSS(style)]\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 // @property + reflect 让它与 input/textarea/slider/input-number 的 value 反射语义保持一致。\n @state() private _value = ''\n @property({ type: String, reflect: true })\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._formAssociation.sync()\n this.toggleAttribute('data-has-value', !!v)\n this.requestUpdate('value', old)\n }\n\n private readonly _formAssociation = defineFormAssociation<string>({\n host: this,\n initialize: () => {\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 },\n getState: () => this._value,\n setState: value => {\n this.value = value\n },\n getFormValue: () => this._value,\n getFormState: () => this._value,\n restoreState: state => {\n if (typeof state === 'string') this.value = state\n },\n syncValidity: () => this._syncValidity()\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\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 _portal?: OverlayPortal\n private _portalContent?: HTMLElement\n private readonly _scrollLock = defineScrollLockLease().make()\n\n private static _nextInstanceId = 0\n\n // option 注册表 / portal 同步 / 微任务调度收敛到 shared 模块(autocomplete 同款)\n private readonly _optionPortal = defineOptionPortal().make({\n element: this,\n // 实例级前缀保证多实例同时展开时 option id 不冲突(aria 引用按 id 定位)\n idPrefix: `web-ui-select-${++WebUiSelect._nextInstanceId}`,\n getPortal: () => this._portal,\n getPortalContent: () => this._portalContent,\n isOpen: () => this.portal && this._isOpen,\n getMigratableNodes: () => [...this.querySelectorAll<WebUiOption>('web-ui-option')],\n hasUpdated: () => this.hasUpdated,\n requestUpdate: () => this.requestUpdate(),\n bindOption: option => this._bindOption(option),\n unbindOption: option => this._unbindOption(option),\n onImmediateSync: () => {\n this._refreshOptions()\n this._syncSelected()\n this._syncActiveOption()\n }\n })\n /*\n * 开启态浮层承载「我开着吗」(issue #120 Block 1):本组件不再在 keydown 里自行关闭,\n * 只声明「我开着」。宿主级监听在 portal 模式下收不到面板内的 Escape,正是原实现的\n * 缺陷来源;改由唯一仲裁者在 document 捕获阶段判定最内层。\n *\n * 宿主接口除 requestClose 外只再提供一个 isConnected(仅供惰性回收读取):开启状态是\n * 声明而非询问,仲裁时不再回头问 isOpen()。\n */\n private readonly _overlay = defineOpenOverlay().make({\n requestClose: () => this._close(),\n isConnected: () => this.isConnected\n })\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: () => ({\n placement: 'bottom-start',\n offset: 4,\n // 面板宽度统一为 max(内容, trigger, --wui-overlay-min-width),内容自适应展开\n minAnchorWidth: true,\n strategy: this.portal ? 'fixed' : 'absolute'\n }),\n isPortal: () => this.portal,\n createPortal: () => this._createPortal(),\n openOverlay: this._overlay\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 // 在监听器内部判定:composedPath() 在派发结束后会被清空。\n const isInside = e.composedPath().includes(this) || !!this._panel.getHandle()?.containsEvent(e)\n if (this._isOpen && !isInside) {\n this._close()\n }\n }\n\n private _onFocusOut = () => {\n handleComboboxFocusOut(\n this,\n () => this._panel.getHandle(),\n () => this._isOpen,\n () => this._close()\n )\n }\n\n override connectedCallback() {\n super.connectedCallback()\n this._optionPortal.bindHost()\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._optionPortal.dispose()\n this.removeEventListener('keydown', this._onKeydown)\n this.removeEventListener('focusout', this._onFocusOut)\n document.removeEventListener('click', this._onClickOutside)\n this._options.forEach(this._unbindOption)\n this._options = []\n this._portal = undefined\n this._portalContent = undefined\n this._close()\n // 撤销登记由 _panel.dispose() 完成(句柄归它持有),不再需要单独 dispose 仲裁者。\n this._panel.dispose()\n this._scrollLock.release()\n }\n\n override firstUpdated() {\n requestAnimationFrame(() => {\n if (this.isConnected) this._optionPortal.scheduleRefresh()\n })\n }\n\n override willUpdate() {\n this._refreshOptions()\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._syncOverlayInert()\n this._syncValidity()\n }\n\n private _syncValidity() {\n const internals = this._formAssociation.getInternals()\n if (!internals || typeof internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this.value) internals.setValidity({})\n else internals.setValidity({ valueMissing: true }, '请选择一项')\n }\n\n private _syncOpenAttribute() {\n this.toggleAttribute('open', this._isOpen)\n }\n\n /*\n * 禁用态不响应 Escape。仲裁者仍在(吞掉按键并压掉原生 cancel),只是不走关闭入口\n * —— 与旧的「跳过候选」语义不同:旧语义放任事件落到下层浮层,把外层一起关掉。\n * 每次渲染后同步即可覆盖 disabled 属性与表单禁用两条来源。\n */\n private _syncOverlayInert() {\n this._panel.getHandle()?.setInert(this._isDisabled)\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 readonly _optionListeners = createOptionListenerBinding({\n // 惰性解引用:handler 字段声明在后者仍可在调用期取到\n onClick: event => this._handleOptionClick(event),\n onPointerOver: event => this._handleOptionPointerOver(event),\n onPointerDown: event => this._handleOptionPointerDown(event),\n onUpdate: () => this._onOptionUpdate()\n })\n private _bindOption = (option: WebUiOption) => this._optionListeners.bind(option)\n private _unbindOption = (option: WebUiOption) => this._optionListeners.unbind(option)\n\n private _refreshOptions() {\n const activeOption = this._options[this._activeIndex]\n // diff 绑定/解绑与激活索引按 option 身份保持在 shared 内完成,\n // 避免移除中间项后激活静默偏移到相邻项\n const next = this._optionPortal.refresh(this._options, activeOption)\n this._options = next.options\n this._activeIndex = next.activeIndex\n // 非 portal 模式 aria-activedescendant 引用真实 option id,需保证已分配\n this._optionPortal.ensureOptionIds(this._options)\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 || !this._isLive(option)) 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 // slotchange 不冒泡,只能由模板内 slot 自行监听;稳定引用避免 Lit 重挂载\n private _onSlotChange = () => {\n this._optionPortal.scheduleRefresh()\n }\n\n // slotchange/unregister 的刷新依赖 Lit 渲染调度;键盘或 click 事件可能先于其触发,\n // 已从 DOM 移除或被移出 Select/portal 面板的选项不得再被激活或选中。\n private _isLive(option: WebUiOption): boolean {\n const panel = this.portal ? this._panel.getPanel() : null\n return option.isConnected && (this.contains(option) || (!!panel && panel.contains(option)))\n }\n\n private _onKeydown = (e: KeyboardEvent) => {\n if (this._isDisabled) return\n\n // Escape 不在本组件处理:由共享仲裁者在 document 捕获阶段归属(issue #120 Block 1)。\n switch (e.key) {\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 && this._isLive(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\n private _navigateActive(delta: number) {\n const enabled = this._options.filter(o => !o.disabled && this._isLive(o))\n if (!enabled.length) return\n\n const selectedOption = this._options.find(\n option => option.value === this.value && !option.disabled && this._isLive(option)\n )\n const currentIdx =\n this._activeIndex >= 0 && this._isLive(this._options[this._activeIndex])\n ? enabled.indexOf(this._options[this._activeIndex])\n : selectedOption\n ? enabled.indexOf(selectedOption)\n : delta > 0\n ? -1\n : 0\n const nextOption = enabled[nextWrappingIndex(enabled.length, currentIdx, delta)]\n this._activeIndex = this._options.indexOf(nextOption)\n\n this._syncActiveOption()\n }\n\n // 开合生命周期不变量(guard / 派发顺序 / scroll-lock 配对 / portal rAF dance)\n // 收敛在 shared combobox-shell;select 只注入差异点\n private readonly _openController = createComboboxOpenController({\n canOpen: () => !this._isDisabled,\n getIsOpen: () => this._isOpen,\n setIsOpen: open => {\n this._isOpen = open\n },\n dispatchOpenChange: () => this._dispatchOpenChange(),\n syncScrollLock: open => this._syncScrollLock(open),\n isPortal: () => this.portal,\n openOverlay: isKeyboardNavigation => this._openOverlay(isKeyboardNavigation),\n closeOverlay: () => void this._closeOverlay(),\n onOpen: isKeyboardNavigation => {\n this._syncSelected()\n if (isKeyboardNavigation) this._setInitialActiveOption()\n else this._syncActiveOption()\n },\n onAfterClose: () => {\n this._activeIndex = -1\n this._options.forEach(o => o.removeAttribute('active'))\n }\n })\n\n private _open(isKeyboardNavigation = false) {\n this._openController.open(isKeyboardNavigation)\n }\n\n private _close() {\n this._openController.close()\n }\n\n private _dispatchOpenChange() {\n dispatchOpenChangeEvent(this, this._isOpen)\n }\n\n private _setInitialActiveOption() {\n const selectedIndex = this._options.findIndex(\n option => option.value === this.value && !option.disabled && this._isLive(option)\n )\n const firstEnabledIndex = this._options.findIndex(option => !option.disabled && this._isLive(option))\n this._activeIndex = selectedIndex >= 0 ? selectedIndex : firstEnabledIndex\n this._syncActiveOption()\n }\n\n private _syncActiveOption() {\n this._options.forEach((option, index) =>\n option.toggleAttribute('active', index === this._activeIndex && this._isLive(option))\n )\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 this._panel.open(isKeyboardNavigation)\n // 新会话的句柄刚建立,惰性状态需按当前 disabled 重新同步。\n this._syncOverlayInert()\n }\n\n private _createPortal(): OverlayPortal {\n const portal = defineOverlayPortal().make({\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 onContentChange: () => this._optionPortal.scheduleRefresh()\n })\n this._portal = portal\n applyOverlayVariables(portal.panel, this, [\n '--wui-overlay-min-width',\n '--wui-select-max-width',\n '--wui-select-max-height'\n ])\n portal.panel.setAttribute('role', 'listbox')\n const scroll = document.createElement('div')\n scroll.className = 'select-scroll wui-scroll'\n const content = document.createElement('div')\n content.className = 'select-content'\n this._portalContent = content\n scroll.append(content)\n portal.panel.append(scroll)\n // 自定义 trigger 必须留在宿主内,不能随 options 迁入 portal 面板\n portal.moveContent(\n Array.from(this.children).filter(child => child.slot !== 'trigger'),\n content\n )\n return portal\n }\n\n private _reconfigureOverlay() {\n // reconfigure 会 dispose 并按需重建 portal,旧引用必须同步失效\n this._portal = undefined\n this._portalContent = undefined\n this._panel.reconfigure(this._isOpen)\n /*\n * reconfigure 重新 claim = 新会话,inert 回到 false。实测这条重推是**冗余**的(摘掉本行\n * 全部用例仍绿):这条路径后面跟着一轮渲染,而 `updated()` 每次渲染都会调\n * `_syncOverlayInert()`。留在这里是不想依赖「这条路径必然跟着一次渲染」这个隐含前提。\n */\n this._syncOverlayInert()\n }\n\n private async _closeOverlay() {\n const closed = await this._panel.close(() => this._isOpen)\n // portal 已随关闭 dispose,与 autocomplete 对齐同步失效引用\n if (closed) {\n this._portal = undefined\n this._portalContent = undefined\n }\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=\"select-overlay wui-floating-panel wui-glass\" hidden role=\"listbox\" id=${listboxId}>\n <div class=\"select-scroll wui-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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"}
|
|
@@ -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'\nimport { styleMap } from 'lit/directives/style-map.js'\n\nimport '@/components/icon'\nimport glass from '@/assets/glass.css?inline'\nimport { lucideLoaderCircle } from '@/icons'\nimport { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { createFieldId } from '@/shared/form-association/field-id'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, normalizeProgress } from '@/shared/gesture/physics'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\n@customElement('web-ui-switch')\nexport class WebUiSwitch extends FormAssociated(LitElement) {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\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._formAssociation.sync()\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 @state() private _isDragging = false\n @state() private _dragOffset = 0\n @state() private _dragProgress = 0\n\n private _dragged = false\n private _maxTravel = 20\n private _startOffset = 0\n private _dragGestureHandle: DragGestureHandle | null = null\n private readonly _fieldId = createFieldId('web-ui-switch')\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = null\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\n }\n\n private readonly _formAssociation = defineFormAssociation<boolean>({\n host: this,\n initialize: () => {\n if (this.hasAttribute('checked')) this._checked = true\n },\n getState: () => this._checked,\n setState: checked => {\n this.checked = checked\n },\n getFormValue: () => (this._checked ? this.value || 'on' : null),\n getFormState: () => String(this._checked),\n restoreState: state => {\n if (typeof state === 'string') this.checked = state === 'true'\n },\n syncValidity: () => this._syncValidity()\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n private _syncValidity() {\n const internals = this._formAssociation.getInternals()\n if (!internals || typeof internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this._checked) internals.setValidity({})\n else internals.setValidity({ valueMissing: true }, '请启用此项')\n }\n\n // 阻止 label 默认行为,避免原生 checkbox 重复触发点击。\n private handleClick(e: Event) {\n e.preventDefault()\n if (this._dragged) {\n this._dragged = false\n return\n }\n if (this._isDisabled || this.loading) return\n const old = this._checked\n this._checked = !old\n this._formAssociation.sync()\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(e: PointerEvent) {\n if (this._isDisabled || this.loading) return\n this._pressed = true\n\n const track = this.renderRoot.querySelector<HTMLElement>('.wui-switch-track')\n if (track) {\n const trackWidth = track.getBoundingClientRect().width || 40\n // 拖拽时 thumb 的 pressed 布局盒为 20px(scale(1.5) 视觉放大),因此行程按 20px 布局盒钳制;\n // 释放后的 checked 静止位移为 20px(16px thumb),两者由 transition 衔接。\n this._maxTravel = Math.max(1, trackWidth - 4 - 20)\n } else {\n this._maxTravel = 16\n }\n\n this._startOffset = this._checked ? this._maxTravel : 0\n this._dragOffset = this._startOffset\n this._dragProgress = this._checked ? 1 : 0\n\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = attachDragGesture(e, {\n axis: 'x',\n threshold: 6,\n onMove: info => {\n this._isDragging = true\n const current = clamp(this._startOffset + info.deltaX, 0, this._maxTravel)\n this._dragOffset = current\n this._dragProgress = normalizeProgress(current, 0, this._maxTravel)\n this.requestUpdate()\n },\n onEnd: info => {\n const wasDragging = this._isDragging\n this._isDragging = false\n this._pressed = false\n\n if (wasDragging) {\n this._dragged = true\n let targetChecked = this._checked\n if (info.velocityX > 300) {\n targetChecked = true\n } else if (info.velocityX < -300) {\n targetChecked = false\n } else {\n targetChecked = this._dragProgress >= 0.5\n }\n\n if (targetChecked !== this._checked) {\n const old = this._checked\n this._checked = targetChecked\n this._formAssociation.sync()\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 } else {\n this.requestUpdate()\n }\n }\n },\n onCancel: () => {\n this._isDragging = false\n this._pressed = false\n this.requestUpdate()\n }\n })\n }\n\n private handlePointerUp() {\n this._pressed = false\n }\n\n private handlePointerLeave() {\n if (!this._isDragging) {\n this._pressed = false\n }\n }\n\n override render() {\n const isOpen = this._isDragging ? this._dragProgress >= 0.5 : this._checked\n const trackCls = {\n 'wui-switch-track': true,\n 'is-open': isOpen,\n 'is-dragging': this._isDragging,\n 'is-disabled': this._isDisabled || this.loading\n }\n // wui-glass 条件化:静止态实体白 thumb,按压/拖拽时切换为玻璃(backdrop blur +\n // 无填充 + 描边)并放大,回到最初修复不跟手问题时期的视觉结构。\n const thumbCls = {\n 'wui-switch-thumb': true,\n 'wui-glass': this._pressed || this._isDragging,\n 'is-pressed': this._pressed || this._isDragging\n }\n const trackStyle = this._isDragging ? { '--wui-switch-drag-offset': `${this._dragOffset}px` } : {}\n\n return html`\n <label\n class=${classMap(trackCls)}\n style=${styleMap(trackStyle)}\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 id=${this._fieldId}\n type=\"checkbox\"\n .checked=${this._checked}\n ?disabled=${this._isDisabled || this.loading}\n class=\"sr-only\"\n />\n <div class=${classMap(thumbCls)}>\n ${\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 }\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 '@/components/icon'\n\nimport { 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 { lucideLoaderCircle } from '@/icons'\nimport { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { createFieldId } from '@/shared/form-association/field-id'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, normalizeProgress } from '@/shared/gesture/physics'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\n@customElement('web-ui-switch')\nexport class WebUiSwitch extends FormAssociated(LitElement) {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\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._formAssociation.sync()\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 @state() private _isDragging = false\n @state() private _dragOffset = 0\n @state() private _dragProgress = 0\n\n private _dragged = false\n private _maxTravel = 20\n private _startOffset = 0\n private _dragGestureHandle: DragGestureHandle | null = null\n private readonly _fieldId = createFieldId('web-ui-switch')\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = null\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formAssociation.isFormDisabled()\n }\n\n private readonly _formAssociation = defineFormAssociation<boolean>({\n host: this,\n initialize: () => {\n if (this.hasAttribute('checked')) this._checked = true\n },\n getState: () => this._checked,\n setState: checked => {\n this.checked = checked\n },\n getFormValue: () => (this._checked ? this.value || 'on' : null),\n getFormState: () => String(this._checked),\n restoreState: state => {\n if (typeof state === 'string') this.checked = state === 'true'\n },\n syncValidity: () => this._syncValidity()\n }).make()\n\n private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n private _syncValidity() {\n const internals = this._formAssociation.getInternals()\n if (!internals || typeof internals.setValidity !== 'function') return\n if (this._isDisabled || !this.required || this._checked) internals.setValidity({})\n else internals.setValidity({ valueMissing: true }, '请启用此项')\n }\n\n // 阻止 label 默认行为,避免原生 checkbox 重复触发点击。\n private handleClick(e: Event) {\n e.preventDefault()\n if (this._dragged) {\n this._dragged = false\n return\n }\n if (this._isDisabled || this.loading) return\n const old = this._checked\n this._checked = !old\n this._formAssociation.sync()\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(e: PointerEvent) {\n if (this._isDisabled || this.loading) return\n this._pressed = true\n\n const track = this.renderRoot.querySelector<HTMLElement>('.wui-switch-track')\n if (track) {\n const trackWidth = track.getBoundingClientRect().width || 40\n // 拖拽时 thumb 的 pressed 布局盒为 20px(scale(1.5) 视觉放大),因此行程按 20px 布局盒钳制;\n // 释放后的 checked 静止位移为 20px(16px thumb),两者由 transition 衔接。\n this._maxTravel = Math.max(1, trackWidth - 4 - 20)\n } else {\n this._maxTravel = 16\n }\n\n this._startOffset = this._checked ? this._maxTravel : 0\n this._dragOffset = this._startOffset\n this._dragProgress = this._checked ? 1 : 0\n\n this._dragGestureHandle?.destroy()\n this._dragGestureHandle = attachDragGesture(e, {\n axis: 'x',\n threshold: 6,\n onMove: info => {\n this._isDragging = true\n const current = clamp(this._startOffset + info.deltaX, 0, this._maxTravel)\n this._dragOffset = current\n this._dragProgress = normalizeProgress(current, 0, this._maxTravel)\n this.requestUpdate()\n },\n onEnd: info => {\n const wasDragging = this._isDragging\n this._isDragging = false\n this._pressed = false\n\n if (wasDragging) {\n this._dragged = true\n let targetChecked = this._checked\n if (info.velocityX > 300) {\n targetChecked = true\n } else if (info.velocityX < -300) {\n targetChecked = false\n } else {\n targetChecked = this._dragProgress >= 0.5\n }\n\n if (targetChecked !== this._checked) {\n const old = this._checked\n this._checked = targetChecked\n this._formAssociation.sync()\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 } else {\n this.requestUpdate()\n }\n }\n },\n onCancel: () => {\n this._isDragging = false\n this._pressed = false\n this.requestUpdate()\n }\n })\n }\n\n private handlePointerUp() {\n this._pressed = false\n }\n\n private handlePointerLeave() {\n if (!this._isDragging) {\n this._pressed = false\n }\n }\n\n override render() {\n const isOpen = this._isDragging ? this._dragProgress >= 0.5 : this._checked\n const trackCls = {\n 'wui-switch-track': true,\n 'is-open': isOpen,\n 'is-dragging': this._isDragging,\n 'is-disabled': this._isDisabled || this.loading\n }\n // wui-glass 条件化:静止态实体白 thumb,按压/拖拽时切换为玻璃(backdrop blur +\n // 无填充 + 描边)并放大,回到最初修复不跟手问题时期的视觉结构。\n const thumbCls = {\n 'wui-switch-thumb': true,\n 'wui-glass': this._pressed || this._isDragging,\n 'is-pressed': this._pressed || this._isDragging\n }\n const trackStyle = this._isDragging ? { '--wui-switch-drag-offset': `${this._dragOffset}px` } : {}\n\n return html`\n <label\n class=${classMap(trackCls)}\n style=${styleMap(trackStyle)}\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 id=${this._fieldId}\n type=\"checkbox\"\n .checked=${this._checked}\n ?disabled=${this._isDisabled || this.loading}\n class=\"sr-only\"\n />\n <div class=${classMap(thumbCls)}>\n ${\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 }\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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"}
|