@youcan/celeste 0.6.53 → 0.6.55

package/dist/es/color-picker.js

@@ -40,12 +40,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     label: { default: "Pick Color" },
     class: {},
     formats: { default: () => ["hex", "rgb", "hsl", "hsb"] },
-    defaultFormat: {}
+    defaultFormat: {},
+    colorSwatchLabel: { default: "Recommended Colors" }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "88e786d6": _ctx.modelValue
+      "6559ad05": _ctx.modelValue
     }));
     const props = __props;
     const emit = __emit;
@@ -496,8 +497,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     key: 1,
                     modelValue: unref(tinyColorRef),
                     "onUpdate:modelValue": _cache[52] || (_cache[52] = ($event) => isRef(tinyColorRef) ? tinyColorRef.value = $event : null),
+                    label: _ctx.colorSwatchLabel,
                     hue: hueRef.value
-                  }, null, 8, ["modelValue", "hue"]))
+                  }, null, 8, ["modelValue", "label", "hue"]))
                 ])
               ], 16)
             ]),
@@ -509,7 +511,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const colorPicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-5d801c64"]]);
+const colorPicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8814818c"]]);
 export {
   colorPicker as default
 };

package/dist/es/color-swatch.js

@@ -10,14 +10,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "color-swatch",
   props: {
     modelValue: {},
-    label: { default: "Recommended Colors" },
+    label: {},
     swatch: { default: () => DEFAULT_SWATCH },
     defaultColor: {}
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "0829b6e2": activeSwatchColorBg.value
+      "608e7b2a": activeSwatchColorBg.value
     }));
     const props = __props;
     const emit = __emit;
@@ -54,7 +54,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ColorSwatch = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-095c22f0"]]);
+const ColorSwatch = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e0b25a98"]]);
 export {
   ColorSwatch as default
 };

package/dist/es/file-upload-area.js

