@zimyo/ui 1.0.0

package/dist/components/ui/calendar.js

@@ -0,0 +1,134 @@
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { __rest } from '../../node_modules/tslib/tslib.es6.js';
+import { ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon } from 'lucide-react';
+import * as React from 'react';
+import { buttonVariants, Button } from './button.js';
+import { cn } from '../../lib/utils.js';
+import { getDefaultClassNames } from '../../node_modules/react-day-picker/dist/esm/helpers/getDefaultClassNames.js';
+import { DayPicker } from '../../node_modules/react-day-picker/dist/esm/DayPicker.js';
+
+function Calendar(_a) {
+  var {
+      className,
+      classNames,
+      showOutsideDays = true,
+      captionLayout = "label",
+      buttonVariant = "ghost",
+      formatters,
+      components
+    } = _a,
+    props = __rest(_a, ["className", "classNames", "showOutsideDays", "captionLayout", "buttonVariant", "formatters", "components"]);
+  const defaultClassNames = getDefaultClassNames();
+  return /*#__PURE__*/React.createElement(DayPicker, _extends({
+    showOutsideDays: showOutsideDays,
+    className: cn("bg-background group/calendar p-3 [--cell-size:--spacing(8)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent", String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`, String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`, className),
+    captionLayout: captionLayout,
+    formatters: Object.assign({
+      formatMonthDropdown: date => date.toLocaleString("default", {
+        month: "short"
+      })
+    }, formatters),
+    classNames: Object.assign({
+      root: cn("w-fit", defaultClassNames.root),
+      months: cn("relative flex flex-col gap-4 md:flex-row", defaultClassNames.months),
+      month: cn("flex w-full flex-col gap-4", defaultClassNames.month),
+      nav: cn("absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1", defaultClassNames.nav),
+      button_previous: cn(buttonVariants({
+        variant: buttonVariant
+      }), "size-(--cell-size) p-0 select-none aria-disabled:opacity-50", defaultClassNames.button_previous),
+      button_next: cn(buttonVariants({
+        variant: buttonVariant
+      }), "size-(--cell-size) p-0 select-none aria-disabled:opacity-50", defaultClassNames.button_next),
+      month_caption: cn("flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)", defaultClassNames.month_caption),
+      dropdowns: cn("flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium", defaultClassNames.dropdowns),
+      dropdown_root: cn("has-focus:border-ring border-input has-focus:ring-ring/50 relative rounded-md border shadow-xs has-focus:ring-[3px]", defaultClassNames.dropdown_root),
+      dropdown: cn("absolute inset-0 opacity-0", defaultClassNames.dropdown),
+      caption_label: cn("font-medium select-none", captionLayout === "label" ? "text-sm" : "[&>svg]:text-muted-foreground flex h-8 items-center gap-1 rounded-md pr-1 pl-2 text-sm [&>svg]:size-3.5", defaultClassNames.caption_label),
+      table: "w-full border-collapse",
+      weekdays: cn("flex", defaultClassNames.weekdays),
+      weekday: cn("text-muted-foreground flex-1 rounded-md text-[0.8rem] font-normal select-none", defaultClassNames.weekday),
+      week: cn("mt-2 flex w-full", defaultClassNames.week),
+      week_number_header: cn("w-(--cell-size) select-none", defaultClassNames.week_number_header),
+      week_number: cn("text-muted-foreground text-[0.8rem] select-none", defaultClassNames.week_number),
+      day: cn("group/day relative aspect-square h-full w-full p-0 text-center select-none [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md", defaultClassNames.day),
+      range_start: cn("bg-accent rounded-l-md", defaultClassNames.range_start),
+      range_middle: cn("rounded-none", defaultClassNames.range_middle),
+      range_end: cn("bg-accent rounded-r-md", defaultClassNames.range_end),
+      today: cn("bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none", defaultClassNames.today),
+      outside: cn("text-muted-foreground aria-selected:text-muted-foreground", defaultClassNames.outside),
+      disabled: cn("text-muted-foreground opacity-50", defaultClassNames.disabled),
+      hidden: cn("invisible", defaultClassNames.hidden)
+    }, classNames),
+    components: Object.assign({
+      Root: _a => {
+        var {
+            className,
+            rootRef
+          } = _a,
+          props = __rest(_a, ["className", "rootRef"]);
+        return /*#__PURE__*/React.createElement("div", _extends({
+          "data-slot": "calendar",
+          ref: rootRef,
+          className: cn(className)
+        }, props));
+      },
+      Chevron: _a => {
+        var {
+            className,
+            orientation
+          } = _a,
+          props = __rest(_a, ["className", "orientation"]);
+        if (orientation === "left") {
+          return /*#__PURE__*/React.createElement(ChevronLeftIcon, _extends({
+            className: cn("size-4", className)
+          }, props));
+        }
+        if (orientation === "right") {
+          return /*#__PURE__*/React.createElement(ChevronRightIcon, _extends({
+            className: cn("size-4", className)
+          }, props));
+        }
+        return /*#__PURE__*/React.createElement(ChevronDownIcon, _extends({
+          className: cn("size-4", className)
+        }, props));
+      },
+      DayButton: CalendarDayButton,
+      WeekNumber: _a => {
+        var {
+            children
+          } = _a,
+          props = __rest(_a, ["children"]);
+        return /*#__PURE__*/React.createElement("td", props, /*#__PURE__*/React.createElement("div", {
+          className: "flex size-(--cell-size) items-center justify-center text-center"
+        }, children));
+      }
+    }, components)
+  }, props));
+}
+function CalendarDayButton(_a) {
+  var {
+      className,
+      day,
+      modifiers
+    } = _a,
+    props = __rest(_a, ["className", "day", "modifiers"]);
+  const defaultClassNames = getDefaultClassNames();
+  const ref = React.useRef(null);
+  React.useEffect(() => {
+    var _a;
+    if (modifiers.focused) (_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus();
+  }, [modifiers.focused]);
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    ref: ref,
+    variant: "ghost",
+    size: "icon",
+    "data-day": day.date.toLocaleDateString(),
+    "data-selected-single": modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle,
+    "data-range-start": modifiers.range_start,
+    "data-range-end": modifiers.range_end,
+    "data-range-middle": modifiers.range_middle,
+    className: cn("data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70", defaultClassNames.day, className)
+  }, props));
+}
+
+export { Calendar, CalendarDayButton };

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

