@threadlabs/looma 0.19.1 → 0.20.0

package/vue/chunks/UiDisclosure.js

@@ -1,9 +1,17 @@
 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, createElementVNode, createTextVNode, defineComponent, mergeProps, openBlock, ref, renderSlot, toDisplayString, useTemplateRef } from "vue";
-import * as controllerModule from "@threadlabs/looma/components/ui-disclosure/ui-disclosure.js";
+import { r as useComponentHost, t as createDispatch } from "./host.js";
+import { t as checkedProp } from "./props.js";
+import { computed, createElementBlock, createElementVNode, createTextVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, renderSlot, toDisplayString, useTemplateRef, watchSyncEffect } from "vue";
 //#region .build/vue/UiDisclosure.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = ["data-ui-disclosure-state"];
+var _hoisted_1 = [
+	"data-density",
+	"data-disabled",
+	"data-heading-level",
+	"data-name",
+	"data-open",
+	"data-summary",
+	"data-ui-disclosure-state"
+];
 var _hoisted_2 = ["role", "aria-level"];
 var _hoisted_3 = [
 	"aria-controls",
@@ -19,18 +27,30 @@ var UiDisclosure_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 	inheritAttrs: false,
 	__name: "UiDisclosure",
 	props: {
-		density: { default: "comfortable" },
+		density: {
+			type: null,
+			default: "comfortable"
+		},
 		disabled: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
-		headingLevel: { default: 0 },
-		name: { default: "" },
+		headingLevel: {
+			type: null,
+			default: 0
+		},
+		name: {
+			type: null,
+			default: ""
+		},
 		open: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
-		summary: { default: "Details" }
+		summary: {
+			type: null,
+			default: "Details"
+		}
 	},
 	emits: [
 		"update:open",
@@ -39,6 +59,49 @@ var UiDisclosure_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 	],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
+		const checkedProps = computed(() => ({
+			density: checkedProp(props["density"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "density", void 0, ["comfortable", "compact"]),
+			disabled: checkedProp(props["disabled"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "disabled", void 0, void 0),
+			headingLevel: checkedProp(props["headingLevel"], {
+				kind: "terminal",
+				name: "integer"
+			}, false, "headingLevel", void 0, void 0),
+			name: checkedProp(props["name"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "name", void 0, void 0),
+			open: checkedProp(props["open"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "open", void 0, void 0),
+			summary: checkedProp(props["summary"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "summary", 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 root = ref(null);
 		const triggerElement = useTemplateRef("trigger");
@@ -47,8 +110,20 @@ var UiDisclosure_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 		const contentId = ref("");
 		const headingRole = ref(null);
 		const headingAriaLevel = 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-disclosure> has an incompatible root."), {
+			name: "HtmlDiagnosticError",
+			diagnostic: Object.freeze({
+				code: "HR005",
+				message: "Server markup for <ui-disclosure> has an incompatible root."
+			})
+		});
 		/** The values the styles' :host-state() rules test. */
-		const hostState = computed(() => [props.density && `density density=${props.density}`, internalOpen.value && "internalOpen"].filter(Boolean).join(" "));
+		const hostState = computed(() => [
+			checkedProps.value.density && "density",
+			checkedProps.value.density != null && `density=${encodeURIComponent(checkedProps.value.density)}`,
+			internalOpen.value && "internalOpen"
+		].filter(Boolean).join(" "));
 		const isOpenDetail = (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",
@@ -61,10 +136,14 @@ var UiDisclosure_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			},
 			modeled: ["open"]
 		});
-		useComponentHost(controllerModule.default, {
+		useComponentHost(() => import("@threadlabs/looma/components/ui-disclosure/ui-disclosure.js"), {
 			root,
 			dispatch,
-			props,
+			controllerSource: {
+				specifier: "../components/ui-disclosure/ui-disclosure.js",
+				definition: "./components/ui-disclosure/ui-disclosure.html"
+			},
+			props: checkedProps,
 			refs: {
 				trigger: triggerElement,
 				panel: panelElement
@@ -85,7 +164,13 @@ var UiDisclosure_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			return value === true ? "" : text(value);
 		}
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-disclosure" }, _ctx.$attrs, {
+			return openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-disclosure" }, nativeAttrs(_ctx.$attrs), {
+				"data-density": reflectedProp("density", "density", checkedProps.value.density, void 0, false),
+				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-heading-level": reflectedProp("headingLevel", "heading-level", checkedProps.value.headingLevel, void 0, false),
+				"data-name": reflectedProp("name", "name", checkedProps.value.name, void 0, false),
+				"data-open": reflectedProp("open", "open", checkedProps.value.open, void 0, false),
+				"data-summary": reflectedProp("summary", "summary", checkedProps.value.summary, void 0, false),
 				"data-ui-disclosure-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
@@ -98,9 +183,9 @@ var UiDisclosure_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				type: "button",
 				"aria-controls": contentId.value,
 				"aria-expanded": internalOpen.value,
-				disabled: __props.disabled,
+				disabled: checkedProps.value.disabled ?? void 0,
 				ref: "trigger"
-			}, [createElementVNode("span", _hoisted_4, [renderSlot(_ctx.$slots, "summary", {}, () => [createTextVNode(toDisplayString(__props.summary), 1)], true)]), _cache[0] || (_cache[0] = createElementVNode("span", {
+			}, [createElementVNode("span", _hoisted_4, [renderSlot(_ctx.$slots, "summary", {}, () => [createTextVNode(toDisplayString(checkedProps.value.summary), 1)], true)]), _cache[0] || (_cache[0] = createElementVNode("span", {
 				class: "chevron",
 				"aria-hidden": "true"
 			}, null, -1))], 8, _hoisted_3)], 8, _hoisted_2), createElementVNode("div", {
@@ -110,6 +195,6 @@ var UiDisclosure_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			}, [createElementVNode("div", _hoisted_6, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])], 8, _hoisted_5)], 16, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-4db3405f"]]);
+}), [["__scopeId", "data-v-5be4c5b2"]]);
 //#endregion
 export { UiDisclosure_default as t };

package/vue/chunks/UiEditable.js

@@ -1,9 +1,23 @@
 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, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeProps, openBlock, ref, toDisplayString, useTemplateRef } from "vue";
-import * as controllerModule from "@threadlabs/looma/components/ui-editable/ui-editable.js";
+import { r as useComponentHost, t as createDispatch } from "./host.js";
+import { t as checkedProp } from "./props.js";
+import { r as vBindControl } from "./control.js";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, toDisplayString, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiEditable.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = ["data-ui-editable-state"];
+var _hoisted_1 = [
+	"data-actions",
+	"data-cancel-label",
+	"data-disabled",
+	"data-edit",
+	"data-hint",
+	"data-label",
+	"data-max-length",
+	"data-placeholder",
+	"data-required",
+	"data-save-label",
+	"data-value",
+	"data-ui-editable-state"
+];
 var _hoisted_2 = { class: "field" };
 var _hoisted_3 = ["disabled"];
 var _hoisted_4 = { class: "text" };
@@ -13,7 +27,6 @@ var _hoisted_5 = {
 	"aria-hidden": "true"
 };
 var _hoisted_6 = [
-	".value",
 	"aria-label",
 	"placeholder",
 	"required",
@@ -38,28 +51,49 @@ var UiEditable_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 	__name: "UiEditable",
 	props: {
 		actions: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
-		cancelLabel: { default: "Cancel" },
+		cancelLabel: {
+			type: null,
+			default: "Cancel"
+		},
 		disabled: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
 		edit: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
-		hint: { default: "" },
-		label: { default: "Edit value" },
-		maxLength: { default: 0 },
-		placeholder: { default: "" },
+		hint: {
+			type: null,
+			default: ""
+		},
+		label: {
+			type: null,
+			default: "Edit value"
+		},
+		maxLength: {
+			type: null,
+			default: 0
+		},
+		placeholder: {
+			type: null,
+			default: ""
+		},
 		required: {
-			type: Boolean,
+			type: null,
 			default: false
 		},
-		saveLabel: { default: "Save" },
-		value: { default: "" }
+		saveLabel: {
+			type: null,
+			default: "Save"
+		},
+		value: {
+			type: null,
+			default: ""
+		}
 	},
 	emits: [
 		"update:edit",
@@ -70,6 +104,69 @@ var UiEditable_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 	],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
+		const checkedProps = computed(() => ({
+			actions: checkedProp(props["actions"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "actions", void 0, void 0),
+			cancelLabel: checkedProp(props["cancelLabel"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "cancelLabel", void 0, void 0),
+			disabled: checkedProp(props["disabled"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "disabled", void 0, void 0),
+			edit: checkedProp(props["edit"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "edit", void 0, void 0),
+			hint: checkedProp(props["hint"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "hint", void 0, void 0),
+			label: checkedProp(props["label"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "label", void 0, void 0),
+			maxLength: checkedProp(props["maxLength"], {
+				kind: "terminal",
+				name: "number"
+			}, false, "maxLength", void 0, void 0),
+			placeholder: checkedProp(props["placeholder"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "placeholder", void 0, void 0),
+			required: checkedProp(props["required"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "required", void 0, void 0),
+			saveLabel: checkedProp(props["saveLabel"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "saveLabel", void 0, void 0),
+			value: checkedProp(props["value"], {
+				kind: "terminal",
+				name: "string"
+			}, false, "value", 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 root = ref(null);
 		const previewElement = useTemplateRef("preview");
@@ -77,8 +174,16 @@ var UiEditable_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 		const internalEdit = ref(false);
 		const internalValue = ref("");
 		const draft = ref("");
+		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-editable> has an incompatible root."), {
+			name: "HtmlDiagnosticError",
+			diagnostic: Object.freeze({
+				code: "HR005",
+				message: "Server markup for <ui-editable> has an incompatible root."
+			})
+		});
 		/** The values the styles' :host-state() rules test. */
-		const hostState = computed(() => [internalEdit.value && "internalEdit", props.disabled && "disabled"].filter(Boolean).join(" "));
+		const hostState = computed(() => [internalEdit.value && "internalEdit", checkedProps.value.disabled && "disabled"].filter(Boolean).join(" "));
 		const isInputDetail = (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));
 		const isChangeDetail = (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",
@@ -98,10 +203,14 @@ var UiEditable_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			},
 			modeled: ["edit", "value"]
 		});
-		useComponentHost(controllerModule.default, {
+		useComponentHost(() => import("@threadlabs/looma/components/ui-editable/ui-editable.js"), {
 			root,
 			dispatch,
-			props,
+			controllerSource: {
+				specifier: "../components/ui-editable/ui-editable.js",
+				definition: "./components/ui-editable/ui-editable.html"
+			},
+			props: checkedProps,
 			refs: {
 				preview: previewElement,
 				input: inputElement
@@ -113,27 +222,43 @@ var UiEditable_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			}
 		});
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-editable" }, _ctx.$attrs, {
+			return openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-editable" }, nativeAttrs(_ctx.$attrs), {
+				"data-actions": reflectedProp("actions", "actions", checkedProps.value.actions, void 0, false),
+				"data-cancel-label": reflectedProp("cancelLabel", "cancel-label", checkedProps.value.cancelLabel, void 0, false),
+				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-edit": reflectedProp("edit", "edit", checkedProps.value.edit, void 0, false),
+				"data-hint": reflectedProp("hint", "hint", checkedProps.value.hint, void 0, false),
+				"data-label": reflectedProp("label", "label", checkedProps.value.label, void 0, false),
+				"data-max-length": reflectedProp("maxLength", "max-length", checkedProps.value.maxLength, void 0, false),
+				"data-placeholder": reflectedProp("placeholder", "placeholder", checkedProps.value.placeholder, void 0, false),
+				"data-required": reflectedProp("required", "required", checkedProps.value.required, void 0, false),
+				"data-save-label": reflectedProp("saveLabel", "save-label", checkedProps.value.saveLabel, void 0, false),
+				"data-value": reflectedProp("value", "value", checkedProps.value.value, void 0, false),
 				"data-ui-editable-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
 			}), [createElementVNode("div", _hoisted_2, [createElementVNode("button", {
 				class: "preview",
 				type: "button",
-				disabled: __props.disabled,
+				disabled: checkedProps.value.disabled ?? void 0,
 				ref: "preview"
-			}, [createElementVNode("span", _hoisted_4, toDisplayString(internalValue.value), 1), __props.hint ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(__props.hint), 1)) : createCommentVNode("v-if", true)], 8, _hoisted_3), createElementVNode("input", {
+			}, [createElementVNode("span", _hoisted_4, toDisplayString(internalValue.value), 1), checkedProps.value.hint ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(checkedProps.value.hint), 1)) : createCommentVNode("v-if", true)], 8, _hoisted_3), withDirectives(createElementVNode("input", {
 				class: "input",
 				type: "text",
-				".value": draft.value,
-				"aria-label": __props.label,
-				placeholder: __props.placeholder,
-				required: __props.required,
-				disabled: __props.disabled || !internalEdit.value,
+				"aria-label": checkedProps.value.label ?? void 0,
+				placeholder: checkedProps.value.placeholder ?? void 0,
+				required: checkedProps.value.required ?? void 0,
+				disabled: checkedProps.value.disabled || !internalEdit.value,
 				ref: "input"
-			}, null, 40, _hoisted_6)]), __props.actions ? (openBlock(), createElementBlock("div", _hoisted_7, [createElementVNode("button", _hoisted_8, toDisplayString(__props.saveLabel), 1), createElementVNode("button", _hoisted_9, toDisplayString(__props.cancelLabel), 1)])) : createCommentVNode("v-if", true)], 16, _hoisted_1);
+			}, null, 8, _hoisted_6), [[unref(vBindControl), {
+				tag: "input",
+				name: "value",
+				value: draft.value,
+				nativeProperty: true,
+				defaultValue: ""
+			}]])]), checkedProps.value.actions ? (openBlock(), createElementBlock("div", _hoisted_7, [createElementVNode("button", _hoisted_8, toDisplayString(checkedProps.value.saveLabel), 1), createElementVNode("button", _hoisted_9, toDisplayString(checkedProps.value.cancelLabel), 1)])) : createCommentVNode("v-if", true)], 16, _hoisted_1);
 		};
 	}
-}), [["__scopeId", "data-v-39853d49"]]);
+}), [["__scopeId", "data-v-ee4118d2"]]);
 //#endregion
 export { UiEditable_default as t };