@@ -0,0 +1,281 @@
+import { shallowRef, computed, toValue, unref, defineComponent, mergeModels, useModel, useTemplateRef, openBlock, createElementBlock, normalizeClass, createElementVNode, toDisplayString, createCommentVNode, createBlock, withCtx, mergeProps } from "vue";
+import Button from "./button.js";
+import { i as isClient, t as toArray, w as watchImmediate, a as tryOnScopeDispose, b as isObject } from "./chunks/index2.js";
+import { c as clsx } from "./chunks/clsx.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const defaultWindow = isClient ? window : void 0;
+function unrefElement(elRef) {
+  var _a;
+  const plain = toValue(elRef);
+  return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
+}
+function useEventListener(...args) {
+  const cleanups = [];
+  const cleanup = () => {
+    cleanups.forEach((fn) => fn());
+    cleanups.length = 0;
+  };
+  const register = (el, event, listener, options) => {
+    el.addEventListener(event, listener, options);
+    return () => el.removeEventListener(event, listener, options);
+  };
+  const firstParamTargets = computed(() => {
+    const test = toArray(toValue(args[0])).filter((e) => e != null);
+    return test.every((e) => typeof e !== "string") ? test : void 0;
+  });
+  const stopWatch = watchImmediate(
+    () => {
+      var _a, _b;
+      return [
+        (_b = (_a = firstParamTargets.value) == null ? void 0 : _a.map((e) => unrefElement(e))) != null ? _b : [defaultWindow].filter((e) => e != null),
+        toArray(toValue(firstParamTargets.value ? args[1] : args[0])),
+        toArray(unref(firstParamTargets.value ? args[2] : args[1])),
+        // @ts-expect-error - TypeScript gets the correct types, but somehow still complains
+        toValue(firstParamTargets.value ? args[3] : args[2])
+      ];
+    },
+    ([raw_targets, raw_events, raw_listeners, raw_options]) => {
+      cleanup();
+      if (!(raw_targets == null ? void 0 : raw_targets.length) || !(raw_events == null ? void 0 : raw_events.length) || !(raw_listeners == null ? void 0 : raw_listeners.length))
+        return;
+      const optionsClone = isObject(raw_options) ? { ...raw_options } : raw_options;
+      cleanups.push(
+        ...raw_targets.flatMap(
+          (el) => raw_events.flatMap(
+            (event) => raw_listeners.map((listener) => register(el, event, listener, optionsClone))
+          )
+        )
+      );
+    },
+    { flush: "post" }
+  );
+  const stop = () => {
+    stopWatch();
+    cleanup();
+  };
+  tryOnScopeDispose(cleanup);
+  return stop;
+}
+function useDropZone(target, options = {}) {
+  var _a, _b;
+  const isOverDropZone = shallowRef(false);
+  const files = shallowRef(null);
+  let counter = 0;
+  let isValid = true;
+  if (isClient) {
+    const _options = typeof options === "function" ? { onDrop: options } : options;
+    const multiple = (_a = _options.multiple) != null ? _a : true;
+    const preventDefaultForUnhandled = (_b = _options.preventDefaultForUnhandled) != null ? _b : false;
+    const getFiles = (event) => {
+      var _a2, _b2;
+      const list = Array.from((_b2 = (_a2 = event.dataTransfer) == null ? void 0 : _a2.files) != null ? _b2 : []);
+      return list.length === 0 ? null : multiple ? list : [list[0]];
+    };
+    const checkDataTypes = (types) => {
+      const dataTypes = unref(_options.dataTypes);
+      if (typeof dataTypes === "function")
+        return dataTypes(types);
+      if (!(dataTypes == null ? void 0 : dataTypes.length))
+        return true;
+      if (types.length === 0)
+        return false;
+      return types.every(
+        (type) => dataTypes.some((allowedType) => type.includes(allowedType))
+      );
+    };
+    const checkValidity = (items) => {
+      const types = Array.from(items != null ? items : []).map((item) => item.type);
+      const dataTypesValid = checkDataTypes(types);
+      const multipleFilesValid = multiple || items.length <= 1;
+      return dataTypesValid && multipleFilesValid;
+    };
+    const isSafari = () => /^(?:(?!chrome|android).)*safari/i.test(navigator.userAgent) && !("chrome" in window);
+    const handleDragEvent = (event, eventType) => {
+      var _a2, _b2, _c, _d, _e, _f;
+      const dataTransferItemList = (_a2 = event.dataTransfer) == null ? void 0 : _a2.items;
+      isValid = (_b2 = dataTransferItemList && checkValidity(dataTransferItemList)) != null ? _b2 : false;
+      if (preventDefaultForUnhandled) {
+        event.preventDefault();
+      }
+      if (!isSafari() && !isValid) {
+        if (event.dataTransfer) {
+          event.dataTransfer.dropEffect = "none";
+        }
+        return;
+      }
+      event.preventDefault();
+      if (event.dataTransfer) {
+        event.dataTransfer.dropEffect = "copy";
+      }
+      const currentFiles = getFiles(event);
+      switch (eventType) {
+        case "enter":
+          counter += 1;
+          isOverDropZone.value = true;
+          (_c = _options.onEnter) == null ? void 0 : _c.call(_options, null, event);
+          break;
+        case "over":
+          (_d = _options.onOver) == null ? void 0 : _d.call(_options, null, event);
+          break;
+        case "leave":
+          counter -= 1;
+          if (counter === 0)
+            isOverDropZone.value = false;
+          (_e = _options.onLeave) == null ? void 0 : _e.call(_options, null, event);
+          break;
+        case "drop":
+          counter = 0;
+          isOverDropZone.value = false;
+          if (isValid) {
+            files.value = currentFiles;
+            (_f = _options.onDrop) == null ? void 0 : _f.call(_options, currentFiles, event);
+          }
+          break;
+      }
+    };
+    useEventListener(target, "dragenter", (event) => handleDragEvent(event, "enter"));
+    useEventListener(target, "dragover", (event) => handleDragEvent(event, "over"));
+    useEventListener(target, "dragleave", (event) => handleDragEvent(event, "leave"));
+    useEventListener(target, "drop", (event) => handleDragEvent(event, "drop"));
+  }
+  return {
+    files,
+    isOverDropZone
+  };
+}
+const _hoisted_1 = ["data-over-drop-zone"];
+const _hoisted_2 = { class: "celeste-file-upload-area-content" };
+const _hoisted_3 = { class: "celeste-file-upload-area-label" };
+const _hoisted_4 = {
+  key: 0,
+  class: "celeste-file-upload-area-description"
+};
+const _hoisted_5 = ["multiple", "accept"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "file-upload-area",
+  props: /* @__PURE__ */ mergeModels({
+    label: { default: "Choose a file or drag & drop it here." },
+    description: { default: "JPEG, PNG, PDF, and MP4 formats, up to 50 MB." },
+    labelOnDrop: { default: "Drop file to upload" },
+    triggerLabel: { default: "Browse Files" },
+    maxSize: { default: 2e3 },
+    maxFiles: { default: 5 },
+    multiple: { type: Boolean, default: false },
+    icon: { default: "i-celeste-upload-cloud-2-line" },
+    accept: {},
+    onTriggerClick: {},
+    class: {}
+  }, {
+    "modelValue": { default: [] },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["error"], ["update:modelValue"]),
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const files = useModel(__props, "modelValue");
+    const dropZoneRef = useTemplateRef("dropZoneRef");
+    const { isOverDropZone } = useDropZone(dropZoneRef, { onDrop });
+    function handleUpload(e) {
+      const input = e.target;
+      const newFiles = Array.from(input.files ?? []);
+      const filesToProcess = newFiles.slice(0, props.maxFiles);
+      const rejectedFiles = newFiles.slice(props.maxFiles);
+      if (rejectedFiles.length > 0) {
+        emit("error", {
+          message: "Files exceeded upload limit",
+          type: "count",
+          files: rejectedFiles
+        });
+      }
+      const validFiles = filesToProcess.filter(isValidFile);
+      files.value = [...validFiles];
+    }
+    function onDrop(droppedFiles) {
+      if (!(droppedFiles == null ? void 0 : droppedFiles.length))
+        return;
+      const filesToProcess = droppedFiles.slice(0, props.maxFiles);
+      const rejectedFiles = droppedFiles.slice(props.maxFiles);
+      if (rejectedFiles.length > 0) {
+        emit("error", {
+          message: "Files exceeded upload limit",
+          type: "count",
+          files: rejectedFiles
+        });
+      }
+      const validFiles = filesToProcess.filter(isValidFile);
+      files.value = [...validFiles];
+    }
+    function isValidFile(file) {
+      var _a;
+      const maxBytes = props.maxSize * 1024;
+      if (file.size > maxBytes) {
+        emit("error", {
+          message: `File too large: ${file.name}`,
+          type: "size",
+          files: [file]
+        });
+        return false;
+      }
+      const acceptableTypes = ((_a = props.accept) == null ? void 0 : _a.split(",")) ?? [];
+      if (acceptableTypes.length > 0 && !acceptableTypes.includes(file.type)) {
+        emit("error", {
+          message: "Unsupported type",
+          type: "type",
+          files: [file]
+        });
+        return false;
+      }
+      return true;
+    }
+    function handleTriggerClick(e) {
+      if (props.onTriggerClick) {
+        e.preventDefault();
+        props.onTriggerClick();
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("label", {
+        ref_key: "dropZoneRef",
+        ref: dropZoneRef,
+        class: normalizeClass(unref(clsx)(
+          "celeste-file-upload-area",
+          props.class
+        )),
+        "data-over-drop-zone": unref(isOverDropZone)
+      }, [
+        createElementVNode("i", {
+          class: normalizeClass(_ctx.icon)
+        }, null, 2),
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("span", _hoisted_3, toDisplayString(unref(isOverDropZone) ? _ctx.labelOnDrop : _ctx.label), 1),
+          !unref(isOverDropZone) ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(_ctx.description), 1)) : createCommentVNode("", true)
+        ]),
+        !unref(isOverDropZone) ? (openBlock(), createBlock(Button, {
+          key: 0,
+          "as-child": "",
+          intent: "neutral",
+          variant: "stroke",
+          size: "xs",
+          class: "celeste-file-upload-area-trigger",
+          onClick: handleTriggerClick
+        }, {
+          default: withCtx(() => [
+            createElementVNode("span", null, toDisplayString(_ctx.triggerLabel), 1)
+          ]),
+          _: 1
+        })) : createCommentVNode("", true),
+        createElementVNode("input", mergeProps(_ctx.$attrs, {
+          type: "file",
+          multiple: _ctx.multiple,
+          accept: _ctx.accept,
+          onChange: handleUpload
+        }), null, 16, _hoisted_5)
+      ], 10, _hoisted_1);
+    };
+  }
+});
+const fileUploadArea = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6e8a873e"]]);
+export {
+  fileUploadArea as default
+};

