@youcan/celeste 0.6.3

package/dist/es/text-input-button.js

@@ -0,0 +1,33 @@
+import { defineComponent, openBlock, createBlock, mergeProps, unref, withCtx, renderSlot } from "vue";
+import Button from "./button.js";
+import { useDelegatedProps } from "./use-delegated-props.js";
+import { c as clsx } from "./chunks/clsx.js";
+/* empty css                                                                         */
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "text-input-button",
+  props: {
+    inline: { type: Boolean, default: false }
+  },
+  setup(__props) {
+    const props = __props;
+    const delegatedProps = useDelegatedProps(props, "class");
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Button, mergeProps(unref(delegatedProps), {
+        size: "sm",
+        intent: "neutral",
+        variant: "stroke",
+        class: unref(clsx)("celeste-text-input-button", props.class)
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ]),
+        _: 3
+      }, 16, ["class"]);
+    };
+  }
+});
+const textInputButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-82489224"]]);
+export {
+  textInputButton as default
+};

package/dist/es/text-input-icon.js

@@ -0,0 +1,30 @@
+import { defineComponent, openBlock, createElementBlock, mergeProps, unref, createElementVNode, normalizeClass } from "vue";
+import { useDelegatedProps } from "./use-delegated-props.js";
+import { c as clsx } from "./chunks/clsx.js";
+/* empty css                                                                       */
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "text-input-icon",
+  props: {
+    icon: {},
+    position: { default: "start" },
+    class: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const delegatedProps = useDelegatedProps(props, "class");
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps(unref(delegatedProps), {
+        class: unref(clsx)("celeste-text-input-icon", props.class)
+      }), [
+        createElementVNode("i", {
+          class: normalizeClass(_ctx.icon)
+        }, null, 2)
+      ], 16);
+    };
+  }
+});
+const textInputIcon = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3b859b72"]]);
+export {
+  textInputIcon as default
+};

package/dist/es/text-input.js

@@ -0,0 +1,42 @@
+import { defineComponent, mergeModels, useModel, openBlock, createElementBlock, withDirectives, createElementVNode, mergeProps, unref, vModelDynamic, renderSlot } from "vue";
+import { c as clsx } from "./chunks/clsx.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _hoisted_1 = ["size", "has-error"];
+const _hoisted_2 = ["type"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "text-input",
+  props: /* @__PURE__ */ mergeModels({
+    type: { default: "text" },
+    size: { default: "sm" },
+    hasError: { type: Boolean, default: false }
+  }, {
+    "modelValue": {},
+    "modelModifiers": {}
+  }),
+  emits: ["update:modelValue"],
+  setup(__props) {
+    const props = __props;
+    const modelValue = useModel(__props, "modelValue");
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("label", {
+        size: _ctx.size,
+        "has-error": _ctx.hasError,
+        class: "celeste-text-input-wrapper"
+      }, [
+        withDirectives(createElementVNode("input", mergeProps({
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event)
+        }, _ctx.$attrs, {
+          type: _ctx.type,
+          class: unref(clsx)("celeste-text-input", props.class)
+        }), null, 16, _hoisted_2), [
+          [vModelDynamic, modelValue.value]
+        ]),
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ], 8, _hoisted_1);
+    };
+  }
+});
+const TextInput = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a28be4ca"]]);
+export {
+  TextInput as default
+};

package/dist/es/textarea.js

