@youcan/celeste 0.9.2 → 0.10.0

package/dist/cjs/chunks/checkbox-label.cjs

@@ -1,4 +1,3 @@
-require("./chunk.cjs");
 const require_clsx = require("./clsx.cjs");
 const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
 const require_Primitive = require("./Primitive.cjs");
@@ -15,7 +14,7 @@ var _hoisted_3 = {
 	role: "presentation",
 	class: "celeste-checkbox-label-content"
 };
-var checkbox_label_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+var checkbox_label_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	__name: "checkbox-label",
 	props: {
 		for: {},
@@ -23,15 +22,21 @@ var checkbox_label_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		as: {},
 		required: { type: Boolean },
 		disabled: { type: Boolean },
-		class: {}
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
 	},
 	setup(__props) {
 		const props = __props;
 		const delegatedProps = require_use_delegated_props.useDelegatedProps(props, "class");
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_Label.Label_default), (0, vue.mergeProps)((0, vue.unref)(delegatedProps), {
-				"aria-required": _ctx.required,
-				"aria-disabcled": _ctx.disabled,
+				"aria-required": __props.required,
+				"aria-disabcled": __props.disabled,
 				class: (0, vue.unref)(require_clsx.clsx)("celeste-checkbox-label", props.class)
 			}), {
 				default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(require_Primitive.Primitive), {
@@ -86,7 +91,7 @@ var checkbox_label_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 });
 //#endregion
 //#region src/components/checkbox/checkbox-label.vue
-var checkbox_label_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(checkbox_label_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4692ccc9"]]);
+var checkbox_label_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(checkbox_label_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4692ccc9"]]);
 //#endregion
 Object.defineProperty(exports, "checkbox_label_default", {
 	enumerable: true,

package/dist/cjs/chunks/checkbox.cjs

@@ -1,10 +1,9 @@
-require("./chunk.cjs");
 const require_clsx = require("./clsx.cjs");
 const require_ohash_D__AXeF1 = require("./ohash.D__AXeF1.cjs");
 const require_createContext = require("./createContext.cjs");
 const require_nullish = require("./nullish.cjs");
 const require_isValueEqualOrExist = require("./isValueEqualOrExist.cjs");
-const require_dist = require("./dist.cjs");
+const require_dist = require("./dist2.cjs");
 const require_Primitive = require("./Primitive.cjs");
 const require_useFormControl = require("./useFormControl.cjs");
 const require_useForwardExpose = require("./useForwardExpose.cjs");
@@ -15,10 +14,10 @@ const require_VisuallyHiddenInput = require("./VisuallyHiddenInput.cjs");
 const require_RovingFocusItem = require("./RovingFocusItem.cjs");
 const require_use_delegated_props = require("../use-delegated-props.cjs");
 let vue = require("vue");
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/CheckboxGroupRoot.js
-var [injectCheckboxGroupRootContext, provideCheckboxGroupRootContext] = /* @__PURE__ */ require_createContext.createContext("CheckboxGroupRoot");
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/CheckboxGroupRoot.js
+var [injectCheckboxGroupRootContext, provideCheckboxGroupRootContext] = /*#__PURE__*/ require_createContext.createContext("CheckboxGroupRoot");
 //#endregion
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/utils.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/utils.js
 function isIndeterminate(checked) {
 	return checked === "indeterminate";
 }
@@ -26,8 +25,8 @@ function getState(checked) {
 	return isIndeterminate(checked) ? "indeterminate" : checked ? "checked" : "unchecked";
 }
 //#endregion
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/CheckboxRoot.js
-var [injectCheckboxRootContext, provideCheckboxRootContext] = /* @__PURE__ */ require_createContext.createContext("CheckboxRoot");
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/CheckboxRoot.js
+var [injectCheckboxRootContext, provideCheckboxRootContext] = /*#__PURE__*/ require_createContext.createContext("CheckboxRoot");
 var CheckboxRoot_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	inheritAttrs: false,
 	__name: "CheckboxRoot",
@@ -181,7 +180,7 @@ var CheckboxRoot_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	}
 });
 //#endregion
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/CheckboxIndicator.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/CheckboxIndicator.js
 var CheckboxIndicator_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	__name: "CheckboxIndicator",
 	props: {
@@ -241,16 +240,37 @@ var checkbox_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		as: {},
 		name: {},
 		required: { type: Boolean },
-		class: {}
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emits = __emit;
-		const forwarded = require_useForwardPropsEmits.useForwardPropsEmits(require_use_delegated_props.useDelegatedProps(props, "class"), emits);
+		const delegatedProps = require_use_delegated_props.useDelegatedProps(props, "class");
+		const forwarded = require_useForwardPropsEmits.useForwardPropsEmits(delegatedProps, emits);
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(CheckboxRoot_default), (0, vue.mergeProps)((0, vue.unref)(forwarded), { class: (0, vue.unref)(require_clsx.clsx)("celeste-checkbox", props.class) }), {
-				default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(CheckboxIndicator_default), { class: "celeste-checkbox-indicator" })]),
+				default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(CheckboxIndicator_default), {
+					"force-mount": "",
+					class: "celeste-checkbox-indicator"
+				}, {
+					default: (0, vue.withCtx)(() => [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("svg", {
+						class: "celeste-checkbox-check",
+						viewBox: "0 0 10 8",
+						"aria-hidden": "true"
+					}, [(0, vue.createElementVNode)("path", { d: "M1 3.5L4 6.5L9 1.5" })], -1), (0, vue.createElementVNode)("svg", {
+						class: "celeste-checkbox-dash",
+						viewBox: "0 0 8 2",
+						"aria-hidden": "true"
+					}, [(0, vue.createElementVNode)("path", { d: "M0 1H8" })], -1)])]),
+					_: 1
+				})]),
 				_: 1
 			}, 16, ["class"]);
 		};

