@greypan/web-ui 8.0.0 → 8.1.0

package/dist/components/segmented/index.js

@@ -1,9 +1,9 @@
 import e from "../../_virtual/_@oxc-project_runtime@0.149.0/helpers/esm/decorate.js";
 import t from "../../assets/glass.js";
 import { installPointerFocusSuppression as n } from "../../shared/focus/pointer-focus.js";
-import { GroupController as r, defineGroupCoordinator as i } from "../../shared/group-management/index.js";
-import { normalizeLiteral as a } from "../../shared/normalize/index.js";
-import { FormAssociated as o, FormAssociationController as s, defineFormAssociation as c } from "../../shared/form-association/index.js";
+import { FormAssociated as r, FormAssociationController as i, defineFormAssociation as a } from "../../shared/form-association/index.js";
+import { GroupController as o, defineGroupCoordinator as s } from "../../shared/group-management/index.js";
+import { normalizeLiteral as c } from "../../shared/normalize/index.js";
 import { attachDragGesture as l } from "../../shared/gesture/drag-gesture.js";
 import { clamp as u, snapToNearest as d } from "../../shared/gesture/physics.js";
 import f from "./style.js";
@@ -12,9 +12,9 @@ import { customElement as g, property as _, state as v } from "lit/decorators.js
 import { classMap as y } from "lit/directives/class-map.js";
 //#region src/components/segmented/index.ts
 n();
