@threadlabs/looma 0.22.12 → 0.22.14

package/vue/chunks/UiCard.js

@@ -6,6 +6,7 @@ import { computed, createElementBlock, defineComponent, getCurrentInstance, merg
 var _hoisted_1 = [
 	"data-as",
 	"data-padding",
+	"data-size",
 	"data-tone",
 	"data-variant",
 	"data-ui-card-state"
@@ -13,6 +14,7 @@ var _hoisted_1 = [
 var _hoisted_2 = [
 	"data-as",
 	"data-padding",
+	"data-size",
 	"data-tone",
 	"data-variant",
 	"data-ui-card-state"
@@ -20,6 +22,7 @@ var _hoisted_2 = [
 var _hoisted_3 = [
 	"data-as",
 	"data-padding",
+	"data-size",
 	"data-tone",
 	"data-variant",
 	"data-ui-card-state"
@@ -27,6 +30,7 @@ var _hoisted_3 = [
 var _hoisted_4 = [
 	"data-as",
 	"data-padding",
+	"data-size",
 	"data-tone",
 	"data-variant",
 	"data-ui-card-state"
@@ -45,6 +49,10 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			type: null,
 			default: "md"
 		},
+		size: {
+			type: null,
+			default: "content"
+		},
 		tone: {
 			type: null,
 			default: "neutral"
@@ -79,14 +87,31 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				},
 				required: false,
 				target: { attribute: "padding" },
-				description: "The space inside the card: sm is snug (0.75rem), md is the default (1.5rem), and lg is roomy (2rem).",
+				description: "The space inside the card: xs is compact (0.5rem), sm is snug (0.75rem), md is the default (1.5rem), and lg is roomy (2rem).",
 				values: [
+					"xs",
 					"sm",
 					"md",
 					"lg"
 				],
 				default: "md"
 			},
+			size: {
+				type: {
+					kind: "terminal",
+					name: "keyword"
+				},
+				required: false,
+				target: { attribute: "size" },
+				description: "Optional size preset. content keeps the existing intrinsic sizing; the other sizes constrain the surface for compact, medium, or large content.",
+				values: [
+					"content",
+					"sm",
+					"md",
+					"lg"
+				],
+				default: "content"
+			},
 			tone: {
 				type: {
 					kind: "terminal",
@@ -118,6 +143,7 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 		const acceptedProps = {
 			as: "div",
 			padding: "md",
+			size: "content",
 			tone: "neutral",
 			variant: "outlined"
 		};
@@ -130,6 +156,10 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				kind: "terminal",
 				name: "keyword"
 			}, false, "padding", acceptedProps),
+			size: checkedProp(props["size"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "size", acceptedProps),
 			tone: checkedProp(props["tone"], {
 				kind: "terminal",
 				name: "keyword"
@@ -173,7 +203,9 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			checkedProps.value.variant && "variant",
 			checkedProps.value.variant != null && `variant=${encodeURIComponent(checkedProps.value.variant)}`,
 			checkedProps.value.tone && "tone",
-			checkedProps.value.tone != null && `tone=${encodeURIComponent(checkedProps.value.tone)}`
+			checkedProps.value.tone != null && `tone=${encodeURIComponent(checkedProps.value.tone)}`,
+			checkedProps.value.size && "size",
+			checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`
 		].filter(Boolean).join(" "));
 		return (_ctx, _cache) => {
 			return checkedProps.value.as === "section" ? withDirectives((openBlock(), createElementBlock("section", mergeProps({
@@ -182,6 +214,7 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}, nativeAttrs(_ctx.$attrs), {
 				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
 				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, 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-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
@@ -195,6 +228,7 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}, nativeAttrs(_ctx.$attrs), {
 				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
 				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, 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-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
@@ -208,6 +242,7 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}, nativeAttrs(_ctx.$attrs), {
 				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
 				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, 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-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
@@ -221,6 +256,7 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}, nativeAttrs(_ctx.$attrs), {
 				"data-as": reflectedProp("as", "as", checkedProps.value.as, void 0, false),
 				"data-padding": reflectedProp("padding", "padding", checkedProps.value.padding, 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-variant": reflectedProp("variant", "variant", checkedProps.value.variant, void 0, false),
 				"data-ui-card-state": hostState.value || void 0,
@@ -231,6 +267,6 @@ var UiCard_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-6699d01e"]]);
+}), [["__scopeId", "data-v-5ac43da6"]]);
 //#endregion
 export { UiCard_default as t };

package/vue/chunks/UiIcon.js

@@ -352,6 +352,20 @@ var UiIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				tag: "path",
 				d: "m5.082 11.09 8.828 8.828"
 			}],
+			"external-link": [
+				{
+					tag: "path",
+					d: "M15 3h6v6"
+				},
+				{
+					tag: "path",
+					d: "M10 14 21 3"
+				},
+				{
+					tag: "path",
+					d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
+				}
+			],
 			"file-text": [
 				{
 					tag: "path",
@@ -824,6 +838,13 @@ var UiIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				tag: "path",
 				d: "M3 9h18"
 			}],
+			pencil: [{
+				tag: "path",
+				d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"
+			}, {
+				tag: "path",
+				d: "m15 5 4 4"
+			}],
 			pilcrow: [
 				{
 					tag: "path",
@@ -891,6 +912,15 @@ var UiIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 					d: "M21 15H3"
 				}
 			],
+			search: [{
+				tag: "path",
+				d: "m21 21-4.34-4.34"
+			}, {
+				tag: "circle",
+				cx: "11",
+				cy: "11",
+				r: "8"
+			}],
 			settings: [{
 				tag: "path",
 				d: "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915"
@@ -1028,6 +1058,44 @@ var UiIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 				tag: "path",
 				d: "M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11"
 			}],
+			unlink: [
+				{
+					tag: "path",
+					d: "m18.84 12.25 1.72-1.71h-.02a5.004 5.004 0 0 0-.12-7.07 5.006 5.006 0 0 0-6.95 0l-1.72 1.71"
+				},
+				{
+					tag: "path",
+					d: "m5.17 11.75-1.71 1.71a5.004 5.004 0 0 0 .12 7.07 5.006 5.006 0 0 0 6.95 0l1.71-1.71"
+				},
+				{
+					tag: "line",
+					x1: "8",
+					x2: "8",
+					y1: "2",
+					y2: "5"
+				},
+				{
+					tag: "line",
+					x1: "2",
+					x2: "5",
+					y1: "8",
+					y2: "8"
+				},
+				{
+					tag: "line",
+					x1: "16",
+					x2: "16",
+					y1: "19",
+					y2: "22"
+				},
+				{
+					tag: "line",
+					x1: "19",
+					x2: "22",
+					y1: "16",
+					y2: "16"
+				}
+			],
 			"user-round": [{
 				tag: "circle",
 				cx: "12",
@@ -1123,6 +1191,6 @@ var UiIcon_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-d26ad280"]]);
+}), [["__scopeId", "data-v-5aa6beca"]]);
 //#endregion
 export { UiIcon_default as t };

package/vue/chunks/UiInput.js

@@ -690,6 +690,6 @@ var UiInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-0226cb52"]]);
+}), [["__scopeId", "data-v-f900b391"]]);
 //#endregion
 export { UiInput_default as t };

package/vue/chunks/UiInputGroup.js

@@ -3,7 +3,11 @@ import { r as useComponentHost, t as createDispatch } from "./host.js";
 import { i as vPropValidity, n as propValidityState, t as checkedProp } from "./props.js";
 import { computed, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, renderSlot, unref, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiInputGroup.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = ["data-disabled", "data-ui-input-group-state"];
+var _hoisted_1 = [
+	"data-disabled",
+	"data-prefix-kind",
+	"data-ui-input-group-state"
+];
 var _hoisted_2 = { class: "affix" };
 var _hoisted_3 = { class: "field" };
 var _hoisted_4 = { class: "affix" };
@@ -13,27 +17,55 @@ var _hoisted_5 = { class: "action" };
 var UiInputGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
 	inheritAttrs: false,
 	__name: "UiInputGroup",
-	props: { disabled: {
-		type: null,
-		default: false
-	} },
+	props: {
+		disabled: {
+			type: null,
+			default: false
+		},
+		prefixKind: {
+			type: null,
+			default: "text"
+		}
+	},
 	setup(__props) {
-		const propValidityContract = { props: { disabled: {
-			type: {
-				kind: "terminal",
-				name: "boolean"
+		const propValidityContract = { props: {
+			disabled: {
+				type: {
+					kind: "terminal",
+					name: "boolean"
+				},
+				required: false,
+				target: { attribute: "disabled" },
+				description: "Fades the group's framing to match a disabled input inside it. Disable the input itself too.",
+				default: false
 			},
-			required: false,
-			target: { attribute: "disabled" },
-			description: "Fades the group's framing to match a disabled input inside it. Disable the input itself too.",
-			default: false
-		} } };
+			prefixKind: {
+				type: {
+					kind: "terminal",
+					name: "keyword"
+				},
+				required: false,
+				target: { attribute: "prefixkind" },
+				description: "Text affixes have their own framing. An icon prefix shares the field surface and uses one compact icon-to-value gap.",
+				values: ["text", "icon"],
+				default: "text"
+			}
+		} };
 		const props = __props;
-		const acceptedProps = { disabled: false };
-		const checkedProps = computed(() => ({ disabled: checkedProp(props["disabled"], {
-			kind: "terminal",
-			name: "boolean"
-		}, false, "disabled", acceptedProps) }));
+		const acceptedProps = {
+			disabled: false,
+			prefixKind: "text"
+		};
+		const checkedProps = computed(() => ({
+			disabled: checkedProp(props["disabled"], {
+				kind: "terminal",
+				name: "boolean"
+			}, false, "disabled", acceptedProps),
+			prefixKind: checkedProp(props["prefixKind"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "prefixKind", acceptedProps)
+		}));
 		checkedProps.value;
 		watchSyncEffect(() => {
 			checkedProps.value;
@@ -61,7 +93,11 @@ var UiInputGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			})
 		});
 		/** The values the styles' :host-state() rules test. */
-		const hostState = computed(() => [checkedProps.value.disabled && "disabled"].filter(Boolean).join(" "));
+		const hostState = computed(() => [
+			checkedProps.value.disabled && "disabled",
+			checkedProps.value.prefixKind && "prefixKind",
+			checkedProps.value.prefixKind != null && `prefixKind=${encodeURIComponent(checkedProps.value.prefixKind)}`
+		].filter(Boolean).join(" "));
 		const dispatch = createDispatch(root);
 		useComponentHost(() => import("@threadlabs/looma/components/ui-input-group/ui-input-group.js"), {
 			root,
@@ -76,7 +112,7 @@ var UiInputGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				const kebab = name.replace(/[A-Z]/g, (letter) => "-" + letter.toLowerCase());
 				return incoming !== null && incoming !== void 0 ? incoming[name] ?? incoming[kebab] ?? null : null;
 			},
-			propNames: ["disabled"],
+			propNames: ["disabled", "prefixKind"],
 			propValidity: (name) => propValidityState({
 				contract: propValidityContract,
 				values: { ...props }
@@ -85,6 +121,7 @@ var UiInputGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 		return (_ctx, _cache) => {
 			return withDirectives((openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-input-group" }, nativeAttrs(_ctx.$attrs), {
 				"data-disabled": reflectedProp("disabled", "disabled", checkedProps.value.disabled, void 0, false),
+				"data-prefix-kind": reflectedProp("prefixKind", "prefix-kind", checkedProps.value.prefixKind, void 0, false),
 				"data-ui-input-group-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
@@ -99,6 +136,6 @@ var UiInputGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-5cf4aea5"]]);
+}), [["__scopeId", "data-v-7050a5eb"]]);
 //#endregion
 export { UiInputGroup_default as t };

package/vue/chunks/UiPopover.js

@@ -7,6 +7,7 @@ var _hoisted_1 = [
 	"data-for",
 	"data-open",
 	"data-placement",
+	"data-size",
 	"data-ui-popover-state"
 ];
 var _hoisted_2 = { class: "surface" };
@@ -27,6 +28,10 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 		placement: {
 			type: null,
 			default: "bottom-start"
+		},
+		size: {
+			type: null,
+			default: "content"
 		}
 	},
 	emits: [
@@ -79,13 +84,30 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 					"right-end"
 				],
 				default: "bottom-start"
+			},
+			size: {
+				type: {
+					kind: "terminal",
+					name: "keyword"
+				},
+				required: false,
+				target: { attribute: "size" },
+				description: "Optional size preset. content keeps the existing intrinsic sizing; the other sizes constrain the surface for compact, medium, or large content.",
+				values: [
+					"content",
+					"sm",
+					"md",
+					"lg"
+				],
+				default: "content"
 			}
 		} };
 		const props = __props;
 		const acceptedProps = {
 			for: "",
 			open: false,
-			placement: "bottom-start"
+			placement: "bottom-start",
+			size: "content"
 		};
 		const checkedProps = computed(() => ({
 			for: checkedProp(props["for"], {
@@ -99,7 +121,11 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 			placement: checkedProp(props["placement"], {
 				kind: "terminal",
 				name: "keyword"
-			}, false, "placement", acceptedProps)
+			}, false, "placement", acceptedProps),
+			size: checkedProp(props["size"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "size", acceptedProps)
 		}));
 		checkedProps.value;
 		watchSyncEffect(() => {
@@ -131,7 +157,11 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 			})
 		});
 		/** The values the styles' :host-state() rules test. */
-		const hostState = computed(() => [internalOpen.value && "internalOpen"].filter(Boolean).join(" "));
+		const hostState = computed(() => [
+			internalOpen.value && "internalOpen",
+			checkedProps.value.size && "size",
+			checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`
+		].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",
@@ -160,7 +190,8 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 			propNames: [
 				"for",
 				"open",
-				"placement"
+				"placement",
+				"size"
 			],
 			propValidity: (name) => propValidityState({
 				contract: propValidityContract,
@@ -173,6 +204,7 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 				"data-for": reflectedProp("for", "for", checkedProps.value.for, void 0, false),
 				"data-open": reflectedProp("open", "open", checkedProps.value.open, void 0, false),
 				"data-placement": reflectedProp("placement", "placement", checkedProps.value.placement, void 0, false),
+				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
 				"data-ui-popover-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
@@ -182,6 +214,6 @@ var UiPopover_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-876af604"]]);
+}), [["__scopeId", "data-v-639bc886"]]);
 //#endregion
 export { UiPopover_default as t };

package/vue/chunks/UiScrollArea.js

@@ -3,7 +3,11 @@ import { r as useComponentHost, t as createDispatch } from "./host.js";
 import { i as vPropValidity, n as propValidityState, t as checkedProp } from "./props.js";
 import { computed, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, mergeProps, openBlock, ref, renderSlot, unref, useTemplateRef, watchSyncEffect, withDirectives } from "vue";
 //#region .build/vue/UiScrollArea.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = ["data-orientation", "data-ui-scroll-area-state"];
+var _hoisted_1 = [
+	"data-orientation",
+	"data-size",
+	"data-ui-scroll-area-state"
+];
 var _hoisted_2 = {
 	class: "content",
 	ref: "content"
@@ -13,28 +17,61 @@ var _hoisted_2 = {
 var UiScrollArea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
 	inheritAttrs: false,
 	__name: "UiScrollArea",
-	props: { orientation: {
-		type: null,
-		default: "vertical"
-	} },
+	props: {
+		orientation: {
+			type: null,
+			default: "vertical"
+		},
+		size: {
+			type: null,
+			default: "content"
+		}
+	},
 	setup(__props) {
-		const propValidityContract = { props: { orientation: {
-			type: {
-				kind: "terminal",
-				name: "keyword"
+		const propValidityContract = { props: {
+			orientation: {
+				type: {
+					kind: "terminal",
+					name: "keyword"
+				},
+				required: false,
+				target: { attribute: "orientation" },
+				description: "The direction the content scrolls. Vertical scrolls up and down and clips sideways overflow; horizontal scrolls sideways and clips vertical\n      overflow.",
+				values: ["vertical", "horizontal"],
+				default: "vertical"
 			},
-			required: false,
-			target: { attribute: "orientation" },
-			description: "The direction the content scrolls. Vertical scrolls up and down and clips sideways overflow; horizontal scrolls sideways and clips vertical\n      overflow.",
-			values: ["vertical", "horizontal"],
-			default: "vertical"
-		} } };
+			size: {
+				type: {
+					kind: "terminal",
+					name: "keyword"
+				},
+				required: false,
+				target: { attribute: "size" },
+				description: "Optional height preset. content keeps intrinsic sizing; sm fits three compact 3.125rem result rows, md is 20rem, and lg is 30rem.",
+				values: [
+					"content",
+					"sm",
+					"md",
+					"lg"
+				],
+				default: "content"
+			}
+		} };
 		const props = __props;
-		const acceptedProps = { orientation: "vertical" };
-		const checkedProps = computed(() => ({ orientation: checkedProp(props["orientation"], {
-			kind: "terminal",
-			name: "keyword"
-		}, false, "orientation", acceptedProps) }));
+		const acceptedProps = {
+			orientation: "vertical",
+			size: "content"
+		};
+		const checkedProps = computed(() => ({
+			orientation: checkedProp(props["orientation"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "orientation", acceptedProps),
+			size: checkedProp(props["size"], {
+				kind: "terminal",
+				name: "keyword"
+			}, false, "size", acceptedProps)
+		}));
 		checkedProps.value;
 		watchSyncEffect(() => {
 			checkedProps.value;
@@ -63,7 +100,12 @@ var UiScrollArea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			})
 		});
 		/** The values the styles' :host-state() rules test. */
-		const hostState = computed(() => [checkedProps.value.orientation && "orientation", checkedProps.value.orientation != null && `orientation=${encodeURIComponent(checkedProps.value.orientation)}`].filter(Boolean).join(" "));
+		const hostState = computed(() => [
+			checkedProps.value.orientation && "orientation",
+			checkedProps.value.orientation != null && `orientation=${encodeURIComponent(checkedProps.value.orientation)}`,
+			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-scroll-area/ui-scroll-area.js"), {
 			root,
@@ -78,7 +120,7 @@ var UiScrollArea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 				const kebab = name.replace(/[A-Z]/g, (letter) => "-" + letter.toLowerCase());
 				return incoming !== null && incoming !== void 0 ? incoming[name] ?? incoming[kebab] ?? null : null;
 			},
-			propNames: ["orientation"],
+			propNames: ["orientation", "size"],
 			propValidity: (name) => propValidityState({
 				contract: propValidityContract,
 				values: { ...props }
@@ -88,6 +130,7 @@ var UiScrollArea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 		return (_ctx, _cache) => {
 			return withDirectives((openBlock(), createElementBlock("div", mergeProps({ "data-component": "ui-scroll-area" }, nativeAttrs(_ctx.$attrs), {
 				"data-orientation": reflectedProp("orientation", "orientation", checkedProps.value.orientation, void 0, false),
+				"data-size": reflectedProp("size", "size", checkedProps.value.size, void 0, false),
 				"data-ui-scroll-area-state": hostState.value || void 0,
 				ref_key: "root",
 				ref: root
@@ -97,6 +140,6 @@ var UiScrollArea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-1357c460"]]);
+}), [["__scopeId", "data-v-97150230"]]);
 //#endregion
 export { UiScrollArea_default as t };