@threadlabs/looma 0.28.4 → 0.28.6

package/vue/chunks/UiButton.js

@@ -1,5 +1,4 @@
-import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { n as preserveRootFocus, r as useComponentHost, t as createDispatch } from "./host.js";
+import { _ as useComponentHost, a as concat, h as preserveRootFocus, i as checkHydratedRoot, o as createDispatch, p as nativeAttrs, r as attribute, t as _plugin_vue_export_helper_default, v as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp, r as propValidityState } from "./props.js";
 import { t as UiIcon_default } from "./UiIcon.js";
 import { t as UiSpinner_default } from "./UiSpinner.js";
@@ -422,18 +421,7 @@ var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 		watchSyncEffect(() => {
 			checkedProps.value;
 		});
-		function nativeAttrs(attrs) {
-			const names = Object.keys(attrs);
-			if (!names.some((name) => Object.hasOwn(Object.prototype, name))) return attrs;
-			return Object.fromEntries(names.map((name) => [Object.hasOwn(Object.prototype, name) ? name === "__proto__" ? "__Proto__" : name[0].toUpperCase() + name.slice(1) : name, attrs[name]]));
-		}
-		const componentInstance = getCurrentInstance();
-		function reflectedProp(name, kebab, value, fallback, bound, separator) {
-			const incoming = componentInstance?.vnode.props;
-			if (!bound && (incoming === null || incoming === void 0 || !Object.hasOwn(incoming, name) && !Object.hasOwn(incoming, kebab))) return fallback;
-			if (value === null || value === void 0) return void 0;
-			return Array.isArray(value) && separator !== void 0 ? value.join(separator) : typeof value === "object" ? JSON.stringify(value) : String(value);
-		}
+		const reflectedProp = useReflectedProp();
 		const hydrationInstance = getCurrentInstance();
 		const root = useTemplateRef("@html-next/root");
 		preserveRootFocus(root);
@@ -549,14 +537,7 @@ var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				false: null
 			}, concat(checkedProps.value.loading || checkedProps.value.pending)));
 		});
-		const hydrationNode = hydrationInstance?.vnode.el;
-		if (typeof window !== "undefined" && hydrationNode != null && (!(hydrationNode instanceof Element) || hydrationNode.localName !== (checkedProps.value.variant === "card" && checkedProps.value.as === "a" ? "a" : checkedProps.value.variant === "card" ? "button" : checkedProps.value.as === "a" ? "a" : "button"))) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-button> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-button> has an incompatible root."
-			})
-		});
+		checkHydratedRoot(checkedProps.value.variant === "card" && checkedProps.value.as === "a" ? "a" : checkedProps.value.variant === "card" ? "button" : checkedProps.value.as === "a" ? "a" : "button", "ui-button");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.align && "align",
@@ -608,54 +589,42 @@ var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				values: { ...props }
 			}, name)
 		});