package/dist/cjs/chunks/clamp.cjs

@@ -1,4 +1,4 @@
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/shared/clamp.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/shared/clamp.js
 /**
 * The `clamp` function restricts a number within a specified range by returning the value itself if it
 * falls within the range, or the closest boundary value if it exceeds the range.

package/dist/cjs/chunks/collapsible-content.cjs

@@ -1,13 +1,12 @@
-require("./chunk.cjs");
 const require_clsx = require("./clsx.cjs");
-const require_dist = require("./dist.cjs");
+const require_dist = require("./dist2.cjs");
 const require_Primitive = require("./Primitive.cjs");
 const require_useForwardExpose = require("./useForwardExpose.cjs");
 const require_useId = require("./useId.cjs");
 const require_Presence = require("./Presence.cjs");
 const require_CollapsibleRoot = require("./CollapsibleRoot.cjs");
 let vue = require("vue");
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Collapsible/CollapsibleContent.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Collapsible/CollapsibleContent.js
 var CollapsibleContent_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	inheritAttrs: false,
 	__name: "CollapsibleContent",
@@ -109,7 +108,13 @@ var CollapsibleContent_default = /* @__PURE__ */ (0, vue.defineComponent)({
 var collapsible_content_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	__name: "collapsible-content",
 	props: {
-		class: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
 		forceMount: { type: Boolean },
 		asChild: { type: Boolean },
 		as: {}

package/dist/cjs/chunks/collapsible-trigger.cjs

@@ -1,9 +1,8 @@
-require("./chunk.cjs");
 const require_Primitive = require("./Primitive.cjs");
 const require_useForwardExpose = require("./useForwardExpose.cjs");
 const require_CollapsibleRoot = require("./CollapsibleRoot.cjs");
 let vue = require("vue");
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Collapsible/CollapsibleTrigger.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Collapsible/CollapsibleTrigger.js
 var CollapsibleTrigger_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	__name: "CollapsibleTrigger",
 	props: {

package/dist/cjs/chunks/collapsible.cjs

@@ -1,4 +1,3 @@
-require("./chunk.cjs");
 const require_useForwardPropsEmits = require("./useForwardPropsEmits.cjs");
 const require_CollapsibleRoot = require("./CollapsibleRoot.cjs");
 let vue = require("vue");

package/dist/cjs/chunks/color-area.cjs

@@ -1,11 +1,10 @@
-require("./chunk.cjs");
 const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
 const require_use_user_select = require("../use-user-select.cjs");
 const require_color = require("../color.cjs");
 const require_use_color_model = require("./use-color-model.cjs");
 let vue = require("vue");
 //#region src/components/color-picker/color-area.vue?vue&type=script&setup=true&lang.ts
-var color_area_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+var color_area_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	__name: "color-area",
 	props: {
 		hue: {},
@@ -13,7 +12,7 @@ var color_area_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0,
 	},
 	emits: ["change"].concat(require_use_color_model.ColorPickerEmits),
 	setup(__props, { emit: __emit }) {
-		(0, vue.useCssVars)((_ctx) => ({ "4e84ab0b": colorAreaBg.value }));
+		(0, vue.useCssVars)((_ctx) => ({ "v4e84ab0b": colorAreaBg.value }));
 		const props = __props;
 		const emit = __emit;
 		const { preventPageUserSelect, allowPageUserSelect } = require_use_user_select.useUserPageSelection();
@@ -164,7 +163,7 @@ var color_area_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0,
 });
 //#endregion
 //#region src/components/color-picker/color-area.vue
-var color_area_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(color_area_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-3e34d3c5"]]);
+var color_area_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(color_area_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-3e34d3c5"]]);
 //#endregion
 Object.defineProperty(exports, "color_area_default", {
 	enumerable: true,

package/dist/cjs/chunks/color-picker.cjs

@@ -1,4 +1,3 @@
-require("./chunk.cjs");
 const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
 const require_useForwardPropsEmits = require("./useForwardPropsEmits.cjs");
 const require_popover_content = require("./popover-content.cjs");
@@ -36,12 +35,18 @@ var _hoisted_3 = { class: "celeste-color-format" };
 var _hoisted_4 = { class: "celeste-color-controls" };
 var _hoisted_5 = { class: "celeste-color-format-inputs" };
 var _hoisted_6 = { class: "celeste-color-swatches" };
-var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+var color_picker_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	__name: "color-picker",
 	props: {
 		modelValue: { default: "hsl(240, 100%, 50%)" },
 		label: { default: "Pick Color" },
-		class: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
 		formats: { default: () => [
 			"hex",
 			"rgb",
@@ -53,10 +58,11 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
-		(0, vue.useCssVars)((_ctx) => ({ "19437362": _ctx.modelValue }));
+		(0, vue.useCssVars)((_ctx) => ({ "v19437362": _ctx.modelValue }));
 		const props = __props;
 		const emit = __emit;
-		const forwarded = require_useForwardPropsEmits.useForwardPropsEmits(require_use_delegated_props.useDelegatedProps(props, "class"), emit);
+		const delegatedProps = require_use_delegated_props.useDelegatedProps(props, "class");
+		const forwarded = require_useForwardPropsEmits.useForwardPropsEmits(delegatedProps, emit);
 		const tinyColorRef = require_use_color_model.defineColorModel(props, emit);
 		const hueRef = (0, vue.ref)(tinyColorRef.value.toHsl().h);
 		const currentColorFormat = (0, vue.ref)(props.defaultFormat || "hex");
@@ -94,21 +100,23 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 		function sipColor() {
 			if (!eyeDropper.value) return;
 			eyeDropper.value.open().then((result) => {
-				tinyColorRef.value = require_use_color_model.tinycolor(result.sRGBHex);
+				const newColor = require_use_color_model.tinycolor(result.sRGBHex);
+				tinyColorRef.value = newColor;
 			}).catch((_) => {});
 		}
 		function getCurrentColorValue(key) {
 			let currentValue = 0;
 			if (key === "r" || key === "g" || key === "b") currentValue = rgb.value[key];
 			else if (key === "h") currentValue = tinyColorRef.value.toHsl().h;
-			else if (key === "s" || key === "l" || key === "v") if (currentColorFormat.value === "hsl") {
-				const currentHsl = tinyColorRef.value.toHsl();
-				currentValue = key === "s" ? currentHsl.s * 100 : currentHsl.l * 100;
-			} else {
-				const currentHsv = tinyColorRef.value.toHsv();
-				currentValue = key === "s" ? currentHsv.s * 100 : currentHsv.v * 100;
-			}
-			else if (key === "a") currentValue = tinyColorRef.value.getAlpha() * 100;
+			else if (key === "s" || key === "l" || key === "v") {
+				if (currentColorFormat.value === "hsl") {
+					const currentHsl = tinyColorRef.value.toHsl();
+					currentValue = key === "s" ? currentHsl.s * 100 : currentHsl.l * 100;
+				} else {
+					const currentHsv = tinyColorRef.value.toHsv();
+					currentValue = key === "s" ? currentHsv.s * 100 : currentHsv.v * 100;
+				}
+			} else if (key === "a") currentValue = tinyColorRef.value.getAlpha() * 100;
 			return currentValue;
 		}
 		function validateInput(event) {
@@ -130,10 +138,11 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 		}
 		function inputChangeRGB(event, key) {
 			const value = Number(event.target?.value);
-			tinyColorRef.value = require_use_color_model.tinycolor({
+			const newRgb = {
 				...rgb.value,
 				[key]: value
-			});
+			};
+			tinyColorRef.value = require_use_color_model.tinycolor(newRgb);
 		}
 		function inputChangeHSL(event, key) {
 			const HSLInput = event.target?.value;
@@ -167,27 +176,45 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 			const currentValue = getCurrentColorValue(key);
 			const { min, max } = require_color.getColorConstraints(key);
 			const newValue = require_color.clamp(require_color.bumpColorValue(currentValue, direction), min, max);
-			if (key === "r" || key === "g" || key === "b") emit("update:modelValue", require_use_color_model.tinycolor({
-				...rgb.value,
-				[key]: newValue
-			}).toString());
-			else if (key === "h") if (currentColorFormat.value === "hsl") emit("update:modelValue", require_use_color_model.tinycolor({
-				...tinyColorRef.value.toHsl(),
-				h: newValue
-			}).toString());
-			else emit("update:modelValue", require_use_color_model.tinycolor({
-				...tinyColorRef.value.toHsv(),
-				h: newValue
-			}).toString());
-			else if (key === "s" || key === "l" || key === "v") if (currentColorFormat.value === "hsl") emit("update:modelValue", require_use_color_model.tinycolor({
-				...tinyColorRef.value.toHsl(),
-				[key]: newValue / 100
-			}).toString());
-			else emit("update:modelValue", require_use_color_model.tinycolor({
-				...tinyColorRef.value.toHsv(),
-				[key]: newValue / 100
-			}).toString());
-			else if (key === "a") emit("update:modelValue", tinyColorRef.value.setAlpha(newValue / 100).toString());
+			if (key === "r" || key === "g" || key === "b") {
+				const newColor = require_use_color_model.tinycolor({
+					...rgb.value,
+					[key]: newValue
+				});
+				emit("update:modelValue", newColor.toString());
+			} else if (key === "h") {
+				if (currentColorFormat.value === "hsl") {
+					const newColor = require_use_color_model.tinycolor({
+						...tinyColorRef.value.toHsl(),
+						h: newValue
+					});
+					emit("update:modelValue", newColor.toString());
+				} else {
+					const newColor = require_use_color_model.tinycolor({
+						...tinyColorRef.value.toHsv(),
+						h: newValue
+					});
+					emit("update:modelValue", newColor.toString());
+				}
+			} else if (key === "s" || key === "l" || key === "v") {
+				if (currentColorFormat.value === "hsl") {
+					const newColor = require_use_color_model.tinycolor({
+						...tinyColorRef.value.toHsl(),
+						[key]: newValue / 100
+					});
+					emit("update:modelValue", newColor.toString());
+				} else {
+					const currentHsv = tinyColorRef.value.toHsv();
+					const newColor = require_use_color_model.tinycolor({
+						...currentHsv,
+						[key]: newValue / 100
+					});
+					emit("update:modelValue", newColor.toString());
+				}
+			} else if (key === "a") {
+				const newColor = tinyColorRef.value.setAlpha(newValue / 100);
+				emit("update:modelValue", newColor.toString());
+			}
 		}
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_popover.popover_default), null, {
@@ -197,7 +224,7 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 						intent: "neutral",
 						variant: "stroke"
 					}, {
-						default: (0, vue.withCtx)(() => [_cache[53] || (_cache[53] = (0, vue.createElementVNode)("span", { class: "celeste-selected-color" }, null, -1)), (0, vue.createTextVNode)(" " + (0, vue.toDisplayString)(_ctx.label), 1)]),
+						default: (0, vue.withCtx)(() => [_cache[53] || (_cache[53] = (0, vue.createElementVNode)("span", { class: "celeste-selected-color" }, null, -1)), (0, vue.createTextVNode)(" " + (0, vue.toDisplayString)(__props.label), 1)]),
 						_: 1
 					})]),
 					_: 1
@@ -251,7 +278,7 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 							intent: "neutral",
 							onClick: sipColor
 						}, {
-							default: (0, vue.withCtx)(() => _cache[54] || (_cache[54] = [(0, vue.createElementVNode)("i", { class: "i-celeste-sip-line" }, null, -1)])),
+							default: (0, vue.withCtx)(() => [..._cache[54] || (_cache[54] = [(0, vue.createElementVNode)("i", { class: "i-celeste-sip-line" }, null, -1)])]),
 							_: 1
 						})) : (0, vue.createCommentVNode)("", true), (0, vue.createElementVNode)("div", _hoisted_5, [currentColorFormat.value === "hex" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_text_input.text_input_default), {
 							key: 0,
@@ -429,11 +456,11 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 								_cache[51] || (_cache[51] = (0, vue.withKeys)((0, vue.withModifiers)((e) => handleColorValueKeyDown(e, "a"), ["prevent", "stop"]), ["down"]))
 							]
 						}, null, 8, ["value", "onKeydown"])])])])