package/dist/es/index.js

@@ -8,8 +8,13 @@ import LinkButton from "./link-button.js";
 import socialButton from "./social-button.js";
 import checkboxCard from "./checkbox-card.js";
 import checkboxLabel from "./checkbox-label.js";
-import { _ as _sfc_main } from "./chunks/checkbox.vue_vue_type_style_index_0_lang.js";
-import { _ as _sfc_main$1 } from "./chunks/combobox-anchor.js";
+import { _ as _sfc_main$1 } from "./chunks/checkbox.vue_vue_type_style_index_0_lang.js";
+import { _ as _sfc_main } from "./chunks/alpha-slider.js";
+import ColorArea from "./color-area.js";
+import colorPicker from "./color-picker.js";
+import ColorSwatch from "./color-swatch.js";
+import HueSlider from "./hue-slider.js";
+import { _ as _sfc_main$2 } from "./chunks/combobox-anchor.js";
 import ComboboxEmpty from "./combobox-empty.js";
 import ComboboxGroup from "./combobox-group.js";
 import ComboboxInput from "./combobox-input.js";
@@ -19,14 +24,11 @@ import ComboboxRoot from "./combobox-root.js";
 import ComboboxSeparator from "./combobox-separator.js";
 import ComboboxTrigger from "./combobox-trigger.js";
 import combobox from "./combobox.js";