-		function text(value) {
-			if (Array.isArray(value)) return value.map(text).join(" ");
-			return value === null || value === void 0 || typeof value === "object" ? "" : String(value);
-		}
-		function attribute(value) {
-			if (value === null || value === void 0 || value === false || typeof value === "object" && !Array.isArray(value)) return void 0;
-			return value === true ? "" : text(value);
-		}
-		function concat(...values) {
-			if (values.some((value) => value === Symbol.for("html-next.invalid-result"))) return Symbol.for("html-next.invalid-result");
-			if (values.some((value) => value === void 0)) return void 0;
-			if (values.length === 0 || values.some((value) => typeof value === "object" && value !== null)) return Symbol.for("html-next.invalid-result");
-			return values.map((value) => value === null ? "" : String(value)).join("");
-		}
 		return (_ctx, _cache) => {
 			return checkedProps.value.variant === "card" && checkedProps.value.as === "a" ? withDirectives((openBlock(), createElementBlock("a", mergeProps({
 				key: 0,
-				"data-component": "ui-button"
-			}, nativeAttrs(_ctx.$attrs), {
+				class: "ui-button"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
 				href: guarded.value,
 				target: checkedProps.value.target ?? void 0,
 				rel: checkedProps.value.rel ?? void 0,
 				"aria-disabled": guardedBinding.value,
 				"aria-busy": checkedProps.value.loading || checkedProps.value.pending,
 				tabindex: guardedBinding2.value,
-				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-href": reflectedProp("href", "href", checkedProps.value.href, void 0, false),
-				"data-loading": reflectedProp("loading", "loading", checkedProps.value.loading, void 0, false),
-				"data-pending": reflectedProp("pending", "pending", checkedProps.value.pending, void 0, false),
-				"data-rel": reflectedProp("rel", "rel", checkedProps.value.rel, void 0, false),
-				"data-shape": reflectedProp("shape", "shape", checkedProps.value.shape, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-stretch": reflectedProp("stretch", "stretch", checkedProps.value.stretch, void 0, false),
-				"data-target": reflectedProp("target", "target", checkedProps.value.target, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-type": reflectedProp("type", "type", checkedProps.value.type, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-align": unref(reflectedProp)("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-href": unref(reflectedProp)("href", "href", checkedProps.value.href, void 0, false),
+				"data-loading": unref(reflectedProp)("loading", "loading", checkedProps.value.loading, void 0, false),
+				"data-pending": unref(reflectedProp)("pending", "pending", checkedProps.value.pending, void 0, false),
+				"data-rel": unref(reflectedProp)("rel", "rel", checkedProps.value.rel, void 0, false),
+				"data-shape": unref(reflectedProp)("shape", "shape", checkedProps.value.shape, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-stretch": unref(reflectedProp)("stretch", "stretch", checkedProps.value.stretch, void 0, false),
+				"data-target": unref(reflectedProp)("target", "target", checkedProps.value.target, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-type": unref(reflectedProp)("type", "type", checkedProps.value.type, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-button-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [
 				createElementVNode("span", _hoisted_2, [checkedProps.value.loading || checkedProps.value.pending ? (openBlock(), createBlock(UiSpinner_default, {
 					key: 0,
+					class: "ui-spinner",
 					size: "sm"
 				})) : createCommentVNode("v-if", true), !(checkedProps.value.loading || checkedProps.value.pending) ? renderSlot(_ctx.$slots, "icon", {}, void 0, true, 1) : createCommentVNode("v-if", true)]),
 				createElementVNode("span", _hoisted_3, [renderSlot(_ctx.$slots, "default", {}, void 0, true)]),
 				createElementVNode("span", _hoisted_4, [renderSlot(_ctx.$slots, "action", {}, () => [createVNode(UiIcon_default, {
+					class: "ui-icon",
 					name: "chevron-right",
 					"aria-hidden": "true"
 				})], true)])
@@ -664,35 +633,37 @@ var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				values: { ...props }
 			}]]) : checkedProps.value.variant === "card" ? withDirectives((openBlock(), createElementBlock("button", mergeProps({
 				key: 1,
-				"data-component": "ui-button"
-			}, nativeAttrs(_ctx.$attrs), {
+				class: "ui-button"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
 				type: checkedProps.value.type ?? void 0,
 				disabled: checkedProps.value.disabled ?? void 0,
 				"aria-disabled": guardedBinding3.value,
 				"aria-busy": checkedProps.value.loading || checkedProps.value.pending,
-				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-href": reflectedProp("href", "href", checkedProps.value.href, void 0, false),
-				"data-loading": reflectedProp("loading", "loading", checkedProps.value.loading, void 0, false),
-				"data-pending": reflectedProp("pending", "pending", checkedProps.value.pending, void 0, false),
-				"data-rel": reflectedProp("rel", "rel", checkedProps.value.rel, void 0, false),
-				"data-shape": reflectedProp("shape", "shape", checkedProps.value.shape, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-stretch": reflectedProp("stretch", "stretch", checkedProps.value.stretch, void 0, false),
-				"data-target": reflectedProp("target", "target", checkedProps.value.target, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-type": reflectedProp("type", "type", checkedProps.value.type, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-align": unref(reflectedProp)("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-href": unref(reflectedProp)("href", "href", checkedProps.value.href, void 0, false),
+				"data-loading": unref(reflectedProp)("loading", "loading", checkedProps.value.loading, void 0, false),
+				"data-pending": unref(reflectedProp)("pending", "pending", checkedProps.value.pending, void 0, false),
+				"data-rel": unref(reflectedProp)("rel", "rel", checkedProps.value.rel, void 0, false),
+				"data-shape": unref(reflectedProp)("shape", "shape", checkedProps.value.shape, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-stretch": unref(reflectedProp)("stretch", "stretch", checkedProps.value.stretch, void 0, false),
+				"data-target": unref(reflectedProp)("target", "target", checkedProps.value.target, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-type": unref(reflectedProp)("type", "type", checkedProps.value.type, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-button-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [
 				createElementVNode("span", _hoisted_6, [checkedProps.value.loading || checkedProps.value.pending ? (openBlock(), createBlock(UiSpinner_default, {
 					key: 0,
+					class: "ui-spinner",
 					size: "sm"
 				})) : createCommentVNode("v-if", true), !(checkedProps.value.loading || checkedProps.value.pending) ? renderSlot(_ctx.$slots, "icon", {}, void 0, true, 1) : createCommentVNode("v-if", true)]),
 				createElementVNode("span", _hoisted_7, [renderSlot(_ctx.$slots, "default", {}, void 0, true)]),
 				createElementVNode("span", _hoisted_8, [renderSlot(_ctx.$slots, "action", {}, () => [createVNode(UiIcon_default, {
+					class: "ui-icon",
 					name: "chevron-right",
 					"aria-hidden": "true"
 				})], true)])
@@ -701,32 +672,35 @@ var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				values: { ...props }
 			}]]) : checkedProps.value.as === "a" ? withDirectives((openBlock(), createElementBlock("a", mergeProps({
 				key: 2,
-				"data-component": "ui-button"
-			}, nativeAttrs(_ctx.$attrs), {
+				class: "ui-button"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
 				href: guardedBinding4.value,
 				target: checkedProps.value.target ?? void 0,
 				rel: checkedProps.value.rel ?? void 0,
 				"aria-disabled": guardedBinding5.value,
 				"aria-busy": checkedProps.value.loading || checkedProps.value.pending,
 				tabindex: guardedBinding6.value,
-				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-href": reflectedProp("href", "href", checkedProps.value.href, void 0, false),
-				"data-loading": reflectedProp("loading", "loading", checkedProps.value.loading, void 0, false),
-				"data-pending": reflectedProp("pending", "pending", checkedProps.value.pending, void 0, false),
-				"data-rel": reflectedProp("rel", "rel", checkedProps.value.rel, void 0, false),
-				"data-shape": reflectedProp("shape", "shape", checkedProps.value.shape, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-stretch": reflectedProp("stretch", "stretch", checkedProps.value.stretch, void 0, false),
-				"data-target": reflectedProp("target", "target", checkedProps.value.target, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-type": reflectedProp("type", "type", checkedProps.value.type, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-align": unref(reflectedProp)("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-href": unref(reflectedProp)("href", "href", checkedProps.value.href, void 0, false),
+				"data-loading": unref(reflectedProp)("loading", "loading", checkedProps.value.loading, void 0, false),
+				"data-pending": unref(reflectedProp)("pending", "pending", checkedProps.value.pending, void 0, false),
+				"data-rel": unref(reflectedProp)("rel", "rel", checkedProps.value.rel, void 0, false),
+				"data-shape": unref(reflectedProp)("shape", "shape", checkedProps.value.shape, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-stretch": unref(reflectedProp)("stretch", "stretch", checkedProps.value.stretch, void 0, false),
+				"data-target": unref(reflectedProp)("target", "target", checkedProps.value.target, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-type": unref(reflectedProp)("type", "type", checkedProps.value.type, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-button-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [
-				checkedProps.value.loading || checkedProps.value.pending ? (openBlock(), createElementBlock("span", _hoisted_10, [createVNode(UiSpinner_default, { size: "sm" })])) : createCommentVNode("v-if", true),
+				checkedProps.value.loading || checkedProps.value.pending ? (openBlock(), createElementBlock("span", _hoisted_10, [createVNode(UiSpinner_default, {
+					class: "ui-spinner",
+					size: "sm"
+				})])) : createCommentVNode("v-if", true),
 				renderSlot(_ctx.$slots, "default", {}, void 0, true),
 				createElementVNode("span", _hoisted_11, [renderSlot(_ctx.$slots, "badge", {}, void 0, true)])
 			], 16, _hoisted_9)), [[unref(vPropValidity), {
@@ -734,30 +708,33 @@ var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				values: { ...props }
 			}]]) : withDirectives((openBlock(), createElementBlock("button", mergeProps({
 				key: 3,
-				"data-component": "ui-button"
-			}, nativeAttrs(_ctx.$attrs), {
+				class: "ui-button"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
 				type: checkedProps.value.type ?? void 0,
 				disabled: checkedProps.value.disabled ?? void 0,
 				"aria-disabled": guardedBinding7.value,
 				"aria-busy": checkedProps.value.loading || checkedProps.value.pending,
-				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-href": reflectedProp("href", "href", checkedProps.value.href, void 0, false),
-				"data-loading": reflectedProp("loading", "loading", checkedProps.value.loading, void 0, false),
-				"data-pending": reflectedProp("pending", "pending", checkedProps.value.pending, void 0, false),
-				"data-rel": reflectedProp("rel", "rel", checkedProps.value.rel, void 0, false),
-				"data-shape": reflectedProp("shape", "shape", checkedProps.value.shape, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-stretch": reflectedProp("stretch", "stretch", checkedProps.value.stretch, void 0, false),
-				"data-target": reflectedProp("target", "target", checkedProps.value.target, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-type": reflectedProp("type", "type", checkedProps.value.type, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-align": unref(reflectedProp)("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-href": unref(reflectedProp)("href", "href", checkedProps.value.href, void 0, false),
+				"data-loading": unref(reflectedProp)("loading", "loading", checkedProps.value.loading, void 0, false),
+				"data-pending": unref(reflectedProp)("pending", "pending", checkedProps.value.pending, void 0, false),
+				"data-rel": unref(reflectedProp)("rel", "rel", checkedProps.value.rel, void 0, false),
+				"data-shape": unref(reflectedProp)("shape", "shape", checkedProps.value.shape, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-stretch": unref(reflectedProp)("stretch", "stretch", checkedProps.value.stretch, void 0, false),
+				"data-target": unref(reflectedProp)("target", "target", checkedProps.value.target, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-type": unref(reflectedProp)("type", "type", checkedProps.value.type, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-button-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [
-				checkedProps.value.loading || checkedProps.value.pending ? (openBlock(), createElementBlock("span", _hoisted_13, [createVNode(UiSpinner_default, { size: "sm" })])) : createCommentVNode("v-if", true),
+				checkedProps.value.loading || checkedProps.value.pending ? (openBlock(), createElementBlock("span", _hoisted_13, [createVNode(UiSpinner_default, {
+					class: "ui-spinner",
+					size: "sm"
+				})])) : createCommentVNode("v-if", true),
 				renderSlot(_ctx.$slots, "default", {}, void 0, true),
 				createElementVNode("span", _hoisted_14, [renderSlot(_ctx.$slots, "badge", {}, void 0, true)])
 			], 16, _hoisted_12)), [[unref(vPropValidity), {
@@ -766,6 +743,6 @@ var UiButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-8789629f"]]);
+}), [["__scopeId", "data-v-4a3c5494"]]);
 //#endregion
 export { UiButton_default as t };

package/vue/chunks/UiCallout.js

@@ -1,6 +1,6 @@
-import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { i as checkHydratedRoot, p as nativeAttrs, t as _plugin_vue_export_helper_default, v as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp } from "./props.js";
-import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, renderSlot, toDisplayString, unref, watchSyncEffect, withDirectives } from "vue";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, openBlock, renderSlot, toDisplayString, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiCallout.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
 	"data-heading",
@@ -147,35 +147,17 @@ var UiCallout_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 		watchSyncEffect(() => {
 			checkedProps.value;
 		});
-		function nativeAttrs(attrs) {
-			const names = Object.keys(attrs);
-			if (!names.some((name) => Object.hasOwn(Object.prototype, name))) return attrs;
-			return Object.fromEntries(names.map((name) => [Object.hasOwn(Object.prototype, name) ? name === "__proto__" ? "__Proto__" : name[0].toUpperCase() + name.slice(1) : name, attrs[name]]));
-		}
-		const componentInstance = getCurrentInstance();
-		function reflectedProp(name, kebab, value, fallback, bound, separator) {
-			const incoming = componentInstance?.vnode.props;
-			if (!bound && (incoming === null || incoming === void 0 || !Object.hasOwn(incoming, name) && !Object.hasOwn(incoming, kebab))) return fallback;
-			if (value === null || value === void 0) return void 0;
-			return Array.isArray(value) && separator !== void 0 ? value.join(separator) : typeof value === "object" ? JSON.stringify(value) : String(value);
-		}
-		const hydrationNode = getCurrentInstance()?.vnode.el;
-		if (typeof window !== "undefined" && hydrationNode != null && (!(hydrationNode instanceof Element) || hydrationNode.localName !== "div")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-callout> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-callout> has an incompatible root."
-			})
-		});
+		const reflectedProp = useReflectedProp();
+		checkHydratedRoot("div", "ui-callout");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [checkedProps.value.tone && "tone", checkedProps.value.tone != null && `tone=${encodeURIComponent(checkedProps.value.tone)}`].filter(Boolean).join(" "));
 		return (_ctx, _cache) => {
 			return withDirectives((openBlock(), createElementBlock("div", mergeProps({
-				"data-component": "ui-callout",
+				class: "ui-callout",
 				role: "note"
-			}, nativeAttrs(_ctx.$attrs), {
-				"data-heading": reflectedProp("heading", "heading", checkedProps.value.heading, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
+			}, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-heading": unref(reflectedProp)("heading", "heading", checkedProps.value.heading, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
 				"data-ui-callout-state": hostState.value || void 0
 			}), [createElementVNode("span", _hoisted_2, [
 				checkedProps.value.tone === "info" ? (openBlock(), createElementBlock("svg", _hoisted_3, [..._cache[0] || (_cache[0] = [
@@ -227,6 +209,6 @@ var UiCallout_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-492ee9df"]]);
+}), [["__scopeId", "data-v-612d23a6"]]);
 //#endregion
 export { UiCallout_default as t };

package/vue/chunks/UiCard.js

@@ -1,7 +1,6 @@
-import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { n as preserveRootFocus } from "./host.js";
+import { h as preserveRootFocus, i as checkHydratedRoot, p as nativeAttrs, t as _plugin_vue_export_helper_default, v as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp } from "./props.js";
-import { computed, createElementBlock, defineComponent, getCurrentInstance, mergeProps, openBlock, renderSlot, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiCard.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
 	"data-as",
@@ -180,29 +179,10 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 		watchSyncEffect(() => {
 			checkedProps.value;
 		});
-		function nativeAttrs(attrs) {
-			const names = Object.keys(attrs);
-			if (!names.some((name) => Object.hasOwn(Object.prototype, name))) return attrs;
-			return Object.fromEntries(names.map((name) => [Object.hasOwn(Object.prototype, name) ? name === "__proto__" ? "__Proto__" : name[0].toUpperCase() + name.slice(1) : name, attrs[name]]));
-		}
-		const componentInstance = getCurrentInstance();
-		function reflectedProp(name, kebab, value, fallback, bound, separator) {
-			const incoming = componentInstance?.vnode.props;
-			if (!bound && (incoming === null || incoming === void 0 || !Object.hasOwn(incoming, name) && !Object.hasOwn(incoming, kebab))) return fallback;
-			if (value === null || value === void 0) return void 0;
-			return Array.isArray(value) && separator !== void 0 ? value.join(separator) : typeof value === "object" ? JSON.stringify(value) : String(value);
-		}
-		const hydrationInstance = getCurrentInstance();
+		const reflectedProp = useReflectedProp();
 		const root = useTemplateRef("@html-next/root");
 		preserveRootFocus(root);
-		const hydrationNode = hydrationInstance?.vnode.el;
-		if (typeof window !== "undefined" && hydrationNode != null && (!(hydrationNode instanceof Element) || hydrationNode.localName !== (checkedProps.value.as === "section" ? "section" : checkedProps.value.as === "article" ? "article" : checkedProps.value.as === "aside" ? "aside" : "div"))) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-card> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-card> has an incompatible root."
-			})
-		});
+		checkHydratedRoot(checkedProps.value.as === "section" ? "section" : checkedProps.value.as === "article" ? "article" : checkedProps.value.as === "aside" ? "aside" : "div", "ui-card");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.padding && "padding",
@@ -217,13 +197,13 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 		return (_ctx, _cache) => {
 			return checkedProps.value.as === "section" ? withDirectives((openBlock(), createElementBlock("section", mergeProps({
 				key: 0,
-				"data-component": "ui-card"
-			}, nativeAttrs(_ctx.$attrs), {
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				class: "ui-card"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-padding": unref(reflectedProp)("padding", "padding", checkedProps.value.padding, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1)), [[unref(vPropValidity), {
@@ -231,13 +211,13 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				values: { ...props }
 			}]]) : checkedProps.value.as === "article" ? withDirectives((openBlock(), createElementBlock("article", mergeProps({
 				key: 1,
-				"data-component": "ui-card"
-			}, nativeAttrs(_ctx.$attrs), {
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				class: "ui-card"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-padding": unref(reflectedProp)("padding", "padding", checkedProps.value.padding, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_2)), [[unref(vPropValidity), {
@@ -245,13 +225,13 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				values: { ...props }
 			}]]) : checkedProps.value.as === "aside" ? withDirectives((openBlock(), createElementBlock("aside", mergeProps({
 				key: 2,
-				"data-component": "ui-card"
-			}, nativeAttrs(_ctx.$attrs), {
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				class: "ui-card"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-padding": unref(reflectedProp)("padding", "padding", checkedProps.value.padding, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_3)), [[unref(vPropValidity), {
@@ -259,13 +239,13 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				values: { ...props }
 			}]]) : withDirectives((openBlock(), createElementBlock("div", mergeProps({
 				key: 3,
-				"data-component": "ui-card"
-			}, nativeAttrs(_ctx.$attrs), {
-				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
-				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-tone": reflectedProp("tone", "tone", checkedProps.value.tone, void 0, false),
-				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				class: "ui-card"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-as": unref(reflectedProp)("as", "as", checkedProps.value.as, void 0, false),
+				"data-padding": unref(reflectedProp)("padding", "padding", checkedProps.value.padding, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-tone": unref(reflectedProp)("tone", "tone", checkedProps.value.tone, void 0, false),
+				"data-variant": unref(reflectedProp)("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
 				ref: "@html-next/root"
 			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_4)), [[unref(vPropValidity), {
@@ -274,6 +254,6 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-b5f8424c"]]);
+}), [["__scopeId", "data-v-21693816"]]);
 //#endregion
 export { UiCard_default as t };

package/vue/chunks/UiCheckbox.js

@@ -1,5 +1,4 @@
-import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { r as useComponentHost, t as createDispatch } from "./host.js";
+import { _ as useComponentHost, i as checkHydratedRoot, o as createDispatch, p as nativeAttrs, t as _plugin_vue_export_helper_default, v as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp, r as propValidityState, t as acceptsControllerWrite } from "./props.js";
 import { r as vBindControl } from "./control.js";
 import { computed, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, provide, ref, renderSlot, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
@@ -27,14 +26,6 @@ var _hoisted_2 = [
 ];
 var _hoisted_3 = { class: "text" };
 var _hoisted_4 = { class: "label" };
-var htmlNextAuthoredCheck2Reported = /* @__PURE__ */ new Set();
-function htmlNextAuthoredCheck2(accepted, location, message) {
-	if (!accepted && !htmlNextAuthoredCheck2Reported.has(location)) {
-		htmlNextAuthoredCheck2Reported.add(location);
-		console.warn(message);
-	}
-	return accepted;
-}
 //#endregion
 //#region .build/vue/UiCheckbox.vue
 var UiCheckbox_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
@@ -235,38 +226,15 @@ var UiCheckbox_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 		watchSyncEffect(() => {
 			checkedProps.value;
 		});
-		function nativeAttrs(attrs) {
-			const names = Object.keys(attrs);
-			if (!names.some((name) => Object.hasOwn(Object.prototype, name))) return attrs;
-			return Object.fromEntries(names.map((name) => [Object.hasOwn(Object.prototype, name) ? name === "__proto__" ? "__Proto__" : name[0].toUpperCase() + name.slice(1) : name, attrs[name]]));
-		}
-		const componentInstance = getCurrentInstance();
-		function reflectedProp(name, kebab, value, fallback, bound, separator) {
-			const incoming = componentInstance?.vnode.props;
-			if (!bound && (incoming === null || incoming === void 0 || !Object.hasOwn(incoming, name) && !Object.hasOwn(incoming, kebab))) return fallback;
-			if (value === null || value === void 0) return void 0;
-			return Array.isArray(value) && separator !== void 0 ? value.join(separator) : typeof value === "object" ? JSON.stringify(value) : String(value);
-		}
+		const reflectedProp = useReflectedProp();
 		const hydrationInstance = getCurrentInstance();
 		const emit = __emit;
 		const root = ref(null);
 		const inputElement = useTemplateRef("inputElement");
 		const descriptionElement = useTemplateRef("descriptionElement");
 		const internalChecked = ref(false);
-		let guardedPrevious;
-		computed(() => {
-			if (!htmlNextAuthoredCheck2(internalChecked.value == null || typeof internalChecked.value === "boolean", "$internalChecked:internalChecked", "./components/ui-checkbox/ui-checkbox.html: HR007: Reference internalChecked does not satisfy its declared type.")) return guardedPrevious;
-			return guardedPrevious = internalChecked.value;
-		});
 		provide("html-next:ui-checkbox:internalChecked", internalChecked);
-		const hydrationNode = hydrationInstance?.vnode.el;
-		if (typeof window !== "undefined" && hydrationNode != null && (!(hydrationNode instanceof Element) || hydrationNode.localName !== "label")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-checkbox> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-checkbox> has an incompatible root."
-			})
-		});
+		checkHydratedRoot("label", "ui-checkbox");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.invalid && "invalid",
@@ -322,16 +290,16 @@ var UiCheckbox_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			state: { internalChecked }
 		});
 		return (_ctx, _cache) => {
-			return withDirectives((openBlock(), createElementBlock("label", mergeProps({ "data-component": "ui-checkbox" }, nativeAttrs(_ctx.$attrs), {
-				"data-checked": reflectedProp("checked", "checked", checkedProps.value.checked, void 0, false),
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-indeterminate": reflectedProp("indeterminate", "indeterminate", checkedProps.value.indeterminate, void 0, false),
-				"data-invalid": reflectedProp("invalid", "invalid", checkedProps.value.invalid, void 0, false),
-				"data-label": reflectedProp("label", "label", checkedProps.value.label, void 0, false),
-				"data-name": reflectedProp("name", "name", checkedProps.value.name, void 0, false),
-				"data-required": reflectedProp("required", "required", checkedProps.value.required, void 0, false),
-				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
-				"data-value": reflectedProp("value", "value", checkedProps.value.value, void 0, false),
+			return withDirectives((openBlock(), createElementBlock("label", mergeProps({ class: "ui-checkbox" }, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-checked": unref(reflectedProp)("checked", "checked", checkedProps.value.checked, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-indeterminate": unref(reflectedProp)("indeterminate", "indeterminate", checkedProps.value.indeterminate, void 0, false),
+				"data-invalid": unref(reflectedProp)("invalid", "invalid", checkedProps.value.invalid, void 0, false),
+				"data-label": unref(reflectedProp)("label", "label", checkedProps.value.label, void 0, false),
+				"data-name": unref(reflectedProp)("name", "name", checkedProps.value.name, void 0, false),
+				"data-required": unref(reflectedProp)("required", "required", checkedProps.value.required, void 0, false),
+				"data-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-value": unref(reflectedProp)("value", "value", checkedProps.value.value, void 0, false),
 				"data-ui-checkbox-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
@@ -363,6 +331,6 @@ var UiCheckbox_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-a7d28848"]]);
+}), [["__scopeId", "data-v-9ee4a683"]]);
 //#endregion
 export { UiCheckbox_default as t };