@chelone/vue 0.4.0 → 0.6.0

package/dist/components/kanban/kanban-draggable-card.vue.js

@@ -0,0 +1,32 @@
+import { defineComponent, ref, openBlock, createElementBlock, unref, renderSlot } from "vue";
+import { useDraggable } from "@dnd-kit/vue";
+const _hoisted_1 = ["data-dragging", "data-draggable"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "kanban-draggable-card",
+  props: {
+    id: {},
+    draggable: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const element = ref();
+    const { isDragging } = useDraggable({
+      id: () => props.id,
+      element,
+      disabled: () => !props.draggable
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "element",
+        ref: element,
+        "data-dragging": unref(isDragging) ? "" : void 0,
+        "data-draggable": __props.draggable ? "" : void 0
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 8, _hoisted_1);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/kanban/kanban-draggable-card2.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./kanban-draggable-card.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/kanban/kanban-drop-area.vue.d.ts

@@ -0,0 +1,15 @@
+type __VLS_Props = {
+    columnId: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/kanban/kanban-drop-area.vue.js

@@ -0,0 +1,29 @@
+import { defineComponent, ref, openBlock, createElementBlock, unref, renderSlot } from "vue";
+import { useDroppable } from "@dnd-kit/vue";
+const _hoisted_1 = ["data-over"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "kanban-drop-area",
+  props: {
+    columnId: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const element = ref();
+    const { isDropTarget } = useDroppable({
+      id: () => props.columnId,
+      element
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "element",
+        ref: element,
+        "data-over": unref(isDropTarget) ? "" : void 0
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 8, _hoisted_1);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/kanban/kanban-drop-area2.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./kanban-drop-area.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/maps-osm/osm-feature-operator.vue.js

@@ -6,7 +6,7 @@ import { useTranslate } from "../../i18n/use-translate.js";
 import { useNotify } from "../../notification-hooks.js";
 import { useMapsConfig } from "../maps/use-map.js";
 import _sfc_main$1 from "../ui/button.vue.js";
-import _sfc_main$2 from "../ui/spinner.vue.js";
+import _sfc_main$2 from "../ui/spinner2.vue.js";
 import { fetchOsmFeatures } from "./osm-features.js";
 import { subtractMask, unionAll } from "./osm-geometry-ops.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/components/ui/chart/chart-container.vue.d.ts

@@ -0,0 +1,18 @@
+import { type ChartConfig } from "./utils.js";
+type __VLS_Props = {
+    id?: string;
+    class?: string;
+    config: ChartConfig;
+};
+declare var __VLS_4: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_4) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/ui/chart/chart-container.vue.js

@@ -0,0 +1,40 @@
+import { defineComponent, toRefs, openBlock, createElementBlock, normalizeClass, unref, createVNode, renderSlot } from "vue";
+import { cn } from "../../../lib/utils.js";
+import _sfc_main$1 from "./chart-style.vue.js";
+import { useId, provideChartContext } from "./utils.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "chart-container",
+  props: {
+    id: {},
+    class: {},
+    config: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { config } = toRefs(props);
+    const uniqueId = useId();
+    const chartId = `chart-${props.id || uniqueId}`;
+    provideChartContext({ id: uniqueId, config });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        "data-slot": "chart",
+        "data-chart": chartId,
+        class: normalizeClass(
+          unref(cn)(
+            "[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden",
+            props.class
+          )
+        )
+      }, [
+        createVNode(_sfc_main$1, {
+          id: chartId,
+          config: unref(config)
+        }, null, 8, ["config"]),
+        renderSlot(_ctx.$slots, "default")
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/chart-container2.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./chart-container.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/chart-legend-content.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    class?: string;
+    hideIcon?: boolean;
+    verticalAlign?: "top" | "bottom";
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    verticalAlign: "top" | "bottom";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/ui/chart/chart-legend-content.vue.js

@@ -0,0 +1,56 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, Fragment, renderList, createBlock, resolveDynamicComponent, normalizeStyle, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { cn } from "../../../lib/utils.js";
+import { useChart } from "./utils.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "chart-legend-content",
+  props: {
+    class: {},
+    hideIcon: { type: Boolean },
+    verticalAlign: { default: "bottom" }
+  },
+  setup(__props) {
+    const props = __props;
+    const { config } = useChart();
+    const items = computed(
+      () => Object.entries(config.value).map(([key, item]) => ({
+        key,
+        item,
+        // A themed entry has no single color; `ChartStyle` defines the variable.
+        color: item.color ?? `var(--color-${key})`,
+        label: item.label ?? key
+      }))
+    );
+    return (_ctx, _cache) => {
+      return items.value.length ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        class: normalizeClass(
+          unref(cn)(
+            "flex items-center justify-center gap-4",
+            props.verticalAlign === "top" ? "pb-3" : "pt-3",
+            props.class
+          )
+        )
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(items.value, (entry) => {
+          return openBlock(), createElementBlock("div", {
+            key: entry.key,
+            "data-slot": "chart-legend-item",
+            class: "flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground"
+          }, [
+            entry.item.icon && !props.hideIcon ? (openBlock(), createBlock(resolveDynamicComponent(entry.item.icon), { key: 0 })) : (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: "h-2 w-2 shrink-0 rounded-[2px]",
+              style: normalizeStyle({ backgroundColor: entry.color })
+            }, null, 4)),
+            typeof entry.label !== "string" ? (openBlock(), createBlock(resolveDynamicComponent(entry.label), { key: 2 })) : (openBlock(), createElementBlock(Fragment, { key: 3 }, [
+              createTextVNode(toDisplayString(entry.label), 1)
+            ], 64))
+          ]);
+        }), 128))
+      ], 2)) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/chart-legend-content2.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./chart-legend-content.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/chart-style.vue.d.ts

@@ -0,0 +1,7 @@
+import { type ChartConfig } from "./utils.js";
+type __VLS_Props = {
+    id: string;
+    config: ChartConfig;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/ui/chart/chart-style.vue.js

@@ -0,0 +1,43 @@
+import { defineComponent, computed, openBlock, createBlock, resolveDynamicComponent, withCtx, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { THEMES } from "./utils.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "chart-style",
+  props: {
+    id: {},
+    config: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const THEME_NAMES = ["light", "dark"];
+    const SAFE_TOKEN = /^[\w-]+$/;
+    const SAFE_COLOR = /^[^<>{};]+$/;
+    const css = computed(() => {
+      if (!SAFE_TOKEN.test(props.id)) return "";
+      const colored = Object.entries(props.config).filter(
+        ([key, item]) => SAFE_TOKEN.test(key) && (item.theme || item.color)
+      );
+      if (!colored.length) return "";
+      return THEME_NAMES.map((theme) => {
+        const prefix = THEMES[theme];
+        const lines = colored.flatMap(([key, item]) => {
+          const color = item.theme?.[theme] ?? item.color;
+          return color && SAFE_COLOR.test(color) ? [`  --color-${key}: ${color};`] : [];
+        });
+        return `${prefix} [data-chart=${props.id}] {
+${lines.join("\n")}
+}`;
+      }).join("\n");
+    });
+    return (_ctx, _cache) => {
+      return css.value ? (openBlock(), createBlock(resolveDynamicComponent("style"), { key: 0 }, {
+        default: withCtx(() => [
+          createTextVNode(toDisplayString(css.value), 1)
+        ]),
+        _: 1
+      })) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/chart-style2.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./chart-style.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/chart-tooltip-content.vue.d.ts

@@ -0,0 +1,7 @@
+import { type ChartTooltipOptions, type ChartTooltipRenderProps } from "./utils.js";
+type __VLS_Props = ChartTooltipOptions & ChartTooltipRenderProps;
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    payload: import("./utils.js").ChartDatum;
+    indicator: "line" | "dot" | "dashed";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/ui/chart/chart-tooltip-content.vue.js

@@ -0,0 +1,122 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, toDisplayString, createCommentVNode, createElementVNode, Fragment, renderList, createBlock, resolveDynamicComponent, normalizeStyle, createTextVNode } from "vue";
+import { cn } from "../../../lib/utils.js";
+import { useChart } from "./utils.js";
+const _hoisted_1 = {
+  key: 0,
+  class: "font-medium"
+};
+const _hoisted_2 = { class: "grid gap-1.5" };
+const _hoisted_3 = { class: "grid gap-1.5" };
+const _hoisted_4 = {
+  key: 0,
+  class: "font-medium"
+};
+const _hoisted_5 = { class: "text-muted-foreground" };
+const _hoisted_6 = {
+  key: 0,
+  class: "font-mono font-medium text-foreground tabular-nums"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "chart-tooltip-content",
+  props: {
+    class: {},
+    hideLabel: { type: Boolean },
+    hideIndicator: { type: Boolean },
+    indicator: { default: "dot" },
+    nameKey: {},
+    labelKey: {},
+    labelFormatter: {},
+    color: {},
+    payload: { default: () => ({}) },
+    x: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { config } = useChart();
+    const label = computed(() => {
+      if (props.hideLabel) return null;
+      if (props.labelKey && props.payload[props.labelKey] != null) {
+        return String(props.payload[props.labelKey]);
+      }
+      if (props.x === void 0) return null;
+      if (props.labelFormatter) return String(props.labelFormatter(props.x));
+      return props.x instanceof Date ? props.x.toISOString() : String(props.x);
+    });
+    const rows = computed(
+      () => Object.entries(props.payload).filter(([key]) => Object.hasOwn(config.value, key) && key !== props.labelKey).map(([key, value]) => {
+        const item = config.value[key];
+        const named = props.nameKey ? props.payload[props.nameKey] : void 0;
+        return {
+          key,
+          item,
+          name: item?.label ?? (named != null ? String(named) : key),
+          value: value == null ? null : typeof value === "number" ? value.toLocaleString() : String(value),
+          color: props.color ?? item?.color ?? `var(--color-${key})`
+        };
+      })
+    );
+    const nestLabel = computed(
+      () => rows.value.length === 1 && props.indicator !== "dot"
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(
+          unref(cn)(
+            "grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl",
+            props.class
+          )
+        )
+      }, [
+        label.value && !nestLabel.value ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(label.value), 1)) : createCommentVNode("", true),
+        createElementVNode("div", _hoisted_2, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(rows.value, (row) => {
+            return openBlock(), createElementBlock("div", {
+              key: row.key,
+              class: normalizeClass(
+                unref(cn)(
+                  "flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground",
+                  props.indicator === "dot" && "items-center"
+                )
+              )
+            }, [
+              row.item?.icon ? (openBlock(), createBlock(resolveDynamicComponent(row.item?.icon), { key: 0 })) : !props.hideIndicator ? (openBlock(), createElementBlock("div", {
+                key: 1,
+                class: normalizeClass(
+                  unref(cn)(
+                    "shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)",
+                    props.indicator === "dot" && "h-2.5 w-2.5",
+                    props.indicator === "line" && "w-1",
+                    props.indicator === "dashed" && "w-0 border-[1.5px] border-dashed bg-transparent",
+                    nestLabel.value && props.indicator === "dashed" && "my-0.5"
+                  )
+                ),
+                style: normalizeStyle({ "--color-bg": row.color, "--color-border": row.color })
+              }, null, 6)) : createCommentVNode("", true),
+              createElementVNode("div", {
+                class: normalizeClass(
+                  unref(cn)(
+                    "flex flex-1 justify-between leading-none",
+                    nestLabel.value ? "items-end" : "items-center"
+                  )
+                )
+              }, [
+                createElementVNode("div", _hoisted_3, [
+                  nestLabel.value && label.value ? (openBlock(), createElementBlock("div", _hoisted_4, toDisplayString(label.value), 1)) : createCommentVNode("", true),
+                  createElementVNode("span", _hoisted_5, [
+                    typeof row.name !== "string" ? (openBlock(), createBlock(resolveDynamicComponent(row.name), { key: 0 })) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                      createTextVNode(toDisplayString(row.name), 1)
+                    ], 64))
+                  ])
+                ]),
+                row.value !== null ? (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(row.value), 1)) : createCommentVNode("", true)
+              ], 2)
+            ], 2);
+          }), 128))
+        ])
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/chart-tooltip-content2.vue.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./chart-tooltip-content.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/ui/chart/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * The dependency-free `chart` family barrel — the Vue analog of shadcn-vue's
+ * `ui/chart`, without its UI-primitive and utility dependencies. shadcn-vue's
+ * re-export of the tooltip and crosshair from the chart library is left out so
+ * nothing here imports one; the charts import those themselves.
+ */
+export { default as ChartContainer } from "./chart-container.vue.js";
+export { default as ChartLegendContent } from "./chart-legend-content.vue.js";
+export { default as ChartStyle } from "./chart-style.vue.js";
+export { default as ChartTooltipContent } from "./chart-tooltip-content.vue.js";
+export { type ChartConfig, type ChartContextProps, type ChartDatum, type ChartDatumValue, type ChartTooltipOptions, type ChartTooltipRenderProps, componentToString, provideChartContext, THEMES, useChart, } from "./utils.js";

