vintage-frames 0.13.0 → 0.14.1

package/dist/components/vf-desktop.js

@@ -1,25 +1,25 @@
 import { emit as e } from "../events.js";
 import { vfElement as t } from "../define.js";
-import { ScaleController as n, effectiveScale as r, sysLength as i } from "../scale.js";
-import a from "../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorate.js";
-import { VfPositioned as o, placementIn as s } from "../position.js";
-import { vfBase as c } from "../styles/recipes/host.js";
-import { tileImage as l, tileRects as u, tileSpan as d } from "../styles/recipes/tile.js";
-import { patternOverride as f, tileGrid as p, vfTileGrid as m } from "../tile-grid.js";
-import { PATTERNS as h, parsePattern as g, patternMotif as _ } from "../patterns.js";
-import { PatternFillController as v, vfPatternFill as y } from "../pattern-fill.js";
-import { GridSnapController as b } from "../grid-snap.js";
-import { DocumentListenersController as x } from "../document-listeners.js";
-import { SCREEN_CORNER as S, steppedCornerClip as C } from "../pixel-frame.js";
-import { LitElement as w, css as T, html as E, unsafeCSS as D } from "lit";
-import { property as O, query as k, queryAssignedElements as A } from "lit/decorators.js";
+import { ScaleController as n, effectiveScale as r, sysLength as i, systemPxQuantum as a } from "../scale.js";
+import o from "../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorate.js";
+import { VfPositioned as s, placementIn as c } from "../position.js";
+import { vfBase as l } from "../styles/recipes/host.js";
+import { tileImage as u, tileRects as d, tileSpan as f } from "../styles/recipes/tile.js";
+import { patternOverride as p, tileGrid as m, vfTileGrid as h } from "../tile-grid.js";
+import { PATTERNS as g, parsePattern as _, patternMotif as v } from "../patterns.js";
+import { PatternFillController as y, vfPatternFill as b } from "../pattern-fill.js";
+import { GridSnapController as x } from "../grid-snap.js";
+import { DocumentListenersController as S } from "../document-listeners.js";
+import { SCREEN_CORNER as C, steppedCornerClip as w } from "../pixel-frame.js";
+import { LitElement as T, css as E, html as D, unsafeCSS as O } from "lit";
+import { property as k, query as A, queryAssignedElements as j } from "lit/decorators.js";
 //#region src/components/vf-desktop.ts
