@greypan/web-ui 6.4.0 → 7.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (126) hide show
  1. package/README.CN.md +134 -40
  2. package/README.md +145 -51
  3. package/dist/assets/glass.js +1 -1
  4. package/dist/assets/glass.js.map +1 -1
  5. package/dist/assets/selection-control.js +6 -0
  6. package/dist/assets/selection-control.js.map +1 -0
  7. package/dist/assets/toast-containers.js.map +1 -1
  8. package/dist/components/autocomplete/index.d.ts +2 -0
  9. package/dist/components/autocomplete/index.js +19 -20
  10. package/dist/components/autocomplete/index.js.map +1 -1
  11. package/dist/components/autocomplete/style.js.map +1 -1
  12. package/dist/components/badge/style.js.map +1 -1
  13. package/dist/components/button/style.js.map +1 -1
  14. package/dist/components/checkbox/index.d.ts +9 -2
  15. package/dist/components/checkbox/index.js +50 -26
  16. package/dist/components/checkbox/index.js.map +1 -1
  17. package/dist/components/checkbox/style.js +1 -1
  18. package/dist/components/checkbox/style.js.map +1 -1
  19. package/dist/components/checkbox-group/index.d.ts +3 -0
  20. package/dist/components/checkbox-group/index.js +24 -13
  21. package/dist/components/checkbox-group/index.js.map +1 -1
  22. package/dist/components/checkbox-group/style.js +1 -1
  23. package/dist/components/checkbox-group/style.js.map +1 -1
  24. package/dist/components/collapse/index.js.map +1 -1
  25. package/dist/components/context-menu/index.d.ts +10 -0
  26. package/dist/components/context-menu/index.js +48 -34
  27. package/dist/components/context-menu/index.js.map +1 -1
  28. package/dist/components/dialog/index.d.ts +6 -0
  29. package/dist/components/dialog/index.js +45 -20
  30. package/dist/components/dialog/index.js.map +1 -1
  31. package/dist/components/dialog/style.js +1 -1
  32. package/dist/components/dialog/style.js.map +1 -1
  33. package/dist/components/drawer/index.d.ts +22 -4
  34. package/dist/components/drawer/index.js +134 -106
  35. package/dist/components/drawer/index.js.map +1 -1
  36. package/dist/components/drawer/style.js +1 -1
  37. package/dist/components/drawer/style.js.map +1 -1
  38. package/dist/components/dropdown/index.d.ts +21 -1
  39. package/dist/components/dropdown/index.js +74 -51
  40. package/dist/components/dropdown/index.js.map +1 -1
  41. package/dist/components/image-preview/index.js +86 -66
  42. package/dist/components/image-preview/index.js.map +1 -1
  43. package/dist/components/image-preview/style.js +1 -1
  44. package/dist/components/image-preview/style.js.map +1 -1
  45. package/dist/components/index.js +29 -29
  46. package/dist/components/input/index.js +2 -2
  47. package/dist/components/input/index.js.map +1 -1
  48. package/dist/components/input/style.js.map +1 -1
  49. package/dist/components/layout/index.js +2 -2
  50. package/dist/components/layout/index.js.map +1 -1
  51. package/dist/components/layout/style.js +1 -1
  52. package/dist/components/layout/style.js.map +1 -1
  53. package/dist/components/popover/index.d.ts +8 -2
  54. package/dist/components/popover/index.js +47 -52
  55. package/dist/components/popover/index.js.map +1 -1
  56. package/dist/components/radio/index.d.ts +1 -1
  57. package/dist/components/radio/index.js +14 -13
  58. package/dist/components/radio/index.js.map +1 -1
  59. package/dist/components/radio/style.js +1 -1
  60. package/dist/components/radio/style.js.map +1 -1
  61. package/dist/components/radio-group/index.d.ts +3 -0
  62. package/dist/components/radio-group/index.js +24 -13
  63. package/dist/components/radio-group/index.js.map +1 -1
  64. package/dist/components/radio-group/style.js +1 -1
  65. package/dist/components/radio-group/style.js.map +1 -1
  66. package/dist/components/segmented/style.js +1 -1
  67. package/dist/components/segmented/style.js.map +1 -1
  68. package/dist/components/select/index.d.ts +2 -0
  69. package/dist/components/select/index.js +20 -19
  70. package/dist/components/select/index.js.map +1 -1
  71. package/dist/components/slider/index.js.map +1 -1
  72. package/dist/components/slider/style.js +1 -1
  73. package/dist/components/slider/style.js.map +1 -1
  74. package/dist/components/svg-draw-lines/index.d.ts +13 -2
  75. package/dist/components/svg-draw-lines/index.js +44 -31
  76. package/dist/components/svg-draw-lines/index.js.map +1 -1
  77. package/dist/components/switch/index.js.map +1 -1
  78. package/dist/components/switch/style.js.map +1 -1
  79. package/dist/components/textarea/index.js +2 -2
  80. package/dist/components/textarea/index.js.map +1 -1
  81. package/dist/components/textarea/style.js.map +1 -1
  82. package/dist/components/theme/index.d.ts +17 -0
  83. package/dist/components/theme/index.js +180 -20
  84. package/dist/components/theme/index.js.map +1 -1
  85. package/dist/components/theme/style.js +1 -1
  86. package/dist/components/theme/style.js.map +1 -1
  87. package/dist/components/toast/index.d.ts +1 -1
  88. package/dist/components/toast/manager.d.ts +1 -3
  89. package/dist/components/toast/manager.js +92 -49
  90. package/dist/components/toast/manager.js.map +1 -1
  91. package/dist/components/toast/style.js.map +1 -1
  92. package/dist/components/toast/toast.d.ts +37 -0
  93. package/dist/components/toast/toast.js +61 -8
  94. package/dist/components/toast/toast.js.map +1 -1
  95. package/dist/components/toast/types.d.ts +0 -4
  96. package/dist/components/tooltip/index.d.ts +6 -1
  97. package/dist/components/tooltip/index.js +11 -12
  98. package/dist/components/tooltip/index.js.map +1 -1
  99. package/dist/shared/gesture/drag-gesture.js +66 -64
  100. package/dist/shared/gesture/drag-gesture.js.map +1 -1
  101. package/dist/shared/gesture/physics.js +7 -29
  102. package/dist/shared/gesture/physics.js.map +1 -1
  103. package/dist/shared/menu-behavior/index.js +3 -4
  104. package/dist/shared/menu-behavior/index.js.map +1 -1
  105. package/dist/shared/option-portal/combobox-shell.js +7 -8
  106. package/dist/shared/option-portal/combobox-shell.js.map +1 -1
  107. package/dist/shared/overlay/anchored-panel.js +36 -31
  108. package/dist/shared/overlay/anchored-panel.js.map +1 -1
  109. package/dist/shared/overlay/native-dialog-presence.js +16 -0
  110. package/dist/shared/overlay/native-dialog-presence.js.map +1 -1
  111. package/dist/shared/overlay/nested-drawer-layers.js +7 -4
  112. package/dist/shared/overlay/nested-drawer-layers.js.map +1 -1
  113. package/dist/shared/overlay/open-overlay.js +182 -0
  114. package/dist/shared/overlay/open-overlay.js.map +1 -0
  115. package/dist/shared/overlay/presence.js +19 -22
  116. package/dist/shared/overlay/presence.js.map +1 -1
  117. package/dist/shared/theme/duration.js +9 -0
  118. package/dist/shared/theme/duration.js.map +1 -0
  119. package/dist/shared/theme/reduced-motion.js +15 -0
  120. package/dist/shared/theme/reduced-motion.js.map +1 -0
  121. package/package.json +1 -1
  122. package/dist/shared/overlay/composition.js +0 -57
  123. package/dist/shared/overlay/composition.js.map +0 -1
  124. package/dist/shared/overlay/lifecycle.js +0 -41
  125. package/dist/shared/overlay/lifecycle.js.map +0 -1
  126. package/dist/vite.svg +0 -1
@@ -1,41 +1,95 @@
1
1
  import e from "../../_virtual/_@oxc-project_runtime@0.149.0/helpers/esm/decorate.js";
2
2
  import { normalizeLiteral as t } from "../../shared/normalize/index.js";
3
- import { applyOverlayRootStyles as n } from "../../shared/overlay/overlay-root.js";
4
- import r from "./style.js";
5
- import { LitElement as i, html as a, nothing as o, unsafeCSS as s } from "lit";
6
- import { customElement as c, property as l } from "lit/decorators.js";
3
+ import { parseDuration as n } from "../../shared/theme/duration.js";
4
+ import { applyOverlayRootStyles as r } from "../../shared/overlay/overlay-root.js";
5
+ import i from "./style.js";
6
+ import { LitElement as a, html as o, nothing as s, unsafeCSS as c } from "lit";
7
+ import { customElement as l, property as u } from "lit/decorators.js";
7
8
  //#region src/components/theme/index.ts
