@threadlabs/looma 0.33.1 → 0.35.0

package/vue/editor/index.js

@@ -11,7 +11,7 @@ import "@tiptap/pm/tables";
 import { DOMParser, DOMSerializer, Fragment as Fragment$1, Slice } from "@tiptap/pm/model";
 import "@tiptap/pm/transform";
 import { closeHistory } from "@tiptap/pm/history";
-import { IndexedList, NONCONFORMING, READY_INPUT, UNRESOLVED_INPUT, acceptProps, activateModule, armElement, attachGeneratedController, awaitInput, buildTemplate, checkBoolean, checkConstrained, checkFormat, checkInteger, checkNumber, checkObject, checkSelected, checkString, clearRegion, computedCycle, defineComponent as defineComponent$1, detailCheck, dispatchDeclared, dispose, evaluateInput, fillSlot, formatOf, generatedInputs, hostState, inputRead, keywordFormat, manageProps, notifyPropertySet, project, readIndex, readMember, readonlyView, readsChanged, rec, replaceRoot, textCall, toAttribute, toText, trackContainer, truthy, writeAttribute, writeUrlAttribute } from "@nextwebwg/html-next/generated-runtime";
+import { IndexedList, NONCONFORMING, READY_INPUT, UNRESOLVED_INPUT, acceptProps, activateModule, armElement, attachGeneratedController, awaitInput, buildTemplate, checkBoolean, checkConstrained, checkFormat, checkInteger, checkNumber, checkObject, checkSelected, checkString, clearRegion, computedCycle, defineComponent as defineComponent$1, detailCheck, dispatchDeclared, dispose, evaluateInput, fillSlot, formatOf, generatedInputs, hostState, inputRead, keywordFormat, manageProps, notifyPropertySet, project, readIndex, readMember, readonlyView, readsChanged, rec, recordValue, replaceRoot, textCall, toAttribute, toText, trackContainer, truthy, writeAttribute, writeUrlAttribute } from "@nextwebwg/html-next/generated-runtime";
 export * from "@threadlabs/looma/editor";
 //#region \0rolldown/runtime.js
 var __defProp = Object.defineProperty;
@@ -114,6 +114,29 @@ function createFileUploads(options) {
 	};
 }
 //#endregion
