@threadlabs/looma 0.5.1 → 0.6.0-rc.1

package/vue/chunks/UiInput.js

@@ -1,9 +1,8 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { computed, createElementBlock, defineComponent, mergeProps, onBeforeUnmount, onMounted, openBlock, ref, shallowRef, watchEffect } from "vue";
+import { computed, createElementBlock, defineComponent, mergeProps, onBeforeUnmount, onMounted, openBlock, ref, shallowRef, vModelDynamic, watchEffect, withDirectives } from "vue";
 import * as controllerModule from "@threadlabs/looma/components/ui-input/ui-input.js";
 //#region .build/vue/UiInput.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
-	"value",
 	"disabled",
 	"readonly",
 	"required",
@@ -16,19 +15,19 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 	__name: "UiInput",
 	props: {
 		disabled: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		invalid: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		readonly: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		required: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		value: {},
@@ -36,24 +35,21 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
-		const hn = {
-			text: (v) => v === void 0 || v === null ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? "" : String(v),
-			attr: (v) => v === void 0 || v === null || v === false ? void 0 : v === true ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? void 0 : String(v),
-			enumerated: (v) => typeof v === "boolean" ? String(v) : hn.attr(v)
-		};
 		const props = __props;
 		const emit = __emit;
-		const updateModel = (event) => emit("update:modelValue", event.target.value);
+		const model = computed({
+			get: () => props.modelValue ?? props.value ?? void 0,
+			set: (value) => emit("update:modelValue", value)
+		});
 		const root = ref(null);
-		const refs = {};
 		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
-		const dispatch = (name, detail) => {
+		function dispatch(name, detail) {
 			return root.value?.dispatchEvent(new CustomEvent(name, {
 				bubbles: true,
 				composed: true,
 				detail
 			})) ?? true;
-		};
+		}
 		function read(name) {
 			return props[name];
 		}
@@ -69,7 +65,7 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
 				set: (_target, name, value) => typeof name === "string" && write(name, value)
 			}),
-			refs,
+			refs: {},
 			elements: new Proxy({}, { get: (_target, name) => {
 				if (typeof name !== "string" || root.value === null) return void 0;
 				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
@@ -119,18 +115,17 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			if (typeof cleanup === "function") cleanup();
 		});
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("input", mergeProps({ "data-component": "ui-input" }, _ctx.$attrs, {
-				value: hn.attr(props.modelValue ?? props.value),
-				disabled: hn.attr(props.disabled),
-				readonly: hn.attr(props.readonly),
-				required: hn.attr(props.required),
-				"aria-invalid": hn.enumerated(props.invalid),
-				onInput: updateModel,
+			return withDirectives((openBlock(), createElementBlock("input", mergeProps({ "data-component": "ui-input" }, _ctx.$attrs, {
+				disabled: __props.disabled,
+				readonly: __props.readonly,
+				required: __props.required,
+				"aria-invalid": __props.invalid,
+				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
 				ref_key: "root",
 				ref: root
-			}), null, 16, _hoisted_1);
+			}), null, 16, _hoisted_1)), [[vModelDynamic, model.value]]);
 		};
 	}
-}), [["__scopeId", "data-v-cf6676f9"]]);
+}), [["__scopeId", "data-v-f00d6a51"]]);
 //#endregion
 export { UiInput_default as t };

package/vue/chunks/UiMenu.js

@@ -10,80 +10,77 @@ var UiMenu_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 	inheritAttrs: false,
 	__name: "UiMenu",
 	props: {
+		density: { default: "comfortable" },
 		for: { default: "" },
 		open: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		placement: { default: "bottom-start" }
 	},
 	emits: [
+		"update:open",
 		"select",
 		"open",
 		"close"
 	],
 	setup(__props, { emit: __emit }) {
-		const hn = { t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false) };
 		const props = __props;
 		const emit = __emit;
 		const root = ref(null);
-		const refs = {};
-		const state_internalOpen = ref(false);
+		const internalOpen = ref(false);
+		/** The values the styles' :host-state() rules test. */
+		const hostState = computed(() => [props.density && `density density=${props.density}`, internalOpen.value && "internalOpen"].filter(Boolean).join(" "));
 		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
