@threadlabs/looma 0.37.5 → 0.38.0

package/vue/chunks/UiIconButton.js

@@ -182,9 +182,8 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				},
 				required: false,
 				target: { attribute: "tone" },
-				description: "Colour for every variant. auto preserves the existing variant-specific default. When omitted, ghost and outline keep their neutral appearance and solid\n      keeps its accent fill. Set accent for a coloured action or neutral for a quiet one. danger, success, warning and info share Button's intent colors. Native\n      aria-pressed=\"true\" keeps an outline toggle visibly pressed; the consumer owns that state.",
+				description: "Colour for every variant. The default neutral shares the quiet control family with fields and text buttons. Choose accent explicitly for a coloured action,\n      or primary for solid accent. danger, success, warning and info share Button's intent colors. Native aria-pressed=\"true\" keeps an outline toggle visibly\n      pressed; the consumer owns that state.",
 				values: [
-					"auto",
 					"accent",
 					"neutral",
 					"danger",
@@ -192,7 +191,7 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 					"warning",
 					"info"
 				],
-				default: "auto"
+				default: "neutral"
 			},
 			variant: {
 				type: {
@@ -201,7 +200,7 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				},
 				required: false,
 				target: { attribute: "variant" },
-				description: "Emphasis. ghost shows only the icon until it is hovered, for toolbars and dense rows; outline adds a border on the default surface; solid fills with the\n      accent colour, for the one primary action in a group.",
+				description: "Emphasis. ghost shows only the icon until it is hovered, for toolbars and dense rows; outline adds a border on the default surface; solid fills with its\n      chosen tone.",
 				values: [
 					"ghost",
 					"outline",
@@ -223,7 +222,7 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			revealed: false,
 			round: false,
 			size: "md",
-			tone: "auto",
+			tone: "neutral",
 			variant: "ghost"
 		}, {
 			anticipatory: false,
@@ -236,7 +235,7 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			revealed: false,
 			round: false,
 			size: "md",
-			tone: "auto",
+			tone: "neutral",
 			variant: "ghost"
 		}, (name, value, source, values) => {
 			switch (name) {
@@ -463,6 +462,6 @@ var UiIconButton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-4981b6fa"]]);
+}), [["__scopeId", "data-v-d48cf3c9"]]);
 //#endregion
 export { UiIconButton_default as t };

package/vue/chunks/UiMenuItem.js

@@ -369,6 +369,6 @@ var UiMenuItem_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-5302324a"]]);
+}), [["__scopeId", "data-v-467d3ba0"]]);
 //#endregion
 export { UiMenuItem_default as t };

package/vue/chunks/UiSelect.js

