@moduix/react-tailwind 1.0.0

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

@@ -0,0 +1,20 @@
+import { Carousel as CarouselPrimitive, useCarousel, useCarouselContext } from '@ark-ui/react/carousel';
+declare const Carousel: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Context: (props: CarouselPrimitive.ContextProps) => import("react").ReactNode;
+    Control: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ItemGroup: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.ItemGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.ItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    PrevTrigger: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.PrevTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    NextTrigger: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.NextTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    IndicatorGroup: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.IndicatorGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Indicator: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.IndicatorProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Indicators: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.IndicatorGroupProps & import("react").RefAttributes<HTMLDivElement> & {
+        indicatorClassName?: string;
+    }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    AutoplayTrigger: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.AutoplayTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    AutoplayIndicator: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.AutoplayIndicatorProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    ProgressText: import("react").ForwardRefExoticComponent<Omit<CarouselPrimitive.ProgressTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+};
+export { Carousel, useCarousel, useCarouselContext };

package/dist/components/carousel/Carousel.js

@@ -0,0 +1,145 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { Carousel, useCarousel, useCarouselContext } from "@ark-ui/react/carousel";
+import { forwardRef } from "react";
+import { cn } from "../../internal/cn.js";
+import { ChevronLeftIcon, ChevronRightIcon } from "../../internal/icons/ui/index.js";
+const Carousel_CarouselRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.Root, {
+        ref: ref,
+        "data-slot": "carousel-root",
+        className: cn('group/carousel flex w-full min-w-0 flex-col gap-3 data-[orientation=vertical]:h-96 data-[orientation=vertical]:flex-row data-[orientation=vertical]:items-stretch', className),
+        ...props
+    });
+});
+const Carousel_CarouselRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.RootProvider, {
+        ref: ref,
+        "data-slot": "carousel-root-provider",
+        className: cn('group/carousel flex w-full min-w-0 flex-col gap-3 data-[orientation=vertical]:h-96 data-[orientation=vertical]:flex-row data-[orientation=vertical]:items-stretch', className),
+        ...props
+    });
+});
+const Carousel_CarouselControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.Control, {
+        ref: ref,
+        "data-slot": "carousel-control",
+        className: cn('flex min-w-0 items-center gap-3 data-[orientation=vertical]:flex-col data-[orientation=vertical]:justify-between', className),
+        ...props
+    });
+});
+const Carousel_CarouselItemGroup = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.ItemGroup, {
+        ref: ref,
+        "data-slot": "carousel-item-group",
+        className: cn('flex min-h-0 min-w-0 flex-1 [scrollbar-width:none] overscroll-x-contain overscroll-y-auto scroll-smooth rounded-xl outline-0 focus-visible:outline-1 focus-visible:-outline-offset-1 focus-visible:outline-ring data-dragging:cursor-grabbing data-dragging:select-none data-[orientation=vertical]:h-full data-[orientation=vertical]:overscroll-x-auto data-[orientation=vertical]:overscroll-y-contain motion-reduce:scroll-auto [&::-webkit-scrollbar]:hidden', className),
+        ...props
+    });
+});
+const Carousel_CarouselItem = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.Item, {
+        ref: ref,
+        "data-slot": "carousel-item",
+        className: cn('box-border min-h-0 min-w-0', className),
+        ...props
+    });
+});
+const Carousel_CarouselPrevTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.PrevTrigger, {
+        ref: ref,
+        "data-slot": "carousel-prev-trigger",
+        className: cn('focus-visible:outline-offset-0.5 inline-flex size-control-md shrink-0 cursor-pointer items-center justify-center rounded-full border border-border bg-card text-foreground shadow-sm outline-0 transition-[background-color,border-color,color,box-shadow,transform] duration-150 ease-in-out focus-visible:outline-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50 data-disabled:cursor-not-allowed data-disabled:opacity-50 data-pressed:border-foreground data-pressed:bg-accent data-pressed:text-accent-foreground motion-reduce:transition-none [&_svg]:size-4 [&:not(:disabled):not([data-disabled]):hover]:border-foreground [&:not(:disabled):not([data-disabled]):hover]:bg-accent [&:not(:disabled):not([data-disabled]):hover]:text-accent-foreground [&:not(:disabled):not([data-disabled]):hover]:shadow-md', className),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx("span", {
+            className: "inline-flex items-center justify-center",
+            children: /*#__PURE__*/ jsx(ChevronLeftIcon, {
+                className: "group-data-[orientation=vertical]/carousel:rotate-90 group-data-[orientation=horizontal]/carousel:rtl:rotate-180"
+            })
+        })
+    });
+});
+const Carousel_CarouselNextTrigger = /*#__PURE__*/ forwardRef(function({ className, children, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.NextTrigger, {
+        ref: ref,
+        "data-slot": "carousel-next-trigger",
+        className: cn('focus-visible:outline-offset-0.5 inline-flex size-control-md shrink-0 cursor-pointer items-center justify-center rounded-full border border-border bg-card text-foreground shadow-sm outline-0 transition-[background-color,border-color,color,box-shadow,transform] duration-150 ease-in-out focus-visible:outline-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50 data-disabled:cursor-not-allowed data-disabled:opacity-50 data-pressed:border-foreground data-pressed:bg-accent data-pressed:text-accent-foreground motion-reduce:transition-none [&_svg]:size-4 [&:not(:disabled):not([data-disabled]):hover]:border-foreground [&:not(:disabled):not([data-disabled]):hover]:bg-accent [&:not(:disabled):not([data-disabled]):hover]:text-accent-foreground [&:not(:disabled):not([data-disabled]):hover]:shadow-md', className),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx("span", {
+            className: "inline-flex items-center justify-center",
+            children: /*#__PURE__*/ jsx(ChevronRightIcon, {
+                className: "group-data-[orientation=vertical]/carousel:rotate-90 group-data-[orientation=horizontal]/carousel:rtl:rotate-180"
+            })
+        })
+    });
+});
+const Carousel_CarouselIndicatorGroup = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.IndicatorGroup, {
+        ref: ref,
+        "data-slot": "carousel-indicator-group",
+        className: cn('flex items-center justify-center gap-2 data-[orientation=vertical]:flex-col', className),
+        ...props
+    });
+});
+const Carousel_CarouselIndicator = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.Indicator, {
+        ref: ref,
+        "data-slot": "carousel-indicator",
+        className: cn('focus-visible:outline-offset-0.5 size-2 cursor-pointer rounded-full border-0 bg-muted p-0 opacity-90 transition-[width,height,background-color,opacity] duration-150 focus-visible:outline-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50 data-current:w-6 data-current:bg-primary data-current:opacity-100 data-disabled:cursor-not-allowed data-disabled:opacity-50 data-readonly:cursor-not-allowed data-readonly:opacity-50 data-[orientation=vertical]:data-current:h-6 data-[orientation=vertical]:data-current:w-2 motion-reduce:transition-none forced-colors:bg-[ButtonText] forced-colors:data-current:bg-[Highlight] [&:not(:disabled):not([data-disabled]):not([data-readonly]):not([data-current]):hover]:bg-muted-foreground', className),
+        ...props
+    });
+});
+const Carousel_CarouselIndicators = /*#__PURE__*/ forwardRef(function({ className, indicatorClassName, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.Context, {
+        children: (api)=>/*#__PURE__*/ jsx(Carousel_CarouselIndicatorGroup, {
+                ref: ref,
+                className: className,
+                ...props,
+                children: api.pageSnapPoints.map((_, index)=>/*#__PURE__*/ jsx(Carousel_CarouselIndicator, {
+                        index: index,
+                        className: indicatorClassName
+                    }, index))
+            })
+    });
+});
+const Carousel_CarouselAutoplayTrigger = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.AutoplayTrigger, {
+        ref: ref,
+        "data-slot": "carousel-autoplay-trigger",
+        className: cn('focus-visible:outline-offset-0.5 inline-flex size-control-md min-w-12 shrink-0 cursor-pointer items-center justify-center rounded-full border border-border bg-card text-foreground shadow-sm outline-0 transition-[background-color,border-color,color,box-shadow,transform] duration-150 ease-in-out focus-visible:outline-2 focus-visible:outline-ring disabled:cursor-not-allowed disabled:opacity-50 data-disabled:cursor-not-allowed data-disabled:opacity-50 data-pressed:border-foreground data-pressed:bg-accent data-pressed:text-accent-foreground motion-reduce:transition-none [&_svg]:size-4 [&:not(:disabled):not([data-disabled]):hover]:border-foreground [&:not(:disabled):not([data-disabled]):hover]:bg-accent [&:not(:disabled):not([data-disabled]):hover]:text-accent-foreground [&:not(:disabled):not([data-disabled]):hover]:shadow-md', className),
+        ...props
+    });
+});
+const Carousel_CarouselAutoplayIndicator = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.AutoplayIndicator, {
+        ref: ref,
+        "data-slot": "carousel-autoplay-indicator",
+        className: cn('inline-flex min-w-4 items-center justify-center text-xs font-medium uppercase', className),
+        ...props
+    });
+});
+const Carousel_CarouselProgressText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Carousel.ProgressText, {
+        ref: ref,
+        "data-slot": "carousel-progress-text",
+        dir: "ltr",
+        className: cn('text-sm text-muted-foreground tabular-nums [unicode-bidi:isolate]', className),
+        ...props
+    });
+});
+const Carousel_Carousel = Object.assign(Carousel_CarouselRoot, {
+    Root: Carousel_CarouselRoot,
+    RootProvider: Carousel_CarouselRootProvider,
+    Context: Carousel.Context,
+    Control: Carousel_CarouselControl,
+    ItemGroup: Carousel_CarouselItemGroup,
+    Item: Carousel_CarouselItem,
+    PrevTrigger: Carousel_CarouselPrevTrigger,
+    NextTrigger: Carousel_CarouselNextTrigger,
+    IndicatorGroup: Carousel_CarouselIndicatorGroup,
+    Indicator: Carousel_CarouselIndicator,
+    Indicators: Carousel_CarouselIndicators,
+    AutoplayTrigger: Carousel_CarouselAutoplayTrigger,
+    AutoplayIndicator: Carousel_CarouselAutoplayIndicator,
+    ProgressText: Carousel_CarouselProgressText
+});
+export { Carousel_Carousel as Carousel, useCarousel, useCarouselContext };

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