@@ -0,0 +1,11 @@
+import * as React from 'react';
+
+declare function Card({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardAction({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/components/ui/card.js

@@ -0,0 +1,77 @@
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { __rest } from '../../node_modules/tslib/tslib.es6.js';
+import * as React from 'react';
+import { cn } from '../../lib/utils.js';
+
+function Card(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "card",
+    className: cn("bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm", className)
+  }, props));
+}
+function CardHeader(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "card-header",
+    className: cn("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", className)
+  }, props));
+}
+function CardTitle(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "card-title",
+    className: cn("leading-none font-semibold", className)
+  }, props));
+}
+function CardDescription(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "card-description",
+    className: cn("text-muted-foreground text-sm", className)
+  }, props));
+}
+function CardAction(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "card-action",
+    className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className)
+  }, props));
+}
+function CardContent(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "card-content",
+    className: cn("px-6", className)
+  }, props));
+}
+function CardFooter(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "card-footer",
+    className: cn("flex items-center px-6 [.border-t]:pt-6", className)
+  }, props));
+}
+
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

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

@@ -0,0 +1,24 @@
+import useEmblaCarousel, { UseEmblaCarouselType } from 'embla-carousel-react';
+import * as React from 'react';
+import { Button } from './button.js';
+import 'class-variance-authority/dist/types';
+import 'class-variance-authority';
+
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+type CarouselPlugin = UseCarouselParameters[1];
+type CarouselProps = {
+    opts?: CarouselOptions;
+    plugins?: CarouselPlugin;
+    orientation?: "horizontal" | "vertical";
+    setApi?: (api: CarouselApi) => void;
+};
+declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React.ComponentProps<"div"> & CarouselProps): React.JSX.Element;
+declare function CarouselContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CarouselItem({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
+declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
+
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious };
+export type { CarouselApi };

package/dist/components/ui/carousel.js

@@ -0,0 +1,163 @@
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { __rest } from '../../node_modules/tslib/tslib.es6.js';
+import useEmblaCarousel from '../../node_modules/embla-carousel-react/esm/embla-carousel-react.esm.js';
+import { ArrowRight, ArrowLeft } from 'lucide-react';
+import * as React from 'react';
+import { Button } from './button.js';
+import { cn } from '../../lib/utils.js';
+
+const CarouselContext = /*#__PURE__*/React.createContext(null);
+function useCarousel() {
+  const context = React.useContext(CarouselContext);
+  if (!context) {
+    throw new Error("useCarousel must be used within a <Carousel />");
+  }
+  return context;
+}
+function Carousel(_a) {
+  var {
+      orientation = "horizontal",
+      opts,
+      setApi,
+      plugins,
+      className,
+      children
+    } = _a,
+    props = __rest(_a, ["orientation", "opts", "setApi", "plugins", "className", "children"]);
+  const [carouselRef, api] = useEmblaCarousel(Object.assign(Object.assign({}, opts), {
+    axis: orientation === "horizontal" ? "x" : "y"
+  }), plugins);
+  const [canScrollPrev, setCanScrollPrev] = React.useState(false);
+  const [canScrollNext, setCanScrollNext] = React.useState(false);
+  const onSelect = React.useCallback(api => {
+    if (!api) return;
+    setCanScrollPrev(api.canScrollPrev());
+    setCanScrollNext(api.canScrollNext());
+  }, []);
+  const scrollPrev = React.useCallback(() => {
+    api === null || api === void 0 ? void 0 : api.scrollPrev();
+  }, [api]);
+  const scrollNext = React.useCallback(() => {
+    api === null || api === void 0 ? void 0 : api.scrollNext();
+  }, [api]);
+  const handleKeyDown = React.useCallback(event => {
+    if (event.key === "ArrowLeft") {
+      event.preventDefault();
+      scrollPrev();
+    } else if (event.key === "ArrowRight") {
+      event.preventDefault();
+      scrollNext();
+    }
+  }, [scrollPrev, scrollNext]);
+  React.useEffect(() => {
+    if (!api || !setApi) return;
+    setApi(api);
+  }, [api, setApi]);
+  React.useEffect(() => {
+    if (!api) return;
+    onSelect(api);
+    api.on("reInit", onSelect);
+    api.on("select", onSelect);
+    return () => {
+      api === null || api === void 0 ? void 0 : api.off("select", onSelect);
+    };
+  }, [api, onSelect]);
+  return /*#__PURE__*/React.createElement(CarouselContext.Provider, {
+    value: {
+      carouselRef,
+      api: api,
+      opts,
+      orientation: orientation || ((opts === null || opts === void 0 ? void 0 : opts.axis) === "y" ? "vertical" : "horizontal"),
+      scrollPrev,
+      scrollNext,
+      canScrollPrev,
+      canScrollNext
+    }
+  }, /*#__PURE__*/React.createElement("div", _extends({
+    onKeyDownCapture: handleKeyDown,
+    className: cn("relative", className),
+    role: "region",
+    "aria-roledescription": "carousel",
+    "data-slot": "carousel"
+  }, props), children));
+}
+function CarouselContent(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  const {
+    carouselRef,
+    orientation
+  } = useCarousel();
+  return /*#__PURE__*/React.createElement("div", {
+    ref: carouselRef,
+    className: "overflow-hidden",
+    "data-slot": "carousel-content"
+  }, /*#__PURE__*/React.createElement("div", _extends({
+    className: cn("flex", orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col", className)
+  }, props)));
+}
+function CarouselItem(_a) {
+  var {
+      className
+    } = _a,
+    props = __rest(_a, ["className"]);
+  const {
+    orientation
+  } = useCarousel();
+  return /*#__PURE__*/React.createElement("div", _extends({
+    role: "group",
+    "aria-roledescription": "slide",
+    "data-slot": "carousel-item",
+    className: cn("min-w-0 shrink-0 grow-0 basis-full", orientation === "horizontal" ? "pl-4" : "pt-4", className)
+  }, props));
+}
+function CarouselPrevious(_a) {
+  var {
+      className,
+      variant = "outline",
+      size = "icon"
+    } = _a,
+    props = __rest(_a, ["className", "variant", "size"]);
+  const {
+    orientation,
+    scrollPrev,
+    canScrollPrev
+  } = useCarousel();
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    "data-slot": "carousel-previous",
+    variant: variant,
+    size: size,
+    className: cn("absolute size-8 rounded-full", orientation === "horizontal" ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
+    disabled: !canScrollPrev,
+    onClick: scrollPrev
+  }, props), /*#__PURE__*/React.createElement(ArrowLeft, null), /*#__PURE__*/React.createElement("span", {
+    className: "sr-only"
+  }, "Previous slide"));
+}
+function CarouselNext(_a) {
+  var {
+      className,
+      variant = "outline",
+      size = "icon"
+    } = _a,
+    props = __rest(_a, ["className", "variant", "size"]);
+  const {
+    orientation,
+    scrollNext,
+    canScrollNext
+  } = useCarousel();
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    "data-slot": "carousel-next",
+    variant: variant,
+    size: size,
+    className: cn("absolute size-8 rounded-full", orientation === "horizontal" ? "top-1/2 -right-12 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
+    disabled: !canScrollNext,
+    onClick: scrollNext
+  }, props), /*#__PURE__*/React.createElement(ArrowRight, null), /*#__PURE__*/React.createElement("span", {
+    className: "sr-only"
+  }, "Next slide"));
+}
+
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious };

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

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import * as RechartsPrimitive from 'recharts';
+
+declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+type ChartConfig = {
+    [k in string]: {
+        label?: React.ReactNode;
+        icon?: React.ComponentType;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof THEMES, string>;
+    });
+};
+declare function ChartContainer({ id, className, children, config, ...props }: React.ComponentProps<"div"> & {
+    config: ChartConfig;
+    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
+}): React.JSX.Element;
+declare const ChartStyle: ({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}) => React.JSX.Element | null;
+declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<"div"> & {
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    nameKey?: string;
+    labelKey?: string;
+}): React.JSX.Element | null;
+declare const ChartLegend: typeof RechartsPrimitive.Legend;
+declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<"div"> & Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+}): React.JSX.Element | null;
+
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };
+export type { ChartConfig };