-var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I], "#000000", "#ffffff"), R = l(L.width, L.height, u(L.rects)), z = d(L.width), B = class extends o(w) {
+var M = 1e6, N = 2 * M, P = 2000001, F = 512, I = 342, L = "gray-50", R = v(g[L], "#000000", "#ffffff"), z = u(R.width, R.height, d(R.rects)), B = f(R.width), V = (e) => Number(e.style.zIndex) || 0, H = class extends s(T) {
 	constructor(...e) {
-		super(...e), this.width = P, this.height = F, this.bezel = 0, this.pattern = I, this.scale = new n(this), this.gridSnap = new b(this), this._token = "", this._desktopPattern = h[I], this.#e = !1, this.patternFill = new v(this, {
+		super(...e), this.width = F, this.height = I, this.bezel = 0, this.pattern = L, this.scale = new n(this), this.gridSnap = new x(this), this._token = "", this._desktopPattern = g[L], this.#e = !1, this.patternFill = new y(this, {
 			getBox: () => this.screen,
 			getPattern: () => this._token ? null : this._desktopPattern
-		}), this._zCounter = 0, this._activeWindow = null, this._deactivated = !1, this._awaitingUpgrade = !1, this._pointerGesture = !1, this._restoringFocus = !1, this._domSyncTimer = 0, this._gestureEnd = new x(this, () => [[
+		}), this._zCounter = 0, this._activeWindow = null, this._deactivated = !1, this._awaitingUpgrade = !1, this.#t = new MutationObserver(() => this._resolveActive()), this._pointerGesture = !1, this._restoringFocus = !1, this._domSyncTimer = 0, this._gestureEnd = new S(this, () => [[
 			document,
 			"pointerup",
 			this._onGestureEnd,
@@ -38,6 +38,15 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
 		}, this._onDragSurfaceRequest = (e) => {
 			let t = e.detail;
 			!t || t.surface || (t.surface = this.dragSurface);
+		}, this._onBoundsRequest = (e) => {
+			let t = e.detail, n = e.target;
+			if (!t || t.bounds || !(n instanceof HTMLElement) || n.offsetParent !== this) return;
+			let r = n.localName === "vf-window" ? this.windowArea : this.workArea, i = a(n);
+			t.bounds = {
+				width: r.left + r.width,
+				height: r.top + r.height,
+				top: Math.ceil(r.top / i) * i
+			};
 		}, this._onFocusIn = (e) => {
 			if (this._restoringFocus) return;
 			let t = this._windowFromEvent(e);
@@ -46,10 +55,10 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
 	}
 	static {
 		this.styles = [
-			c,
-			m,
-			y,
-			T`
+			l,
+			h,
+			b,
+			E`
       :host {
         display: block;
         position: relative;
@@ -110,7 +119,7 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
         position: absolute;
         inset: 0;
         z-index: -1;
-        --_vf-tile-image: var(--vf-desktop-pattern, ${D(R)});
+        --_vf-tile-image: var(--vf-desktop-pattern, ${O(z)});
         /* Forced colors: hidden with the pattern, same posture. */
         @media (forced-colors: active) {
           display: none;
@@ -142,7 +151,7 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
       ::slotted(vf-menu-bar),
       ::slotted(vf-menu) {
         position: relative;
-        z-index: ${M};
+        z-index: ${N};
       }
       /* The drag surface (see the class doc): the box an icon's outline is
          positioned in — the screen's own, bezel excluded — clipped with
@@ -158,7 +167,7 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
         pointer-events: none;
       }
       .drag-surface > * {
-        z-index: ${N};
+        z-index: ${P};
       }
       /* With a bezel, the screen's four corners wear the SCREEN_CORNER mask,
          rounding into the surrounding black; the bottom pair is the same
@@ -169,8 +178,8 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
          maximal z-index. */
       .corner {
         position: absolute;
-        width: calc(var(--vf-scale, 1) * ${S[0]}px);
-        height: calc(var(--vf-scale, 1) * ${S.length}px);
+        width: calc(var(--vf-scale, 1) * ${C[0]}px);
+        height: calc(var(--vf-scale, 1) * ${C.length}px);
         background: var(--vf-black, #000);
         pointer-events: none;
         z-index: 2147483647;
@@ -178,26 +187,43 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
       .corner.tl {
         top: 0;
         left: 0;
-        clip-path: ${D(C(S, "left"))};
+        clip-path: ${O(w(C, "left"))};
       }
       .corner.tr {
         top: 0;
         right: 0;
-        clip-path: ${D(C(S, "right"))};
+        clip-path: ${O(w(C, "right"))};
       }
       .corner.bl {
         bottom: 0;
         left: 0;
-        clip-path: ${D(C(S, "left", "bottom"))};
+        clip-path: ${O(w(C, "left", "bottom"))};
       }
       .corner.br {
         bottom: 0;
         right: 0;
-        clip-path: ${D(C(S, "right", "bottom"))};
+        clip-path: ${O(w(C, "right", "bottom"))};
       }
     `
 		];
 	}
+	get workArea() {
+		let e = this.width ?? F, t = this.height ?? I, n = Math.min(t, this._menuBarFloor());
+		return {
+			left: 0,
+			top: n,
+			width: e,
+			height: t - n
+		};
+	}
+	get windowArea() {
+		let e = this.workArea, t = Math.min(e.top + e.height, Math.max(e.top, this.windowTop ?? 0));
+		return {
+			...e,
+			top: t,
+			height: e.top + e.height - t
+		};
+	}
 	fitWithin(e, t) {
 		let n = r(this), i = (e) => Math.max(0, Math.floor(e / n + 1e-6) - 2 * this.bezel);
 		return this.width = i(e), this.height = i(t), {
@@ -206,17 +232,18 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
 		};
 	}
 	placementAt(e, t, n) {
-		return s(this.screen ?? this, e, t, this, n);
+		return c(this.screen ?? this, e, t, this, n);
 	}
 	#e;
+	#t;
 	connectedCallback() {
-		super.connectedCallback(), this.addEventListener("pointerdown", this._onPointerDown), this.addEventListener("focusin", this._onFocusIn), this.addEventListener("vf-drag-surface-request", this._onDragSurfaceRequest);
+		super.connectedCallback(), this.addEventListener("pointerdown", this._onPointerDown), this.addEventListener("focusin", this._onFocusIn), this.addEventListener("vf-drag-surface-request", this._onDragSurfaceRequest), this.addEventListener("vf-placement-bounds-request", this._onBoundsRequest), this.hasUpdated && this._observeWindows();
 	}
 	disconnectedCallback() {
-		this.removeEventListener("pointerdown", this._onPointerDown), this.removeEventListener("focusin", this._onFocusIn), this.removeEventListener("vf-drag-surface-request", this._onDragSurfaceRequest), this._pointerGesture = !1, this._domSyncTimer &&= (clearTimeout(this._domSyncTimer), 0), super.disconnectedCallback();
+		this.removeEventListener("pointerdown", this._onPointerDown), this.removeEventListener("focusin", this._onFocusIn), this.removeEventListener("vf-drag-surface-request", this._onDragSurfaceRequest), this.removeEventListener("vf-placement-bounds-request", this._onBoundsRequest), this.#t.disconnect(), this._pointerGesture = !1, this._domSyncTimer &&= (clearTimeout(this._domSyncTimer), 0), super.disconnectedCallback();
 	}
 	_isUtility(e) {
-		return e.getAttribute("variant") === "utility";
+		return ("variant" in e ? e.variant : e.getAttribute("variant")) === "utility";
 	}
 	bringToFront(e) {
 		this._restack(e), this._requestDomSync();
@@ -224,12 +251,15 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
 	get activeWindow() {
 		return this._activeWindow;
 	}
+	get stackingOrder() {
+		return [...this._windows].sort((e, t) => V(e) - V(t));
+	}
 	clearActive() {
 		this._deactivated = !0, this._setActive(null);
 	}
 	_restack(e) {
 		let t = this._isUtility(e);
-		e.style.zIndex = String(++this._zCounter + (t ? j : 0)), t || this._setActive(e);
+		e.style.zIndex = String(++this._zCounter + (t ? M : 0)), !t && !e.hidden && this._setActive(e);
 	}
 	_requestDomSync() {
 		this._pointerGesture || this._domSyncTimer || (this._domSyncTimer = window.setTimeout(() => {
@@ -237,27 +267,47 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
 		}, 0));
 	}
 	_raise(e) {
-		let t = this._isUtility(e), n = this._windows.filter((e) => this._isUtility(e) === t);
+		let t = this._isUtility(e), n = this._windows.filter((e) => this._isUtility(e) === t && !e.hidden);
 		this._topmost(n) === e && (t || e.hasAttribute("active")) || this._restack(e);
 	}
+	_menuBarFloor() {
+		let e = this.screen;
+		if (!e) return 0;
+		let t = [...this.children].find((e) => e.localName === "vf-menu-bar" && !e.hidden);
+		if (!t) return 0;
+		let n = t.getBoundingClientRect();
+		if (n.height <= 0) return 0;
+		let i = e.getBoundingClientRect(), a = r(this);
+		return Math.round((n.top - i.top) / a) > 0 ? 0 : Math.max(0, Math.round((n.bottom - i.top) / a));
+	}
 	_windowFromEvent(e) {
 		let t = this._windows;
 		return e.composedPath().find((e) => e instanceof HTMLElement && t.includes(e));
 	}
 	_onSlotChange() {
-		let e = this._windows, t = null;
+		let e = this._windows;
+		this._observeWindows();
+		let t = null;
 		for (let n of e) if (!n.style.zIndex) {
 			let e = this._isUtility(n);
-			n.style.zIndex = String(++this._zCounter + (e ? j : 0)), e || (t = n);
+			n.style.zIndex = String(++this._zCounter + (e ? M : 0)), !e && !n.hidden && (t = n);
 		}
-		let n = e.filter((e) => !this._isUtility(e)), r = this._activeWindow && n.includes(this._activeWindow) ? this._activeWindow : null;
-		this._setActive(t ?? r ?? (this._deactivated ? null : this._topmost(n))), customElements.get("vf-window") || this._normalizeAfterUpgrade();
+		t ? this._setActive(t) : this._resolveActive(), customElements.get("vf-window") || this._normalizeAfterUpgrade();
+	}
+	_resolveActive() {
+		let e = this._windows.filter((e) => !this._isUtility(e) && !e.hidden), t = this._activeWindow && e.includes(this._activeWindow) ? this._activeWindow : null;
+		this._setActive(t ?? (this._deactivated ? null : this._topmost(e)));
+	}
+	_observeWindows() {
+		this.#t.takeRecords(), this.#t.disconnect();
+		for (let e of this._windows) this.#t.observe(e, {
+			attributes: !0,
+			attributeFilter: ["hidden"]
+		});
 	}
 	_normalizeAfterUpgrade() {
 		this._awaitingUpgrade || (this._awaitingUpgrade = !0, customElements.whenDefined("vf-window").then(() => {
-			if (this._awaitingUpgrade = !1, !this.isConnected) return;
-			let e = this._windows.filter((e) => !this._isUtility(e)), t = this._activeWindow && e.includes(this._activeWindow) ? this._activeWindow : null;
-			this._setActive(t ?? (this._deactivated ? null : this._topmost(e)));
+			this._awaitingUpgrade = !1, this.isConnected && this._resolveActive();
 		}));
 	}
 	_setActive(t) {
@@ -274,7 +324,7 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
 	_topmost(e) {
 		let t = null, n = -Infinity;
 		for (let r of e) {
-			let e = Number(r.style.zIndex) || 0;
+			let e = V(r);
 			e >= n && (n = e, t = r);
 		}
 		return t;
@@ -288,31 +338,39 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
 		if (!this.isConnected) return;
 		let e = this._windows;
 		if (e.length < 2) return;
-		let t = [...e].sort((e, t) => (Number(e.style.zIndex) || 0) - (Number(t.style.zIndex) || 0)), n = this._deepActiveElement(), r = !1, i = null;
-		for (let e of t) i && i.compareDocumentPosition(e) & Node.DOCUMENT_POSITION_PRECEDING && (this.insertBefore(e, i.nextSibling), r = !0), i = e;
+		let t = [...e].sort((e, t) => V(e) - V(t)), n = this._deepActiveElement(), r = !1, i = null;
+		for (let e of t) i && i.compareDocumentPosition(e) & Node.DOCUMENT_POSITION_PRECEDING && (this._move(e, i.nextSibling), r = !0), i = e;
 		r && n instanceof HTMLElement && n.isConnected && this._deepActiveElement() !== n && (this._restoringFocus = !0, n.focus({ preventScroll: !0 }), this._restoringFocus = !1);
 	}
+	_move(e, t) {
+		let n = this;
+		if (typeof n.moveBefore == "function") try {
+			n.moveBefore(e, t);
+			return;
+		} catch {}
+		this.insertBefore(e, t);
+	}
 	willUpdate(e) {
-		if (super.willUpdate(e), this._token = f(this, "--vf-desktop-pattern"), e.has("pattern")) {
-			let e = g(this.pattern);
-			e === null && this.pattern?.trim() && !this.#e && (this.#e = !0, console.warn(`vf-desktop: unknown pattern "${this.pattern}" — a library name (docs/PATTERNS.md) or sixteen hex digits. Keeping ${I}.`)), this._desktopPattern = e ?? h[I];
+		if (super.willUpdate(e), this._token = p(this, "--vf-desktop-pattern"), e.has("pattern")) {
+			let e = _(this.pattern);
+			e === null && this.pattern?.trim() && !this.#e && (this.#e = !0, console.warn(`vf-desktop: unknown pattern "${this.pattern}" — a library name (docs/PATTERNS.md) or sixteen hex digits. Keeping ${L}.`)), this._desktopPattern = e ?? g[L];
 		}
 	}
 	updated(e) {
 		if (e.has("bezel") && (this.bezel > 0 ? this.style.setProperty("--vf-desktop-bezel", i(this.bezel)) : this.style.removeProperty("--vf-desktop-bezel")), e.has("width") || e.has("height") || e.has("bezel")) {
-			let e = this.width ?? P, t = this.height ?? F;
+			let e = this.width ?? F, t = this.height ?? I;
 			this.style.width = i(e + 2 * this.bezel), this.style.height = i(t + 2 * this.bezel);
 		}
 	}
 	render() {
-		let e = this.width ?? P, t = this.height ?? F, n = this._token ? E`<div class="vf-tile-grid">
-          ${p({
-			cols: Math.ceil(e / z),
-			rows: Math.ceil(t / z),
-			tile: z
+		let e = this.width ?? F, t = this.height ?? I, n = this._token ? D`<div class="vf-tile-grid">
+          ${m({
+			cols: Math.ceil(e / B),
+			rows: Math.ceil(t / B),
+			tile: B
 		})}
         </div>` : null;
-		return E`
+		return D`
       <div class=${this.bezel > 0 ? "desktop vf-snap bezeled" : "desktop vf-snap"}>
         <div
           class="screen vf-pattern-fill${this._token ? "" : " vf-patterned"}"
@@ -321,7 +379,7 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
           ${n}
           <slot @slotchange=${this._onSlotChange}></slot>
           <div class="drag-surface"></div>
-          ${this.bezel > 0 ? E`<div class="corner tl"></div>
+          ${this.bezel > 0 ? D`<div class="corner tl"></div>
                 <div class="corner tr"></div>
                 <div class="corner bl"></div>
                 <div class="corner br"></div>` : null}
@@ -330,6 +388,9 @@ var j = 1e6, M = 2 * j, N = 2000001, P = 512, F = 342, I = "gray-50", L = _(h[I]
     `;
 	}
 };
-a([O({ type: Number })], B.prototype, "width", void 0), a([O({ type: Number })], B.prototype, "height", void 0), a([O({ type: Number })], B.prototype, "bezel", void 0), a([O()], B.prototype, "pattern", void 0), a([A({ selector: "vf-window" })], B.prototype, "_windows", void 0), a([k(".screen")], B.prototype, "screen", void 0), a([k(".drag-surface")], B.prototype, "dragSurface", void 0), B = a([t("vf-desktop")], B);
+o([k({ type: Number })], H.prototype, "width", void 0), o([k({ type: Number })], H.prototype, "height", void 0), o([k({ type: Number })], H.prototype, "bezel", void 0), o([k()], H.prototype, "pattern", void 0), o([k({
+	type: Number,
+	attribute: "window-top"
+})], H.prototype, "windowTop", void 0), o([j({ selector: "vf-window" })], H.prototype, "_windows", void 0), o([A(".screen")], H.prototype, "screen", void 0), o([A(".drag-surface")], H.prototype, "dragSurface", void 0), H = o([t("vf-desktop")], H);
 //#endregion
-export { B as VfDesktop };
+export { H as VfDesktop };

package/dist/components/vf-fieldset.js

@@ -4,40 +4,48 @@ import n from "../_virtual/_@oxc-project_runtime@0.143.0/helpers/esm/decorate.js
 import { VfPositioned as r } from "../position.js";
 import { vfDisplayDecls as i } from "../styles/recipes/display-face.js";
 import { vfBase as a } from "../styles/recipes/host.js";
-import { GridSnapController as o } from "../grid-snap.js";
-import { LitElement as s, css as c, html as l, nothing as u } from "lit";
-import { property as d, state as f } from "lit/decorators.js";
-import { classMap as p } from "lit/directives/class-map.js";
+import { vfStrokeDecls as o, vfStrokeInset as s } from "../styles/recipes/stroke.js";
+import { GridSnapController as c } from "../grid-snap.js";
+import { LitElement as l, css as u, html as d, nothing as f } from "lit";
+import { property as p, state as m } from "lit/decorators.js";
+import { classMap as h } from "lit/directives/class-map.js";
 //#region src/components/vf-fieldset.ts
-var m = class extends r(s) {
+var g = class extends r(l) {
 	constructor(...e) {
-		super(...e), this.scale = new t(this), this.gridSnap = new o(this), this.legend = "", this._hasSlottedLegend = !1;
+		super(...e), this.scale = new t(this), this.gridSnap = new c(this), this.legend = "", this._hasSlottedLegend = !1;
 	}
 	static {
-		this.styles = [a, c`
+		this.styles = [a, u`
       :host {
         display: block;
       }
       .fieldset {
         position: relative;
-        border: calc(var(--vf-scale, 1) * 1px) solid var(--vf-black, #000);
+        margin-top: calc(var(--vf-scale, 1) * 8px);
+        ${o()}
+      }
+      /* The rule is a stroke, so the box's own padding box runs under it: the
+         slot is the box inside it, where the content sits 14/12/10px in and
+         children placed with top/left measure from the rule's inner edge. */
+      .fieldset > slot {
+        display: block;
+        position: relative;
         padding: calc(var(--vf-scale, 1) * 14px) calc(var(--vf-scale, 1) * 12px)
           calc(var(--vf-scale, 1) * 10px);
-        margin-top: calc(var(--vf-scale, 1) * 8px);
       }
       .legend {
         /* Chicago-style legend (chrome); grouped content keeps the body face. */
         ${i}
         position: absolute;
-        /* Whole system px like every other length here. Authored as -0.7em
-           this was 11.2px against the 16px display face — off the device grid
-           at every scale, and it took a slotted legend with it (verify:grid).
-           11 keeps the legend straddling the border, a fifth of a system px
-           lower. */
-        top: calc(var(--vf-scale, 1) * -11px);
-        left: calc(var(--vf-scale, 1) * 8px);
+        /* Whole system px like every other length here, measured from the
+           rule's inner edge. Authored as -0.7em this was 11.2px against the
+           16px display face — off the device grid at every scale, and it took
+           a slotted legend with it (verify:grid). 11 keeps the legend
+           straddling the rule, a fifth of a system px lower. */
+        top: ${s(-11)};
+        left: ${s(8)};
         padding: 0 calc(var(--vf-scale, 1) * 5px);
-        /* Punches through the border, matching the surface behind it. */
+        /* Punches through the rule, matching the surface behind it. */
         background: var(--vf-surface, var(--vf-white, #fff));
         white-space: nowrap;
       }
@@ -48,16 +56,16 @@ var m = class extends r(s) {
 	}
 	render() {
 		let e = !this.legend && !this._hasSlottedLegend;
-		return l`
+		return d`
       <div
         class="fieldset vf-snap"
         part="fieldset"
         role="group"
-        aria-labelledby=${e ? u : "legend"}
+        aria-labelledby=${e ? f : "legend"}
       >
         <span
           id="legend"
-          class=${p({
+          class=${h({
 			legend: !0,
 			empty: e
 		})}
@@ -76,6 +84,6 @@ var m = class extends r(s) {
 		this._hasSlottedLegend = t.assignedNodes({ flatten: !0 }).length > 0;
 	}
 };
-n([d()], m.prototype, "legend", void 0), n([f()], m.prototype, "_hasSlottedLegend", void 0), m = n([e("vf-fieldset")], m);
+n([p()], g.prototype, "legend", void 0), n([m()], g.prototype, "_hasSlottedLegend", void 0), g = n([e("vf-fieldset")], g);
 //#endregion
-export { m as VfFieldset };
+export { g as VfFieldset };

package/dist/components/vf-icon-field.d.ts

@@ -67,7 +67,7 @@ declare const VfIconField_base: (new (...args: any[]) => import("../size.js").Vf
  * the pointer, and the selection follows it live by the Finder's one rule:
  * **an icon is selected exactly when it was selected at the press XOR the
  * rectangle touches it.** The press fixes that anchor: a plain press has
- * already cleared everything (the way any press outside an icon does), so
+ * already cleared everything (a press on a field's background does), so
  * the rectangle simply selects what it touches and releases what it leaves;
  * with Shift or ⌘ held the selection survives the press and the rectangle
  * *toggles* against it — an icon already selected deselects while the