@threadlabs/looma 0.28.5 → 0.28.7

package/vue/chunks/UiFloatingActionButton.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, y 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, watchSyncEffect, withDirectives } from "vue";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiFloatingActionButton.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
 	"aria-label",
@@ -86,38 +86,20 @@ var UiFloatingActionButton_default = /*#__PURE__*/ _plugin_vue_export_helper_def
 		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 !== "button")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-floating-action-button> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-floating-action-button> has an incompatible root."
-			})
-		});
+		const reflectedProp = useReflectedProp();
+		checkHydratedRoot("button", "ui-floating-action-button");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [checkedProps.value.mobileOnly && "mobileOnly"].filter(Boolean).join(" "));
 		return (_ctx, _cache) => {
 			return withDirectives((openBlock(), createElementBlock("button", mergeProps({
-				"data-component": "ui-floating-action-button",
+				class: "ui-floating-action-button",
 				type: "button"
-			}, nativeAttrs(_ctx.$attrs), {
+			}, unref(nativeAttrs)(_ctx.$attrs), {
 				"aria-label": checkedProps.value.label ?? void 0,
 				disabled: checkedProps.value.disabled ?? void 0,
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-label": reflectedProp("label", "label", checkedProps.value.label, void 0, false),
-				"data-mobile-only": reflectedProp("mobileOnly", "mobile-only", checkedProps.value.mobileOnly, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-label": unref(reflectedProp)("label", "label", checkedProps.value.label, void 0, false),
+				"data-mobile-only": unref(reflectedProp)("mobileOnly", "mobile-only", checkedProps.value.mobileOnly, void 0, false),
 				"data-ui-floating-action-button-state": hostState.value || void 0
 			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1)), [[unref(vPropValidity), {
 				contract: propValidityContract,
@@ -125,6 +107,6 @@ var UiFloatingActionButton_default = /*#__PURE__*/ _plugin_vue_export_helper_def
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-955cfa65"]]);
+}), [["__scopeId", "data-v-3d55b8dc"]]);
 //#endregion
 export { UiFloatingActionButton_default as t };

package/vue/chunks/UiFormField.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 { i as checkHydratedRoot, o as createDispatch, p as nativeAttrs, t as _plugin_vue_export_helper_default, v as useComponentHost, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp, r as propValidityState } from "./props.js";
 import { computed, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, renderSlot, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiFormField.vue?vue&type=script&setup=true&lang.ts
@@ -89,28 +88,10 @@ var UiFormField_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 		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 = ref(null);
-		const hydrationNode = hydrationInstance?.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-form-field> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-form-field> has an incompatible root."
-			})
-		});
+		checkHydratedRoot("div", "ui-form-field");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [checkedProps.value.invalid && "invalid"].filter(Boolean).join(" "));
 		const dispatch = createDispatch(root);
@@ -138,10 +119,10 @@ var UiFormField_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 			}, name)
 		});
 		return (_ctx, _cache) => {
-			return withDirectives((openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-form-field" }, nativeAttrs(_ctx.$attrs), {
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-invalid": reflectedProp("invalid", "invalid", checkedProps.value.invalid, void 0, false),
-				"data-required": reflectedProp("required", "required", checkedProps.value.required, void 0, false),
+			return withDirectives((openBlock(), createElementBlock("div", mergeProps({ class: "ui-form-field" }, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-invalid": unref(reflectedProp)("invalid", "invalid", checkedProps.value.invalid, void 0, false),
+				"data-required": unref(reflectedProp)("required", "required", checkedProps.value.required, void 0, false),
 				"data-ui-form-field-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
@@ -156,6 +137,6 @@ var UiFormField_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-3feaf986"]]);
+}), [["__scopeId", "data-v-50ee887a"]]);
 //#endregion
 export { UiFormField_default as t };

package/vue/chunks/UiGrid.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, y 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, watchSyncEffect, withDirectives } from "vue";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiGrid.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
 	"data-columns",
@@ -93,26 +93,8 @@ var UiGrid_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 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-grid> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-grid> has an incompatible root."
-			})
-		});
+		const reflectedProp = useReflectedProp();
+		checkHydratedRoot("div", "ui-grid");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.gap && "gap",
@@ -121,11 +103,11 @@ var UiGrid_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			checkedProps.value.min != null && `min=${encodeURIComponent(checkedProps.value.min)}`
 		].filter(Boolean).join(" "));
 		return (_ctx, _cache) => {
-			return withDirectives((openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-grid" }, nativeAttrs(_ctx.$attrs), {
-				style: { "--_grid-column-cap": checkedProps.value.columns ?? void 0 },
-				"data-columns": reflectedProp("columns", "columns", checkedProps.value.columns, void 0, false),
-				"data-gap": reflectedProp("gap", "gap", checkedProps.value.gap, void 0, false),
-				"data-min": reflectedProp("min", "min", checkedProps.value.min, void 0, false),
+			return withDirectives((openBlock(), createElementBlock("div", mergeProps({ class: "ui-grid" }, unref(nativeAttrs)(_ctx.$attrs), {
+				style: { "--_grid-column-cap": checkedProps.value.columns?.toString() },
+				"data-columns": unref(reflectedProp)("columns", "columns", checkedProps.value.columns, void 0, false),
+				"data-gap": unref(reflectedProp)("gap", "gap", checkedProps.value.gap, void 0, false),
+				"data-min": unref(reflectedProp)("min", "min", checkedProps.value.min, void 0, false),
 				"data-ui-grid-state": hostState.value || void 0
 			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1)), [[unref(vPropValidity), {
 				contract: propValidityContract,
@@ -133,6 +115,6 @@ var UiGrid_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-d42a2c9e"]]);
+}), [["__scopeId", "data-v-30a8e139"]]);
 //#endregion
 export { UiGrid_default as t };

package/vue/chunks/UiIcon.js

@@ -1,6 +1,6 @@
-import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { d as list, i as checkHydratedRoot, p as nativeAttrs, r as attribute, s as cycleCheckedComputed, t as _plugin_vue_export_helper_default, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp } from "./props.js";
-import { Fragment, computed, createCommentVNode, createElementBlock, defineComponent, getCurrentInstance, mergeProps, openBlock, renderList, unref, watchSyncEffect, withDirectives } from "vue";
+import { Fragment, computed, createCommentVNode, createElementBlock, defineComponent, mergeProps, openBlock, renderList, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiIcon.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["data-name"];
 var _hoisted_2 = {
@@ -62,42 +62,7 @@ var UiIcon_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();
-		function cycleCheckedComputed(evaluate) {
-			const value = computed(evaluate);
-			let reading = false;
-			return new Proxy(value, { get(target, property) {
-				if (property !== "value") return Reflect.get(target, property);
-				if (reading) {
-					const message = "A reactive computed value depends on itself.";
-					throw Object.assign(/* @__PURE__ */ new Error(`HR006: ${message}`), {
-						name: "HtmlDiagnosticError",
-						diagnostic: Object.freeze({
-							code: "HR006",
-							message
-						})
-					});
-				}
-				reading = true;
-				try {
-					return target.value;
-				} finally {
-					reading = false;
-				}
-			} });
-		}
+		const reflectedProp = useReflectedProp();
 		const shapes = cycleCheckedComputed(() => ({
 			"align-center": [
 				{
@@ -1191,56 +1156,38 @@ var UiIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				d: "m6 6 12 12"
 			}]
 		})[checkedProps.value.name]);
-		const hydrationNode = hydrationInstance?.vnode.el;
-		if (typeof window !== "undefined" && hydrationNode != null && (!(hydrationNode instanceof Element) || hydrationNode.localName !== "span")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-icon> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-icon> has an incompatible root."
-			})
-		});
-		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 list(value) {
-			return Array.isArray(value) ? value : [];
-		}
+		checkHydratedRoot("span", "ui-icon");
 		return (_ctx, _cache) => {
 			return withDirectives((openBlock(), createElementBlock("span", mergeProps({
-				"data-component": "ui-icon",
+				class: "ui-icon",
 				"aria-hidden": "true"
-			}, nativeAttrs(_ctx.$attrs), { "data-name": reflectedProp("name", "name", checkedProps.value.name, void 0, false) }), [(openBlock(), createElementBlock("svg", _hoisted_2, [(openBlock(true), createElementBlock(Fragment, null, renderList(list(unref(shapes)), (shape, index) => {
+			}, unref(nativeAttrs)(_ctx.$attrs), { "data-name": unref(reflectedProp)("name", "name", checkedProps.value.name, void 0, false) }), [(openBlock(), createElementBlock("svg", _hoisted_2, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(list)(unref(shapes)), (shape, index) => {
 				return openBlock(), createElementBlock("g", { key: index }, [
 					shape.tag === "path" ? (openBlock(), createElementBlock("path", {
 						key: 0,
-						d: attribute(shape.d)
+						d: unref(attribute)(shape.d)
 					}, null, 8, _hoisted_3)) : createCommentVNode("v-if", true),
 					shape.tag === "circle" ? (openBlock(), createElementBlock("circle", {
 						key: 1,
-						cx: attribute(shape.cx),
-						cy: attribute(shape.cy),
-						r: attribute(shape.r)
+						cx: unref(attribute)(shape.cx),
+						cy: unref(attribute)(shape.cy),
+						r: unref(attribute)(shape.r)
 					}, null, 8, _hoisted_4)) : createCommentVNode("v-if", true),
 					shape.tag === "rect" ? (openBlock(), createElementBlock("rect", {
 						key: 2,
-						x: attribute(shape.x),
-						y: attribute(shape.y),
-						width: attribute(shape.width),
-						height: attribute(shape.height),
-						rx: attribute(shape.rx),
-						ry: attribute(shape.ry)
+						x: unref(attribute)(shape.x),
+						y: unref(attribute)(shape.y),
+						width: unref(attribute)(shape.width),
+						height: unref(attribute)(shape.height),
+						rx: unref(attribute)(shape.rx),
+						ry: unref(attribute)(shape.ry)
 					}, null, 8, _hoisted_5)) : createCommentVNode("v-if", true),
 					shape.tag === "line" ? (openBlock(), createElementBlock("line", {
 						key: 3,
-						x1: attribute(shape.x1),
-						y1: attribute(shape.y1),
-						x2: attribute(shape.x2),
-						y2: attribute(shape.y2)
+						x1: unref(attribute)(shape.x1),
+						y1: unref(attribute)(shape.y1),
+						x2: unref(attribute)(shape.x2),
+						y2: unref(attribute)(shape.y2)
 					}, null, 8, _hoisted_6)) : createCommentVNode("v-if", true)
 				]);
 			}), 128))]))], 16, _hoisted_1)), [[unref(vPropValidity), {
@@ -1249,6 +1196,6 @@ var UiIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-e1de9e8e"]]);
+}), [["__scopeId", "data-v-9f31f684"]]);
 //#endregion
 export { UiIcon_default as t };

package/vue/chunks/UiIconButton.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 { a as concat, i as checkHydratedRoot, o as createDispatch, p as nativeAttrs, r as attribute, t as _plugin_vue_export_helper_default, v as useComponentHost, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp, r as propValidityState } from "./props.js";
 import { t as UiSpinner_default } from "./UiSpinner.js";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, renderSlot, unref, watchSyncEffect, withDirectives } from "vue";
@@ -261,18 +260,7 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 		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 = ref(null);
 		let guardedPrevious = null;
@@ -292,14 +280,7 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				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 !== "button")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-icon-button> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-icon-button> has an incompatible root."
-			})
-		});
+		checkHydratedRoot("button", "ui-icon-button");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.tone && "tone",
@@ -348,45 +329,32 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				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 withDirectives((openBlock(), createElementBlock("button", mergeProps({
-				"data-component": "ui-icon-button",
+				class: "ui-icon-button",
 				type: "button"
-			}, nativeAttrs(_ctx.$attrs), {
+			}, unref(nativeAttrs)(_ctx.$attrs), {
 				disabled: checkedProps.value.disabled ?? void 0,
 				"aria-label": checkedProps.value.label ?? void 0,
 				"aria-disabled": guarded.value,
 				"aria-busy": checkedProps.value.loading || checkedProps.value.pending,
-				"data-anticipatory": reflectedProp("anticipatory", "anticipatory", checkedProps.value.anticipatory, void 0, false),
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-guide": reflectedProp("guide", "guide", checkedProps.value.guide, void 0, false),
-				"data-label": reflectedProp("label", "label", checkedProps.value.label, void 0, false),
-				"data-loading": reflectedProp("loading", "loading", checkedProps.value.loading, void 0, false),
-				"data-match-button": reflectedProp("matchButton", "match-button", checkedProps.value.matchButton, void 0, true),
-				"data-pending": reflectedProp("pending", "pending", checkedProps.value.pending, void 0, false),
-				"data-round": reflectedProp("round", "round", checkedProps.value.round, 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),
+				"data-anticipatory": unref(reflectedProp)("anticipatory", "anticipatory", checkedProps.value.anticipatory, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-guide": unref(reflectedProp)("guide", "guide", checkedProps.value.guide, void 0, false),
+				"data-label": unref(reflectedProp)("label", "label", checkedProps.value.label, void 0, false),
+				"data-loading": unref(reflectedProp)("loading", "loading", checkedProps.value.loading, void 0, false),
+				"data-match-button": unref(reflectedProp)("matchButton", "match-button", checkedProps.value.matchButton, void 0, true),
+				"data-pending": unref(reflectedProp)("pending", "pending", checkedProps.value.pending, void 0, false),
+				"data-round": unref(reflectedProp)("round", "round", checkedProps.value.round, 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-icon-button-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
 			}), [checkedProps.value.loading || checkedProps.value.pending ? (openBlock(), createBlock(UiSpinner_default, {
 				key: 0,
+				class: "ui-spinner",
 				size: "sm"
 			})) : createCommentVNode("v-if", true), createElementVNode("span", _hoisted_2, [renderSlot(_ctx.$slots, "default")])], 16, _hoisted_1)), [[unref(vPropValidity), {
 				contract: propValidityContract,
@@ -394,6 +362,6 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-ea2a5496"]]);
+}), [["__scopeId", "data-v-4a58a364"]]);
 //#endregion
 export { UiIconButton_default as t };

package/vue/chunks/UiImage.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 { i as checkHydratedRoot, o as createDispatch, p as nativeAttrs, t as _plugin_vue_export_helper_default, v as useComponentHost, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, n as checkedProp, r as propValidityState } from "./props.js";
 import { computed, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, renderSlot, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiImage.vue?vue&type=script&setup=true&lang.ts
@@ -181,30 +180,12 @@ var UiImage_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 reflectedProp = useReflectedProp();
 		const hydrationInstance = getCurrentInstance();
 		const emit = __emit;
 		const root = ref(null);
 		const frameElement = useTemplateRef("frameElement");
-		const hydrationNode = hydrationInstance?.vnode.el;
-		if (typeof window !== "undefined" && hydrationNode != null && (!(hydrationNode instanceof Element) || hydrationNode.localName !== "figure")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-image> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-image> has an incompatible root."
-			})
-		});
+		checkHydratedRoot("figure", "ui-image");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.placement && "placement",
@@ -250,14 +231,14 @@ var UiImage_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			refs: { frame: frameElement }
 		});
 		return (_ctx, _cache) => {
-			return withDirectives((openBlock(), createElementBlock("figure", mergeProps({ "data-component": "ui-image" }, nativeAttrs(_ctx.$attrs), {
-				"data-alt": reflectedProp("alt", "alt", checkedProps.value.alt, void 0, false),
-				"data-height": reflectedProp("height", "height", checkedProps.value.height, void 0, false),
-				"data-placement": reflectedProp("placement", "placement", checkedProps.value.placement, void 0, false),
-				"data-resizable": reflectedProp("resizable", "resizable", checkedProps.value.resizable, void 0, false),
-				"data-selected": reflectedProp("selected", "selected", checkedProps.value.selected, void 0, false),
-				"data-src": reflectedProp("src", "src", checkedProps.value.src, void 0, false),
-				"data-width": reflectedProp("width", "width", checkedProps.value.width, void 0, false),
+			return withDirectives((openBlock(), createElementBlock("figure", mergeProps({ class: "ui-image" }, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-alt": unref(reflectedProp)("alt", "alt", checkedProps.value.alt, void 0, false),
+				"data-height": unref(reflectedProp)("height", "height", checkedProps.value.height, void 0, false),
+				"data-placement": unref(reflectedProp)("placement", "placement", checkedProps.value.placement, void 0, false),
+				"data-resizable": unref(reflectedProp)("resizable", "resizable", checkedProps.value.resizable, void 0, false),
+				"data-selected": unref(reflectedProp)("selected", "selected", checkedProps.value.selected, void 0, false),
+				"data-src": unref(reflectedProp)("src", "src", checkedProps.value.src, void 0, false),
+				"data-width": unref(reflectedProp)("width", "width", checkedProps.value.width, void 0, false),
 				"data-ui-image-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
@@ -269,8 +250,8 @@ var UiImage_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 				renderSlot(_ctx.$slots, "media", {}, () => [createElementVNode("img", {
 					src: checkedProps.value.src ?? void 0,
 					alt: checkedProps.value.alt ?? void 0,
-					width: checkedProps.value.width ?? void 0,
-					height: checkedProps.value.height ?? void 0
+					width: checkedProps.value.width?.toString(),
+					height: checkedProps.value.height?.toString()
 				}, null, 8, _hoisted_2)]),
 				createElementVNode("div", {
 					class: "handles",
@@ -308,6 +289,6 @@ var UiImage_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-bfb3171c"]]);
+}), [["__scopeId", "data-v-73881051"]]);
 //#endregion
 export { UiImage_default as t };

package/vue/chunks/UiInput.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 { i as checkHydratedRoot, o as createDispatch, p as nativeAttrs, t as _plugin_vue_export_helper_default, v as useComponentHost, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
 import { a as vPropValidity, i as selectedPropNode, n as checkedProp, r as propValidityState } from "./props.js";
 import { n as readBoundControl, r as vBindControl } from "./control.js";
 import { computed, createElementBlock, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, unref, watchSyncEffect, withDirectives } from "vue";
@@ -627,18 +626,7 @@ var UiInput_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 reflectedProp = useReflectedProp();
 		const hydrationInstance = getCurrentInstance();
 		const emit = __emit;
 		const model = computed({
@@ -646,14 +634,7 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			set: (value) => emit("update:modelValue", value)
 		});
 		const root = ref(null);
-		const hydrationNode = hydrationInstance?.vnode.el;
-		if (typeof window !== "undefined" && hydrationNode != null && (!(hydrationNode instanceof Element) || hydrationNode.localName !== "input")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-input> has an incompatible root."), {
-			name: "HtmlDiagnosticError",
-			diagnostic: Object.freeze({
-				code: "HR005",
-				message: "Server markup for <ui-input> has an incompatible root."
-			})
-		});
+		checkHydratedRoot("input", "ui-input");
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [checkedProps.value.size && "size", checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`].filter(Boolean).join(" "));
 		const dispatch = createDispatch(root);
@@ -688,19 +669,19 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			}, name)
 		});
 		return (_ctx, _cache) => {
-			return withDirectives((openBlock(), createElementBlock("input", mergeProps({ "data-component": "ui-input" }, nativeAttrs(_ctx.$attrs), {
+			return withDirectives((openBlock(), createElementBlock("input", mergeProps({ class: "ui-input" }, unref(nativeAttrs)(_ctx.$attrs), {
 				type: checkedProps.value.type ?? void 0,
 				disabled: checkedProps.value.disabled ?? void 0,
 				readonly: checkedProps.value.readonly ?? void 0,
 				required: checkedProps.value.required ?? void 0,
 				"aria-invalid": checkedProps.value.invalid ?? void 0,
-				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
-				"data-invalid": reflectedProp("invalid", "invalid", checkedProps.value.invalid, void 0, false),
-				"data-readonly": reflectedProp("readonly", "readonly", checkedProps.value.readonly, 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-type": reflectedProp("type", "type", checkedProps.value.type, void 0, false),
-				"data-value": reflectedProp("value", "value", checkedProps.value.value, void 0, false),
+				"data-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-invalid": unref(reflectedProp)("invalid", "invalid", checkedProps.value.invalid, void 0, false),
+				"data-readonly": unref(reflectedProp)("readonly", "readonly", checkedProps.value.readonly, 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-type": unref(reflectedProp)("type", "type", checkedProps.value.type, void 0, false),
+				"data-value": unref(reflectedProp)("value", "value", checkedProps.value.value, void 0, false),
 				onInput: _cache[0] || (_cache[0] = ($event) => model.value = unref(readBoundControl)($event.currentTarget)),
 				"data-ui-input-state": hostState.value || void 0,
 				ref_key: "root",
@@ -720,6 +701,6 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-3c4d919b"]]);
+}), [["__scopeId", "data-v-a8c06d86"]]);
 //#endregion
 export { UiInput_default as t };