package/dist/components/ui/chart/utils.d.ts

@@ -0,0 +1,81 @@
+/**
+ * The non-component core of the dependency-free `chart` family: the config
+ * type, the theme map, the `useChart` context and `componentToString`.
+ *
+ * Ported from shadcn-vue's `ui/chart` without its context, id and client-check
+ * helper packages: the context is a typed `InjectionKey` as in
+ * `dropdown-menu/context.ts`, ids come from a module counter (Vue's peer range
+ * starts before Vue's own `useId`), and the client check is a `typeof window`
+ * test.
+ */
+import { type Component, type Ref } from "vue";
+/** Format: `{ THEME_NAME: CSS_SELECTOR }`. */
+export declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+export type ChartConfig = {
+    [key in string]: {
+        label?: string | Component;
+        icon?: string | Component;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof THEMES, string>;
+    });
+};
+/** A value a tooltip can show; the datum's other fields are never read. */
+export type ChartDatumValue = string | number | boolean | Date | null | undefined;
+/** One hovered datum: field name to value. */
+export type ChartDatum = Record<string, ChartDatumValue>;
+/** unovis hands a tooltip either the datum or a node holding it as `data`. */
+type ChartTooltipTarget = ChartDatum | {
+    data: ChartDatum;
+};
+/** What `componentToString` adds to the props it is given. */
+export interface ChartTooltipRenderProps {
+    payload?: ChartDatum;
+    /** The hovered x value. */
+    x?: number | Date;
+}
+/** The props of `<ChartTooltipContent>` a caller sets. */
+export interface ChartTooltipOptions {
+    class?: string;
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    /** Payload key whose value names each row; defaults to the key itself. */
+    nameKey?: string;
+    /** Payload key shown as the heading in place of `x`. */
+    labelKey?: string;
+    labelFormatter?: (x: number | Date) => string | number;
+    color?: string;
+}
+/** The contract `<ChartContainer>` provides to the chart parts. */
+export interface ChartContextProps {
+    id: string;
+    config: Ref<ChartConfig>;
+}
+/** Provide the chart context (called by `<ChartContainer>` in `setup`). */
+export declare function provideChartContext(ctx: ChartContextProps): void;
+/** Read the ambient chart context. Throws outside a `<ChartContainer>`. */
+export declare function useChart(): ChartContextProps;
+/**
+ * A page-unique id, safe to put in a selector. Inside a component it is Vue's
+ * own `useId` where the installed Vue has one (3.5+), which is per app and so
+ * matches between server render and hydration. Vue's peer range starts at 3.4,
+ * and `componentToString` calls this outside a component; both fall back to a
+ * module counter, which a server that renders several requests in one process
+ * does not reset, so on Vue 3.4 pass `id` to `<ChartContainer>` for SSR.
+ */
+export declare function useId(): string;
+/**
+ * Turn a tooltip component into a `(data, x?) => html` function, the shape
+ * unovis' tooltip `triggers` take. Returns nothing on the server, where
+ * there is no DOM to render into. The HTML comes from Vue's renderer, so text
+ * in the payload is escaped.
+ */
+export declare function componentToString(config: ChartConfig, component: Component, props?: ChartTooltipOptions): ((data: ChartTooltipTarget, x?: number | Date) => string) | undefined;
+export {};