-var b = ["inset", "raised"], x = class extends o(p) {
+var b = ["inset", "raised"], x = class extends r(p) {
 	constructor(...e) {
-		super(...e), this.name = "", this._variant = "inset", this.disabled = !1, this.required = !1, this._value = "", this._indicatorReady = !1, this._pressed = !1, this._isDragging = !1, this._dragGestureHandle = null, this._groupController = new r(this, i({
+		super(...e), this.name = "", this._variant = "inset", this.disabled = !1, this.required = !1, this._value = "", this._indicatorReady = !1, this._pressed = !1, this._isDragging = !1, this._dragGestureHandle = null, this._groupController = new o(this, s({
 			host: this,
 			getItems: () => [...this.querySelectorAll("web-ui-segmented-trigger")],
 			getValue: () => this._value,
@@ -39,7 +39,7 @@ var b = ["inset", "raised"], x = class extends o(p) {
 					composed: !0
 				}));
 			}
-		}).make(), { afterSync: () => requestAnimationFrame(() => this._updateIndicator()) }), this._formAssociation = c({
+		}).make(), { afterSync: () => requestAnimationFrame(() => this._updateIndicator()) }), this._formAssociation = a({
 			host: this,
 			initialize: () => {
 				let e = this.getAttribute("value");
@@ -54,7 +54,7 @@ var b = ["inset", "raised"], x = class extends o(p) {
 			restoreState: (e) => {
 				typeof e == "string" && (this.value = e);
 			}
-		}).make(), this._formAssociationController = new s(this, this._formAssociation);
+		}).make(), this._formAssociationController = new i(this, this._formAssociation);
 	}
 	static {
 		this.styles = [h(t), h(f)];
@@ -64,7 +64,7 @@ var b = ["inset", "raised"], x = class extends o(p) {
 	}
 	set variant(e) {
 		let t = this._variant;
-		this._variant = a(e, b, "inset"), this.requestUpdate("variant", t);
+		this._variant = c(e, b, "inset"), this.requestUpdate("variant", t);
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), this._dragGestureHandle?.destroy(), this._dragGestureHandle = null;

package/dist/components/select/style.js

@@ -1,5 +1,5 @@
 //#region src/components/select/style.css?inline
-var e = "*,:before,:after{box-sizing:border-box}:host{--wui-select-bg-hover:var(--wui-color-surface-glass-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, var(--wui-color-surface-glass,#fafafa57)));--wui-select-bg-active:var(--wui-color-surface-glass-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, var(--wui-color-surface-glass,#fafafa57)));-webkit-user-select:none;user-select:none;display:inline-block}:host([disabled]){cursor:not-allowed;opacity:.4}.wui-select-inner{flex-direction:column;display:flex;position:relative}.select-trigger{--wui-glass-corner-radius:calc(var(--wui-control-size,36px) / 2);cursor:default;box-sizing:border-box;width:var(--wui-input-width,200px);min-width:var(--wui-control-size,36px);height:var(--wui-control-size,36px);border-radius:var(--wui-radius-control,calc(infinity * 1px));border:none;align-items:center;gap:8px;padding:0 12px;display:flex;overflow:clip}.select-trigger:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,#08f6);outline-offset:2px}:host([disabled]) .select-trigger{cursor:not-allowed}@media (hover:hover) and (pointer:fine){:host(:not([disabled])) .select-trigger:hover{background-color:var(--wui-select-bg-hover)}}:host(:not([disabled])) .select-trigger:active,:host([open]:not([disabled])) .select-trigger{background-color:var(--wui-select-bg-active)}.select-trigger[data-custom-trigger]{width:auto}.label{font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}:host(:not([data-has-value])) .label{color:var(--wui-color-text-secondary,#6a6a6a)}::slotted([slot=trigger]){font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.arrow{color:var(--wui-color-text-secondary,#6a6a6a);flex-shrink:0}:host([open]) .arrow{transform:rotate(180deg)}.select-overlay{--wui-internal-glass-shadow:var(--wui-shadow-panel,0 3px 9px #00000045);--wui-internal-duration-float-enter:var(--wui-duration-float-enter,.24s);--wui-internal-duration-float-exit:var(--wui-duration-float-exit,.16s);--wui-glass-corner-radius:var(--wui-radius-menu,18px);z-index:var(--wui-layer-inline-overlay,1);box-sizing:border-box;min-width:var(--wui-overlay-min-width,200px);max-width:var(--wui-select-max-width,500px);border-radius:var(--wui-radius-menu,18px);background-color:var(--wui-color-surface-menu,#f6f6f6d1);position:absolute;overflow:hidden}.select-overlay.portal{z-index:var(--wui-layer-menu,100);position:fixed}.select-overlay.hidden{display:none}.select-scroll{max-height:var(--wui-select-max-height,200px);overflow-y:auto}.select-content{padding:4px}:host([portal]) .select-overlay{display:none}:host([data-wui-pointer-focus]) .select-trigger:focus-visible{outline-color:#0000}";
+var e = "*,:before,:after{box-sizing:border-box}:host{--wui-select-bg-hover:var(--wui-color-surface-glass-hover,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 6%, var(--wui-color-surface-glass,#fafafa57)));--wui-select-bg-active:var(--wui-color-surface-glass-active,color-mix(in srgb, var(--wui-color-text,#1b1b1b) 15%, var(--wui-color-surface-glass,#fafafa57)));-webkit-user-select:none;user-select:none;display:inline-block}:host([disabled]){cursor:not-allowed;opacity:.4}.wui-select-inner{flex-direction:column;display:flex;position:relative}.select-trigger{--wui-glass-corner-radius:calc(var(--wui-control-size,36px) / 2);cursor:default;box-sizing:border-box;width:var(--wui-input-width,200px);min-width:var(--wui-control-size,36px);height:var(--wui-control-size,36px);border-radius:var(--wui-radius-control,calc(infinity * 1px));border:none;align-items:center;gap:8px;padding:0 12px;display:flex;overflow:clip}.select-trigger:focus-visible{outline:var(--wui-focus-ring-width,3px) solid var(--wui-color-focus-ring,#08f6);outline-offset:2px}:host([disabled]) .select-trigger{cursor:not-allowed}@media (hover:hover) and (pointer:fine){:host(:not([disabled])) .select-trigger:hover{background-color:var(--wui-select-bg-hover)}}:host(:not([disabled])) .select-trigger:active,:host([open]:not([disabled])) .select-trigger{background-color:var(--wui-select-bg-active)}.select-trigger[data-custom-trigger]{width:auto}.label{font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}:host(:not([data-has-value])) .label{color:var(--wui-color-text-secondary,#6a6a6a)}::slotted([slot=trigger]){font-size:var(--wui-font-size,14px);color:var(--wui-color-text,#1b1b1b);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.arrow{color:var(--wui-color-text-secondary,#6a6a6a);flex-shrink:0}:host([open]) .arrow{transform:rotate(180deg)}.select-overlay{--wui-internal-glass-shadow:var(--wui-shadow-panel,0 3px 9px #00000045);--wui-internal-duration-float-enter:var(--wui-duration-float-enter,.24s);--wui-internal-duration-float-exit:var(--wui-duration-float-exit,.16s);--wui-glass-corner-radius:var(--wui-radius-menu,18px);z-index:var(--wui-layer-inline-overlay,1);box-sizing:border-box;min-width:var(--wui-overlay-min-width,200px);max-width:var(--wui-select-max-width,500px);border-radius:var(--wui-radius-menu,18px);background-color:var(--wui-color-surface-menu,#fefefec2);position:absolute;overflow:hidden}.select-overlay.portal{z-index:var(--wui-layer-menu,100);position:fixed}.select-overlay.hidden{display:none}.select-scroll{max-height:var(--wui-select-max-height,200px);overflow-y:auto}.select-content{padding:4px}:host([portal]) .select-overlay{display:none}:host([data-wui-pointer-focus]) .select-trigger:focus-visible{outline-color:#0000}";
 //#endregion
 export { e as default };
 

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

@@ -1 +1 @@
-{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/select/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n:host {\n  --wui-select-bg-hover: var(\n    --wui-color-surface-glass-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n  --wui-select-bg-active: var(\n    --wui-color-surface-glass-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n  user-select: none;\n  display: inline-block;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n  opacity: 0.4;\n}\n\n.wui-select-inner {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n}\n\n.select-trigger {\n  --wui-glass-corner-radius: calc(var(--wui-control-size, 36px) / 2);\n\n  cursor: default;\n\n  overflow: clip;\n  display: flex;\n  gap: 8px;\n  align-items: center;\n\n  box-sizing: border-box;\n  width: var(--wui-input-width, 200px);\n  min-width: var(--wui-control-size, 36px);\n  height: var(--wui-control-size, 36px);\n  padding: 0 12px;\n  border: none;\n  border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n  &:focus-visible {\n    outline: var(--wui-focus-ring-width, 3px) solid var(--wui-color-focus-ring, rgb(0 136 255 / 0.4));\n    outline-offset: 2px;\n  }\n}\n\n:host([disabled]) .select-trigger {\n  cursor: not-allowed;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  :host(:not([disabled])) .select-trigger:hover {\n    background-color: var(--wui-select-bg-hover);\n  }\n}\n\n:host(:not([disabled])) .select-trigger:active,\n:host([open]:not([disabled])) .select-trigger {\n  background-color: var(--wui-select-bg-active);\n}\n\n.select-trigger[data-custom-trigger] {\n  width: auto;\n}\n\n.label {\n  overflow: hidden;\n  flex: 1;\n\n  font-size: var(--wui-font-size, 14px);\n  color: var(--wui-color-text, #1b1b1b);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n:host(:not([data-has-value])) .label {\n  color: var(--wui-color-text-secondary, #6a6a6a);\n}\n\n::slotted([slot='trigger']) {\n  overflow: hidden;\n  flex: 1;\n\n  font-size: var(--wui-font-size, 14px);\n  color: var(--wui-color-text, #1b1b1b);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.arrow {\n  flex-shrink: 0;\n  color: var(--wui-color-text-secondary, #6a6a6a);\n}\n\n:host([open]) .arrow {\n  transform: rotate(180deg);\n}\n\n/* ===== 浮层（glass 样式参考 dialog） ===== */\n\n.select-overlay {\n  --wui-internal-glass-shadow: var(--wui-shadow-panel, 0 3px 9px rgb(0 0 0 / 0.27));\n  --wui-internal-duration-float-enter: var(--wui-duration-float-enter, 240ms);\n  --wui-internal-duration-float-exit: var(--wui-duration-float-exit, 160ms);\n  --wui-glass-corner-radius: var(--wui-radius-menu, 18px);\n  position: absolute;\n  z-index: var(--wui-layer-inline-overlay, 1);\n\n  overflow: hidden;\n\n  box-sizing: border-box;\n  min-width: var(--wui-overlay-min-width, 200px);\n  max-width: var(--wui-select-max-width, 500px);\n  border-radius: var(--wui-radius-menu, 18px);\n\n  /* 玻璃背景：wui-glass 在面板自身，这里覆盖其默认玻璃底为菜单表面色 */\n  background-color: var(--wui-color-surface-menu, rgb(246 246 246 / 0.82));\n\n  &.portal {\n    position: fixed;\n    z-index: var(--wui-layer-menu, 100);\n  }\n\n  &.hidden {\n    display: none;\n  }\n}\n\n.select-scroll {\n  overflow-y: auto;\n  max-height: var(--wui-select-max-height, 200px);\n}\n\n.select-content {\n  padding: 4px;\n}\n\n:host([portal]) .select-overlay {\n  display: none;\n}\n\n:host([data-wui-pointer-focus]) .select-trigger:focus-visible {\n  outline-color: transparent;\n}\n"],"mappings":""}
+{"version":3,"file":"style.js","names":[],"sources":["../../../src/components/select/style.css?inline"],"sourcesContent":["*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n\n:host {\n  --wui-select-bg-hover: var(\n    --wui-color-surface-glass-hover,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 6%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n  --wui-select-bg-active: var(\n    --wui-color-surface-glass-active,\n    color-mix(in srgb, var(--wui-color-text, #1b1b1b) 15%, var(--wui-color-surface-glass, rgb(250 250 250 / 0.34)))\n  );\n  user-select: none;\n  display: inline-block;\n}\n\n:host([disabled]) {\n  cursor: not-allowed;\n  opacity: 0.4;\n}\n\n.wui-select-inner {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n}\n\n.select-trigger {\n  --wui-glass-corner-radius: calc(var(--wui-control-size, 36px) / 2);\n\n  cursor: default;\n\n  overflow: clip;\n  display: flex;\n  gap: 8px;\n  align-items: center;\n\n  box-sizing: border-box;\n  width: var(--wui-input-width, 200px);\n  min-width: var(--wui-control-size, 36px);\n  height: var(--wui-control-size, 36px);\n  padding: 0 12px;\n  border: none;\n  border-radius: var(--wui-radius-control, calc(infinity * 1px));\n\n  &:focus-visible {\n    outline: var(--wui-focus-ring-width, 3px) solid var(--wui-color-focus-ring, rgb(0 136 255 / 0.4));\n    outline-offset: 2px;\n  }\n}\n\n:host([disabled]) .select-trigger {\n  cursor: not-allowed;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  :host(:not([disabled])) .select-trigger:hover {\n    background-color: var(--wui-select-bg-hover);\n  }\n}\n\n:host(:not([disabled])) .select-trigger:active,\n:host([open]:not([disabled])) .select-trigger {\n  background-color: var(--wui-select-bg-active);\n}\n\n.select-trigger[data-custom-trigger] {\n  width: auto;\n}\n\n.label {\n  overflow: hidden;\n  flex: 1;\n\n  font-size: var(--wui-font-size, 14px);\n  color: var(--wui-color-text, #1b1b1b);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n:host(:not([data-has-value])) .label {\n  color: var(--wui-color-text-secondary, #6a6a6a);\n}\n\n::slotted([slot='trigger']) {\n  overflow: hidden;\n  flex: 1;\n\n  font-size: var(--wui-font-size, 14px);\n  color: var(--wui-color-text, #1b1b1b);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.arrow {\n  flex-shrink: 0;\n  color: var(--wui-color-text-secondary, #6a6a6a);\n}\n\n:host([open]) .arrow {\n  transform: rotate(180deg);\n}\n\n.select-overlay {\n  --wui-internal-glass-shadow: var(--wui-shadow-panel, 0 3px 9px rgb(0 0 0 / 0.27));\n  --wui-internal-duration-float-enter: var(--wui-duration-float-enter, 240ms);\n  --wui-internal-duration-float-exit: var(--wui-duration-float-exit, 160ms);\n  --wui-glass-corner-radius: var(--wui-radius-menu, 18px);\n  position: absolute;\n  z-index: var(--wui-layer-inline-overlay, 1);\n\n  overflow: hidden;\n\n  box-sizing: border-box;\n  min-width: var(--wui-overlay-min-width, 200px);\n  max-width: var(--wui-select-max-width, 500px);\n  border-radius: var(--wui-radius-menu, 18px);\n\n  /* 玻璃背景：wui-glass 在面板自身，这里覆盖其默认玻璃底为菜单表面色 */\n  background-color: var(--wui-color-surface-menu, rgb(254 254 254 / 0.76));\n\n  &.portal {\n    position: fixed;\n    z-index: var(--wui-layer-menu, 100);\n  }\n\n  &.hidden {\n    display: none;\n  }\n}\n\n.select-scroll {\n  overflow-y: auto;\n  max-height: var(--wui-select-max-height, 200px);\n}\n\n.select-content {\n  padding: 4px;\n}\n\n:host([portal]) .select-overlay {\n  display: none;\n}\n\n:host([data-wui-pointer-focus]) .select-trigger:focus-visible {\n  outline-color: transparent;\n}\n"],"mappings":""}

package/dist/components/slider/index.js

@@ -1,8 +1,8 @@
 import e from "../../_virtual/_@oxc-project_runtime@0.149.0/helpers/esm/decorate.js";
 import t from "../../assets/glass.js";
 import { installPointerFocusSuppression as n } from "../../shared/focus/pointer-focus.js";
-import { normalizeNumber as r } from "../../shared/normalize/index.js";
-import { FormAssociated as i, FormAssociationController as a, defineFormAssociation as o } from "../../shared/form-association/index.js";
+import { FormAssociated as r, FormAssociationController as i, defineFormAssociation as a } from "../../shared/form-association/index.js";
+import { normalizeNumber as o } from "../../shared/normalize/index.js";
 import { attachDragGesture as s } from "../../shared/gesture/drag-gesture.js";
 import { clamp as c } from "../../shared/gesture/physics.js";
 import l from "./style.js";
@@ -12,9 +12,9 @@ import { classMap as g } from "lit/directives/class-map.js";
 import { styleMap as _ } from "lit/directives/style-map.js";
 //#region src/components/slider/index.ts
 n();
-var v = class extends i(u) {
+var v = class extends r(u) {
 	constructor(...e) {
-		super(...e), this.disabled = !1, this.marks = !1, this.vertical = !1, this.name = "", this.required = !1, this._value = 0, this._min = 0, this._max = 100, this._step = 1, this._dragging = !1, this._pressed = !1, this._dragGestureHandle = null, this._formAssociation = o({
+		super(...e), this.disabled = !1, this.marks = !1, this.vertical = !1, this.name = "", this.required = !1, this._value = 0, this._min = 0, this._max = 100, this._step = 1, this._dragging = !1, this._pressed = !1, this._dragGestureHandle = null, this._formAssociation = a({
 			host: this,
 			initialize: () => {
 				this._value = this._normalizeValue(this._value);
@@ -33,7 +33,7 @@ var v = class extends i(u) {
 			syncValidity: (e) => {
 				typeof e.setValidity == "function" && e.setValidity({});
 			}
-		}).make(), this._formAssociationController = new a(this, this._formAssociation);
+		}).make(), this._formAssociationController = new i(this, this._formAssociation);
 	}
 	static {
 		this.styles = [f(t), f(l)];
@@ -42,26 +42,26 @@ var v = class extends i(u) {
 		return this._value;
 	}
 	set value(e) {
-		let t = r(e, -Infinity, Infinity, 0), n = this._value;
+		let t = o(e, -Infinity, Infinity, 0), n = this._value;
 		this._value = t, this._formAssociation.sync(), this.requestUpdate("value", n);
 	}
 	get min() {
 		return this._min;
 	}
 	set min(e) {
-		this._min = r(e, -Infinity, Infinity, 0);
+		this._min = o(e, -Infinity, Infinity, 0);
 	}
 	get max() {
 		return this._max;
 	}
 	set max(e) {
-		this._max = r(e, -Infinity, Infinity, 100);
+		this._max = o(e, -Infinity, Infinity, 100);
 	}
 	get step() {
 		return this._step;
 	}
 	set step(e) {
-		this._step = r(e, -Infinity, Infinity, 1);
+		this._step = o(e, -Infinity, Infinity, 1);
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback(), this._dragGestureHandle?.destroy(), this._dragGestureHandle = null;

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

@@ -381,6 +381,7 @@ export declare class WebUiSwitch extends WebUiSwitch_base {
     private _maxTravel;
     private _startOffset;
     private _dragGestureHandle;
+    private readonly _fieldId;
     disconnectedCallback(): void;
     private get _isDisabled();
     private readonly _formAssociation;

package/dist/components/switch/index.js

@@ -4,18 +4,19 @@ import t from "../../assets/glass.js";
 import n from "../../icons/generated/lucide-loader-circle.js";
 import { installPointerFocusSuppression as r } from "../../shared/focus/pointer-focus.js";
 import { FormAssociated as i, FormAssociationController as a, defineFormAssociation as o } from "../../shared/form-association/index.js";
-import { attachDragGesture as s } from "../../shared/gesture/drag-gesture.js";
-import { clamp as c, normalizeProgress as l } from "../../shared/gesture/physics.js";
-import u from "./style.js";
-import { LitElement as d, html as f, unsafeCSS as p } from "lit";
-import { customElement as m, property as h, state as g } from "lit/decorators.js";
-import { classMap as _ } from "lit/directives/class-map.js";
-import { styleMap as v } from "lit/directives/style-map.js";
+import { createFieldId as s } from "../../shared/form-association/field-id.js";
+import { attachDragGesture as c } from "../../shared/gesture/drag-gesture.js";
+import { clamp as l, normalizeProgress as u } from "../../shared/gesture/physics.js";
+import d from "./style.js";
+import { LitElement as f, html as p, unsafeCSS as m } from "lit";
+import { customElement as h, property as g, state as _ } from "lit/decorators.js";
+import { classMap as v } from "lit/directives/class-map.js";
+import { styleMap as y } from "lit/directives/style-map.js";
 //#region src/components/switch/index.ts
 r();
-var y = class extends i(d) {
+var b = class extends i(f) {
 	constructor(...e) {
-		super(...e), this._checked = !1, this.name = "", this.value = "", this.disabled = !1, this.required = !1, this.loading = !1, this._pressed = !1, this._isDragging = !1, this._dragOffset = 0, this._dragProgress = 0, this._dragged = !1, this._maxTravel = 20, this._startOffset = 0, this._dragGestureHandle = null, this._formAssociation = o({
+		super(...e), this._checked = !1, this.name = "", this.value = "", this.disabled = !1, this.required = !1, this.loading = !1, this._pressed = !1, this._isDragging = !1, this._dragOffset = 0, this._dragProgress = 0, this._dragged = !1, this._maxTravel = 20, this._startOffset = 0, this._dragGestureHandle = null, this._fieldId = s("web-ui-switch"), this._formAssociation = o({
 			host: this,
 			initialize: () => {
 				this.hasAttribute("checked") && (this._checked = !0);
@@ -33,7 +34,7 @@ var y = class extends i(d) {
 		}).make(), this._formAssociationController = new a(this, this._formAssociation);
 	}
 	static {
-		this.styles = [p(t), p(u)];
+		this.styles = [m(t), m(d)];
 	}
 	get checked() {
 		return this._checked;
@@ -75,13 +76,13 @@ var y = class extends i(d) {
 			let e = t.getBoundingClientRect().width || 40;
 			this._maxTravel = Math.max(1, e - 4 - 20);
 		} else this._maxTravel = 16;
-		this._startOffset = this._checked ? this._maxTravel : 0, this._dragOffset = this._startOffset, this._dragProgress = +!!this._checked, this._dragGestureHandle?.destroy(), this._dragGestureHandle = s(e, {
+		this._startOffset = this._checked ? this._maxTravel : 0, this._dragOffset = this._startOffset, this._dragProgress = +!!this._checked, this._dragGestureHandle?.destroy(), this._dragGestureHandle = c(e, {
 			axis: "x",
 			threshold: 6,
 			onMove: (e) => {
 				this._isDragging = !0;
-				let t = c(this._startOffset + e.deltaX, 0, this._maxTravel);
-				this._dragOffset = t, this._dragProgress = l(t, 0, this._maxTravel), this.requestUpdate();
+				let t = l(this._startOffset + e.deltaX, 0, this._maxTravel);
+				this._dragOffset = t, this._dragProgress = u(t, 0, this._maxTravel), this.requestUpdate();
 			},
 			onEnd: (e) => {
 				let t = this._isDragging;
@@ -122,10 +123,10 @@ var y = class extends i(d) {
 			"wui-glass": this._pressed || this._isDragging,
 			"is-pressed": this._pressed || this._isDragging
 		}, r = this._isDragging ? { "--wui-switch-drag-offset": `${this._dragOffset}px` } : {};
-		return f`
+		return p`
       <label
-        class=${_(e)}
-        style=${v(r)}
+        class=${v(e)}
+        style=${y(r)}
         role="switch"
         aria-checked=${String(this._checked)}
         @click=${this.handleClick}
@@ -135,13 +136,14 @@ var y = class extends i(d) {
         @pointerleave=${this.handlePointerLeave}
       >
         <input
+          id=${this._fieldId}
           type="checkbox"
           .checked=${this._checked}
           ?disabled=${this._isDisabled || this.loading}
           class="sr-only"
         />
-        <div class=${_(t)}>
-          ${this.loading ? f`<div class="wui-switch-loading">
+        <div class=${v(t)}>
+          ${this.loading ? p`<div class="wui-switch-loading">
                   <web-ui-icon .icon=${n} size="14" color="#08f" spin></web-ui-icon>
                 </div>` : ""}
         </div>
@@ -149,20 +151,20 @@ var y = class extends i(d) {
     `;
 	}
 };
-e([g()], y.prototype, "_checked", void 0), e([h({
+e([_()], b.prototype, "_checked", void 0), e([g({
 	type: String,
 	reflect: !0
-})], y.prototype, "name", void 0), e([h({ type: String })], y.prototype, "value", void 0), e([h({
+})], b.prototype, "name", void 0), e([g({ type: String })], b.prototype, "value", void 0), e([g({
 	type: Boolean,
 	reflect: !0
-})], y.prototype, "disabled", void 0), e([h({
+})], b.prototype, "disabled", void 0), e([g({
 	type: Boolean,
 	reflect: !0
-})], y.prototype, "required", void 0), e([h({
+})], b.prototype, "required", void 0), e([g({
 	type: Boolean,
 	reflect: !0
-})], y.prototype, "loading", void 0), e([g()], y.prototype, "_pressed", void 0), e([g()], y.prototype, "_isDragging", void 0), e([g()], y.prototype, "_dragOffset", void 0), e([g()], y.prototype, "_dragProgress", void 0), y = e([m("web-ui-switch")], y);
+})], b.prototype, "loading", void 0), e([_()], b.prototype, "_pressed", void 0), e([_()], b.prototype, "_isDragging", void 0), e([_()], b.prototype, "_dragOffset", void 0), e([_()], b.prototype, "_dragProgress", void 0), b = e([h("web-ui-switch")], b);
 //#endregion
-export { y as WebUiSwitch };
+export { b as WebUiSwitch };
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/switch/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\n\nimport '@/components/icon'\nimport glass from '@/assets/glass.css?inline'\nimport { lucideLoaderCircle } from '@/icons'\nimport { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, normalizeProgress } from '@/shared/gesture/physics'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\n@customElement('web-ui-switch')\nexport class WebUiSwitch extends FormAssociated(LitElement) {\n  static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n  @state() private _checked = false\n\n  get checked(): boolean {\n    return this._checked\n  }\n\n  set checked(v: boolean) {\n    const old = this._checked\n    this._checked = v\n    this._formAssociation.sync()\n    this.requestUpdate('checked', old)\n  }\n\n  @property({ type: String, reflect: true }) name = ''\n  @property({ type: String }) value = ''\n  @property({ type: Boolean, reflect: true }) disabled = false\n  @property({ type: Boolean, reflect: true }) required = false\n  @property({ type: Boolean, reflect: true }) loading = false\n  @state() private _pressed = false\n  @state() private _isDragging = false\n  @state() private _dragOffset = 0\n  @state() private _dragProgress = 0\n\n  private _dragged = false\n  private _maxTravel = 20\n  private _startOffset = 0\n  private _dragGestureHandle: DragGestureHandle | null = null\n\n  override disconnectedCallback() {\n    super.disconnectedCallback()\n    this._dragGestureHandle?.destroy()\n    this._dragGestureHandle = null\n  }\n\n  private get _isDisabled(): boolean {\n    return this.disabled || this._formAssociation.isFormDisabled()\n  }\n\n  private readonly _formAssociation = defineFormAssociation<boolean>({\n    host: this,\n    initialize: () => {\n      if (this.hasAttribute('checked')) this._checked = true\n    },\n    getState: () => this._checked,\n    setState: checked => {\n      this.checked = checked\n    },\n    getFormValue: () => (this._checked ? this.value || 'on' : null),\n    getFormState: () => String(this._checked),\n    restoreState: state => {\n      if (typeof state === 'string') this.checked = state === 'true'\n    },\n    syncValidity: () => this._syncValidity()\n  }).make()\n\n  private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n  private _syncValidity() {\n    const internals = this._formAssociation.getInternals()\n    if (!internals || typeof internals.setValidity !== 'function') return\n    if (this._isDisabled || !this.required || this._checked) internals.setValidity({})\n    else internals.setValidity({ valueMissing: true }, '请启用此项')\n  }\n\n  // 阻止 label 默认行为，避免原生 checkbox 重复触发点击。\n  private handleClick(e: Event) {\n    e.preventDefault()\n    if (this._dragged) {\n      this._dragged = false\n      return\n    }\n    if (this._isDisabled || this.loading) return\n    const old = this._checked\n    this._checked = !old\n    this._formAssociation.sync()\n    this.requestUpdate('checked', old)\n    this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n    this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n  }\n\n  private handlePointerDown(e: PointerEvent) {\n    if (this._isDisabled || this.loading) return\n    this._pressed = true\n\n    const track = this.renderRoot.querySelector<HTMLElement>('.wui-switch-track')\n    if (track) {\n      const trackWidth = track.getBoundingClientRect().width || 40\n      // 拖拽时 thumb 的 pressed 布局盒为 20px（scale(1.5) 视觉放大），因此行程按 20px 布局盒钳制；\n      // 释放后的 checked 静止位移为 20px（16px thumb），两者由 transition 衔接。\n      this._maxTravel = Math.max(1, trackWidth - 4 - 20)\n    } else {\n      this._maxTravel = 16\n    }\n\n    this._startOffset = this._checked ? this._maxTravel : 0\n    this._dragOffset = this._startOffset\n    this._dragProgress = this._checked ? 1 : 0\n\n    this._dragGestureHandle?.destroy()\n    this._dragGestureHandle = attachDragGesture(e, {\n      axis: 'x',\n      threshold: 6,\n      onMove: info => {\n        this._isDragging = true\n        const current = clamp(this._startOffset + info.deltaX, 0, this._maxTravel)\n        this._dragOffset = current\n        this._dragProgress = normalizeProgress(current, 0, this._maxTravel)\n        this.requestUpdate()\n      },\n      onEnd: info => {\n        const wasDragging = this._isDragging\n        this._isDragging = false\n        this._pressed = false\n\n        if (wasDragging) {\n          this._dragged = true\n          let targetChecked = this._checked\n          if (info.velocityX > 300) {\n            targetChecked = true\n          } else if (info.velocityX < -300) {\n            targetChecked = false\n          } else {\n            targetChecked = this._dragProgress >= 0.5\n          }\n\n          if (targetChecked !== this._checked) {\n            const old = this._checked\n            this._checked = targetChecked\n            this._formAssociation.sync()\n            this.requestUpdate('checked', old)\n            this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n            this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n          } else {\n            this.requestUpdate()\n          }\n        }\n      },\n      onCancel: () => {\n        this._isDragging = false\n        this._pressed = false\n        this.requestUpdate()\n      }\n    })\n  }\n\n  private handlePointerUp() {\n    this._pressed = false\n  }\n\n  private handlePointerLeave() {\n    if (!this._isDragging) {\n      this._pressed = false\n    }\n  }\n\n  override render() {\n    const isOpen = this._isDragging ? this._dragProgress >= 0.5 : this._checked\n    const trackCls = {\n      'wui-switch-track': true,\n      'is-open': isOpen,\n      'is-dragging': this._isDragging,\n      'is-disabled': this._isDisabled || this.loading\n    }\n    // wui-glass 条件化：静止态实体白 thumb，按压/拖拽时切换为玻璃（backdrop blur +\n    // 无填充 + 描边）并放大，回到最初修复不跟手问题时期的视觉结构。\n    const thumbCls = {\n      'wui-switch-thumb': true,\n      'wui-glass': this._pressed || this._isDragging,\n      'is-pressed': this._pressed || this._isDragging\n    }\n    const trackStyle = this._isDragging ? { '--wui-switch-drag-offset': `${this._dragOffset}px` } : {}\n\n    return html`\n      <label\n        class=${classMap(trackCls)}\n        style=${styleMap(trackStyle)}\n        role=\"switch\"\n        aria-checked=${String(this._checked)}\n        @click=${this.handleClick}\n        @pointerdown=${this.handlePointerDown}\n        @pointerup=${this.handlePointerUp}\n        @pointercancel=${this.handlePointerUp}\n        @pointerleave=${this.handlePointerLeave}\n      >\n        <input\n          type=\"checkbox\"\n          .checked=${this._checked}\n          ?disabled=${this._isDisabled || this.loading}\n          class=\"sr-only\"\n        />\n        <div class=${classMap(thumbCls)}>\n          ${\n            this.loading\n              ? html`<div class=\"wui-switch-loading\">\n                  <web-ui-icon .icon=${lucideLoaderCircle} size=\"14\" color=\"#08f\" spin></web-ui-icon>\n                </div>`\n              : ''\n          }\n        </div>\n      </label>\n    `\n  }\n\n  declare readonly $events: {\n    input: Event\n    change: Event\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-switch': WebUiSwitch\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/switch/index.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\n\nimport '@/components/icon'\nimport glass from '@/assets/glass.css?inline'\nimport { lucideLoaderCircle } from '@/icons'\nimport { installPointerFocusSuppression } from '@/shared/focus/pointer-focus'\nimport { FormAssociated, defineFormAssociation, FormAssociationController } from '@/shared/form-association'\nimport { createFieldId } from '@/shared/form-association/field-id'\nimport { attachDragGesture, type DragGestureHandle } from '@/shared/gesture/drag-gesture'\nimport { clamp, normalizeProgress } from '@/shared/gesture/physics'\n\nimport style from './style.css?inline'\n\ninstallPointerFocusSuppression()\n\n@customElement('web-ui-switch')\nexport class WebUiSwitch extends FormAssociated(LitElement) {\n  static override styles = [unsafeCSS(glass), unsafeCSS(style)]\n  @state() private _checked = false\n\n  get checked(): boolean {\n    return this._checked\n  }\n\n  set checked(v: boolean) {\n    const old = this._checked\n    this._checked = v\n    this._formAssociation.sync()\n    this.requestUpdate('checked', old)\n  }\n\n  @property({ type: String, reflect: true }) name = ''\n  @property({ type: String }) value = ''\n  @property({ type: Boolean, reflect: true }) disabled = false\n  @property({ type: Boolean, reflect: true }) required = false\n  @property({ type: Boolean, reflect: true }) loading = false\n  @state() private _pressed = false\n  @state() private _isDragging = false\n  @state() private _dragOffset = 0\n  @state() private _dragProgress = 0\n\n  private _dragged = false\n  private _maxTravel = 20\n  private _startOffset = 0\n  private _dragGestureHandle: DragGestureHandle | null = null\n  private readonly _fieldId = createFieldId('web-ui-switch')\n\n  override disconnectedCallback() {\n    super.disconnectedCallback()\n    this._dragGestureHandle?.destroy()\n    this._dragGestureHandle = null\n  }\n\n  private get _isDisabled(): boolean {\n    return this.disabled || this._formAssociation.isFormDisabled()\n  }\n\n  private readonly _formAssociation = defineFormAssociation<boolean>({\n    host: this,\n    initialize: () => {\n      if (this.hasAttribute('checked')) this._checked = true\n    },\n    getState: () => this._checked,\n    setState: checked => {\n      this.checked = checked\n    },\n    getFormValue: () => (this._checked ? this.value || 'on' : null),\n    getFormState: () => String(this._checked),\n    restoreState: state => {\n      if (typeof state === 'string') this.checked = state === 'true'\n    },\n    syncValidity: () => this._syncValidity()\n  }).make()\n\n  private readonly _formAssociationController = new FormAssociationController(this, this._formAssociation)\n\n  private _syncValidity() {\n    const internals = this._formAssociation.getInternals()\n    if (!internals || typeof internals.setValidity !== 'function') return\n    if (this._isDisabled || !this.required || this._checked) internals.setValidity({})\n    else internals.setValidity({ valueMissing: true }, '请启用此项')\n  }\n\n  // 阻止 label 默认行为，避免原生 checkbox 重复触发点击。\n  private handleClick(e: Event) {\n    e.preventDefault()\n    if (this._dragged) {\n      this._dragged = false\n      return\n    }\n    if (this._isDisabled || this.loading) return\n    const old = this._checked\n    this._checked = !old\n    this._formAssociation.sync()\n    this.requestUpdate('checked', old)\n    this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n    this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n  }\n\n  private handlePointerDown(e: PointerEvent) {\n    if (this._isDisabled || this.loading) return\n    this._pressed = true\n\n    const track = this.renderRoot.querySelector<HTMLElement>('.wui-switch-track')\n    if (track) {\n      const trackWidth = track.getBoundingClientRect().width || 40\n      // 拖拽时 thumb 的 pressed 布局盒为 20px（scale(1.5) 视觉放大），因此行程按 20px 布局盒钳制；\n      // 释放后的 checked 静止位移为 20px（16px thumb），两者由 transition 衔接。\n      this._maxTravel = Math.max(1, trackWidth - 4 - 20)\n    } else {\n      this._maxTravel = 16\n    }\n\n    this._startOffset = this._checked ? this._maxTravel : 0\n    this._dragOffset = this._startOffset\n    this._dragProgress = this._checked ? 1 : 0\n\n    this._dragGestureHandle?.destroy()\n    this._dragGestureHandle = attachDragGesture(e, {\n      axis: 'x',\n      threshold: 6,\n      onMove: info => {\n        this._isDragging = true\n        const current = clamp(this._startOffset + info.deltaX, 0, this._maxTravel)\n        this._dragOffset = current\n        this._dragProgress = normalizeProgress(current, 0, this._maxTravel)\n        this.requestUpdate()\n      },\n      onEnd: info => {\n        const wasDragging = this._isDragging\n        this._isDragging = false\n        this._pressed = false\n\n        if (wasDragging) {\n          this._dragged = true\n          let targetChecked = this._checked\n          if (info.velocityX > 300) {\n            targetChecked = true\n          } else if (info.velocityX < -300) {\n            targetChecked = false\n          } else {\n            targetChecked = this._dragProgress >= 0.5\n          }\n\n          if (targetChecked !== this._checked) {\n            const old = this._checked\n            this._checked = targetChecked\n            this._formAssociation.sync()\n            this.requestUpdate('checked', old)\n            this.dispatchEvent(new Event('input', { bubbles: true, composed: true }))\n            this.dispatchEvent(new Event('change', { bubbles: true, composed: true }))\n          } else {\n            this.requestUpdate()\n          }\n        }\n      },\n      onCancel: () => {\n        this._isDragging = false\n        this._pressed = false\n        this.requestUpdate()\n      }\n    })\n  }\n\n  private handlePointerUp() {\n    this._pressed = false\n  }\n\n  private handlePointerLeave() {\n    if (!this._isDragging) {\n      this._pressed = false\n    }\n  }\n\n  override render() {\n    const isOpen = this._isDragging ? this._dragProgress >= 0.5 : this._checked\n    const trackCls = {\n      'wui-switch-track': true,\n      'is-open': isOpen,\n      'is-dragging': this._isDragging,\n      'is-disabled': this._isDisabled || this.loading\n    }\n    // wui-glass 条件化：静止态实体白 thumb，按压/拖拽时切换为玻璃（backdrop blur +\n    // 无填充 + 描边）并放大，回到最初修复不跟手问题时期的视觉结构。\n    const thumbCls = {\n      'wui-switch-thumb': true,\n      'wui-glass': this._pressed || this._isDragging,\n      'is-pressed': this._pressed || this._isDragging\n    }\n    const trackStyle = this._isDragging ? { '--wui-switch-drag-offset': `${this._dragOffset}px` } : {}\n\n    return html`\n      <label\n        class=${classMap(trackCls)}\n        style=${styleMap(trackStyle)}\n        role=\"switch\"\n        aria-checked=${String(this._checked)}\n        @click=${this.handleClick}\n        @pointerdown=${this.handlePointerDown}\n        @pointerup=${this.handlePointerUp}\n        @pointercancel=${this.handlePointerUp}\n        @pointerleave=${this.handlePointerLeave}\n      >\n        <input\n          id=${this._fieldId}\n          type=\"checkbox\"\n          .checked=${this._checked}\n          ?disabled=${this._isDisabled || this.loading}\n          class=\"sr-only\"\n        />\n        <div class=${classMap(thumbCls)}>\n          ${\n            this.loading\n              ? html`<div class=\"wui-switch-loading\">\n                  <web-ui-icon .icon=${lucideLoaderCircle} size=\"14\" color=\"#08f\" spin></web-ui-icon>\n                </div>`\n              : ''\n          }\n        </div>\n      </label>\n    `\n  }\n\n  declare readonly $events: {\n    input: Event\n    change: Event\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'web-ui-switch': WebUiSwitch\n  }\n}\n"],"mappings":"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"}

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

@@ -386,6 +386,7 @@ export declare class WebUiTextarea extends WebUiTextarea_base {
     private _hasSuffix;
     private _textarea;
     private _resizeObserver;
+    private readonly _fieldId;
     get value(): string;
     set value(v: string);
     private get _isDisabled();
@@ -403,8 +404,13 @@ export declare class WebUiTextarea extends WebUiTextarea_base {
     private handleFocus;
     private handleBlur;
     private handleNativeChange;
-    focus(): void;
+    focus(options?: FocusOptions): void;
     blur(): void;
+    /**
+     * 公共 API：全选当前值。
+     *
+     * `disabled` 时与 `focus()` 一致不产生效果；原生控件未渲染时安全 no-op。
+     */
     select(): void;
     private focusTextarea;
     private _onSlotChange;

package/dist/components/textarea/index.js

@@ -2,18 +2,19 @@ import e from "../../_virtual/_@oxc-project_runtime@0.149.0/helpers/esm/decorate
 import "../icon/index.js";
 import t from "../../assets/glass.js";
 import n from "../../icons/generated/jam-close-circle-f.js";
-import "../button/index.js";
 import { FormAssociated as r, FormAssociationController as i, defineFormAssociation as a, forwardInputValidity as o } from "../../shared/form-association/index.js";
-import s from "./style.js";
-import { LitElement as c, html as l, nothing as u, unsafeCSS as d } from "lit";
-import { customElement as f, property as p, state as m } from "lit/decorators.js";
-import { ifDefined as h } from "lit/directives/if-defined.js";
-import { classMap as g } from "lit/directives/class-map.js";
-import { styleMap as _ } from "lit/directives/style-map.js";
+import "../button/index.js";
+import { createFieldId as s } from "../../shared/form-association/field-id.js";
+import c from "./style.js";
+import { LitElement as l, html as u, nothing as d, unsafeCSS as f } from "lit";
+import { customElement as p, property as m, state as h } from "lit/decorators.js";
+import { ifDefined as g } from "lit/directives/if-defined.js";
+import { classMap as _ } from "lit/directives/class-map.js";
+import { styleMap as v } from "lit/directives/style-map.js";
 //#region src/components/textarea/index.ts
-var v = class extends r(c) {
+var y = class extends r(l) {
 	constructor(...e) {
-		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._hasPrefix = !1, this._hasSuffix = !1, this._textarea = null, this._resizeObserver = null, this._formAssociation = a({
+		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._hasPrefix = !1, this._hasSuffix = !1, this._textarea = null, this._resizeObserver = null, this._fieldId = s("web-ui-textarea"), this._formAssociation = a({
 			host: this,
 			getState: () => this._value,
 			setState: (e) => {
@@ -28,7 +29,7 @@ var v = class extends r(c) {
 		}).make(), this._formAssociationController = new i(this, this._formAssociation);
 	}
 	static {
-		this.styles = [d(t), d(s)];
+		this.styles = [f(t), f(c)];
 	}
 	get value() {
 		return this._value;
@@ -80,7 +81,7 @@ var v = class extends r(c) {
 		this._textarea && this.autosize && (this._textarea.style.height = "auto", this._textarea.style.height = `${this._textarea.scrollHeight}px`);
 	}
 	handleInput(e) {
-		e.target instanceof HTMLTextAreaElement && (this._value = e.target.value, this._formAssociation.sync(), this._syncValidity(), this._autosize());
+		this._isDisabled || this.readonly || e.target instanceof HTMLTextAreaElement && (this._value = e.target.value, this._formAssociation.sync(), this._syncValidity(), this._autosize());
 	}
 	handleFocus() {
 		this._isDisabled || (this._focused = !0);
@@ -89,19 +90,19 @@ var v = class extends r(c) {
 		this._focused = !1;
 	}
 	handleNativeChange(e) {
-		e.target instanceof HTMLTextAreaElement && (this._value = e.target.value, this._formAssociation.sync(), this._syncValidity(), this.dispatchEvent(new Event("change", {
+		this._isDisabled || this.readonly || e.target instanceof HTMLTextAreaElement && (this._value = e.target.value, this._formAssociation.sync(), this._syncValidity(), this.dispatchEvent(new Event("change", {
 			bubbles: !0,
 			composed: !0
 		})));
 	}
-	focus() {
-		this.shadowRoot?.querySelector("textarea")?.focus();
+	focus(e) {
+		this._isDisabled || this.shadowRoot?.querySelector("textarea")?.focus(e);
 	}
 	blur() {
 		this.shadowRoot?.querySelector("textarea")?.blur();
 	}
 	select() {
-		this.shadowRoot?.querySelector("textarea")?.select();
+		this._isDisabled || this.shadowRoot?.querySelector("textarea")?.select();
 	}
 	focusTextarea() {
 		this._isDisabled || this.shadowRoot?.querySelector("textarea")?.focus();
@@ -122,28 +123,29 @@ var v = class extends r(c) {
 	}
 	render() {
 		let e = this.clearable && this._value && !this.readonly;
-		return l`
+		return u`
       <div class="wui-glass wui-textarea-inner" @click=${this.focusTextarea}>
-        <slot name="prefix" class=${g({ empty: !this._hasPrefix })} @slotchange=${this._onSlotChange}></slot>
+        <slot name="prefix" class=${_({ empty: !this._hasPrefix })} @slotchange=${this._onSlotChange}></slot>
         <textarea
+          id=${this._fieldId}
           placeholder=${this.placeholder}
           name=${this.name}
-          aria-label=${h(this.ariaLabel)}
-          aria-labelledby=${h(this.ariaLabelledby)}
+          aria-label=${g(this.ariaLabel)}
+          aria-labelledby=${g(this.ariaLabelledby)}
           .rows=${this.rows}
-          minlength=${h(this.minlength)}
-          maxlength=${h(this.maxlength)}
+          minlength=${g(this.minlength)}
+          maxlength=${g(this.maxlength)}
           ?disabled=${this._isDisabled}
           ?readonly=${this.readonly}
           ?required=${this.required}
           .value=${this._value}
-          style=${this.maxHeight > 0 ? _({ "max-height": `${this.maxHeight}px` }) : u}
+          style=${this.maxHeight > 0 ? v({ "max-height": `${this.maxHeight}px` }) : d}
           @input=${this.handleInput}
           @change=${this.handleNativeChange}
           @focus=${this.handleFocus}
           @blur=${this.handleBlur}
         ></textarea>
-        ${e ? l`<web-ui-button
+        ${e ? u`<web-ui-button
                 icon
                 variant="ghost"
                 size="20"
@@ -153,62 +155,62 @@ var v = class extends r(c) {
               >
                 <web-ui-icon .icon=${n} size="14"></web-ui-icon>
               </web-ui-button>` : ""}
-        <slot name="suffix" class=${g({ empty: !this._hasSuffix })} @slotchange=${this._onSlotChange}></slot>
+        <slot name="suffix" class=${_({ empty: !this._hasSuffix })} @slotchange=${this._onSlotChange}></slot>
       </div>
     `;
 	}
 };
-e([p({
+e([m({
 	type: String,
 	reflect: !0
-})], v.prototype, "placeholder", void 0), e([p({
+})], y.prototype, "placeholder", void 0), e([m({
 	type: String,
 	reflect: !0
-})], v.prototype, "name", void 0), e([p({
+})], y.prototype, "name", void 0), e([m({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "disabled", void 0), e([p({
+})], y.prototype, "disabled", void 0), e([m({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "readonly", void 0), e([p({
+})], y.prototype, "readonly", void 0), e([m({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "required", void 0), e([p({
+})], y.prototype, "required", void 0), e([m({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "full", void 0), e([p({
+})], y.prototype, "full", void 0), e([m({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "clearable", void 0), e([p({
+})], y.prototype, "clearable", void 0), e([m({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "borderless", void 0), e([p({
+})], y.prototype, "borderless", void 0), e([m({
 	type: Number,
 	reflect: !0
-})], v.prototype, "rows", void 0), e([p({
+})], y.prototype, "rows", void 0), e([m({
 	type: Number,
 	reflect: !0
-})], v.prototype, "minlength", void 0), e([p({
+})], y.prototype, "minlength", void 0), e([m({
 	type: Number,
 	reflect: !0
-})], v.prototype, "maxlength", void 0), e([p({
+})], y.prototype, "maxlength", void 0), e([m({
 	type: Boolean,
 	reflect: !0
-})], v.prototype, "autosize", void 0), e([p({
+})], y.prototype, "autosize", void 0), e([m({
 	type: Number,
 	reflect: !0,
 	attribute: "max-height"
-})], v.prototype, "maxHeight", void 0), e([p({
+})], y.prototype, "maxHeight", void 0), e([m({
 	type: String,
 	attribute: "aria-label"
-})], v.prototype, "ariaLabel", void 0), e([p({
+})], y.prototype, "ariaLabel", void 0), e([m({
 	type: String,
 	attribute: "aria-labelledby"
-})], v.prototype, "ariaLabelledby", void 0), e([m()], v.prototype, "_value", void 0), e([m()], v.prototype, "_focused", void 0), e([m()], v.prototype, "_hasPrefix", void 0), e([m()], v.prototype, "_hasSuffix", void 0), e([p({
+})], y.prototype, "ariaLabelledby", void 0), e([h()], y.prototype, "_value", void 0), e([h()], y.prototype, "_focused", void 0), e([h()], y.prototype, "_hasPrefix", void 0), e([h()], y.prototype, "_hasSuffix", void 0), e([m({
 	type: String,
 	reflect: !0
-})], v.prototype, "value", null), v = e([f("web-ui-textarea")], v);
+})], y.prototype, "value", null), y = e([p("web-ui-textarea")], y);
 //#endregion
-export { v as WebUiTextarea };
+export { y as WebUiTextarea };
 
 //# sourceMappingURL=index.js.map