@greypan/web-ui 2.1.7 → 3.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 (147) hide show
  1. package/README.CN.md +95 -41
  2. package/README.md +100 -42
  3. package/dist/assets/glass.js.map +1 -1
  4. package/dist/assets/menu-portal.js +1 -1
  5. package/dist/assets/menu-portal.js.map +1 -1
  6. package/dist/components/autocomplete/index.d.ts +121 -0
  7. package/dist/components/autocomplete/index.js +414 -0
  8. package/dist/components/autocomplete/index.js.map +1 -0
  9. package/dist/components/autocomplete/style.js +6 -0
  10. package/dist/components/autocomplete/style.js.map +1 -0
  11. package/dist/components/avatar/index.d.ts +0 -1
  12. package/dist/components/avatar/index.js +9 -9
  13. package/dist/components/avatar/index.js.map +1 -1
  14. package/dist/components/back-top/index.d.ts +0 -1
  15. package/dist/components/back-top/index.js +1 -1
  16. package/dist/components/back-top/index.js.map +1 -1
  17. package/dist/components/badge/index.d.ts +0 -1
  18. package/dist/components/badge/index.js +5 -5
  19. package/dist/components/badge/index.js.map +1 -1
  20. package/dist/components/button/index.d.ts +6 -2
  21. package/dist/components/button/index.js +40 -19
  22. package/dist/components/button/index.js.map +1 -1
  23. package/dist/components/button/style.js +1 -1
  24. package/dist/components/button/style.js.map +1 -1
  25. package/dist/components/button-group/index.d.ts +0 -1
  26. package/dist/components/button-group/index.js.map +1 -1
  27. package/dist/components/checkbox/index.d.ts +0 -3
  28. package/dist/components/checkbox/index.js +7 -5
  29. package/dist/components/checkbox/index.js.map +1 -1
  30. package/dist/components/checkbox-group/index.js +2 -2
  31. package/dist/components/checkbox-group/index.js.map +1 -1
  32. package/dist/components/context-menu/index.d.ts +4 -3
  33. package/dist/components/context-menu/index.js +47 -50
  34. package/dist/components/context-menu/index.js.map +1 -1
  35. package/dist/components/dialog/index.d.ts +1 -1
  36. package/dist/components/dialog/index.js +20 -19
  37. package/dist/components/dialog/index.js.map +1 -1
  38. package/dist/components/drawer/index.d.ts +2 -3
  39. package/dist/components/drawer/index.js +43 -33
  40. package/dist/components/drawer/index.js.map +1 -1
  41. package/dist/components/drawer/style.js +1 -1
  42. package/dist/components/drawer/style.js.map +1 -1
  43. package/dist/components/dropdown/index.d.ts +2 -9
  44. package/dist/components/dropdown/index.js +58 -53
  45. package/dist/components/dropdown/index.js.map +1 -1
  46. package/dist/components/dropdown-divider/index.d.ts +0 -1
  47. package/dist/components/dropdown-divider/index.js.map +1 -1
  48. package/dist/components/dropdown-header/index.d.ts +0 -1
  49. package/dist/components/dropdown-header/index.js.map +1 -1
  50. package/dist/components/dropdown-item/index.d.ts +0 -2
  51. package/dist/components/dropdown-item/index.js.map +1 -1
  52. package/dist/components/dropdown-item/style.js +1 -1
  53. package/dist/components/dropdown-item/style.js.map +1 -1
  54. package/dist/components/empty/index.d.ts +0 -1
  55. package/dist/components/empty/index.js +6 -6
  56. package/dist/components/empty/index.js.map +1 -1
  57. package/dist/components/icon/index.d.ts +0 -1
  58. package/dist/components/icon/index.js.map +1 -1
  59. package/dist/components/index.d.ts +5 -0
  60. package/dist/components/index.js +36 -35
  61. package/dist/components/input/index.d.ts +3 -0
  62. package/dist/components/input/index.js +48 -24
  63. package/dist/components/input/index.js.map +1 -1
  64. package/dist/components/input/style.js +1 -1
  65. package/dist/components/input/style.js.map +1 -1
  66. package/dist/components/input-number/index.d.ts +2 -0
  67. package/dist/components/input-number/index.js +25 -12
  68. package/dist/components/input-number/index.js.map +1 -1
  69. package/dist/components/input-number/style.js +1 -1
  70. package/dist/components/input-number/style.js.map +1 -1
  71. package/dist/components/layout/index.d.ts +0 -1
  72. package/dist/components/layout/index.js +4 -4
  73. package/dist/components/layout/index.js.map +1 -1
  74. package/dist/components/option/index.d.ts +0 -11
  75. package/dist/components/option/index.js +1 -1
  76. package/dist/components/option/index.js.map +1 -1
  77. package/dist/components/option/style.js +1 -1
  78. package/dist/components/option/style.js.map +1 -1
  79. package/dist/components/popover/index.d.ts +1 -5
  80. package/dist/components/popover/index.js +42 -37
  81. package/dist/components/popover/index.js.map +1 -1
  82. package/dist/components/radio/index.d.ts +0 -3
  83. package/dist/components/radio/index.js +8 -5
  84. package/dist/components/radio/index.js.map +1 -1
  85. package/dist/components/radio-group/index.js +2 -2
  86. package/dist/components/radio-group/index.js.map +1 -1
  87. package/dist/components/segmented/index.js +8 -4
  88. package/dist/components/segmented/index.js.map +1 -1
  89. package/dist/components/segmented-trigger/index.d.ts +1 -0
  90. package/dist/components/segmented-trigger/index.js +12 -3
  91. package/dist/components/segmented-trigger/index.js.map +1 -1
  92. package/dist/components/segmented-trigger/style.js +1 -1
  93. package/dist/components/segmented-trigger/style.js.map +1 -1
  94. package/dist/components/select/index.d.ts +0 -1
  95. package/dist/components/select/index.js +22 -31
  96. package/dist/components/select/index.js.map +1 -1
  97. package/dist/components/select/style.js +1 -1
  98. package/dist/components/select/style.js.map +1 -1
  99. package/dist/components/slider/index.d.ts +0 -2
  100. package/dist/components/slider/index.js +1 -1
  101. package/dist/components/slider/index.js.map +1 -1
  102. package/dist/components/spinner/index.d.ts +0 -3
  103. package/dist/components/spinner/index.js.map +1 -1
  104. package/dist/components/svg-draw-lines/index.d.ts +0 -3
  105. package/dist/components/svg-draw-lines/index.js.map +1 -1
  106. package/dist/components/switch/index.d.ts +0 -1
  107. package/dist/components/switch/index.js +6 -6
  108. package/dist/components/switch/index.js.map +1 -1
  109. package/dist/components/switch/style.js +1 -1
  110. package/dist/components/switch/style.js.map +1 -1
  111. package/dist/components/textarea/index.d.ts +1 -0
  112. package/dist/components/textarea/index.js +51 -34
  113. package/dist/components/textarea/index.js.map +1 -1
  114. package/dist/components/textarea/style.js +1 -1
  115. package/dist/components/textarea/style.js.map +1 -1
  116. package/dist/components/theme/index.d.ts +0 -3
  117. package/dist/components/theme/index.js.map +1 -1
  118. package/dist/components/toast/manager.js.map +1 -1
  119. package/dist/components/toast/style.js +1 -1
  120. package/dist/components/toast/style.js.map +1 -1
  121. package/dist/components/toast/toast.d.ts +0 -4
  122. package/dist/components/toast/toast.js +25 -17
  123. package/dist/components/toast/toast.js.map +1 -1
  124. package/dist/components/toast/types.d.ts +0 -3
  125. package/dist/components/tooltip/index.d.ts +1 -0
  126. package/dist/components/tooltip/index.js +34 -33
  127. package/dist/components/tooltip/index.js.map +1 -1
  128. package/dist/shared/events/user-change.js +17 -0
  129. package/dist/shared/events/user-change.js.map +1 -0
  130. package/dist/shared/menu-portal/menu-portal.js +10 -11
  131. package/dist/shared/menu-portal/menu-portal.js.map +1 -1
  132. package/dist/shared/normalize/index.js.map +1 -1
  133. package/dist/shared/overlay/anchored-panel.js +12 -12
  134. package/dist/shared/overlay/native-dialog-presence.js +8 -3
  135. package/dist/shared/overlay/native-dialog-presence.js.map +1 -1
  136. package/dist/shared/overlay/overlay.js +55 -33
  137. package/dist/shared/overlay/overlay.js.map +1 -1
  138. package/dist/shared/overlay/portal.js +27 -13
  139. package/dist/shared/overlay/portal.js.map +1 -1
  140. package/dist/shared/overlay/presence.js.map +1 -1
  141. package/dist/shared/scroll-lock/scroll-lock.js +13 -12
  142. package/dist/shared/scroll-lock/scroll-lock.js.map +1 -1
  143. package/dist/shared/theme/overlay-root.js +3 -3
  144. package/dist/types/react.d.ts +15 -41
  145. package/dist/types/utils.d.ts +33 -4
  146. package/dist/types/vue.d.ts +17 -49
  147. package/package.json +11 -6
@@ -1,22 +1,24 @@
1
1
  import e from "../../_virtual/_@oxc-project_runtime@0.140.0/helpers/esm/decorate.js";
2
2
  import "../icon/index.js";
3
- import t from "../../assets/glass.js";
4
- import n from "../../icons/generated/jam-close-circle-f.js";
3
+ import t from "../../icons/generated/jam-close-circle-f.js";
4
+ import n from "../../assets/glass.js";
5
+ import "../button/index.js";
5
6
  import r from "./style.js";
6
- import { LitElement as i, html as a, unsafeCSS as o } from "lit";
7
- import { customElement as s, property as c, state as l } from "lit/decorators.js";
8
- import { classMap as u } from "lit/directives/class-map.js";
7
+ import { LitElement as i, html as a, nothing as o, unsafeCSS as s } from "lit";
8
+ import { customElement as c, property as l, state as u } from "lit/decorators.js";
9
9
  import { ifDefined as d } from "lit/directives/if-defined.js";
10
+ import { classMap as f } from "lit/directives/class-map.js";
11
+ import { styleMap as p } from "lit/directives/style-map.js";
10
12
  //#region src/components/textarea/index.ts