@@ -0,0 +1,57 @@
+import { defineComponent, mergeModels, useModel, openBlock, createElementBlock, normalizeClass, unref, withDirectives, createElementVNode, mergeProps, vModelText, toDisplayString, createCommentVNode } from "vue";
+import { c as clsx } from "./chunks/clsx.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _hoisted_1 = ["aria-disabled"];
+const _hoisted_2 = ["placeholder", "maxlength", "disabled"];
+const _hoisted_3 = {
+  key: 0,
+  class: "celeste-textarea-count"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "textarea",
+  props: /* @__PURE__ */ mergeModels({
+    class: {},
+    placeholder: { default: "Placeholder" },
+    showCount: { type: Boolean, default: true },
+    disabled: { type: Boolean, default: false },
+    maxLength: {}
+  }, {
+    "modelValue": {},
+    "modelModifiers": {}
+  }),
+  emits: ["update:modelValue"],
+  setup(__props) {
+    const props = __props;
+    const modelValue = useModel(__props, "modelValue");
+    return (_ctx, _cache) => {
+      var _a;
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(clsx)(
+          "celeste-textarea-wrapper",
+          props.class
+        )),
+        "aria-disabled": _ctx.disabled,
+        onClick: _cache[1] || (_cache[1] = ($event) => {
+          var _a2;
+          return (_a2 = _ctx.$el.querySelector("textarea")) == null ? void 0 : _a2.focus();
+        })
+      }, [
+        withDirectives(createElementVNode("textarea", mergeProps({
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event)
+        }, _ctx.$attrs, {
+          placeholder: _ctx.placeholder,
+          maxlength: _ctx.maxLength,
+          disabled: _ctx.disabled,
+          class: "celeste-textarea"
+        }), null, 16, _hoisted_2), [
+          [vModelText, modelValue.value]
+        ]),
+        _ctx.showCount && Number(_ctx.maxLength) ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(`${((_a = modelValue.value) == null ? void 0 : _a.length) || 0}/${_ctx.maxLength}`), 1)) : createCommentVNode("", true)
+      ], 10, _hoisted_1);
+    };
+  }
+});
+const textarea = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-76864cee"]]);
+export {
+  textarea as default
+};

package/dist/es/tooltip.js