-import { _ as _sfc_main$2 } from "./chunks/content-divider.vue_vue_type_style_index_0_lang.js";
-import { _ as _sfc_main$3 } from "./chunks/counter-input.vue_vue_type_style_index_0_lang.js";
+import { _ as _sfc_main$3 } from "./chunks/content-divider.vue_vue_type_style_index_0_lang.js";
+import { _ as _sfc_main$4 } from "./chunks/counter-input.vue_vue_type_style_index_0_lang.js";
 import digitInputGroup from "./digit-input-group.js";
 import digitInputSlot from "./digit-input-slot.js";
 import digitInput from "./digit-input.js";
-import contextMenuItem from "./context-menu-item.js";
-import DropdownItem from "./dropdown-item.js";
-import dropdown from "./dropdown.js";
 import dropdownMenuContent from "./dropdown-menu-content.js";
 import dropdownMenuGroup from "./dropdown-menu-group.js";
 import dropdownMenuItem from "./dropdown-menu-item.js";
@@ -34,44 +36,44 @@ import dropdownMenuLabel from "./dropdown-menu-label.js";
 import dropdownMenuSeparator from "./dropdown-menu-separator.js";
 import dropdownMenuSubContent from "./dropdown-menu-sub-content.js";
 import dropdownMenuSubTrigger from "./dropdown-menu-sub-trigger.js";