+//#region src/components/shared/surface-material.js
+var roleWeight$1 = Object.freeze({
+	tooltip: .08,
+	menu: .28,
+	popover: .55,
+	dialog: 1,
+	panel: .65
+});
+/** Derive a bounded material scale from a surface's purpose and rendered border box. */
+function surfaceMaterialScale$1(role, width, height) {
+	if (!Object.hasOwn(roleWeight$1, role)) throw new Error(`Unknown surface material role: ${role}`);
+	const size = [width, height].every((value) => Number.isFinite(value) && value > 0) ? Math.max(.8, Math.min(1.35, Math.sqrt(width * height / 76800))) : 1;
+	return Math.round(roleWeight$1[role] * size * 1e3) / 1e3;
+}
+/** Update component-owned material geometry; a tolerance prevents its rim feeding tiny resize changes back into itself. */
+function updateSurfaceMaterial$1(element, role) {
+	const width = element.offsetWidth;
+	const height = element.offsetHeight;
+	const next = surfaceMaterialScale$1(role, width, height);
+	const previous = Number.parseFloat(element.style.getPropertyValue("--_ui-material-scale"));
+	if (!Number.isFinite(previous) || Math.abs(next - previous) >= Math.max(.002, Math.abs(previous) * .04)) element.style.setProperty("--_ui-material-scale", String(next));
+}
+//#endregion
 //#region src/components/shared/overlay.js
 function stateFor$1(document) {
 	const key = Symbol.for("@threadlabs/looma/overlay-stack/v1");
@@ -468,7 +491,10 @@ function createViewportSurface$1(surface, options = {}) {
 	let frame = null;
 	const position = () => {
 		frame = null;
-		if (stop) options.position?.();
+		if (stop) {
+			if (options.materialRole) updateSurfaceMaterial$1(surface, options.materialRole);
+			options.position?.();
+		}
 	};
 	const refresh = () => {
 		if (stop && frame === null) frame = owner.requestAnimationFrame(position);
@@ -511,6 +537,7 @@ function createViewportSurface$1(surface, options = {}) {
 		show() {
 			if (destroyed) return;
 			show$1(surface);
+			if (options.materialRole) updateSurfaceMaterial$1(surface, options.materialRole);
 			stop ??= observeOverlayViewport$1(surface.ownerDocument, position);
 			options.position?.();
 			if (!sizeObserver && owner.ResizeObserver) {
@@ -596,7 +623,8 @@ function createAnchoredSurface$1(surface, options = {}) {
 	surface.style.setProperty("margin", "0", "important");
 	const presentation = createViewportSurface$1(surface, {
 		position,
-		bare: options.bare
+		bare: options.bare,
+		materialRole: options.materialRole
 	});
 	const trackAnchor = () => {
 		anchorFrame = null;
@@ -3449,10 +3477,12 @@ var P17$1;
 var P18$1;
 var P19$1;
 var S$18 = {
-	n: [],
-	t: [],
+	n: ["appearance", "colorTone"],
+	t: ["?", "?"],
 	f: import.meta.url,
 	g: "ui-button",
+	k: 0,
+	r: readonlyView,
 	a: (host, I) => C$11(host, I),
 	b: generatedInputs
 };
@@ -3471,6 +3501,7 @@ var A$3 = [
 			"data-ui-button-prop-href",
 			"data-ui-button-prop-loading",
 			"data-ui-button-prop-pending",
+			"data-ui-button-prop-preset",
 			"data-ui-button-prop-rel",
 			"data-ui-button-prop-shape",
 			"data-ui-button-prop-size",
@@ -3479,6 +3510,8 @@ var A$3 = [
 			"data-ui-button-prop-tone",
 			"data-ui-button-prop-type",
 			"data-ui-button-prop-variant",
+			"data-appearance",
+			"data-tone",
 			"href",
 			"target",
 			"rel",
@@ -3501,6 +3534,7 @@ var A$3 = [
 			"data-ui-button-prop-href",
 			"data-ui-button-prop-loading",
 			"data-ui-button-prop-pending",
+			"data-ui-button-prop-preset",
 			"data-ui-button-prop-rel",
 			"data-ui-button-prop-shape",
 			"data-ui-button-prop-size",
@@ -3509,6 +3543,8 @@ var A$3 = [
 			"data-ui-button-prop-tone",
 			"data-ui-button-prop-type",
 			"data-ui-button-prop-variant",
+			"data-appearance",
+			"data-tone",
 			"type",
 			"disabled",
 			"aria-disabled",
@@ -3529,6 +3565,7 @@ var A$3 = [
 			"data-ui-button-prop-href",
 			"data-ui-button-prop-loading",
 			"data-ui-button-prop-pending",
+			"data-ui-button-prop-preset",
 			"data-ui-button-prop-rel",
 			"data-ui-button-prop-shape",
 			"data-ui-button-prop-size",
@@ -3537,6 +3574,8 @@ var A$3 = [
 			"data-ui-button-prop-tone",
 			"data-ui-button-prop-type",
 			"data-ui-button-prop-variant",
+			"data-appearance",
+			"data-tone",
 			"href",
 			"target",
 			"rel",
@@ -3559,6 +3598,7 @@ var A$3 = [
 			"data-ui-button-prop-href",
 			"data-ui-button-prop-loading",
 			"data-ui-button-prop-pending",
+			"data-ui-button-prop-preset",
 			"data-ui-button-prop-rel",
 			"data-ui-button-prop-shape",
 			"data-ui-button-prop-size",
@@ -3567,6 +3607,8 @@ var A$3 = [
 			"data-ui-button-prop-tone",
 			"data-ui-button-prop-type",
 			"data-ui-button-prop-variant",
+			"data-appearance",
+			"data-tone",
 			"type",
 			"disabled",
 			"aria-disabled",
@@ -3632,6 +3674,21 @@ var D$18 = {
 			j: 0,
 			m: "b"
 		},
+		"preset": {
+			"required": false,
+			"values": [
+				"none",
+				"primary",
+				"standard",
+				"quiet",
+				"destructive"
+			],
+			"default": "none",
+			c: checkFormat("keyword", keywordFormat),
+			t: "keyword",
+			j: 0,
+			m: ["p", formatOf(keywordFormat)]
+		},
 		"rel": {
 			"required": false,
 			c: checkString,
@@ -3729,6 +3786,9 @@ var C$11 = (host) => activateModule(ui_button_exports, host);
 function createUiButton(options = {}, html) {
 	const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
 	const v = [
+		void 0,
+		void 0,
+		null,
 		null,
 		null,
 		null,
@@ -3745,7 +3805,83 @@ function createUiButton(options = {}, html) {
 		null
 	];
 	let B = acceptProps(void 0, D$18, S$18.n, v, componentProps, [], html);
-	let a = v[13] === "card" && v[1] === "a" ? 0 : v[13] === "card" ? 1 : v[1] === "a" ? 2 : 3;
+	const CS = [];
+	const inputStatus = (j) => {
+		if (j >= 0 && j < 2) {
+			g(j);
+			return CS[j] ?? UNRESOLVED_INPUT;
+		}
+		if (j === 2) return awaitInput(B, "align", true);
+		if (j === 3) return awaitInput(B, "as", true);
+		if (j === 4) return awaitInput(B, "disabled", true);
+		if (j === 5) return awaitInput(B, "href", true);
+		if (j === 6) return awaitInput(B, "loading", true);
+		if (j === 7) return awaitInput(B, "pending", true);
+		if (j === 8) return awaitInput(B, "preset", true);
+		if (j === 9) return awaitInput(B, "rel", true);
+		if (j === 10) return awaitInput(B, "shape", true);
+		if (j === 11) return awaitInput(B, "size", true);
+		if (j === 12) return awaitInput(B, "stretch", true);
+		if (j === 13) return awaitInput(B, "target", true);
+		if (j === 14) return awaitInput(B, "tone", true);
+		if (j === 15) return awaitInput(B, "type", true);
+		if (j === 16) return awaitInput(B, "variant", true);
+		return v[j] === void 0 ? UNRESOLVED_INPUT : READY_INPUT;
+	};
+	const X = {
+		e: 0,
+		g: (j) => g(j),
+		w: /* @__PURE__ */ new Set(),
+		a: CS,
+		i: inputStatus
+	};
+	const ke = [];
+	const K = [() => readIndex({
+		"none": inputRead(v[16], inputStatus(16)),
+		"primary": "solid",
+		"standard": "solid",
+		"quiet": "ghost",
+		"destructive": "solid"
+	}, inputRead(v[8], inputStatus(8))), () => readIndex(recordValue([
+		"none",
+		"primary",
+		"standard",
+		"quiet",
+		"destructive"
+	], [
+		readIndex({
+			"true": "danger",
+			"false": inputRead(v[14], inputStatus(14))
+		}, textCall("concat", [inputRead(v[16], inputStatus(16)) === "danger"])),
+		"accent",
+		"neutral",
+		"neutral",
+		"danger"
+	]), inputRead(v[8], inputStatus(8)))];
+	const g = (j) => {
+		const i = j - 0;
+		if (ke[i] === X.e) return v[j];
+		if (ke[i] === -1) computedCycle();
+		ke[i] = -1;
+		let next;
+		try {
+			const result = evaluateInput(K[i], CS[j], NONCONFORMING), previousStatus = CS[j];
+			CS[j] = result.status;
+			notifyPropertySet(CS, j, previousStatus, result.status, void 0);
+			next = !result.status.ready ? null : result.value === NONCONFORMING ? v[j] : result.value;
+		} catch (error) {
+			ke[i] = void 0;
+			throw error;
+		}
+		ke[i] = X.e;
+		const previous = v[j];
+		if (!Object.is(previous, next)) {
+			v[j] = next;
+			X.n?.(j, previous, next);
+		}
+		return next;
+	};
+	let a = g(0) === "card" && v[3] === "a" ? 0 : g(0) === "card" ? 1 : v[3] === "a" ? 2 : 3;
 	let element;
 	if (a === 0) {
 		element = document.createElement("a");
@@ -3890,6 +4026,8 @@ function createUiButton(options = {}, html) {
 			v4: void 0,
 			v5: void 0,
 			v6: void 0,
+			v7: void 0,
+			v8: void 0,
 			a1: t1,
 			e0: t1.nextSibling,
 			b0: void 0,
@@ -3910,74 +4048,82 @@ function createUiButton(options = {}, html) {
 		return r;
 	};
 	const p0 = (r, c, d) => {
-		if (c & 1073741884) {
-			const x0 = readIndex({
+		if (c & 1073807616) {
+			const x0 = g(0);
+			const s0 = toAttribute(x0, "data-appearance");
+			if (s0 !== r.v0) writeAttribute(r.n, "data-appearance", r.v0 = s0);
+		}
+		if (c & 1073824e3) {
+			const x1 = g(1);
+			if (x1 !== NONCONFORMING) {
+				const s1 = toAttribute(x1, "data-tone");
+				if (s1 !== r.v1) writeAttribute(r.n, "data-tone", r.v1 = s1);
+			}
+		}
+		if (c & 1073742064) {
+			const x2 = readIndex({
 				"true": null,
-				"false": v[3]
-			}, textCall("concat", [truthy(v[2]) || truthy(v[4]) || truthy(v[5])]));
-			if (x0 !== NONCONFORMING) {
-				const s0 = toAttribute(x0, "href");
-				if (s0 !== r.v0) writeUrlAttribute(r.n, "href", r.v0 = s0);
+				"false": v[5]
+			}, textCall("concat", [truthy(v[4]) || truthy(v[6]) || truthy(v[7])]));
+			if (x2 !== NONCONFORMING) {
+				const s2 = toAttribute(x2, "href");
+				if (s2 !== r.v2) writeUrlAttribute(r.n, "href", r.v2 = s2);
 			}
 		}
-		if (c & 1024) {
-			const x1 = v[10];
-			const s1 = toAttribute(x1, "target");
-			if (s1 !== r.v1) writeAttribute(r.n, "target", r.v1 = s1);
+		if (c & 8192) {
+			const x3 = v[13];
+			const s3 = toAttribute(x3, "target");
+			if (s3 !== r.v3) writeAttribute(r.n, "target", r.v3 = s3);
 		}
-		if (c & 64) {
-			const x2 = v[6];
-			const s2 = toAttribute(x2, "rel");
-			if (s2 !== r.v2) writeAttribute(r.n, "rel", r.v2 = s2);
+		if (c & 512) {
+			const x4 = v[9];
+			const s4 = toAttribute(x4, "rel");
+			if (s4 !== r.v4) writeAttribute(r.n, "rel", r.v4 = s4);
 		}
-		if (c & 1073741876) {
-			const x3 = readIndex({
+		if (c & 1073742032) {
+			const x5 = readIndex({
 				"true": "true",
 				"false": null
-			}, textCall("concat", [truthy(v[2]) || truthy(v[4]) || truthy(v[5])]));
-			if (x3 !== NONCONFORMING) {
-				const s3 = toAttribute(x3, "aria-disabled");
-				if (s3 !== r.v3) writeAttribute(r.n, "aria-disabled", r.v3 = s3);
+			}, textCall("concat", [truthy(v[4]) || truthy(v[6]) || truthy(v[7])]));
+			if (x5 !== NONCONFORMING) {
+				const s5 = toAttribute(x5, "aria-disabled");
+				if (s5 !== r.v5) writeAttribute(r.n, "aria-disabled", r.v5 = s5);
 			}
 		}
-		if (c & 48) {
-			const x4 = truthy(v[4]) || truthy(v[5]);
-			const s4 = toAttribute(x4, "aria-busy");
-			if (s4 !== r.v4) writeAttribute(r.n, "aria-busy", r.v4 = s4);
+		if (c & 192) {
+			const x6 = truthy(v[6]) || truthy(v[7]);
+			const s6 = toAttribute(x6, "aria-busy");
+			if (s6 !== r.v6) writeAttribute(r.n, "aria-busy", r.v6 = s6);
 		}
-		if (c & 1073741876) {
-			const x5 = readIndex({
+		if (c & 1073742032) {
+			const x7 = readIndex({
 				"true": "0",
 				"false": null
-			}, textCall("concat", [(truthy(v[4]) || truthy(v[5])) && !truthy(v[2])]));
-			if (x5 !== NONCONFORMING) {
-				const s5 = toAttribute(x5, "tabindex");
-				if (s5 !== r.v5) writeAttribute(r.n, "tabindex", r.v5 = s5);
+			}, textCall("concat", [(truthy(v[6]) || truthy(v[7])) && !truthy(v[4])]));
+			if (x7 !== NONCONFORMING) {
+				const s7 = toAttribute(x7, "tabindex");
+				if (s7 !== r.v7) writeAttribute(r.n, "tabindex", r.v7 = s7);
 			}
 		}
-		if (c & 11185) {
-			const s6 = hostState([
+		if (c & 7364) {
+			const s8 = hostState([
 				"align",
 				"stretch",
 				"size",
 				"shape",
-				"variant",
-				"tone",
 				"loading",
 				"pending"
 			], [
-				v[0],
-				v[9],
-				v[8],
-				v[7],
-				v[13],
+				v[2],
+				v[12],
 				v[11],
-				v[4],
-				v[5]
+				v[10],
+				v[6],
+				v[7]
 			]);
-			if (s6 !== r.v6) writeAttribute(r.n, "data-ui-button-state", (r.v6 = s6) === "" ? null : s6);
+			if (s8 !== r.v8) writeAttribute(r.n, "data-ui-button-state", (r.v8 = s8) === "" ? null : s8);
 		}
-		if (c & 48 && !(truthy(v[4]) || truthy(v[5])) !== !r.b0) {
+		if (c & 192 && !(truthy(v[6]) || truthy(v[7])) !== !r.b0) {
 			if (r.b0) {
 				r.b0 = void 0;
 				clearRegion(r.a1, r.e0);
@@ -3986,7 +4132,7 @@ function createUiButton(options = {}, html) {
 				r.e0.before(r.b0.n);
 			}
 		} else if (r.b0 !== void 0) r.b0;
-		if (c & 48 && !!(truthy(v[4]) || truthy(v[5])) !== !r.b1) {
+		if (c & 192 && !!(truthy(v[6]) || truthy(v[7])) !== !r.b1) {
 			if (r.b1) {
 				dispose(r.b1);
 				r.b1 = void 0;
@@ -4036,6 +4182,8 @@ function createUiButton(options = {}, html) {
 			v2: void 0,
 			v3: void 0,
 			v4: void 0,
+			v5: void 0,
+			v6: void 0,
 			a1: t1,
 			e0: t1.nextSibling,
 			b0: void 0,
@@ -4056,54 +4204,62 @@ function createUiButton(options = {}, html) {
 		return r;
 	};
 	const p6 = (r, c, d) => {
-		if (c & 1073745920) {
-			const x0 = v[12];
-			const s0 = toAttribute(x0, "type");
-			if (s0 !== r.v0) writeAttribute(r.n, "type", r.v0 = s0);
+		if (c & 1073807616) {
+			const x0 = g(0);
+			const s0 = toAttribute(x0, "data-appearance");
+			if (s0 !== r.v0) writeAttribute(r.n, "data-appearance", r.v0 = s0);
 		}
-		if (c & 4) {
-			const x1 = v[2];
-			const s1 = toAttribute(x1, "disabled");
-			if (s1 !== r.v1) writeAttribute(r.n, "disabled", r.v1 = s1);
+		if (c & 1073824e3) {
+			const x1 = g(1);
+			if (x1 !== NONCONFORMING) {
+				const s1 = toAttribute(x1, "data-tone");
+				if (s1 !== r.v1) writeAttribute(r.n, "data-tone", r.v1 = s1);
+			}
 		}
-		if (c & 1073741872) {
-			const x2 = readIndex({
+		if (c & 1073774592) {
+			const x2 = v[15];
+			const s2 = toAttribute(x2, "type");
+			if (s2 !== r.v2) writeAttribute(r.n, "type", r.v2 = s2);
+		}
+		if (c & 16) {
+			const x3 = v[4];
+			const s3 = toAttribute(x3, "disabled");
+			if (s3 !== r.v3) writeAttribute(r.n, "disabled", r.v3 = s3);
+		}
+		if (c & 1073742016) {
+			const x4 = readIndex({
 				"true": "true",
 				"false": null
-			}, textCall("concat", [truthy(v[4]) || truthy(v[5])]));
-			if (x2 !== NONCONFORMING) {
-				const s2 = toAttribute(x2, "aria-disabled");
-				if (s2 !== r.v2) writeAttribute(r.n, "aria-disabled", r.v2 = s2);
+			}, textCall("concat", [truthy(v[6]) || truthy(v[7])]));
+			if (x4 !== NONCONFORMING) {
+				const s4 = toAttribute(x4, "aria-disabled");
+				if (s4 !== r.v4) writeAttribute(r.n, "aria-disabled", r.v4 = s4);
 			}
 		}
-		if (c & 48) {
-			const x3 = truthy(v[4]) || truthy(v[5]);
-			const s3 = toAttribute(x3, "aria-busy");
-			if (s3 !== r.v3) writeAttribute(r.n, "aria-busy", r.v3 = s3);
+		if (c & 192) {
+			const x5 = truthy(v[6]) || truthy(v[7]);
+			const s5 = toAttribute(x5, "aria-busy");
+			if (s5 !== r.v5) writeAttribute(r.n, "aria-busy", r.v5 = s5);
 		}
-		if (c & 11185) {
-			const s4 = hostState([
+		if (c & 7364) {
+			const s6 = hostState([
 				"align",
 				"stretch",
 				"size",
 				"shape",
-				"variant",
-				"tone",
 				"loading",
 				"pending"
 			], [
-				v[0],
-				v[9],
-				v[8],
-				v[7],
-				v[13],
+				v[2],
+				v[12],
 				v[11],
-				v[4],
-				v[5]
+				v[10],
+				v[6],
+				v[7]
 			]);
-			if (s4 !== r.v4) writeAttribute(r.n, "data-ui-button-state", (r.v4 = s4) === "" ? null : s4);
+			if (s6 !== r.v6) writeAttribute(r.n, "data-ui-button-state", (r.v6 = s6) === "" ? null : s6);
 		}
-		if (c & 48 && !(truthy(v[4]) || truthy(v[5])) !== !r.b0) {
+		if (c & 192 && !(truthy(v[6]) || truthy(v[7])) !== !r.b0) {
 			if (r.b0) {
 				r.b0 = void 0;
 				clearRegion(r.a1, r.e0);
@@ -4112,7 +4268,7 @@ function createUiButton(options = {}, html) {
 				r.e0.before(r.b0.n);
 			}
 		} else if (r.b0 !== void 0) r.b0;
-		if (c & 48 && !!(truthy(v[4]) || truthy(v[5])) !== !r.b1) {
+		if (c & 192 && !!(truthy(v[6]) || truthy(v[7])) !== !r.b1) {
 			if (r.b1) {
 				dispose(r.b1);
 				r.b1 = void 0;
@@ -4161,6 +4317,8 @@ function createUiButton(options = {}, html) {
 			v4: void 0,
 			v5: void 0,
 			v6: void 0,
+			v7: void 0,
+			v8: void 0,
 			a1: t0,
 			e0: t0.nextSibling,
 			b0: void 0,
@@ -4177,74 +4335,82 @@ function createUiButton(options = {}, html) {
 		return r;
 	};
 	const p12 = (r, c, d) => {
-		if (c & 1073741884) {
-			const x0 = readIndex({
+		if (c & 1073807616) {
+			const x0 = g(0);
+			const s0 = toAttribute(x0, "data-appearance");
+			if (s0 !== r.v0) writeAttribute(r.n, "data-appearance", r.v0 = s0);
+		}
+		if (c & 1073824e3) {
+			const x1 = g(1);
+			if (x1 !== NONCONFORMING) {
+				const s1 = toAttribute(x1, "data-tone");
+				if (s1 !== r.v1) writeAttribute(r.n, "data-tone", r.v1 = s1);
+			}
+		}
+		if (c & 1073742064) {
+			const x2 = readIndex({
 				"true": null,
-				"false": v[3]
-			}, textCall("concat", [truthy(v[2]) || truthy(v[4]) || truthy(v[5])]));
-			if (x0 !== NONCONFORMING) {
-				const s0 = toAttribute(x0, "href");
-				if (s0 !== r.v0) writeUrlAttribute(r.n, "href", r.v0 = s0);
+				"false": v[5]
+			}, textCall("concat", [truthy(v[4]) || truthy(v[6]) || truthy(v[7])]));
+			if (x2 !== NONCONFORMING) {
+				const s2 = toAttribute(x2, "href");
+				if (s2 !== r.v2) writeUrlAttribute(r.n, "href", r.v2 = s2);
 			}
 		}
-		if (c & 1024) {
-			const x1 = v[10];
-			const s1 = toAttribute(x1, "target");
-			if (s1 !== r.v1) writeAttribute(r.n, "target", r.v1 = s1);
+		if (c & 8192) {
+			const x3 = v[13];
+			const s3 = toAttribute(x3, "target");
+			if (s3 !== r.v3) writeAttribute(r.n, "target", r.v3 = s3);
 		}
-		if (c & 64) {
-			const x2 = v[6];
-			const s2 = toAttribute(x2, "rel");
-			if (s2 !== r.v2) writeAttribute(r.n, "rel", r.v2 = s2);
+		if (c & 512) {
+			const x4 = v[9];
+			const s4 = toAttribute(x4, "rel");
+			if (s4 !== r.v4) writeAttribute(r.n, "rel", r.v4 = s4);
 		}
-		if (c & 1073741876) {
-			const x3 = readIndex({
+		if (c & 1073742032) {
+			const x5 = readIndex({
 				"true": "true",
 				"false": null
-			}, textCall("concat", [truthy(v[2]) || truthy(v[4]) || truthy(v[5])]));
-			if (x3 !== NONCONFORMING) {
-				const s3 = toAttribute(x3, "aria-disabled");
-				if (s3 !== r.v3) writeAttribute(r.n, "aria-disabled", r.v3 = s3);
+			}, textCall("concat", [truthy(v[4]) || truthy(v[6]) || truthy(v[7])]));
+			if (x5 !== NONCONFORMING) {
+				const s5 = toAttribute(x5, "aria-disabled");
+				if (s5 !== r.v5) writeAttribute(r.n, "aria-disabled", r.v5 = s5);
 			}
 		}
-		if (c & 48) {
-			const x4 = truthy(v[4]) || truthy(v[5]);
-			const s4 = toAttribute(x4, "aria-busy");
-			if (s4 !== r.v4) writeAttribute(r.n, "aria-busy", r.v4 = s4);
+		if (c & 192) {
+			const x6 = truthy(v[6]) || truthy(v[7]);
+			const s6 = toAttribute(x6, "aria-busy");
+			if (s6 !== r.v6) writeAttribute(r.n, "aria-busy", r.v6 = s6);
 		}
-		if (c & 1073741876) {
-			const x5 = readIndex({
+		if (c & 1073742032) {
+			const x7 = readIndex({
 				"true": "0",
 				"false": null
-			}, textCall("concat", [(truthy(v[4]) || truthy(v[5])) && !truthy(v[2])]));
-			if (x5 !== NONCONFORMING) {
-				const s5 = toAttribute(x5, "tabindex");
-				if (s5 !== r.v5) writeAttribute(r.n, "tabindex", r.v5 = s5);
+			}, textCall("concat", [(truthy(v[6]) || truthy(v[7])) && !truthy(v[4])]));
+			if (x7 !== NONCONFORMING) {
+				const s7 = toAttribute(x7, "tabindex");
+				if (s7 !== r.v7) writeAttribute(r.n, "tabindex", r.v7 = s7);
 			}
 		}
-		if (c & 11185) {
-			const s6 = hostState([
+		if (c & 7364) {
+			const s8 = hostState([
 				"align",
 				"stretch",
 				"size",
 				"shape",
-				"variant",
-				"tone",
 				"loading",
 				"pending"
 			], [
-				v[0],
-				v[9],
-				v[8],
-				v[7],
-				v[13],
+				v[2],
+				v[12],
 				v[11],
-				v[4],
-				v[5]
+				v[10],
+				v[6],
+				v[7]
 			]);
-			if (s6 !== r.v6) writeAttribute(r.n, "data-ui-button-state", (r.v6 = s6) === "" ? null : s6);
+			if (s8 !== r.v8) writeAttribute(r.n, "data-ui-button-state", (r.v8 = s8) === "" ? null : s8);
 		}
-		if (c & 48 && !(truthy(v[4]) || truthy(v[5])) !== !r.b0) {
+		if (c & 192 && !(truthy(v[6]) || truthy(v[7])) !== !r.b0) {
 			if (r.b0) {
 				r.b0 = void 0;
 				clearRegion(r.a1, r.e0);
@@ -4290,6 +4456,8 @@ function createUiButton(options = {}, html) {
 			v2: void 0,
 			v3: void 0,
 			v4: void 0,
+			v5: void 0,
+			v6: void 0,
 			a1: t0,
 			e0: t0.nextSibling,
 			b0: void 0,
@@ -4306,54 +4474,62 @@ function createUiButton(options = {}, html) {
 		return r;
 	};
 	const p16 = (r, c, d) => {
-		if (c & 1073745920) {
-			const x0 = v[12];
-			const s0 = toAttribute(x0, "type");
-			if (s0 !== r.v0) writeAttribute(r.n, "type", r.v0 = s0);
+		if (c & 1073807616) {
+			const x0 = g(0);
+			const s0 = toAttribute(x0, "data-appearance");
+			if (s0 !== r.v0) writeAttribute(r.n, "data-appearance", r.v0 = s0);
 		}
-		if (c & 4) {
-			const x1 = v[2];
-			const s1 = toAttribute(x1, "disabled");
-			if (s1 !== r.v1) writeAttribute(r.n, "disabled", r.v1 = s1);
+		if (c & 1073824e3) {
+			const x1 = g(1);
+			if (x1 !== NONCONFORMING) {
+				const s1 = toAttribute(x1, "data-tone");
+				if (s1 !== r.v1) writeAttribute(r.n, "data-tone", r.v1 = s1);
+			}
 		}
-		if (c & 1073741872) {
-			const x2 = readIndex({
+		if (c & 1073774592) {
+			const x2 = v[15];
+			const s2 = toAttribute(x2, "type");
+			if (s2 !== r.v2) writeAttribute(r.n, "type", r.v2 = s2);
+		}
+		if (c & 16) {
+			const x3 = v[4];
+			const s3 = toAttribute(x3, "disabled");
+			if (s3 !== r.v3) writeAttribute(r.n, "disabled", r.v3 = s3);
+		}
+		if (c & 1073742016) {
+			const x4 = readIndex({
 				"true": "true",
 				"false": null
-			}, textCall("concat", [truthy(v[4]) || truthy(v[5])]));
-			if (x2 !== NONCONFORMING) {
-				const s2 = toAttribute(x2, "aria-disabled");
-				if (s2 !== r.v2) writeAttribute(r.n, "aria-disabled", r.v2 = s2);
+			}, textCall("concat", [truthy(v[6]) || truthy(v[7])]));
+			if (x4 !== NONCONFORMING) {
+				const s4 = toAttribute(x4, "aria-disabled");
+				if (s4 !== r.v4) writeAttribute(r.n, "aria-disabled", r.v4 = s4);
 			}
 		}
-		if (c & 48) {
-			const x3 = truthy(v[4]) || truthy(v[5]);
-			const s3 = toAttribute(x3, "aria-busy");
-			if (s3 !== r.v3) writeAttribute(r.n, "aria-busy", r.v3 = s3);
+		if (c & 192) {
+			const x5 = truthy(v[6]) || truthy(v[7]);
+			const s5 = toAttribute(x5, "aria-busy");
+			if (s5 !== r.v5) writeAttribute(r.n, "aria-busy", r.v5 = s5);
 		}
-		if (c & 11185) {
-			const s4 = hostState([
+		if (c & 7364) {
+			const s6 = hostState([
 				"align",
 				"stretch",
 				"size",
 				"shape",
-				"variant",
-				"tone",
 				"loading",
 				"pending"
 			], [
-				v[0],
-				v[9],
-				v[8],
-				v[7],
-				v[13],
+				v[2],
+				v[12],
 				v[11],
-				v[4],
-				v[5]
+				v[10],
+				v[6],
+				v[7]
 			]);
-			if (s4 !== r.v4) writeAttribute(r.n, "data-ui-button-state", (r.v4 = s4) === "" ? null : s4);
+			if (s6 !== r.v6) writeAttribute(r.n, "data-ui-button-state", (r.v6 = s6) === "" ? null : s6);
 		}
-		if (c & 48 && !(truthy(v[4]) || truthy(v[5])) !== !r.b0) {
+		if (c & 192 && !(truthy(v[6]) || truthy(v[7])) !== !r.b0) {
 			if (r.b0) {
 				r.b0 = void 0;
 				clearRegion(r.a1, r.e0);
@@ -4405,8 +4581,8 @@ function createUiButton(options = {}, html) {
 			R = M[a](element, d);
 			return;
 		}
-		if (c & 8194) {
-			const t = v[13] === "card" && v[1] === "a" ? 0 : v[13] === "card" ? 1 : v[1] === "a" ? 2 : 3;
+		if (c & 1073807624) {
+			const t = g(0) === "card" && v[3] === "a" ? 0 : g(0) === "card" ? 1 : v[3] === "a" ? 2 : 3;
 			if (t !== a) {
 				dispose(R);
 				for (const key in I.r) delete I.r[key];
@@ -4423,7 +4599,7 @@ function createUiButton(options = {}, html) {
 	};
 	const I = { B };
 	const J = project(I, children, slots);
-	attachGeneratedController(element, S$18, v, p, void 0, void 0, I);
+	attachGeneratedController(element, S$18, v, p, void 0, X, I);
 	manageProps(I);
 	return element;
 }
@@ -4434,6 +4610,7 @@ defineComponent$1("ui-button", createUiButton, [
 	"href",
 	"loading",
 	"pending",
+	"preset",
 	"rel",
 	"shape",
 	"size",
@@ -4444,6 +4621,29 @@ defineComponent$1("ui-button", createUiButton, [
 	"variant"
 ]);
 //#endregion
+//#region components/shared/surface-material.js
+var roleWeight = Object.freeze({
+	tooltip: .08,
+	menu: .28,
+	popover: .55,
+	dialog: 1,
+	panel: .65
+});
+/** Derive a bounded material scale from a surface's purpose and rendered border box. */
+function surfaceMaterialScale(role, width, height) {
+	if (!Object.hasOwn(roleWeight, role)) throw new Error(`Unknown surface material role: ${role}`);
+	const size = [width, height].every((value) => Number.isFinite(value) && value > 0) ? Math.max(.8, Math.min(1.35, Math.sqrt(width * height / 76800))) : 1;
+	return Math.round(roleWeight[role] * size * 1e3) / 1e3;
+}
+/** Update component-owned material geometry; a tolerance prevents its rim feeding tiny resize changes back into itself. */
+function updateSurfaceMaterial(element, role) {
+	const width = element.offsetWidth;
+	const height = element.offsetHeight;
+	const next = surfaceMaterialScale(role, width, height);
+	const previous = Number.parseFloat(element.style.getPropertyValue("--_ui-material-scale"));
+	if (!Number.isFinite(previous) || Math.abs(next - previous) >= Math.max(.002, Math.abs(previous) * .04)) element.style.setProperty("--_ui-material-scale", String(next));
+}
+//#endregion
 //#region components/shared/overlay.js
 function stateFor(document) {
 	const key = Symbol.for("@threadlabs/looma/overlay-stack/v1");
@@ -4806,7 +5006,10 @@ function createViewportSurface(surface, options = {}) {
 	let frame = null;
 	const position = () => {
 		frame = null;
-		if (stop) options.position?.();
+		if (stop) {
+			if (options.materialRole) updateSurfaceMaterial(surface, options.materialRole);
+			options.position?.();
+		}
 	};
 	const refresh = () => {
 		if (stop && frame === null) frame = owner.requestAnimationFrame(position);
@@ -4849,6 +5052,7 @@ function createViewportSurface(surface, options = {}) {
 		show() {
 			if (destroyed) return;
 			show(surface);
+			if (options.materialRole) updateSurfaceMaterial(surface, options.materialRole);
 			stop ??= observeOverlayViewport(surface.ownerDocument, position);
 			options.position?.();
 			if (!sizeObserver && owner.ResizeObserver) {
@@ -4934,7 +5138,8 @@ function createAnchoredSurface(surface, options = {}) {
 	surface.style.setProperty("margin", "0", "important");
 	const presentation = createViewportSurface(surface, {
 		position,
-		bare: options.bare
+		bare: options.bare,
+		materialRole: options.materialRole
 	});
 	const trackAnchor = () => {
 		anchorFrame = null;
@@ -7250,10 +7455,12 @@ var P0$11;
 var P1$11;
 var P2$8;
 var S$13 = {
-	n: [],
-	t: [],
+	n: ["appearance", "colorTone"],
+	t: ["?", "?"],
 	f: import.meta.url,
 	g: "ui-icon-button",
+	k: 0,
+	r: readonlyView,
 	a: (host, I) => C$8(host, I),
 	b: generatedInputs
 };
@@ -7316,6 +7523,21 @@ var D$13 = {
 			j: 0,
 			m: "b"
 		},
+		"preset": {
+			"required": false,
+			"values": [
+				"none",
+				"primary",
+				"standard",
+				"quiet",
+				"destructive"
+			],
+			"default": "none",
+			c: checkFormat("keyword", keywordFormat),
+			t: "keyword",
+			j: 0,
+			m: ["p", formatOf(keywordFormat)]
+		},
 		"revealed": {
 			"required": false,
 			"default": false,
@@ -7347,7 +7569,16 @@ var D$13 = {
 		},
 		"tone": {
 			"required": false,
-			"values": ["accent", "neutral"],
+			"values": [
+				"auto",
+				"accent",
+				"neutral",
+				"danger",
+				"success",
+				"warning",
+				"info"
+			],
+			"default": "auto",
 			c: checkFormat("keyword", keywordFormat),
 			t: "keyword",
 			j: 0,
@@ -7380,6 +7611,9 @@ function createUiIconButton(options = {}, html) {
 	element.setAttribute("data-component", "ui-icon-button");
 	element.append((P0$11 ??= buildTemplate(T0$11)).cloneNode(true));
 	const v = [
+		void 0,
+		void 0,
+		null,
 		null,
 		null,
 		null,
@@ -7394,6 +7628,71 @@ function createUiIconButton(options = {}, html) {
 		null
 	];
 	const B = acceptProps(element, D$13, S$13.n, v, componentProps, [], html);
+	const CS = [];
+	const inputStatus = (j) => {
+		if (j >= 0 && j < 2) {
+			g(j);
+			return CS[j] ?? UNRESOLVED_INPUT;
+		}
+		if (j === 2) return awaitInput(B, "anticipatory", true);
+		if (j === 3) return awaitInput(B, "disabled", true);
+		if (j === 4) return awaitInput(B, "guide", true);
+		if (j === 5) return awaitInput(B, "label", true);
+		if (j === 6) return awaitInput(B, "loading", true);
+		if (j === 7) return awaitInput(B, "matchButton", true);
+		if (j === 8) return awaitInput(B, "pending", true);
+		if (j === 9) return awaitInput(B, "preset", true);
+		if (j === 10) return awaitInput(B, "revealed", true);
+		if (j === 11) return awaitInput(B, "round", true);
+		if (j === 12) return awaitInput(B, "size", true);
+		if (j === 13) return awaitInput(B, "tone", true);
+		if (j === 14) return awaitInput(B, "variant", true);
+		return v[j] === void 0 ? UNRESOLVED_INPUT : READY_INPUT;
+	};
+	const X = {
+		e: 0,
+		g: (j) => g(j),
+		w: /* @__PURE__ */ new Set(),
+		a: CS,
+		i: inputStatus
+	};
+	const ke = [];
+	const K = [() => readIndex({
+		"none": inputRead(v[14], inputStatus(14)),
+		"primary": "solid",
+		"standard": "solid",
+		"quiet": "ghost",
+		"destructive": "solid"
+	}, inputRead(v[9], inputStatus(9))), () => readIndex({
+		"none": inputRead(v[13], inputStatus(13)),
+		"primary": "accent",
+		"standard": "neutral",
+		"quiet": "neutral",
+		"destructive": "danger"
+	}, inputRead(v[9], inputStatus(9)))];
+	const g = (j) => {
+		const i = j - 0;
+		if (ke[i] === X.e) return v[j];
+		if (ke[i] === -1) computedCycle();
+		ke[i] = -1;
+		let next;
+		try {
+			const result = evaluateInput(K[i], CS[j], NONCONFORMING), previousStatus = CS[j];
+			CS[j] = result.status;
+			notifyPropertySet(CS, j, previousStatus, result.status, void 0);
+			next = !result.status.ready ? null : result.value === NONCONFORMING ? v[j] : result.value;
+		} catch (error) {
+			ke[i] = void 0;
+			throw error;
+		}
+		ke[i] = X.e;
+		const previous = v[j];
+		if (!Object.is(previous, next)) {
+			v[j] = next;
+			X.n?.(j, previous, next);
+		}
+		return next;
+	};
 	const m1 = (d) => {
 		return { n: (P1$11 ??= buildTemplate(T1$11)).cloneNode(true) };
 	};
@@ -7401,63 +7700,69 @@ function createUiIconButton(options = {}, html) {
 		return { n: (P2$8 ??= buildTemplate(T2$8)).cloneNode(true) };
 	};
 	const p0 = (r, c, d) => {
-		if (c & 2) {
-			const x0 = v[1];
-			const s0 = toAttribute(x0, "disabled");
-			if (s0 !== r.v0) writeAttribute(r.n, "disabled", r.v0 = s0);
+		if (c & 1073758720) {
+			const x0 = g(0);
+			const s0 = toAttribute(x0, "data-appearance");
+			if (s0 !== r.v0) writeAttribute(r.n, "data-appearance", r.v0 = s0);
+		}
+		if (c & 1073750528) {
+			const x1 = g(1);
+			const s1 = toAttribute(x1, "data-tone");
+			if (s1 !== r.v1) writeAttribute(r.n, "data-tone", r.v1 = s1);
 		}
 		if (c & 8) {
-			const x1 = v[3];
-			const s1 = toAttribute(x1, "aria-label");
-			if (s1 !== r.v1) writeAttribute(r.n, "aria-label", r.v1 = s1);
+			const x2 = v[3];
+			const s2 = toAttribute(x2, "disabled");
+			if (s2 !== r.v2) writeAttribute(r.n, "disabled", r.v2 = s2);
 		}
 		if (c & 32) {
-			const x2 = v[5];
-			const s2 = toAttribute(x2, "data-match-button");
-			if (s2 !== r.v2) writeAttribute(r.n, "data-match-button", r.v2 = s2);
+			const x3 = v[5];
+			const s3 = toAttribute(x3, "aria-label");
+			if (s3 !== r.v3) writeAttribute(r.n, "aria-label", r.v3 = s3);
 		}
-		if (c & 1073741904) {
-			const x3 = readIndex({
+		if (c & 128) {
+			const x4 = v[7];
+			const s4 = toAttribute(x4, "data-match-button");
+			if (s4 !== r.v4) writeAttribute(r.n, "data-match-button", r.v4 = s4);
+		}
+		if (c & 1073742144) {
+			const x5 = readIndex({
 				"true": "true",
 				"false": null
-			}, textCall("concat", [truthy(v[4]) || truthy(v[6])]));
-			if (x3 !== NONCONFORMING) {
-				const s3 = toAttribute(x3, "aria-disabled");
-				if (s3 !== r.v3) writeAttribute(r.n, "aria-disabled", r.v3 = s3);
+			}, textCall("concat", [truthy(v[6]) || truthy(v[8])]));
+			if (x5 !== NONCONFORMING) {
+				const s5 = toAttribute(x5, "aria-disabled");
+				if (s5 !== r.v5) writeAttribute(r.n, "aria-disabled", r.v5 = s5);
 			}
 		}
-		if (c & 80) {
-			const x4 = truthy(v[4]) || truthy(v[6]);
-			const s4 = toAttribute(x4, "aria-busy");
-			if (s4 !== r.v4) writeAttribute(r.n, "aria-busy", r.v4 = s4);
+		if (c & 320) {
+			const x6 = truthy(v[6]) || truthy(v[8]);
+			const s6 = toAttribute(x6, "aria-busy");
+			if (s6 !== r.v6) writeAttribute(r.n, "aria-busy", r.v6 = s6);
 		}
-		if (c & 4085) {
-			const s5 = hostState([
-				"tone",
+		if (c & 7636) {
+			const s7 = hostState([
 				"anticipatory",
 				"guide",
 				"revealed",
-				"variant",
 				"loading",
 				"pending",
 				"size",
 				"matchButton",
 				"round"
 			], [
-				v[10],
-				v[0],
 				v[2],
-				v[7],
-				v[11],
 				v[4],
+				v[10],
 				v[6],
-				v[9],
-				v[5],
-				v[8]
+				v[8],
+				v[12],
+				v[7],
+				v[11]
 			]);
-			if (s5 !== r.v5) writeAttribute(r.n, "data-ui-icon-button-state", (r.v5 = s5) === "" ? null : s5);
+			if (s7 !== r.v7) writeAttribute(r.n, "data-ui-icon-button-state", (r.v7 = s7) === "" ? null : s7);
 		}
-		if (c & 80 && !(truthy(v[4]) || truthy(v[6])) !== !r.b0) {
+		if (c & 320 && !(truthy(v[6]) || truthy(v[8])) !== !r.b0) {
 			if (r.b0) {
 				r.b0 = void 0;
 				clearRegion(r.a1, r.e0);
@@ -7489,6 +7794,8 @@ function createUiIconButton(options = {}, html) {
 		v3: void 0,
 		v4: void 0,
 		v5: void 0,
+		v6: void 0,
+		v7: void 0,
 		a1: t0,
 		e0: t0.nextSibling,
 		b0: void 0,
@@ -7499,7 +7806,7 @@ function createUiIconButton(options = {}, html) {
 	};
 	const I = { B };
 	const J = project(I, children, slots);
-	attachGeneratedController(element, S$13, v, ((c, d) => p0(R, c, d)), void 0, void 0, I);
+	attachGeneratedController(element, S$13, v, ((c, d) => p0(R, c, d)), void 0, X, I);
 	manageProps(I);
 	return element;
 }
@@ -7511,6 +7818,7 @@ defineComponent$1("ui-icon-button", createUiIconButton, [
 	"loading",
 	"matchButton",
 	"pending",
+	"preset",
 	"revealed",
 	"round",
 	"size",
@@ -7893,7 +8201,8 @@ function connect$7(host) {
 		anchor?.addEventListener("click", onAnchorClick);
 		surface = host.props.inline.value ? null : createAnchoredSurface(element, {
 			anchor,
-			placement: nextPlacement
+			placement: nextPlacement,
+			materialRole: "menu"
 		});
 	};
 	const apply = () => {
@@ -8914,7 +9223,8 @@ function connect$5(host) {
 		surface = createAnchoredSurface(element, {
 			anchor,
 			placement: nextPlacement,
-			gap: offset
+			gap: offset,
+			materialRole: "popover"
 		});
 	};
 	const apply = () => {
@@ -9416,6 +9726,12 @@ var T20 = [
 	4
 ];
 var T21 = ["", []];
+var T22 = [
+	"",
+	[],
+	4
+];
+var T23 = ["", []];
 var P0$5;
 var P1$5;
 var P2$5;
@@ -9438,6 +9754,8 @@ var P18;
 var P19;
 var P20;
 var P21;
+var P22;
+var P23;
 var S$7 = {
 	n: [],
 	t: [],
@@ -9551,6 +9869,27 @@ var A = [
 			"data-ui-text-prop-wrap"
 		]
 	],
+	[
+		"h1",
+		{},
+		[],
+		"",
+		[],
+		[
+			"data-ui-text-state",
+			"data-ui-text-prop-align",
+			"data-ui-text-prop-as",
+			"data-ui-text-prop-font",
+			"data-ui-text-prop-grow",
+			"data-ui-text-prop-size",
+			"data-ui-text-prop-tone",
+			"data-ui-text-prop-trim",
+			"data-ui-text-prop-truncate",
+			"data-ui-text-prop-variant",
+			"data-ui-text-prop-weight",
+			"data-ui-text-prop-wrap"
+		]
+	],
 	[
 		"h2",
 		{},
@@ -9689,6 +10028,7 @@ var Q = [
 	[],
 	[],
 	[],
+	[],
 	[]
 ];
 var D$7 = {
@@ -9712,6 +10052,7 @@ var D$7 = {
 				"small",
 				"strong",
 				"label",
+				"h1",
 				"h2",
 				"h3",
 				"h4",
@@ -9794,6 +10135,10 @@ var D$7 = {
 			"required": false,
 			"values": [
 				"body",
+				"display",
+				"heading",
+				"label",
+				"caption",
 				"eyebrow",
 				"code"
 			],
@@ -9844,7 +10189,7 @@ function createUiText(options = {}, html) {
 		null
 	];
 	let B = acceptProps(void 0, D$7, S$7.n, v, componentProps, [], html);
-	let a = v[1] === "span" ? 0 : v[1] === "div" ? 1 : v[1] === "small" ? 2 : v[1] === "strong" ? 3 : v[1] === "label" ? 4 : v[1] === "h2" ? 5 : v[1] === "h3" ? 6 : v[1] === "h4" ? 7 : v[1] === "h5" ? 8 : v[1] === "h6" ? 9 : 10;
+	let a = v[1] === "span" ? 0 : v[1] === "div" ? 1 : v[1] === "small" ? 2 : v[1] === "strong" ? 3 : v[1] === "label" ? 4 : v[1] === "h1" ? 5 : v[1] === "h2" ? 6 : v[1] === "h3" ? 7 : v[1] === "h4" ? 8 : v[1] === "h5" ? 9 : v[1] === "h6" ? 10 : 11;
 	let element;
 	if (a === 0) {
 		element = document.createElement("span");
@@ -9882,34 +10227,41 @@ function createUiText(options = {}, html) {
 		}
 		element.setAttribute("data-component", "ui-text");
 	} else if (a === 5) {
-		element = document.createElement("h2");
+		element = document.createElement("h1");
 		for (const [name, value] of Object.entries(attributes)) {
 			if (value === null || value === void 0 || value === false) continue;
 			element.setAttribute(name, value === true ? "" : String(value));
 		}
 		element.setAttribute("data-component", "ui-text");
 	} else if (a === 6) {
-		element = document.createElement("h3");
+		element = document.createElement("h2");
 		for (const [name, value] of Object.entries(attributes)) {
 			if (value === null || value === void 0 || value === false) continue;
 			element.setAttribute(name, value === true ? "" : String(value));
 		}
 		element.setAttribute("data-component", "ui-text");
 	} else if (a === 7) {
-		element = document.createElement("h4");
+		element = document.createElement("h3");
 		for (const [name, value] of Object.entries(attributes)) {
 			if (value === null || value === void 0 || value === false) continue;
 			element.setAttribute(name, value === true ? "" : String(value));
 		}
 		element.setAttribute("data-component", "ui-text");
 	} else if (a === 8) {
-		element = document.createElement("h5");
+		element = document.createElement("h4");
 		for (const [name, value] of Object.entries(attributes)) {
 			if (value === null || value === void 0 || value === false) continue;
 			element.setAttribute(name, value === true ? "" : String(value));
 		}
 		element.setAttribute("data-component", "ui-text");
 	} else if (a === 9) {
+		element = document.createElement("h5");
+		for (const [name, value] of Object.entries(attributes)) {
+			if (value === null || value === void 0 || value === false) continue;
+			element.setAttribute(name, value === true ? "" : String(value));
+		}
+		element.setAttribute("data-component", "ui-text");
+	} else if (a === 10) {
 		element = document.createElement("h6");
 		for (const [name, value] of Object.entries(attributes)) {
 			if (value === null || value === void 0 || value === false) continue;
@@ -9958,6 +10310,9 @@ function createUiText(options = {}, html) {
 	const m21 = (d) => {
 		return { n: (P21 ??= buildTemplate(T21)).cloneNode(true) };
 	};
+	const m23 = (d) => {
+		return { n: (P23 ??= buildTemplate(T23)).cloneNode(true) };
+	};
 	const m0 = (n, d) => {
 		n.append((P0$5 ??= buildTemplate(T0$5)).cloneNode(true));
 		const t0 = n.firstChild;
@@ -10552,6 +10907,60 @@ function createUiText(options = {}, html) {
 			}
 		} else if (r.b0 !== void 0) r.b0;
 	};
+	const m22 = (n, d) => {
+		n.append((P22 ??= buildTemplate(T22)).cloneNode(true));
+		const t0 = n.firstChild;
+		const r = {
+			n,
+			v0: void 0,
+			a0: t0,
+			e0: t0.nextSibling,
+			b0: void 0,
+			f0: void 0
+		};
+		p22(r, -1, d);
+		return r;
+	};
+	const p22 = (r, c, d) => {
+		if (c & 2045) {
+			const s0 = hostState([
+				"grow",
+				"size",
+				"trim",
+				"tone",
+				"weight",
+				"variant",
+				"truncate",
+				"align",
+				"font",
+				"wrap"
+			], [
+				v[3],
+				v[4],
+				v[6],
+				v[5],
+				v[9],
+				v[8],
+				v[7],
+				v[0],
+				v[2],
+				v[10]
+			]);
+			if (s0 !== r.v0) writeAttribute(r.n, "data-ui-text-state", (r.v0 = s0) === "" ? null : s0);
+		}
+		if (r.f0 === void 0) {
+			r.f0 = 1;
+			const at = fillSlot(r.a0, r.e0, "", J, false, void 0, d);
+			if (Array.isArray(at)) (r.z ??= []).push(() => {
+				at[0].l.delete(at[1]);
+				dispose(at[1]);
+			});
+			else if (at !== void 0) {
+				r.b0 = m23(d);
+				at.before(r.b0.n);
+			}
+		} else if (r.b0 !== void 0) r.b0;
+	};
 	const M = [
 		m0,
 		m2,
@@ -10563,7 +10972,8 @@ function createUiText(options = {}, html) {
 		m14,
 		m16,
 		m18,
-		m20
+		m20,
+		m22
 	], N = [
 		p0,
 		p2,
@@ -10575,7 +10985,8 @@ function createUiText(options = {}, html) {
 		p14,
 		p16,
 		p18,
-		p20
+		p20,
+		p22
 	];
 	let R;
 	const p = (c, d) => {
@@ -10585,7 +10996,7 @@ function createUiText(options = {}, html) {
 			return;
 		}
 		if (c & 2) {
-			const t = v[1] === "span" ? 0 : v[1] === "div" ? 1 : v[1] === "small" ? 2 : v[1] === "strong" ? 3 : v[1] === "label" ? 4 : v[1] === "h2" ? 5 : v[1] === "h3" ? 6 : v[1] === "h4" ? 7 : v[1] === "h5" ? 8 : v[1] === "h6" ? 9 : 10;
+			const t = v[1] === "span" ? 0 : v[1] === "div" ? 1 : v[1] === "small" ? 2 : v[1] === "strong" ? 3 : v[1] === "label" ? 4 : v[1] === "h1" ? 5 : v[1] === "h2" ? 6 : v[1] === "h3" ? 7 : v[1] === "h4" ? 8 : v[1] === "h5" ? 9 : v[1] === "h6" ? 10 : 11;
 			if (t !== a) {
 				dispose(R);
 				for (const key in I.r) delete I.r[key];
@@ -10801,7 +11212,8 @@ function connect$4(host) {
 		surface = createAnchoredSurface(element, {
 			anchor: trigger,
 			placement: nextPlacement,
-			gap: offset
+			gap: offset,
+			materialRole: "tooltip"
 		});
 	};
 	const close = (reason, input) => {