package/dist/components/ui/chart/utils.js

@@ -0,0 +1,52 @@
+import * as Vue from "vue";
+import { getCurrentInstance, provide, inject, defineComponent, ref, h, createApp } from "vue";
+const THEMES = { light: "", dark: ".dark" };
+const ChartKey = /* @__PURE__ */ Symbol("chelone-chart");
+function provideChartContext(ctx) {
+  provide(ChartKey, ctx);
+}
+function useChart() {
+  const ctx = inject(ChartKey, null);
+  if (!ctx) {
+    throw new Error("useChart: used outside a <ChartContainer> component.");
+  }
+  return ctx;
+}
+let idCounter = 0;
+function useId() {
+  const vueUseId = Vue.useId;
+  if (vueUseId && getCurrentInstance()) {
+    return vueUseId().replace(/[^\w-]/g, "");
+  }
+  idCounter += 1;
+  return `chelone-${idCounter}`;
+}
+function isWrapped(target) {
+  return "data" in target && typeof target.data === "object" && target.data !== null && !(target.data instanceof Date);
+}
+function componentToString(config, component, props) {
+  if (typeof window === "undefined") return void 0;
+  const id = useId();
+  return (data, x) => {
+    const payload = isWrapped(data) ? data.data : data;
+    const host = defineComponent({
+      setup() {
+        provideChartContext({ id, config: ref(config) });
+        return () => h(component, { ...props, payload, x });
+      }
+    });
+    const app = createApp(host);
+    const el = document.createElement("div");
+    app.mount(el);
+    const html = el.innerHTML;
+    app.unmount();
+    return html;
+  };
+}
+export {
+  THEMES,
+  componentToString,
+  provideChartContext,
+  useChart,
+  useId
+};