-import { _ as _sfc_main$4 } from "./chunks/dropdown-menu-sub.js";
+import { _ as _sfc_main$5 } from "./chunks/dropdown-menu-sub.js";
 import dropdownMenuTrigger from "./dropdown-menu-trigger.js";
 import dropdownMenu from "./dropdown-menu.js";
 import hintText from "./hint-text.js";
 import Label from "./label.js";
 import modalBody from "./modal-body.js";
-import { _ as _sfc_main$6 } from "./chunks/modal-close.js";
+import { _ as _sfc_main$7 } from "./chunks/modal-close.js";
 import modalContent from "./modal-content.js";
 import modalFooter from "./modal-footer.js";
 import modalHeader from "./modal-header.js";
-import { _ as _sfc_main$7 } from "./chunks/modal-trigger.js";
-import { _ as _sfc_main$5 } from "./chunks/modal.js";
+import { _ as _sfc_main$8 } from "./chunks/modal-trigger.js";
+import { _ as _sfc_main$6 } from "./chunks/modal.js";
 import PopoverContent from "./popover-content.js";
 import PopoverTrigger from "./popover-trigger.js";
-import { _ as _sfc_main$8 } from "./chunks/popover.js";
+import { _ as _sfc_main$9 } from "./chunks/popover.js";
 import progressBar from "./progress-bar.js";
 import progressCircle from "./progress-circle.js";
 import radioGroupCard from "./radio-group-card.js";
-import { _ as _sfc_main$a } from "./chunks/radio-group-item.vue_vue_type_style_index_0_lang.js";
+import { _ as _sfc_main$b } from "./chunks/radio-group-item.vue_vue_type_style_index_0_lang.js";
 import radioGroupLabel from "./radio-group-label.js";
-import { _ as _sfc_main$9 } from "./chunks/radio-group.vue_vue_type_style_index_0_lang.js";
+import { _ as _sfc_main$a } from "./chunks/radio-group.vue_vue_type_style_index_0_lang.js";
 import richEditor from "./rich-editor.js";
-import { _ as _sfc_main$b } from "./chunks/scroll-area.js";
+import { _ as _sfc_main$c } from "./chunks/scroll-area.js";
 import segmentedControlItem from "./segmented-control-item.js";
 import segmentedControl from "./segmented-control.js";
 import SelectContent from "./select-content.js";
-import { _ as _sfc_main$d } from "./chunks/select-group.js";
+import { _ as _sfc_main$e } from "./chunks/select-group.js";
 import SelectIcon from "./select-icon.js";
 import SelectItem from "./select-item.js";
 import selectLabel from "./select-label.js";
 import selectSeparator from "./select-separator.js";
 import SelectTrigger from "./select-trigger.js";
 import SelectValue from "./select-value.js";
-import { _ as _sfc_main$c } from "./chunks/select.js";
-import { _ as _sfc_main$e } from "./chunks/slider.vue_vue_type_style_index_0_lang.js";
+import { _ as _sfc_main$d } from "./chunks/select.js";
+import { _ as _sfc_main$f } from "./chunks/slider.vue_vue_type_style_index_0_lang.js";
 import SonnerAlert from "./sonner-alert.js";
-import { _ as _sfc_main$f, t as toast$1 } from "./chunks/sonner.js";
-import { _ as _sfc_main$g } from "./chunks/switch.vue_vue_type_style_index_0_lang.js";
+import { _ as _sfc_main$g, t as toast$1 } from "./chunks/sonner.js";
+import { _ as _sfc_main$h } from "./chunks/switch.vue_vue_type_style_index_0_lang.js";
 import tabMenuContent from "./tab-menu-content.js";
 import tabMenuItem from "./tab-menu-item.js";
 import tabMenuList from "./tab-menu-list.js";
@@ -88,13 +90,17 @@ import { markRaw } from "vue";
 const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   Alert,
+  AlphaSlider: _sfc_main,
   Badge,
   Button,
-  Checkbox: _sfc_main,
+  Checkbox: _sfc_main$1,
   CheckboxCard: checkboxCard,
   CheckboxLabel: checkboxLabel,
+  ColorArea,
+  ColorPicker: colorPicker,
+  ColorSwatch,
   Combobox: combobox,
-  ComboboxAnchor: _sfc_main$1,
+  ComboboxAnchor: _sfc_main$2,
   ComboboxEmpty,
   ComboboxGroup,
   ComboboxInput,
@@ -104,63 +110,61 @@ const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
   ComboboxSeparator,
   ComboboxTrigger,
   CompactButton,
-  ContentDivider: _sfc_main$2,
-  ContextMenuItem: contextMenuItem,
-  CounterInput: _sfc_main$3,
+  ContentDivider: _sfc_main$3,
+  CounterInput: _sfc_main$4,
   DigitInput: digitInput,
   DigitInputGroup: digitInputGroup,
   DigitInputSlot: digitInputSlot,
-  Dropdown: dropdown,
-  DropdownItem,
   DropdownMenu: dropdownMenu,
   DropdownMenuContent: dropdownMenuContent,
   DropdownMenuGroup: dropdownMenuGroup,
   DropdownMenuItem: dropdownMenuItem,
   DropdownMenuLabel: dropdownMenuLabel,
   DropdownMenuSeparator: dropdownMenuSeparator,
-  DropdownMenuSub: _sfc_main$4,
+  DropdownMenuSub: _sfc_main$5,
   DropdownMenuSubContent: dropdownMenuSubContent,
   DropdownMenuSubTrigger: dropdownMenuSubTrigger,
   DropdownMenuTrigger: dropdownMenuTrigger,
   FancyButton: fancyButton,
   HintText: hintText,
+  HueSlider,
   Label,
   LinkButton,
-  Modal: _sfc_main$5,
+  Modal: _sfc_main$6,
   ModalBody: modalBody,
-  ModalClose: _sfc_main$6,
+  ModalClose: _sfc_main$7,
   ModalContent: modalContent,
   ModalFooter: modalFooter,
   ModalHeader: modalHeader,
-  ModalTrigger: _sfc_main$7,
-  Popover: _sfc_main$8,
+  ModalTrigger: _sfc_main$8,
+  Popover: _sfc_main$9,
   PopoverContent,
   PopoverTrigger,
   ProgressBar: progressBar,
   ProgressCircle: progressCircle,
-  RadioGroup: _sfc_main$9,
+  RadioGroup: _sfc_main$a,
   RadioGroupCard: radioGroupCard,
-  RadioGroupItem: _sfc_main$a,
+  RadioGroupItem: _sfc_main$b,
   RadioGroupLabel: radioGroupLabel,
   RichEditor: richEditor,
-  ScrollArea: _sfc_main$b,
+  ScrollArea: _sfc_main$c,
   SegmentedControl: segmentedControl,
   SegmentedControlItem: segmentedControlItem,
-  Select: _sfc_main$c,
+  Select: _sfc_main$d,
   SelectContent,
-  SelectGroup: _sfc_main$d,
+  SelectGroup: _sfc_main$e,
   SelectIcon,
   SelectItem,
   SelectLabel: selectLabel,
   SelectSeparator: selectSeparator,
   SelectTrigger,
   SelectValue,
-  Slider: _sfc_main$e,
+  Slider: _sfc_main$f,
   SocialButton: socialButton,
-  Sonner: _sfc_main$f,
+  Sonner: _sfc_main$g,
   SonnerAlert,
   StatusBadge: statusBadge,
-  Switch: _sfc_main$g,
+  Switch: _sfc_main$h,
   TabMenu: tabMenu,
   TabMenuContent: tabMenuContent,
   TabMenuItem: tabMenuItem,
@@ -230,15 +234,19 @@ const Celeste = {
 };
 export {
   Alert,
+  _sfc_main as AlphaSlider,
   Badge,
   Button,
   COLOR_NUMBER_VALIDATION_PATTERN,
   Celeste,
-  _sfc_main as Checkbox,
+  _sfc_main$1 as Checkbox,
   checkboxCard as CheckboxCard,
   checkboxLabel as CheckboxLabel,
+  ColorArea,
+  colorPicker as ColorPicker,
+  ColorSwatch,
   combobox as Combobox,
-  _sfc_main$1 as ComboboxAnchor,
+  _sfc_main$2 as ComboboxAnchor,
   ComboboxEmpty,
   ComboboxGroup,
   ComboboxInput,
@@ -248,65 +256,63 @@ export {
   ComboboxSeparator,
   ComboboxTrigger,
   CompactButton,
-  _sfc_main$2 as ContentDivider,
-  contextMenuItem as ContextMenuItem,
-  _sfc_main$3 as CounterInput,
+  _sfc_main$3 as ContentDivider,
+  _sfc_main$4 as CounterInput,
   DEFAULT_SWATCH,
   digitInput as DigitInput,
   digitInputGroup as DigitInputGroup,
   digitInputSlot as DigitInputSlot,
-  dropdown as Dropdown,
-  DropdownItem,
   dropdownMenu as DropdownMenu,
   dropdownMenuContent as DropdownMenuContent,
   dropdownMenuGroup as DropdownMenuGroup,
   dropdownMenuItem as DropdownMenuItem,
   dropdownMenuLabel as DropdownMenuLabel,
   dropdownMenuSeparator as DropdownMenuSeparator,
-  _sfc_main$4 as DropdownMenuSub,
+  _sfc_main$5 as DropdownMenuSub,
   dropdownMenuSubContent as DropdownMenuSubContent,
   dropdownMenuSubTrigger as DropdownMenuSubTrigger,
   dropdownMenuTrigger as DropdownMenuTrigger,
   fancyButton as FancyButton,
   HEX_VALIDATION_PATTERN,
   hintText as HintText,
+  HueSlider,
   Label,
   LinkButton,
-  _sfc_main$5 as Modal,
+  _sfc_main$6 as Modal,
   modalBody as ModalBody,
-  _sfc_main$6 as ModalClose,
+  _sfc_main$7 as ModalClose,
   modalContent as ModalContent,
   modalFooter as ModalFooter,
   modalHeader as ModalHeader,
-  _sfc_main$7 as ModalTrigger,
-  _sfc_main$8 as Popover,
+  _sfc_main$8 as ModalTrigger,
+  _sfc_main$9 as Popover,
   PopoverContent,
   PopoverTrigger,
   progressBar as ProgressBar,
   progressCircle as ProgressCircle,
-  _sfc_main$9 as RadioGroup,
+  _sfc_main$a as RadioGroup,
   radioGroupCard as RadioGroupCard,
-  _sfc_main$a as RadioGroupItem,
+  _sfc_main$b as RadioGroupItem,
   radioGroupLabel as RadioGroupLabel,
   richEditor as RichEditor,
-  _sfc_main$b as ScrollArea,
+  _sfc_main$c as ScrollArea,
   segmentedControl as SegmentedControl,
   segmentedControlItem as SegmentedControlItem,
-  _sfc_main$c as Select,
+  _sfc_main$d as Select,
   SelectContent,
-  _sfc_main$d as SelectGroup,
+  _sfc_main$e as SelectGroup,
   SelectIcon,
   SelectItem,
   selectLabel as SelectLabel,
   selectSeparator as SelectSeparator,
   SelectTrigger,
   SelectValue,
-  _sfc_main$e as Slider,
+  _sfc_main$f as Slider,
   socialButton as SocialButton,
-  _sfc_main$f as Sonner,
+  _sfc_main$g as Sonner,
   SonnerAlert,
   statusBadge as StatusBadge,
-  _sfc_main$g as Switch,
+  _sfc_main$h as Switch,
   tabMenu as TabMenu,
   tabMenuContent as TabMenuContent,
   tabMenuItem as TabMenuItem,