-					]), (0, vue.createElementVNode)("div", _hoisted_6, [_ctx.$slots.swatches ? (0, vue.renderSlot)(_ctx.$slots, "swatches", { key: 0 }, void 0, true) : ((0, vue.openBlock)(), (0, vue.createBlock)(require_color_swatch.color_swatch_default, {
+					]), (0, vue.createElementVNode)("div", _hoisted_6, [_ctx.$slots.swatches ? (0, vue.renderSlot)(_ctx.$slots, "swatches", {}, void 0, true, 0) : ((0, vue.openBlock)(), (0, vue.createBlock)(require_color_swatch.color_swatch_default, {
 						key: 1,
 						modelValue: (0, vue.unref)(tinyColorRef),
 						"onUpdate:modelValue": _cache[52] || (_cache[52] = ($event) => (0, vue.isRef)(tinyColorRef) ? tinyColorRef.value = $event : null),
-						label: _ctx.colorSwatchLabel,
+						label: __props.colorSwatchLabel,
 						hue: hueRef.value
 					}, null, 8, [
 						"modelValue",
@@ -449,7 +476,7 @@ var color_picker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 });
 //#endregion
 //#region src/components/color-picker/color-picker.vue
-var color_picker_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(color_picker_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-94b97787"]]);
+var color_picker_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(color_picker_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-94b97787"]]);
 //#endregion
 Object.defineProperty(exports, "color_picker_default", {
 	enumerable: true,

package/dist/cjs/chunks/color-swatch.cjs

@@ -1,4 +1,3 @@
-require("./chunk.cjs");
 const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
 const require_color = require("../color.cjs");
 const require_use_color_model = require("./use-color-model.cjs");
@@ -14,7 +13,7 @@ var _hoisted_4 = [
 	"onClick",
 	"onKeydown"
 ];
-var color_swatch_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+var color_swatch_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	__name: "color-swatch",
 	props: {
 		modelValue: {},
@@ -24,7 +23,7 @@ var color_swatch_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
-		(0, vue.useCssVars)((_ctx) => ({ "52ca0aa2": activeSwatchColorBg.value }));
+		(0, vue.useCssVars)((_ctx) => ({ "v52ca0aa2": activeSwatchColorBg.value }));
 		const tinyColorRef = require_use_color_model.defineColorModel(__props, __emit);
 		const activeSwatchColorBg = (0, vue.computed)(() => {
 			return `0 0 0 2px var(--color-bg-white-0), 0 0 0 4px ${tinyColorRef.value.toRgbString()}`;
@@ -36,7 +35,7 @@ var color_swatch_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 			return tinyColorRef.value.toHex8String().toLocaleLowerCase() === require_use_color_model.tinycolor(color).toHex8String().toLocaleLowerCase();
 		}
 		return (_ctx, _cache) => {
-			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1, [(0, vue.createElementVNode)("span", _hoisted_2, (0, vue.toDisplayString)(_ctx.label), 1), (0, vue.createElementVNode)("div", _hoisted_3, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(_ctx.swatch, (swatchColor) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1, [(0, vue.createElementVNode)("span", _hoisted_2, (0, vue.toDisplayString)(__props.label), 1), (0, vue.createElementVNode)("div", _hoisted_3, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.swatch, (swatchColor) => {
 				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
 					key: swatchColor,
 					class: "palette-color",
@@ -55,7 +54,7 @@ var color_swatch_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (
 });
 //#endregion
 //#region src/components/color-picker/color-swatch.vue
-var color_swatch_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(color_swatch_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-c0ab1e9e"]]);
+var color_swatch_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(color_swatch_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-c0ab1e9e"]]);
 //#endregion
 Object.defineProperty(exports, "color_swatch_default", {
 	enumerable: true,

package/dist/cjs/chunks/combobox-anchor.cjs

@@ -1,11 +1,10 @@
-require("./chunk.cjs");
 const require_clsx = require("./clsx.cjs");
 const require_Primitive = require("./Primitive.cjs");
 const require_useForwardExpose = require("./useForwardExpose.cjs");
 const require_useForwardProps = require("./useForwardProps.cjs");
 const require_PopperAnchor = require("./PopperAnchor.cjs");
 let vue = require("vue");
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Combobox/ComboboxAnchor.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Combobox/ComboboxAnchor.js
 var ComboboxAnchor_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	__name: "ComboboxAnchor",
 	props: {
@@ -50,14 +49,21 @@ var combobox_anchor_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		reference: {},
 		asChild: { type: Boolean },
 		as: {},
-		class: {}
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
 	},
 	setup(__props) {
 		const props = __props;
-		const forwarded = require_useForwardProps.useForwardProps((0, vue.computed)(() => {
+		const delegatedProps = (0, vue.computed)(() => {
 			const { class: _, ...delegated } = props;
 			return delegated;
-		}));
+		});
+		const forwarded = require_useForwardProps.useForwardProps(delegatedProps);
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(ComboboxAnchor_default), (0, vue.mergeProps)((0, vue.unref)(forwarded), { class: (0, vue.unref)(require_clsx.clsx)(props.class, "celeste-dropdown-anchor") }), {
 				default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "default")]),

package/dist/cjs/chunks/combobox-empty.cjs

@@ -1,10 +1,9 @@
-require("./chunk.cjs");
 const require_clsx = require("./clsx.cjs");
 const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
 const require_ComboboxRoot = require("./ComboboxRoot.cjs");
 const require_Primitive = require("./Primitive.cjs");
 let vue = require("vue");
-//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.13_typescript@6.0.3_/node_modules/reka-ui/dist/Combobox/ComboboxEmpty.js
+//#region ../../node_modules/.pnpm/reka-ui@2.10.1_vue@3.5.41_typescript@6.0.3_/node_modules/reka-ui/dist/Combobox/ComboboxEmpty.js
 var ComboboxEmpty_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	__name: "ComboboxEmpty",
 	props: {
@@ -31,12 +30,18 @@ var ComboboxEmpty_default = /* @__PURE__ */ (0, vue.defineComponent)({
 });
 //#endregion
 //#region src/components/combobox/combobox-empty.vue?vue&type=script&setup=true&lang.ts
-var combobox_empty_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+var combobox_empty_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	__name: "combobox-empty",
 	props: {
 		asChild: { type: Boolean },
 		as: {},
-		class: {}
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
 	},
 	setup(__props) {
 		const props = __props;
@@ -54,7 +59,7 @@ var combobox_empty_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 });
 //#endregion
 //#region src/components/combobox/combobox-empty.vue
-var combobox_empty_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(combobox_empty_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4423b209"]]);
+var combobox_empty_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(combobox_empty_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4423b209"]]);
 //#endregion
 Object.defineProperty(exports, "combobox_empty_default", {
 	enumerable: true,

package/dist/cjs/chunks/combobox-group.cjs

@@ -1,16 +1,21 @@
-require("./chunk.cjs");
 const require_clsx = require("./clsx.cjs");
 const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
 const require_ComboboxGroup = require("./ComboboxGroup.cjs");
 const require_ComboboxLabel = require("./ComboboxLabel.cjs");
 let vue = require("vue");
 //#region src/components/combobox/combobox-group.vue?vue&type=script&setup=true&lang.ts
-var combobox_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+var combobox_group_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	__name: "combobox-group",
 	props: {
 		asChild: { type: Boolean },
 		as: {},
-		class: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
 		heading: {}
 	},
 	setup(__props) {
@@ -21,11 +26,11 @@ var combobox_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		});
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_ComboboxGroup.ComboboxGroup_default), (0, vue.mergeProps)(delegatedProps.value, { class: (0, vue.unref)(require_clsx.clsx)(props.class, "celeste-dropdown-items-group") }), {
-				default: (0, vue.withCtx)(() => [_ctx.heading ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_ComboboxLabel.ComboboxLabel_default), {
+				default: (0, vue.withCtx)(() => [__props.heading ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_ComboboxLabel.ComboboxLabel_default), {
 					key: 0,
 					class: ""
 				}, {
-					default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(_ctx.heading), 1)]),
+					default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.heading), 1)]),
 					_: 1
 				})) : (0, vue.createCommentVNode)("", true), (0, vue.renderSlot)(_ctx.$slots, "default", {}, void 0, true)]),
 				_: 3
@@ -35,7 +40,7 @@ var combobox_group_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 });
 //#endregion
 //#region src/components/combobox/combobox-group.vue
-var combobox_group_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(combobox_group_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-b180207e"]]);
+var combobox_group_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(combobox_group_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-b180207e"]]);
 //#endregion
 Object.defineProperty(exports, "combobox_group_default", {
 	enumerable: true,

package/dist/cjs/chunks/combobox-input.cjs

@@ -1,20 +1,25 @@
-require("./chunk.cjs");
 const require_clsx = require("./clsx.cjs");
 const require__plugin_vue_export_helper = require("./_plugin-vue_export-helper.cjs");
 const require_ComboboxInput = require("./ComboboxInput.cjs");
 const require_text_input = require("./text-input.cjs");
 let vue = require("vue");
 //#region src/components/combobox/combobox-input.vue?vue&type=script&setup=true&lang.ts
-var combobox_input_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
+var combobox_input_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 	__name: "combobox-input",
-	props: /* @__PURE__ */ (0, vue.mergeModels)({
+	props: /*@__PURE__*/ (0, vue.mergeModels)({
 		displayValue: { type: Function },
 		modelValue: {},
 		autoFocus: { type: Boolean },
 		disabled: { type: Boolean },
 		asChild: { type: Boolean },
 		as: {},
-		class: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
 		textInputProps: {},
 		searchable: { type: Boolean },
 		placeholder: {}
@@ -50,7 +55,7 @@ var combobox_input_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 					readonly: !props.searchable,
 					style: !props.searchable ? "opacity: 0; height: 1px; padding: 0; border: none;" : ""
 				}), {
-					leadingIcon: (0, vue.withCtx)(() => _cache[1] || (_cache[1] = [(0, vue.createElementVNode)("i", { "i-celeste-search-2-line": "" }, null, -1)])),
+					leadingIcon: (0, vue.withCtx)(() => [..._cache[1] || (_cache[1] = [(0, vue.createElementVNode)("i", { "i-celeste-search-2-line": "" }, null, -1)])]),
 					_: 1
 				}, 16, [
 					"modelValue",
@@ -64,7 +69,7 @@ var combobox_input_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 });
 //#endregion
 //#region src/components/combobox/combobox-input.vue
-var combobox_input_default = /* @__PURE__ */ require__plugin_vue_export_helper._plugin_vue_export_helper_default(combobox_input_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-dcca52ff"]]);
+var combobox_input_default = /*#__PURE__*/ require__plugin_vue_export_helper._plugin_vue_export_helper_default(combobox_input_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-dcca52ff"]]);
 //#endregion
 Object.defineProperty(exports, "combobox_input_default", {
 	enumerable: true,