@@ -0,0 +1 @@
+export * from './Carousel.js';

package/dist/components/carousel/index.js

@@ -0,0 +1 @@
+export * from "./Carousel.js";

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

@@ -0,0 +1,18 @@
+import type { ChartValue } from '@tanstack/charts';
+import type { RendererChartProps } from '@tanstack/charts/react/tooltip';
+declare const ChartPlot: <TDatum, TXValue extends ChartValue = ChartValue, TYValue extends ChartValue = ChartValue>({ className, definition, motion, renderTooltipBody, renderer, ...props }: Omit<RendererChartProps<TDatum, TXValue, TYValue>, 'renderer'> & {
+    motion?: boolean;
+    renderer?: RendererChartProps<TDatum, TXValue, TYValue>['renderer'];
+}) => import("react").JSX.Element;
+declare const Chart: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLElement>>;
+    Plot: typeof ChartPlot;
+    Header: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLElement>>;
+    Title: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLHeadingElement>>;
+    Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLParagraphElement>>;
+    Legend: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & import("react").RefAttributes<HTMLUListElement>>;
+    LegendItem: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & import("@ark-ui/react/factory").PolymorphicProps & {
+        color?: string;
+    } & import("react").RefAttributes<HTMLLIElement>>;
+};
+export { Chart };

