@threadlabs/looma 0.19.1 → 0.20.0

package/vue/chunks/UiText.js

@@ -1,82 +1,409 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot } from "vue";
+import { n as preserveRootFocus } from "./host.js";
+import { t as checkedProp } from "./props.js";
+import { computed, createElementBlock, defineComponent, getCurrentInstance, mergeProps, openBlock, renderSlot, useTemplateRef, watchSyncEffect } from "vue";
 //#region .build/vue/UiText.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = ["data-ui-text-state"];
-var _hoisted_2 = ["data-ui-text-state"];
-var _hoisted_3 = ["data-ui-text-state"];
-var _hoisted_4 = ["data-ui-text-state"];
-var _hoisted_5 = ["data-ui-text-state"];
-var _hoisted_6 = ["data-ui-text-state"];
-var _hoisted_7 = ["data-ui-text-state"];
-var _hoisted_8 = ["data-ui-text-state"];
-var _hoisted_9 = ["data-ui-text-state"];
-var _hoisted_10 = ["data-ui-text-state"];
-var _hoisted_11 = ["data-ui-text-state"];
+var _hoisted_1 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_2 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_3 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_4 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_5 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_6 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_7 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_8 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_9 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_10 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
+var _hoisted_11 = [
+	"data-align",
+	"data-as",
+	"data-size",
+	"data-tone",
+	"data-truncate",
+	"data-variant",
+	"data-weight",
+	"data-ui-text-state"
+];
 //#endregion
 //#region .build/vue/UiText.vue
 var UiText_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
 	inheritAttrs: false,
 	__name: "UiText",
 	props: {
-		align: { default: "start" },
-		as: { default: "p" },
-		size: { default: "inherit" },
-		tone: { default: "default" },
+		align: {
+			type: null,
+			default: "start"
+		},
+		as: {
+			type: null,
+			default: "p"
+		},
+		size: {
+			type: null,
+			default: "inherit"
+		},
+		tone: {
+			type: null,
+			default: "default"
+		},
 		truncate: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
-		variant: { default: "body" },
-		weight: { default: "inherit" }
+		variant: {
+			type: null,
+			default: "body"
+		},
+		weight: {
+			type: null,
+			default: "inherit"
+		}
 	},
 	setup(__props) {
 		const props = __props;
+		const checkedProps = computed(() => ({
+			align: checkedProp(props["align"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "align", void 0, ["start", "center"]),
+			as: checkedProp(props["as"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "as", void 0, [
+				"p",
+				"span",
+				"div",
+				"small",
+				"strong",
+				"label",
+				"h2",
+				"h3",
+				"h4",
+				"h5",
+				"h6"
+			]),
+			size: checkedProp(props["size"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "size", void 0, [
+				"inherit",
+				"xs",
+				"sm",
+				"md",
+				"lg"
+			]),
+			tone: checkedProp(props["tone"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "tone", void 0, [
+				"default",
+				"secondary",
+				"muted",
+				"accent",
+				"danger",
+				"success",
+				"info",
+				"warning"
+			]),
+			truncate: checkedProp(props["truncate"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "truncate", void 0, void 0),
+			variant: checkedProp(props["variant"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "variant", void 0, [
+				"body",
+				"eyebrow",
+				"code"
+			]),
+			weight: checkedProp(props["weight"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "weight", void 0, [
+				"inherit",
+				"normal",
+				"medium",
+				"semibold"
+			])
+		}));
+		checkedProps.value;
+		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 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 === "span" ? "span" : checkedProps.value.as === "div" ? "div" : checkedProps.value.as === "small" ? "small" : checkedProps.value.as === "strong" ? "strong" : checkedProps.value.as === "label" ? "label" : checkedProps.value.as === "h2" ? "h2" : checkedProps.value.as === "h3" ? "h3" : checkedProps.value.as === "h4" ? "h4" : checkedProps.value.as === "h5" ? "h5" : checkedProps.value.as === "h6" ? "h6" : "p"))) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-text> has an incompatible root."), {
+			name: "HtmlDiagnosticError",
+			diagnostic: Object.freeze({
+				code: "HR005",
+				message: "Server markup for <ui-text> has an incompatible root."
+			})
+		});
 		/** The values the styles' :host-state() rules test. */
 		const hostState = computed(() => [
-			props.size && `size size=${props.size}`,
-			props.tone && `tone tone=${props.tone}`,
-			props.weight && `weight weight=${props.weight}`,
-			props.variant && `variant variant=${props.variant}`,
-			props.truncate && "truncate",
-			props.align && `align align=${props.align}`
+			checkedProps.value.size && "size",
+			checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`,
+			checkedProps.value.tone && "tone",
+			checkedProps.value.tone != null && `tone=${encodeURIComponent(checkedProps.value.tone)}`,
+			checkedProps.value.weight && "weight",
+			checkedProps.value.weight != null && `weight=${encodeURIComponent(checkedProps.value.weight)}`,
+			checkedProps.value.variant && "variant",
+			checkedProps.value.variant != null && `variant=${encodeURIComponent(checkedProps.value.variant)}`,
+			checkedProps.value.truncate && "truncate",
+			checkedProps.value.align && "align",
+			checkedProps.value.align != null && `align=${encodeURIComponent(checkedProps.value.align)}`
 		].filter(Boolean).join(" "));
 		return (_ctx, _cache) => {
-			return __props.as === "span" ? (openBlock(), createElementBlock("span", mergeProps({
+			return checkedProps.value.as === "span" ? (openBlock(), createElementBlock("span", mergeProps({
 				key: 0,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1)) : __props.as === "div" ? (openBlock(), createElementBlock("div", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1)) : checkedProps.value.as === "div" ? (openBlock(), createElementBlock("div", mergeProps({
 				key: 1,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_2)) : __props.as === "small" ? (openBlock(), createElementBlock("small", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_2)) : checkedProps.value.as === "small" ? (openBlock(), createElementBlock("small", mergeProps({
 				key: 2,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_3)) : __props.as === "strong" ? (openBlock(), createElementBlock("strong", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_3)) : checkedProps.value.as === "strong" ? (openBlock(), createElementBlock("strong", mergeProps({
 				key: 3,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_4)) : __props.as === "label" ? (openBlock(), createElementBlock("label", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_4)) : checkedProps.value.as === "label" ? (openBlock(), createElementBlock("label", mergeProps({
 				key: 4,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_5)) : __props.as === "h2" ? (openBlock(), createElementBlock("h2", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_5)) : checkedProps.value.as === "h2" ? (openBlock(), createElementBlock("h2", mergeProps({
 				key: 5,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_6)) : __props.as === "h3" ? (openBlock(), createElementBlock("h3", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_6)) : checkedProps.value.as === "h3" ? (openBlock(), createElementBlock("h3", mergeProps({
 				key: 6,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_7)) : __props.as === "h4" ? (openBlock(), createElementBlock("h4", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_7)) : checkedProps.value.as === "h4" ? (openBlock(), createElementBlock("h4", mergeProps({
 				key: 7,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_8)) : __props.as === "h5" ? (openBlock(), createElementBlock("h5", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_8)) : checkedProps.value.as === "h5" ? (openBlock(), createElementBlock("h5", mergeProps({
 				key: 8,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_9)) : __props.as === "h6" ? (openBlock(), createElementBlock("h6", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_9)) : checkedProps.value.as === "h6" ? (openBlock(), createElementBlock("h6", mergeProps({
 				key: 9,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_10)) : (openBlock(), createElementBlock("p", mergeProps({
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_10)) : (openBlock(), createElementBlock("p", mergeProps({
 				key: 10,
 				"data-component": "ui-text"
-			}, _ctx.$attrs, { "data-ui-text-state": hostState.value || void 0 }), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_11));
+			}, nativeAttrs(_ctx.$attrs), {
+				"data-align": reflectedProp("align", "align", checkedProps.value.align, void 0, false),
+				"data-as": reflectedProp("as", "as", checkedProps.value.as, 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-truncate": reflectedProp("truncate", "truncate", checkedProps.value.truncate, void 0, false),
+				"data-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
+				"data-weight": reflectedProp("weight", "weight", checkedProps.value.weight, void 0, false),
+				"data-ui-text-state": hostState.value || void 0,
+				ref: "@html-next/root"
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_11));
 		};
 	}
-}), [["__scopeId", "data-v-80b3e712"]]);
+}), [["__scopeId", "data-v-bcf58afa"]]);
 //#endregion
 export { UiText_default as t };

package/vue/chunks/UiTextarea.js

@@ -1,7 +1,8 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { n as useComponentHost, t as createDispatch } from "./host.js";
-import { computed, createElementBlock, defineComponent, mergeProps, openBlock, ref, vModelText, withDirectives } from "vue";
-import * as controllerModule from "@threadlabs/looma/components/ui-textarea/ui-textarea.js";
+import { r as useComponentHost, t as createDispatch } from "./host.js";
+import { t as checkedProp } 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";
 //#region .build/vue/UiTextarea.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
 	"disabled",
@@ -9,6 +10,14 @@ var _hoisted_1 = [
 	"required",
 	"aria-invalid",
 	"rows",
+	"data-autosize",
+	"data-disabled",
+	"data-invalid",
+	"data-readonly",
+	"data-required",
+	"data-rows",
+	"data-size",
+	"data-value",
 	"data-ui-textarea-state"
 ];
 //#endregion
@@ -18,62 +27,159 @@ var UiTextarea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 	__name: "UiTextarea",
 	props: {
 		autosize: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
 		disabled: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
 		invalid: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
 		readonly: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
 		required: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
-		rows: { default: 4 },
-		size: { default: "md" },
-		value: {},
-		modelValue: {}
+		rows: {
+			type: null,
+			default: 4
+		},
+		size: {
+			type: null,
+			default: "md"
+		},
+		value: {
+			type: null,
+			default: null
+		},
+		modelValue: { type: null }
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
+		const checkedProps = computed(() => ({
+			autosize: checkedProp(props["autosize"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "autosize", void 0, void 0),
+			disabled: checkedProp(props["disabled"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "disabled", void 0, void 0),
+			invalid: checkedProp(props["invalid"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "invalid", void 0, void 0),
+			readonly: checkedProp(props["readonly"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "readonly", void 0, void 0),
+			required: checkedProp(props["required"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "required", void 0, void 0),
+			rows: checkedProp(props["rows"], {
+				kind: "terminal",
+				name: "integer"
+			}, false, "rows", void 0, void 0),
+			size: checkedProp(props["size"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "size", void 0, [
+				"sm",
+				"md",
+				"lg"
+			]),
+			value: checkedProp(props["value"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "value", void 0, void 0),
+			modelValue: checkedProp(props.modelValue, {
+				kind: "terminal",
+				name: "string"
+			}, false, "modelValue", void 0, void 0)
+		}));
+		checkedProps.value;
+		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 emit = __emit;
 		const model = computed({
-			get: () => props.modelValue ?? props.value ?? void 0,
+			get: () => checkedProps.value.modelValue ?? checkedProps.value.value ?? void 0,
 			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 !== "textarea")) throw Object.assign(/* @__PURE__ */ new Error("HR005: Server markup for <ui-textarea> has an incompatible root."), {
+			name: "HtmlDiagnosticError",
+			diagnostic: Object.freeze({
+				code: "HR005",
+				message: "Server markup for <ui-textarea> has an incompatible root."
+			})
+		});
 		/** The values the styles' :host-state() rules test. */
-		const hostState = computed(() => [props.size && `size size=${props.size}`, props.autosize && "autosize"].filter(Boolean).join(" "));
+		const hostState = computed(() => [
+			checkedProps.value.size && "size",
+			checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`,
+			checkedProps.value.autosize && "autosize"
+		].filter(Boolean).join(" "));
 		const dispatch = createDispatch(root);
-		useComponentHost(controllerModule.default, {
+		useComponentHost(() => import("@threadlabs/looma/components/ui-textarea/ui-textarea.js"), {
 			root,
 			dispatch,
-			props
+			controllerSource: {
+				specifier: "../components/ui-textarea/ui-textarea.js",
+				definition: "./components/ui-textarea/ui-textarea.html"
+			},
+			props: checkedProps
 		});
 		return (_ctx, _cache) => {
-			return withDirectives((openBlock(), createElementBlock("textarea", mergeProps({ "data-component": "ui-textarea" }, _ctx.$attrs, {
-				disabled: __props.disabled,
-				readonly: __props.readonly,
-				required: __props.required,
-				"aria-invalid": __props.invalid,
-				rows: __props.rows,
-				style: { "--_rows": __props.rows },
-				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
+			return withDirectives((openBlock(), createElementBlock("textarea", mergeProps({ "data-component": "ui-textarea" }, nativeAttrs(_ctx.$attrs), {
+				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,
+				rows: checkedProps.value.rows ?? void 0,
+				style: { "--_rows": checkedProps.value.rows ?? void 0 },
+				"data-autosize": reflectedProp("autosize", "autosize", checkedProps.value.autosize, void 0, false),
+				"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-rows": reflectedProp("rows", "rows", checkedProps.value.rows, 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),
+				onInput: _cache[0] || (_cache[0] = ($event) => model.value = unref(readBoundControl)($event.currentTarget)),
 				"data-ui-textarea-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
-			}), null, 16, _hoisted_1)), [[vModelText, model.value]]);
+			}), null, 16, _hoisted_1)), [[unref(vBindControl), {
+				tag: "textarea",
+				name: "value",
+				value: model.value,
+				defaultValue: ""
+			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-a2e0e09f"]]);
+}), [["__scopeId", "data-v-9338628d"]]);
 //#endregion
 export { UiTextarea_default as t };