@greypan/web-ui 6.1.0 → 6.3.0

package/dist/components/button/index.js

@@ -3,48 +3,51 @@ import "../icon/index.js";
 import t from "../../icons/generated/lucide-loader-circle.js";
 import n from "../../assets/glass.js";
 import { normalizeLiteral as r } from "../../shared/normalize/index.js";
-import { buttonGroupContextKey as i, defineGroupManaged as a } from "../../shared/group-management/index.js";
-import o from "./style.js";
-import { LitElement as s, html as c, nothing as l, unsafeCSS as u } from "lit";
-import { customElement as d, property as f } from "lit/decorators.js";
-import { ifDefined as p } from "lit/directives/if-defined.js";
-import { classMap as m } from "lit/directives/class-map.js";
-import { styleMap as h } from "lit/directives/style-map.js";
+import { installPointerFocusSuppression as i } from "../../shared/focus/pointer-focus.js";
+import { buttonGroupContextKey as a, defineGroupManaged as o } from "../../shared/group-management/index.js";
+import s from "./style.js";
+import { LitElement as c, html as l, nothing as u, unsafeCSS as d } from "lit";
+import { customElement as f, property as p } from "lit/decorators.js";
+import { ifDefined as m } from "lit/directives/if-defined.js";
+import { classMap as h } from "lit/directives/class-map.js";
+import { styleMap as g } from "lit/directives/style-map.js";
 //#region src/components/button/index.ts