package/dist/components/ui/chart.js

@@ -0,0 +1,187 @@
+import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { __rest } from '../../node_modules/tslib/tslib.es6.js';
+import * as React from 'react';
+import * as RechartsPrimitive from 'recharts';
+import { cn } from '../../lib/utils.js';
+
+// Format: { THEME_NAME: CSS_SELECTOR }
+const THEMES = {
+  light: "",
+  dark: ".dark"
+};
+const ChartContext = /*#__PURE__*/React.createContext(null);
+function useChart() {
+  const context = React.useContext(ChartContext);
+  if (!context) {
+    throw new Error("useChart must be used within a <ChartContainer />");
+  }
+  return context;
+}
+function ChartContainer(_a) {
+  var {
+      id,
+      className,
+      children,
+      config
+    } = _a,
+    props = __rest(_a, ["id", "className", "children", "config"]);
+  const uniqueId = React.useId();
+  const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+  return /*#__PURE__*/React.createElement(ChartContext.Provider, {
+    value: {
+      config
+    }
+  }, /*#__PURE__*/React.createElement("div", _extends({
+    "data-slot": "chart",
+    "data-chart": chartId,
+    className: 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", className)
+  }, props), /*#__PURE__*/React.createElement(ChartStyle, {
+    id: chartId,
+    config: config
+  }), /*#__PURE__*/React.createElement(RechartsPrimitive.ResponsiveContainer, null, children)));
+}
+const ChartStyle = ({
+  id,
+  config
+}) => {
+  const colorConfig = Object.entries(config).filter(([, config]) => config.theme || config.color);
+  if (!colorConfig.length) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("style", {
+    dangerouslySetInnerHTML: {
+      __html: Object.entries(THEMES).map(([theme, prefix]) => `
+${prefix} [data-chart=${id}] {
+${colorConfig.map(([key, itemConfig]) => {
+        var _a;
+        const color = ((_a = itemConfig.theme) === null || _a === void 0 ? void 0 : _a[theme]) || itemConfig.color;
+        return color ? `  --color-${key}: ${color};` : null;
+      }).join("\n")}
+}
+`).join("\n")
+    }
+  });
+};
+const ChartTooltip = RechartsPrimitive.Tooltip;
+function ChartTooltipContent({
+  active,
+  payload,
+  className,
+  indicator = "dot",
+  hideLabel = false,
+  hideIndicator = false,
+  label,
+  labelFormatter,
+  labelClassName,
+  formatter,
+  color,
+  nameKey,
+  labelKey
+}) {
+  const {
+    config
+  } = useChart();
+  const tooltipLabel = React.useMemo(() => {
+    var _a;
+    if (hideLabel || !(payload === null || payload === void 0 ? void 0 : payload.length)) {
+      return null;
+    }
+    const [item] = payload;
+    const key = `${labelKey || (item === null || item === void 0 ? void 0 : item.dataKey) || (item === null || item === void 0 ? void 0 : item.name) || "value"}`;
+    const itemConfig = getPayloadConfigFromPayload(config, item, key);
+    const value = !labelKey && typeof label === "string" ? ((_a = config[label]) === null || _a === void 0 ? void 0 : _a.label) || label : itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.label;
+    if (labelFormatter) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: cn("font-medium", labelClassName)
+      }, labelFormatter(value, payload));
+    }
+    if (!value) {
+      return null;
+    }
+    return /*#__PURE__*/React.createElement("div", {
+      className: cn("font-medium", labelClassName)
+    }, value);
+  }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);
+  if (!active || !(payload === null || payload === void 0 ? void 0 : payload.length)) {
+    return null;
+  }
+  const nestLabel = payload.length === 1 && indicator !== "dot";
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn("border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl", className)
+  }, !nestLabel ? tooltipLabel : null, /*#__PURE__*/React.createElement("div", {
+    className: "grid gap-1.5"
+  }, payload.map((item, index) => {
+    const key = `${nameKey || item.name || item.dataKey || "value"}`;
+    const itemConfig = getPayloadConfigFromPayload(config, item, key);
+    const indicatorColor = color || item.payload.fill || item.color;
+    return /*#__PURE__*/React.createElement("div", {
+      key: item.dataKey,
+      className: cn("[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5", indicator === "dot" && "items-center")
+    }, formatter && (item === null || item === void 0 ? void 0 : item.value) !== undefined && item.name ? formatter(item.value, item.name, item, index, item.payload) : /*#__PURE__*/React.createElement(React.Fragment, null, (itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.icon) ? /*#__PURE__*/React.createElement(itemConfig.icon, null) : !hideIndicator && /*#__PURE__*/React.createElement("div", {
+      className: cn("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", {
+        "h-2.5 w-2.5": indicator === "dot",
+        "w-1": indicator === "line",
+        "w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
+        "my-0.5": nestLabel && indicator === "dashed"
+      }),
+      style: {
+        "--color-bg": indicatorColor,
+        "--color-border": indicatorColor
+      }
+    }), /*#__PURE__*/React.createElement("div", {
+      className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center")
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "grid gap-1.5"
+    }, nestLabel ? tooltipLabel : null, /*#__PURE__*/React.createElement("span", {
+      className: "text-muted-foreground"
+    }, (itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.label) || item.name)), item.value && /*#__PURE__*/React.createElement("span", {
+      className: "text-foreground font-mono font-medium tabular-nums"
+    }, item.value.toLocaleString()))));
+  })));
+}
+const ChartLegend = RechartsPrimitive.Legend;
+function ChartLegendContent({
+  className,
+  hideIcon = false,
+  payload,
+  verticalAlign = "bottom",
+  nameKey
+}) {
+  const {
+    config
+  } = useChart();
+  if (!(payload === null || payload === void 0 ? void 0 : payload.length)) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn("flex items-center justify-center gap-4", verticalAlign === "top" ? "pb-3" : "pt-3", className)
+  }, payload.map(item => {
+    const key = `${nameKey || item.dataKey || "value"}`;
+    const itemConfig = getPayloadConfigFromPayload(config, item, key);
+    return /*#__PURE__*/React.createElement("div", {
+      key: item.value,
+      className: cn("[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3")
+    }, (itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.icon) && !hideIcon ? /*#__PURE__*/React.createElement(itemConfig.icon, null) : /*#__PURE__*/React.createElement("div", {
+      className: "h-2 w-2 shrink-0 rounded-[2px]",
+      style: {
+        backgroundColor: item.color
+      }
+    }), itemConfig === null || itemConfig === void 0 ? void 0 : itemConfig.label);
+  }));
+}
+// Helper to extract item config from a payload.
+function getPayloadConfigFromPayload(config, payload, key) {
+  if (typeof payload !== "object" || payload === null) {
+    return undefined;
+  }
+  const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : undefined;
+  let configLabelKey = key;
+  if (key in payload && typeof payload[key] === "string") {
+    configLabelKey = payload[key];
+  } else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") {
+    configLabelKey = payloadPayload[key];
+  }
+  return configLabelKey in config ? config[configLabelKey] : config[key];
+}
+
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };

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

@@ -0,0 +1,6 @@
+import { Checkbox as Checkbox$1 } from 'radix-ui';
+import * as React from 'react';
+
+declare function Checkbox({ className, ...props }: React.ComponentProps<typeof Checkbox$1.Root>): React.JSX.Element;
+
+export { Checkbox };