@threadlabs/looma 0.33.1 → 0.35.0

package/vue/chunks/UiLightEditor.js

@@ -0,0 +1,347 @@
+import { a as concat, b as useReflectedProp, i as checkHydratedRoot, m as nativeAttrs, o as createDispatch, t as _plugin_vue_export_helper_default, y as useComponentHost } from "./_plugin-vue_export-helper.js";
+import { d as requireInputStatus, i as checkPropInput, m as vuePropInputs, p as vPropValidity, r as acceptsControllerWrite, t as BINDING_INPUTS_PROP, u as propValidityState } from "./props.js";
+import { t as UiNumberInput_default } from "./UiNumberInput.js";
+import { computed, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, provide, ref, renderSlot, toDisplayString, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
+//#region .build/vue/UiLightEditor.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"data-ui-light-editor-prop-disabled",
+	"data-ui-light-editor-prop-label",
+	"data-ui-light-editor-prop-size",
+	"data-ui-light-editor-prop-x",
+	"data-ui-light-editor-prop-y"
+];
+var _hoisted_2 = ["aria-label"];
+var _hoisted_3 = {
+	class: "specimen",
+	"data-hn-ui-light-editor": ""
+};
+var _hoisted_4 = ["disabled", "aria-label"];
+var _hoisted_5 = {
+	class: "coordinates",
+	"data-hn-ui-light-editor": ""
+};
+//#endregion
+//#region .build/vue/UiLightEditor.vue
+var UiLightEditor_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiLightEditor",
+	props: {
+		disabled: { type: null },
+		label: { type: null },
+		size: { type: null },
+		x: { type: null },
+		y: { type: null },
+		[BINDING_INPUTS_PROP]: { type: null }
+	},
+	emits: [
+		"update:x",
+		"update:y",
+		"input",
+		"change"
+	],
+	setup(__props, { emit: __emit }) {
+		const propValidityContract = { props: {
+			disabled: {
+				type: {
+					kind: "terminal",
+					name: "boolean"
+				},
+				required: false,
+				target: { attribute: "disabled" },
+				description: "Prevents pointer, keyboard and exact edits.",
+				default: false
+			},
+			label: {
+				type: {
+					kind: "terminal",
+					name: "string"
+				},
+				required: false,
+				target: { attribute: "aria-label" },
+				description: "Accessible name for the position editor.",
+				default: "Light position"
+			},
+			size: {
+				type: {
+					kind: "terminal",
+					name: "keyword"
+				},
+				required: false,
+				target: { attribute: "size" },
+				description: "Sets both coordinate fields to the shared small, medium or large control height.",
+				values: [
+					"sm",
+					"md",
+					"lg"
+				],
+				default: "md"
+			},
+			x: {
+				type: {
+					kind: "terminal",
+					name: "number"
+				},
+				required: false,
+				target: { attribute: "x" },
+				description: "Horizontal source position from 0 (left) to 1 (right), relative to every surface.",
+				default: .5
+			},
+			y: {
+				type: {
+					kind: "terminal",
+					name: "number"
+				},
+				required: false,
+				target: { attribute: "y" },
+				description: "Vertical source position from 0 (top) to 1 (bottom), relative to every surface.",
+				default: 0
+			}
+		} };
+		const props = __props;
+		const inputTracking = vuePropInputs({
+			disabled: false,
+			label: "Light position",
+			size: "md",
+			x: .5,
+			y: 0
+		}, {
+			disabled: false,
+			label: "Light position",
+			size: "md",
+			x: .5,
+			y: 0
+		}, (name, value, source, values) => {
+			switch (name) {
+				case "disabled": return checkPropInput(value, {
+					kind: "terminal",
+					name: "boolean"
+				}, true, true);
+				case "label": return checkPropInput(value, {
+					kind: "terminal",
+					name: "string"
+				}, true, true);
+				case "size": return checkPropInput(value, {
+					kind: "terminal",
+					name: "keyword"
+				}, true, true);
+				case "x": return checkPropInput(value, {
+					kind: "terminal",
+					name: "number"
+				}, true, true);
+				case "y": return checkPropInput(value, {
+					kind: "terminal",
+					name: "number"
+				}, true, true);
+				default: return { ok: false };
+			}
+		}, () => {
+			checkedProps.value;
+		});
+		const propInputs = inputTracking.inputs;
+		const checkedProps = computed(() => {
+			inputTracking.version.value;
+			return {
+				disabled: propInputs.value("disabled", props["disabled"], props[BINDING_INPUTS_PROP]),
+				label: propInputs.value("label", props["label"], props[BINDING_INPUTS_PROP]),
+				size: propInputs.value("size", props["size"], props[BINDING_INPUTS_PROP]),
+				x: propInputs.value("x", props["x"], props[BINDING_INPUTS_PROP]),
+				y: propInputs.value("y", props["y"], props[BINDING_INPUTS_PROP])
+			};
+		});
+		const inputStatus = (name, handlesError) => {
+			checkedProps.value;
+			inputTracking.version.value;
+			return requireInputStatus(propInputs.status(name), handlesError);
+		};
+		checkedProps.value;
+		watchSyncEffect(() => {
+			checkedProps.value;
+		});
+		const reflectedProp = useReflectedProp();
+		const hydrationInstance = getCurrentInstance();
+		const emit = __emit;
+		const root = ref(null);
+		const planeElement = useTemplateRef("planeElement");
+		const sourceElement = useTemplateRef("sourceElement");
+		const horizontal = ref("50");
+		const vertical = ref("0");
+		let guardedPrevious = null;
+		const guarded = computed(() => {
+			const candidate = concat(checkedProps.value.label, ". Arrow keys move the source; Shift moves faster.");
+			if (candidate === Symbol.for("html-next.invalid-result")) return guardedPrevious;
+			return guardedPrevious = candidate;
+		});
+		provide("html-next:ui-light-editor:horizontal", horizontal);
+		provide("html-next:ui-light-editor:vertical", vertical);
+		checkHydratedRoot("span", "ui-light-editor");
+		const isInputDetail = (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["x"] === "number" && Number.isFinite(detail["x"]) && typeof detail["y"] === "number" && Number.isFinite(detail["y"]) && Object.keys(detail).every((key) => ["x", "y"].includes(key));
+		const dispatch = createDispatch(root, emit, {
+			checks: {
+				input: isInputDetail,
+				change: isInputDetail
+			},
+			modeled: ["x", "y"]
+		});
+		useComponentHost(() => import("@threadlabs/looma/components/ui-light-editor/ui-light-editor.js"), {
+			root,
+			module: true,
+			dispatch,
+			acceptsState: (name, keys, value) => acceptsControllerWrite(value, {
+				horizontal: {
+					kind: "terminal",
+					name: "string"
+				},
+				vertical: {
+					kind: "terminal",
+					name: "string"
+				}
+			}[name], keys),
+			initials: {
+				horizontal: "50",
+				vertical: "0"
+			},
+			controllerSource: {
+				specifier: "../components/ui-light-editor/ui-light-editor.js",
+				definition: "./components/ui-light-editor/ui-light-editor.html"
+			},
+			props: checkedProps,
+			inputs: propInputs,
+			inputTracking,
+			propInputs: (name) => {
+				const incoming = hydrationInstance?.vnode.props;
+				const kebab = name.replace(/[A-Z]/g, (letter) => "-" + letter.toLowerCase());
+				return incoming !== null && incoming !== void 0 ? incoming[name] ?? incoming[kebab] ?? null : null;
+			},
+			propNames: [
+				"disabled",
+				"label",
+				"size",
+				"x",
+				"y"
+			],
+			propValidity: (name) => propValidityState({
+				contract: propValidityContract,
+				values: { ...props }
+			}, name),
+			refs: {
+				plane: planeElement,
+				source: sourceElement
+			},
+			state: {
+				horizontal,
+				vertical
+			}
+		});
+		return (_ctx, _cache) => {
+			return withDirectives((openBlock(), createElementBlock("span", mergeProps({ class: "ui-light-editor" }, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-hn": "",
+				"data-hn-ui-light-editor": "",
+				"data-ui-light-editor-prop-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-ui-light-editor-prop-label": unref(reflectedProp)("label", "label", checkedProps.value.label, void 0, false),
+				"data-ui-light-editor-prop-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
+				"data-ui-light-editor-prop-x": unref(reflectedProp)("x", "x", checkedProps.value.x, void 0, false),
+				"data-ui-light-editor-prop-y": unref(reflectedProp)("y", "y", checkedProps.value.y, void 0, false),
+				ref_key: "root",
+				ref: root
+			}), [
+				createElementVNode("span", {
+					class: "stage",
+					role: "group",
+					"data-hn-ui-light-editor": "",
+					"aria-label": checkedProps.value.label ?? void 0
+				}, [createElementVNode("span", {
+					class: "plane",
+					"data-hn-ui-light-editor": "",
+					ref_key: "planeElement",
+					ref: planeElement
+				}, [
+					_cache[0] || (_cache[0] = createElementVNode("svg", {
+						viewBox: "0 0 100 60",
+						preserveAspectRatio: "none",
+						"aria-hidden": "true",
+						"data-hn-ui-light-editor": ""
+					}, [createElementVNode("path", {
+						d: "M0 30 H100 M50 0 V60",
+						"data-hn-ui-light-editor": ""
+					})], -1)),
+					_cache[1] || (_cache[1] = createTextVNode(toDisplayString(" "), -1)),
+					createElementVNode("span", _hoisted_3, [renderSlot(_ctx.$slots, "default", {}, void 0, true)]),
+					_cache[2] || (_cache[2] = createTextVNode(toDisplayString(" "), -1)),
+					createElementVNode("button", {
+						type: "button",
+						class: "source",
+						"data-hn-ui-light-editor": "",
+						disabled: checkedProps.value.disabled ?? void 0,
+						"aria-label": guarded.value,
+						ref_key: "sourceElement",
+						ref: sourceElement
+					}, null, 8, _hoisted_4)
+				], 512)], 8, _hoisted_2),
+				_cache[4] || (_cache[4] = createTextVNode(toDisplayString(" "), -1)),
+				createElementVNode("span", _hoisted_5, [
+					createVNode(UiNumberInput_default, mergeProps({
+						class: "ui-number-input",
+						"data-coordinate": "x",
+						min: 0,
+						max: 100,
+						step: 1,
+						unit: "%",
+						label: "Light horizontal position",
+						value: horizontal.value,
+						size: checkedProps.value.size,
+						disabled: checkedProps.value.disabled
+					}, { [unref(BINDING_INPUTS_PROP)]: {
+						size: () => ({
+							value: checkedProps.value.size,
+							status: inputStatus("size", true)
+						}),
+						disabled: () => ({
+							value: checkedProps.value.disabled,
+							status: inputStatus("disabled", true)
+						})
+					} }), null, 16, [
+						"value",
+						"size",
+						"disabled"
+					]),
+					_cache[3] || (_cache[3] = createTextVNode(toDisplayString(" "), -1)),
+					createVNode(UiNumberInput_default, mergeProps({
+						class: "ui-number-input",
+						"data-coordinate": "y",
+						min: 0,
+						max: 100,
+						step: 1,
+						unit: "%",
+						label: "Light vertical position",
+						value: vertical.value,
+						size: checkedProps.value.size,
+						disabled: checkedProps.value.disabled
+					}, { [unref(BINDING_INPUTS_PROP)]: {
+						size: () => ({
+							value: checkedProps.value.size,
+							status: inputStatus("size", true)
+						}),
+						disabled: () => ({
+							value: checkedProps.value.disabled,
+							status: inputStatus("disabled", true)
+						})
+					} }), null, 16, [
+						"value",
+						"size",
+						"disabled"
+					])
+				]),
+				_cache[5] || (_cache[5] = createTextVNode(toDisplayString(" "), -1)),
+				_cache[6] || (_cache[6] = createElementVNode("span", {
+					class: "hint",
+					"data-hn-ui-light-editor": ""
+				}, "Drag the light, use arrow keys, or enter its position. Top centre is 50%, 0%.", -1))
+			], 16, _hoisted_1)), [[unref(vPropValidity), {
+				contract: propValidityContract,
+				values: { ...props }
+			}]]);
+		};
+	}
+}), [["__scopeId", "data-v-1cd5c26a"]]);
+//#endregion
+export { UiLightEditor_default as t };