-		const dispatch = (name, detail) => {
+		function dispatch(name, detail) {
 			const declared = {
-				"select": {
-					"bubbles": true,
-					"composed": true,
-					"cancelable": false
+				select: {
+					bubbles: true,
+					composed: true,
+					cancelable: false
 				},
-				"open": {
-					"bubbles": true,
-					"composed": true,
-					"cancelable": false
+				open: {
+					bubbles: true,
+					composed: true,
+					cancelable: false
 				},
-				"close": {
-					"bubbles": true,
-					"composed": true,
-					"cancelable": false
+				close: {
+					bubbles: true,
+					composed: true,
+					cancelable: false
 				}
 			};
 			const checks = {
-				"select": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["value"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => ["value", "trigger"].includes(key)),
-				"open": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
+				select: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["value"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => ["value", "trigger"].includes(key)),
+				open: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 					"open",
 					"reason",
 					"trigger"
 				].includes(key)),
-				"close": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic" || detail["reason"] === "light-dismiss" || detail["reason"] === "escape") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
+				close: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic" || detail["reason"] === "light-dismiss" || detail["reason"] === "escape") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 					"open",
 					"reason",
 					"trigger"
 				].includes(key))
 			};
 			if (detail !== void 0 && checks[name] !== void 0 && !checks[name](detail)) throw new TypeError(`HR002: Event \`${name}\` detail does not satisfy its declared type.`);
-			emit(name, detail);
+			const emitEvent = emit;
+			emitEvent(name, detail);
+			if (detail !== null && typeof detail === "object" && "open" in detail) emitEvent("update:open", detail["open"]);
 			return root.value?.dispatchEvent(new CustomEvent(name, {
 				bubbles: true,
 				composed: true,
 				...declared[name],
 				detail
 			})) ?? true;
-		};
-		/** The resolved values the styles' :host-state() rules test. */
-		const hostState = computed(() => ["internalOpen"].flatMap((name) => {
-			const value = read(name);
-			const tokens = hn.t(value) ? [name] : [];
-			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
-			return tokens;
-		}).join(" "));
+		}
 		function read(name) {
-			if (name === "internalOpen") return state_internalOpen.value;
+			if (name === "internalOpen") return internalOpen.value;
 			return props[name];
 		}
 		function write(name, value) {
 			if (name === "internalOpen") {
-				state_internalOpen.value = value;
+				internalOpen.value = value;
 				return true;
 			}
 			throw new TypeError(`Only declared state is writable; \`${name}\` is not.`);
@@ -97,7 +94,7 @@ var UiMenu_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
 				set: (_target, name, value) => typeof name === "string" && write(name, value)
 			}),
-			refs,
+			refs: {},
 			elements: new Proxy({}, { get: (_target, name) => {
 				if (typeof name !== "string" || root.value === null) return void 0;
 				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
@@ -158,6 +155,6 @@ var UiMenu_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}), [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])], 16, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-75d428d7"]]);
+}), [["__scopeId", "data-v-09be9e37"]]);
 //#endregion
 export { UiMenu_default as t };

package/vue/chunks/UiMenuItem.js

@@ -9,29 +9,23 @@ var UiMenuItem_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 	__name: "UiMenuItem",
 	props: {
 		disabled: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		value: { default: "" }
 	},
 	setup(__props) {
-		const hn = {
-			text: (v) => v === void 0 || v === null ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? "" : String(v),
-			attr: (v) => v === void 0 || v === null || v === false ? void 0 : v === true ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? void 0 : String(v),
-			enumerated: (v) => typeof v === "boolean" ? String(v) : hn.attr(v)
-		};
-		const props = __props;
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", mergeProps({
 				"data-component": "ui-menu-item",
 				role: "menuitem",
 				tabindex: "-1"
 			}, _ctx.$attrs, {
-				"aria-disabled": hn.enumerated(props.disabled),
-				"data-value": hn.attr(props.value)
+				"aria-disabled": __props.disabled,
+				"data-value": __props.value
 			}), [renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-05a8f163"]]);
+}), [["__scopeId", "data-v-deb5a674"]]);
 //#endregion
 export { UiMenuItem_default as t };

package/vue/chunks/UiPopover.js

@@ -12,68 +12,67 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 	props: {
 		for: { default: "" },
 		open: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		placement: { default: "bottom-start" }
 	},