@@ -9,6 +9,7 @@ var _hoisted_1 = [
 	"aria-invalid",
 	"data-ui-select-prop-disabled",
 	"data-ui-select-prop-invalid",
+	"data-ui-select-prop-muted",
 	"data-ui-select-prop-required",
 	"data-ui-select-prop-size",
 	"data-ui-select-prop-value",
@@ -22,6 +23,7 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 	props: {
 		disabled: { type: null },
 		invalid: { type: null },
+		muted: { type: null },
 		required: { type: null },
 		size: { type: null },
 		value: { type: null },
@@ -51,6 +53,16 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				description: "Exposes invalid state to assistive technology and styling.",
 				default: false
 			},
+			muted: {
+				type: {
+					kind: "terminal",
+					name: "boolean"
+				},
+				required: false,
+				target: { attribute: "muted" },
+				description: "Shows the selected value with supporting-text emphasis, for an inherited or default choice. The select remains interactive and its options retain normal\n      emphasis.",
+				default: false
+			},
 			required: {
 				type: {
 					kind: "terminal",
@@ -90,6 +102,7 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 		const acceptedProps = {
 			disabled: false,
 			invalid: false,
+			muted: false,
 			required: false,
 			size: "md",
 			value: null
@@ -97,6 +110,7 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 		const inputTracking = vuePropInputs(acceptedProps, {
 			disabled: false,
 			invalid: false,
+			muted: false,
 			required: false,
 			size: "md"
 		}, (name, value, source, values) => {
@@ -109,6 +123,10 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 					kind: "terminal",
 					name: "boolean"
 				}, true, true);
+				case "muted": return checkPropInput(value, {
+					kind: "terminal",
+					name: "boolean"
+				}, true, true);
 				case "required": return checkPropInput(value, {
 					kind: "terminal",
 					name: "boolean"
@@ -132,6 +150,7 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 			return {
 				disabled: propInputs.value("disabled", props["disabled"], props[BINDING_INPUTS_PROP]),
 				invalid: propInputs.value("invalid", props["invalid"], props[BINDING_INPUTS_PROP]),
+				muted: propInputs.value("muted", props["muted"], props[BINDING_INPUTS_PROP]),
 				required: propInputs.value("required", props["required"], props[BINDING_INPUTS_PROP]),
 				size: propInputs.value("size", props["size"], props[BINDING_INPUTS_PROP]),
 				value: propInputs.value("value", props["value"], props[BINDING_INPUTS_PROP]),
@@ -155,7 +174,11 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 		const root = ref(null);
 		checkHydratedRoot("select", "ui-select");
 		/** The values the styles' :host() and :state() rules test. */
-		const hostState = computed(() => [checkedProps.value.size && "size", checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`].filter(Boolean).join(" "));
+		const hostState = computed(() => [
+			checkedProps.value.muted && "muted",
+			checkedProps.value.size && "size",
+			checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`
+		].filter(Boolean).join(" "));
 		const dispatch = createDispatch(root);
 		useComponentHost(() => import("@threadlabs/looma/components/ui-select/ui-select.js"), {
 			root,
@@ -176,6 +199,7 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 			propNames: [
 				"disabled",
 				"invalid",
+				"muted",
 				"required",
 				"size",
 				"value"
@@ -194,6 +218,7 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 				"aria-invalid": checkedProps.value.invalid ?? void 0,
 				"data-ui-select-prop-disabled": unref(reflectedProp)("disabled", "disabled", checkedProps.value.disabled, void 0, false),
 				"data-ui-select-prop-invalid": unref(reflectedProp)("invalid", "invalid", checkedProps.value.invalid, void 0, false),
+				"data-ui-select-prop-muted": unref(reflectedProp)("muted", "muted", checkedProps.value.muted, void 0, false),
 				"data-ui-select-prop-required": unref(reflectedProp)("required", "required", checkedProps.value.required, void 0, false),
 				"data-ui-select-prop-size": unref(reflectedProp)("size", "size", checkedProps.value.size, void 0, false),
 				"data-ui-select-prop-value": unref(reflectedProp)("value", "value", checkedProps.value.value, void 0, false),
@@ -221,6 +246,6 @@ var UiSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-b5f523b2"]]);
+}), [["__scopeId", "data-v-988e4463"]]);
 //#endregion
 export { UiSelect_default as t };

package/vue/chunks/UiSkeleton.js

@@ -0,0 +1,151 @@
+import { C as useReflectedProp, _ as nativeAttrs, a as checkHydratedRoot, t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
+import { h as vuePropInputs, i as checkPropInput, m as vPropValidity, t as BINDING_INPUTS_PROP } from "./props.js";
+import { computed, createElementBlock, defineComponent, mergeProps, openBlock, unref, watchSyncEffect, withDirectives } from "vue";
+//#region .build/vue/UiSkeleton.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"data-ui-skeleton-prop-animated",
+	"data-ui-skeleton-prop-height",
+	"data-ui-skeleton-prop-shape",
+	"data-ui-skeleton-prop-width",
+	"data-ui-skeleton-state"
+];
+//#endregion
+//#region .build/vue/UiSkeleton.vue
+var UiSkeleton_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "UiSkeleton",
+	props: {
+		animated: { type: null },
+		height: { type: null },
+		shape: { type: null },
+		width: { type: null },
+		[BINDING_INPUTS_PROP]: { type: null }
+	},
+	setup(__props) {
+		const propValidityContract = { props: {
+			animated: {
+				type: {
+					kind: "terminal",
+					name: "boolean"
+				},
+				required: false,
+				target: { attribute: "animated" },
+				description: "Gently pulses the placeholder. Off by default, and always still when the reader requests reduced motion.",
+				default: false
+			},
+			height: {
+				type: {
+					kind: "terminal",
+					name: "string"
+				},
+				required: false,
+				target: { attribute: "height" },
+				description: "Block size as a CSS length. Empty reserves one line for text, a square for circles, or 8rem for rectangles. Set only width to keep a circle square.",
+				default: ""
+			},
+			shape: {
+				type: {
+					kind: "terminal",
+					name: "keyword"
+				},
+				required: false,
+				target: { attribute: "shape" },
+				description: "The content's silhouette. text reserves one inherited line box with a shorter bar inside it; circle matches a medium Avatar; rectangle reserves a media\n      area.",
+				values: [
+					"text",
+					"circle",
+					"rectangle"
+				],
+				default: "text"
+			},
+			width: {
+				type: {
+					kind: "terminal",
+					name: "string"
+				},
+				required: false,
+				target: { attribute: "width" },
+				description: "Inline size as a CSS length or percentage, constrained to the container. Empty fills the available width for text and rectangles, or matches a medium\n      Avatar's outer size for circles.",
+				default: ""
+			}
+		} };
+		const props = __props;
+		const inputTracking = vuePropInputs({
+			animated: false,
+			height: "",
+			shape: "text",
+			width: ""
+		}, {
+			animated: false,
+			height: "",
+			shape: "text",
+			width: ""
+		}, (name, value, source, values) => {
+			switch (name) {
+				case "animated": return checkPropInput(value, {
+					kind: "terminal",
+					name: "boolean"
+				}, true, true);
+				case "height": return checkPropInput(value, {
+					kind: "terminal",
+					name: "string"
+				}, true, true);
+				case "shape": return checkPropInput(value, {
+					kind: "terminal",
+					name: "keyword"
+				}, true, true);
+				case "width": return checkPropInput(value, {
+					kind: "terminal",
+					name: "string"
+				}, true, true);
+				default: return { ok: false };
+			}
+		}, () => {
+			checkedProps.value;
+		});
+		const propInputs = inputTracking.inputs;
+		const checkedProps = computed(() => {
+			inputTracking.version.value;
+			return {
+				animated: propInputs.value("animated", props["animated"], props[BINDING_INPUTS_PROP]),
+				height: propInputs.value("height", props["height"], props[BINDING_INPUTS_PROP]),
+				shape: propInputs.value("shape", props["shape"], props[BINDING_INPUTS_PROP]),
+				width: propInputs.value("width", props["width"], props[BINDING_INPUTS_PROP])
+			};
+		});
+		checkedProps.value;
+		watchSyncEffect(() => {
+			checkedProps.value;
+		});
+		const reflectedProp = useReflectedProp();
+		checkHydratedRoot("span", "ui-skeleton");
+		/** The values the styles' :host() and :state() rules test. */
+		const hostState = computed(() => [
+			checkedProps.value.shape && "shape",
+			checkedProps.value.shape != null && `shape=${encodeURIComponent(checkedProps.value.shape)}`,
+			checkedProps.value.animated && "animated"
+		].filter(Boolean).join(" "));
+		return (_ctx, _cache) => {
+			return withDirectives((openBlock(), createElementBlock("span", mergeProps({
+				class: "ui-skeleton",
+				"aria-hidden": "true"
+			}, unref(nativeAttrs)(_ctx.$attrs), {
+				"data-hn": "",
+				style: {
+					"--ui-skeleton-width": checkedProps.value.width ?? void 0,
+					"--ui-skeleton-height": checkedProps.value.height ?? void 0
+				},
+				"data-ui-skeleton-prop-animated": unref(reflectedProp)("animated", "animated", checkedProps.value.animated, void 0, false),
+				"data-ui-skeleton-prop-height": unref(reflectedProp)("height", "height", checkedProps.value.height, void 0, false),
+				"data-ui-skeleton-prop-shape": unref(reflectedProp)("shape", "shape", checkedProps.value.shape, void 0, false),
+				"data-ui-skeleton-prop-width": unref(reflectedProp)("width", "width", checkedProps.value.width, void 0, false),
+				"data-ui-skeleton-state": hostState.value || void 0
+			}), null, 16, _hoisted_1)), [[unref(vPropValidity), {
+				contract: propValidityContract,
+				values: { ...props }
+			}]]);
+		};
+	}
+}), [["__scopeId", "data-v-ee40410c"]]);
+//#endregion
+export { UiSkeleton_default as t };