package/dist/components/ui/index.d.ts

@@ -4,6 +4,7 @@ export { Badge, type BadgeVariant } from "./badge.js";
 export { default as Button } from "./button.vue.js";
 export { type ButtonSize, type ButtonVariant, type ButtonVariantsOptions, buttonVariants, } from "./button-variants.js";
 export { Card, CardContent, CardFooter, CardHeader, CardTitle, } from "./card.js";
+export { type ChartConfig, ChartContainer, type ChartContextProps, ChartLegendContent, ChartStyle, ChartTooltipContent, componentToString, provideChartContext, THEMES, useChart, } from "./chart/index.js";
 export { default as Checkbox } from "./checkbox.vue.js";
 export type { CommandContext, CommandDialogProps, CommandFilter, CommandItemEntry, CommandProps, } from "./command/index.js";
 export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandKey, CommandList, CommandSeparator, CommandShortcut, defaultCommandFilter, provideCommand, useCommand, } from "./command/index.js";

package/dist/components/ui/spinner.vue.js

@@ -1,32 +1,4 @@
-import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, createElementVNode } from "vue";
-import { cn } from "../../lib/utils.js";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "spinner",
-  props: {
-    class: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const classes = computed(() => cn("size-4 animate-spin", props.class));
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("svg", {
-        role: "status",
-        "aria-label": "Loading",
-        class: normalizeClass(classes.value),
-        "data-slot": "spinner",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        "stroke-width": "2",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round",
-        "aria-hidden": "false"
-      }, [..._cache[0] || (_cache[0] = [
-        createElementVNode("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }, null, -1)
-      ])], 2);
-    };
-  }
-});
+import _sfc_main from "./spinner2.vue.js";
 export {
   _sfc_main as default
 };

package/dist/components/ui/spinner2.vue.js

@@ -1,4 +1,32 @@
-import _sfc_main from "./spinner.vue.js";
+import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, createElementVNode } from "vue";
+import { cn } from "../../lib/utils.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "spinner",
+  props: {
+    class: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const classes = computed(() => cn("size-4 animate-spin", props.class));
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("svg", {
+        role: "status",
+        "aria-label": "Loading",
+        class: normalizeClass(classes.value),
+        "data-slot": "spinner",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        "stroke-width": "2",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round",
+        "aria-hidden": "false"
+      }, [..._cache[0] || (_cache[0] = [
+        createElementVNode("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }, null, -1)
+      ])], 2);
+    };
+  }
+});
 export {
   _sfc_main as default
 };