-var g = [
+var _ = [
 	"primary",
 	"secondary",
 	"ghost",
 	"danger",
 	"glass"
-], _ = [
+], v = [
 	"button",
 	"submit",
 	"reset"
-], v = class extends s {
+];
+i();
+var y = class extends c {
 	constructor(...e) {
-		super(...e), this._variant = "glass", this.disabled = !1, this.loading = !1, this.full = !1, this.icon = !1, this.size = "", this._type = "button", this.ariaLabel = null, this._groupManagement = a(this, {
-			context: i,
+		super(...e), this._variant = "glass", this.disabled = !1, this.loading = !1, this.full = !1, this.icon = !1, this.size = "", this._type = "button", this.ariaLabel = null, this._groupManagement = o(this, {
+			context: a,
 			requestUpdate: () => this.requestUpdate(),
 			equals: (e, t) => e?.direction === t?.direction && e?.isLast === t?.isLast
 		}).make();
 	}
 	static {
-		this.styles = [u(n), u(o)];
+		this.styles = [d(n), d(s)];
 	}
 	get variant() {
 		return this._variant;
 	}
 	set variant(e) {
 		let t = this._variant;
-		this._variant = r(e, g, "glass"), this.requestUpdate("variant", t);
+		this._variant = r(e, _, "glass"), this.requestUpdate("variant", t);
 	}
 	get type() {
 		return this._type;
 	}
 	set type(e) {
 		let t = this._type;
-		this._type = r(e, _, "button"), this.requestUpdate("type", t);
+		this._type = r(e, v, "button"), this.requestUpdate("type", t);
 	}
 	get _groupContext() {
 		return this._groupManagement.getContext();
@@ -64,52 +67,53 @@ var g = [
 			"group-divider": !0,
 			vertical: e?.direction === "vertical"
 		};
-		return c`
+		return l`
       <button
         type=${this.type}
-        aria-label=${p(this.ariaLabel)}
-        class=${m(n)}
-        style=${Object.keys(this._sizeStyle).length > 0 ? h(this._sizeStyle) : l}
+        aria-label=${m(this.ariaLabel)}
+        class=${h(n)}
+        part="button"
+        style=${Object.keys(this._sizeStyle).length > 0 ? g(this._sizeStyle) : u}
         ?disabled=${this.disabled || this.loading}
         @click=${this.handleClick}
       >
-        ${this.icon ? this.loading ? c`<web-ui-icon .icon=${t} spin></web-ui-icon>` : c`<slot></slot>` : c`
-                ${this.loading ? c`<web-ui-icon .icon=${t} spin></web-ui-icon>` : ""}
+        ${this.icon ? this.loading ? l`<web-ui-icon .icon=${t} spin></web-ui-icon>` : l`<slot></slot>` : l`
+                ${this.loading ? l`<web-ui-icon .icon=${t} spin></web-ui-icon>` : ""}
                 <slot name="prefix"></slot>
                 <span class="label"><slot></slot></span>
                 <slot name="suffix"></slot>
               `}
       </button>
-      ${e && !e.isLast ? c`<span class=${m(r)} aria-hidden="true"></span>` : ""}
+      ${e && !e.isLast ? l`<span class=${h(r)} aria-hidden="true"></span>` : ""}
     `;
 	}
 };
-e([f({
+e([p({
 	type: String,
 	reflect: !0
-})], v.prototype, "variant", null), e([f({
+})], y.prototype, "variant", null), e([p({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "disabled", void 0), e([f({
+})], y.prototype, "disabled", void 0), e([p({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "loading", void 0), e([f({
+})], y.prototype, "loading", void 0), e([p({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "full", void 0), e([f({
+})], y.prototype, "full", void 0), e([p({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "icon", void 0), e([f({
+})], y.prototype, "icon", void 0), e([p({
 	type: String,
 	reflect: !0
-})], v.prototype, "size", void 0), e([f({
+})], y.prototype, "size", void 0), e([p({
 	type: String,
 	reflect: !0
-})], v.prototype, "type", null), e([f({
+})], y.prototype, "type", null), e([p({
 	type: String,
 	attribute: "aria-label"
-})], v.prototype, "ariaLabel", void 0), v = e([d("web-ui-button")], v);
+})], y.prototype, "ariaLabel", void 0), y = e([f("web-ui-button")], y);
 //#endregion
-export { v as WebUiButton };
+export { y as WebUiButton };
 
 //# sourceMappingURL=index.js.map

package/dist/components/button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/button/index.ts"],"sourcesContent":["import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { ifDefined } from 'lit/directives/if-defined.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 { buttonGroupContextKey, defineGroupManaged, type ButtonGroupContext } from '@/shared/group-management'\nimport { normalizeLiteral } from '@/shared/normalize'\n\nimport style from './style.css?inline'\n\nconst ALLOWED_VARIANTS = ['primary', 'secondary', 'ghost', 'danger', 'glass'] as const\nconst ALLOWED_TYPES = ['button', 'submit', 'reset'] as const\n\n@customElement('web-ui-button')\nexport class WebUiButton extends LitElement {\n  static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n  @property({ type: String, reflect: true })\n  get variant(): 'primary' | 'secondary' | 'ghost' | 'danger' | 'glass' {\n    return this._variant\n  }\n  set variant(v: string) {\n    const old = this._variant\n    this._variant = normalizeLiteral(v, ALLOWED_VARIANTS, 'glass')\n    this.requestUpdate('variant', old)\n  }\n  private _variant: 'primary' | 'secondary' | 'ghost' | 'danger' | 'glass' = 'glass'\n\n  @property({ type: Boolean, reflect: true }) disabled = false\n  @property({ type: Boolean, reflect: true }) loading = false\n  @property({ type: Boolean, reflect: true }) full = false\n  @property({ type: Boolean, reflect: true }) icon = false\n  @property({ type: String, reflect: true }) size = ''\n\n  @property({ type: String, reflect: true })\n  get type(): (typeof ALLOWED_TYPES)[number] {\n    return this._type\n  }\n  set type(value: unknown) {\n    const old = this._type\n    this._type = normalizeLiteral(value, ALLOWED_TYPES, 'button')\n    this.requestUpdate('type', old)\n  }\n  private _type: (typeof ALLOWED_TYPES)[number] = 'button'\n\n  // Explicitly delegated accessible naming attributes.\n  @property({ type: String, attribute: 'aria-label' }) override ariaLabel: string | null = null\n\n  private readonly _groupManagement = defineGroupManaged<ButtonGroupContext>(this, {\n    context: buttonGroupContextKey,\n    requestUpdate: () => this.requestUpdate(),\n    equals: (a, b) => a?.direction === b?.direction && a?.isLast === b?.isLast\n  }).make()\n\n  private get _groupContext(): ButtonGroupContext | undefined {\n    return this._groupManagement.getContext()\n  }\n\n  private get _sizeStyle(): Record<string, string> {\n    // size 仅控制按钮高度；icon 模式下 min-width 同步为相同值，天然保持正方形。\n    const size = this._groupContext ? '30' : this.size\n    return size ? { '--wui-control-size': `${size}px` } : {}\n  }\n\n  private handleClick(e: Event) {\n    if (this.disabled || this.loading) {\n      e.preventDefault()\n      e.stopPropagation()\n    }\n  }\n\n  override render() {\n    const groupContext = this._groupContext\n    const btnClass = {\n      'wui-glass': this.variant === 'glass' && !groupContext,\n      'is-grouped': Boolean(groupContext)\n    }\n    const dividerClass = {\n      'group-divider': true,\n      vertical: groupContext?.direction === 'vertical'\n    }\n\n    return html`\n      <button\n        type=${this.type}\n        aria-label=${ifDefined(this.ariaLabel)}\n        class=${classMap(btnClass)}\n        style=${Object.keys(this._sizeStyle).length > 0 ? styleMap(this._sizeStyle) : nothing}\n        ?disabled=${this.disabled || this.loading}\n        @click=${this.handleClick}\n      >\n        ${\n          this.icon\n            ? // loading 优先于 icon 内容：icon 模式下只展示 spinner，不投影默认 slot，避免双图标叠加\n              this.loading\n              ? html`<web-ui-icon .icon=${lucideLoaderCircle} spin></web-ui-icon>`\n              : html`<slot></slot>`\n            : html`\n                ${this.loading ? html`<web-ui-icon .icon=${lucideLoaderCircle} spin></web-ui-icon>` : ''}\n                <slot name=\"prefix\"></slot>\n                <span class=\"label\"><slot></slot></span>\n                <slot name=\"suffix\"></slot>\n              `\n        }\n      </button>\n      ${\n        groupContext && !groupContext.isLast\n          ? html`<span class=${classMap(dividerClass)} aria-hidden=\"true\"></span>`\n          : ''\n      }\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-button': WebUiButton\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/button/index.ts"],"sourcesContent":["import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { ifDefined } from 'lit/directives/if-defined.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 { buttonGroupContextKey, defineGroupManaged, type ButtonGroupContext } from '@/shared/group-management'\nimport { normalizeLiteral } from '@/shared/normalize'\n\nimport style from './style.css?inline'\n\nconst ALLOWED_VARIANTS = ['primary', 'secondary', 'ghost', 'danger', 'glass'] as const\nconst ALLOWED_TYPES = ['button', 'submit', 'reset'] as const\n\ninstallPointerFocusSuppression()\n\n@customElement('web-ui-button')\nexport class WebUiButton extends LitElement {\n  static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n  @property({ type: String, reflect: true })\n  get variant(): 'primary' | 'secondary' | 'ghost' | 'danger' | 'glass' {\n    return this._variant\n  }\n  set variant(v: string) {\n    const old = this._variant\n    this._variant = normalizeLiteral(v, ALLOWED_VARIANTS, 'glass')\n    this.requestUpdate('variant', old)\n  }\n  private _variant: 'primary' | 'secondary' | 'ghost' | 'danger' | 'glass' = 'glass'\n\n  @property({ type: Boolean, reflect: true }) disabled = false\n  @property({ type: Boolean, reflect: true }) loading = false\n  @property({ type: Boolean, reflect: true }) full = false\n  @property({ type: Boolean, reflect: true }) icon = false\n  @property({ type: String, reflect: true }) size = ''\n\n  @property({ type: String, reflect: true })\n  get type(): (typeof ALLOWED_TYPES)[number] {\n    return this._type\n  }\n  set type(value: unknown) {\n    const old = this._type\n    this._type = normalizeLiteral(value, ALLOWED_TYPES, 'button')\n    this.requestUpdate('type', old)\n  }\n  private _type: (typeof ALLOWED_TYPES)[number] = 'button'\n\n  // Explicitly delegated accessible naming attributes.\n  @property({ type: String, attribute: 'aria-label' }) override ariaLabel: string | null = null\n\n  private readonly _groupManagement = defineGroupManaged<ButtonGroupContext>(this, {\n    context: buttonGroupContextKey,\n    requestUpdate: () => this.requestUpdate(),\n    equals: (a, b) => a?.direction === b?.direction && a?.isLast === b?.isLast\n  }).make()\n\n  private get _groupContext(): ButtonGroupContext | undefined {\n    return this._groupManagement.getContext()\n  }\n\n  private get _sizeStyle(): Record<string, string> {\n    // size 仅控制按钮高度；icon 模式下 min-width 同步为相同值，天然保持正方形。\n    const size = this._groupContext ? '30' : this.size\n    return size ? { '--wui-control-size': `${size}px` } : {}\n  }\n\n  private handleClick(e: Event) {\n    if (this.disabled || this.loading) {\n      e.preventDefault()\n      e.stopPropagation()\n    }\n  }\n\n  override render() {\n    const groupContext = this._groupContext\n    const btnClass = {\n      'wui-glass': this.variant === 'glass' && !groupContext,\n      'is-grouped': Boolean(groupContext)\n    }\n    const dividerClass = {\n      'group-divider': true,\n      vertical: groupContext?.direction === 'vertical'\n    }\n\n    return html`\n      <button\n        type=${this.type}\n        aria-label=${ifDefined(this.ariaLabel)}\n        class=${classMap(btnClass)}\n        part=\"button\"\n        style=${Object.keys(this._sizeStyle).length > 0 ? styleMap(this._sizeStyle) : nothing}\n        ?disabled=${this.disabled || this.loading}\n        @click=${this.handleClick}\n      >\n        ${\n          this.icon\n            ? // loading 优先于 icon 内容：icon 模式下只展示 spinner，不投影默认 slot，避免双图标叠加\n              this.loading\n              ? html`<web-ui-icon .icon=${lucideLoaderCircle} spin></web-ui-icon>`\n              : html`<slot></slot>`\n            : html`\n                ${this.loading ? html`<web-ui-icon .icon=${lucideLoaderCircle} spin></web-ui-icon>` : ''}\n                <slot name=\"prefix\"></slot>\n                <span class=\"label\"><slot></slot></span>\n                <slot name=\"suffix\"></slot>\n              `\n        }\n      </button>\n      ${\n        groupContext && !groupContext.isLast\n          ? html`<span class=${classMap(dividerClass)} aria-hidden=\"true\"></span>`\n          : ''\n      }\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-button': WebUiButton\n  }\n}\n"],"mappings":"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"}

package/dist/components/button/style.js

@@ -1,5 +1,5 @@
 //#region src/components/button/style.css?inline
-var e = "*,:before,:after{box-sizing:border-box}:host{justify-content:center;align-items:center;display:inline-flex;position:relative}:host([full]){width:100%;display:block}:host([disabled]){cursor:not-allowed}button{--wui-glass-corner-radius:calc(var(--wui-control-size,36px) / 2);cursor:default;-webkit-user-select:none;user-select:none;gap:var(--wui-button-gap,8px);box-sizing:border-box;width:var(--wui-button-width,max-content);min-width:var(--wui-control-size,36px);height:var(--wui-control-size,36px);padding:0 var(--wui-button-px,12px);border-radius:var(--wui-radius-control,calc(infinity * 1px));font:inherit;font-size:var(--wui-font-size,14px);color:var(--wui-button-color);white-space:nowrap;background-color:var(--wui-button-bg);border:none;justify-content:center;align-items:center;line-height:1;display:inline-flex;position:relative;overflow:clip}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,#08f6);outline-offset:2px}@media (hover:hover) and (pointer:fine){button:hover:not(:disabled){background-color:var(--wui-button-bg-hover)}}button:active:not(:disabled){background-color:var(--wui-button-bg-active)}:host([full]) button{width:100%;display:flex}:host([icon]) button{padding:0}:host([variant=primary]){--wui-button-color:var(--wui-color-on-accent,#fff);--wui-button-bg:var(--wui-color-accent,#08f);--wui-button-bg-hover:color-mix(in srgb, var(--wui-button-bg,#08f) 88%, black);--wui-button-bg-active:color-mix(in srgb, var(--wui-button-bg,#08f) 76%, black)}:host([variant=secondary]){--wui-button-color:var(--wui-color-text,#1b1b1b);--wui-button-bg:var(--wui-color-surface-control,#dfdfdf);--wui-button-bg-hover:color-mix(in srgb, var(--wui-button-bg,#dfdfdf) 92%, black);--wui-button-bg-active:color-mix(in srgb, var(--wui-button-bg,#dfdfdf) 82%, black)}:host([variant=ghost]){--wui-button-color:var(--wui-color-text,#1b1b1b);--wui-button-bg:transparent;--wui-button-bg-hover:var(--wui-color-state-layer-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, transparent));--wui-button-bg-active:var(--wui-color-state-layer-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, transparent))}:host([variant=danger]){--wui-button-color:var(--wui-color-danger,#dc2626);--wui-button-bg:color-mix(in srgb, var(--wui-color-danger,#dc2626) 18%, var(--wui-color-surface,#fff));--wui-button-bg-hover:color-mix(in srgb, var(--wui-color-danger,#dc2626) 26%, var(--wui-color-surface,#fff));--wui-button-bg-active:color-mix(in srgb, var(--wui-color-danger,#dc2626) 45%, var(--wui-color-surface,#fff))}:host([variant=glass]){--wui-button-color:var(--wui-color-text,#1b1b1b);--wui-button-bg:transparent;--wui-button-bg-hover:var(--wui-color-surface-glass-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, var(--wui-color-surface-glass,#fafafa57)));--wui-button-bg-active:var(--wui-color-surface-glass-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, var(--wui-color-surface-glass,#fafafa57)))}button.is-grouped{--wui-button-bg:transparent;--wui-button-bg-hover:var(--wui-color-state-layer-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, transparent));--wui-button-bg-active:var(--wui-color-state-layer-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, transparent))}.group-divider{z-index:1;background-color:var(--wui-color-border,#0000001a);width:1px;height:24px;position:absolute;top:50%;right:-2px;transform:translateY(-50%)}.group-divider.vertical{width:24px;height:1px;inset:auto auto -2px 50%;transform:translate(-50%)}";
+var e = "*,:before,:after{box-sizing:border-box}:host{justify-content:center;align-items:center;display:inline-flex;position:relative}:host([full]){width:100%;display:block}:host([disabled]){cursor:not-allowed}button{--wui-glass-corner-radius:calc(var(--wui-control-size,36px) / 2);cursor:default;-webkit-user-select:none;user-select:none;gap:var(--wui-button-gap,8px);box-sizing:border-box;width:var(--wui-button-width,max-content);min-width:var(--wui-control-size,36px);height:var(--wui-control-size,36px);padding:0 var(--wui-button-px,12px);border-radius:var(--wui-radius-control,calc(infinity * 1px));font:inherit;font-size:var(--wui-font-size,14px);color:var(--wui-button-color);white-space:nowrap;background-color:var(--wui-button-bg);border:none;justify-content:center;align-items:center;line-height:1;display:inline-flex;position:relative;overflow:clip}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,#08f6);outline-offset:2px}@media (hover:hover) and (pointer:fine){button:hover:not(:disabled){background-color:var(--wui-button-bg-hover)}}button:active:not(:disabled){background-color:var(--wui-button-bg-active)}:host([full]) button{width:100%;display:flex}:host([icon]) button{padding:0}:host([data-wui-pointer-focus]) button:focus-visible{outline-color:#0000}:host([variant=primary]){--wui-button-color:var(--wui-color-on-accent,#fff);--wui-button-bg:var(--wui-color-accent,#08f);--wui-button-bg-hover:color-mix(in srgb, var(--wui-button-bg,#08f) 88%, black);--wui-button-bg-active:color-mix(in srgb, var(--wui-button-bg,#08f) 76%, black)}:host([variant=secondary]){--wui-button-color:var(--wui-color-text,#1b1b1b);--wui-button-bg:var(--wui-color-surface-control,#dfdfdf);--wui-button-bg-hover:color-mix(in srgb, var(--wui-button-bg,#dfdfdf) 92%, black);--wui-button-bg-active:color-mix(in srgb, var(--wui-button-bg,#dfdfdf) 82%, black)}:host([variant=ghost]){--wui-button-color:var(--wui-color-text,#1b1b1b);--wui-button-bg:transparent;--wui-button-bg-hover:var(--wui-color-state-layer-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, transparent));--wui-button-bg-active:var(--wui-color-state-layer-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, transparent))}:host([variant=danger]){--wui-button-color:var(--wui-color-danger,#dc2626);--wui-button-bg:color-mix(in srgb, var(--wui-color-danger,#dc2626) 18%, var(--wui-color-surface,#fff));--wui-button-bg-hover:color-mix(in srgb, var(--wui-color-danger,#dc2626) 26%, var(--wui-color-surface,#fff));--wui-button-bg-active:color-mix(in srgb, var(--wui-color-danger,#dc2626) 45%, var(--wui-color-surface,#fff))}:host([variant=glass]){--wui-button-color:var(--wui-color-text,#1b1b1b);--wui-button-bg:transparent;--wui-button-bg-hover:var(--wui-color-surface-glass-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, var(--wui-color-surface-glass,#fafafa57)));--wui-button-bg-active:var(--wui-color-surface-glass-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, var(--wui-color-surface-glass,#fafafa57)))}button.is-grouped{--wui-button-bg:transparent;--wui-button-bg-hover:var(--wui-color-state-layer-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, transparent));--wui-button-bg-active:var(--wui-color-state-layer-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, transparent))}.group-divider{z-index:1;background-color:var(--wui-color-border,#0000001a);width:1px;height:24px;position:absolute;top:50%;right:-2px;transform:translateY(-50%)}.group-divider.vertical{width:24px;height:1px;inset:auto auto -2px 50%;transform:translate(-50%)}";
 //#endregion
 export { e as default };
 

package/dist/components/button/style.js.map

@@ -1 +1 @@
-{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/button/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n:host {\n  position: relative;\n\n  /* inline-flex 让内层按钮在宿主内完全居中，避免继承的行高撑高宿主、导致图标偏移 */\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n\n:host([full]) {\n  display: block;\n  width: 100%;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n}\n\nbutton {\n  --wui-glass-corner-radius: calc(var(--wui-control-size, 36px) / 2);\n  cursor: default;\n  user-select: none;\n\n  position: relative;\n\n  overflow: clip;\n  display: inline-flex;\n  gap: var(--wui-button-gap, 8px);\n  align-items: center;\n  justify-content: center;\n\n  box-sizing: border-box;\n  width: var(--wui-button-width, max-content);\n  min-width: var(--wui-control-size, 36px);\n  height: var(--wui-control-size, 36px);\n  padding: 0 var(--wui-button-px, 12px);\n  border: none;\n  border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n  /* 原生 button 不继承字体；显式继承以对齐宿主排版，避免 UA 默认 Arial 差异 */\n  font: inherit;\n  font-size: var(--wui-font-size, 14px);\n  line-height: 1;\n  color: var(--wui-button-color);\n  white-space: nowrap;\n\n  background-color: var(--wui-button-bg);\n\n  &:disabled {\n    cursor: not-allowed;\n    opacity: 0.4;\n  }\n\n  &:focus-visible {\n    outline: var(--wui-focus-ring-width, 3px) solid var(--wui-color-focus-ring, rgb(0 136 255 / 0.4));\n    outline-offset: 2px;\n  }\n}\n\n@media (hover: hover) and (pointer: fine) {\n  button:hover:not(:disabled) {\n    background-color: var(--wui-button-bg-hover);\n  }\n}\n\nbutton:active:not(:disabled) {\n  background-color: var(--wui-button-bg-active);\n}\n\n/* ===== Full width ===== */\n\n:host([full]) button {\n  display: flex;\n  width: 100%;\n}\n\n/* ===== Icon mode ===== */\n\n:host([icon]) button {\n  padding: 0;\n}\n\n/* ===== Variant: primary (默认) ===== */\n\n:host([variant='primary']) {\n  --wui-button-color: var(--wui-color-on-accent, #fff);\n  --wui-button-bg: var(--wui-color-accent, #08f);\n  --wui-button-bg-hover: color-mix(in srgb, var(--wui-button-bg, #08f) 88%, black);\n  --wui-button-bg-active: color-mix(in srgb, var(--wui-button-bg, #08f) 76%, black);\n}\n\n/* ===== Variant: secondary ===== */\n\n:host([variant='secondary']) {\n  --wui-button-color: var(--wui-color-text, #1b1b1b);\n  --wui-button-bg: var(--wui-color-surface-control, #dfdfdf);\n  --wui-button-bg-hover: color-mix(in srgb, var(--wui-button-bg, #dfdfdf) 92%, black);\n  --wui-button-bg-active: color-mix(in srgb, var(--wui-button-bg, #dfdfdf) 82%, black);\n}\n\n/* ===== Variant: ghost ===== */\n\n:host([variant='ghost']) {\n  --wui-button-color: var(--wui-color-text, #1b1b1b);\n  --wui-button-bg: transparent;\n  --wui-button-bg-hover: var(\n    --wui-color-state-layer-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, transparent)\n  );\n  --wui-button-bg-active: var(\n    --wui-color-state-layer-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, transparent)\n  );\n}\n\n/* ===== Variant: danger ===== */\n\n:host([variant='danger']) {\n  --wui-button-color: var(--wui-color-danger, #dc2626);\n  --wui-button-bg: color-mix(in srgb, var(--wui-color-danger, #dc2626) 18%, var(--wui-color-surface, #fff));\n  --wui-button-bg-hover: color-mix(in srgb, var(--wui-color-danger, #dc2626) 26%, var(--wui-color-surface, #fff));\n  --wui-button-bg-active: color-mix(in srgb, var(--wui-color-danger, #dc2626) 45%, var(--wui-color-surface, #fff));\n}\n\n/* ===== Variant: glass (玻璃) ===== */\n\n/* .wui-glass 样式由 @/assets/glass.css 提供 */\n:host([variant='glass']) {\n  --wui-button-color: var(--wui-color-text, #1b1b1b);\n\n  /* standalone glass 底色由 .wui-glass 提供；hover/active 需要还原玻璃底，避免被按钮状态色整块替换 */\n  --wui-button-bg: transparent;\n  --wui-button-bg-hover: var(\n    --wui-color-surface-glass-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n  --wui-button-bg-active: var(\n    --wui-color-surface-glass-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n}\n\n/* ===== Group context ===== */\n\nbutton.is-grouped {\n  --wui-button-bg: transparent;\n  --wui-button-bg-hover: var(\n    --wui-color-state-layer-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, transparent)\n  );\n  --wui-button-bg-active: var(\n    --wui-color-state-layer-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, transparent)\n  );\n}\n\n.group-divider {\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  right: -2px;\n  transform: translateY(-50%);\n\n  width: 1px;\n  height: 24px;\n\n  background-color: var(--wui-color-border, rgb(0 0 0 / 0.1));\n}\n\n.group-divider.vertical {\n  top: auto;\n  right: auto;\n  bottom: -2px;\n  left: 50%;\n  transform: translateX(-50%);\n\n  width: 24px;\n  height: 1px;\n}\n"],"mappings":""}
+{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/button/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n:host {\n  position: relative;\n\n  /* inline-flex 让内层按钮在宿主内完全居中，避免继承的行高撑高宿主、导致图标偏移 */\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n\n:host([full]) {\n  display: block;\n  width: 100%;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n}\n\nbutton {\n  --wui-glass-corner-radius: calc(var(--wui-control-size, 36px) / 2);\n  cursor: default;\n  user-select: none;\n\n  position: relative;\n\n  overflow: clip;\n  display: inline-flex;\n  gap: var(--wui-button-gap, 8px);\n  align-items: center;\n  justify-content: center;\n\n  box-sizing: border-box;\n  width: var(--wui-button-width, max-content);\n  min-width: var(--wui-control-size, 36px);\n  height: var(--wui-control-size, 36px);\n  padding: 0 var(--wui-button-px, 12px);\n  border: none;\n  border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n  /* 原生 button 不继承字体；显式继承以对齐宿主排版，避免 UA 默认 Arial 差异 */\n  font: inherit;\n  font-size: var(--wui-font-size, 14px);\n  line-height: 1;\n  color: var(--wui-button-color);\n  white-space: nowrap;\n\n  background-color: var(--wui-button-bg);\n\n  &:disabled {\n    cursor: not-allowed;\n    opacity: 0.4;\n  }\n\n  &:focus-visible {\n    outline: var(--wui-focus-ring-width, 3px) solid var(--wui-color-focus-ring, rgb(0 136 255 / 0.4));\n    outline-offset: 2px;\n  }\n}\n\n@media (hover: hover) and (pointer: fine) {\n  button:hover:not(:disabled) {\n    background-color: var(--wui-button-bg-hover);\n  }\n}\n\nbutton:active:not(:disabled) {\n  background-color: var(--wui-button-bg-active);\n}\n\n/* ===== Full width ===== */\n\n:host([full]) button {\n  display: flex;\n  width: 100%;\n}\n\n/* ===== Icon mode ===== */\n\n:host([icon]) button {\n  padding: 0;\n}\n\n/* pointer-focus helper 把标记写到 shadow host 上；这里抑制 Shadow DOM 内按钮的 focus ring。 */\n:host([data-wui-pointer-focus]) button:focus-visible {\n  outline-color: transparent;\n}\n\n/* ===== Variant: primary (默认) ===== */\n\n:host([variant='primary']) {\n  --wui-button-color: var(--wui-color-on-accent, #fff);\n  --wui-button-bg: var(--wui-color-accent, #08f);\n  --wui-button-bg-hover: color-mix(in srgb, var(--wui-button-bg, #08f) 88%, black);\n  --wui-button-bg-active: color-mix(in srgb, var(--wui-button-bg, #08f) 76%, black);\n}\n\n/* ===== Variant: secondary ===== */\n\n:host([variant='secondary']) {\n  --wui-button-color: var(--wui-color-text, #1b1b1b);\n  --wui-button-bg: var(--wui-color-surface-control, #dfdfdf);\n  --wui-button-bg-hover: color-mix(in srgb, var(--wui-button-bg, #dfdfdf) 92%, black);\n  --wui-button-bg-active: color-mix(in srgb, var(--wui-button-bg, #dfdfdf) 82%, black);\n}\n\n/* ===== Variant: ghost ===== */\n\n:host([variant='ghost']) {\n  --wui-button-color: var(--wui-color-text, #1b1b1b);\n  --wui-button-bg: transparent;\n  --wui-button-bg-hover: var(\n    --wui-color-state-layer-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, transparent)\n  );\n  --wui-button-bg-active: var(\n    --wui-color-state-layer-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, transparent)\n  );\n}\n\n/* ===== Variant: danger ===== */\n\n:host([variant='danger']) {\n  --wui-button-color: var(--wui-color-danger, #dc2626);\n  --wui-button-bg: color-mix(in srgb, var(--wui-color-danger, #dc2626) 18%, var(--wui-color-surface, #fff));\n  --wui-button-bg-hover: color-mix(in srgb, var(--wui-color-danger, #dc2626) 26%, var(--wui-color-surface, #fff));\n  --wui-button-bg-active: color-mix(in srgb, var(--wui-color-danger, #dc2626) 45%, var(--wui-color-surface, #fff));\n}\n\n/* ===== Variant: glass (玻璃) ===== */\n\n/* .wui-glass 样式由 @/assets/glass.css 提供 */\n:host([variant='glass']) {\n  --wui-button-color: var(--wui-color-text, #1b1b1b);\n\n  /* standalone glass 底色由 .wui-glass 提供；hover/active 需要还原玻璃底，避免被按钮状态色整块替换 */\n  --wui-button-bg: transparent;\n  --wui-button-bg-hover: var(\n    --wui-color-surface-glass-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n  --wui-button-bg-active: var(\n    --wui-color-surface-glass-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n}\n\n/* ===== Group context ===== */\n\nbutton.is-grouped {\n  --wui-button-bg: transparent;\n  --wui-button-bg-hover: var(\n    --wui-color-state-layer-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, transparent)\n  );\n  --wui-button-bg-active: var(\n    --wui-color-state-layer-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, transparent)\n  );\n}\n\n.group-divider {\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  right: -2px;\n  transform: translateY(-50%);\n\n  width: 1px;\n  height: 24px;\n\n  background-color: var(--wui-color-border, rgb(0 0 0 / 0.1));\n}\n\n.group-divider.vertical {\n  top: auto;\n  right: auto;\n  bottom: -2px;\n  left: 50%;\n  transform: translateX(-50%);\n\n  width: 24px;\n  height: 1px;\n}\n"],"mappings":""}

package/dist/components/collapse/index.d.ts

@@ -8,12 +8,16 @@ import { LitElement } from 'lit';
  * element（与 popover trigger 的既定回写模式一致）。wrapper 仅负责点击代理，
  * 不可聚焦，不承载 ARIA。
  *
- * 内容区在 shadow 内以 grid `0fr ↔ 1fr` track 过渡驱动高度/宽度动画（ADR-0038
+ * 内容区在 shadow 内以 grid `0fr ↔ 1fr` track 过渡驱动高度/宽度动画（ADR-0030
  * 选型保留）。关闭稳态三态（消费者 light DOM 永不移动，hidden 全部命令式管理，
  * 避免渲染绑定在关闭动画起点抢先 display:none）：
  * - 默认：content 容器 `hidden`（display:none，脱离渲染与可访问性树）；
  * - `keep-mounted`：inner `inert`（保留在 0fr 轨道内，滚动位置与布局可测量）；
+ * - `peek`：inner `inert`，轨道停在固定长度的裁剪窗口，只露出内容头部；
  * - 动画进行中：inner `inert` + track pointer-events 禁用，结束后进入对应稳态。
+ *
+ * `peek` 与展开态之间是固定长度与内容自适应高度的过渡，CSS 无法插值；这两个
+ * 方向的动画改为读出像素后以显式长度写入轨道，落稳态时清除内联值交回 CSS 规则。
  */
 export declare class WebUiCollapse extends LitElement {
     static styles: import('lit').CSSResult;
@@ -25,6 +29,21 @@ export declare class WebUiCollapse extends LitElement {
     horizontal: boolean;
     /** 关闭稳态保持内容 `inert` 而非 `hidden`（保留滚动位置，可测量）。 */
     keepMounted: boolean;
+    /**
+     * 关闭稳态露出的尺寸（CSS 长度，如 `120px`、`6rem`），沿动画轴生效：默认是高度，
+     * `horizontal` 时为宽度；未设置时保持完全收起。
+     *
+     * 设置后关闭稳态语义等同 `keep-mounted`（内容留在轨道内、`inert` 阻断交互），
+     * 只露出 `peek` 范围内的部分；内容本身不足 `peek` 时按内容实际尺寸收起。
+     * 注意 `peek` 是固定长度与内容自适应高度之间的过渡：CSS 无法在两者之间插值，
+     * 因此这两个方向的动画由本组件读出内容尺寸后以显式长度驱动（其余路径仍是
+     * 零测量的 grid fr 过渡）。
+     *
+     * 露出区域末端自带一段边缘渐隐（提示下方还有内容），长度由 `peek` 按比例推导，
+     * 无需也不接受调用方单独指定——见 style.css 中 `--wui-collapse-peek-edge-*`
+     * 系列变量（比例、上限、末端颜色可用 CSS 覆盖，属于主题级调优而非组件 API）。
+     */
+    peek: string | null;
     private _triggerWrapper;
     private _contentId;
     private readonly _userOpenChange;
@@ -42,6 +61,8 @@ export declare class WebUiCollapse extends LitElement {
     private _queryTrigger;
     private readonly _onTriggerSlotChange;
     private _syncTriggerAria;
+    /** 关闭稳态是否露出部分内容；空值与非空判断避免 `peek=""` 被当作有效长度。 */
+    private get _peeks();
     private _applyOpenSteadyState;
     private _applyClosedSteadyState;
     private _beginExpand;
@@ -49,7 +70,14 @@ export declare class WebUiCollapse extends LitElement {
     private _settle;
     private _awaitTransition;
     private _clearExitTimer;
+    private _syncPeek;
+    private _clampProperty;
+    private _measureInnerSize;
+    private _measureContentSize;
+    private _setInnerClamp;
+    private _clearInnerClamp;
     private _setInnerInert;
+    private _contentInner;
     private _contentContainer;
     private _contentTrack;
     render(): import('lit').TemplateResult<1>;

package/dist/components/collapse/index.js

@@ -7,9 +7,21 @@ import { LitElement as a, html as o, unsafeCSS as s } from "lit";
 import { customElement as c, property as l, query as u } from "lit/decorators.js";
 import { classMap as d } from "lit/directives/class-map.js";
 //#region src/components/collapse/index.ts
-var f = 80, p = 0, m = class extends a {
+var f = 80, p = "--wui-collapse-peek-edge-active";
+function m() {
+	if (!(typeof CSS > "u" || typeof CSS.registerProperty != "function")) try {
+		CSS.registerProperty({
+			name: p,
+			syntax: "<length>",
+			inherits: !1,
+			initialValue: "0px"
+		});
+	} catch {}
+}
+m();
+var h = 0, g = class extends a {
 	constructor(...e) {
-		super(...e), this.open = !1, this.disabled = !1, this.horizontal = !1, this.keepMounted = !1, this._contentId = `wui-collapse-content-${++p}`, this._userOpenChange = new r(), this._generation = 0, this._onTriggerClick = (e) => {
+		super(...e), this.open = !1, this.disabled = !1, this.horizontal = !1, this.keepMounted = !1, this.peek = null, this._contentId = `wui-collapse-content-${++h}`, this._userOpenChange = new r(), this._generation = 0, this._onTriggerClick = (e) => {
 			this.disabled || e.composedPath().includes(this._triggerWrapper) && (this._userOpenChange.mark(), this.toggle());
 		}, this._onTriggerSlotChange = () => {
 			this.requestUpdate();
@@ -25,11 +37,11 @@ var f = 80, p = 0, m = class extends a {
 		super.disconnectedCallback(), this._clearExitTimer();
 	}
 	updated(e) {
-		if (this._syncTriggerAria(), this._lastOpen === void 0) {
+		if (this._syncTriggerAria(), this._syncPeek(), this._lastOpen === void 0) {
 			this._lastOpen = this.open, this.open ? this._applyOpenSteadyState() : this._applyClosedSteadyState();
 			return;
 		}
-		e.has("keepMounted") && !this.open && this._applyClosedSteadyState(), !(!e.has("open") || this.open === this._lastOpen) && (this._lastOpen = this.open, this._userOpenChange.consume() && this._dispatchChange(this.open), this.open ? this._beginExpand() : this._beginCollapse());
+		(e.has("keepMounted") || e.has("peek")) && !this.open && this._applyClosedSteadyState(), !(!e.has("open") || this.open === this._lastOpen) && (this._lastOpen = this.open, this._userOpenChange.consume() && this._dispatchChange(this.open), this.open ? this._beginExpand() : this._beginCollapse());
 	}
 	show() {
 		this.open ||= !0;
@@ -51,15 +63,18 @@ var f = 80, p = 0, m = class extends a {
 		let e = this._queryTrigger();
 		e && (e.setAttribute("aria-expanded", String(this.open)), e.setAttribute("aria-controls", this._contentId), this.disabled ? e.setAttribute("aria-disabled", "true") : e.removeAttribute("aria-disabled"));
 	}
+	get _peeks() {
+		return typeof this.peek == "string" && this.peek.trim() !== "";
+	}
 	_applyOpenSteadyState() {
 		this._generation++, this._clearExitTimer();
 		let e = this._contentContainer(), t = this._contentTrack();
-		e && (e.hidden = !1), t && (t.dataset.wuiPresence = "open", this._setInnerInert(!1));
+		e && (e.hidden = !1), t && (t.dataset.wuiPresence = "open"), this._clearInnerClamp(), this._setInnerInert(!1);
 	}
 	_applyClosedSteadyState() {
 		this._generation++, this._clearExitTimer();
 		let e = this._contentContainer(), t = this._contentTrack();
-		if (t && delete t.dataset.wuiPresence, this.keepMounted) {
+		if (t && delete t.dataset.wuiPresence, this._clearInnerClamp(), this.keepMounted || this._peeks) {
 			e && (e.hidden = !1), this._setInnerInert(!0);
 			return;
 		}
@@ -69,49 +84,93 @@ var f = 80, p = 0, m = class extends a {
 		this._generation++, this._clearExitTimer();
 		let e = this._contentContainer(), t = this._contentTrack();
 		if (!e || !t) return;
-		let n = this._generation;
-		this._setInnerInert(!1), e.hidden = !1, t.offsetWidth, requestAnimationFrame(() => {
-			n !== this._generation || !this.open || (t.dataset.wuiPresence = "open", this._awaitTransition(t, n, () => this._settle(!0)));
+		let r = this._generation;
+		if (this._setInnerInert(!1), e.hidden = !1, this._peeks) {
+			let e = this._contentInner();
+			if (!e || n(e, 0) === 0) {
+				this._applyOpenSteadyState();
+				return;
+			}
+			let i = this._measureInnerSize(e), a = this._measureContentSize(e);
+			this._setInnerClamp(e, `${i}px`), this._measureInnerSize(e), t.dataset.wuiPresence = "open", this._setInnerClamp(e, `${a}px`), this._awaitTransition(e, r, () => this._settle(!0), [this._clampProperty()]);
+			return;
+		}
+		t.offsetWidth, requestAnimationFrame(() => {
+			r !== this._generation || !this.open || (t.dataset.wuiPresence = "open", this._awaitTransition(t, r, () => this._settle(!0)));
 		});
 	}
 	_beginCollapse() {
 		this._generation++, this._clearExitTimer();
 		let e = this._contentTrack();
 		if (!e) return;
-		this._setInnerInert(!0), e.dataset.wuiPresence = "closing";
+		this._setInnerInert(!0);
 		let t = this._generation;
-		this._awaitTransition(e, t, () => this._settle(!1));
+		if (this._peeks) {
+			let r = this._contentInner();
+			if (!r || n(r, 0) === 0) {
+				this._applyClosedSteadyState();
+				return;
+			}
+			let i = this._measureInnerSize(r);
+			this._setInnerClamp(r, `${i}px`), this._measureInnerSize(r), e.dataset.wuiPresence = "closing", this._setInnerClamp(r, `${this.peek}`), this._awaitTransition(r, t, () => this._settle(!1), [this._clampProperty()]);
+			return;
+		}
+		e.dataset.wuiPresence = "closing", this._awaitTransition(e, t, () => this._settle(!1));
 	}
 	_settle(e) {
-		if (this._clearExitTimer(), e) {
+		this._clearExitTimer();
+		let t = this._contentTrack();
+		if (this._clearInnerClamp(), e) {
 			this._setInnerInert(!1);
 			return;
 		}
-		let t = this._contentTrack();
-		if (t && delete t.dataset.wuiPresence, this.keepMounted) return;
+		if (t && delete t.dataset.wuiPresence, this.keepMounted || this._peeks) return;
 		let n = this._contentContainer();
 		this._setInnerInert(!1), n && (n.hidden = !0);
 	}
-	_awaitTransition(e, t, r) {
-		let i = n(e, 0);
-		if (i === 0) {
+	_awaitTransition(e, t, r, i = ["grid-template-rows", "grid-template-columns"]) {
+		let a = n(e, 0);
+		if (a === 0) {
 			t === this._generation && r();
 			return;
 		}
-		let a = !1, o = () => {
-			e.removeEventListener("transitionend", c), this._exitTimer === s && (this._exitTimer = void 0), clearTimeout(s), !(a || t !== this._generation) && (a = !0, r());
-		}, s = setTimeout(o, i + f);
-		this._exitTimer = s;
-		let c = (t) => {
-			t.target === e && (t.propertyName === "grid-template-rows" || t.propertyName === "grid-template-columns") && o();
+		let o = !1, s = () => {
+			e.removeEventListener("transitionend", l), this._exitTimer === c && (this._exitTimer = void 0), clearTimeout(c), !(o || t !== this._generation) && (o = !0, r());
+		}, c = setTimeout(s, a + f);
+		this._exitTimer = c;
+		let l = (t) => {
+			t.target === e && i.includes(t.propertyName) && s();
 		};
-		e.addEventListener("transitionend", c);
+		e.addEventListener("transitionend", l);
 	}
 	_clearExitTimer() {
 		this._exitTimer !== void 0 && (clearTimeout(this._exitTimer), this._exitTimer = void 0);
 	}
+	_syncPeek() {
+		let e = this._contentTrack();
+		e && (e.toggleAttribute("data-wui-peek", this._peeks), this._peeks ? e.style.setProperty("--wui-collapse-peek", this.peek ?? "") : e.style.removeProperty("--wui-collapse-peek"));
+	}
+	_clampProperty() {
+		return this.horizontal ? "max-width" : "max-height";
+	}
+	_measureInnerSize(e) {
+		return this.horizontal ? e.offsetWidth : e.offsetHeight;
+	}
+	_measureContentSize(e) {
+		return this.horizontal ? e.scrollWidth : e.scrollHeight;
+	}
+	_setInnerClamp(e, t) {
+		e.style.setProperty(this._clampProperty(), t);
+	}
+	_clearInnerClamp() {
+		let e = this._contentInner();
+		e && (e.style.removeProperty("max-height"), e.style.removeProperty("max-width"));
+	}
 	_setInnerInert(e) {
-		this.shadowRoot?.querySelector(".wui-collapse-inner")?.toggleAttribute("inert", e);
+		this._contentInner()?.toggleAttribute("inert", e);
+	}
+	_contentInner() {
+		return this.shadowRoot?.querySelector(".wui-collapse-inner") ?? null;
 	}
 	_contentContainer() {
 		return this.shadowRoot?.querySelector(".wui-collapse-content") ?? null;
@@ -139,18 +198,21 @@ var f = 80, p = 0, m = class extends a {
 e([l({
 	type: Boolean,
 	reflect: !0
-})], m.prototype, "open", void 0), e([l({
+})], g.prototype, "open", void 0), e([l({
 	type: Boolean,
 	reflect: !0
-})], m.prototype, "disabled", void 0), e([l({
+})], g.prototype, "disabled", void 0), e([l({
 	type: Boolean,
 	reflect: !0
-})], m.prototype, "horizontal", void 0), e([l({
+})], g.prototype, "horizontal", void 0), e([l({
 	type: Boolean,
 	reflect: !0,
 	attribute: "keep-mounted"
-})], m.prototype, "keepMounted", void 0), e([u(".wui-collapse-trigger-wrapper")], m.prototype, "_triggerWrapper", void 0), m = e([c("web-ui-collapse")], m);
+})], g.prototype, "keepMounted", void 0), e([l({
+	type: String,
+	reflect: !0
+})], g.prototype, "peek", void 0), e([u(".wui-collapse-trigger-wrapper")], g.prototype, "_triggerWrapper", void 0), g = e([c("web-ui-collapse")], g);
 //#endregion
-export { m as WebUiCollapse };
+export { g as WebUiCollapse };
 
 //# sourceMappingURL=index.js.map

package/dist/components/collapse/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/collapse/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\n\nimport { UserChangeController } from '@/shared/events/user-change'\nimport { dispatchOpenChangeEvent } from '@/shared/open-state'\nimport { getTransitionDuration } from '@/shared/overlay/presence'\n\nimport style from './style.css?inline'\n\nconst EXIT_FALLBACK_BUFFER = 80\n\nlet collapseIdCounter = 0\n\n/**\n * 文档流内折叠面板：trigger 经默认 slot 提供，内容经 `slot=\"content\"` 提供。\n *\n * trigger 语义完全来自 slot 进来的交互元素（原生 button / web-ui-button 等）：\n * Enter/Space 激活走该元素的原生 click，不做 role=\"button\" 补齐；组件把\n * `aria-expanded` / `aria-controls` / `aria-disabled` 回写到首个 assigned\n * element（与 popover trigger 的既定回写模式一致）。wrapper 仅负责点击代理，\n * 不可聚焦，不承载 ARIA。\n *\n * 内容区在 shadow 内以 grid `0fr ↔ 1fr` track 过渡驱动高度/宽度动画（ADR-0038\n * 选型保留）。关闭稳态三态（消费者 light DOM 永不移动，hidden 全部命令式管理，\n * 避免渲染绑定在关闭动画起点抢先 display:none）：\n * - 默认：content 容器 `hidden`（display:none，脱离渲染与可访问性树）；\n * - `keep-mounted`：inner `inert`（保留在 0fr 轨道内，滚动位置与布局可测量）；\n * - 动画进行中：inner `inert` + track pointer-events 禁用，结束后进入对应稳态。\n */\n@customElement('web-ui-collapse')\nexport class WebUiCollapse extends LitElement {\n  static override styles = unsafeCSS(style)\n\n  /** 展开状态；严格受控，唯一状态源。 */\n  @property({ type: Boolean, reflect: true }) open = false\n\n  /** 禁用触发：点击忽略、aria-disabled 写入 trigger 元素；已展开内容保持现状。 */\n  @property({ type: Boolean, reflect: true }) disabled = false\n\n  /** 水平方向：true 时沿宽度展开，默认沿高度。 */\n  @property({ type: Boolean, reflect: true }) horizontal = false\n\n  /** 关闭稳态保持内容 `inert` 而非 `hidden`（保留滚动位置，可测量）。 */\n  @property({ type: Boolean, reflect: true, attribute: 'keep-mounted' }) keepMounted = false\n\n  @query('.wui-collapse-trigger-wrapper') private _triggerWrapper!: HTMLElement\n\n  private _contentId = `wui-collapse-content-${++collapseIdCounter}`\n\n  private readonly _userOpenChange = new UserChangeController()\n\n  private _exitTimer?: ReturnType<typeof setTimeout>\n  // 动画代际：每次管线启动自增，旧管线的 transitionend/兜底定时器/rAF 全部失效。\n  private _generation = 0\n  private _lastOpen?: boolean\n\n  override connectedCallback() {\n    super.connectedCallback()\n    // 点击监听与生命周期同寿（宿主移除即整体销毁），无需 disconnected 清理。\n    this.addEventListener('click', this._onTriggerClick)\n    // 断连可能打断动画管线（瞬态残留：presence='closing'、容器未 hidden）。\n    // 首次连接不必处理（初始 render 走 _lastOpen===undefined 落稳态，请求多余\n    // 渲染会触发「scheduled an update after update completed」告警）；重连时\n    // 重置同步状态并强制一轮 update，由首次同步分支重新落稳态、丢弃在途管线。\n    if (this.hasUpdated) {\n      this._generation++\n      this._clearExitTimer()\n      this._lastOpen = undefined\n      this.requestUpdate()\n    }\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback()\n    this._clearExitTimer()\n  }\n\n  protected override updated(changed: Map<string, unknown>) {\n    // ARIA 回写不依赖 open 分支，任何渲染后都保持与宿主状态同步。\n    this._syncTriggerAria()\n\n    // 首次同步（含 open 为默认值的场景，changed map 不含默认值属性）：\n    // 直接落到正确稳态，不播动画（popover 初始 open 同款）。\n    if (this._lastOpen === undefined) {\n      this._lastOpen = this.open\n      if (this.open) this._applyOpenSteadyState()\n      else this._applyClosedSteadyState()\n      return\n    }\n\n    if (changed.has('keepMounted') && !this.open) {\n      // 运行态切换 keep-mounted：关闭稳态需在 hidden/inert 间重新落地。\n      this._applyClosedSteadyState()\n    }\n    if (!changed.has('open') || this.open === this._lastOpen) return\n\n    this._lastOpen = this.open\n    if (this._userOpenChange.consume()) this._dispatchChange(this.open)\n    if (this.open) this._beginExpand()\n    else this._beginCollapse()\n  }\n\n  show() {\n    if (this.open) return\n    this.open = true\n  }\n\n  close() {\n    if (!this.open) return\n    this.open = false\n  }\n\n  toggle() {\n    if (this.open) this.close()\n    else this.show()\n  }\n\n  // ===== trigger slot =====\n\n  private _dispatchChange(open: boolean) {\n    dispatchOpenChangeEvent(this, open)\n  }\n\n  /*\n   * 点击代理：冒泡路径穿过 trigger wrapper 的 click 一律切换。语义由 slot 内\n   * 的交互元素（原生 button / web-ui-button）提供；slot 放纯文本时无激活语义\n   * （README 约定）。内容区与嵌套内层 collapse 的 click 不经过本 wrapper，天然隔离。\n   */\n  private _onTriggerClick = (event: MouseEvent) => {\n    if (this.disabled) return\n    if (!event.composedPath().includes(this._triggerWrapper)) return\n    this._userOpenChange.mark()\n    this.toggle()\n  }\n\n  /*\n   * Trigger 元素取首个 assigned element（与 popover `_queryTrigger` 同款惰性查询，\n   * 不依赖 slotchange——jsdom 不派发该事件，无法用状态缓存）。slot 为空时无回写目标。\n   */\n  private _queryTrigger(): HTMLElement | null {\n    const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('.wui-collapse-trigger-wrapper slot')\n    const el = slot?.assignedElements()[0]\n    return el instanceof HTMLElement ? el : null\n  }\n\n  /*\n   * slot 内容增删不触发宿主响应式更新：显式请求一轮渲染，由 updated() 的\n   * ARIA 回写覆盖晚到的 trigger 元素（slotchange 在 jsdom 不派发，无法监听）。\n   */\n  private readonly _onTriggerSlotChange = () => {\n    this.requestUpdate()\n  }\n\n  // ARIA 状态回写到 trigger 元素本身（wrapper 不可聚焦，AT 读不到）。\n  private _syncTriggerAria() {\n    const trigger = this._queryTrigger()\n    if (!trigger) return\n    trigger.setAttribute('aria-expanded', String(this.open))\n    trigger.setAttribute('aria-controls', this._contentId)\n    if (this.disabled) trigger.setAttribute('aria-disabled', 'true')\n    else trigger.removeAttribute('aria-disabled')\n  }\n\n  // ===== 内容区动画管线（三态语义自 ADR-0038 迁移） =====\n\n  private _applyOpenSteadyState() {\n    this._generation++\n    this._clearExitTimer()\n    const container = this._contentContainer()\n    const track = this._contentTrack()\n    if (container) container.hidden = false\n    if (track) {\n      track.dataset.wuiPresence = 'open'\n      this._setInnerInert(false)\n    }\n  }\n\n  private _applyClosedSteadyState() {\n    this._generation++\n    this._clearExitTimer()\n    const container = this._contentContainer()\n    const track = this._contentTrack()\n    if (track) delete track.dataset.wuiPresence\n    if (this.keepMounted) {\n      if (container) container.hidden = false\n      this._setInnerInert(true)\n      return\n    }\n    this._setInnerInert(false)\n    if (container) container.hidden = true\n  }\n\n  private _beginExpand() {\n    this._generation++\n    this._clearExitTimer()\n    const container = this._contentContainer()\n    const track = this._contentTrack()\n    if (!container || !track) return\n\n    const generation = this._generation\n    // 中断关闭动画时 inner 已 inert：先恢复可交互，内容随展开重新可见。\n    this._setInnerInert(false)\n    // 从 display:none 进入时无先前计算样式可过渡：提交 0fr 起点后再翻转。\n    container.hidden = false\n    void track.offsetWidth\n\n    requestAnimationFrame(() => {\n      if (generation !== this._generation || !this.open) return\n      track.dataset.wuiPresence = 'open'\n      this._awaitTransition(track, generation, () => this._settle(true))\n    })\n  }\n\n  private _beginCollapse() {\n    this._generation++\n    this._clearExitTimer()\n    const track = this._contentTrack()\n    if (!track) return\n\n    // 收起期间立即阻断交互，防止焦点落入正在消失的区域。\n    this._setInnerInert(true)\n    track.dataset.wuiPresence = 'closing'\n    const generation = this._generation\n    this._awaitTransition(track, generation, () => this._settle(false))\n  }\n\n  // 关闭稳态：keep-mounted → 内容保留在 0fr 轨道内并 inert；默认 → 容器 hidden。\n  private _settle(open: boolean) {\n    this._clearExitTimer()\n    if (open) {\n      this._setInnerInert(false)\n      return\n    }\n    // 落稳态必须清除 closing 瞬态标记：否则 track 永久保留 pointer-events:none\n    // 与 exit 过渡配置（keep-mounted 分支同样清除，避免残留）。\n    const track = this._contentTrack()\n    if (track) delete track.dataset.wuiPresence\n    if (this.keepMounted) return\n    const container = this._contentContainer()\n    this._setInnerInert(false)\n    if (container) container.hidden = true\n  }\n\n  // 等待 grid-template-rows/columns 过渡结束；时长为 0（reduced motion、jsdom）\n  // 直接稳态，transitionend 不触发时按时长 + 缓冲兜底。\n  private _awaitTransition(track: HTMLElement, generation: number, onDone: () => void) {\n    const duration = getTransitionDuration(track, 0)\n    if (duration === 0) {\n      if (generation === this._generation) onDone()\n      return\n    }\n\n    let settled = false\n    const finish = () => {\n      track.removeEventListener('transitionend', onTransitionEnd)\n      if (this._exitTimer === timer) this._exitTimer = undefined\n      clearTimeout(timer)\n      // 过渡可能被属性匹配的后续动画触发（如中断重开）：代际不符时静默退场。\n      if (settled || generation !== this._generation) return\n      settled = true\n      onDone()\n    }\n    const timer = setTimeout(finish, duration + EXIT_FALLBACK_BUFFER)\n    this._exitTimer = timer\n\n    const onTransitionEnd = (event: TransitionEvent) => {\n      if (\n        event.target === track &&\n        (event.propertyName === 'grid-template-rows' || event.propertyName === 'grid-template-columns')\n      )\n        finish()\n    }\n    track.addEventListener('transitionend', onTransitionEnd)\n  }\n\n  private _clearExitTimer() {\n    if (this._exitTimer !== undefined) {\n      clearTimeout(this._exitTimer)\n      this._exitTimer = undefined\n    }\n  }\n\n  private _setInnerInert(inert: boolean) {\n    this.shadowRoot?.querySelector<HTMLElement>('.wui-collapse-inner')?.toggleAttribute('inert', inert)\n  }\n\n  private _contentContainer(): HTMLElement | null {\n    return this.shadowRoot?.querySelector<HTMLElement>('.wui-collapse-content') ?? null\n  }\n\n  private _contentTrack(): HTMLElement | null {\n    return this.shadowRoot?.querySelector<HTMLElement>('.wui-collapse-track') ?? null\n  }\n\n  override render() {\n    // 三态由 data-wui-presence 驱动（open/closing），缺省即关闭稳态。\n    const trackClass = {\n      'wui-collapse-track': true,\n      'is-horizontal': this.horizontal\n    }\n\n    return html`\n      <div class=\"wui-collapse-trigger-wrapper\" @slotchange=${this._onTriggerSlotChange}><slot></slot></div>\n      <div class=\"wui-collapse-content\">\n        <div class=${classMap(trackClass)} id=${this._contentId}>\n          <div class=\"wui-collapse-inner\">\n            <slot name=\"content\"></slot>\n          </div>\n        </div>\n      </div>\n    `\n  }\n\n  declare readonly $events: {\n    'open-change': CustomEvent<{ open: boolean }>\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-collapse': WebUiCollapse\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/collapse/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\n\nimport { UserChangeController } from '@/shared/events/user-change'\nimport { dispatchOpenChangeEvent } from '@/shared/open-state'\nimport { getTransitionDuration } from '@/shared/overlay/presence'\n\nimport style from './style.css?inline'\n\nconst EXIT_FALLBACK_BUFFER = 80\n\n/** peek 边缘渐隐的活动长度：关闭/收起态取由 peek 推导的长度，展开态归 0。 */\nconst PEEK_EDGE_ACTIVE = '--wui-collapse-peek-edge-active'\n\n/*\n * 注册成 `<length>` 才能被 transition 插值（未注册的自定义属性是离散值，只能瞬变）。\n *\n * 必须用 JS 的 `CSS.registerProperty` 而不是 CSS 里的 `@property`：实测后者写在\n * shadow root 的样式表里不产生注册（getComputedStyle 读打开态得到空串而非\n * initial-value），而自定义属性的注册本质上是 document 级的。\n * 注册失败（jsdom、旧浏览器、重复注册）时降级为离散过渡——渐变带长度瞬变，\n * 但位置百分比仍跟随裁剪边缘，行为依旧正确。\n */\nfunction registerPeekEdgeActive() {\n  // jsdom 与不支持的环境直接跳过；样式里的 var() fallback 保证声明仍然有效。\n  if (typeof CSS === 'undefined' || typeof CSS.registerProperty !== 'function') return\n  try {\n    CSS.registerProperty({\n      name: PEEK_EDGE_ACTIVE,\n      syntax: '<length>',\n      inherits: false,\n      initialValue: '0px'\n    })\n  } catch {\n    // 已注册过（HMR、多份副本）或定义冲突：保持现有注册即可。\n  }\n}\n\nregisterPeekEdgeActive()\n\nlet collapseIdCounter = 0\n\n/**\n * 文档流内折叠面板：trigger 经默认 slot 提供，内容经 `slot=\"content\"` 提供。\n *\n * trigger 语义完全来自 slot 进来的交互元素（原生 button / web-ui-button 等）：\n * Enter/Space 激活走该元素的原生 click，不做 role=\"button\" 补齐；组件把\n * `aria-expanded` / `aria-controls` / `aria-disabled` 回写到首个 assigned\n * element（与 popover trigger 的既定回写模式一致）。wrapper 仅负责点击代理，\n * 不可聚焦，不承载 ARIA。\n *\n * 内容区在 shadow 内以 grid `0fr ↔ 1fr` track 过渡驱动高度/宽度动画（ADR-0030\n * 选型保留）。关闭稳态三态（消费者 light DOM 永不移动，hidden 全部命令式管理，\n * 避免渲染绑定在关闭动画起点抢先 display:none）：\n * - 默认：content 容器 `hidden`（display:none，脱离渲染与可访问性树）；\n * - `keep-mounted`：inner `inert`（保留在 0fr 轨道内，滚动位置与布局可测量）；\n * - `peek`：inner `inert`，轨道停在固定长度的裁剪窗口，只露出内容头部；\n * - 动画进行中：inner `inert` + track pointer-events 禁用，结束后进入对应稳态。\n *\n * `peek` 与展开态之间是固定长度与内容自适应高度的过渡，CSS 无法插值；这两个\n * 方向的动画改为读出像素后以显式长度写入轨道，落稳态时清除内联值交回 CSS 规则。\n */\n@customElement('web-ui-collapse')\nexport class WebUiCollapse extends LitElement {\n  static override styles = unsafeCSS(style)\n\n  /** 展开状态；严格受控，唯一状态源。 */\n  @property({ type: Boolean, reflect: true }) open = false\n\n  /** 禁用触发：点击忽略、aria-disabled 写入 trigger 元素；已展开内容保持现状。 */\n  @property({ type: Boolean, reflect: true }) disabled = false\n\n  /** 水平方向：true 时沿宽度展开，默认沿高度。 */\n  @property({ type: Boolean, reflect: true }) horizontal = false\n\n  /** 关闭稳态保持内容 `inert` 而非 `hidden`（保留滚动位置，可测量）。 */\n  @property({ type: Boolean, reflect: true, attribute: 'keep-mounted' }) keepMounted = false\n\n  /**\n   * 关闭稳态露出的尺寸（CSS 长度，如 `120px`、`6rem`），沿动画轴生效：默认是高度，\n   * `horizontal` 时为宽度；未设置时保持完全收起。\n   *\n   * 设置后关闭稳态语义等同 `keep-mounted`（内容留在轨道内、`inert` 阻断交互），\n   * 只露出 `peek` 范围内的部分；内容本身不足 `peek` 时按内容实际尺寸收起。\n   * 注意 `peek` 是固定长度与内容自适应高度之间的过渡：CSS 无法在两者之间插值，\n   * 因此这两个方向的动画由本组件读出内容尺寸后以显式长度驱动（其余路径仍是\n   * 零测量的 grid fr 过渡）。\n   *\n   * 露出区域末端自带一段边缘渐隐（提示下方还有内容），长度由 `peek` 按比例推导，\n   * 无需也不接受调用方单独指定——见 style.css 中 `--wui-collapse-peek-edge-*`\n   * 系列变量（比例、上限、末端颜色可用 CSS 覆盖，属于主题级调优而非组件 API）。\n   */\n  @property({ type: String, reflect: true }) peek: string | null = null\n\n  @query('.wui-collapse-trigger-wrapper') private _triggerWrapper!: HTMLElement\n\n  private _contentId = `wui-collapse-content-${++collapseIdCounter}`\n\n  private readonly _userOpenChange = new UserChangeController()\n\n  private _exitTimer?: ReturnType<typeof setTimeout>\n  // 动画代际：每次管线启动自增，旧管线的 transitionend/兜底定时器/rAF 全部失效。\n  private _generation = 0\n  private _lastOpen?: boolean\n\n  override connectedCallback() {\n    super.connectedCallback()\n    // 点击监听与生命周期同寿（宿主移除即整体销毁），无需 disconnected 清理。\n    this.addEventListener('click', this._onTriggerClick)\n    // 断连可能打断动画管线（瞬态残留：presence='closing'、容器未 hidden）。\n    // 首次连接不必处理（初始 render 走 _lastOpen===undefined 落稳态，请求多余\n    // 渲染会触发「scheduled an update after update completed」告警）；重连时\n    // 重置同步状态并强制一轮 update，由首次同步分支重新落稳态、丢弃在途管线。\n    if (this.hasUpdated) {\n      this._generation++\n      this._clearExitTimer()\n      this._lastOpen = undefined\n      this.requestUpdate()\n    }\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback()\n    this._clearExitTimer()\n  }\n\n  protected override updated(changed: Map<string, unknown>) {\n    // ARIA 回写不依赖 open 分支，任何渲染后都保持与宿主状态同步。\n    this._syncTriggerAria()\n    // peek 的稳态长度与动画写入共用轨道内联样式，先同步再落稳态，避免被稳态清除。\n    this._syncPeek()\n\n    // 首次同步（含 open 为默认值的场景，changed map 不含默认值属性）：\n    // 直接落到正确稳态，不播动画（popover 初始 open 同款）。\n    if (this._lastOpen === undefined) {\n      this._lastOpen = this.open\n      if (this.open) this._applyOpenSteadyState()\n      else this._applyClosedSteadyState()\n      return\n    }\n\n    if ((changed.has('keepMounted') || changed.has('peek')) && !this.open) {\n      // 运行态切换 keep-mounted / peek：关闭稳态需在 hidden / inert / 裁剪长度间重新落地。\n      this._applyClosedSteadyState()\n    }\n    if (!changed.has('open') || this.open === this._lastOpen) return\n\n    this._lastOpen = this.open\n    if (this._userOpenChange.consume()) this._dispatchChange(this.open)\n    if (this.open) this._beginExpand()\n    else this._beginCollapse()\n  }\n\n  show() {\n    if (this.open) return\n    this.open = true\n  }\n\n  close() {\n    if (!this.open) return\n    this.open = false\n  }\n\n  toggle() {\n    if (this.open) this.close()\n    else this.show()\n  }\n\n  // ===== trigger slot =====\n\n  private _dispatchChange(open: boolean) {\n    dispatchOpenChangeEvent(this, open)\n  }\n\n  /*\n   * 点击代理：冒泡路径穿过 trigger wrapper 的 click 一律切换。语义由 slot 内\n   * 的交互元素（原生 button / web-ui-button）提供；slot 放纯文本时无激活语义\n   * （README 约定）。内容区与嵌套内层 collapse 的 click 不经过本 wrapper，天然隔离。\n   */\n  private _onTriggerClick = (event: MouseEvent) => {\n    if (this.disabled) return\n    if (!event.composedPath().includes(this._triggerWrapper)) return\n    this._userOpenChange.mark()\n    this.toggle()\n  }\n\n  /*\n   * Trigger 元素取首个 assigned element（与 popover `_queryTrigger` 同款惰性查询，\n   * 不依赖 slotchange——jsdom 不派发该事件，无法用状态缓存）。slot 为空时无回写目标。\n   */\n  private _queryTrigger(): HTMLElement | null {\n    const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('.wui-collapse-trigger-wrapper slot')\n    const el = slot?.assignedElements()[0]\n    return el instanceof HTMLElement ? el : null\n  }\n\n  /*\n   * slot 内容增删不触发宿主响应式更新：显式请求一轮渲染，由 updated() 的\n   * ARIA 回写覆盖晚到的 trigger 元素（slotchange 在 jsdom 不派发，无法监听）。\n   */\n  private readonly _onTriggerSlotChange = () => {\n    this.requestUpdate()\n  }\n\n  // ARIA 状态回写到 trigger 元素本身（wrapper 不可聚焦，AT 读不到）。\n  private _syncTriggerAria() {\n    const trigger = this._queryTrigger()\n    if (!trigger) return\n    trigger.setAttribute('aria-expanded', String(this.open))\n    trigger.setAttribute('aria-controls', this._contentId)\n    if (this.disabled) trigger.setAttribute('aria-disabled', 'true')\n    else trigger.removeAttribute('aria-disabled')\n  }\n\n  // ===== 内容区动画管线（三态语义自 ADR-0030 迁移） =====\n\n  /** 关闭稳态是否露出部分内容；空值与非空判断避免 `peek=\"\"` 被当作有效长度。 */\n  private get _peeks(): boolean {\n    return typeof this.peek === 'string' && this.peek.trim() !== ''\n  }\n\n  private _applyOpenSteadyState() {\n    this._generation++\n    this._clearExitTimer()\n    const container = this._contentContainer()\n    const track = this._contentTrack()\n    if (container) container.hidden = false\n    if (track) track.dataset.wuiPresence = 'open'\n    this._clearInnerClamp()\n    this._setInnerInert(false)\n  }\n\n  private _applyClosedSteadyState() {\n    this._generation++\n    this._clearExitTimer()\n    const container = this._contentContainer()\n    const track = this._contentTrack()\n    if (track) delete track.dataset.wuiPresence\n    this._clearInnerClamp()\n    if (this.keepMounted || this._peeks) {\n      if (container) container.hidden = false\n      this._setInnerInert(true)\n      return\n    }\n    this._setInnerInert(false)\n    if (container) container.hidden = true\n  }\n\n  private _beginExpand() {\n    this._generation++\n    this._clearExitTimer()\n    const container = this._contentContainer()\n    const track = this._contentTrack()\n    if (!container || !track) return\n\n    const generation = this._generation\n    // 中断关闭动画时 inner 已 inert：先恢复可交互，内容随展开重新可见。\n    this._setInnerInert(false)\n    // 从 display:none 进入时无先前计算样式可过渡：提交 0fr 起点后再翻转。\n    container.hidden = false\n\n    if (this._peeks) {\n      const inner = this._contentInner()\n      // 无过渡时长（reduced motion、jsdom）或无 inner 时不做测量，直接落展开稳态。\n      if (!inner || getTransitionDuration(inner, 0) === 0) {\n        this._applyOpenSteadyState()\n        return\n      }\n      /*\n       * peek 的裁剪长度是固定值，展开目标是内容自适应高度，两者无法由 CSS 插值，\n       * 动画必须由两个显式长度驱动：起点是当前露出的长度，目标是内容完整尺寸。\n       * 起点要在同任务内先写入并提交回流，否则过渡会退化成跳变（实测分帧写入\n       * 反而完全不参与插值判定）；目标读 inner 的 scroll 尺寸，不写探针样式。\n       */\n      const from = this._measureInnerSize(inner)\n      const to = this._measureContentSize(inner)\n      this._setInnerClamp(inner, `${from}px`)\n      void this._measureInnerSize(inner)\n      track.dataset.wuiPresence = 'open'\n      this._setInnerClamp(inner, `${to}px`)\n      this._awaitTransition(inner, generation, () => this._settle(true), [this._clampProperty()])\n      return\n    }\n\n    void track.offsetWidth\n\n    requestAnimationFrame(() => {\n      if (generation !== this._generation || !this.open) return\n      track.dataset.wuiPresence = 'open'\n      this._awaitTransition(track, generation, () => this._settle(true))\n    })\n  }\n\n  private _beginCollapse() {\n    this._generation++\n    this._clearExitTimer()\n    const track = this._contentTrack()\n    if (!track) return\n\n    // 收起期间立即阻断交互，防止焦点落入正在消失的区域。\n    this._setInnerInert(true)\n    const generation = this._generation\n\n    if (this._peeks) {\n      const inner = this._contentInner()\n      // 无过渡时长（reduced motion、jsdom）或无 inner 时不做测量，直接落裁剪稳态。\n      if (!inner || getTransitionDuration(inner, 0) === 0) {\n        this._applyClosedSteadyState()\n        return\n      }\n      /*\n       * 收起目标是 `peek` 长度本身：与内容尺寸的较小值由 CSS 稳态规则解析，\n       * 动画只需把当前展开长度过渡到这个长度。起点同样要先写入并提交回流，\n       * 顺序与 _beginExpand 一致。\n       */\n      const from = this._measureInnerSize(inner)\n      this._setInnerClamp(inner, `${from}px`)\n      void this._measureInnerSize(inner)\n      track.dataset.wuiPresence = 'closing'\n      this._setInnerClamp(inner, `${this.peek}`)\n      this._awaitTransition(inner, generation, () => this._settle(false), [this._clampProperty()])\n      return\n    }\n\n    track.dataset.wuiPresence = 'closing'\n    this._awaitTransition(track, generation, () => this._settle(false))\n  }\n\n  // 关闭稳态：keep-mounted → 内容保留在 0fr 轨道内并 inert；peek → 保留在裁剪\n  // 窗口内并 inert；默认 → 容器 hidden。\n  private _settle(open: boolean) {\n    this._clearExitTimer()\n    const track = this._contentTrack()\n    // peek 过渡以显式长度写入 inner：落稳态一律清除，交回 CSS 稳态规则（长度声明）。\n    this._clearInnerClamp()\n    if (open) {\n      this._setInnerInert(false)\n      return\n    }\n    // 落稳态必须清除 closing 瞬态标记：否则 track 永久保留 pointer-events:none\n    // 与 exit 过渡配置（keep-mounted 分支同样清除，避免残留）。\n    if (track) delete track.dataset.wuiPresence\n    if (this.keepMounted || this._peeks) return\n    const container = this._contentContainer()\n    this._setInnerInert(false)\n    if (container) container.hidden = true\n  }\n\n  // 等待动画属性过渡结束；时长为 0（reduced motion、jsdom）直接稳态，\n  // transitionend 不触发时按时长 + 缓冲兜底。默认等待 grid 轨道过渡；peek 的\n  // 过渡落在 inner 的裁剪长度上，由调用方传入对应属性。\n  private _awaitTransition(\n    animated: HTMLElement,\n    generation: number,\n    onDone: () => void,\n    properties: readonly string[] = ['grid-template-rows', 'grid-template-columns']\n  ) {\n    const duration = getTransitionDuration(animated, 0)\n    if (duration === 0) {\n      if (generation === this._generation) onDone()\n      return\n    }\n\n    let settled = false\n    const finish = () => {\n      animated.removeEventListener('transitionend', onTransitionEnd)\n      if (this._exitTimer === timer) this._exitTimer = undefined\n      clearTimeout(timer)\n      // 过渡可能被属性匹配的后续动画触发（如中断重开）：代际不符时静默退场。\n      if (settled || generation !== this._generation) return\n      settled = true\n      onDone()\n    }\n    const timer = setTimeout(finish, duration + EXIT_FALLBACK_BUFFER)\n    this._exitTimer = timer\n\n    const onTransitionEnd = (event: TransitionEvent) => {\n      if (event.target === animated && properties.includes(event.propertyName)) finish()\n    }\n    animated.addEventListener('transitionend', onTransitionEnd)\n  }\n\n  private _clearExitTimer() {\n    if (this._exitTimer !== undefined) {\n      clearTimeout(this._exitTimer)\n      this._exitTimer = undefined\n    }\n  }\n\n  // ===== peek 尺寸读写（裁剪长度落在 inner 上，轨道只负责 1fr 与裁剪窗口） =====\n\n  /*\n   * peek 长度经自定义属性下发给 shadow 样式规则，而不是直接写 inner 的裁剪长度：\n   * 关闭稳态由 CSS 声明（长度与内容尺寸的较小值由 CSS 原生解析），动画写入的内联\n   * 长度在其上覆盖，落稳态时清除即可回到声明值。\n   */\n  private _syncPeek() {\n    const track = this._contentTrack()\n    if (!track) return\n    track.toggleAttribute('data-wui-peek', this._peeks)\n    if (this._peeks) {\n      track.style.setProperty('--wui-collapse-peek', this.peek ?? '')\n    } else {\n      track.style.removeProperty('--wui-collapse-peek')\n    }\n  }\n\n  private _clampProperty(): 'max-height' | 'max-width' {\n    return this.horizontal ? 'max-width' : 'max-height'\n  }\n\n  private _measureInnerSize(inner: HTMLElement): number {\n    return this.horizontal ? inner.offsetWidth : inner.offsetHeight\n  }\n\n  /*\n   * 内容在动画轴上的完整尺寸（px）：裁剪只作用在 inner 的 max-height/max-width 上，\n   * 被测内容的布局盒子仍是完整尺寸，故读 scroll 尺寸即可，不写任何样式——写样式\n   * 会被 grid 过渡机制当作过渡起点读取，必须避开。\n   */\n  private _measureContentSize(inner: HTMLElement): number {\n    return this.horizontal ? inner.scrollWidth : inner.scrollHeight\n  }\n\n  private _setInnerClamp(inner: HTMLElement, size: string) {\n    inner.style.setProperty(this._clampProperty(), size)\n  }\n\n  private _clearInnerClamp() {\n    const inner = this._contentInner()\n    if (!inner) return\n    inner.style.removeProperty('max-height')\n    inner.style.removeProperty('max-width')\n  }\n\n  private _setInnerInert(inert: boolean) {\n    this._contentInner()?.toggleAttribute('inert', inert)\n  }\n\n  private _contentInner(): HTMLElement | null {\n    return this.shadowRoot?.querySelector<HTMLElement>('.wui-collapse-inner') ?? null\n  }\n\n  private _contentContainer(): HTMLElement | null {\n    return this.shadowRoot?.querySelector<HTMLElement>('.wui-collapse-content') ?? null\n  }\n\n  private _contentTrack(): HTMLElement | null {\n    return this.shadowRoot?.querySelector<HTMLElement>('.wui-collapse-track') ?? null\n  }\n\n  override render() {\n    // 三态由 data-wui-presence 驱动（open/closing），缺省即关闭稳态。\n    const trackClass = {\n      'wui-collapse-track': true,\n      'is-horizontal': this.horizontal\n    }\n\n    return html`\n      <div class=\"wui-collapse-trigger-wrapper\" @slotchange=${this._onTriggerSlotChange}><slot></slot></div>\n      <div class=\"wui-collapse-content\">\n        <div class=${classMap(trackClass)} id=${this._contentId}>\n          <div class=\"wui-collapse-inner\">\n            <slot name=\"content\"></slot>\n          </div>\n        </div>\n      </div>\n    `\n  }\n\n  declare readonly $events: {\n    'open-change': CustomEvent<{ open: boolean }>\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-collapse': WebUiCollapse\n  }\n}\n"],"mappings":"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"}

package/dist/components/collapse/style.js

@@ -1,5 +1,5 @@
 //#region src/components/collapse/style.css?inline
-var e = "*,:before,:after{box-sizing:border-box}:host{display:block}.wui-collapse-track{transition:grid-template-rows var(--wui-duration-collapse-enter,.2s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1));grid-template-rows:0fr;display:grid}.wui-collapse-track.is-horizontal{width:max-content;transition:grid-template-columns var(--wui-duration-collapse-enter,.2s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1));grid-template-rows:none;grid-template-columns:0fr}.wui-collapse-track[data-wui-presence=open]{grid-template-rows:1fr}.wui-collapse-track[data-wui-presence=open].is-horizontal{grid-template-rows:none;grid-template-columns:1fr}.wui-collapse-track[data-wui-presence=closing]{pointer-events:none;transition:grid-template-rows var(--wui-duration-collapse-exit,.16s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1))}.wui-collapse-track[data-wui-presence=closing].is-horizontal{transition:grid-template-columns var(--wui-duration-collapse-exit,.16s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1))}.wui-collapse-inner{min-height:0;overflow:hidden}.is-horizontal .wui-collapse-inner{min-width:0}";
+var e = "*,:before,:after{box-sizing:border-box}:host{display:block}.wui-collapse-track{transition:grid-template-rows var(--wui-duration-collapse-enter,.2s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1));grid-template-rows:0fr;display:grid}.wui-collapse-track.is-horizontal{width:max-content;transition:grid-template-columns var(--wui-duration-collapse-enter,.2s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1));grid-template-rows:none;grid-template-columns:0fr}.wui-collapse-track[data-wui-presence=open]{grid-template-rows:1fr}.wui-collapse-track[data-wui-presence=open].is-horizontal{grid-template-rows:none;grid-template-columns:1fr}.wui-collapse-track[data-wui-presence=closing]{pointer-events:none;transition:grid-template-rows var(--wui-duration-collapse-exit,.16s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1))}.wui-collapse-track[data-wui-presence=closing].is-horizontal{transition:grid-template-columns var(--wui-duration-collapse-exit,.16s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1))}.wui-collapse-track[data-wui-peek]{grid-template-rows:1fr}.wui-collapse-track[data-wui-peek].is-horizontal{grid-template-rows:none;grid-template-columns:1fr}.wui-collapse-inner{min-height:0;transition:max-height var(--wui-duration-collapse-enter,.2s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1)), --wui-collapse-peek-edge-active var(--wui-duration-collapse-enter,.2s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1));overflow:hidden}.is-horizontal .wui-collapse-inner{min-width:0;transition-property:max-width,--wui-collapse-peek-edge-active}.wui-collapse-track[data-wui-presence=closing] .wui-collapse-inner{transition-duration:var(--wui-duration-collapse-exit,.16s)}.wui-collapse-track[data-wui-peek] .wui-collapse-inner{-webkit-mask-image:linear-gradient(to bottom, black 0%, black calc(100% - var(--wui-collapse-peek-edge-active,0px)), #0009 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .7), #00000042 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .35), var(--wui-collapse-peek-edge-color,transparent) 100%);-webkit-mask-image:linear-gradient(to bottom, black 0%, black calc(100% - var(--wui-collapse-peek-edge-active,0px)), #0009 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .7), #00000042 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .35), var(--wui-collapse-peek-edge-color,transparent) 100%);mask-image:linear-gradient(to bottom, black 0%, black calc(100% - var(--wui-collapse-peek-edge-active,0px)), #0009 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .7), #00000042 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .35), var(--wui-collapse-peek-edge-color,transparent) 100%)}.wui-collapse-track[data-wui-peek].is-horizontal .wui-collapse-inner{-webkit-mask-image:linear-gradient(to right, black 0%, black calc(100% - var(--wui-collapse-peek-edge-active,0px)), #0009 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .7), #00000042 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .35), var(--wui-collapse-peek-edge-color,transparent) 100%);-webkit-mask-image:linear-gradient(to right, black 0%, black calc(100% - var(--wui-collapse-peek-edge-active,0px)), #0009 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .7), #00000042 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .35), var(--wui-collapse-peek-edge-color,transparent) 100%);mask-image:linear-gradient(to right, black 0%, black calc(100% - var(--wui-collapse-peek-edge-active,0px)), #0009 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .7), #00000042 calc(100% - var(--wui-collapse-peek-edge-active,0px) * .35), var(--wui-collapse-peek-edge-color,transparent) 100%)}.wui-collapse-track[data-wui-peek]:not([data-wui-presence]) .wui-collapse-inner{max-height:var(--wui-collapse-peek,0)}.wui-collapse-track[data-wui-peek]:not([data-wui-presence=open]) .wui-collapse-inner{--wui-collapse-peek-edge-active:var(--wui-collapse-peek-edge,clamp(0px, calc(var(--wui-collapse-peek,0px) * var(--wui-collapse-peek-edge-ratio,.4)), var(--wui-collapse-peek-edge-max,112px)))}.wui-collapse-track[data-wui-peek]:not([data-wui-presence]).is-horizontal .wui-collapse-inner{max-width:var(--wui-collapse-peek,0)}";
 //#endregion
 export { e as default };