package/dist/components/chart/Chart.js

@@ -0,0 +1,183 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { ark } from "@ark-ui/react/factory";
+import { motion as motion_motion } from "@tanstack/charts/motion";
+import { RendererChart } from "@tanstack/charts/react/tooltip";
+import { svgChartRenderer } from "@tanstack/charts/svg/renderer";
+import { forwardRef } from "react";
+import { cn } from "../../internal/cn.js";
+const defaultChartRenderer = motion_motion({
+    transition: {
+        type: 'spring',
+        stiffness: 260,
+        damping: 30,
+        mass: 0.8
+    }
+});
+function mergeTooltipClassName(className) {
+    return cn('!rounded-md !border !border-border !bg-popover !p-3 !font-sans !text-xs !leading-4 !font-medium !text-popover-foreground !shadow-lg', className);
+}
+function withTooltipStyles(definition) {
+    const tooltip = definition.tooltip;
+    if (!tooltip) return definition;
+    const styledTooltip = 'object' == typeof tooltip && 'use' in tooltip ? {
+        ...tooltip,
+        className: mergeTooltipClassName(tooltip.className)
+    } : {
+        use: tooltip,
+        className: mergeTooltipClassName()
+    };
+    return {
+        ...definition,
+        tooltip: styledTooltip
+    };
+}
+const Chart_ChartRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.figure, {
+        ref: ref,
+        "data-scope": "chart",
+        "data-part": "root",
+        "data-slot": "chart-root",
+        className: cn('grid w-full min-w-0 gap-5 rounded-lg border border-border bg-card p-5 text-card-foreground shadow-sm', className),
+        ...props
+    });
+});
+const renderDefaultTooltipBody = ({ content })=>{
+    if ('string' == typeof content) return /*#__PURE__*/ jsx("span", {
+        "data-slot": "chart-tooltip-text",
+        children: content
+    });
+    return /*#__PURE__*/ jsxs("div", {
+        "data-slot": "chart-tooltip-body",
+        className: "grid gap-1",
+        children: [
+            content.title ? /*#__PURE__*/ jsxs("div", {
+                "data-slot": "chart-tooltip-title",
+                className: "flex items-center gap-2 font-semibold text-popover-foreground",
+                children: [
+                    content.color ? /*#__PURE__*/ jsx("span", {
+                        "aria-hidden": "true",
+                        "data-slot": "chart-tooltip-swatch",
+                        className: "size-2.5 rounded-full shadow-[inset_0_0_0_1px_rgb(0_0_0_/_8%)]",
+                        style: {
+                            backgroundColor: content.color
+                        }
+                    }) : null,
+                    content.title
+                ]
+            }) : null,
+            content.rows.length ? /*#__PURE__*/ jsx("div", {
+                "data-slot": "chart-tooltip-rows",
+                className: "grid gap-1",
+                children: content.rows.map((row, index)=>/*#__PURE__*/ jsxs("div", {
+                        "data-has-swatch": row.color ? '' : void 0,
+                        "data-slot": "chart-tooltip-row",
+                        className: "grid grid-cols-[minmax(0,1fr)_auto] items-center gap-x-2 data-[has-swatch]:grid-cols-[0.625rem_minmax(0,1fr)_auto]",
+                        children: [
+                            row.color ? /*#__PURE__*/ jsx("span", {
+                                "aria-hidden": "true",
+                                "data-slot": "chart-tooltip-swatch",
+                                className: "size-2.5 rounded-full shadow-[inset_0_0_0_1px_rgb(0_0_0_/_8%)]",
+                                style: {
+                                    backgroundColor: row.color
+                                }
+                            }) : null,
+                            /*#__PURE__*/ jsx("span", {
+                                "data-slot": "chart-tooltip-label",
+                                className: "min-w-0 text-muted-foreground",
+                                children: row.label
+                            }),
+                            /*#__PURE__*/ jsx("span", {
+                                "data-slot": "chart-tooltip-value",
+                                className: "text-right font-semibold whitespace-nowrap text-popover-foreground tabular-nums",
+                                children: row.value
+                            })
+                        ]
+                    }, `${row.label}-${index}`))
+            }) : null
+        ]
+    });
+};
+const Chart_ChartPlot = function({ className, definition, motion = true, renderTooltipBody, renderer, ...props }) {
+    return /*#__PURE__*/ jsx(RendererChart, {
+        ...props,
+        definition: withTooltipStyles(definition),
+        renderer: renderer ?? (motion ? defaultChartRenderer : svgChartRenderer),
+        renderTooltipBody: renderTooltipBody ?? renderDefaultTooltipBody,
+        className: cn('[&_.ts-chart:focus-visible]:outline-offset-0.5 min-w-0 text-muted-foreground [&_.ts-chart]:rounded-md [&_.ts-chart]:outline-none [&_.ts-chart:focus-visible]:outline-2 [&_.ts-chart:focus-visible]:outline-ring', className)
+    });
+};
+const Chart_ChartHeader = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.figcaption, {
+        ref: ref,
+        "data-scope": "chart",
+        "data-part": "header",
+        "data-slot": "chart-header",
+        className: cn('grid gap-1', className),
+        ...props
+    });
+});
+const Chart_ChartTitle = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.h3, {
+        ref: ref,
+        "data-scope": "chart",
+        "data-part": "title",
+        "data-slot": "chart-title",
+        className: cn('text-lg font-semibold', className),
+        ...props
+    });
+});
+const Chart_ChartDescription = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.p, {
+        ref: ref,
+        "data-scope": "chart",
+        "data-part": "description",
+        "data-slot": "chart-description",
+        className: cn('text-sm text-muted-foreground', className),
+        ...props
+    });
+});
+const Chart_ChartLegend = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.ul, {
+        ref: ref,
+        "data-scope": "chart",
+        "data-part": "legend",
+        "data-slot": "chart-legend",
+        className: cn('flex flex-wrap gap-3', className),
+        ...props
+    });
+});
+const Chart_ChartLegendItem = /*#__PURE__*/ forwardRef(function({ asChild, children, className, color, style, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ark.li, {
+        ref: ref,
+        asChild: asChild,
+        "data-scope": "chart",
+        "data-part": "legend-item",
+        "data-slot": "chart-legend-item",
+        className: cn('inline-flex items-center gap-2 text-sm text-muted-foreground', className),
+        style: style,
+        ...props,
+        children: asChild ? children : /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                /*#__PURE__*/ jsx("span", {
+                    "aria-hidden": "true",
+                    className: "size-2.5 shrink-0 rounded-full bg-muted-foreground shadow-[inset_0_0_0_1px_rgb(0_0_0_/_8%)]",
+                    style: color ? {
+                        backgroundColor: color
+                    } : void 0
+                }),
+                children
+            ]
+        })
+    });
+});
+const Chart = Object.assign(Chart_ChartRoot, {
+    Root: Chart_ChartRoot,
+    Plot: Chart_ChartPlot,
+    Header: Chart_ChartHeader,
+    Title: Chart_ChartTitle,
+    Description: Chart_ChartDescription,
+    Legend: Chart_ChartLegend,
+    LegendItem: Chart_ChartLegendItem
+});
+export { Chart };

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