@@ -0,0 +1,116 @@
+import { defineComponent, ref, openBlock, createBlock, unref, withCtx, createVNode, mergeProps, renderSlot, createElementBlock, normalizeClass, createCommentVNode, createElementVNode, toDisplayString } from "vue";
+import CompactButton from "./compact-button.js";
+import { c as clsx } from "./chunks/clsx.js";
+import { x as xe, ah as Lg, ai as zg, aj as Kg, ak as jg, al as Hg, am as Wg } from "./chunks/index.js";
+import { _ as _export_sfc } from "./chunks/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "celeste-tooltip-content-box" };
+const _hoisted_2 = {
+  key: 0,
+  class: "celeste-tooltip-content-title"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "celeste-tooltip-content-description"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "tooltip",
+  props: {
+    class: {},
+    size: { default: "sm" },
+    variant: { default: "light" },
+    icon: {},
+    title: {},
+    description: {},
+    dismissible: { type: Boolean },
+    defaultOpen: { type: Boolean },
+    open: { type: Boolean },
+    delayDuration: { default: 0 },
+    disableHoverableContent: { type: Boolean },
+    disableClosingTrigger: { type: Boolean },
+    disabled: { type: Boolean },
+    ignoreNonKeyboardFocus: { type: Boolean },
+    forceMount: { type: Boolean },
+    ariaLabel: {},
+    asChild: { type: Boolean },
+    as: {},
+    side: {},
+    sideOffset: { default: 12 },
+    align: {},
+    alignOffset: {},
+    avoidCollisions: { type: Boolean },
+    collisionBoundary: {},
+    collisionPadding: {},
+    arrowPadding: {},
+    sticky: {},
+    hideWhenDetached: { type: Boolean }
+  },
+  emits: ["update:open"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const forwarded = xe(props, emits);
+    const isOpen = ref(props.defaultOpen);
+    function close() {
+      isOpen.value = false;
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Lg), null, {
+        default: withCtx(() => [
+          createVNode(unref(zg), mergeProps(unref(forwarded), {
+            open: props.open || isOpen.value,
+            "onUpdate:open": _cache[0] || (_cache[0] = (state) => isOpen.value = state)
+          }), {
+            default: withCtx(() => [
+              createVNode(unref(Kg), { "as-child": "" }, {
+                default: withCtx(() => [
+                  renderSlot(_ctx.$slots, "default", {}, void 0, true)
+                ]),
+                _: 3
+              }),
+              createVNode(unref(jg), { class: "celeste-tooltip-portal" }, {
+                default: withCtx(() => [
+                  createVNode(unref(Hg), mergeProps({ ...unref(forwarded), ..._ctx.$attrs }, {
+                    size: _ctx.size,
+                    variant: _ctx.variant,
+                    class: unref(clsx)("celeste-tooltip-content", props.class)
+                  }), {
+                    default: withCtx(() => [
+                      _ctx.icon ? (openBlock(), createElementBlock("i", {
+                        key: 0,
+                        class: normalizeClass(`celeste-tooltip-content-icon ${_ctx.icon}`)
+                      }, null, 2)) : createCommentVNode("", true),
+                      createElementVNode("div", _hoisted_1, [
+                        _ctx.title ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(_ctx.title), 1)) : createCommentVNode("", true),
+                        _ctx.description ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(_ctx.description), 1)) : createCommentVNode("", true)
+                      ]),
+                      _ctx.dismissible ? (openBlock(), createBlock(CompactButton, {
+                        key: 1,
+                        variant: "ghost",
+                        icon: "i-celeste-close-line",
+                        onClick: close
+                      })) : createCommentVNode("", true),
+                      createVNode(unref(Wg), { "as-child": "" }, {
+                        default: withCtx(() => _cache[1] || (_cache[1] = [
+                          createElementVNode("span", { class: "celeste-tooltip-content-arrow" }, null, -1)
+                        ])),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }, 16, ["size", "variant", "class"])
+                ]),
+                _: 1
+              })
+            ]),
+            _: 3
+          }, 16, ["open"])
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+const Tooltip = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0dc4a40e"]]);
+export {
+  Tooltip as default
+};

package/dist/es/use-color-model.js

@@ -0,0 +1,6 @@
+import { C, d } from "./chunks/use-color-model.js";
+import "vue";
+export {
+  C as ColorPickerEmits,
+  d as defineColorModel
+};

package/dist/es/use-delegated-props.js

@@ -0,0 +1,14 @@
+import { computed } from "vue";
+function useDelegatedProps(props, excludeKeys = ["class"]) {
+  return computed(() => {
+    const keysToExclude = Array.isArray(excludeKeys) ? excludeKeys : [excludeKeys];
+    const delegated = { ...props };
+    keysToExclude.forEach((key) => {
+      delete delegated[key];
+    });
+    return delegated;
+  });
+}
+export {
+  useDelegatedProps
+};

package/dist/es/use-user-select.js

@@ -0,0 +1,39 @@
+import { ref, onUnmounted, readonly } from "vue";
+function useUserPageSelection() {
+  const isDisabled = ref(false);
+  let styleElement = null;
+  const preventPageUserSelect = () => {
+    if (!styleElement) {
+      styleElement = document.createElement("style");
+      styleElement.textContent = "body > * { user-select: none; }";
+      document.head.appendChild(styleElement);
+      isDisabled.value = true;
+    }
+  };
+  const allowPageUserSelect = () => {
+    if (styleElement) {
+      styleElement.remove();
+      styleElement = null;
+      isDisabled.value = false;
+    }
+  };
+  const togglePageUserSelect = () => {
+    if (styleElement) {
+      allowPageUserSelect();
+      return;
+    }
+    preventPageUserSelect();
+  };
+  onUnmounted(() => {
+    allowPageUserSelect();
+  });
+  return {
+    isDisabled: readonly(isDisabled),
+    togglePageUserSelect,
+    preventPageUserSelect,
+    allowPageUserSelect
+  };
+}
+export {
+  useUserPageSelection
+};

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+import { App } from 'vue';
+export declare const Celeste: {
+    install(vue: App): void;
+};
+export * from './components';

package/dist/utils/color.d.ts

@@ -0,0 +1,26 @@
+export type ArrowDirection = 'up' | 'down' | 'left' | 'right';
+export type RGBKey = 'r' | 'g' | 'b';
+export type HSLKey = 'h' | 's' | 'l';
+export type HSBKey = 'h' | 's' | 'v';
+export type AlphaKey = 'a';
+export type ColorKey = RGBKey | HSLKey | HSBKey | AlphaKey;
+export interface Coordinates {
+    x: number;
+    y: number;
+}
+export declare const COLOR_NUMBER_VALIDATION_PATTERN: RegExp;
+export declare const HEX_VALIDATION_PATTERN: RegExp;
+export declare const DEFAULT_SWATCH: string[];
+export declare function getFractionDigit(data: number | string): number;
+export declare function clamp(value: number, min: number, max: number): number;
+export declare function truncColorValue(value: string): number;
+export declare function getColorConstraints(key: ColorKey): {
+    min: number;
+    max: number;
+};
+export declare function bumpColorValue(value: number, direction: Omit<ArrowDirection, 'left' | 'right'> | null): number;
+export declare function getPageXYFromEvent(e: MouseEvent | TouchEvent): Coordinates;
+export declare function getScrollXY(): Coordinates;
+/** get the position of the container relative to the document’s edge, regardless of any scrolling that has occurred */
+export declare function getAbsolutePosition(container: HTMLElement): Coordinates;
+export declare function resolveArrowDirection(e: KeyboardEvent): ArrowDirection;

package/dist/utils/crypto.d.ts

@@ -0,0 +1 @@
+export declare function uid(prefix?: string, random?: boolean): string;

package/package.json

@@ -0,0 +1,77 @@
+{
+  "name": "@youcan/celeste",
+  "type": "module",
+  "version": "0.6.3",
+  "author": "YouCan <tech@youcan.shop>",
+  "keywords": [
+    "youcan",
+    "celeste"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/es/index.js",
+      "require": "./dist/cjs/index.cjs"
+    },
+    "./assets/celeste-vue.css": "./dist/celeste-vue.css"
+  },
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/es/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "engines": {
+    "node": ">=20.10.0"
+  },
+  "peerDependencies": {
+    "vue": "^3.5.13"
+  },
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "radix-vue": "^1.9.12",
+    "tinycolor2": "^1.6.0",
+    "@youcan/celeste-icons": "0.6.3",
+    "@youcan/celeste-tokens": "0.6.3"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^4.0.0",
+    "@storybook/addon-docs": "^9.0.4",
+    "@storybook/addon-onboarding": "^9.0.4",
+    "@storybook/vue3-vite": "^9.0.4",
+    "@tsconfig/node20": "^20.1.4",
+    "@types/jsdom": "^21.1.7",
+    "@types/tinycolor2": "^1.4.6",
+    "@typescript-eslint/typescript-estree": "^8.37.0",
+    "@typescript-eslint/utils": "^8.37.0",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "@vue/compiler-core": "^3.5.17",
+    "@vue/test-utils": "^2.4.6",
+    "@vue/tsconfig": "^0.7.0",
+    "chromatic": "^11.22.1",
+    "eslint-plugin-storybook": "9.0.17",
+    "glob": "^11.0.3",
+    "jsdom": "^25.0.1",
+    "rimraf": "^6.0.1",
+    "sass": "^1.83.1",
+    "storybook": "^9.0.17",
+    "unocss": "^0.65.4",
+    "vite": "^6.0.7",
+    "vite-plugin-dts": "^4.4.0",
+    "vitest": "^2.1.8",
+    "vue-docgen-api": "^4.79.2",
+    "vue-tsc": "^2.2.0"
+  },
+  "scripts": {
+    "build": "rimraf dist && vue-tsc --declaration --emitDeclarationOnly -p tsconfig.build.json && vite build",
+    "build-only": "vite build",
+    "watch": "vite build --watch",
+    "type-check": "vue-tsc -p tsconfig.check.json --noEmit",
+    "type-gen": "vue-tsc --declaration  --emitDeclarationOnly",
+    "test": "vitest",
+    "release": "pnpm publish --access public",
+    "storybook": "NODE_ENV=dev storybook dev -p 6006",
+    "build-storybook": "NODE_ENV=dev storybook build"
+  }
+}