-	emits: ["open", "close"],
+	emits: [
+		"update:open",
+		"open",
+		"close"
+	],
 	setup(__props, { emit: __emit }) {
-		const hn = { t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false) };
 		const props = __props;
 		const emit = __emit;
 		const root = ref(null);
-		const refs = {};
-		const state_internalOpen = ref(false);
+		const internalOpen = ref(false);
+		/** The values the styles' :host-state() rules test. */
+		const hostState = computed(() => [internalOpen.value && "internalOpen"].filter(Boolean).join(" "));
 		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
-		const dispatch = (name, detail) => {
+		function dispatch(name, detail) {
 			const declared = {
-				"open": {
-					"bubbles": true,
-					"composed": true,
-					"cancelable": false
+				open: {
+					bubbles: true,
+					composed: true,
+					cancelable: false
 				},
-				"close": {
-					"bubbles": true,
-					"composed": true,
-					"cancelable": false
+				close: {
+					bubbles: true,
+					composed: true,
+					cancelable: false
 				}
 			};
 			const checks = {
-				"open": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic" || detail["reason"] === "light-dismiss" || detail["reason"] === "escape") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
+				open: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic" || detail["reason"] === "light-dismiss" || detail["reason"] === "escape") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 					"open",
 					"reason",
 					"trigger"
 				].includes(key)),
-				"close": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic" || detail["reason"] === "light-dismiss" || detail["reason"] === "escape") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
+				close: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic" || detail["reason"] === "light-dismiss" || detail["reason"] === "escape") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 					"open",
 					"reason",
 					"trigger"
 				].includes(key))
 			};
 			if (detail !== void 0 && checks[name] !== void 0 && !checks[name](detail)) throw new TypeError(`HR002: Event \`${name}\` detail does not satisfy its declared type.`);
-			emit(name, detail);
+			const emitEvent = emit;
+			emitEvent(name, detail);
+			if (detail !== null && typeof detail === "object" && "open" in detail) emitEvent("update:open", detail["open"]);
 			return root.value?.dispatchEvent(new CustomEvent(name, {
 				bubbles: true,
 				composed: true,
 				...declared[name],
 				detail
 			})) ?? true;
-		};
-		/** The resolved values the styles' :host-state() rules test. */
-		const hostState = computed(() => ["internalOpen"].flatMap((name) => {
-			const value = read(name);
-			const tokens = hn.t(value) ? [name] : [];
-			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
-			return tokens;
-		}).join(" "));
+		}
 		function read(name) {
-			if (name === "internalOpen") return state_internalOpen.value;
+			if (name === "internalOpen") return internalOpen.value;
 			return props[name];
 		}
 		function write(name, value) {
 			if (name === "internalOpen") {
-				state_internalOpen.value = value;
+				internalOpen.value = value;
 				return true;
 			}
 			throw new TypeError(`Only declared state is writable; \`${name}\` is not.`);
@@ -87,7 +86,7 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
 				set: (_target, name, value) => typeof name === "string" && write(name, value)
 			}),
-			refs,
+			refs: {},
 			elements: new Proxy({}, { get: (_target, name) => {
 				if (typeof name !== "string" || root.value === null) return void 0;
 				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
@@ -144,6 +143,6 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 			}), [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])], 16, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-3d1188bf"]]);
+}), [["__scopeId", "data-v-c16079f0"]]);
 //#endregion
 export { UiPopover_default as t };

package/vue/chunks/UiRadio.js

@@ -1,5 +1,5 @@
 import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { computed, createElementBlock, createElementVNode, defineComponent, mergeProps, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, shallowRef, watchEffect } from "vue";
+import { computed, createElementBlock, createElementVNode, defineComponent, mergeProps, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, shallowRef, useTemplateRef, watchEffect } from "vue";
 import * as controllerModule from "@threadlabs/looma/components/ui-radio/ui-radio.js";
 //#region .build/vue/UiRadio.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["data-ui-radio-state"];
@@ -18,67 +18,64 @@ var UiRadio_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 	__name: "UiRadio",
 	props: {
 		checked: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		disabled: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		name: { default: "" },
 		required: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		value: { default: "on" }
 	},
-	emits: ["change"],
+	emits: [
+		"update:checked",
+		"update:value",
+		"change"
+	],
 	setup(__props, { emit: __emit }) {
-		const hn = {
-			t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false),
-			text: (v) => v === void 0 || v === null ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? "" : String(v),
-			attr: (v) => v === void 0 || v === null || v === false ? void 0 : v === true ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? void 0 : String(v)
-		};
 		const props = __props;
 		const emit = __emit;
 		const root = ref(null);