@@ -0,0 +1 @@
+export { Chart } from './Chart.js';

package/dist/components/chart/index.js

@@ -0,0 +1 @@
+export { Chart } from "./Chart.js";

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

@@ -0,0 +1,20 @@
+import { Checkbox as CheckboxPrimitive, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext } from '@ark-ui/react/checkbox';
+import type { ComponentProps } from 'react';
+type CheckboxSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type RootProps = ComponentProps<typeof CheckboxPrimitive.Root> & {
+    size?: CheckboxSize;
+};
+type RootProviderProps = ComponentProps<typeof CheckboxPrimitive.RootProvider> & {
+    size?: CheckboxSize;
+};
+declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<RootProps, "ref"> & import("react").RefAttributes<HTMLLabelElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<RootProps, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<RootProviderProps, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+    Context: (props: CheckboxPrimitive.ContextProps) => import("react").ReactNode;
+    HiddenInput: import("react").ForwardRefExoticComponent<CheckboxPrimitive.HiddenInputProps & import("react").RefAttributes<HTMLInputElement>>;
+    Control: import("react").ForwardRefExoticComponent<Omit<CheckboxPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Indicator: import("react").ForwardRefExoticComponent<Omit<CheckboxPrimitive.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<CheckboxPrimitive.LabelProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Group: import("react").ForwardRefExoticComponent<Omit<CheckboxPrimitive.GroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+};
+export { Checkbox, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext };

package/dist/components/checkbox/Checkbox.js

@@ -0,0 +1,83 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Checkbox, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext } from "@ark-ui/react/checkbox";
+import { forwardRef } from "react";
+import { cn } from "../../internal/cn.js";
+import { CheckIcon, IndeterminateIcon } from "../../internal/icons/ui/index.js";
+const Checkbox_CheckboxRoot = /*#__PURE__*/ forwardRef(function({ className, size = 'md', ...props }, ref) {
+    return /*#__PURE__*/ jsx(Checkbox.Root, {
+        ref: ref,
+        "data-slot": "checkbox-root",
+        "data-size": size,
+        className: cn('group/checkbox inline-flex cursor-pointer items-center gap-2 align-middle text-foreground data-disabled:cursor-default data-disabled:opacity-50 data-readonly:cursor-default', className),
+        ...props
+    });
+});
+const Checkbox_CheckboxRootProvider = /*#__PURE__*/ forwardRef(function({ className, size = 'md', ...props }, ref) {
+    return /*#__PURE__*/ jsx(Checkbox.RootProvider, {
+        ref: ref,
+        "data-slot": "checkbox-root-provider",
+        "data-size": size,
+        className: cn('group/checkbox inline-flex cursor-pointer items-center gap-2 align-middle text-foreground data-disabled:cursor-default data-disabled:opacity-50 data-readonly:cursor-default', className),
+        ...props
+    });
+});
+const Checkbox_CheckboxIndicator = /*#__PURE__*/ forwardRef(function({ className, children, indeterminate, ...props }, ref) {
+    const slot = indeterminate ? 'checkbox-indicator-indeterminate-icon' : 'checkbox-indicator-checked-icon';
+    return /*#__PURE__*/ jsx(Checkbox.Indicator, {
+        ref: ref,
+        "data-slot": "checkbox-indicator",
+        className: cn('inline-flex h-full w-full items-center justify-center text-inherit', className),
+        indeterminate: indeterminate,
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx("span", {
+            "aria-hidden": "true",
+            "data-slot": slot,
+            className: cn('inline-flex size-3 items-center justify-center leading-none text-inherit group-data-[size=lg]/checkbox:size-3.5 group-data-[size=sm]/checkbox:size-2.5 group-data-[size=xl]/checkbox:size-4 group-data-[size=xs]/checkbox:size-2 [&>svg]:size-full'),
+            children: indeterminate ? /*#__PURE__*/ jsx(IndeterminateIcon, {}) : /*#__PURE__*/ jsx(CheckIcon, {})
+        })
+    });
+});
+const Checkbox_CheckboxControl = /*#__PURE__*/ forwardRef(function({ children, className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Checkbox.Control, {
+        ref: ref,
+        "data-slot": "checkbox-control",
+        className: cn("[@media(hover:hover)]:[&:not([data-disabled]):not([data-readonly])[data-state='unchecked'][data-hover]:bg-accent box-border inline-flex size-5 shrink-0 items-center justify-center rounded-xs border border-border bg-background p-0 leading-none text-primary-foreground transition-[background-color,border-color,color,opacity] duration-200 select-none group-data-[size=lg]/checkbox:size-control-xs group-data-[size=sm]/checkbox:size-4 group-data-[size=xl]/checkbox:size-7 group-data-[size=xs]/checkbox:size-3.5 data-focus-visible:outline-1 data-focus-visible:outline-offset-1 data-focus-visible:outline-ring data-invalid:border-destructive data-invalid:text-destructive-foreground data-invalid:data-focus-visible:outline-destructive data-[state=checked]:border-primary data-[state=checked]:bg-primary data-invalid:data-[state=checked]:border-destructive data-invalid:data-[state=checked]:bg-destructive data-[state=indeterminate]:border-primary data-[state=indeterminate]:bg-primary data-invalid:data-[state=indeterminate]:border-destructive data-invalid:data-[state=indeterminate]:bg-destructive motion-reduce:transition-none", className),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                /*#__PURE__*/ jsx(Checkbox_CheckboxIndicator, {}),
+                /*#__PURE__*/ jsx(Checkbox_CheckboxIndicator, {
+                    indeterminate: true
+                })
+            ]
+        })
+    });
+});
+const Checkbox_CheckboxLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Checkbox.Label, {
+        ref: ref,
+        "data-slot": "checkbox-label",
+        className: cn('text-sm leading-5 font-medium text-inherit', className),
+        ...props
+    });
+});
+const Checkbox_CheckboxGroup = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Checkbox.Group, {
+        ref: ref,
+        "data-slot": "checkbox-group",
+        className: cn('flex flex-col gap-2 text-foreground', className),
+        ...props
+    });
+});
+const Checkbox_Checkbox = Object.assign(Checkbox_CheckboxRoot, {
+    Root: Checkbox_CheckboxRoot,
+    RootProvider: Checkbox_CheckboxRootProvider,
+    Context: Checkbox.Context,
+    HiddenInput: Checkbox.HiddenInput,
+    Control: Checkbox_CheckboxControl,
+    Indicator: Checkbox_CheckboxIndicator,
+    Label: Checkbox_CheckboxLabel,
+    Group: Checkbox_CheckboxGroup
+});
+export { Checkbox_Checkbox as Checkbox, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext };

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