8
- var u = [
9
+ var d, f = [
9
10
  "light",
10
11
  "dark",
11
12
  "system"
12
- ], d = [
13
+ ], p = [
13
14
  "full",
14
15
  "reduced",
15
16
  "system"
16
- ], f = class extends i {
17
+ ], m = {
18
+ x: NaN,
19
+ y: NaN
20
+ }, h = 0, g = 0, _ = null, v = (e) => {
21
+ let t = e;
22
+ m.x = t.clientX, m.y = t.clientY;
23
+ }, y = () => {
24
+ m.x = NaN, m.y = NaN;
25
+ };
26
+ function b() {
27
+ g++ > 0 || (window.addEventListener("pointerdown", v, !0), window.addEventListener("keydown", y, !0));
28
+ }
29
+ function x() {
30
+ --g > 0 || (window.removeEventListener("pointerdown", v, !0), window.removeEventListener("keydown", y, !0));
31
+ }
32
+ function S(e) {
33
+ if (e !== "system") return e;
34
+ try {
35
+ return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
36
+ } catch {
37
+ return "light";
38
+ }
39
+ }
40
+ function C(e, t) {
41
+ return Number.isFinite(e) && Number.isFinite(t) ? {
42
+ x: e,
43
+ y: t
44
+ } : {
45
+ x: (window.innerWidth || 0) / 2,
46
+ y: (window.innerHeight || 0) / 2
47
+ };
48
+ }
49
+ var w = class extends a {
50
+ static {
51
+ d = this;
52
+ }
17
53
  constructor(...e) {
18
- super(...e), this._motion = "system", this._warned = !1;
54
+ super(...e), this._appearanceRequest = 0, this._motion = "system", this._transition = !1, this._transitionOriginListening = !1, this._transitionRequested = !1, this._warned = !1;
19
55
  }
20
56
  static {
21
- this.styles = s(r);
57
+ this.styles = c(i);
22
58
  }
23
59
  get appearance() {
24
60
  return this._appearance;
25
61
  }
26
62
  set appearance(e) {
27
- let n = this._appearance;
28
- this._appearance = e === void 0 ? void 0 : t(e, u, "light"), this.requestUpdate("appearance", n);
63
+ let n = this._appearance, r = e === void 0 ? void 0 : t(e, f, "light"), i = ++this._appearanceRequest;
64
+ if (r !== void 0 && !this._transitionRequested && _ === null && this._shouldAnimateAppearance(r)) {
65
+ this._transitionRequested = !0;
66
+ let e = { requestId: i };
67
+ _ = e, this._startThemeTransition(r, n, i, e).catch(() => {
68
+ this._cleanupThemeTransition(), this._transitionRequested = !1, _ === e && (_ = null), this._appearanceRequest === i && (this._appearance = r, this.requestUpdate("appearance", n));
69
+ });
70
+ return;
71
+ }
72
+ this._appearance = r, this.requestUpdate("appearance", n);
29
73
  }
30
74
  get motion() {
31
75
  return this._motion;
32
76
  }
33
77
  set motion(e) {
34
78
  let n = this._motion;
35
- this._motion = t(e, d, "system"), this.requestUpdate("motion", n);
79
+ this._motion = t(e, p, "system"), this.requestUpdate("motion", n);
80
+ }
81
+ get transition() {
82
+ return this._transition;
83
+ }
84
+ set transition(e) {
85
+ let t = this._transition;
86
+ this._transition = e, this.requestUpdate("transition", t), this._syncTransitionOriginListeners(this.isConnected && this._transition);
36
87
  }
37
88
  connectedCallback() {
38
- super.connectedCallback(), this._warnWhenAppearanceIsMissing();
89
+ super.connectedCallback(), this._syncTransitionOriginListeners(this.transition), this._warnWhenAppearanceIsMissing();
90
+ }
91
+ disconnectedCallback() {
92
+ this._syncTransitionOriginListeners(!1), this._activeTransition?.skipTransition?.(), this._cleanupThemeTransition(), super.disconnectedCallback();
39
93
  }
40
94
  updated() {
41
95
  this._warnWhenAppearanceIsMissing();
@@ -52,27 +106,133 @@ var u = [
52
106
  return !1;
53
107
  }
54
108
  }
109
+ _findThemeAncestor() {
110
+ let e = this.parentNode;
111
+ for (; e;) {
112
+ if (e instanceof d && e !== this && e._hasAppearance()) return e;
113
+ e = e instanceof ShadowRoot ? e.host : e.parentElement;
114
+ }
115
+ return null;
116
+ }
117
+ _transitionOrigin() {
118
+ if (Number.isFinite(m.x) && Number.isFinite(m.y)) return m;
119
+ let e = this.getBoundingClientRect();
120
+ return e.width > 0 && e.height > 0 ? {
121
+ x: e.left + e.width / 2,
122
+ y: e.top + e.height / 2
123
+ } : C(NaN, NaN);
124
+ }
125
+ _syncTransitionOriginListeners(e) {
126
+ e !== this._transitionOriginListening && (this._transitionOriginListening = e, e ? b() : x());
127
+ }
128
+ _transitionMotion() {
129
+ let e = getComputedStyle(this), t = n(e.getPropertyValue("--wui-theme-transition-duration")) ?? 500, r = e.getPropertyValue("--wui-theme-transition-easing").trim() || "ease-in", i = globalThis.CSS?.supports("animation-timing-function", r) ? r : "ease-in";
130
+ return {
131
+ duration: Math.max(0, t),
132
+ easing: i
133
+ };
134
+ }
135
+ _shouldAnimateAppearance(e) {
136
+ let t = this._appearance;
137
+ return !t || t === e || S(t) === S(e) ? !1 : this.transition && typeof document.startViewTransition == "function" && Array.isArray(document.adoptedStyleSheets) && !this.isReducedMotion() && this._transitionMotion().duration > 0;
138
+ }
139
+ async _startThemeTransition(e, t, n, r) {
140
+ let i = this._findThemeAncestor() === null, a = i ? void 0 : `wui-theme-transition-${++h}`, o = new CSSStyleSheet();
141
+ a ? o.replaceSync(`
142
+ ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
143
+ ::view-transition-old(root), ::view-transition-new(root) { mix-blend-mode: normal; }
144
+ ::view-transition-image-pair(root), ::view-transition-image-pair(${a}) { mix-blend-mode: normal; }
145
+ ::view-transition-group(${a}) { animation: none; }
146
+ ::view-transition-old(${a}), ::view-transition-new(${a}) {
147
+ animation: none;
148
+ mix-blend-mode: normal;
149
+ }
150
+ ::view-transition-old(${a}) { z-index: ${e === "dark" ? 1 : 2}; }
151
+ ::view-transition-new(${a}) { z-index: ${e === "dark" ? 2 : 1}; }
152
+ `) : o.replaceSync(`
153
+ ::view-transition-old(root), ::view-transition-new(root) {
154
+ animation: none;
155
+ mix-blend-mode: normal;
156
+ }
157
+ ::view-transition-image-pair(root) { mix-blend-mode: normal; }
158
+ ::view-transition-old(root) { z-index: ${e === "dark" ? 1 : 2}; }
159
+ ::view-transition-new(root) { z-index: ${e === "dark" ? 2 : 1}; }
160
+ `);
161
+ let s = this.style.getPropertyValue("display"), c = a ? this.style.getPropertyValue("view-transition-name") : void 0;
162
+ a && (this.style.setProperty("display", "block"), this.style.setProperty("view-transition-name", a)), document.adoptedStyleSheets = [...document.adoptedStyleSheets, o];
163
+ let l = () => {
164
+ document.adoptedStyleSheets = document.adoptedStyleSheets.filter((e) => e !== o), a && (c ? this.style.setProperty("view-transition-name", c) : this.style.removeProperty("view-transition-name"), s ? this.style.setProperty("display", s) : this.style.removeProperty("display"));
165
+ }, u = () => this._appearanceRequest === n ? (this._appearance = e, this.requestUpdate("appearance", t), this.updateComplete) : this.updateComplete;
166
+ this._transitionCleanup = l;
167
+ let d = document.startViewTransition(u);
168
+ this._activeTransition = d;
169
+ let f = [];
170
+ d.ready.then(() => {
171
+ let { duration: t, easing: n } = this._transitionMotion();
172
+ if (t <= 0) return;
173
+ let { x: r, y: o } = this._transitionOrigin(), s = e === "dark" ? "::view-transition-new(root)" : "::view-transition-old(root)";
174
+ if (!i) {
175
+ let i = this.getBoundingClientRect(), s = {
176
+ x: r - i.left,
177
+ y: o - i.top
178
+ }, c = Math.ceil(Math.hypot(Math.max(s.x, i.width - s.x), Math.max(s.y, i.height - s.y))), l = this._transitionKeyframes(s.x, s.y, c, e), u = e === "dark" ? `::view-transition-new(${a})` : `::view-transition-old(${a})`;
179
+ f.push(document.documentElement.animate(l, {
180
+ duration: t,
181
+ easing: n,
182
+ fill: "both",
183
+ pseudoElement: u
184
+ }));
185
+ return;
186
+ }
187
+ let c = Math.ceil(Math.hypot(Math.max(r, window.innerWidth - r), Math.max(o, window.innerHeight - o)));
188
+ f.push(document.documentElement.animate(this._transitionKeyframes(r, o, c, e), {
189
+ duration: t,
190
+ easing: n,
191
+ fill: "both",
192
+ pseudoElement: s
193
+ }));
194
+ }).catch(() => void 0);
195
+ try {
196
+ await d.finished;
197
+ } catch {} finally {
198
+ this._activeTransition = void 0, this._transitionCleanup = void 0;
199
+ for (let e of f) e.cancel();
200
+ l(), this._transitionRequested = !1, _ === r && (_ = null);
201
+ }
202
+ }
203
+ _transitionKeyframes(e, t, n, r) {
204
+ let i = `circle(0px at ${e}px ${t}px)`, a = `circle(${n}px at ${e}px ${t}px)`;
205
+ return r === "dark" ? [{ clipPath: i }, { clipPath: a }] : [{ clipPath: a }, { clipPath: i }];
206
+ }
207
+ _cleanupThemeTransition(e = !0) {
208
+ this._activeTransition = void 0;
209
+ let t = this._transitionCleanup;
210
+ this._transitionCleanup = void 0, e && t?.();
211
+ }
55
212
  render() {
56
- return a`<slot></slot>${this._hasAppearance() ? a`<div data-wui-overlay-container></div>` : o}`;
213
+ return o`<slot></slot>${this._hasAppearance() ? o`<div data-wui-overlay-container></div>` : s}`;
57
214
  }
58
215
  firstUpdated() {
59
- this.renderRoot instanceof ShadowRoot && n(this.renderRoot);
216
+ this.renderRoot instanceof ShadowRoot && r(this.renderRoot);
60
217
  }
61
218
  _hasAppearance() {
62
- return this.appearance !== void 0 && u.includes(this.appearance);
219
+ return this.appearance !== void 0 && f.includes(this.appearance);
63
220
  }
64
221
  _warnWhenAppearanceIsMissing() {
65
222
  this._hasAppearance() || this._warned;
66
223
  }
67
224
  };
68
- e([l({
225
+ e([u({
69
226
  type: String,
70
227
  reflect: !0
71
- })], f.prototype, "appearance", null), e([l({
228
+ })], w.prototype, "appearance", null), e([u({
72
229
  type: String,
73
230
  reflect: !0
74
- })], f.prototype, "motion", null), f = e([c("web-ui-theme")], f);
231
+ })], w.prototype, "motion", null), e([u({
232
+ type: Boolean,
233
+ reflect: !0
234
+ })], w.prototype, "transition", null), w = d = e([l("web-ui-theme")], w);
75
235
  //#endregion
76
- export { f as WebUiTheme };
236
+ export { w as WebUiTheme };
77
237
 
78
238
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/theme/index.ts"],"sourcesContent":["import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { normalizeLiteral } from '@/shared/normalize'\nimport { applyOverlayRootStyles } from '@/shared/overlay/overlay-root'\n\nimport style from './style.css?inline'\n\nexport type ThemeAppearance = 'light' | 'dark' | 'system'\nexport type ThemeMotion = 'full' | 'reduced' | 'system'\n\nconst APPEARANCES = ['light', 'dark', 'system'] as const\nconst MOTIONS = ['full', 'reduced', 'system'] as const\n\n@customElement('web-ui-theme')\nexport class WebUiTheme extends LitElement {\n static override styles = unsafeCSS(style)\n\n @property({ type: String, reflect: true })\n get appearance(): ThemeAppearance | undefined {\n return this._appearance\n }\n set appearance(v: string | undefined) {\n const old = this._appearance\n this._appearance = v !== undefined ? (normalizeLiteral(v, APPEARANCES, 'light') as ThemeAppearance) : undefined\n this.requestUpdate('appearance', old)\n }\n private _appearance?: ThemeAppearance\n\n @property({ type: String, reflect: true })\n get motion(): ThemeMotion {\n return this._motion\n }\n set motion(v: string) {\n const old = this._motion\n this._motion = normalizeLiteral(v, MOTIONS, 'system') as ThemeMotion\n this.requestUpdate('motion', old)\n }\n private _motion: ThemeMotion = 'system'\n\n private _warned = false\n\n override connectedCallback() {\n super.connectedCallback()\n this._warnWhenAppearanceIsMissing()\n }\n\n protected override updated() {\n this._warnWhenAppearanceIsMissing()\n }\n\n // 返回该主题拥有的浮层挂载点;未设置 appearance 时不创建。\n getOverlayRoot(): HTMLElement | undefined {\n if (!this._hasAppearance()) return undefined\n return this.renderRoot.querySelector<HTMLElement>('[data-wui-overlay-container]') ?? undefined\n }\n\n // 当前范围是否应减少动效;`system` 跟随用户的系统偏好。\n isReducedMotion(): boolean {\n if (this.motion === 'reduced') return true\n if (this.motion === 'full') return false\n\n try {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches\n } catch {\n return false\n }\n }\n\n override render() {\n return html`<slot></slot>${this._hasAppearance() ? html`<div data-wui-overlay-container></div>` : nothing}`\n }\n\n override firstUpdated() {\n if (this.renderRoot instanceof ShadowRoot) {\n applyOverlayRootStyles(this.renderRoot)\n }\n }\n\n private _hasAppearance(): this is this & { appearance: ThemeAppearance } {\n return this.appearance !== undefined && (APPEARANCES as readonly string[]).includes(this.appearance)\n }\n\n private _warnWhenAppearanceIsMissing() {\n if (this._hasAppearance() || this._warned || !import.meta.env.DEV) return\n this._warned = true\n console.warn('[web-ui-theme] appearance is required; this theme scope is inactive until it is set.')\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-theme': WebUiTheme\n }\n}\n"],"mappings":";;;;;;;AAWA,IAAM,IAAc;CAAC;CAAS;CAAQ;AAAQ,GACxC,IAAU;CAAC;CAAQ;CAAW;AAAQ,GAG/B,IAAN,cAAyB,EAAW;;EAyBvB,aAFa,KAAA,UAAA,UAEb,KAAA,UAAA;;;EAxBO,KAAA,SAAA,EAAU,CAAK;;CAExC,IACI,aAA0C;EAC5C,OAAO,KAAK;CACd;CACA,IAAI,WAAW,GAAuB;EACpC,IAAM,IAAM,KAAK;EAEjB,AADA,KAAK,cAAc,MAAM,KAAA,IAA6E,KAAA,IAAhE,EAAiB,GAAG,GAAa,OAAO,GAC9E,KAAK,cAAc,cAAc,CAAG;CACtC;CAGA,IACI,SAAsB;EACxB,OAAO,KAAK;CACd;CACA,IAAI,OAAO,GAAW;EACpB,IAAM,IAAM,KAAK;EAEjB,AADA,KAAK,UAAU,EAAiB,GAAG,GAAS,QAAQ,GACpD,KAAK,cAAc,UAAU,CAAG;CAClC;CAKA,oBAA6B;EAE3B,AADA,MAAM,kBAAkB,GACxB,KAAK,6BAA6B;CACpC;CAEA,UAA6B;EAC3B,KAAK,6BAA6B;CACpC;CAGA,iBAA0C;EACnC,SAAK,eAAe,GACzB,OAAO,KAAK,WAAW,cAA2B,8BAA8B,KAAK,KAAA;CACvF;CAGA,kBAA2B;EACzB,IAAI,KAAK,WAAW,WAAW,OAAO;EACtC,IAAI,KAAK,WAAW,QAAQ,OAAO;EAEnC,IAAI;GACF,OAAO,OAAO,WAAW,kCAAkC,CAAC,CAAC;EAC/D,QAAQ;GACN,OAAO;EACT;CACF;CAEA,SAAkB;EAChB,OAAO,CAAI,gBAAgB,KAAK,eAAe,IAAI,CAAI,2CAA2C;CACpG;CAEA,eAAwB;EACtB,AAAI,KAAK,sBAAsB,cAC7B,EAAuB,KAAK,UAAU;CAE1C;CAEA,iBAAyE;EACvE,OAAO,KAAK,eAAe,KAAA,KAAc,EAAkC,SAAS,KAAK,UAAU;CACrG;CAEA,+BAAuC;EACjC,KAAK,eAAe,KAAK,KAAK;CAGpC;AACF;AAtEG,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,cAAA,IAAA,GAWxC,EAAA,CAAA,EAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,EAAA,WAAA,UAAA,IAAA,GAf1C,IAAA,EAAA,CAAA,EAAc,cAAc,CAAA,GAAA,CAAA"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/theme/index.ts"],"sourcesContent":["import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { normalizeLiteral } from '@/shared/normalize'\nimport { applyOverlayRootStyles } from '@/shared/overlay/overlay-root'\nimport { parseDuration } from '@/shared/theme/duration'\n\nimport style from './style.css?inline'\n\nexport type ThemeAppearance = 'light' | 'dark' | 'system'\nexport type ThemeMotion = 'full' | 'reduced' | 'system'\n\nconst APPEARANCES = ['light', 'dark', 'system'] as const\nconst MOTIONS = ['full', 'reduced', 'system'] as const\n\ninterface ViewTransitionLike {\n readonly ready: Promise<void>\n readonly finished: Promise<void>\n skipTransition?: () => void\n}\n\n// 根主题没有对应控件;记录最近一次触发主题变更的指针位置,键盘或程序化调用则回退中心。\nconst transitionOrigin = { x: Number.NaN, y: Number.NaN }\nlet transitionSequence = 0\nlet transitionOriginCount = 0\nlet themeTransitionFlightToken: object | null = null\nconst recordTransitionOrigin = (event: Event) => {\n const pointer = event as PointerEvent\n transitionOrigin.x = pointer.clientX\n transitionOrigin.y = pointer.clientY\n}\nconst forgetTransitionOrigin = () => {\n transitionOrigin.x = Number.NaN\n transitionOrigin.y = Number.NaN\n}\n\nfunction addTransitionOriginListeners() {\n if (transitionOriginCount++ > 0) return\n window.addEventListener('pointerdown', recordTransitionOrigin, true)\n window.addEventListener('keydown', forgetTransitionOrigin, true)\n}\n\nfunction removeTransitionOriginListeners() {\n if (--transitionOriginCount > 0) return\n window.removeEventListener('pointerdown', recordTransitionOrigin, true)\n window.removeEventListener('keydown', forgetTransitionOrigin, true)\n}\n\nfunction resolveAppearance(appearance: ThemeAppearance): 'light' | 'dark' {\n if (appearance !== 'system') return appearance\n try {\n return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n } catch {\n return 'light'\n }\n}\n\nfunction transitionPoint(x: number, y: number): { x: number; y: number } {\n if (Number.isFinite(x) && Number.isFinite(y)) return { x, y }\n return {\n x: (window.innerWidth || 0) / 2,\n y: (window.innerHeight || 0) / 2\n }\n}\n\n@customElement('web-ui-theme')\nexport class WebUiTheme extends LitElement {\n static override styles = unsafeCSS(style)\n\n @property({ type: String, reflect: true })\n get appearance(): ThemeAppearance | undefined {\n return this._appearance\n }\n set appearance(v: string | undefined) {\n const old = this._appearance\n const next = v !== undefined ? (normalizeLiteral(v, APPEARANCES, 'light') as ThemeAppearance) : undefined\n const request = ++this._appearanceRequest\n if (\n next !== undefined &&\n !this._transitionRequested &&\n themeTransitionFlightToken === null &&\n this._shouldAnimateAppearance(next)\n ) {\n // async helper 可能把函数体排到当前栈后;flight gate 必须在当前 setter 栈内生效。\n this._transitionRequested = true\n const flightToken = { requestId: request }\n themeTransitionFlightToken = flightToken\n void this._startThemeTransition(next, old!, request, flightToken).catch(() => {\n this._cleanupThemeTransition()\n this._transitionRequested = false\n if (themeTransitionFlightToken === flightToken) themeTransitionFlightToken = null\n if (this._appearanceRequest === request) {\n this._appearance = next\n this.requestUpdate('appearance', old)\n }\n })\n return\n }\n this._appearance = next\n this.requestUpdate('appearance', old)\n }\n private _appearance?: ThemeAppearance\n private _appearanceRequest = 0\n\n @property({ type: String, reflect: true })\n get motion(): ThemeMotion {\n return this._motion\n }\n set motion(v: string) {\n const old = this._motion\n this._motion = normalizeLiteral(v, MOTIONS, 'system') as ThemeMotion\n this.requestUpdate('motion', old)\n }\n private _motion: ThemeMotion = 'system'\n\n // HTML attribute 存在即 true;动态关闭由框架写 boolean property,不解析字符串。\n @property({ type: Boolean, reflect: true })\n get transition(): boolean {\n return this._transition\n }\n set transition(v: boolean) {\n const old = this._transition\n this._transition = v\n this.requestUpdate('transition', old)\n\n this._syncTransitionOriginListeners(this.isConnected && this._transition)\n }\n private _transition = false\n private _transitionOriginListening = false\n private _transitionRequested = false\n\n private _warned = false\n\n override connectedCallback() {\n super.connectedCallback()\n this._syncTransitionOriginListeners(this.transition)\n this._warnWhenAppearanceIsMissing()\n }\n\n override disconnectedCallback() {\n this._syncTransitionOriginListeners(false)\n this._activeTransition?.skipTransition?.()\n this._cleanupThemeTransition()\n super.disconnectedCallback()\n }\n\n protected override updated() {\n this._warnWhenAppearanceIsMissing()\n }\n\n // 返回该主题拥有的浮层挂载点;未设置 appearance 时不创建。\n getOverlayRoot(): HTMLElement | undefined {\n if (!this._hasAppearance()) return undefined\n return this.renderRoot.querySelector<HTMLElement>('[data-wui-overlay-container]') ?? undefined\n }\n\n // 当前范围是否应减少动效;`system` 跟随用户的系统偏好。\n isReducedMotion(): boolean {\n if (this.motion === 'reduced') return true\n if (this.motion === 'full') return false\n\n try {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches\n } catch {\n return false\n }\n }\n\n private _findThemeAncestor(): WebUiTheme | null {\n let node = this.parentNode\n while (node) {\n if (node instanceof WebUiTheme && node !== this && node._hasAppearance()) return node\n if (node instanceof ShadowRoot) {\n node = node.host\n } else {\n node = node.parentElement\n }\n }\n return null\n }\n\n private _transitionOrigin(): { x: number; y: number } {\n if (Number.isFinite(transitionOrigin.x) && Number.isFinite(transitionOrigin.y)) {\n return transitionOrigin\n }\n\n const box = this.getBoundingClientRect()\n if (box.width > 0 && box.height > 0) {\n return { x: box.left + box.width / 2, y: box.top + box.height / 2 }\n }\n return transitionPoint(Number.NaN, Number.NaN)\n }\n\n private _syncTransitionOriginListeners(listening: boolean) {\n if (listening === this._transitionOriginListening) return\n this._transitionOriginListening = listening\n if (listening) addTransitionOriginListeners()\n else removeTransitionOriginListeners()\n }\n\n private _transitionMotion(): { duration: number; easing: string } {\n const style = getComputedStyle(this)\n const duration = parseDuration(style.getPropertyValue('--wui-theme-transition-duration')) ?? 500\n const easing = style.getPropertyValue('--wui-theme-transition-easing').trim() || 'ease-in'\n const safeEasing = globalThis.CSS?.supports('animation-timing-function', easing) ? easing : 'ease-in'\n return { duration: Math.max(0, duration), easing: safeEasing }\n }\n\n private _shouldAnimateAppearance(next: ThemeAppearance): boolean {\n const previous = this._appearance\n if (!previous || previous === next) return false\n if (resolveAppearance(previous) === resolveAppearance(next)) return false\n return (\n this.transition &&\n typeof document.startViewTransition === 'function' &&\n Array.isArray(document.adoptedStyleSheets) &&\n !this.isReducedMotion() &&\n this._transitionMotion().duration > 0\n )\n }\n\n // 嵌套主题只做局部揭示;View Transitions 需要 capture box,因此飞行期间临时生成一个 host box。\n private async _startThemeTransition(\n next: ThemeAppearance,\n previous: ThemeAppearance,\n request: number,\n flightToken: object\n ): Promise<void> {\n const root = this._findThemeAncestor() === null\n const transitionName = root ? undefined : `wui-theme-transition-${++transitionSequence}`\n const styleSheet = new CSSStyleSheet()\n if (transitionName) {\n styleSheet.replaceSync(`\n ::view-transition-old(root), ::view-transition-new(root) { animation: none; }\n ::view-transition-old(root), ::view-transition-new(root) { mix-blend-mode: normal; }\n ::view-transition-image-pair(root), ::view-transition-image-pair(${transitionName}) { mix-blend-mode: normal; }\n ::view-transition-group(${transitionName}) { animation: none; }\n ::view-transition-old(${transitionName}), ::view-transition-new(${transitionName}) {\n animation: none;\n mix-blend-mode: normal;\n }\n ::view-transition-old(${transitionName}) { z-index: ${next === 'dark' ? 1 : 2}; }\n ::view-transition-new(${transitionName}) { z-index: ${next === 'dark' ? 2 : 1}; }\n `)\n } else {\n styleSheet.replaceSync(`\n ::view-transition-old(root), ::view-transition-new(root) {\n animation: none;\n mix-blend-mode: normal;\n }\n ::view-transition-image-pair(root) { mix-blend-mode: normal; }\n ::view-transition-old(root) { z-index: ${next === 'dark' ? 1 : 2}; }\n ::view-transition-new(root) { z-index: ${next === 'dark' ? 2 : 1}; }\n `)\n }\n\n const hadDisplay = this.style.getPropertyValue('display')\n const hadTransitionName = transitionName ? this.style.getPropertyValue('view-transition-name') : undefined\n if (transitionName) {\n this.style.setProperty('display', 'block')\n this.style.setProperty('view-transition-name', transitionName)\n }\n document.adoptedStyleSheets = [...document.adoptedStyleSheets, styleSheet]\n\n const restoreCapture = () => {\n document.adoptedStyleSheets = document.adoptedStyleSheets.filter(sheet => sheet !== styleSheet)\n if (!transitionName) return\n if (hadTransitionName) this.style.setProperty('view-transition-name', hadTransitionName)\n else this.style.removeProperty('view-transition-name')\n if (hadDisplay) this.style.setProperty('display', hadDisplay)\n else this.style.removeProperty('display')\n }\n\n const commit = () => {\n if (this._appearanceRequest !== request) return this.updateComplete\n this._appearance = next\n this.requestUpdate('appearance', previous)\n return this.updateComplete\n }\n this._transitionCleanup = restoreCapture\n const transition = document.startViewTransition(commit) as unknown as ViewTransitionLike\n this._activeTransition = transition\n const animations: Animation[] = []\n\n transition.ready\n .then(() => {\n const { duration, easing } = this._transitionMotion()\n if (duration <= 0) return\n const { x, y } = this._transitionOrigin()\n const target = next === 'dark' ? '::view-transition-new(root)' : '::view-transition-old(root)'\n if (!root) {\n const box = this.getBoundingClientRect()\n const relative = { x: x - box.left, y: y - box.top }\n const radius = Math.ceil(\n Math.hypot(Math.max(relative.x, box.width - relative.x), Math.max(relative.y, box.height - relative.y))\n )\n const frames = this._transitionKeyframes(relative.x, relative.y, radius, next)\n const target =\n next === 'dark' ? `::view-transition-new(${transitionName})` : `::view-transition-old(${transitionName})`\n animations.push(\n document.documentElement.animate(frames, {\n duration,\n easing,\n fill: 'both',\n pseudoElement: target\n } as KeyframeAnimationOptions)\n )\n return\n }\n\n const radius = Math.ceil(Math.hypot(Math.max(x, window.innerWidth - x), Math.max(y, window.innerHeight - y)))\n animations.push(\n document.documentElement.animate(this._transitionKeyframes(x, y, radius, next), {\n duration,\n easing,\n fill: 'both',\n pseudoElement: target\n } as KeyframeAnimationOptions)\n )\n })\n .catch(() => undefined)\n\n try {\n await transition.finished\n } catch {\n // API 缺失、capture 冲突或用户 skip 都不是状态错误;appearance 已由 update callback 提交。\n } finally {\n this._activeTransition = undefined\n this._transitionCleanup = undefined\n for (const animation of animations) animation.cancel()\n restoreCapture()\n // disconnected skip 会提前清掉 active;flight token/request 必须无条件释放。\n this._transitionRequested = false\n if (themeTransitionFlightToken === flightToken) themeTransitionFlightToken = null\n }\n }\n\n private _transitionKeyframes(x: number, y: number, radius: number, next: ThemeAppearance): Keyframe[] {\n const from = `circle(0px at ${x}px ${y}px)`\n const to = `circle(${radius}px at ${x}px ${y}px)`\n return next === 'dark' ? [{ clipPath: from }, { clipPath: to }] : [{ clipPath: to }, { clipPath: from }]\n }\n\n private _cleanupThemeTransition(restoreCapture = true) {\n this._activeTransition = undefined\n const cleanup = this._transitionCleanup\n this._transitionCleanup = undefined\n if (restoreCapture) cleanup?.()\n }\n\n private _activeTransition?: ViewTransitionLike\n private _transitionCleanup?: () => void\n\n override render() {\n return html`<slot></slot>${this._hasAppearance() ? html`<div data-wui-overlay-container></div>` : nothing}`\n }\n\n override firstUpdated() {\n if (this.renderRoot instanceof ShadowRoot) {\n applyOverlayRootStyles(this.renderRoot)\n }\n }\n\n private _hasAppearance(): this is this & { appearance: ThemeAppearance } {\n return this.appearance !== undefined && (APPEARANCES as readonly string[]).includes(this.appearance)\n }\n\n private _warnWhenAppearanceIsMissing() {\n if (this._hasAppearance() || this._warned || !import.meta.env.DEV) return\n this._warned = true\n console.warn('[web-ui-theme] appearance is required; this theme scope is inactive until it is set.')\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-theme': WebUiTheme\n }\n}\n"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  //#region src/components/theme/style.css?inline
2
- var e = "*,:before,:after{box-sizing:border-box}:host{--wui-font-size:14px;--wui-input-width:200px;--wui-control-size:36px;--wui-overlay-min-width:200px;--wui-layer-base:0;--wui-layer-inline-overlay:1;--wui-layer-header:10;--wui-layer-auxiliary:20;--wui-layer-banner:30;--wui-layer-tabbar:40;--wui-layer-sidebar:50;--wui-layer-menu:100;--wui-layer-menu-nested:110;--wui-layer-toast:200;--wui-layer-loading:300;--wui-duration-press:80ms;--wui-duration-feedback:.1s;--wui-duration-trigger:.16s;--wui-duration-focus:.2s;--wui-duration-float-enter:.24s;--wui-duration-float-exit:.16s;--wui-duration-dialog-enter:.32s;--wui-duration-dialog-exit:.26s;--wui-duration-drawer-enter:.28s;--wui-duration-drawer-exit:.24s;--wui-duration-drawer-nested:.45s;--wui-duration-toast-enter:.28s;--wui-duration-toast-exit:.2s;--wui-duration-collapse-enter:.2s;--wui-duration-collapse-exit:.16s;--wui-duration-layout:.2s;--wui-duration-swipe-settle:.22s;--wui-duration-spin:.6s;--wui-duration-spinner:.8s;--wui-ease-enter:cubic-bezier(.23, 1, .32, 1);--wui-ease-dialog:cubic-bezier(.2, 0, 0, 1);--wui-ease-slide:cubic-bezier(.77, 0, .175, 1);--wui-ease-swipe:cubic-bezier(.32, .72, 0, 1);--wui-ease-float:cubic-bezier(.4, .38, .2, 1);--wui-scale-enter:.95;--wui-dialog-scale-enter:1.2;--wui-focus-ring-width:3px;--wui-radius-control:calc(infinity * 1px);--wui-radius-menu:18px;--wui-radius-overlay:28px;display:contents}:host([motion=reduced]){--wui-duration-press:0s;--wui-duration-feedback:0s;--wui-duration-trigger:0s;--wui-duration-focus:0s;--wui-duration-float-enter:0s;--wui-duration-float-exit:0s;--wui-duration-dialog-enter:0s;--wui-duration-dialog-exit:0s;--wui-duration-drawer-enter:0s;--wui-duration-drawer-exit:0s;--wui-duration-drawer-nested:0s;--wui-duration-toast-enter:0s;--wui-duration-toast-exit:0s;--wui-duration-collapse-enter:0s;--wui-duration-collapse-exit:0s;--wui-duration-layout:0s;--wui-duration-swipe-settle:0s;--wui-duration-spin:1.6s;--wui-duration-spinner:1.6s;--wui-scale-enter:1;--wui-dialog-scale-enter:1}@media (prefers-reduced-motion:reduce){:host([motion=system]){--wui-duration-press:0s;--wui-duration-feedback:0s;--wui-duration-trigger:0s;--wui-duration-focus:0s;--wui-duration-float-enter:0s;--wui-duration-float-exit:0s;--wui-duration-dialog-enter:0s;--wui-duration-dialog-exit:0s;--wui-duration-drawer-enter:0s;--wui-duration-drawer-exit:0s;--wui-duration-drawer-nested:0s;--wui-duration-toast-enter:0s;--wui-duration-toast-exit:0s;--wui-duration-collapse-enter:0s;--wui-duration-collapse-exit:0s;--wui-duration-layout:0s;--wui-duration-swipe-settle:0s;--wui-duration-spin:1.6s;--wui-duration-spinner:1.6s;--wui-scale-enter:1;--wui-dialog-scale-enter:1}}:host([appearance=light]),:host([appearance=system]){--wui-color-page:#fff;--wui-color-surface:#fff;--wui-color-surface-raised:#f2f2f7;--wui-color-surface-control:#dfdfdf;--wui-color-surface-track:#e5e5ea;--wui-color-surface-menu:#f6f6f6d1;--wui-color-surface-glass:#fafafa57;--wui-color-surface-glass-hover:color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));--wui-color-surface-glass-active:color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));--wui-color-surface-overlay:#f6f6f6d1;--wui-color-surface-segmented:#e5e5ea;--wui-color-surface-selected:#fff;--wui-color-text:#1b1b1b;--wui-color-text-secondary:#6a6a6a;--wui-color-text-tertiary:color-mix(in srgb, var(--wui-color-text) 35%, transparent);--wui-color-text-disabled:color-mix(in srgb, var(--wui-color-text) 32%, transparent);--wui-color-state-layer-hover:color-mix(in srgb, var(--wui-color-text) 6%, transparent);--wui-color-state-layer-active:color-mix(in srgb, var(--wui-color-text) 15%, transparent);--wui-color-border:#0000001a;--wui-color-glass-border:transparent;--wui-color-glass-highlight:#ffffffe6;--wui-color-glass-corner:#ffffff14;--wui-color-glass-shade:#0000000f;--wui-glass-brightness:1.06;--wui-color-accent:#08f;--wui-color-on-accent:#fff;--wui-color-on-control:#fff;--wui-color-success:#16a34a;--wui-color-warning:#d97706;--wui-color-danger:#dc2626;--wui-color-info:#2563eb;--wui-color-backdrop:#0000001f;--wui-shadow-overlay:2px 16px 40px #0006;--wui-shadow-panel:0 3px 9px #00000045;--wui-shadow-glass:0 0 1px #0000000d, 0 0 8px #00000008, 0 2px 16px #00000006, 0 8px 32px #00000004;--wui-color-focus-ring:#08f6;--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:host([appearance=dark]){--wui-color-page:#242628;--wui-color-surface:#2c2c2e;--wui-color-surface-raised:#2c2c2e;--wui-color-surface-control:#3a3a3c;--wui-color-surface-track:#444446;--wui-color-surface-menu:#1e1e20eb;--wui-color-surface-glass:#2c2c2e6b;--wui-color-surface-glass-hover:color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));--wui-color-surface-glass-active:color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));--wui-color-surface-overlay:#202222e6;--wui-color-surface-segmented:#3a3a3c;--wui-color-surface-selected:#5c5c5e;--wui-color-text:#e9eaea;--wui-color-text-secondary:#a1a1a6;--wui-color-text-tertiary:color-mix(in srgb, var(--wui-color-text) 42%, transparent);--wui-color-text-disabled:color-mix(in srgb, var(--wui-color-text) 38%, transparent);--wui-color-state-layer-hover:color-mix(in srgb, var(--wui-color-text) 6%, transparent);--wui-color-state-layer-active:color-mix(in srgb, var(--wui-color-text) 15%, transparent);--wui-color-border:#ffffff24;--wui-color-glass-border:#ffffff0d;--wui-color-glass-highlight:#ffffff1a;--wui-color-glass-corner:#fff3;--wui-color-glass-shade:#00000080;--wui-glass-brightness:1.02;--wui-color-accent:#0a84ff;--wui-color-on-accent:#fff;--wui-color-on-control:#f2f2f7;--wui-color-success:#30d158;--wui-color-warning:#ff9f0a;--wui-color-danger:#ff453a;--wui-color-info:#64d2ff;--wui-color-backdrop:#0000007a;--wui-shadow-overlay:0 18px 48px #0000007a;--wui-shadow-panel:0 4px 16px #00000052;--wui-shadow-glass:0 8px 24px #00000014;--wui-color-focus-ring:#0a84ff9e;--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:dark){:host([appearance=system]){--wui-color-page:#242628;--wui-color-surface:#2c2c2e;--wui-color-surface-raised:#2c2c2e;--wui-color-surface-control:#3a3a3c;--wui-color-surface-track:#444446;--wui-color-surface-menu:#1e1e20eb;--wui-color-surface-glass:#2c2c2e6b;--wui-color-surface-glass-hover:color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));--wui-color-surface-glass-active:color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));--wui-color-surface-overlay:#202222e6;--wui-color-surface-segmented:#3a3a3c;--wui-color-surface-selected:#5c5c5e;--wui-color-text:#e9eaea;--wui-color-text-secondary:#a1a1a6;--wui-color-text-tertiary:color-mix(in srgb, var(--wui-color-text) 42%, transparent);--wui-color-text-disabled:color-mix(in srgb, var(--wui-color-text) 38%, transparent);--wui-color-state-layer-hover:color-mix(in srgb, var(--wui-color-text) 6%, transparent);--wui-color-state-layer-active:color-mix(in srgb, var(--wui-color-text) 15%, transparent);--wui-color-border:#ffffff24;--wui-color-glass-border:#ffffff0d;--wui-color-glass-highlight:#ffffff1a;--wui-color-glass-corner:#fff3;--wui-color-glass-shade:#00000080;--wui-glass-brightness:1.02;--wui-color-accent:#0a84ff;--wui-color-on-accent:#fff;--wui-color-on-control:#f2f2f7;--wui-color-success:#30d158;--wui-color-warning:#ff9f0a;--wui-color-danger:#ff453a;--wui-color-info:#64d2ff;--wui-color-backdrop:#0000007a;--wui-shadow-overlay:0 18px 48px #0000007a;--wui-shadow-panel:0 4px 16px #00000052;--wui-shadow-glass:0 8px 24px #00000014;--wui-color-focus-ring:#0a84ff9e;--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}";
2
+ var e = "*,:before,:after{box-sizing:border-box}:host{--wui-font-size:14px;--wui-input-width:200px;--wui-control-size:36px;--wui-overlay-min-width:200px;--wui-selection-control-size:18px;--wui-radio-group-gap:8px;--wui-checkbox-group-gap:8px;--wui-layer-base:0;--wui-layer-inline-overlay:1;--wui-layer-header:10;--wui-layer-auxiliary:20;--wui-layer-banner:30;--wui-layer-tabbar:40;--wui-layer-sidebar:50;--wui-layer-menu:100;--wui-layer-menu-nested:110;--wui-layer-toast:200;--wui-layer-loading:300;--wui-duration-press:80ms;--wui-duration-feedback:.1s;--wui-duration-trigger:.16s;--wui-duration-focus:.2s;--wui-duration-float-enter:.24s;--wui-duration-float-exit:.16s;--wui-duration-dialog-enter:.32s;--wui-duration-dialog-exit:.26s;--wui-duration-drawer-enter:.28s;--wui-duration-drawer-exit:.24s;--wui-duration-drawer-nested:.45s;--wui-duration-toast-enter:.28s;--wui-duration-toast-exit:.2s;--wui-duration-collapse-enter:.2s;--wui-duration-collapse-exit:.16s;--wui-duration-layout:.2s;--wui-duration-swipe-settle:.22s;--wui-duration-spin:.6s;--wui-duration-spinner:.8s;--wui-theme-transition-duration:.5s;--wui-theme-transition-easing:ease-in;--wui-ease-enter:cubic-bezier(.23, 1, .32, 1);--wui-ease-dialog:cubic-bezier(.2, 0, 0, 1);--wui-ease-slide:cubic-bezier(.77, 0, .175, 1);--wui-ease-swipe:cubic-bezier(.32, .72, 0, 1);--wui-ease-float:cubic-bezier(.4, .38, .2, 1);--wui-scale-enter:.95;--wui-dialog-scale-enter:1.1;--wui-focus-ring-width:3px;--wui-radius-control:calc(infinity * 1px);--wui-radius-menu:18px;--wui-radius-overlay:28px;display:contents}:host([motion=reduced]){--wui-duration-press:0s;--wui-duration-feedback:0s;--wui-duration-trigger:0s;--wui-duration-focus:0s;--wui-duration-float-enter:0s;--wui-duration-float-exit:0s;--wui-duration-dialog-enter:0s;--wui-duration-dialog-exit:0s;--wui-duration-drawer-enter:0s;--wui-duration-drawer-exit:0s;--wui-duration-drawer-nested:0s;--wui-duration-toast-enter:0s;--wui-duration-toast-exit:0s;--wui-duration-collapse-enter:0s;--wui-duration-collapse-exit:0s;--wui-duration-layout:0s;--wui-duration-swipe-settle:0s;--wui-theme-transition-duration:0s;--wui-duration-spin:1.6s;--wui-duration-spinner:1.6s;--wui-scale-enter:1;--wui-dialog-scale-enter:1}@media (prefers-reduced-motion:reduce){:host([motion=system]){--wui-duration-press:0s;--wui-duration-feedback:0s;--wui-duration-trigger:0s;--wui-duration-focus:0s;--wui-duration-float-enter:0s;--wui-duration-float-exit:0s;--wui-duration-dialog-enter:0s;--wui-duration-dialog-exit:0s;--wui-duration-drawer-enter:0s;--wui-duration-drawer-exit:0s;--wui-duration-drawer-nested:0s;--wui-duration-toast-enter:0s;--wui-duration-toast-exit:0s;--wui-duration-collapse-enter:0s;--wui-duration-collapse-exit:0s;--wui-duration-layout:0s;--wui-duration-swipe-settle:0s;--wui-theme-transition-duration:0s;--wui-duration-spin:1.6s;--wui-duration-spinner:1.6s;--wui-scale-enter:1;--wui-dialog-scale-enter:1}}:host([appearance=light]),:host([appearance=system]){--wui-color-page:#fff;--wui-color-surface:#fff;--wui-color-surface-raised:#f2f2f7;--wui-color-surface-control:#dfdfdf;--wui-color-surface-track:#e5e5ea;--wui-color-surface-menu:#f6f6f6d1;--wui-color-surface-glass:#fafafa57;--wui-color-surface-glass-hover:color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));--wui-color-surface-glass-active:color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));--wui-color-surface-overlay:#f6f6f6d1;--wui-color-surface-segmented:#e5e5ea;--wui-color-surface-selected:#fff;--wui-color-text:#1b1b1b;--wui-color-text-secondary:#6a6a6a;--wui-color-text-tertiary:color-mix(in srgb, var(--wui-color-text) 35%, transparent);--wui-color-text-disabled:color-mix(in srgb, var(--wui-color-text) 32%, transparent);--wui-color-state-layer-hover:color-mix(in srgb, var(--wui-color-text) 6%, transparent);--wui-color-state-layer-active:color-mix(in srgb, var(--wui-color-text) 15%, transparent);--wui-color-border:#0000001a;--wui-color-glass-border:transparent;--wui-color-glass-highlight:#ffffffe6;--wui-color-glass-corner:#ffffff80;--wui-color-glass-shade:#00000008;--wui-glass-brightness:1.06;--wui-color-accent:#08f;--wui-color-on-accent:#fff;--wui-color-on-control:#fff;--wui-color-success:#16a34a;--wui-color-warning:#d97706;--wui-color-danger:#dc2626;--wui-color-info:#2563eb;--wui-color-backdrop:#0000001f;--wui-shadow-overlay:2px 16px 40px #0006;--wui-shadow-panel:0 3px 9px #00000045;--wui-shadow-glass:0 0 1px #00000005, 0 0 8px #00000008, 0 2px 16px #00000006, 0 8px 32px #00000004;--wui-color-focus-ring:#08f6;--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:host([appearance=dark]){--wui-color-page:#242628;--wui-color-surface:#2c2c2e;--wui-color-surface-raised:#2c2c2e;--wui-color-surface-control:#3a3a3c;--wui-color-surface-track:#444446;--wui-color-surface-menu:#1e1e20eb;--wui-color-surface-glass:#2c2c2e6b;--wui-color-surface-glass-hover:color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));--wui-color-surface-glass-active:color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));--wui-color-surface-overlay:#202222e6;--wui-color-surface-segmented:#3a3a3c;--wui-color-surface-selected:#5c5c5e;--wui-color-text:#e9eaea;--wui-color-text-secondary:#a1a1a6;--wui-color-text-tertiary:color-mix(in srgb, var(--wui-color-text) 42%, transparent);--wui-color-text-disabled:color-mix(in srgb, var(--wui-color-text) 38%, transparent);--wui-color-state-layer-hover:color-mix(in srgb, var(--wui-color-text) 6%, transparent);--wui-color-state-layer-active:color-mix(in srgb, var(--wui-color-text) 15%, transparent);--wui-color-border:#ffffff24;--wui-color-glass-border:#ffffff0d;--wui-color-glass-highlight:#ffffff1a;--wui-color-glass-corner:#fff3;--wui-color-glass-shade:#00000080;--wui-glass-brightness:1.02;--wui-color-accent:#0a84ff;--wui-color-on-accent:#fff;--wui-color-on-control:#f2f2f7;--wui-color-success:#30d158;--wui-color-warning:#ff9f0a;--wui-color-danger:#ff453a;--wui-color-info:#64d2ff;--wui-color-backdrop:#0000007a;--wui-shadow-overlay:0 18px 48px #0000007a;--wui-shadow-panel:0 4px 16px #00000052;--wui-shadow-glass:0 8px 24px #00000014;--wui-color-focus-ring:#0a84ff9e;--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:dark){:host([appearance=system]){--wui-color-page:#242628;--wui-color-surface:#2c2c2e;--wui-color-surface-raised:#2c2c2e;--wui-color-surface-control:#3a3a3c;--wui-color-surface-track:#444446;--wui-color-surface-menu:#1e1e20eb;--wui-color-surface-glass:#2c2c2e6b;--wui-color-surface-glass-hover:color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));--wui-color-surface-glass-active:color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));--wui-color-surface-overlay:#202222e6;--wui-color-surface-segmented:#3a3a3c;--wui-color-surface-selected:#5c5c5e;--wui-color-text:#e9eaea;--wui-color-text-secondary:#a1a1a6;--wui-color-text-tertiary:color-mix(in srgb, var(--wui-color-text) 42%, transparent);--wui-color-text-disabled:color-mix(in srgb, var(--wui-color-text) 38%, transparent);--wui-color-state-layer-hover:color-mix(in srgb, var(--wui-color-text) 6%, transparent);--wui-color-state-layer-active:color-mix(in srgb, var(--wui-color-text) 15%, transparent);--wui-color-border:#ffffff24;--wui-color-glass-border:#ffffff0d;--wui-color-glass-highlight:#ffffff1a;--wui-color-glass-corner:#fff3;--wui-color-glass-shade:#00000080;--wui-glass-brightness:1.02;--wui-color-accent:#0a84ff;--wui-color-on-accent:#fff;--wui-color-on-control:#f2f2f7;--wui-color-success:#30d158;--wui-color-warning:#ff9f0a;--wui-color-danger:#ff453a;--wui-color-info:#64d2ff;--wui-color-backdrop:#0000007a;--wui-shadow-overlay:0 18px 48px #0000007a;--wui-shadow-panel:0 4px 16px #00000052;--wui-shadow-glass:0 8px 24px #00000014;--wui-color-focus-ring:#0a84ff9e;--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}";
3
3
  //#endregion
4
4
  export { e as default };
5
5
 
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/theme/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n --wui-font-size: 14px;\n --wui-input-width: 200px;\n --wui-control-size: 36px;\n --wui-overlay-min-width: 200px;\n\n /* z-index layers - 基础结构 */\n --wui-layer-base: 0;\n --wui-layer-inline-overlay: 1;\n --wui-layer-header: 10;\n --wui-layer-auxiliary: 20;\n --wui-layer-banner: 30;\n --wui-layer-tabbar: 40;\n --wui-layer-sidebar: 50;\n\n /* z-index layers - 浮层 */\n --wui-layer-menu: 100;\n --wui-layer-menu-nested: 110;\n --wui-layer-toast: 200;\n --wui-layer-loading: 300;\n --wui-duration-press: 80ms;\n --wui-duration-feedback: 100ms;\n --wui-duration-trigger: 160ms;\n --wui-duration-focus: 200ms;\n\n /* 锚定浮动面板(menu/popover/select/dropdown/tooltip/autocomplete)的进场与退场时长,\n 出场快于入场。 */\n --wui-duration-float-enter: 240ms;\n --wui-duration-float-exit: 160ms;\n --wui-duration-dialog-enter: 320ms;\n --wui-duration-dialog-exit: 260ms;\n --wui-duration-drawer-enter: 280ms;\n --wui-duration-drawer-exit: 240ms;\n --wui-duration-drawer-nested: 450ms;\n --wui-duration-toast-enter: 280ms;\n --wui-duration-toast-exit: 200ms;\n --wui-duration-collapse-enter: 200ms;\n --wui-duration-collapse-exit: 160ms;\n --wui-duration-layout: 200ms;\n\n /* image-preview 轮播回位:跟手结束后把轨道过渡到目标位。不属于进出场族,故单独成 token。 */\n --wui-duration-swipe-settle: 220ms;\n\n /* 无限循环的加载指示:icon 旋转与 spinner 叶片追光。周期属于动画自身而非转场,\n 但同样受 motion 契约约束,reduce 下只放慢不停。 */\n --wui-duration-spin: 600ms;\n --wui-duration-spinner: 800ms;\n\n --wui-ease-enter: cubic-bezier(0.23, 1, 0.32, 1);\n --wui-ease-dialog: cubic-bezier(0.2, 0, 0, 1);\n --wui-ease-slide: cubic-bezier(0.77, 0, 0.175, 1);\n\n /* 轮播回位的缓动:起步快、末段极慢,与 --wui-ease-slide(整卡位移)区分开。 */\n --wui-ease-swipe: cubic-bezier(0.32, 0.72, 0, 1);\n\n /* 锚定浮动面板专属进场缓动,无回弹弹簧拟合曲线。若改用 --wui-ease-enter,\n 开局 30% 的时间就走完 85% 进度,观感是先弹出再落位。 */\n --wui-ease-float: cubic-bezier(0.4, 0.38, 0.2, 1);\n\n /* 进场缩放起点。两族方向相反,各自成 token:浮动面板与 image-preview 由小到大展开\n (0.95 → 1),dialog 由大到小收缩(1.2 → 1,退场反向)。\n 方向由承载层决定。image-preview 是满视口表面,起点 >1 会把贴边的 counter/close/\n toolbar 推出视口并裁掉图片四边,只能留在 <1 的档位。dialog 是有界卡片,起点 1.2 只\n 在视口窄于 432px 时越界,且缩放与卡片 opacity 共用 --wui-ease-dialog,越界期间卡片\n 不透明度始终 ≤44.4%;要零越界而不是取满 1.2,把本 token 降到 1.111 即可。 */\n --wui-scale-enter: 0.95;\n --wui-dialog-scale-enter: 1.2;\n --wui-focus-ring-width: 3px;\n\n /* control=胶囊控件、menu=浮动菜单面板、overlay=大型覆盖层卡片 */\n --wui-radius-control: calc(infinity * 1px);\n --wui-radius-menu: 18px;\n --wui-radius-overlay: 28px;\n\n /* contents:主题宿主不生成盒、不绘制页面背景,嵌入方保留对宿主背景的完全控制\n (组件库不在宿主页面画背景)。自定义属性仍沿 DOM 树正常继承到 slotted 内容。 */\n display: contents;\n}\n\n:host([motion='reduced']) {\n --wui-duration-press: 0ms;\n --wui-duration-feedback: 0ms;\n --wui-duration-trigger: 0ms;\n --wui-duration-focus: 0ms;\n --wui-duration-float-enter: 0ms;\n --wui-duration-float-exit: 0ms;\n --wui-duration-dialog-enter: 0ms;\n --wui-duration-dialog-exit: 0ms;\n --wui-duration-drawer-enter: 0ms;\n --wui-duration-drawer-exit: 0ms;\n --wui-duration-drawer-nested: 0ms;\n --wui-duration-toast-enter: 0ms;\n --wui-duration-toast-exit: 0ms;\n --wui-duration-collapse-enter: 0ms;\n --wui-duration-collapse-exit: 0ms;\n --wui-duration-layout: 0ms;\n --wui-duration-swipe-settle: 0ms;\n\n /* 加载循环不在 reduce 下归零:它是「正在进行」的唯一信号,停掉会被读成界面卡死,只放慢。 */\n --wui-duration-spin: 1600ms;\n --wui-duration-spinner: 1600ms;\n\n --wui-scale-enter: 1;\n --wui-dialog-scale-enter: 1;\n}\n\n@media (prefers-reduced-motion: reduce) {\n :host([motion='system']) {\n --wui-duration-press: 0ms;\n --wui-duration-feedback: 0ms;\n --wui-duration-trigger: 0ms;\n --wui-duration-focus: 0ms;\n --wui-duration-float-enter: 0ms;\n --wui-duration-float-exit: 0ms;\n --wui-duration-dialog-enter: 0ms;\n --wui-duration-dialog-exit: 0ms;\n --wui-duration-drawer-enter: 0ms;\n --wui-duration-drawer-exit: 0ms;\n --wui-duration-drawer-nested: 0ms;\n --wui-duration-toast-enter: 0ms;\n --wui-duration-toast-exit: 0ms;\n --wui-duration-collapse-enter: 0ms;\n --wui-duration-collapse-exit: 0ms;\n --wui-duration-layout: 0ms;\n --wui-duration-swipe-settle: 0ms;\n\n /* 加载循环不在 reduce 下归零:它是「正在进行」的唯一信号,停掉会被读成界面卡死,只放慢。 */\n --wui-duration-spin: 1600ms;\n --wui-duration-spinner: 1600ms;\n\n --wui-scale-enter: 1;\n --wui-dialog-scale-enter: 1;\n }\n}\n\n:host([appearance='light']),\n:host([appearance='system']) {\n --wui-color-page: #fff;\n --wui-color-surface: #fff;\n --wui-color-surface-raised: #f2f2f7;\n --wui-color-surface-control: #dfdfdf;\n --wui-color-surface-track: #e5e5ea;\n --wui-color-surface-menu: rgb(246 246 246 / 0.82);\n --wui-color-surface-glass: rgb(250 250 250 / 0.34);\n --wui-color-surface-glass-hover: color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));\n --wui-color-surface-glass-active: color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));\n --wui-color-surface-overlay: rgb(246 246 246 / 0.82);\n --wui-color-surface-segmented: #e5e5ea;\n --wui-color-surface-selected: #fff;\n --wui-color-text: #1b1b1b;\n --wui-color-text-secondary: #6a6a6a;\n --wui-color-text-tertiary: color-mix(in srgb, var(--wui-color-text) 35%, transparent);\n --wui-color-text-disabled: color-mix(in srgb, var(--wui-color-text) 32%, transparent);\n --wui-color-state-layer-hover: color-mix(in srgb, var(--wui-color-text) 6%, transparent);\n --wui-color-state-layer-active: color-mix(in srgb, var(--wui-color-text) 15%, transparent);\n --wui-color-border: rgb(0 0 0 / 0.1);\n --wui-color-glass-border: transparent;\n --wui-color-glass-highlight: rgb(255 255 255 / 0.9);\n --wui-color-glass-corner: rgb(255 255 255 / 0.08);\n --wui-color-glass-shade: rgb(0 0 0 / 0.06);\n --wui-glass-brightness: 1.06;\n --wui-color-accent: #08f;\n --wui-color-on-accent: #fff;\n --wui-color-on-control: #fff;\n --wui-color-success: #16a34a;\n --wui-color-warning: #d97706;\n --wui-color-danger: #dc2626;\n --wui-color-info: #2563eb;\n --wui-color-backdrop: rgb(0 0 0 / 0.12);\n --wui-shadow-overlay: 2px 16px 40px rgb(0 0 0 / 0.4);\n --wui-shadow-panel: 0 3px 9px rgb(0 0 0 / 0.27);\n --wui-shadow-glass:\n 0 0 1px rgb(0 0 0 / 0.05), 0 0 8px rgb(0 0 0 / 0.03), 0 2px 16px rgb(0 0 0 / 0.025), 0 8px 32px rgb(0 0 0 / 0.015);\n --wui-color-focus-ring: rgb(0 136 255 / 0.4);\n color-scheme: light;\n}\n\n:host([appearance='dark']) {\n --wui-color-page: #242628;\n --wui-color-surface: #2c2c2e;\n --wui-color-surface-raised: #2c2c2e;\n --wui-color-surface-control: #3a3a3c;\n --wui-color-surface-track: #444446;\n --wui-color-surface-menu: rgb(30 30 32 / 0.92);\n --wui-color-surface-glass: rgb(44 44 46 / 0.42);\n --wui-color-surface-glass-hover: color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));\n --wui-color-surface-glass-active: color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));\n --wui-color-surface-overlay: rgb(32 34 34 / 0.9);\n --wui-color-surface-segmented: #3a3a3c;\n --wui-color-surface-selected: #5c5c5e;\n --wui-color-text: #e9eaea;\n --wui-color-text-secondary: #a1a1a6;\n --wui-color-text-tertiary: color-mix(in srgb, var(--wui-color-text) 42%, transparent);\n --wui-color-text-disabled: color-mix(in srgb, var(--wui-color-text) 38%, transparent);\n --wui-color-state-layer-hover: color-mix(in srgb, var(--wui-color-text) 6%, transparent);\n --wui-color-state-layer-active: color-mix(in srgb, var(--wui-color-text) 15%, transparent);\n --wui-color-border: rgb(255 255 255 / 0.14);\n --wui-color-glass-border: rgb(255 255 255 / 0.05);\n --wui-color-glass-highlight: rgb(255 255 255 / 0.1);\n --wui-color-glass-corner: rgb(255 255 255 / 0.2);\n --wui-color-glass-shade: rgb(0 0 0 / 0.5);\n --wui-glass-brightness: 1.02;\n --wui-color-accent: #0a84ff;\n --wui-color-on-accent: #fff;\n --wui-color-on-control: #f2f2f7;\n --wui-color-success: #30d158;\n --wui-color-warning: #ff9f0a;\n --wui-color-danger: #ff453a;\n --wui-color-info: #64d2ff;\n --wui-color-backdrop: rgb(0 0 0 / 0.48);\n --wui-shadow-overlay: 0 18px 48px rgb(0 0 0 / 0.48);\n --wui-shadow-panel: 0 4px 16px rgb(0 0 0 / 0.32);\n --wui-shadow-glass: 0 8px 24px rgb(0 0 0 / 0.08);\n --wui-color-focus-ring: rgb(10 132 255 / 0.62);\n color-scheme: dark;\n}\n\n@media (prefers-color-scheme: dark) {\n :host([appearance='system']) {\n --wui-color-page: #242628;\n --wui-color-surface: #2c2c2e;\n --wui-color-surface-raised: #2c2c2e;\n --wui-color-surface-control: #3a3a3c;\n --wui-color-surface-track: #444446;\n --wui-color-surface-menu: rgb(30 30 32 / 0.92);\n --wui-color-surface-glass: rgb(44 44 46 / 0.42);\n --wui-color-surface-glass-hover: color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));\n --wui-color-surface-glass-active: color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));\n --wui-color-surface-overlay: rgb(32 34 34 / 0.9);\n --wui-color-surface-segmented: #3a3a3c;\n --wui-color-surface-selected: #5c5c5e;\n --wui-color-text: #e9eaea;\n --wui-color-text-secondary: #a1a1a6;\n --wui-color-text-tertiary: color-mix(in srgb, var(--wui-color-text) 42%, transparent);\n --wui-color-text-disabled: color-mix(in srgb, var(--wui-color-text) 38%, transparent);\n --wui-color-state-layer-hover: color-mix(in srgb, var(--wui-color-text) 6%, transparent);\n --wui-color-state-layer-active: color-mix(in srgb, var(--wui-color-text) 15%, transparent);\n --wui-color-border: rgb(255 255 255 / 0.14);\n --wui-color-glass-border: rgb(255 255 255 / 0.05);\n --wui-color-glass-highlight: rgb(255 255 255 / 0.1);\n --wui-color-glass-corner: rgb(255 255 255 / 0.2);\n --wui-color-glass-shade: rgb(0 0 0 / 0.5);\n --wui-glass-brightness: 1.02;\n --wui-color-accent: #0a84ff;\n --wui-color-on-accent: #fff;\n --wui-color-on-control: #f2f2f7;\n --wui-color-success: #30d158;\n --wui-color-warning: #ff9f0a;\n --wui-color-danger: #ff453a;\n --wui-color-info: #64d2ff;\n --wui-color-backdrop: rgb(0 0 0 / 0.48);\n --wui-shadow-overlay: 0 18px 48px rgb(0 0 0 / 0.48);\n --wui-shadow-panel: 0 4px 16px rgb(0 0 0 / 0.32);\n --wui-shadow-glass: 0 8px 24px rgb(0 0 0 / 0.08);\n --wui-color-focus-ring: rgb(10 132 255 / 0.62);\n color-scheme: dark;\n }\n}\n"],"mappings":""}
1
+ {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/theme/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n --wui-font-size: 14px;\n --wui-input-width: 200px;\n --wui-control-size: 36px;\n --wui-overlay-min-width: 200px;\n\n /* radio / checkbox 指示器尺寸。宿主高度由内容撑开,不继承页面行高。 */\n --wui-selection-control-size: 18px;\n\n /* radio-group / checkbox-group 成员间距,两个 group 各自可覆盖。 */\n --wui-radio-group-gap: 8px;\n --wui-checkbox-group-gap: 8px;\n\n /* z-index layers - 基础结构 */\n --wui-layer-base: 0;\n --wui-layer-inline-overlay: 1;\n --wui-layer-header: 10;\n --wui-layer-auxiliary: 20;\n --wui-layer-banner: 30;\n --wui-layer-tabbar: 40;\n --wui-layer-sidebar: 50;\n\n /* z-index layers - 浮层 */\n --wui-layer-menu: 100;\n --wui-layer-menu-nested: 110;\n --wui-layer-toast: 200;\n --wui-layer-loading: 300;\n --wui-duration-press: 80ms;\n --wui-duration-feedback: 100ms;\n --wui-duration-trigger: 160ms;\n --wui-duration-focus: 200ms;\n\n /* 锚定浮动面板(menu/popover/select/dropdown/tooltip/autocomplete)的进场与退场时长,\n 出场快于入场。 */\n --wui-duration-float-enter: 240ms;\n --wui-duration-float-exit: 160ms;\n --wui-duration-dialog-enter: 320ms;\n --wui-duration-dialog-exit: 260ms;\n --wui-duration-drawer-enter: 280ms;\n --wui-duration-drawer-exit: 240ms;\n --wui-duration-drawer-nested: 450ms;\n --wui-duration-toast-enter: 280ms;\n --wui-duration-toast-exit: 200ms;\n --wui-duration-collapse-enter: 200ms;\n --wui-duration-collapse-exit: 160ms;\n --wui-duration-layout: 200ms;\n\n /* image-preview 轮播回位:跟手结束后把轨道过渡到目标位。不属于进出场族,故单独成 token。 */\n --wui-duration-swipe-settle: 220ms;\n\n /* 无限循环的加载指示:icon 旋转与 spinner 叶片追光。周期属于动画自身而非转场,\n 但同样受 motion 契约约束,reduce 下只放慢不停。 */\n --wui-duration-spin: 600ms;\n --wui-duration-spinner: 800ms;\n --wui-theme-transition-duration: 500ms;\n --wui-theme-transition-easing: ease-in;\n\n --wui-ease-enter: cubic-bezier(0.23, 1, 0.32, 1);\n --wui-ease-dialog: cubic-bezier(0.2, 0, 0, 1);\n --wui-ease-slide: cubic-bezier(0.77, 0, 0.175, 1);\n\n /* 轮播回位的缓动:起步快、末段极慢,与 --wui-ease-slide(整卡位移)区分开。 */\n --wui-ease-swipe: cubic-bezier(0.32, 0.72, 0, 1);\n\n /* 锚定浮动面板专属进场缓动,无回弹弹簧拟合曲线。若改用 --wui-ease-enter,\n 开局 30% 的时间就走完 85% 进度,观感是先弹出再落位。 */\n --wui-ease-float: cubic-bezier(0.4, 0.38, 0.2, 1);\n\n /* 进场缩放起点。两族方向相反,各自成 token:浮动面板与 image-preview 由小到大展开\n (0.95 → 1),dialog 由大到小收缩(1.1 → 1,退场反向)。\n 方向由承载层决定。image-preview 是满视口表面,起点 >1 会把贴边的 counter/close/\n toolbar 推出视口并裁掉图片四边,只能留在 <1 的档位。dialog 是有界卡片,起点须低于\n 零越界上限 1/0.9 ≈ 1.111(min(90vw, --wui-dialog-width) 两分支在 400px 视口汇合);\n 1.1 在任意视口都不越界。曾用 1.2,窄视口会短暂越界(约 57ms、卡片不透明度 ≤44.4%,\n 分析见 ADR-0006),260919 下调。 */\n --wui-scale-enter: 0.95;\n --wui-dialog-scale-enter: 1.1;\n --wui-focus-ring-width: 3px;\n\n /* control=胶囊控件、menu=浮动菜单面板、overlay=大型覆盖层卡片 */\n --wui-radius-control: calc(infinity * 1px);\n --wui-radius-menu: 18px;\n --wui-radius-overlay: 28px;\n\n /* contents:主题宿主不生成盒、不绘制页面背景,嵌入方保留对宿主背景的完全控制\n (组件库不在宿主页面画背景)。自定义属性仍沿 DOM 树正常继承到 slotted 内容。 */\n display: contents;\n}\n\n:host([motion='reduced']) {\n --wui-duration-press: 0ms;\n --wui-duration-feedback: 0ms;\n --wui-duration-trigger: 0ms;\n --wui-duration-focus: 0ms;\n --wui-duration-float-enter: 0ms;\n --wui-duration-float-exit: 0ms;\n --wui-duration-dialog-enter: 0ms;\n --wui-duration-dialog-exit: 0ms;\n --wui-duration-drawer-enter: 0ms;\n --wui-duration-drawer-exit: 0ms;\n --wui-duration-drawer-nested: 0ms;\n --wui-duration-toast-enter: 0ms;\n --wui-duration-toast-exit: 0ms;\n --wui-duration-collapse-enter: 0ms;\n --wui-duration-collapse-exit: 0ms;\n --wui-duration-layout: 0ms;\n --wui-duration-swipe-settle: 0ms;\n --wui-theme-transition-duration: 0ms;\n\n /* 加载循环不在 reduce 下归零:它是「正在进行」的唯一信号,停掉会被读成界面卡死,只放慢。 */\n --wui-duration-spin: 1600ms;\n --wui-duration-spinner: 1600ms;\n\n --wui-scale-enter: 1;\n --wui-dialog-scale-enter: 1;\n}\n\n@media (prefers-reduced-motion: reduce) {\n :host([motion='system']) {\n --wui-duration-press: 0ms;\n --wui-duration-feedback: 0ms;\n --wui-duration-trigger: 0ms;\n --wui-duration-focus: 0ms;\n --wui-duration-float-enter: 0ms;\n --wui-duration-float-exit: 0ms;\n --wui-duration-dialog-enter: 0ms;\n --wui-duration-dialog-exit: 0ms;\n --wui-duration-drawer-enter: 0ms;\n --wui-duration-drawer-exit: 0ms;\n --wui-duration-drawer-nested: 0ms;\n --wui-duration-toast-enter: 0ms;\n --wui-duration-toast-exit: 0ms;\n --wui-duration-collapse-enter: 0ms;\n --wui-duration-collapse-exit: 0ms;\n --wui-duration-layout: 0ms;\n --wui-duration-swipe-settle: 0ms;\n --wui-theme-transition-duration: 0ms;\n\n /* 加载循环不在 reduce 下归零:它是「正在进行」的唯一信号,停掉会被读成界面卡死,只放慢。 */\n --wui-duration-spin: 1600ms;\n --wui-duration-spinner: 1600ms;\n\n --wui-scale-enter: 1;\n --wui-dialog-scale-enter: 1;\n }\n}\n\n:host([appearance='light']),\n:host([appearance='system']) {\n --wui-color-page: #fff;\n --wui-color-surface: #fff;\n --wui-color-surface-raised: #f2f2f7;\n --wui-color-surface-control: #dfdfdf;\n --wui-color-surface-track: #e5e5ea;\n --wui-color-surface-menu: rgb(246 246 246 / 0.82);\n --wui-color-surface-glass: rgb(250 250 250 / 0.34);\n --wui-color-surface-glass-hover: color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));\n --wui-color-surface-glass-active: color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));\n --wui-color-surface-overlay: rgb(246 246 246 / 0.82);\n --wui-color-surface-segmented: #e5e5ea;\n --wui-color-surface-selected: #fff;\n --wui-color-text: #1b1b1b;\n --wui-color-text-secondary: #6a6a6a;\n --wui-color-text-tertiary: color-mix(in srgb, var(--wui-color-text) 35%, transparent);\n --wui-color-text-disabled: color-mix(in srgb, var(--wui-color-text) 32%, transparent);\n --wui-color-state-layer-hover: color-mix(in srgb, var(--wui-color-text) 6%, transparent);\n --wui-color-state-layer-active: color-mix(in srgb, var(--wui-color-text) 15%, transparent);\n --wui-color-border: rgb(0 0 0 / 0.1);\n --wui-color-glass-border: transparent;\n --wui-color-glass-highlight: rgb(255 255 255 / 0.9);\n --wui-color-glass-corner: rgb(255 255 255 / 0.5);\n --wui-color-glass-shade: rgb(0 0 0 / 0.03);\n --wui-glass-brightness: 1.06;\n --wui-color-accent: #08f;\n --wui-color-on-accent: #fff;\n --wui-color-on-control: #fff;\n --wui-color-success: #16a34a;\n --wui-color-warning: #d97706;\n --wui-color-danger: #dc2626;\n --wui-color-info: #2563eb;\n --wui-color-backdrop: rgb(0 0 0 / 0.12);\n --wui-shadow-overlay: 2px 16px 40px rgb(0 0 0 / 0.4);\n --wui-shadow-panel: 0 3px 9px rgb(0 0 0 / 0.27);\n --wui-shadow-glass:\n 0 0 1px rgb(0 0 0 / 0.02), 0 0 8px rgb(0 0 0 / 0.03), 0 2px 16px rgb(0 0 0 / 0.025), 0 8px 32px rgb(0 0 0 / 0.015);\n --wui-color-focus-ring: rgb(0 136 255 / 0.4);\n color-scheme: light;\n}\n\n:host([appearance='dark']) {\n --wui-color-page: #242628;\n --wui-color-surface: #2c2c2e;\n --wui-color-surface-raised: #2c2c2e;\n --wui-color-surface-control: #3a3a3c;\n --wui-color-surface-track: #444446;\n --wui-color-surface-menu: rgb(30 30 32 / 0.92);\n --wui-color-surface-glass: rgb(44 44 46 / 0.42);\n --wui-color-surface-glass-hover: color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));\n --wui-color-surface-glass-active: color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));\n --wui-color-surface-overlay: rgb(32 34 34 / 0.9);\n --wui-color-surface-segmented: #3a3a3c;\n --wui-color-surface-selected: #5c5c5e;\n --wui-color-text: #e9eaea;\n --wui-color-text-secondary: #a1a1a6;\n --wui-color-text-tertiary: color-mix(in srgb, var(--wui-color-text) 42%, transparent);\n --wui-color-text-disabled: color-mix(in srgb, var(--wui-color-text) 38%, transparent);\n --wui-color-state-layer-hover: color-mix(in srgb, var(--wui-color-text) 6%, transparent);\n --wui-color-state-layer-active: color-mix(in srgb, var(--wui-color-text) 15%, transparent);\n --wui-color-border: rgb(255 255 255 / 0.14);\n --wui-color-glass-border: rgb(255 255 255 / 0.05);\n --wui-color-glass-highlight: rgb(255 255 255 / 0.1);\n --wui-color-glass-corner: rgb(255 255 255 / 0.2);\n --wui-color-glass-shade: rgb(0 0 0 / 0.5);\n --wui-glass-brightness: 1.02;\n --wui-color-accent: #0a84ff;\n --wui-color-on-accent: #fff;\n --wui-color-on-control: #f2f2f7;\n --wui-color-success: #30d158;\n --wui-color-warning: #ff9f0a;\n --wui-color-danger: #ff453a;\n --wui-color-info: #64d2ff;\n --wui-color-backdrop: rgb(0 0 0 / 0.48);\n --wui-shadow-overlay: 0 18px 48px rgb(0 0 0 / 0.48);\n --wui-shadow-panel: 0 4px 16px rgb(0 0 0 / 0.32);\n --wui-shadow-glass: 0 8px 24px rgb(0 0 0 / 0.08);\n --wui-color-focus-ring: rgb(10 132 255 / 0.62);\n color-scheme: dark;\n}\n\n@media (prefers-color-scheme: dark) {\n :host([appearance='system']) {\n --wui-color-page: #242628;\n --wui-color-surface: #2c2c2e;\n --wui-color-surface-raised: #2c2c2e;\n --wui-color-surface-control: #3a3a3c;\n --wui-color-surface-track: #444446;\n --wui-color-surface-menu: rgb(30 30 32 / 0.92);\n --wui-color-surface-glass: rgb(44 44 46 / 0.42);\n --wui-color-surface-glass-hover: color-mix(in srgb, var(--wui-color-text) 6%, var(--wui-color-surface-glass));\n --wui-color-surface-glass-active: color-mix(in srgb, var(--wui-color-text) 15%, var(--wui-color-surface-glass));\n --wui-color-surface-overlay: rgb(32 34 34 / 0.9);\n --wui-color-surface-segmented: #3a3a3c;\n --wui-color-surface-selected: #5c5c5e;\n --wui-color-text: #e9eaea;\n --wui-color-text-secondary: #a1a1a6;\n --wui-color-text-tertiary: color-mix(in srgb, var(--wui-color-text) 42%, transparent);\n --wui-color-text-disabled: color-mix(in srgb, var(--wui-color-text) 38%, transparent);\n --wui-color-state-layer-hover: color-mix(in srgb, var(--wui-color-text) 6%, transparent);\n --wui-color-state-layer-active: color-mix(in srgb, var(--wui-color-text) 15%, transparent);\n --wui-color-border: rgb(255 255 255 / 0.14);\n --wui-color-glass-border: rgb(255 255 255 / 0.05);\n --wui-color-glass-highlight: rgb(255 255 255 / 0.1);\n --wui-color-glass-corner: rgb(255 255 255 / 0.2);\n --wui-color-glass-shade: rgb(0 0 0 / 0.5);\n --wui-glass-brightness: 1.02;\n --wui-color-accent: #0a84ff;\n --wui-color-on-accent: #fff;\n --wui-color-on-control: #f2f2f7;\n --wui-color-success: #30d158;\n --wui-color-warning: #ff9f0a;\n --wui-color-danger: #ff453a;\n --wui-color-info: #64d2ff;\n --wui-color-backdrop: rgb(0 0 0 / 0.48);\n --wui-shadow-overlay: 0 18px 48px rgb(0 0 0 / 0.48);\n --wui-shadow-panel: 0 4px 16px rgb(0 0 0 / 0.32);\n --wui-shadow-glass: 0 8px 24px rgb(0 0 0 / 0.08);\n --wui-color-focus-ring: rgb(10 132 255 / 0.62);\n color-scheme: dark;\n }\n}\n"],"mappings":""}
@@ -1,3 +1,3 @@
1
1
  export { toast } from './manager';
2
2
  export { WebUiToast } from './toast';
3
- export type { ToastCloseReason, ToastInstanceOptions, ToastMessageUpdateOptions, ToastOptions, ToastPosition, ToastType } from './types';
3
+ export type { ToastCloseReason, ToastInstanceOptions, ToastOptions, ToastPosition, ToastType } from './types';
@@ -1,4 +1,4 @@
1
- import { ToastInstanceOptions, ToastMessageUpdateOptions, ToastOptions } from './types';
1
+ import { ToastInstanceOptions, ToastOptions } from './types';
2
2
  type ToastShortcutOptions = Omit<ToastOptions, 'message' | 'type'> & Pick<ToastInstanceOptions, 'position'>;
3
3
  declare function toast(options: ToastInstanceOptions): string;
4
4
  declare namespace toast {
@@ -8,8 +8,6 @@ declare namespace toast {
8
8
  var error: (message: string, options?: ToastShortcutOptions) => string;
9
9
  var close: (id: string) => void;
10
10
  var clear: () => void;
11
- var updateMessage: (id: string, options: ToastMessageUpdateOptions) => void;
12
- var _visibleCount: () => number;
13
11
  var _reset: () => void;
14
12
  }
15
13
  export { toast };
@@ -5,87 +5,130 @@ var r = 0, i = /* @__PURE__ */ new Set(), a = /* @__PURE__ */ new Map(), o, s =
5
5
  function c() {
6
6
  return `toast-${++r}`;
7
7
  }
8
- function l(e, t) {
8
+ function l(r) {
9
+ let i = r.target ? t(r.target) : n();
10
+ return r.container ?? i?.getOverlayRoot() ?? e();
11
+ }
12
+ function u(e, t) {
9
13
  let n = Array.from(t.children).find((t) => t instanceof HTMLElement && t.dataset.wuiToastPosition === e);
10
14
  if (n) return n;
11
15
  let r = document.createElement("div");
12
16
  return r.className = `wui-toast-container wui-toast-${e}`, r.dataset.wuiToastPosition = e, r.setAttribute("role", "log"), r.setAttribute("aria-live", "polite"), r.setAttribute("aria-relevant", "additions"), t.appendChild(r), i.add(r), r.addEventListener("pointerenter", () => r.dataset.hovered = "true"), r.addEventListener("pointerleave", () => {
13
- delete r.dataset.hovered, u(r);
17
+ delete r.dataset.hovered, f(r);
14
18
  }), r;
15
19
  }
16
- function u(e) {
20
+ function d(e) {
21
+ !e || e.children.length > 0 || (e.remove(), i.delete(e));
22
+ }
23
+ function f(e) {
17
24
  e.dataset.hovered !== "true" && requestAnimationFrame(() => {
18
25
  e.scrollTop = e.scrollHeight;
19
26
  });
20
27
  }
21
- function d() {
22
- s || (s = !0, Promise.resolve().then(f));
28
+ function p() {
29
+ s || (s = !0, Promise.resolve().then(m));
23
30
  }
24
- function f() {
31
+ function m() {
25
32
  s = !1;
26
33
  let e = o;
27
34
  if (o = void 0, !e) return;
28
35
  let t = /* @__PURE__ */ new Set();
29
- for (let n of e) m(n.id, n.options, n.container), t.add(n.container);
30
- for (let e of t) u(e);
31
- }
32
- function p(r) {
33
- let i = r.id || c();
34
- if (a.has(i)) return i;
35
- let s = r.position || "top-right", u = r.target ? t(r.target) : n(), f = l(s, r.container ?? u?.getOverlayRoot() ?? e());
36
- return o ||= [], o.push({
37
- id: i,
38
- options: r,
39
- container: f
40
- }), d(), i;
41
- }
42
- function m(e, t, n) {
43
- let r = document.createElement("web-ui-toast");
44
- r.toastId = e, r.type = t.type || "info", r.position = t.position || "top-right", r.heading = t.heading || "", r.message = t.message, r.duration = t.duration ?? 3e3, r.noCloseButton = t.closable === !1, r.addEventListener("toast-close", (e) => {
45
- let t = e.detail;
46
- h(t.id);
47
- }), n.appendChild(r), a.set(e, r), requestAnimationFrame(() => r.show());
48
- }
49
- function h(e) {
50
- let t = a.get(e);
51
- t && (t.remove(), a.delete(e));
52
- }
53
- function g(e) {
54
- a.get(e)?.dismiss("programmatic");
55
- }
56
- function _() {
57
- for (let e of a.values()) e.dismiss("clear");
36
+ for (let n of e) {
37
+ let e = u(n.options.position || "top-right", n.root);
38
+ y(n.id, n.options, e), t.add(e);
39
+ }
40
+ for (let e of t) f(e);
41
+ }
42
+ function h(e, t) {
43
+ return {
44
+ ...e,
45
+ message: t.message ?? e.message,
46
+ heading: t.heading ?? e.heading,
47
+ type: t.type ?? e.type,
48
+ duration: t.duration ?? e.duration,
49
+ closable: t.closable ?? e.closable,
50
+ position: t.position ?? e.position,
51
+ container: e.container,
52
+ target: e.target
53
+ };
58
54
  }
59
- function v(e, t) {
55
+ function g(e, t) {
56
+ t.message !== void 0 && (e.message = t.message), t.heading !== void 0 && (e.heading = t.heading), t.type !== void 0 && (e.type = t.type), t.closable !== void 0 && (e.noCloseButton = t.closable === !1), t.duration !== void 0 && e.setDuration(t.duration), t.position !== void 0 && t.position !== e.position && _(e, t.position);
57
+ }
58
+ function _(e, t) {
59
+ let n = e.parentElement, r = n?.parentElement;
60
+ if (!r) return;
61
+ let i = u(t, r), a = i;
62
+ typeof a.moveBefore == "function" ? a.moveBefore(e, null) : (e.pauseAutoClose(), i.appendChild(e), e.resumeAutoClose()), e.position = t, d(n), f(i);
63
+ }
64
+ function v(e) {
65
+ let t = e.id || c(), n = a.get(t);
66
+ if (n) {
67
+ if (n.isConnected && !n.dismissing) return g(n, e), t;
68
+ a.delete(t);
69
+ }
70
+ let r = o?.find((e) => e.id === t);
71
+ return r ? (r.options = h(r.options, e), t) : (o ||= [], o.push({
72
+ id: t,
73
+ options: e,
74
+ root: l(e)
75
+ }), p(), t);
76
+ }
77
+ function y(e, t, n) {
78
+ let r = document.createElement("web-ui-toast"), i = t.type || "info";
79
+ r.toastId = e, r.type = i, r.position = t.position || "top-right", r.heading = t.heading || "", r.message = t.message, r.duration = t.duration ?? (i === "error" ? 5e3 : 3e3), r.noCloseButton = t.closable === !1, r.addEventListener("toast-close", () => b(r)), n.appendChild(r), a.set(e, r), requestAnimationFrame(() => {
80
+ r.dismissing || r.show();
81
+ });
82
+ }
83
+ function b(e) {
84
+ a.get(e.toastId) === e && a.delete(e.toastId);
85
+ let t = e.parentElement;
86
+ e.remove(), d(t);
87
+ }
88
+ function x(e) {
89
+ for (let t of i) for (let n of Array.from(t.children)) n.tagName === "WEB-UI-TOAST" && n.toastId === e && n.remove();
90
+ for (let e of Array.from(i)) d(e);
91
+ }
92
+ function S(e) {
93
+ let t = o;
94
+ if (t) {
95
+ let n = t.findIndex((t) => t.id === e);
96
+ if (n >= 0) {
97
+ t.splice(n, 1);
98
+ return;
99
+ }
100
+ }
60
101
  let n = a.get(e);
61
102
  if (n) {
62
- n.message = t.message, t.heading !== void 0 && (n.heading = t.heading);
103
+ n.dismiss("programmatic");
63
104
  return;
64
105
  }
65
- let r = o?.find((t) => t.id === e);
66
- r && (r.options.message = t.message, t.heading !== void 0 && (r.options.heading = t.heading));
106
+ x(e);
107
+ }
108
+ function C() {
109
+ o = void 0;
110
+ for (let e of a.values()) e.dismiss("clear");
67
111
  }
68
- function y(e) {
69
- return p(e);
112
+ function w(e) {
113
+ return v(e);
70
114
  }
71
- y.success = (e, t) => p({
115
+ w.success = (e, t) => v({
72
116
  ...t,
73
117
  message: e,
74
118
  type: "success"
75
- }), y.info = (e, t) => p({
119
+ }), w.info = (e, t) => v({
76
120
  ...t,
77
121
  message: e,
78
122
  type: "info"
79
- }), y.warning = (e, t) => p({
123
+ }), w.warning = (e, t) => v({
80
124
  ...t,
81
125
  message: e,
82
126
  type: "warning"
83
- }), y.error = (e, t) => p({
127
+ }), w.error = (e, t) => v({
84
128
  ...t,
85
129
  message: e,
86
- type: "error",
87
- duration: t?.duration ?? 5e3
88
- }), y.close = g, y.clear = _, y.updateMessage = v, y._visibleCount = () => a.size, y._reset = () => {
130
+ type: "error"
131
+ }), w.close = S, w.clear = C, w._reset = () => {
89
132
  o = void 0, s = !1;
90
133
  for (let e of a.values()) e.remove();
91
134
  a.clear();
@@ -93,6 +136,6 @@ y.success = (e, t) => p({
93
136
  i.clear();
94
137
  };
95
138
  //#endregion
96
- export { y as toast };
139
+ export { w as toast };
97
140
 
98
141
  //# sourceMappingURL=manager.js.map