-		const refs = {};
-		const state_internalChecked = ref(false);
+		const inputElement = useTemplateRef("input");
+		const internalChecked = ref(false);
+		/** The values the styles' :host-state() rules test. */
+		const hostState = computed(() => [props.disabled && "disabled"].filter(Boolean).join(" "));
 		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
-		const dispatch = (name, detail) => {
-			const declared = { "change": {
-				"bubbles": true,
-				"composed": true,
-				"cancelable": false
+		function dispatch(name, detail) {
+			const declared = { change: {
+				bubbles: true,
+				composed: true,
+				cancelable: false
 			} };
-			const checks = { "change": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["checked"] === "boolean" && typeof detail["value"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
+			const checks = { change: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["checked"] === "boolean" && typeof detail["value"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 				"checked",
 				"value",
 				"trigger"
 			].includes(key)) };
 			if (detail !== void 0 && checks[name] !== void 0 && !checks[name](detail)) throw new TypeError(`HR002: Event \`${name}\` detail does not satisfy its declared type.`);
-			emit(name, detail);
+			const emitEvent = emit;
+			emitEvent(name, detail);
+			if (detail !== null && typeof detail === "object" && "checked" in detail) emitEvent("update:checked", detail["checked"]);
+			if (detail !== null && typeof detail === "object" && "value" in detail) emitEvent("update:value", detail["value"]);
 			return root.value?.dispatchEvent(new CustomEvent(name, {
 				bubbles: true,
 				composed: true,
 				...declared[name],
 				detail
 			})) ?? true;
-		};
-		/** The resolved values the styles' :host-state() rules test. */
-		const hostState = computed(() => ["disabled"].flatMap((name) => {
-			const value = read(name);
-			const tokens = hn.t(value) ? [name] : [];
-			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
-			return tokens;
-		}).join(" "));
+		}
 		function read(name) {
-			if (name === "internalChecked") return state_internalChecked.value;
+			if (name === "internalChecked") return internalChecked.value;
 			return props[name];
 		}
 		function write(name, value) {
 			if (name === "internalChecked") {
-				state_internalChecked.value = value;
+				internalChecked.value = value;
 				return true;
 			}
 			throw new TypeError(`Only declared state is writable; \`${name}\` is not.`);
@@ -92,7 +89,9 @@ var UiRadio_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
 				set: (_target, name, value) => typeof name === "string" && write(name, value)
 			}),
-			refs,
+			refs: { get input() {
+				return inputElement.value;
+			} },
 			elements: new Proxy({}, { get: (_target, name) => {
 				if (typeof name !== "string" || root.value === null) return void 0;
 				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
@@ -148,17 +147,15 @@ var UiRadio_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 				ref: root
 			}), [createElementVNode("input", {
 				type: "radio",
-				".checked": state_internalChecked.value,
-				disabled: hn.attr(props.disabled),
-				required: hn.attr(props.required),
-				value: hn.attr(props.value),
-				name: hn.attr(props.name),
-				ref: (element) => {
-					refs["input"] = element;
-				}
+				".checked": internalChecked.value,
+				disabled: __props.disabled,
+				required: __props.required,
+				value: __props.value,
+				name: __props.name,
+				ref: "input"
 			}, null, 40, _hoisted_2), createElementVNode("span", _hoisted_3, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])], 16, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-e5d6bc8d"]]);
+}), [["__scopeId", "data-v-cb942e6f"]]);
 //#endregion
 export { UiRadio_default as t };

package/vue/chunks/UiRadioGroup.js

@@ -10,78 +10,74 @@ var UiRadioGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 	__name: "UiRadioGroup",
 	props: {
 		disabled: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		label: { default: "Options" },
 		name: { default: "" },
 		orientation: { default: "horizontal" },
 		required: {
-			type: [Boolean, null],
+			type: Boolean,
 			default: false
 		},
 		value: { default: "" }
 	},