package/vue/chunks/UiList.js

@@ -1,5 +1,5 @@
-import { h as preserveRootFocus, i as checkHydratedRoot, p as nativeAttrs, t as _plugin_vue_export_helper_default, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
-import { f as vPropValidity, i as checkPropInput, p as vuePropInputs, t as BINDING_INPUTS_PROP } from "./props.js";
+import { b as useReflectedProp, g as preserveRootFocus, i as checkHydratedRoot, m as nativeAttrs, t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { i as checkPropInput, m as vuePropInputs, p as vPropValidity, t as BINDING_INPUTS_PROP } from "./props.js";
 import { computed, createElementBlock, defineComponent, mergeProps, openBlock, renderSlot, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiList.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [

package/vue/chunks/UiListItem.js

@@ -1,5 +1,5 @@
-import { i as checkHydratedRoot, p as nativeAttrs, t as _plugin_vue_export_helper_default, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
-import { f as vPropValidity, i as checkPropInput, p as vuePropInputs, t as BINDING_INPUTS_PROP } from "./props.js";
+import { b as useReflectedProp, i as checkHydratedRoot, m as nativeAttrs, t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { i as checkPropInput, m as vuePropInputs, p as vPropValidity, t as BINDING_INPUTS_PROP } from "./props.js";
 import { computed, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeProps, openBlock, renderSlot, toDisplayString, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiListItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [

package/vue/chunks/UiListbox.js

@@ -1,5 +1,5 @@
-import { _ as uniqueKeys, a as concat, i as checkHydratedRoot, n as KeyedBoundary, 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 { f as vPropValidity, i as checkPropInput, l as propValidityState, p as vuePropInputs, r as acceptsControllerWrite, t as BINDING_INPUTS_PROP } from "./props.js";
+import { a as concat, b as useReflectedProp, i as checkHydratedRoot, m as nativeAttrs, n as KeyedBoundary, o as createDispatch, r as attribute, t as _plugin_vue_export_helper_default, v as uniqueKeys, y as useComponentHost } from "./_plugin-vue_export-helper.js";
+import { i as checkPropInput, m as vuePropInputs, p as vPropValidity, r as acceptsControllerWrite, t as BINDING_INPUTS_PROP, u as propValidityState } from "./props.js";
 import { t as UiScrollArea_default } from "./UiScrollArea.js";
 import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, getCurrentInstance, mergeProps, normalizeClass, openBlock, provide, ref, renderList, renderSlot, toDisplayString, unref, useTemplateRef, watchSyncEffect, withCtx, withDirectives } from "vue";
 //#region .build/vue/UiListbox.vue?vue&type=script&setup=true&lang.ts

package/vue/chunks/UiMenu.js

@@ -1,5 +1,5 @@
-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 { f as vPropValidity, i as checkPropInput, l as propValidityState, p as vuePropInputs, r as acceptsControllerWrite, t as BINDING_INPUTS_PROP } from "./props.js";
+import { b as useReflectedProp, i as checkHydratedRoot, m as nativeAttrs, o as createDispatch, t as _plugin_vue_export_helper_default, y as useComponentHost } from "./_plugin-vue_export-helper.js";
+import { i as checkPropInput, m as vuePropInputs, p as vPropValidity, r as acceptsControllerWrite, t as BINDING_INPUTS_PROP, u as propValidityState } from "./props.js";
 import { computed, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, provide, ref, renderSlot, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiMenu.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
@@ -281,6 +281,6 @@ var UiMenu_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-2bb4f5c6"]]);
+}), [["__scopeId", "data-v-d3d70bb1"]]);
 //#endregion
 export { UiMenu_default as t };

package/vue/chunks/UiMenuGroup.js

@@ -1,5 +1,5 @@
-import { i as checkHydratedRoot, p as nativeAttrs, t as _plugin_vue_export_helper_default, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
-import { f as vPropValidity, i as checkPropInput, p as vuePropInputs, t as BINDING_INPUTS_PROP } from "./props.js";
+import { b as useReflectedProp, i as checkHydratedRoot, m as nativeAttrs, t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { i as checkPropInput, m as vuePropInputs, p as vPropValidity, t as BINDING_INPUTS_PROP } from "./props.js";
 import { computed, createCommentVNode, createElementBlock, createTextVNode, defineComponent, mergeProps, openBlock, renderSlot, toDisplayString, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiMenuGroup.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["aria-label", "data-ui-menu-group-prop-label"];

package/vue/chunks/UiMenuItem.js

@@ -1,5 +1,5 @@
-import { a as concat, h as preserveRootFocus, i as checkHydratedRoot, o as createDispatch, p as nativeAttrs, r as attribute, t as _plugin_vue_export_helper_default, v as useComponentHost, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
-import { f as vPropValidity, i as checkPropInput, l as propValidityState, p as vuePropInputs, r as acceptsControllerWrite, t as BINDING_INPUTS_PROP } from "./props.js";
+import { a as concat, b as useReflectedProp, g as preserveRootFocus, i as checkHydratedRoot, m as nativeAttrs, o as createDispatch, r as attribute, t as _plugin_vue_export_helper_default, y as useComponentHost } from "./_plugin-vue_export-helper.js";
+import { i as checkPropInput, m as vuePropInputs, p as vPropValidity, r as acceptsControllerWrite, t as BINDING_INPUTS_PROP, u as propValidityState } from "./props.js";
 import { t as UiIcon_default } from "./UiIcon.js";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, provide, ref, renderSlot, toDisplayString, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiMenuItem.vue?vue&type=script&setup=true&lang.ts

package/vue/chunks/UiMeter.js

@@ -1,5 +1,5 @@
-import { a as concat, c as decimalMultiply, f as math, i as checkHydratedRoot, l as decimalSubtract, m as number, p as nativeAttrs, r as attribute, s as cycleCheckedComputed, t as _plugin_vue_export_helper_default, u as formatValue, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
-import { c as inputRead, f as vPropValidity, i as checkPropInput, p as vuePropInputs, s as inputComputed, t as BINDING_INPUTS_PROP } from "./props.js";
+import { a as concat, b as useReflectedProp, c as decimalMultiply, h as number, i as checkHydratedRoot, l as decimalSubtract, m as nativeAttrs, p as math, r as attribute, s as cycleCheckedComputed, t as _plugin_vue_export_helper_default, u as formatValue } from "./_plugin-vue_export-helper.js";
+import { c as inputComputed, i as checkPropInput, l as inputRead, m as vuePropInputs, p as vPropValidity, t as BINDING_INPUTS_PROP } from "./props.js";
 import { Fragment, computed, createCommentVNode, createElementBlock, createTextVNode, defineComponent, mergeProps, normalizeStyle, openBlock, renderList, toDisplayString, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiMeter.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [

package/vue/chunks/UiNavItem.js

@@ -1,5 +1,5 @@
-import { a as concat, h as preserveRootFocus, i as checkHydratedRoot, p as nativeAttrs, r as attribute, t as _plugin_vue_export_helper_default, y as useReflectedProp } from "./_plugin-vue_export-helper.js";
-import { f as vPropValidity, i as checkPropInput, p as vuePropInputs, t as BINDING_INPUTS_PROP } from "./props.js";
+import { a as concat, b as useReflectedProp, g as preserveRootFocus, i as checkHydratedRoot, m as nativeAttrs, r as attribute, t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { i as checkPropInput, m as vuePropInputs, p as vPropValidity, t as BINDING_INPUTS_PROP } from "./props.js";
 import { computed, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeProps, openBlock, renderSlot, toDisplayString, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiNavItem.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [