@youcan/celeste 0.6.29 → 0.6.31

package/dist/cjs/fancy-button.js

@@ -0,0 +1,38 @@
+"use strict";
+const Mo = require("vue");
+const clsx = require("./chunks/clsx.js");
+const index = require("./chunks/index.js");
+;/* empty css                                                                     */
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
+  __name: "fancy-button",
+  props: {
+    class: {},
+    size: { default: "md" },
+    intent: { default: "primary" },
+    asChild: { type: Boolean },
+    as: { default: "button" }
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return Mo.openBlock(), Mo.createBlock(Mo.unref(index.O), {
+        as: _ctx.as,
+        "as-child": _ctx.asChild,
+        class: Mo.normalizeClass(Mo.unref(clsx.clsx)(
+          "celeste-fbutton",
+          `celeste-fbutton-${_ctx.intent}`,
+          `celeste-fbutton-${_ctx.size}`,
+          props.class
+        ))
+      }, {
+        default: Mo.withCtx(() => [
+          Mo.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ]),
+        _: 3
+      }, 8, ["as", "as-child", "class"]);
+    };
+  }
+});
+const fancyButton = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-cc3b0550"]]);
+module.exports = fancyButton;

package/dist/cjs/hint-text.js

@@ -0,0 +1,36 @@
+"use strict";
+const Mo = require("vue");
+const clsx = require("./chunks/clsx.js");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _hoisted_1 = ["role"];
+const _hoisted_2 = { key: 1 };
+const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
+  __name: "hint-text",
+  props: {
+    text: {},
+    icon: {},
+    class: {},
+    state: { default: "default" }
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return Mo.openBlock(), Mo.createElementBlock("div", {
+        role: props.state === "error" ? "alert" : "note",
+        class: Mo.normalizeClass(Mo.unref(clsx.clsx)(
+          "celeste-hint-text",
+          `celeste-hint-text-${_ctx.state}`,
+          props.class
+        ))
+      }, [
+        _ctx.icon ? (Mo.openBlock(), Mo.createElementBlock("i", {
+          key: 0,
+          class: Mo.normalizeClass(_ctx.icon)
+        }, null, 2)) : Mo.createCommentVNode("", true),
+        _ctx.text ? (Mo.openBlock(), Mo.createElementBlock("p", _hoisted_2, Mo.toDisplayString(_ctx.text), 1)) : Mo.createCommentVNode("", true)
+      ], 10, _hoisted_1);
+    };
+  }
+});
+const hintText = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-37aef9f7"]]);
+module.exports = hintText;

package/dist/cjs/hue-slider.js

@@ -0,0 +1,133 @@
+"use strict";
+const Mo = require("vue");
+const color = require("./color.js");
+const useUserSelect = require("./use-user-select.js");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _hoisted_1 = { class: "celeste-color-slider" };
+const _hoisted_2 = ["aria-valuenow"];
+const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
+  __name: "hue-slider",
+  props: {
+    "modelValue": {
+      default: 0
+    },
+    "modelModifiers": {}
+  },
+  emits: ["update:modelValue"],
+  setup(__props) {
+    const hue = Mo.useModel(__props, "modelValue");
+    const pullDirection = Mo.ref();
+    const containerRef = Mo.useTemplateRef("slider-track");
+    const { preventPageUserSelect, allowPageUserSelect } = useUserSelect.useUserPageSelection();
+    Mo.watch(hue, (newHue, oldHue) => {
+      if (newHue !== 0 && newHue - oldHue > 0)
+        pullDirection.value = "right";
+      if (newHue !== 0 && newHue - oldHue < 0)
+        pullDirection.value = "left";
+    });
+    const pointerLeft = Mo.computed(
+      () => {
+        if (hue.value === 0 && pullDirection.value === "right")
+          return "100%";
+        return `${hue.value * 100 / 360}%`;
+      }
+    );
+    const trackThumbBg = Mo.computed(() => {
+      return `hsl(${hue.value}, 100%, 50%)`;
+    });
+    function handleChange(e, skip) {
+      if (!skip) {
+        e.preventDefault();
+      }
+      const container = containerRef.value;
+      if (!container) {
+        return;
+      }
+      const containerWidth = container.clientWidth;
+      const { x: xOffset } = color.getAbsolutePosition(container);
+      const { x: pageX } = color.getPageXYFromEvent(e);
+      const left = pageX - xOffset;
+      let h;
+      let percent;
+      if (left < 0) {
+        h = 0;
+      } else if (left > containerWidth) {
+        h = 360;
+      } else {
+        percent = left * 100 / containerWidth;
+        h = Math.round(360 * percent / 100);
+      }
+      if (hue.value !== h) {
+        emitChange(h);
+      }
+    }
+    function emitChange(h) {
+      hue.value = h;
+    }
+    function handleMouseDown(e) {
+      handleChange(e, true);
+      preventPageUserSelect();
+      window.addEventListener("mousemove", handleChange);
+      window.addEventListener("mouseup", handleMouseUp);
+    }
+    function handleMouseUp() {
+      allowPageUserSelect();
+      unbindEventListeners();
+    }
+    function unbindEventListeners() {
+      window.removeEventListener("mousemove", handleChange);
+      window.removeEventListener("mouseup", handleMouseUp);
+    }
+    function handleKeyDown(e) {
+      const direction = color.resolveArrowDirection(e);
+      if (!direction) {
+        return;
+      }
+      e.preventDefault();
+      const currentValue = hue.value;
+      let newValue;
+      switch (direction) {
+        case "left": {
+          newValue = currentValue - 1 < 0 ? 0 : Math.floor(currentValue - 1);
+          break;
+        }
+        case "right": {
+          newValue = currentValue + 1 > 360 ? 360 : Math.ceil(currentValue + 1);
+          break;
+        }
+      }
+      if (typeof newValue !== "undefined") {
+        emitChange(newValue);
+      }
+    }
+    Mo.onUnmounted(() => {
+      unbindEventListeners();
+    });
+    return (_ctx, _cache) => {
+      return Mo.openBlock(), Mo.createElementBlock("div", _hoisted_1, [
+        Mo.createElementVNode("div", {
+          ref: "slider-track",
+          class: "slider-track",
+          role: "slider",
+          "aria-valuenow": hue.value,
+          "aria-valuemin": "0",
+          "aria-valuemax": "360",
+          "aria-label": "Hue",
+          tabindex: "0",
+          onMousedown: handleMouseDown,
+          onTouchmovePassive: handleChange,
+          onTouchstartPassive: handleChange,
+          onKeydown: handleKeyDown
+        }, [
+          Mo.createElementVNode("div", {
+            class: "celeste-color-thumb",
+            style: Mo.normalizeStyle({ left: pointerLeft.value, background: trackThumbBg.value }),
+            role: "presentation"
+          }, null, 4)
+        ], 40, _hoisted_2)
+      ]);
+    };
+  }
+});
+const HueSlider = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-cb479a28"]]);
+module.exports = HueSlider;

package/dist/cjs/index.js

@@ -0,0 +1,229 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const alert = require("./alert.js");
+const badge = require("./badge.js");
+const statusBadge = require("./status-badge.js");
+const button = require("./button.js");
+const compactButton = require("./compact-button.js");
+const fancyButton = require("./fancy-button.js");
+const linkButton = require("./link-button.js");
+const socialButton = require("./social-button.js");
+const checkboxLabel = require("./checkbox-label.js");
+const checkbox_vue_vue_type_style_index_0_lang = require("./chunks/checkbox.vue_vue_type_style_index_0_lang.js");
+const comboboxAnchor_vue_vue_type_script_setup_true_lang = require("./chunks/combobox-anchor.js");
+const comboboxEmpty = require("./combobox-empty.js");
+const comboboxGroup = require("./combobox-group.js");
+const comboboxInput = require("./combobox-input.js");
+const comboboxItem = require("./combobox-item.js");
+const comboboxList = require("./combobox-list.js");
+const comboboxRoot = require("./combobox-root.js");
+const comboboxSeparator = require("./combobox-separator.js");
+const comboboxTrigger = require("./combobox-trigger.js");
+const combobox = require("./combobox.js");
+const contentDivider_vue_vue_type_style_index_0_lang = require("./chunks/content-divider.vue_vue_type_style_index_0_lang.js");
+const contextMenuItem = require("./context-menu-item.js");
+const dropdownItem = require("./dropdown-item.js");
+const dropdown = require("./dropdown.js");
+const dropdownMenuContent_vue_vue_type_style_index_0_lang = require("./chunks/dropdown-menu-content.vue_vue_type_style_index_0_lang.js");
+const dropdownMenuGroup = require("./dropdown-menu-group.js");
+const dropdownMenuItem = require("./dropdown-menu-item.js");
+const dropdownMenuLabel = require("./dropdown-menu-label.js");
+const dropdownMenuSeparator = require("./dropdown-menu-separator.js");
+const dropdownMenuSubContent_vue_vue_type_style_index_0_lang = require("./chunks/dropdown-menu-sub-content.vue_vue_type_style_index_0_lang.js");
+const dropdownMenuSubTrigger_vue_vue_type_style_index_0_lang = require("./chunks/dropdown-menu-sub-trigger.vue_vue_type_style_index_0_lang.js");
+const dropdownMenuSub_vue_vue_type_script_setup_true_lang = require("./chunks/dropdown-menu-sub.js");
+const dropdownMenuTrigger = require("./dropdown-menu-trigger.js");
+const dropdownMenu = require("./dropdown-menu.js");
+const hintText = require("./hint-text.js");
+const label = require("./label.js");
+const modalBody = require("./modal-body.js");
+const modalClose_vue_vue_type_script_setup_true_lang = require("./chunks/modal-close.js");
+const modalContent = require("./modal-content.js");
+const modalFooter = require("./modal-footer.js");
+const modalHeader = require("./modal-header.js");
+const modalTrigger_vue_vue_type_script_setup_true_lang = require("./chunks/modal-trigger.js");
+const modal_vue_vue_type_script_setup_true_lang = require("./chunks/modal.js");
+const popoverContent = require("./popover-content.js");
+const popoverTrigger = require("./popover-trigger.js");
+const popover_vue_vue_type_script_setup_true_lang = require("./chunks/popover.js");
+const richEditor = require("./rich-editor.js");
+const scrollArea_vue_vue_type_script_setup_true_lang = require("./chunks/scroll-area.js");
+const segmentedControlItem = require("./segmented-control-item.js");
+const segmentedControl = require("./segmented-control.js");
+const selectContent = require("./select-content.js");
+const selectGroup_vue_vue_type_script_setup_true_lang = require("./chunks/select-group.js");
+const selectIcon = require("./select-icon.js");
+const selectItem = require("./select-item.js");
+const selectLabel = require("./select-label.js");
+const selectSeparator = require("./select-separator.js");
+const selectTrigger = require("./select-trigger.js");
+const selectValue = require("./select-value.js");
+const select_vue_vue_type_script_setup_true_lang = require("./chunks/select.js");
+const slider_vue_vue_type_style_index_0_lang = require("./chunks/slider.vue_vue_type_style_index_0_lang.js");
+const sonnerAlert = require("./sonner-alert.js");
+const sonner_vue_vue_type_script_setup_true_lang = require("./chunks/sonner.js");
+const switch_vue_vue_type_style_index_0_lang = require("./chunks/switch.vue_vue_type_style_index_0_lang.js");
+const tabMenuContent = require("./tab-menu-content.js");
+const tabMenuItem = require("./tab-menu-item.js");
+const tabMenuList = require("./tab-menu-list.js");
+const tabMenu = require("./tab-menu.js");
+const textInputAffix = require("./text-input-affix.js");
+const textInputButton = require("./text-input-button.js");
+const textInput = require("./text-input.js");
+const textarea = require("./textarea.js");
+const tooltip = require("./tooltip.js");
+const components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  Alert: alert,
+  Badge: badge,
+  Button: button,
+  Checkbox: checkbox_vue_vue_type_style_index_0_lang._sfc_main,
+  CheckboxLabel: checkboxLabel,
+  Combobox: combobox,
+  ComboboxAnchor: comboboxAnchor_vue_vue_type_script_setup_true_lang._sfc_main,
+  ComboboxEmpty: comboboxEmpty,
+  ComboboxGroup: comboboxGroup,
+  ComboboxInput: comboboxInput,
+  ComboboxItem: comboboxItem,
+  ComboboxList: comboboxList,
+  ComboboxRoot: comboboxRoot,
+  ComboboxSeparator: comboboxSeparator,
+  ComboboxTrigger: comboboxTrigger,
+  CompactButton: compactButton,
+  ContentDivider: contentDivider_vue_vue_type_style_index_0_lang._sfc_main,
+  ContextMenuItem: contextMenuItem,
+  Dropdown: dropdown,
+  DropdownItem: dropdownItem,
+  DropdownMenu: dropdownMenu,
+  DropdownMenuContent: dropdownMenuContent_vue_vue_type_style_index_0_lang._sfc_main,
+  DropdownMenuGroup: dropdownMenuGroup,
+  DropdownMenuItem: dropdownMenuItem,
+  DropdownMenuLabel: dropdownMenuLabel,
+  DropdownMenuSeparator: dropdownMenuSeparator,
+  DropdownMenuSub: dropdownMenuSub_vue_vue_type_script_setup_true_lang._sfc_main,
+  DropdownMenuSubContent: dropdownMenuSubContent_vue_vue_type_style_index_0_lang._sfc_main,
+  DropdownMenuSubTrigger: dropdownMenuSubTrigger_vue_vue_type_style_index_0_lang._sfc_main,
+  DropdownMenuTrigger: dropdownMenuTrigger,
+  FancyButton: fancyButton,
+  HintText: hintText,
+  Label: label,
+  LinkButton: linkButton,
+  Modal: modal_vue_vue_type_script_setup_true_lang._sfc_main,
+  ModalBody: modalBody,
+  ModalClose: modalClose_vue_vue_type_script_setup_true_lang._sfc_main,
+  ModalContent: modalContent,
+  ModalFooter: modalFooter,
+  ModalHeader: modalHeader,
+  ModalTrigger: modalTrigger_vue_vue_type_script_setup_true_lang._sfc_main,
+  Popover: popover_vue_vue_type_script_setup_true_lang._sfc_main,
+  PopoverContent: popoverContent,
+  PopoverTrigger: popoverTrigger,
+  RichEditor: richEditor,
+  ScrollArea: scrollArea_vue_vue_type_script_setup_true_lang._sfc_main,
+  SegmentedControl: segmentedControl,
+  SegmentedControlItem: segmentedControlItem,
+  Select: select_vue_vue_type_script_setup_true_lang._sfc_main,
+  SelectContent: selectContent,
+  SelectGroup: selectGroup_vue_vue_type_script_setup_true_lang._sfc_main,
+  SelectIcon: selectIcon,
+  SelectItem: selectItem,
+  SelectLabel: selectLabel,
+  SelectSeparator: selectSeparator,
+  SelectTrigger: selectTrigger,
+  SelectValue: selectValue,
+  Slider: slider_vue_vue_type_style_index_0_lang._sfc_main,
+  SocialButton: socialButton,
+  Sonner: sonner_vue_vue_type_script_setup_true_lang._sfc_main,
+  SonnerAlert: sonnerAlert,
+  StatusBadge: statusBadge,
+  Switch: switch_vue_vue_type_style_index_0_lang._sfc_main,
+  TabMenu: tabMenu,
+  TabMenuContent: tabMenuContent,
+  TabMenuItem: tabMenuItem,
+  TabMenuList: tabMenuList,
+  TextInput: textInput,
+  TextInputAffix: textInputAffix,
+  TextInputButton: textInputButton,
+  Textarea: textarea,
+  Tooltip: tooltip
+}, Symbol.toStringTag, { value: "Module" }));
+const Celeste = {
+  install(vue) {
+    Object.entries(components).forEach(([name, component]) => {
+      vue.component(name, component);
+    });
+  }
+};
+exports.Alert = alert;
+exports.Badge = badge;
+exports.StatusBadge = statusBadge;
+exports.Button = button;
+exports.CompactButton = compactButton;
+exports.FancyButton = fancyButton;
+exports.LinkButton = linkButton;
+exports.SocialButton = socialButton;
+exports.CheckboxLabel = checkboxLabel;
+exports.Checkbox = checkbox_vue_vue_type_style_index_0_lang._sfc_main;
+exports.ComboboxAnchor = comboboxAnchor_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.ComboboxEmpty = comboboxEmpty;
+exports.ComboboxGroup = comboboxGroup;
+exports.ComboboxInput = comboboxInput;
+exports.ComboboxItem = comboboxItem;
+exports.ComboboxList = comboboxList;
+exports.ComboboxRoot = comboboxRoot;
+exports.ComboboxSeparator = comboboxSeparator;
+exports.ComboboxTrigger = comboboxTrigger;
+exports.Combobox = combobox;
+exports.ContentDivider = contentDivider_vue_vue_type_style_index_0_lang._sfc_main;
+exports.ContextMenuItem = contextMenuItem;
+exports.DropdownItem = dropdownItem;
+exports.Dropdown = dropdown;
+exports.DropdownMenuContent = dropdownMenuContent_vue_vue_type_style_index_0_lang._sfc_main;
+exports.DropdownMenuGroup = dropdownMenuGroup;
+exports.DropdownMenuItem = dropdownMenuItem;
+exports.DropdownMenuLabel = dropdownMenuLabel;
+exports.DropdownMenuSeparator = dropdownMenuSeparator;
+exports.DropdownMenuSubContent = dropdownMenuSubContent_vue_vue_type_style_index_0_lang._sfc_main;
+exports.DropdownMenuSubTrigger = dropdownMenuSubTrigger_vue_vue_type_style_index_0_lang._sfc_main;
+exports.DropdownMenuSub = dropdownMenuSub_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.DropdownMenuTrigger = dropdownMenuTrigger;
+exports.DropdownMenu = dropdownMenu;
+exports.HintText = hintText;
+exports.Label = label;
+exports.ModalBody = modalBody;
+exports.ModalClose = modalClose_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.ModalContent = modalContent;
+exports.ModalFooter = modalFooter;
+exports.ModalHeader = modalHeader;
+exports.ModalTrigger = modalTrigger_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.Modal = modal_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.PopoverContent = popoverContent;
+exports.PopoverTrigger = popoverTrigger;
+exports.Popover = popover_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.RichEditor = richEditor;
+exports.ScrollArea = scrollArea_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.SegmentedControlItem = segmentedControlItem;
+exports.SegmentedControl = segmentedControl;
+exports.SelectContent = selectContent;
+exports.SelectGroup = selectGroup_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.SelectIcon = selectIcon;
+exports.SelectItem = selectItem;
+exports.SelectLabel = selectLabel;
+exports.SelectSeparator = selectSeparator;
+exports.SelectTrigger = selectTrigger;
+exports.SelectValue = selectValue;
+exports.Select = select_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.Slider = slider_vue_vue_type_style_index_0_lang._sfc_main;
+exports.SonnerAlert = sonnerAlert;
+exports.Sonner = sonner_vue_vue_type_script_setup_true_lang._sfc_main;
+exports.Switch = switch_vue_vue_type_style_index_0_lang._sfc_main;
+exports.TabMenuContent = tabMenuContent;
+exports.TabMenuItem = tabMenuItem;
+exports.TabMenuList = tabMenuList;
+exports.TabMenu = tabMenu;
+exports.TextInputAffix = textInputAffix;
+exports.TextInputButton = textInputButton;
+exports.TextInput = textInput;
+exports.Textarea = textarea;
+exports.Tooltip = tooltip;
+exports.Celeste = Celeste;

package/dist/cjs/label.js

@@ -0,0 +1,55 @@
+"use strict";
+const Mo = require("vue");
+const tooltip = require("./tooltip.js");
+const useDelegatedProps = require("./use-delegated-props.js");
+const clsx = require("./chunks/clsx.js");
+const index = require("./chunks/index.js");
+const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
+const _hoisted_1 = {
+  key: 0,
+  class: "celeste-sublabel"
+};
+const _sfc_main = /* @__PURE__ */ Mo.defineComponent({
+  __name: "label",
+  props: {
+    for: {},
+    asChild: { type: Boolean },
+    as: {},
+    sublabel: {},
+    information: {},
+    required: { type: Boolean },
+    disabled: { type: Boolean },
+    class: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const delegatedProps = useDelegatedProps.useDelegatedProps(props, "class");
+    return (_ctx, _cache) => {
+      return Mo.openBlock(), Mo.createBlock(Mo.unref(index.Oh), Mo.mergeProps(Mo.unref(delegatedProps), {
+        "aria-required": _ctx.required,
+        "aria-disabled": _ctx.disabled,
+        class: Mo.unref(clsx.clsx)("celeste-label", props.class)
+      }), {
+        default: Mo.withCtx(() => [
+          Mo.renderSlot(_ctx.$slots, "default", {}, void 0, true),
+          Mo.renderSlot(_ctx.$slots, "button", { class: "celeste-label-button" }, void 0, true),
+          _ctx.sublabel ? (Mo.openBlock(), Mo.createElementBlock("span", _hoisted_1, Mo.toDisplayString(_ctx.sublabel), 1)) : Mo.createCommentVNode("", true),
+          _ctx.information ? (Mo.openBlock(), Mo.createBlock(tooltip, {
+            key: 1,
+            title: _ctx.information
+          }, {
+            default: Mo.withCtx(() => _cache[0] || (_cache[0] = [
+              Mo.createElementVNode("button", { class: "celeste-label-info" }, [
+                Mo.createElementVNode("i", { class: "i-celeste-information-2-fill" })
+              ], -1)
+            ])),
+            _: 1
+          }, 8, ["title"])) : Mo.createCommentVNode("", true)
+        ]),
+        _: 3
+      }, 16, ["aria-required", "aria-disabled", "class"]);
+    };
+  }
+});
+const Label = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-4768213c"]]);
+module.exports = Label;