-	emits: ["select", "change"],
+	emits: [
+		"update:value",
+		"select",
+		"change"
+	],
 	setup(__props, { emit: __emit }) {
-		const hn = {
-			t: (v) => v === true || (typeof v === "string" ? v.length > 0 : typeof v === "number" ? v !== 0 && v === v : Array.isArray(v) ? v.length > 0 : v !== null && typeof v === "object" ? Object.keys(v).length > 0 : false),
-			text: (v) => v === void 0 || v === null ? "" : Array.isArray(v) ? v.map(hn.text).join(" ") : typeof v === "object" ? "" : String(v)
-		};
 		const props = __props;
 		const emit = __emit;
 		const root = ref(null);
-		const refs = {};
-		const state_internalValue = ref("");
+		const internalValue = ref("");
+		/** The values the styles' :host-state() rules test. */
+		const hostState = computed(() => [props.orientation && `orientation orientation=${props.orientation}`].filter(Boolean).join(" "));
 		/** Dispatches a component event to Vue listeners and, for controllers and page code, on the root. */
-		const dispatch = (name, detail) => {
+		function dispatch(name, detail) {
 			const declared = {
-				"select": {
-					"bubbles": true,
-					"composed": true,
-					"cancelable": false
+				select: {
+					bubbles: true,
+					composed: true,
+					cancelable: false
 				},
-				"change": {
-					"bubbles": true,
-					"composed": true,
-					"cancelable": false
+				change: {
+					bubbles: true,
+					composed: true,
+					cancelable: false
 				}
 			};
 			const checks = {
-				"select": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["value"] === "string" && typeof detail["previousValue"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
+				select: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["value"] === "string" && typeof detail["previousValue"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 					"value",
 					"previousValue",
 					"trigger"
 				].includes(key)),
-				"change": (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["checked"] === "boolean" && typeof detail["value"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
+				change: (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["checked"] === "boolean" && typeof detail["value"] === "string" && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 					"checked",
 					"value",
 					"trigger"
 				].includes(key))
 			};
 			if (detail !== void 0 && checks[name] !== void 0 && !checks[name](detail)) throw new TypeError(`HR002: Event \`${name}\` detail does not satisfy its declared type.`);
-			emit(name, detail);
+			const emitEvent = emit;
+			emitEvent(name, detail);
+			if (detail !== null && typeof detail === "object" && "value" in detail) emitEvent("update:value", detail["value"]);
 			return root.value?.dispatchEvent(new CustomEvent(name, {
 				bubbles: true,
 				composed: true,
 				...declared[name],
 				detail
 			})) ?? true;
-		};
-		/** The resolved values the styles' :host-state() rules test. */
-		const hostState = computed(() => ["orientation"].flatMap((name) => {
-			const value = read(name);
-			const tokens = hn.t(value) ? [name] : [];
-			if (typeof value === "string" || typeof value === "number") tokens.push(`${name}=${encodeURIComponent(String(value))}`);
-			return tokens;
-		}).join(" "));
+		}
 		function read(name) {
-			if (name === "internalValue") return state_internalValue.value;
+			if (name === "internalValue") return internalValue.value;
 			return props[name];
 		}
 		function write(name, value) {
 			if (name === "internalValue") {
-				state_internalValue.value = value;
+				internalValue.value = value;
 				return true;
 			}
 			throw new TypeError(`Only declared state is writable; \`${name}\` is not.`);
@@ -95,7 +91,7 @@ var UiRadioGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				get: (_target, name) => typeof name === "string" ? read(name) : void 0,
 				set: (_target, name, value) => typeof name === "string" && write(name, value)
 			}),
-			refs,
+			refs: {},
 			elements: new Proxy({}, { get: (_target, name) => {
 				if (typeof name !== "string" || root.value === null) return void 0;
 				return (root.value instanceof HTMLFormElement ? root.value : root.value.querySelector("form"))?.elements.namedItem(name) ?? root.value.querySelector(`[name="${CSS.escape(name)}"]`) ?? void 0;
@@ -152,9 +148,9 @@ var UiRadioGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				"data-ui-radio-group-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
-			}), [createElementVNode("legend", null, toDisplayString(hn.text(props.label)), 1), renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1);
+			}), [createElementVNode("legend", null, toDisplayString(__props.label), 1), renderSlot(_ctx.$slots, "default", {}, void 0, true)], 16, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-9cda8db8"]]);
+}), [["__scopeId", "data-v-df092584"]]);
 //#endregion
 export { UiRadioGroup_default as t };