11
- var f = class extends i {
13
+ var m = class extends i {
12
14
  constructor(...e) {
13
- super(...e), this.placeholder = "", this.name = "", this.disabled = !1, this.readonly = !1, this.required = !1, this.full = !1, this.clearable = !1, this.borderless = !1, this.rows = 3, this.autosize = !1, this.ariaLabel = null, this._value = "", this._focused = !1, this._formDisabled = !1, this._hasPrefix = !1, this._hasSuffix = !1, this._textarea = null, this._resizeObserver = null;
15
+ super(...e), this.placeholder = "", this.name = "", this.disabled = !1, this.readonly = !1, this.required = !1, this.full = !1, this.clearable = !1, this.borderless = !1, this.rows = 3, this.autosize = !1, this.maxHeight = 0, this.ariaLabel = null, this._value = "", this._focused = !1, this._formDisabled = !1, this._hasPrefix = !1, this._hasSuffix = !1, this._textarea = null, this._resizeObserver = null;
14
16
  }
15
17
  static {
16
18
  this.formAssociated = !0;
17
19
  }
18
20
  static {
19
- this.styles = [o(t), o(r)];
21
+ this.styles = [s(n), s(r)];
20
22
  }
21
23
  get value() {
22
24
  return this._value;
@@ -81,7 +83,7 @@ var f = class extends i {
81
83
  _autosize() {
82
84
  if (!this._textarea || !this.autosize) return;
83
85
  this._textarea.style.height = "auto";
84
- let e = this.rows * 20, t = this._textarea.scrollHeight, n = Math.min(Math.max(t, e), 300);
86
+ let e = this.rows * 20, t = this._textarea.scrollHeight, n = Math.max(t, e);
85
87
  this._textarea.style.height = `${n}px`;
86
88
  }
87
89
  handleInput(e) {
@@ -94,7 +96,10 @@ var f = class extends i {
94
96
  this._focused = !1;
95
97
  }
96
98
  handleNativeChange(e) {
97
- e.target instanceof HTMLTextAreaElement && (this._value = e.target.value, this._internals?.setFormValue?.(this._value), this._syncValidity());
99
+ e.target instanceof HTMLTextAreaElement && (this._value = e.target.value, this._internals?.setFormValue?.(this._value), this._syncValidity(), this.dispatchEvent(new Event("change", {
100
+ bubbles: !0,
101
+ composed: !0
102
+ })));
98
103
  }
99
104
  focus() {
100
105
  this.shadowRoot?.querySelector("textarea")?.focus();
@@ -114,7 +119,7 @@ var f = class extends i {
114
119
  t.name === "prefix" && (this._hasPrefix = n), t.name === "suffix" && (this._hasSuffix = n);
115
120
  }
116
121
  handleClear() {
117
- this._isDisabled || (this._value = "", this._internals?.setFormValue?.(""), this.dispatchEvent(new Event("input", {
122
+ this._isDisabled || this.readonly || (this._value = "", this._internals?.setFormValue?.(""), this.dispatchEvent(new Event("input", {
118
123
  bubbles: !0,
119
124
  composed: !0
120
125
  })));
@@ -123,10 +128,10 @@ var f = class extends i {
123
128
  e.preventDefault();
124
129
  }
125
130
  render() {
126
- let e = this.clearable && this._value;
131
+ let e = this.clearable && this._value && !this.readonly;
127
132
  return a`
128
133
  <div class="wui-glass wui-textarea-inner" @click=${this.focusTextarea}>
129
- <slot name="prefix" class=${u({ empty: !this._hasPrefix })} @slotchange=${this._onSlotChange}></slot>
134
+ <slot name="prefix" class=${f({ empty: !this._hasPrefix })} @slotchange=${this._onSlotChange}></slot>
130
135
  <textarea
131
136
  placeholder=${this.placeholder}
132
137
  name=${this.name}
@@ -139,66 +144,78 @@ var f = class extends i {
139
144
  ?readonly=${this.readonly}
140
145
  ?required=${this.required}
141
146
  .value=${this._value}
147
+ style=${this.maxHeight > 0 ? p({ "max-height": `${this.maxHeight}px` }) : o}
142
148
  @input=${this.handleInput}
143
149
  @change=${this.handleNativeChange}
144
150
  @focus=${this.handleFocus}
145
151
  @blur=${this.handleBlur}
146
152
  ></textarea>
147
- ${e ? a`<span class="clear" @pointerdown=${this.preventMouseDownBlur} @click=${this.handleClear}>
148
- <web-ui-icon .icon=${n}></web-ui-icon>
149
- </span>` : ""}
150
- <slot name="suffix" class=${u({ empty: !this._hasSuffix })} @slotchange=${this._onSlotChange}></slot>
153
+ ${e ? a`<web-ui-button
154
+ icon
155
+ variant="ghost"
156
+ size="24"
157
+ aria-label="清除"
158
+ @pointerdown=${this.preventMouseDownBlur}
159
+ @click=${this.handleClear}
160
+ >
161
+ <web-ui-icon .icon=${t}></web-ui-icon>
162
+ </web-ui-button>` : ""}
163
+ <slot name="suffix" class=${f({ empty: !this._hasSuffix })} @slotchange=${this._onSlotChange}></slot>
151
164
  </div>
152
165
  `;
153
166
  }
154
167
  };
155
- e([c({
168
+ e([l({
156
169
  type: String,
157
170
  reflect: !0
158
- })], f.prototype, "placeholder", void 0), e([c({
171
+ })], m.prototype, "placeholder", void 0), e([l({
159
172
  type: String,
160
173
  reflect: !0
161
- })], f.prototype, "name", void 0), e([c({
174
+ })], m.prototype, "name", void 0), e([l({
162
175
  type: Boolean,
163
176
  reflect: !0
164
- })], f.prototype, "disabled", void 0), e([c({
177
+ })], m.prototype, "disabled", void 0), e([l({
165
178
  type: Boolean,
166
179
  reflect: !0
167
- })], f.prototype, "readonly", void 0), e([c({
180
+ })], m.prototype, "readonly", void 0), e([l({
168
181
  type: Boolean,
169
182
  reflect: !0
170
- })], f.prototype, "required", void 0), e([c({
183
+ })], m.prototype, "required", void 0), e([l({
171
184
  type: Boolean,
172
185
  reflect: !0
173
- })], f.prototype, "full", void 0), e([c({
186
+ })], m.prototype, "full", void 0), e([l({
174
187
  type: Boolean,
175
188
  reflect: !0
176
- })], f.prototype, "clearable", void 0), e([c({
189
+ })], m.prototype, "clearable", void 0), e([l({
177
190
  type: Boolean,
178
191
  reflect: !0
179
- })], f.prototype, "borderless", void 0), e([c({
192
+ })], m.prototype, "borderless", void 0), e([l({
180
193
  type: Number,
181
194
  reflect: !0
182
- })], f.prototype, "rows", void 0), e([c({
195
+ })], m.prototype, "rows", void 0), e([l({
183
196
  type: Number,
184
197
  reflect: !0
185
- })], f.prototype, "minlength", void 0), e([c({
198
+ })], m.prototype, "minlength", void 0), e([l({
186
199
  type: Number,
187
200
  reflect: !0
188
- })], f.prototype, "maxlength", void 0), e([c({
201
+ })], m.prototype, "maxlength", void 0), e([l({
189
202
  type: Boolean,
190
203
  reflect: !0
191
- })], f.prototype, "autosize", void 0), e([c({
204
+ })], m.prototype, "autosize", void 0), e([l({
205
+ type: Number,
206
+ reflect: !0,
207
+ attribute: "max-height"
208
+ })], m.prototype, "maxHeight", void 0), e([l({
192
209
  type: String,
193
210
  attribute: "aria-label"
194
- })], f.prototype, "ariaLabel", void 0), e([c({
211
+ })], m.prototype, "ariaLabel", void 0), e([l({
195
212
  type: String,
196
213
  attribute: "aria-labelledby"
197
- })], f.prototype, "ariaLabelledby", void 0), e([l()], f.prototype, "_value", void 0), e([l()], f.prototype, "_focused", void 0), e([l()], f.prototype, "_formDisabled", void 0), e([l()], f.prototype, "_hasPrefix", void 0), e([l()], f.prototype, "_hasSuffix", void 0), e([c({
214
+ })], m.prototype, "ariaLabelledby", void 0), e([u()], m.prototype, "_value", void 0), e([u()], m.prototype, "_focused", void 0), e([u()], m.prototype, "_formDisabled", void 0), e([u()], m.prototype, "_hasPrefix", void 0), e([u()], m.prototype, "_hasSuffix", void 0), e([l({
198
215
  type: String,
199
216
  reflect: !0
200
- })], f.prototype, "value", null), f = e([s("web-ui-textarea")], f);
217
+ })], m.prototype, "value", null), m = e([c("web-ui-textarea")], m);
201
218
  //#endregion
202
- export { f as WebUiTextarea };
219
+ export { m as WebUiTextarea };
203
220
 
204
221
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/textarea/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\n// web-ui-icon 必须注册(Rolldown tree-shake 副作用 import,引用类名阻止删除)\nimport '@/components/icon'\nimport glass from '@/assets/glass.css?inline'\nimport { jamCloseCircleF } from '@/icons'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-textarea')\nexport class WebUiTextarea extends LitElement {\n static formAssociated = true\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n @property({ type: String, reflect: true }) placeholder = ''\n @property({ type: String, reflect: true }) name = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) readonly = false\n @property({ type: Boolean, reflect: true }) required = false\n @property({ type: Boolean, reflect: true }) full = false\n @property({ type: Boolean, reflect: true }) clearable = false\n @property({ type: Boolean, reflect: true }) borderless = false\n @property({ type: Number, reflect: true }) rows = 3\n @property({ type: Number, reflect: true }) minlength: number | undefined\n @property({ type: Number, reflect: true }) maxlength: number | undefined\n @property({ type: Boolean, reflect: true }) autosize = false\n @property({ type: String, attribute: 'aria-label' }) override ariaLabel: string | null = null\n @property({ type: String, attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined\n\n @state() private _value = ''\n @state() private _focused = false\n @state() private _formDisabled = false\n @state() private _hasPrefix = false\n @state() private _hasSuffix = false\n\n private _textarea: HTMLTextAreaElement | null = null\n private _resizeObserver: ResizeObserver | null = null\n private _internals?: ElementInternals\n\n @property({ type: String, reflect: true })\n get value(): string {\n return this._value\n }\n\n set value(v: string) {\n const old = this._value\n this._value = v\n this._internals?.setFormValue?.(v)\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n override connectedCallback() {\n super.connectedCallback()\n if (!this._internals) {\n this._internals = this.attachInternals()\n }\n this._internals.setFormValue?.(this._value)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._teardownAutosize()\n }\n\n override firstUpdated() {\n this._textarea = this.shadowRoot?.querySelector('textarea') ?? null\n }\n\n override updated(changed: Map<string, unknown>) {\n if (changed.has('_value')) {\n const textarea = this._getTextarea()\n if (textarea && textarea.value !== this._value) {\n textarea.value = this._value\n }\n }\n if (changed.has('autosize')) {\n if (this.autosize) {\n this._setupAutosize()\n } else {\n this._teardownAutosize(true)\n }\n }\n this._syncValidity()\n this.toggleAttribute('focused', this._focused)\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n formResetCallback() {\n this.value = this.getAttribute('value') || ''\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n if (typeof state === 'string') this.value = state\n }\n\n private _getTextarea(): HTMLTextAreaElement | null {\n this._textarea ??= this.shadowRoot?.querySelector('textarea') ?? null\n return this._textarea\n }\n\n private _syncValidity() {\n const internals = this._internals\n const textarea = this._getTextarea()\n if (!internals || !textarea || typeof internals.setValidity !== 'function') return\n\n if (this._isDisabled || textarea.validity.valid) {\n internals.setValidity({})\n return\n }\n\n const validity: ValidityStateFlags = {}\n if (textarea.validity.valueMissing) validity.valueMissing = true\n if (textarea.validity.tooShort) validity.tooShort = true\n if (textarea.validity.tooLong) validity.tooLong = true\n internals.setValidity(validity, textarea.validationMessage, textarea)\n }\n\n private _setupAutosize() {\n this._teardownAutosize()\n if (typeof ResizeObserver === 'undefined') {\n this._autosize()\n return\n }\n this._resizeObserver = new ResizeObserver(() => {\n this._autosize()\n })\n if (this._textarea) this._resizeObserver.observe(this._textarea)\n this._autosize()\n }\n\n private _teardownAutosize(resetHeight = false) {\n this._resizeObserver?.disconnect()\n this._resizeObserver = null\n if (resetHeight) this._textarea?.style.removeProperty('height')\n }\n\n private _autosize() {\n if (!this._textarea || !this.autosize) return\n this._textarea.style.height = 'auto'\n const computedMin = this.rows * 20\n const computedMax = 300\n const scrollH = this._textarea.scrollHeight\n const clamped = Math.min(Math.max(scrollH, computedMin), computedMax)\n this._textarea.style.height = `${clamped}px`\n }\n\n private handleInput(e: Event) {\n if (!(e.target instanceof HTMLTextAreaElement)) return\n this._value = e.target.value\n this._internals?.setFormValue?.(this._value)\n this._syncValidity()\n this._autosize()\n }\n\n private handleFocus() {\n if (!this._isDisabled) this._focused = true\n }\n\n private handleBlur() {\n this._focused = false\n }\n\n private handleNativeChange(e: Event) {\n if (!(e.target instanceof HTMLTextAreaElement)) return\n this._value = e.target.value\n this._internals?.setFormValue?.(this._value)\n this._syncValidity()\n }\n\n override focus() {\n this.shadowRoot?.querySelector('textarea')?.focus()\n }\n\n override blur() {\n this.shadowRoot?.querySelector('textarea')?.blur()\n }\n\n select() {\n this.shadowRoot?.querySelector('textarea')?.select()\n }\n\n private focusTextarea() {\n if (this._isDisabled) return\n this.shadowRoot?.querySelector('textarea')?.focus()\n }\n\n private _onSlotChange(e: Event) {\n if (!(e.target instanceof HTMLSlotElement)) return\n const slot = e.target\n const hasContent = slot.assignedElements().length > 0\n if (slot.name === 'prefix') this._hasPrefix = hasContent\n if (slot.name === 'suffix') this._hasSuffix = hasContent\n }\n\n private handleClear() {\n if (this._isDisabled) return\n this._value = ''\n this._internals?.setFormValue?.('')\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n }\n\n private preventMouseDownBlur(e: Event) {\n e.preventDefault()\n }\n\n override render() {\n const showClear = this.clearable && this._value\n\n return html`\n <div class=\"wui-glass wui-textarea-inner\" @click=${this.focusTextarea}>\n <slot name=\"prefix\" class=${classMap({ empty: !this._hasPrefix })} @slotchange=${this._onSlotChange}></slot>\n <textarea\n placeholder=${this.placeholder}\n name=${this.name}\n aria-label=${ifDefined(this.ariaLabel)}\n aria-labelledby=${ifDefined(this.ariaLabelledby)}\n .rows=${this.rows}\n minlength=${ifDefined(this.minlength)}\n maxlength=${ifDefined(this.maxlength)}\n ?disabled=${this._isDisabled}\n ?readonly=${this.readonly}\n ?required=${this.required}\n .value=${this._value}\n @input=${this.handleInput}\n @change=${this.handleNativeChange}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n ></textarea>\n ${showClear\n ? html`<span class=\"clear\" @pointerdown=${this.preventMouseDownBlur} @click=${this.handleClear}>\n <web-ui-icon .icon=${jamCloseCircleF}></web-ui-icon>\n </span>`\n : ''}\n <slot name=\"suffix\" class=${classMap({ empty: !this._hasSuffix })} @slotchange=${this._onSlotChange}></slot>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n focus: FocusEvent\n blur: FocusEvent\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-textarea': WebUiTextarea\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/textarea/index.ts"],"sourcesContent":["import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property, state } 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 '@/components/button'\nimport glass from '@/assets/glass.css?inline'\nimport { jamCloseCircleF } from '@/icons'\n\nimport style from './style.css?inline'\n\n@customElement('web-ui-textarea')\nexport class WebUiTextarea extends LitElement {\n static formAssociated = true\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n @property({ type: String, reflect: true }) placeholder = ''\n @property({ type: String, reflect: true }) name = ''\n @property({ type: Boolean, reflect: true }) disabled = false\n @property({ type: Boolean, reflect: true }) readonly = false\n @property({ type: Boolean, reflect: true }) required = false\n @property({ type: Boolean, reflect: true }) full = false\n @property({ type: Boolean, reflect: true }) clearable = false\n @property({ type: Boolean, reflect: true }) borderless = false\n @property({ type: Number, reflect: true }) rows = 3\n @property({ type: Number, reflect: true }) minlength: number | undefined\n @property({ type: Number, reflect: true }) maxlength: number | undefined\n @property({ type: Boolean, reflect: true }) autosize = false\n // 自动高度上限(px);0 表示不限制,随内容无限增高\n @property({ type: Number, reflect: true, attribute: 'max-height' }) maxHeight = 0\n @property({ type: String, attribute: 'aria-label' }) override ariaLabel: string | null = null\n @property({ type: String, attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined\n\n @state() private _value = ''\n @state() private _focused = false\n @state() private _formDisabled = false\n @state() private _hasPrefix = false\n @state() private _hasSuffix = false\n\n private _textarea: HTMLTextAreaElement | null = null\n private _resizeObserver: ResizeObserver | null = null\n private _internals?: ElementInternals\n\n @property({ type: String, reflect: true })\n get value(): string {\n return this._value\n }\n\n set value(v: string) {\n const old = this._value\n this._value = v\n this._internals?.setFormValue?.(v)\n this.requestUpdate('value', old)\n }\n\n private get _isDisabled(): boolean {\n return this.disabled || this._formDisabled\n }\n\n override connectedCallback() {\n super.connectedCallback()\n if (!this._internals) {\n this._internals = this.attachInternals()\n }\n this._internals.setFormValue?.(this._value)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this._teardownAutosize()\n }\n\n override firstUpdated() {\n this._textarea = this.shadowRoot?.querySelector('textarea') ?? null\n }\n\n override updated(changed: Map<string, unknown>) {\n if (changed.has('_value')) {\n const textarea = this._getTextarea()\n if (textarea && textarea.value !== this._value) {\n textarea.value = this._value\n }\n }\n if (changed.has('autosize')) {\n if (this.autosize) {\n this._setupAutosize()\n } else {\n this._teardownAutosize(true)\n }\n }\n this._syncValidity()\n this.toggleAttribute('focused', this._focused)\n }\n\n formDisabledCallback(disabled: boolean) {\n this._formDisabled = disabled\n }\n\n formResetCallback() {\n this.value = this.getAttribute('value') || ''\n }\n\n formStateRestoreCallback(state: string | File | FormData | null) {\n if (typeof state === 'string') this.value = state\n }\n\n private _getTextarea(): HTMLTextAreaElement | null {\n this._textarea ??= this.shadowRoot?.querySelector('textarea') ?? null\n return this._textarea\n }\n\n private _syncValidity() {\n const internals = this._internals\n const textarea = this._getTextarea()\n if (!internals || !textarea || typeof internals.setValidity !== 'function') return\n\n if (this._isDisabled || textarea.validity.valid) {\n internals.setValidity({})\n return\n }\n\n const validity: ValidityStateFlags = {}\n if (textarea.validity.valueMissing) validity.valueMissing = true\n if (textarea.validity.tooShort) validity.tooShort = true\n if (textarea.validity.tooLong) validity.tooLong = true\n internals.setValidity(validity, textarea.validationMessage, textarea)\n }\n\n private _setupAutosize() {\n this._teardownAutosize()\n if (typeof ResizeObserver === 'undefined') {\n this._autosize()\n return\n }\n this._resizeObserver = new ResizeObserver(() => {\n this._autosize()\n })\n if (this._textarea) this._resizeObserver.observe(this._textarea)\n this._autosize()\n }\n\n private _teardownAutosize(resetHeight = false) {\n this._resizeObserver?.disconnect()\n this._resizeObserver = null\n if (resetHeight) this._textarea?.style.removeProperty('height')\n }\n\n private _autosize() {\n if (!this._textarea || !this.autosize) return\n this._textarea.style.height = 'auto'\n const computedMin = this.rows * 20\n const scrollH = this._textarea.scrollHeight\n // 上限由 CSS max-height(maxHeight 属性)钳制,这里只负责随内容增高,默认无限\n const height = Math.max(scrollH, computedMin)\n this._textarea.style.height = `${height}px`\n }\n\n private handleInput(e: Event) {\n if (!(e.target instanceof HTMLTextAreaElement)) return\n this._value = e.target.value\n this._internals?.setFormValue?.(this._value)\n this._syncValidity()\n this._autosize()\n }\n\n private handleFocus() {\n if (!this._isDisabled) this._focused = true\n }\n\n private handleBlur() {\n this._focused = false\n }\n\n // 原生 change 不 composed,被 shadow root 挡住;这里补发 composed 事件,\n // 兑现 $events/README 声明的公共 change 契约。\n private handleNativeChange(e: Event) {\n if (!(e.target instanceof HTMLTextAreaElement)) return\n this._value = e.target.value\n this._internals?.setFormValue?.(this._value)\n this._syncValidity()\n this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n }\n\n override focus() {\n this.shadowRoot?.querySelector('textarea')?.focus()\n }\n\n override blur() {\n this.shadowRoot?.querySelector('textarea')?.blur()\n }\n\n select() {\n this.shadowRoot?.querySelector('textarea')?.select()\n }\n\n private focusTextarea() {\n if (this._isDisabled) return\n this.shadowRoot?.querySelector('textarea')?.focus()\n }\n\n private _onSlotChange(e: Event) {\n if (!(e.target instanceof HTMLSlotElement)) return\n const slot = e.target\n const hasContent = slot.assignedElements().length > 0\n if (slot.name === 'prefix') this._hasPrefix = hasContent\n if (slot.name === 'suffix') this._hasSuffix = hasContent\n }\n\n private handleClear() {\n if (this._isDisabled || this.readonly) return\n this._value = ''\n this._internals?.setFormValue?.('')\n this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n }\n\n private preventMouseDownBlur(e: Event) {\n e.preventDefault()\n }\n\n override render() {\n // readonly 下不可清除:清空按钮会修改值,与只读语义冲突\n const showClear = this.clearable && this._value && !this.readonly\n\n return html`\n <div class=\"wui-glass wui-textarea-inner\" @click=${this.focusTextarea}>\n <slot name=\"prefix\" class=${classMap({ empty: !this._hasPrefix })} @slotchange=${this._onSlotChange}></slot>\n <textarea\n placeholder=${this.placeholder}\n name=${this.name}\n aria-label=${ifDefined(this.ariaLabel)}\n aria-labelledby=${ifDefined(this.ariaLabelledby)}\n .rows=${this.rows}\n minlength=${ifDefined(this.minlength)}\n maxlength=${ifDefined(this.maxlength)}\n ?disabled=${this._isDisabled}\n ?readonly=${this.readonly}\n ?required=${this.required}\n .value=${this._value}\n style=${this.maxHeight > 0 ? styleMap({ 'max-height': `${this.maxHeight}px` }) : nothing}\n @input=${this.handleInput}\n @change=${this.handleNativeChange}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n ></textarea>\n ${showClear\n ? html`<web-ui-button\n icon\n variant=\"ghost\"\n size=\"24\"\n aria-label=\"清除\"\n @pointerdown=${this.preventMouseDownBlur}\n @click=${this.handleClear}\n >\n <web-ui-icon .icon=${jamCloseCircleF}></web-ui-icon>\n </web-ui-button>`\n : ''}\n <slot name=\"suffix\" class=${classMap({ empty: !this._hasSuffix })} @slotchange=${this._onSlotChange}></slot>\n </div>\n `\n }\n\n declare readonly $events: {\n input: Event\n change: Event\n focus: FocusEvent\n blur: FocusEvent\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-textarea': WebUiTextarea\n }\n}\n"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  //#region src/components/textarea/style.css?inline
2
- var e = "*,:before,:after{box-sizing:border-box}:host{display:block}:host([disabled]){cursor:not-allowed;opacity:.4}.wui-textarea-inner{box-sizing:border-box;width:var(--wui-textarea-width,200px);min-width:var(--wui-button-size,40px);transition:border-color var(--wui-duration-focus,.2s), box-shadow var(--wui-duration-focus,.2s);border-radius:20px;align-items:flex-start;gap:8px;padding:9px 18px;display:flex;position:relative}:host([full]) .wui-textarea-inner{width:100%}:host([borderless]) .wui-textarea-inner{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;background:0 0;border:none;padding:9px 0}:host([focused]) .wui-textarea-inner{--wui-glass-shadow:var(--wui-shadow-glass,0 2px 16px #0000000f), 0 0 0 3px var(--wui-focus-ring,#08f6);border-color:var(--wui-color-border-strong,#006ee680)}:host([borderless][focused]) .wui-textarea-inner{box-shadow:none;border-color:#0000}textarea{resize:vertical;box-sizing:border-box;width:100%;min-height:60px;font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);background:0 0;border:none;outline:none;flex:1;padding:0;line-height:1.5;display:block}textarea::placeholder{color:var(--wui-color-text-muted,#6a6a6a)}textarea:disabled{cursor:not-allowed}textarea:read-only{cursor:default}slot{font-size:var(--wui-font-size,14px);color:var(--wui-color-text-muted,#6a6a6a);flex-shrink:0;align-items:center;display:flex}slot.empty{display:none}.clear{cursor:pointer;color:var(--wui-color-text-muted,#6a6a6a);flex-shrink:0;justify-content:center;align-self:flex-start;align-items:center;margin-top:2px;display:flex}.clear:hover{color:var(--wui-color-text-muted,#6a6a6a)}";
2
+ var e = "*,:before,:after{box-sizing:border-box}:host{display:block}:host([disabled]){cursor:not-allowed;opacity:.4}.wui-textarea-inner{box-sizing:border-box;width:var(--wui-textarea-width,200px);min-width:var(--wui-button-size,40px);transition:border-color var(--wui-duration-focus,.2s), box-shadow var(--wui-duration-focus,.2s);border-radius:20px;align-items:flex-start;gap:8px;padding:9px 12px;display:flex;position:relative}:host([full]) .wui-textarea-inner{width:100%}:host([borderless]) .wui-textarea-inner{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;background:0 0;border:none;padding:9px 0}:host([focused]) .wui-textarea-inner{--wui-glass-shadow:var(--wui-shadow-glass,0 2px 16px #0000000f), 0 0 0 3px var(--wui-focus-ring,#08f6);border-color:var(--wui-color-border-strong,#006ee680)}:host([borderless][focused]) .wui-textarea-inner{box-shadow:none;border-color:#0000}textarea{resize:vertical;box-sizing:border-box;width:100%;font:inherit;font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);background:0 0;border:none;outline:none;flex:1;margin:0;padding:0;line-height:1.5;display:block}textarea::placeholder{color:var(--wui-color-text-muted,#6a6a6a)}textarea:disabled{cursor:not-allowed}textarea:read-only{cursor:default}slot{font-size:var(--wui-font-size,14px);color:var(--wui-color-text-muted,#6a6a6a);flex-shrink:0;align-items:center;display:flex}slot.empty{display:none}.wui-textarea-inner web-ui-button[variant=ghost]{--wui-button-color:var(--wui-color-text-muted,#6a6a6a);margin-top:calc((var(--wui-font-size,14px) * 1.5 - 24px) / 2);margin-left:-8px}";
3
3
  //#endregion
4
4
  export { e as default };
5
5
 
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/textarea/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n display: block;\n}\n\n:host([disabled]) {\n cursor: not-allowed;\n opacity: 0.4;\n}\n\n/* ===== Textarea ===== */\n\n.wui-textarea-inner {\n position: relative;\n\n display: flex;\n gap: 8px;\n align-items: flex-start;\n\n box-sizing: border-box;\n width: var(--wui-textarea-width, 200px);\n min-width: var(--wui-button-size, 40px);\n padding: 9px 18px;\n border-radius: 20px;\n\n transition:\n border-color var(--wui-duration-focus, 200ms),\n box-shadow var(--wui-duration-focus, 200ms);\n}\n\n:host([full]) .wui-textarea-inner {\n width: 100%;\n}\n\n/* ===== Borderless ===== */\n\n:host([borderless]) .wui-textarea-inner {\n padding: 9px 0;\n border: none;\n\n background: transparent;\n backdrop-filter: none;\n box-shadow: none;\n}\n\n:host([focused]) .wui-textarea-inner {\n --wui-glass-shadow:\n var(--wui-shadow-glass, 0 2px 16px rgb(0 0 0 / 0.06)), 0 0 0 3px var(--wui-focus-ring, rgb(0 136 255 / 0.4));\n border-color: var(--wui-color-border-strong, rgb(0 110 230 / 0.5));\n}\n\n:host([borderless][focused]) .wui-textarea-inner {\n border-color: transparent;\n box-shadow: none;\n}\n\ntextarea {\n resize: vertical;\n\n display: block;\n flex: 1;\n\n box-sizing: border-box;\n width: 100%;\n min-height: 60px;\n padding: 0;\n border: none;\n\n font-size: var(--wui-font-size, 14px);\n line-height: 1.5;\n color: var(--wui-color-text, #1b1b1b);\n\n background: transparent;\n outline: none;\n\n &::placeholder {\n color: var(--wui-color-text-muted, #6a6a6a);\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n\n &:read-only {\n cursor: default;\n }\n}\n\n/* ===== Prefix / Suffix ===== */\n\nslot {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n\n font-size: var(--wui-font-size, 14px);\n color: var(--wui-color-text-muted, #6a6a6a);\n}\n\nslot.empty {\n display: none;\n}\n\n/* ===== Clear button ===== */\n\n.clear {\n cursor: pointer;\n\n display: flex;\n flex-shrink: 0;\n align-items: center;\n align-self: flex-start;\n justify-content: center;\n\n margin-top: 2px;\n\n color: var(--wui-color-text-muted, #6a6a6a);\n\n &:hover {\n color: var(--wui-color-text-muted, #6a6a6a);\n }\n}\n"],"mappings":""}
1
+ {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/textarea/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n display: block;\n}\n\n:host([disabled]) {\n cursor: not-allowed;\n opacity: 0.4;\n}\n\n/* ===== Textarea ===== */\n\n.wui-textarea-inner {\n position: relative;\n\n display: flex;\n gap: 8px;\n align-items: flex-start;\n\n box-sizing: border-box;\n width: var(--wui-textarea-width, 200px);\n min-width: var(--wui-button-size, 40px);\n padding: 9px 12px;\n border-radius: 20px;\n\n transition:\n border-color var(--wui-duration-focus, 200ms),\n box-shadow var(--wui-duration-focus, 200ms);\n}\n\n:host([full]) .wui-textarea-inner {\n width: 100%;\n}\n\n/* ===== Borderless ===== */\n\n:host([borderless]) .wui-textarea-inner {\n padding: 9px 0;\n border: none;\n\n background: transparent;\n backdrop-filter: none;\n box-shadow: none;\n}\n\n:host([focused]) .wui-textarea-inner {\n --wui-glass-shadow:\n var(--wui-shadow-glass, 0 2px 16px rgb(0 0 0 / 0.06)), 0 0 0 3px var(--wui-focus-ring, rgb(0 136 255 / 0.4));\n border-color: var(--wui-color-border-strong, rgb(0 110 230 / 0.5));\n}\n\n:host([borderless][focused]) .wui-textarea-inner {\n border-color: transparent;\n box-shadow: none;\n}\n\ntextarea {\n resize: vertical;\n\n display: block;\n flex: 1;\n\n box-sizing: border-box;\n width: 100%;\n margin: 0;\n padding: 0;\n border: none;\n\n /* 表单控件不继承字体;显式继承以对齐宿主排版,避免 UA 默认字体差异 */\n font: inherit;\n font-size: var(--wui-font-size, 14px);\n line-height: 1.5;\n color: var(--wui-color-text, #1b1b1b);\n\n background: transparent;\n outline: none;\n\n &::placeholder {\n color: var(--wui-color-text-muted, #6a6a6a);\n }\n\n &:disabled {\n cursor: not-allowed;\n }\n\n &:read-only {\n cursor: default;\n }\n}\n\n/* ===== Prefix / Suffix ===== */\n\nslot {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n\n font-size: var(--wui-font-size, 14px);\n color: var(--wui-color-text-muted, #6a6a6a);\n}\n\nslot.empty {\n display: none;\n}\n\n/* ===== Clear button ===== */\n\n/* 复用 web-ui-button icon ghost:仅覆盖颜色为 muted 并对齐首行,保持原清除图标观感;\n 负 margin-left 抵消容器 8px flex gap,让清除按钮紧贴文本域内容 */\n.wui-textarea-inner web-ui-button[variant='ghost'] {\n --wui-button-color: var(--wui-color-text-muted, #6a6a6a);\n\n /* 与首行文字垂直居中对齐:容器 align-items: flex-start 使按钮贴内容区顶部(9px 留白处),\n 而首行中心在 9px + 行高半程;要让 24px 按钮(18px 图标居中)的图标中心落在首行中心,\n 需上移 (行高 − 按钮高度) / 2,行高 = font-size × 1.5(与 textarea 的 line-height 一致) */\n margin-top: calc((var(--wui-font-size, 14px) * 1.5 - 24px) / 2);\n margin-left: -8px;\n}\n"],"mappings":""}
@@ -12,15 +12,12 @@ export declare class WebUiTheme extends LitElement {
12
12
  private _warned;
13
13
  connectedCallback(): void;
14
14
  protected updated(): void;
15
- /** 返回此主题范围内的浮层挂载点;未设置 appearance 时不创建。 */
16
15
  getOverlayRoot(): HTMLElement | undefined;
17
- /** 当前范围是否应减少动效;`system` 跟随用户的系统偏好。 */
18
16
  isReducedMotion(): boolean;
19
17
  render(): import('lit').TemplateResult<1>;
20
18
  firstUpdated(): void;
21
19
  private _hasAppearance;
22
20
  private _warnWhenAppearanceIsMissing;
23
- readonly $events: Record<string, never>;
24
21
  }
25
22
  declare global {
26
23
  interface HTMLElementTagNameMap {
@@ -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/theme/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 declare readonly $events: Record<string, never>\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;AAGF;AAxEG,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/theme/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 +1 @@
1
- {"version":3,"file":"manager.js","names":[],"sources":["../../../src/components/toast/manager.ts"],"sourcesContent":["import { getFallbackOverlayRoot } from '@/shared/theme/overlay-root'\nimport { findNearestTheme, findRootTheme } from '@/shared/theme/theme-scope'\n\nimport type { WebUiToast } from './toast'\nimport type {\n ToastCloseReason,\n ToastInstanceOptions,\n ToastMessageUpdateOptions,\n ToastOptions,\n ToastPosition\n} from './types'\n\nlet toastIdCounter = 0\n\nconst toastContainers = new Set<HTMLElement>()\nconst visibleToasts = new Map<string, WebUiToast>()\n\nlet pendingBatch: Array<{ id: string; options: ToastInstanceOptions; container: HTMLElement }> | undefined\nlet isBatchScheduled = false\n\ntype ToastShortcutOptions = Omit<ToastOptions, 'message' | 'type'> & Pick<ToastInstanceOptions, 'position'>\n\nfunction generateId(): string {\n return `toast-${++toastIdCounter}`\n}\n\nfunction ensureContainer(position: ToastPosition, root: HTMLElement): HTMLElement {\n const existing = Array.from(root.children).find(\n (child): child is HTMLElement => child instanceof HTMLElement && child.dataset.wuiToastPosition === position\n )\n if (existing) return existing\n\n const container = document.createElement('div')\n container.className = `wui-toast-container wui-toast-${position}`\n container.dataset.wuiToastPosition = position\n container.setAttribute('role', 'log')\n container.setAttribute('aria-live', 'polite')\n container.setAttribute('aria-relevant', 'additions')\n root.appendChild(container)\n toastContainers.add(container)\n\n container.addEventListener('pointerenter', () => (container.dataset.hovered = 'true'))\n container.addEventListener('pointerleave', () => {\n delete container.dataset.hovered\n scrollToBottom(container)\n })\n return container\n}\n\nfunction scrollToBottom(container: HTMLElement) {\n if (container.dataset.hovered === 'true') return\n requestAnimationFrame(() => {\n container.scrollTop = container.scrollHeight\n })\n}\n\nfunction scheduleBatchFlush() {\n if (isBatchScheduled) return\n isBatchScheduled = true\n void Promise.resolve().then(flushBatch)\n}\n\nfunction flushBatch() {\n isBatchScheduled = false\n const batch = pendingBatch\n pendingBatch = undefined\n if (!batch) return\n\n const containersToScroll = new Set<HTMLElement>()\n for (const item of batch) {\n mountToast(item.id, item.options, item.container)\n containersToScroll.add(item.container)\n }\n for (const container of containersToScroll) scrollToBottom(container)\n}\n\nfunction createToast(options: ToastInstanceOptions): string {\n const id = options.id || generateId()\n if (visibleToasts.has(id)) return id\n\n const position = options.position || 'top-right'\n const targetTheme = options.target ? findNearestTheme(options.target) : findRootTheme()\n const root = options.container ?? targetTheme?.getOverlayRoot() ?? getFallbackOverlayRoot()\n const container = ensureContainer(position, root)\n\n if (!pendingBatch) pendingBatch = []\n pendingBatch.push({ id, options, container })\n scheduleBatchFlush()\n return id\n}\n\nfunction mountToast(id: string, options: ToastInstanceOptions, container: HTMLElement) {\n const el = document.createElement('web-ui-toast')\n el.toastId = id\n el.type = options.type || 'info'\n el.position = options.position || 'top-right'\n el.heading = options.heading || ''\n el.message = options.message\n el.duration = options.duration ?? 3000\n el.noCloseButton = options.closable === false\n\n el.addEventListener('toast-close', (e: Event) => {\n const detail = (e as CustomEvent<{ id: string; reason: ToastCloseReason }>).detail\n removeToast(detail.id)\n })\n\n container.appendChild(el)\n visibleToasts.set(id, el)\n requestAnimationFrame(() => el.show())\n}\n\nfunction removeToast(id: string) {\n const el = visibleToasts.get(id)\n if (!el) return\n el.remove()\n visibleToasts.delete(id)\n}\n\nfunction close(id: string) {\n visibleToasts.get(id)?.dismiss('programmatic')\n}\n\nfunction clear() {\n for (const el of visibleToasts.values()) el.dismiss('clear')\n}\n\n/**\n * 更新指定 Toast 的消息与可选标题,不影响其自动关闭倒计时。\n * 尚未完成批量挂载的 Toast 也会更新其初始内容。\n */\nfunction updateMessage(id: string, options: ToastMessageUpdateOptions) {\n const visibleToast = visibleToasts.get(id)\n if (visibleToast) {\n visibleToast.message = options.message\n if (options.heading !== undefined) visibleToast.heading = options.heading\n return\n }\n\n const pendingToast = pendingBatch?.find(item => item.id === id)\n if (!pendingToast) return\n pendingToast.options.message = options.message\n if (options.heading !== undefined) pendingToast.options.heading = options.heading\n}\n\nfunction toast(options: ToastInstanceOptions): string {\n return createToast(options)\n}\n\ntoast.success = (message: string, options?: ToastShortcutOptions) =>\n createToast({ ...options, message, type: 'success' })\ntoast.info = (message: string, options?: ToastShortcutOptions) => createToast({ ...options, message, type: 'info' })\ntoast.warning = (message: string, options?: ToastShortcutOptions) =>\n createToast({ ...options, message, type: 'warning' })\ntoast.error = (message: string, options?: ToastShortcutOptions) =>\n createToast({ ...options, message, type: 'error', duration: options?.duration ?? 5000 })\ntoast.close = close\ntoast.clear = clear\ntoast.updateMessage = updateMessage\n\n/** 获取当前可见 toast 数量(测试用) */\ntoast._visibleCount = () => visibleToasts.size\n\n/** 重置全部状态(测试用) */\ntoast._reset = () => {\n pendingBatch = undefined\n isBatchScheduled = false\n for (const el of visibleToasts.values()) el.remove()\n visibleToasts.clear()\n for (const container of toastContainers) container.remove()\n toastContainers.clear()\n}\n\nexport { toast }\n"],"mappings":"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"}
1
+ {"version":3,"file":"manager.js","names":[],"sources":["../../../src/components/toast/manager.ts"],"sourcesContent":["import { getFallbackOverlayRoot } from '@/shared/theme/overlay-root'\nimport { findNearestTheme, findRootTheme } from '@/shared/theme/theme-scope'\n\nimport type { WebUiToast } from './toast'\nimport type {\n ToastCloseReason,\n ToastInstanceOptions,\n ToastMessageUpdateOptions,\n ToastOptions,\n ToastPosition\n} from './types'\n\nlet toastIdCounter = 0\n\nconst toastContainers = new Set<HTMLElement>()\nconst visibleToasts = new Map<string, WebUiToast>()\n\nlet pendingBatch: Array<{ id: string; options: ToastInstanceOptions; container: HTMLElement }> | undefined\nlet isBatchScheduled = false\n\ntype ToastShortcutOptions = Omit<ToastOptions, 'message' | 'type'> & Pick<ToastInstanceOptions, 'position'>\n\nfunction generateId(): string {\n return `toast-${++toastIdCounter}`\n}\n\nfunction ensureContainer(position: ToastPosition, root: HTMLElement): HTMLElement {\n const existing = Array.from(root.children).find(\n (child): child is HTMLElement => child instanceof HTMLElement && child.dataset.wuiToastPosition === position\n )\n if (existing) return existing\n\n const container = document.createElement('div')\n container.className = `wui-toast-container wui-toast-${position}`\n container.dataset.wuiToastPosition = position\n container.setAttribute('role', 'log')\n container.setAttribute('aria-live', 'polite')\n container.setAttribute('aria-relevant', 'additions')\n root.appendChild(container)\n toastContainers.add(container)\n\n container.addEventListener('pointerenter', () => (container.dataset.hovered = 'true'))\n container.addEventListener('pointerleave', () => {\n delete container.dataset.hovered\n scrollToBottom(container)\n })\n return container\n}\n\nfunction scrollToBottom(container: HTMLElement) {\n if (container.dataset.hovered === 'true') return\n requestAnimationFrame(() => {\n container.scrollTop = container.scrollHeight\n })\n}\n\nfunction scheduleBatchFlush() {\n if (isBatchScheduled) return\n isBatchScheduled = true\n void Promise.resolve().then(flushBatch)\n}\n\nfunction flushBatch() {\n isBatchScheduled = false\n const batch = pendingBatch\n pendingBatch = undefined\n if (!batch) return\n\n const containersToScroll = new Set<HTMLElement>()\n for (const item of batch) {\n mountToast(item.id, item.options, item.container)\n containersToScroll.add(item.container)\n }\n for (const container of containersToScroll) scrollToBottom(container)\n}\n\nfunction createToast(options: ToastInstanceOptions): string {\n const id = options.id || generateId()\n if (visibleToasts.has(id)) return id\n\n const position = options.position || 'top-right'\n const targetTheme = options.target ? findNearestTheme(options.target) : findRootTheme()\n const root = options.container ?? targetTheme?.getOverlayRoot() ?? getFallbackOverlayRoot()\n const container = ensureContainer(position, root)\n\n if (!pendingBatch) pendingBatch = []\n pendingBatch.push({ id, options, container })\n scheduleBatchFlush()\n return id\n}\n\nfunction mountToast(id: string, options: ToastInstanceOptions, container: HTMLElement) {\n const el = document.createElement('web-ui-toast')\n el.toastId = id\n el.type = options.type || 'info'\n el.position = options.position || 'top-right'\n el.heading = options.heading || ''\n el.message = options.message\n el.duration = options.duration ?? 3000\n el.noCloseButton = options.closable === false\n\n el.addEventListener('toast-close', (e: Event) => {\n const detail = (e as CustomEvent<{ id: string; reason: ToastCloseReason }>).detail\n removeToast(detail.id)\n })\n\n container.appendChild(el)\n visibleToasts.set(id, el)\n requestAnimationFrame(() => el.show())\n}\n\nfunction removeToast(id: string) {\n const el = visibleToasts.get(id)\n if (!el) return\n el.remove()\n visibleToasts.delete(id)\n}\n\nfunction close(id: string) {\n visibleToasts.get(id)?.dismiss('programmatic')\n}\n\nfunction clear() {\n for (const el of visibleToasts.values()) el.dismiss('clear')\n}\n\n/**\n * 更新指定 Toast 的消息与可选标题,不影响其自动关闭倒计时。\n * 尚未完成批量挂载的 Toast 也会更新其初始内容。\n */\nfunction updateMessage(id: string, options: ToastMessageUpdateOptions) {\n const visibleToast = visibleToasts.get(id)\n if (visibleToast) {\n visibleToast.message = options.message\n if (options.heading !== undefined) visibleToast.heading = options.heading\n return\n }\n\n const pendingToast = pendingBatch?.find(item => item.id === id)\n if (!pendingToast) return\n pendingToast.options.message = options.message\n if (options.heading !== undefined) pendingToast.options.heading = options.heading\n}\n\nfunction toast(options: ToastInstanceOptions): string {\n return createToast(options)\n}\n\ntoast.success = (message: string, options?: ToastShortcutOptions) =>\n createToast({ ...options, message, type: 'success' })\ntoast.info = (message: string, options?: ToastShortcutOptions) => createToast({ ...options, message, type: 'info' })\ntoast.warning = (message: string, options?: ToastShortcutOptions) =>\n createToast({ ...options, message, type: 'warning' })\ntoast.error = (message: string, options?: ToastShortcutOptions) =>\n createToast({ ...options, message, type: 'error', duration: options?.duration ?? 5000 })\ntoast.close = close\ntoast.clear = clear\ntoast.updateMessage = updateMessage\n\n// 获取当前可见 toast 数量(测试用)\ntoast._visibleCount = () => visibleToasts.size\n\n// 重置全部状态(测试用)\ntoast._reset = () => {\n pendingBatch = undefined\n isBatchScheduled = false\n for (const el of visibleToasts.values()) el.remove()\n visibleToasts.clear()\n for (const container of toastContainers) container.remove()\n toastContainers.clear()\n}\n\nexport { toast }\n"],"mappings":"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"}
@@ -1,5 +1,5 @@
1
1
  //#region src/components/toast/style.css?inline
2
- var e = "*,:before,:after{box-sizing:border-box}:host{display:block}:host([hidden]){display:none}.toast{--wui-glass-shadow:var(--wui-shadow-pop,0 3px 9px #00000045);transform:translate(var(--toast-slide-x,0), var(--toast-slide-y,-8px)) scale(.97);width:360px;font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);opacity:0;background-color:var(--wui-color-surface-overlay,#f6f6f6e0);transition:opacity var(--wui-duration-overlay-enter,.18s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1)), transform var(--wui-duration-overlay-enter,.18s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1));border-radius:20px;align-items:center;gap:12px;padding:8px;line-height:1.5;display:flex;position:relative}:host([visible]) .toast{opacity:1;transform:translate(0)scale(1)}:host(:not([visible])) .toast{transition-duration:var(--wui-duration-overlay-exit,.14s)}.toast-close-btn{pointer-events:none;cursor:pointer;width:24px;height:24px;color:var(--wui-color-text-muted,#6a6a6a);opacity:0;transition:opacity var(--wui-duration-trigger,.16s) ease;border:none;border-radius:2147483647px;justify-content:center;align-items:center;margin:0;padding:0;display:flex;position:absolute;top:-8px;right:-8px}.toast-close-btn:focus-visible{pointer-events:auto;opacity:1;outline:2px solid var(--wui-focus-ring,#08f6);outline-offset:2px}@media (hover:hover) and (pointer:fine){.toast-close-btn:hover,.toast:hover .toast-close-btn{pointer-events:auto;opacity:1}}.toast-icon{border-radius:2147483647px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.toast.success .toast-icon{color:var(--wui-color-success,#16a34a);background-color:color-mix(in srgb, var(--wui-color-success,#16a34a) 10%, transparent)}.toast.info .toast-icon{color:var(--wui-color-info,#2563eb);background-color:color-mix(in srgb, var(--wui-color-info,#2563eb) 10%, transparent)}.toast.warning .toast-icon{color:var(--wui-color-warning,#d97706);background-color:color-mix(in srgb, var(--wui-color-warning,#d97706) 10%, transparent)}.toast.error .toast-icon{color:var(--wui-color-danger,#dc2626);background-color:color-mix(in srgb, var(--wui-color-danger,#dc2626) 10%, transparent)}.toast-body{flex:1;min-width:0;padding-top:1px}.toast-heading{font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;font-weight:600;line-height:1.4;overflow:hidden}.toast-message{-webkit-line-clamp:3;font-size:calc(var(--wui-font-size,14px) - 1px);color:color-mix(in srgb, var(--wui-color-text,#1b1b1b) 55%, transparent);word-break:break-all;-webkit-box-orient:vertical;margin-top:2px;line-height:1.45;display:-webkit-box;overflow:hidden}.toast-time{color:color-mix(in srgb, var(--wui-color-text,#1b1b1b) 30%, transparent);white-space:nowrap;flex-shrink:0;padding-top:2px;font-size:12px}@media (prefers-reduced-motion:reduce){.toast,:host([visible]) .toast{transform:none}}";
2
+ var e = "*,:before,:after{box-sizing:border-box}:host{display:block}:host([hidden]){display:none}.toast{--wui-glass-shadow:var(--wui-shadow-pop,0 3px 9px #00000045);transform:translate(var(--toast-slide-x,0), var(--toast-slide-y,-8px)) scale(.97);width:320px;min-height:36px;font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);opacity:0;background-color:var(--wui-color-surface-overlay,#f6f6f6e0);transition:opacity var(--wui-duration-overlay-enter,.18s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1)), transform var(--wui-duration-overlay-enter,.18s) var(--wui-ease-enter,cubic-bezier(.23, 1, .32, 1));border-radius:20px;gap:8px;padding:8px;line-height:1.5;display:flex;position:relative}:host([visible]) .toast{opacity:1;transform:translate(0)scale(1)}:host(:not([visible])) .toast{transition-duration:var(--wui-duration-overlay-exit,.14s)}web-ui-button.toast-close-btn{pointer-events:none;cursor:pointer;opacity:0;transition:opacity var(--wui-duration-trigger,.16s) ease;position:absolute;top:-8px;right:-8px}web-ui-button.toast-close-btn:focus-within{pointer-events:auto;opacity:1}@media (hover:hover) and (pointer:fine){web-ui-button.toast-close-btn:hover,.toast:hover web-ui-button.toast-close-btn{pointer-events:auto;opacity:1}}.toast web-ui-button[icon]{--wui-button-color:var(--wui-color-text-muted,#6a6a6a)}.toast-icon{border-radius:2147483647px;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;margin-bottom:auto;display:flex}.toast.success .toast-icon{color:var(--wui-color-success,#16a34a);background-color:color-mix(in srgb, var(--wui-color-success,#16a34a) 10%, transparent)}.toast.info .toast-icon{color:var(--wui-color-info,#2563eb);background-color:color-mix(in srgb, var(--wui-color-info,#2563eb) 10%, transparent)}.toast.warning .toast-icon{color:var(--wui-color-warning,#d97706);background-color:color-mix(in srgb, var(--wui-color-warning,#d97706) 10%, transparent)}.toast.error .toast-icon{color:var(--wui-color-danger,#dc2626);background-color:color-mix(in srgb, var(--wui-color-danger,#dc2626) 10%, transparent)}.toast-body{flex:1;min-width:0}.toast-heading{font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;font-weight:600;line-height:1.4;overflow:hidden}.toast-message{-webkit-line-clamp:3;font-size:calc(var(--wui-font-size,14px) - 1px);color:color-mix(in srgb, var(--wui-color-text,#1b1b1b) 55%, transparent);word-break:break-all;-webkit-box-orient:vertical;line-height:1.4;display:-webkit-box;overflow:hidden}.toast-time{color:color-mix(in srgb, var(--wui-color-text,#1b1b1b) 30%, transparent);white-space:nowrap;font-size:12px}@media (prefers-reduced-motion:reduce){.toast,:host([visible]) .toast{transform:none}}";
3
3
  //#endregion
4
4
  export { e as default };
5
5
 
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/toast/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n display: block;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n/* ===== 入场 / 退场动画 ===== */\n\n.toast {\n --wui-glass-shadow: var(--wui-shadow-pop, 0 3px 9px rgb(0 0 0 / 0.27));\n position: relative;\n transform: translate(var(--toast-slide-x, 0), var(--toast-slide-y, -8px)) scale(0.97);\n\n display: flex;\n gap: 12px;\n align-items: center;\n\n width: 360px;\n padding: 8px;\n border-radius: 20px;\n\n font-size: var(--wui-font-size, 14px);\n line-height: 1.5;\n color: var(--wui-color-text, #1b1b1b);\n\n opacity: 0;\n background-color: var(--wui-color-surface-overlay, rgb(246 246 246 / 0.88));\n\n transition:\n opacity var(--wui-duration-overlay-enter, 180ms) var(--wui-ease-enter, cubic-bezier(0.23, 1, 0.32, 1)),\n transform var(--wui-duration-overlay-enter, 180ms) var(--wui-ease-enter, cubic-bezier(0.23, 1, 0.32, 1));\n}\n\n:host([visible]) .toast {\n transform: translate(0, 0) scale(1);\n opacity: 1;\n}\n\n:host(:not([visible])) .toast {\n transition-duration: var(--wui-duration-overlay-exit, 140ms);\n}\n\n/* ===== 关闭按钮(放在 hover 规则之前,避免 specificity 降序) ===== */\n\n.toast-close-btn {\n pointer-events: none;\n cursor: pointer;\n\n position: absolute;\n top: -8px;\n right: -8px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n width: 24px;\n height: 24px;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: calc(infinity * 1px);\n\n color: var(--wui-color-text-muted, #6a6a6a);\n\n opacity: 0;\n\n transition: opacity var(--wui-duration-trigger, 160ms) ease;\n\n &:focus-visible {\n pointer-events: auto;\n opacity: 1;\n outline: 2px solid var(--wui-focus-ring, rgb(0 136 255 / 0.4));\n outline-offset: 2px;\n }\n}\n\n@media (hover: hover) and (pointer: fine) {\n .toast-close-btn:hover,\n .toast:hover .toast-close-btn {\n pointer-events: auto;\n opacity: 1;\n }\n}\n\n/* ===== 图标 ===== */\n\n.toast-icon {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n\n width: 32px;\n height: 32px;\n border-radius: calc(infinity * 1px);\n}\n\n.toast.success .toast-icon {\n color: var(--wui-color-success, #16a34a);\n background-color: color-mix(in srgb, var(--wui-color-success, #16a34a) 10%, transparent);\n}\n\n.toast.info .toast-icon {\n color: var(--wui-color-info, #2563eb);\n background-color: color-mix(in srgb, var(--wui-color-info, #2563eb) 10%, transparent);\n}\n\n.toast.warning .toast-icon {\n color: var(--wui-color-warning, #d97706);\n background-color: color-mix(in srgb, var(--wui-color-warning, #d97706) 10%, transparent);\n}\n\n.toast.error .toast-icon {\n color: var(--wui-color-danger, #dc2626);\n background-color: color-mix(in srgb, var(--wui-color-danger, #dc2626) 10%, transparent);\n}\n\n/* ===== 内容区 ===== */\n\n.toast-body {\n flex: 1;\n min-width: 0;\n padding-top: 1px;\n}\n\n.toast-heading {\n overflow: hidden;\n\n font-size: var(--wui-font-size, 14px);\n font-weight: 600;\n line-height: 1.4;\n color: var(--wui-color-text, #1b1b1b);\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.toast-message {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 3;\n\n margin-top: 2px;\n\n font-size: calc(var(--wui-font-size, 14px) - 1px);\n line-height: 1.45;\n color: color-mix(in srgb, var(--wui-color-text, #1b1b1b) 55%, transparent);\n word-break: break-all;\n}\n\n/* ===== 时间戳 ===== */\n\n.toast-time {\n flex-shrink: 0;\n\n padding-top: 2px;\n\n font-size: 12px;\n color: color-mix(in srgb, var(--wui-color-text, #1b1b1b) 30%, transparent);\n white-space: nowrap;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .toast,\n :host([visible]) .toast {\n transform: none;\n }\n}\n"],"mappings":""}
1
+ {"version":3,"file":"style.js","names":[],"sources":["../../../src/components/toast/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n box-sizing: border-box;\n}\n\n:host {\n display: block;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n/* ===== 入场 / 退场动画 ===== */\n\n.toast {\n --wui-glass-shadow: var(--wui-shadow-pop, 0 3px 9px rgb(0 0 0 / 0.27));\n position: relative;\n transform: translate(var(--toast-slide-x, 0), var(--toast-slide-y, -8px)) scale(0.97);\n\n display: flex;\n gap: 8px;\n\n width: 320px;\n min-height: 36px;\n padding: 8px;\n border-radius: 20px;\n\n font-size: var(--wui-font-size, 14px);\n line-height: 1.5;\n color: var(--wui-color-text, #1b1b1b);\n\n opacity: 0;\n background-color: var(--wui-color-surface-overlay, rgb(246 246 246 / 0.88));\n\n transition:\n opacity var(--wui-duration-overlay-enter, 180ms) var(--wui-ease-enter, cubic-bezier(0.23, 1, 0.32, 1)),\n transform var(--wui-duration-overlay-enter, 180ms) var(--wui-ease-enter, cubic-bezier(0.23, 1, 0.32, 1));\n}\n\n:host([visible]) .toast {\n transform: translate(0, 0) scale(1);\n opacity: 1;\n}\n\n:host(:not([visible])) .toast {\n transition-duration: var(--wui-duration-overlay-exit, 140ms);\n}\n\n/* ===== 关闭按钮(放在 hover 规则之前,避免 specificity 降序) ===== */\n\nweb-ui-button.toast-close-btn {\n pointer-events: none;\n cursor: pointer;\n\n position: absolute;\n top: -8px;\n right: -8px;\n\n opacity: 0;\n\n transition: opacity var(--wui-duration-trigger, 160ms) ease;\n\n /* 内层原生按钮获得键盘焦点时宿主同样可见 */\n &:focus-within {\n pointer-events: auto;\n opacity: 1;\n }\n}\n\n@media (hover: hover) and (pointer: fine) {\n web-ui-button.toast-close-btn:hover,\n .toast:hover web-ui-button.toast-close-btn {\n pointer-events: auto;\n opacity: 1;\n }\n}\n\n/* secondary 变体默认用文本色,恢复原关闭按钮的 muted 观感 */\n.toast web-ui-button[icon] {\n --wui-button-color: var(--wui-color-text-muted, #6a6a6a);\n}\n\n/* ===== 图标 ===== */\n\n.toast-icon {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n\n width: 20px;\n height: 20px;\n margin-bottom: auto;\n border-radius: calc(infinity * 1px);\n}\n\n.toast.success .toast-icon {\n color: var(--wui-color-success, #16a34a);\n background-color: color-mix(in srgb, var(--wui-color-success, #16a34a) 10%, transparent);\n}\n\n.toast.info .toast-icon {\n color: var(--wui-color-info, #2563eb);\n background-color: color-mix(in srgb, var(--wui-color-info, #2563eb) 10%, transparent);\n}\n\n.toast.warning .toast-icon {\n color: var(--wui-color-warning, #d97706);\n background-color: color-mix(in srgb, var(--wui-color-warning, #d97706) 10%, transparent);\n}\n\n.toast.error .toast-icon {\n color: var(--wui-color-danger, #dc2626);\n background-color: color-mix(in srgb, var(--wui-color-danger, #dc2626) 10%, transparent);\n}\n\n/* ===== 内容区 ===== */\n\n.toast-body {\n flex: 1;\n min-width: 0;\n}\n\n.toast-heading {\n overflow: hidden;\n\n font-size: var(--wui-font-size, 14px);\n font-weight: 600;\n line-height: 1.4;\n color: var(--wui-color-text, #1b1b1b);\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.toast-message {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 3;\n\n font-size: calc(var(--wui-font-size, 14px) - 1px);\n line-height: 1.4;\n color: color-mix(in srgb, var(--wui-color-text, #1b1b1b) 55%, transparent);\n word-break: break-all;\n}\n\n/* ===== 时间戳 ===== */\n\n.toast-time {\n font-size: 12px;\n color: color-mix(in srgb, var(--wui-color-text, #1b1b1b) 30%, transparent);\n white-space: nowrap;\n}\n\n@media (prefers-reduced-motion: reduce) {\n .toast,\n :host([visible]) .toast {\n transform: none;\n }\n}\n"],"mappings":""}
@@ -14,13 +14,9 @@ export declare class WebUiToast extends LitElement {
14
14
  connectedCallback(): void;
15
15
  disconnectedCallback(): void;
16
16
  protected updated(changed: PropertyValues): void;
17
- /** 根据 position 设置入场/退场滑动方向 */
18
17
  private _applySlideDirection;
19
- /** 启动自动关闭计时器 */
20
18
  startAutoClose(): void;
21
- /** 由 manager 调用:播放入场动画后自动开始计时 */
22
19
  show(): void;
23
- /** 关闭(含退场动画) */
24
20
  dismiss(reason?: ToastCloseReason): void;
25
21
  private _clearTimer;
26
22
  private _onPointerEnter;
@@ -1,21 +1,22 @@
1
1
  import e from "../../_virtual/_@oxc-project_runtime@0.140.0/helpers/esm/decorate.js";
2
2
  import "../icon/index.js";
3
- import t from "../../assets/glass.js";
4
- import n from "../../icons/generated/lucide-check.js";
5
- import r from "../../icons/generated/lucide-info.js";
6
- import i from "../../icons/generated/lucide-triangle-alert.js";
7
- import a from "../../icons/generated/lucide-circle-alert.js";
8
- import o from "../../icons/generated/heroicons-x-mark-16-solid.js";
3
+ import t from "../../icons/generated/lucide-check.js";
4
+ import n from "../../icons/generated/lucide-info.js";
5
+ import r from "../../icons/generated/lucide-triangle-alert.js";
6
+ import i from "../../icons/generated/lucide-circle-alert.js";
7
+ import a from "../../icons/generated/heroicons-x-mark-16-solid.js";
8
+ import o from "../../assets/glass.js";
9
9
  import { getTransitionDuration as s } from "../../shared/overlay/presence.js";
10
+ import "../button/index.js";
10
11
  import c from "./style.js";
11
12
  import { LitElement as l, html as u, nothing as d, unsafeCSS as f } from "lit";
12
13
  import { customElement as p, property as m } from "lit/decorators.js";
13
14
  //#region src/components/toast/toast.ts
14
15
  var h = {
15
- success: n,
16
- info: r,
17
- warning: i,
18
- error: a
16
+ success: t,
17
+ info: n,
18
+ warning: r,
19
+ error: i
19
20
  };
20
21
  function g() {
21
22
  let e = /* @__PURE__ */ new Date();
@@ -32,7 +33,7 @@ var _ = class extends l {
32
33
  };
33
34
  }
34
35
  static {
35
- this.styles = [f(t), f(c)];
36
+ this.styles = [f(o), f(c)];
36
37
  }
37
38
  connectedCallback() {
38
39
  super.connectedCallback(), this.addEventListener("pointerenter", this._onPointerEnter), this.addEventListener("pointerleave", this._onPointerLeave);
@@ -79,11 +80,11 @@ var _ = class extends l {
79
80
  }));
80
81
  }
81
82
  render() {
82
- let e = h[this.type], t = this.type === "error" ? "assertive" : "polite";
83
+ let e = h[this.type], t = this.type === "error" ? "assertive" : "polite", n = this.type === "error" ? "alert" : d;
83
84
  return u`
84
- <div class="toast wui-glass ${this.type}" role="alert" aria-live=${t} aria-atomic="true">
85
+ <div class="toast wui-glass ${this.type}" role=${n} aria-live=${t} aria-atomic="true">
85
86
  <span class="toast-icon" aria-hidden="true">
86
- <web-ui-icon .icon=${e} :size="18"></web-ui-icon>
87
+ <web-ui-icon .icon=${e} size="14"></web-ui-icon>
87
88
  </span>
88
89
  <div class="toast-body">
89
90
  ${this.heading ? u`<div class="toast-heading">${this.heading}</div>` : d}
@@ -91,9 +92,16 @@ var _ = class extends l {
91
92
  </div>
92
93
  <span class="toast-time">${g()}</span>
93
94
  ${this.noCloseButton ? d : u`
94
- <button class="toast-close-btn wui-glass" aria-label="关闭" @click=${this._onCloseClick}>
95
- <web-ui-icon .icon=${o} :size="10"></web-ui-icon>
96
- </button>
95
+ <web-ui-button
96
+ class="toast-close-btn"
97
+ icon
98
+ variant="secondary"
99
+ size="24"
100
+ aria-label="关闭"
101
+ @click=${this._onCloseClick}
102
+ >
103
+ <web-ui-icon .icon=${a} size="16"></web-ui-icon>
104
+ </web-ui-button>
97
105
  `}
98
106
  </div>
99
107
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"toast.js","names":[],"sources":["../../../src/components/toast/toast.ts"],"sourcesContent":["import type { IconifyIcon } from '@iconify/types'\nimport { html, LitElement, nothing, type PropertyValues, unsafeCSS } from 'lit'\n\nimport '@/components/icon'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport glass from '@/assets/glass.css?inline'\nimport { lucideCheck, lucideInfo, lucideTriangleAlert, lucideCircleAlert, heroiconsXMark16Solid } from '@/icons'\nimport { getTransitionDuration } from '@/shared/overlay/presence'\n\nimport style from './style.css?inline'\nimport type { ToastCloseReason, ToastPosition, ToastType } from './types'\n\nconst TYPE_ICONS: Record<ToastType, IconifyIcon> = {\n success: lucideCheck,\n info: lucideInfo,\n warning: lucideTriangleAlert,\n error: lucideCircleAlert\n}\n\nfunction _formatTime(): string {\n const now = new Date()\n const h = now.getHours().toString().padStart(2, '0')\n const m = now.getMinutes().toString().padStart(2, '0')\n return `${h}:${m}`\n}\n\n@customElement('web-ui-toast')\nexport class WebUiToast extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n @property({ type: String, attribute: false }) toastId = ''\n @property({ type: String, reflect: true }) type: ToastType = 'info'\n @property({ type: String, reflect: true }) position: ToastPosition = 'top-right'\n @property({ type: String }) heading = ''\n @property({ type: String }) message = ''\n @property({ type: Number }) duration = 3000\n @property({ type: Boolean, reflect: true, attribute: 'no-close-button' }) noCloseButton = false\n @property({ type: Boolean, reflect: true }) visible = false\n\n private _closeTimer?: ReturnType<typeof setTimeout>\n\n override connectedCallback() {\n super.connectedCallback()\n this.addEventListener('pointerenter', this._onPointerEnter)\n this.addEventListener('pointerleave', this._onPointerLeave)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this.removeEventListener('pointerenter', this._onPointerEnter)\n this.removeEventListener('pointerleave', this._onPointerLeave)\n this._clearTimer()\n }\n\n protected override updated(changed: PropertyValues) {\n if (changed.has('position')) {\n this._applySlideDirection()\n }\n }\n\n /** 根据 position 设置入场/退场滑动方向 */\n private _applySlideDirection() {\n const SLIDE_OFFSET = 20\n let x = 0\n let y = 0\n\n if (this.position.includes('left')) x = -SLIDE_OFFSET\n else if (this.position.includes('right')) x = SLIDE_OFFSET\n\n if (this.position.startsWith('top')) y = -SLIDE_OFFSET\n else if (this.position.startsWith('bottom')) y = SLIDE_OFFSET\n\n this.style.setProperty('--toast-slide-x', `${x}px`)\n this.style.setProperty('--toast-slide-y', `${y}px`)\n }\n\n /** 启动自动关闭计时器 */\n startAutoClose() {\n this._clearTimer()\n if (this.duration > 0) {\n this._closeTimer = setTimeout(() => {\n this.dismiss('auto')\n }, this.duration)\n }\n }\n\n /** 由 manager 调用:播放入场动画后自动开始计时 */\n show() {\n this.visible = true\n this.startAutoClose()\n }\n\n /** 关闭(含退场动画) */\n dismiss(reason: ToastCloseReason = 'programmatic') {\n if (!this.visible) return\n this.visible = false\n this._clearTimer()\n const onEnd = () => {\n this.removeEventListener('transitionend', onEnd)\n this._dispatchClose(reason)\n }\n this.addEventListener('transitionend', onEnd)\n // fallback: transitionend 不触发时(display:none 等)\n const toast = this.shadowRoot?.querySelector<HTMLElement>('.toast')\n setTimeout(onEnd, getTransitionDuration(toast ?? this) + 80)\n }\n\n private _clearTimer() {\n if (this._closeTimer !== undefined) {\n clearTimeout(this._closeTimer)\n this._closeTimer = undefined\n }\n }\n\n private _onPointerEnter = (e: PointerEvent) => {\n if (e.pointerType === 'touch') return\n this._clearTimer()\n }\n\n private _onPointerLeave = (e: PointerEvent) => {\n if (e.pointerType === 'touch') return\n this.startAutoClose()\n }\n\n private _onCloseClick = () => {\n this.dismiss('manual')\n }\n\n private _dispatchClose(reason: ToastCloseReason) {\n this.dispatchEvent(\n new CustomEvent('toast-close', {\n detail: { id: this.toastId, reason },\n bubbles: true,\n composed: true\n })\n )\n }\n\n override render() {\n const icon = TYPE_ICONS[this.type]\n const ariaLive = this.type === 'error' ? 'assertive' : 'polite'\n\n return html`\n <div class=\"toast wui-glass ${this.type}\" role=\"alert\" aria-live=${ariaLive} aria-atomic=\"true\">\n <span class=\"toast-icon\" aria-hidden=\"true\">\n <web-ui-icon .icon=${icon} :size=\"18\"></web-ui-icon>\n </span>\n <div class=\"toast-body\">\n ${this.heading ? html`<div class=\"toast-heading\">${this.heading}</div>` : nothing}\n <div class=\"toast-message\">${this.message}</div>\n </div>\n <span class=\"toast-time\">${_formatTime()}</span>\n ${!this.noCloseButton\n ? html`\n <button class=\"toast-close-btn wui-glass\" aria-label=\"关闭\" @click=${this._onCloseClick}>\n <web-ui-icon .icon=${heroiconsXMark16Solid} :size=\"10\"></web-ui-icon>\n </button>\n `\n : nothing}\n </div>\n `\n }\n\n declare readonly $events: {\n 'toast-close': CustomEvent<{ id: string; reason: ToastCloseReason }>\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-toast': WebUiToast\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"toast.js","names":[],"sources":["../../../src/components/toast/toast.ts"],"sourcesContent":["import type { IconifyIcon } from '@iconify/types'\nimport { html, LitElement, nothing, type PropertyValues, unsafeCSS } from 'lit'\n\nimport '@/components/icon'\n// web-ui-button 复用 icon 变体的焦点环与统一样式(secondary 变体,浅灰底贴合 toast 角落)\nimport '@/components/button'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport glass from '@/assets/glass.css?inline'\nimport { lucideCheck, lucideInfo, lucideTriangleAlert, lucideCircleAlert, heroiconsXMark16Solid } from '@/icons'\nimport { getTransitionDuration } from '@/shared/overlay/presence'\n\nimport style from './style.css?inline'\nimport type { ToastCloseReason, ToastPosition, ToastType } from './types'\n\nconst TYPE_ICONS: Record<ToastType, IconifyIcon> = {\n success: lucideCheck,\n info: lucideInfo,\n warning: lucideTriangleAlert,\n error: lucideCircleAlert\n}\n\nfunction _formatTime(): string {\n const now = new Date()\n const h = now.getHours().toString().padStart(2, '0')\n const m = now.getMinutes().toString().padStart(2, '0')\n return `${h}:${m}`\n}\n\n@customElement('web-ui-toast')\nexport class WebUiToast extends LitElement {\n static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n\n @property({ type: String, attribute: false }) toastId = ''\n @property({ type: String, reflect: true }) type: ToastType = 'info'\n @property({ type: String, reflect: true }) position: ToastPosition = 'top-right'\n @property({ type: String }) heading = ''\n @property({ type: String }) message = ''\n @property({ type: Number }) duration = 3000\n @property({ type: Boolean, reflect: true, attribute: 'no-close-button' }) noCloseButton = false\n @property({ type: Boolean, reflect: true }) visible = false\n\n private _closeTimer?: ReturnType<typeof setTimeout>\n\n override connectedCallback() {\n super.connectedCallback()\n this.addEventListener('pointerenter', this._onPointerEnter)\n this.addEventListener('pointerleave', this._onPointerLeave)\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback()\n this.removeEventListener('pointerenter', this._onPointerEnter)\n this.removeEventListener('pointerleave', this._onPointerLeave)\n this._clearTimer()\n }\n\n protected override updated(changed: PropertyValues) {\n if (changed.has('position')) {\n this._applySlideDirection()\n }\n }\n\n // 根据 position 设置入场/退场滑动方向\n private _applySlideDirection() {\n const SLIDE_OFFSET = 20\n let x = 0\n let y = 0\n\n if (this.position.includes('left')) x = -SLIDE_OFFSET\n else if (this.position.includes('right')) x = SLIDE_OFFSET\n\n if (this.position.startsWith('top')) y = -SLIDE_OFFSET\n else if (this.position.startsWith('bottom')) y = SLIDE_OFFSET\n\n this.style.setProperty('--toast-slide-x', `${x}px`)\n this.style.setProperty('--toast-slide-y', `${y}px`)\n }\n\n // 启动自动关闭计时器\n startAutoClose() {\n this._clearTimer()\n if (this.duration > 0) {\n this._closeTimer = setTimeout(() => {\n this.dismiss('auto')\n }, this.duration)\n }\n }\n\n // 由 manager 调用:播放入场动画后自动开始计时\n show() {\n this.visible = true\n this.startAutoClose()\n }\n\n // 关闭(含退场动画)\n dismiss(reason: ToastCloseReason = 'programmatic') {\n if (!this.visible) return\n this.visible = false\n this._clearTimer()\n const onEnd = () => {\n this.removeEventListener('transitionend', onEnd)\n this._dispatchClose(reason)\n }\n this.addEventListener('transitionend', onEnd)\n // fallback: transitionend 不触发时(display:none 等)\n const toast = this.shadowRoot?.querySelector<HTMLElement>('.toast')\n setTimeout(onEnd, getTransitionDuration(toast ?? this) + 80)\n }\n\n private _clearTimer() {\n if (this._closeTimer !== undefined) {\n clearTimeout(this._closeTimer)\n this._closeTimer = undefined\n }\n }\n\n private _onPointerEnter = (e: PointerEvent) => {\n if (e.pointerType === 'touch') return\n this._clearTimer()\n }\n\n private _onPointerLeave = (e: PointerEvent) => {\n if (e.pointerType === 'touch') return\n this.startAutoClose()\n }\n\n private _onCloseClick = () => {\n this.dismiss('manual')\n }\n\n private _dispatchClose(reason: ToastCloseReason) {\n this.dispatchEvent(\n new CustomEvent('toast-close', {\n detail: { id: this.toastId, reason },\n bubbles: true,\n composed: true\n })\n )\n }\n\n override render() {\n const icon = TYPE_ICONS[this.type]\n const ariaLive = this.type === 'error' ? 'assertive' : 'polite'\n // role=\"alert\" 会强制隐式 aria-live=\"assertive\",覆盖掉上方 aria-live 设置,\n // 因此仅 error toast 使用 alert(本就应 assertive);其余类型交给容器 role=\"log\" 的 polite 播报。\n const role = this.type === 'error' ? 'alert' : nothing\n\n return html`\n <div class=\"toast wui-glass ${this.type}\" role=${role} aria-live=${ariaLive} aria-atomic=\"true\">\n <span class=\"toast-icon\" aria-hidden=\"true\">\n <web-ui-icon .icon=${icon} size=\"14\"></web-ui-icon>\n </span>\n <div class=\"toast-body\">\n ${this.heading ? html`<div class=\"toast-heading\">${this.heading}</div>` : nothing}\n <div class=\"toast-message\">${this.message}</div>\n </div>\n <span class=\"toast-time\">${_formatTime()}</span>\n ${!this.noCloseButton\n ? html`\n <web-ui-button\n class=\"toast-close-btn\"\n icon\n variant=\"secondary\"\n size=\"24\"\n aria-label=\"关闭\"\n @click=${this._onCloseClick}\n >\n <web-ui-icon .icon=${heroiconsXMark16Solid} size=\"16\"></web-ui-icon>\n </web-ui-button>\n `\n : nothing}\n </div>\n `\n }\n\n declare readonly $events: {\n 'toast-close': CustomEvent<{ id: string; reason: ToastCloseReason }>\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'web-ui-toast': WebUiToast\n }\n}\n"],"mappings":"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"}
@@ -8,15 +8,12 @@ export interface ToastOptions {
8
8
  closable?: boolean;
9
9
  id?: string;
10
10
  heading?: string;
11
- /** 用于解析最近 web-ui-theme 的触发元素。 */
12
11
  target?: Element;
13
- /** 显式挂载容器,优先级高于 target 和主题作用域。 */
14
12
  container?: HTMLElement;
15
13
  }
16
14
  export interface ToastInstanceOptions extends ToastOptions {
17
15
  position?: ToastPosition;
18
16
  }
19
- /** 更新已创建 Toast 的文本内容。未传入 heading 时保留原值。 */
20
17
  export interface ToastMessageUpdateOptions {
21
18
  message: string;
22
19
  heading?: string;
@@ -23,6 +23,7 @@ export declare class WebUiTooltip extends LitElement {
23
23
  private _showTimer?;
24
24
  private _hideTimer?;
25
25
  private _isCountedVisible;
26
+ private readonly _userOpenChange;
26
27
  private _shouldOpenInstantly;
27
28
  private readonly _panel;
28
29
  get isOpen(): boolean;