@@ -0,0 +1 @@
+export { Checkbox, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext, } from './Checkbox.js';

package/dist/components/checkbox/index.js

@@ -0,0 +1 @@
+export { Checkbox, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext } from "./Checkbox.js";

package/dist/components/clipboard/Clipboard.d.ts

@@ -0,0 +1,15 @@
+import { Clipboard as ClipboardPrimitive, useClipboard, useClipboardContext } from '@ark-ui/react/clipboard';
+declare const Clipboard: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Context: (props: ClipboardPrimitive.ContextProps) => import("react").ReactNode;
+    Label: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+    Control: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Input: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.InputProps & import("react").RefAttributes<HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+    Trigger: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Indicator: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    CopyText: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ValueText: import("react").ForwardRefExoticComponent<Omit<ClipboardPrimitive.ValueTextProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    useClipboard: (props?: import("@ark-ui/react/clipboard").UseClipboardProps) => import("@ark-ui/react/clipboard").UseClipboardReturn;
+};
+export { Clipboard, useClipboard, useClipboardContext };

package/dist/components/clipboard/Clipboard.js

@@ -0,0 +1,105 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { Clipboard, useClipboard, useClipboardContext } from "@ark-ui/react/clipboard";
+import { forwardRef } from "react";
+import { cn } from "../../internal/cn.js";
+import { CheckIcon, CopyIcon } from "../../internal/icons/ui/index.js";
+const Clipboard_ClipboardRoot = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.Root, {
+        ref: ref,
+        "data-slot": "clipboard-root",
+        className: cn('flex w-full flex-col gap-1.5 text-foreground', className),
+        ...props
+    });
+});
+const Clipboard_ClipboardRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.RootProvider, {
+        ref: ref,
+        "data-slot": "clipboard-root-provider",
+        className: cn('flex w-full flex-col gap-1.5 text-foreground', className),
+        ...props
+    });
+});
+const Clipboard_ClipboardLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.Label, {
+        ref: ref,
+        "data-slot": "clipboard-label",
+        className: cn('text-sm leading-5 font-medium', className),
+        ...props
+    });
+});
+const Clipboard_ClipboardControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.Control, {
+        ref: ref,
+        "data-slot": "clipboard-control",
+        className: cn('flex w-full items-center gap-2', className),
+        ...props
+    });
+});
+const Clipboard_ClipboardInput = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.Input, {
+        ref: ref,
+        "data-slot": "clipboard-input",
+        className: cn('box-border min-h-control-md w-full min-w-0 rounded-md border border-border bg-background px-3.5 py-1 text-md leading-6 text-foreground outline-1 -outline-offset-1 outline-transparent transition duration-200 ease-in-out placeholder:text-muted-foreground focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 data-disabled:pointer-events-none data-disabled:opacity-50', className),
+        ...props
+    });
+});
+const Clipboard_ClipboardTrigger = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.Trigger, {
+        ref: ref,
+        "data-slot": "clipboard-trigger",
+        className: cn('box-border inline-flex min-h-control-md shrink-0 cursor-pointer appearance-none items-center justify-center gap-2 rounded-md border border-border bg-background px-4 text-sm leading-5 font-medium whitespace-nowrap text-foreground transition duration-200 ease-in-out select-none focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ring disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 data-disabled:pointer-events-none data-disabled:cursor-default data-disabled:opacity-50 motion-reduce:transition-none [&_svg]:size-4 [&_svg]:shrink-0 [&:active:not(:disabled):not([data-disabled])]:opacity-[0.94] motion-safe:[&:active:not(:disabled):not([data-disabled])]:translate-y-px motion-safe:[&:active:not(:disabled):not([data-disabled])]:scale-[0.985] [@media(hover:hover)]:[&:not(:disabled):not([data-disabled]):hover]:bg-accent', className),
+        ...props
+    });
+});
+const Clipboard_ClipboardIndicator = /*#__PURE__*/ forwardRef(function({ className, children, copied, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.Indicator, {
+        ref: ref,
+        "data-slot": "clipboard-indicator",
+        className: cn('inline-flex shrink-0 items-center justify-center', className),
+        copied: copied ?? /*#__PURE__*/ jsx("span", {
+            "aria-hidden": "true",
+            "data-slot": "clipboard-indicator-copied-icon",
+            className: "inline-flex shrink-0 items-center justify-center",
+            children: /*#__PURE__*/ jsx(CheckIcon, {})
+        }),
+        ...props,
+        children: children ?? /*#__PURE__*/ jsx("span", {
+            "aria-hidden": "true",
+            "data-slot": "clipboard-indicator-idle-icon",
+            className: "inline-flex shrink-0 items-center justify-center",
+            children: /*#__PURE__*/ jsx(CopyIcon, {})
+        })
+    });
+});
+const Clipboard_ClipboardValueText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard.ValueText, {
+        ref: ref,
+        "data-slot": "clipboard-value-text",
+        className: cn('min-w-0 overflow-hidden text-ellipsis whitespace-nowrap', className),
+        ...props
+    });
+});
+const Clipboard_ClipboardCopyText = /*#__PURE__*/ forwardRef(function({ copied = 'Copied', children = 'Copy', ...props }, ref) {
+    return /*#__PURE__*/ jsx(Clipboard_ClipboardIndicator, {
+        ref: ref,
+        "data-slot": "clipboard-copy-text",
+        copied: copied,
+        ...props,
+        children: children
+    });
+});
+const Clipboard_Clipboard = Object.assign(Clipboard_ClipboardRoot, {
+    Root: Clipboard_ClipboardRoot,
+    RootProvider: Clipboard_ClipboardRootProvider,
+    Context: Clipboard.Context,
+    Label: Clipboard_ClipboardLabel,
+    Control: Clipboard_ClipboardControl,
+    Input: Clipboard_ClipboardInput,
+    Trigger: Clipboard_ClipboardTrigger,
+    Indicator: Clipboard_ClipboardIndicator,
+    CopyText: Clipboard_ClipboardCopyText,
+    ValueText: Clipboard_ClipboardValueText,
+    useClipboard: useClipboard
+});
+export { Clipboard_Clipboard as Clipboard, useClipboard, useClipboardContext };

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

@@ -0,0 +1 @@
+export { Clipboard, useClipboard, useClipboardContext } from './Clipboard.js';

package/dist/components/clipboard/index.js

@@ -0,0 +1 @@
+export { Clipboard, useClipboard, useClipboardContext } from "./Clipboard.js";