@elizaos/ui 2.0.0-beta.2 → 2.0.3-beta.2

package/components/ui/button.js

@@ -3,27 +3,26 @@ import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
 import * as React from "react";
 import { cn } from "../../lib/utils.js";
-const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-bg transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", {
+const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-sm text-sm font-medium ring-offset-bg transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", {
     variants: {
         variant: {
-            default: 
-            // Solid accent surfaces use text-accent-fg; translucent accent buttons
-            // switch to text-accent in dark mode to preserve contrast.
-            "border border-accent/45 bg-accent/18 text-accent-fg dark:text-accent shadow-sm hover:border-accent/70 hover:bg-accent/28",
-            surface: "border border-border/32 bg-[linear-gradient(180deg,color-mix(in_srgb,var(--card)_84%,transparent),color-mix(in_srgb,var(--bg)_95%,transparent))] text-muted-strong shadow-[inset_0_1px_0_rgba(255,255,255,0.14),0_14px_20px_-18px_rgba(15,23,42,0.14)] backdrop-blur-md transition-[border-color,background-color,color,transform,box-shadow] duration-200 hover:border-border/46 hover:bg-[linear-gradient(180deg,color-mix(in_srgb,var(--card)_90%,transparent),color-mix(in_srgb,var(--bg)_97%,transparent))] hover:text-txt hover:shadow-[inset_0_1px_0_rgba(255,255,255,0.16),0_16px_22px_-18px_rgba(15,23,42,0.16)] active:scale-95 disabled:hover:border-border/32 disabled:hover:bg-[linear-gradient(180deg,color-mix(in_srgb,var(--card)_84%,transparent),color-mix(in_srgb,var(--bg)_95%,transparent))] disabled:hover:text-muted-strong dark:shadow-[inset_0_1px_0_rgba(255,255,255,0.04),0_16px_24px_-20px_rgba(0,0,0,0.24)]",
-            surfaceAccent: "border border-accent/26 bg-[linear-gradient(180deg,rgba(var(--accent-rgb),0.16),rgba(var(--accent-rgb),0.07))] text-txt-strong shadow-[inset_0_1px_0_rgba(255,255,255,0.16),0_14px_22px_-18px_rgba(var(--accent-rgb),0.24)] ring-1 ring-inset ring-accent/10 hover:border-accent/42 hover:bg-[linear-gradient(180deg,rgba(var(--accent-rgb),0.2),rgba(var(--accent-rgb),0.1))] hover:text-txt-strong",
-            surfaceDestructive: "border border-danger/30 bg-[linear-gradient(180deg,rgba(239,68,68,0.12),rgba(239,68,68,0.06))] text-danger shadow-[inset_0_1px_0_rgba(255,255,255,0.12),0_14px_20px_-18px_rgba(127,29,29,0.18)] hover:border-danger/44 hover:bg-[linear-gradient(180deg,rgba(239,68,68,0.16),rgba(239,68,68,0.08))] hover:text-danger",
-            destructive: "border border-destructive/45 bg-destructive/92 text-destructive-fg shadow-sm hover:border-destructive/75 hover:bg-destructive",
-            outline: "border border-border bg-card/92 text-txt shadow-sm hover:border-border-strong hover:bg-bg-hover",
-            secondary: "border border-border bg-bg-accent text-txt shadow-sm hover:border-border-strong hover:bg-bg-hover",
-            ghost: "text-muted-strong hover:bg-bg-accent hover:text-txt",
+            default: "bg-accent text-accent-fg hover:bg-accent-hover",
+            surface: "bg-card text-muted-strong hover:bg-surface",
+            surfaceAccent: "bg-accent-subtle text-txt-strong hover:bg-accent-subtle/70",
+            surfaceDestructive: "bg-destructive-subtle text-danger hover:bg-destructive-subtle/70",
+            destructive: "bg-destructive text-destructive-fg hover:bg-destructive/85",
+            outline: "bg-card text-txt hover:bg-surface",
+            secondary: "bg-bg-accent text-txt hover:bg-surface",
+            ghost: "text-muted-strong hover:bg-surface hover:text-txt",
             link: "text-primary underline-offset-4 hover:underline",
         },
         size: {
             default: "h-10 px-4 py-2",
-            sm: "h-9 rounded-md px-3 py-1.5",
-            lg: "h-11 rounded-md px-8 py-2.5",
+            sm: "h-9 rounded-sm px-3 py-1.5",
+            lg: "h-11 rounded-sm px-8 py-2.5",
             icon: "h-10 w-10",
+            "icon-sm": "h-8 w-8",
+            "icon-lg": "h-11 w-11",
         },
     },
     defaultVariants: {
@@ -31,9 +30,14 @@ const buttonVariants = cva("inline-flex items-center justify-center gap-2 whites
         size: "default",
     },
 });
-const Button = React.forwardRef(({ className, variant, size, asChild = false, style, ...props }, ref) => {
+const Button = React.forwardRef(({ className, variant, size, asChild = false, style, type, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
-    return (_jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref: ref, style: style, ...props }));
+    // Default to type="button" so a Button inside or near a <form> doesn't
+    // accidentally submit on Enter. Callers that genuinely want submit behaviour
+    // must opt in with type="submit". Native <button> defaults to "submit",
+    // which is almost never what we want in this app.
+    const resolvedType = asChild ? type : (type ?? "button");
+    return (_jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref: ref, style: style, type: resolvedType, ...props }));
 });
 Button.displayName = "Button";
 export { Button, buttonVariants };

package/components/ui/calendar.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { type DayButton, DayPicker } from "react-day-picker";
+import { Button } from "./button";
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
+    buttonVariant?: React.ComponentProps<typeof Button>["variant"];
+}): import("react/jsx-runtime").JSX.Element;
+declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): import("react/jsx-runtime").JSX.Element;
+export { Calendar, CalendarDayButton };
+//# sourceMappingURL=calendar.d.ts.map

package/components/ui/calendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/calendar.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,KAAK,SAAS,EACd,SAAS,EAEV,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAkB,MAAM,UAAU,CAAC;AAElD,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,UAAU,EACV,eAAsB,EACtB,aAAuB,EACvB,aAAuB,EACvB,UAAU,EACV,UAAU,EACV,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IAC1C,aAAa,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC,SAAS,CAAC,CAAC;CAChE,2CAoJA;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,2CA+BxC;AAED,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,CAAC"}

package/components/ui/calendar.js

@@ -0,0 +1,78 @@
+/**
+ * Calendar component for date selection built on react-day-picker.
+ * Supports single and range selection with customizable styling and formatters.
+ */
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, } from "lucide-react";
+import * as React from "react";
+import { DayPicker, getDefaultClassNames, } from "react-day-picker";
+import { cn } from "../../lib/utils.js";
+import { Button, buttonVariants } from "./button.js";
+function Calendar({ className, classNames, showOutsideDays = true, captionLayout = "label", buttonVariant = "ghost", formatters, components, ...props }) {
+    const defaultClassNames = getDefaultClassNames();
+    return (_jsx(DayPicker, { 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: {
+            formatMonthDropdown: (date) => date.toLocaleString("default", { month: "short" }),
+            ...formatters,
+        }, classNames: {
+            root: cn("w-fit", defaultClassNames.root),
+            months: cn("flex gap-4 flex-col md:flex-row relative", defaultClassNames.months),
+            month: cn("flex flex-col w-full gap-4", defaultClassNames.month),
+            nav: cn("flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between", defaultClassNames.nav),
+            button_previous: cn(buttonVariants({ variant: buttonVariant }), "size-(--cell-size) aria-disabled:opacity-50 p-0 select-none", defaultClassNames.button_previous),
+            button_next: cn(buttonVariants({ variant: buttonVariant }), "size-(--cell-size) aria-disabled:opacity-50 p-0 select-none", defaultClassNames.button_next),
+            month_caption: cn("flex items-center justify-center h-(--cell-size) w-full px-(--cell-size)", defaultClassNames.month_caption),
+            dropdowns: cn("w-full flex items-center text-sm font-medium justify-center h-(--cell-size) gap-1.5", defaultClassNames.dropdowns),
+            dropdown_root: cn("relative has-focus:border-ring border border-input has-focus:ring-ring/50 has-focus:ring-[3px] rounded-sm", defaultClassNames.dropdown_root),
+            dropdown: cn("absolute bg-popover inset-0 opacity-0", defaultClassNames.dropdown),
+            caption_label: cn("select-none font-medium", captionLayout === "label"
+                ? "text-sm"
+                : "rounded-sm pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5", defaultClassNames.caption_label),
+            month_grid: "w-full border-collapse",
+            weekdays: cn("flex", defaultClassNames.weekdays),
+            weekday: cn("text-muted-foreground rounded-sm flex-1 font-normal text-[0.8rem] select-none", defaultClassNames.weekday),
+            week: cn("flex w-full mt-2", defaultClassNames.week),
+            week_number_header: cn("select-none w-(--cell-size)", defaultClassNames.week_number_header),
+            week_number: cn("text-[0.8rem] select-none text-muted-foreground", defaultClassNames.week_number),
+            day: cn("relative w-full h-full p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none", defaultClassNames.day),
+            range_start: cn("rounded-l-md bg-accent", defaultClassNames.range_start),
+            range_middle: cn("rounded-none", defaultClassNames.range_middle),
+            range_end: cn("rounded-r-md bg-accent", defaultClassNames.range_end),
+            today: cn("bg-accent text-accent-foreground rounded-sm 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: {
+            Root: ({ className, rootRef, ...props }) => {
+                return (_jsx("div", { "data-slot": "calendar", ref: rootRef, className: cn(className), ...props }));
+            },
+            Chevron: ({ className, orientation, ...props }) => {
+                if (orientation === "left") {
+                    return (_jsx(ChevronLeftIcon, { className: cn("size-4", className), ...props }));
+                }
+                if (orientation === "right") {
+                    return (_jsx(ChevronRightIcon, { className: cn("size-4", className), ...props }));
+                }
+                return (_jsx(ChevronDownIcon, { className: cn("size-4", className), ...props }));
+            },
+            DayButton: CalendarDayButton,
+            WeekNumber: ({ children, ...props }) => {
+                return (_jsx("td", { ...props, children: _jsx("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children: children }) }));
+            },
+            ...components,
+        }, ...props }));
+}
+function CalendarDayButton({ className, day, modifiers, ...props }) {
+    const defaultClassNames = getDefaultClassNames();
+    const ref = React.useRef(null);
+    React.useEffect(() => {
+        if (modifiers.focused)
+            ref.current?.focus();
+    }, [modifiers.focused]);
+    return (_jsx(Button, { 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-sm data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-sm data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70", defaultClassNames.day, className), ...props }));
+}
+export { Calendar, CalendarDayButton };

package/components/ui/card.d.ts

@@ -1,7 +1,7 @@
 import { type VariantProps } from "class-variance-authority";
 import * as React from "react";
 declare const cardVariants: (props?: ({
-    variant?: "flat" | "default" | "status" | "setting" | "interactive" | null | undefined;
+    variant?: "flat" | "default" | "status" | "interactive" | "setting" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface CardProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
 }
@@ -9,7 +9,8 @@ declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttribu
 declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const CardAction: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, cardVariants, };
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, cardVariants, };
 //# sourceMappingURL=card.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,YAAY;;8EAkBjB,CAAC;AAEF,MAAM,WAAW,SACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,YAAY,CAAC;CAAG;AAExC,QAAA,MAAM,IAAI,kFAQT,CAAC;AAGF,QAAA,MAAM,UAAU,6GASd,CAAC;AAGH,QAAA,MAAM,SAAS,uHASb,CAAC;AAGH,QAAA,MAAM,eAAe,yHAKnB,CAAC;AAGH,QAAA,MAAM,WAAW,6GAKf,CAAC;AAGH,QAAA,MAAM,UAAU,6GASd,CAAC;AAGH,OAAO,EACL,IAAI,EACJ,WAAW,EACX,eAAe,EACf,UAAU,EACV,UAAU,EACV,SAAS,EACT,YAAY,GACb,CAAC"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,YAAY;;8EAahB,CAAC;AAEH,MAAM,WAAW,SACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,YAAY,CAAC;CAAG;AAExC,QAAA,MAAM,IAAI,kFAQT,CAAC;AAGF,QAAA,MAAM,UAAU,6GASd,CAAC;AAGH,QAAA,MAAM,SAAS,uHASb,CAAC;AAGH,QAAA,MAAM,eAAe,yHAKnB,CAAC;AAGH,QAAA,MAAM,UAAU,6GAad,CAAC;AAGH,QAAA,MAAM,WAAW,6GAKf,CAAC;AAGH,QAAA,MAAM,UAAU,6GASd,CAAC;AAGH,OAAO,EACL,IAAI,EACJ,UAAU,EACV,WAAW,EACX,eAAe,EACf,UAAU,EACV,UAAU,EACV,SAAS,EACT,YAAY,GACb,CAAC"}

package/components/ui/card.js

@@ -2,13 +2,13 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import * as React from "react";
 import { cn } from "../../lib/utils.js";
-const cardVariants = cva("rounded-xl border border-border bg-card text-card-fg", {
+const cardVariants = cva("rounded-sm bg-card/70 text-card-fg", {
     variants: {
         variant: {
-            default: "shadow-[0_10px_28px_rgba(15,23,42,0.08)] dark:shadow-[0_16px_40px_rgba(0,0,0,0.28)]",
-            interactive: "shadow-[0_10px_28px_rgba(15,23,42,0.08)] dark:shadow-[0_16px_40px_rgba(0,0,0,0.28)] transition-[border-color,box-shadow] hover:border-border-strong hover:shadow-md cursor-pointer",
-            status: "shadow-sm",
-            setting: "shadow-sm p-0",
+            default: "",
+            interactive: "transition-colors hover:bg-card cursor-pointer",
+            status: "",
+            setting: "p-0",
             flat: "",
         },
     },
@@ -24,8 +24,10 @@ const CardTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx("h3",
 CardTitle.displayName = "CardTitle";
 const CardDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx("p", { ref: ref, className: cn("text-sm text-muted", className), ...props })));
 CardDescription.displayName = "CardDescription";
+const CardAction = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, "data-slot": "card-action", className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className), ...props })));
+CardAction.displayName = "CardAction";
 const CardContent = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("p-6 pt-0", className), ...props })));
 CardContent.displayName = "CardContent";
 const CardFooter = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("flex items-center p-6 pt-0", className), ...props })));
 CardFooter.displayName = "CardFooter";
-export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, cardVariants, };
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, cardVariants, };

package/components/ui/carousel.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Carousel component using Embla Carousel for slide-based content display.
+ * Supports horizontal and vertical orientations with navigation controls.
+ */
+import useEmblaCarousel, { type UseEmblaCarouselType } from "embla-carousel-react";
+import * as React from "react";
+import { Button } from "./button";
+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): import("react/jsx-runtime").JSX.Element;
+declare function CarouselContent({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CarouselItem({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): import("react/jsx-runtime").JSX.Element;
+declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): import("react/jsx-runtime").JSX.Element;
+export { Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, };
+//# sourceMappingURL=carousel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/carousel.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,gBAAgB,EAAE,EACvB,KAAK,oBAAoB,EAC1B,MAAM,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,KAAK,WAAW,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAC;AAC3C,KAAK,qBAAqB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AACjE,KAAK,eAAe,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAC;AAChD,KAAK,cAAc,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAC;AAE/C,KAAK,aAAa,GAAG;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAC;CACrC,CAAC;AAuBF,iBAAS,QAAQ,CAAC,EAChB,WAA0B,EAC1B,IAAI,EACJ,MAAM,EACN,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,aAAa,2CA6F7C;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAmB5E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAiBzE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,OAAmB,EACnB,IAAa,EACb,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,2CAuBrC;AAED,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,OAAmB,EACnB,IAAa,EACb,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,2CAuBrC;AAED,OAAO,EACL,QAAQ,EACR,KAAK,WAAW,EAChB,eAAe,EACf,YAAY,EACZ,YAAY,EACZ,gBAAgB,GACjB,CAAC"}

package/components/ui/carousel.js

@@ -0,0 +1,106 @@
+/**
+ * Carousel component using Embla Carousel for slide-based content display.
+ * Supports horizontal and vertical orientations with navigation controls.
+ */
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import useEmblaCarousel from "embla-carousel-react";
+import { ArrowLeft, ArrowRight } from "lucide-react";
+import * as React from "react";
+import { cn } from "../../lib/utils.js";
+import { Button } from "./button.js";
+const CarouselContext = 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({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }) {
+    const [carouselRef, api] = useEmblaCarousel({
+        ...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?.scrollPrev();
+    }, [api]);
+    const scrollNext = React.useCallback(() => {
+        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.off("reInit", onSelect);
+            api.off("select", onSelect);
+        };
+    }, [api, onSelect]);
+    const contextValue = React.useMemo(() => ({
+        carouselRef,
+        api: api,
+        opts,
+        orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
+        scrollPrev,
+        scrollNext,
+        canScrollPrev,
+        canScrollNext,
+    }), [
+        carouselRef,
+        api,
+        opts,
+        orientation,
+        scrollPrev,
+        scrollNext,
+        canScrollPrev,
+        canScrollNext,
+    ]);
+    return (_jsx(CarouselContext.Provider, { value: contextValue, children: _jsx("section", { onKeyDownCapture: handleKeyDown, className: cn("relative", className), role: "region", "aria-roledescription": "carousel", "data-slot": "carousel", ...props, children: children }) }));
+}
+function CarouselContent({ className, ...props }) {
+    const { carouselRef, orientation } = useCarousel();
+    return (_jsx("div", { ref: carouselRef, className: "overflow-hidden", "data-slot": "carousel-content", children: _jsx("div", { className: cn("flex", orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col", className), ...props }) }));
+}
+function CarouselItem({ className, ...props }) {
+    const { orientation } = useCarousel();
+    return (_jsx("div", { 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({ className, variant = "outline", size = "icon", ...props }) {
+    const { orientation, scrollPrev, canScrollPrev } = useCarousel();
+    return (_jsxs(Button, { "data-slot": "carousel-previous", variant: variant, size: size, className: cn("absolute size-8 rounded-sm", 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, children: [_jsx(ArrowLeft, {}), _jsx("span", { className: "sr-only", children: "Previous slide" })] }));
+}
+function CarouselNext({ className, variant = "outline", size = "icon", ...props }) {
+    const { orientation, scrollNext, canScrollNext } = useCarousel();
+    return (_jsxs(Button, { "data-slot": "carousel-next", variant: variant, size: size, className: cn("absolute size-8 rounded-sm", 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, children: [_jsx(ArrowRight, {}), _jsx("span", { className: "sr-only", children: "Next slide" })] }));
+}
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, };

package/components/ui/chart.d.ts

@@ -0,0 +1,74 @@
+/**
+ * Chart components wrapping Recharts with theme support.
+ * Provides chart container, legend, tooltip, and axis components with light/dark theme support.
+ */
+import * as React from "react";
+import * as RechartsPrimitive from "recharts";
+declare const THEMES: {
+    readonly light: "";
+    readonly dark: ".dark";
+};
+export 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"];
+}): import("react/jsx-runtime").JSX.Element;
+declare const ChartStyle: ({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}) => import("react/jsx-runtime").JSX.Element | null;
+declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+type PayloadItem = {
+    type?: string;
+    name?: string;
+    dataKey?: string;
+    value?: number | string;
+    color?: string;
+    fill?: string;
+    payload?: Record<string, unknown>;
+    [key: string]: unknown;
+};
+type ChartTooltipContentProps = {
+    active?: boolean;
+    payload?: PayloadItem[];
+    label?: string | number;
+    className?: string;
+    indicator?: "line" | "dot" | "dashed";
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    labelFormatter?: (value: React.ReactNode, payload: PayloadItem[]) => React.ReactNode;
+    labelClassName?: string;
+    formatter?: (value: number | string, name: string, item: PayloadItem, index: number) => React.ReactNode;
+    color?: string;
+    nameKey?: string;
+    labelKey?: string;
+};
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: ChartTooltipContentProps): import("react/jsx-runtime").JSX.Element | null;
+declare const ChartLegend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
+type LegendPayloadItem = {
+    value?: string;
+    type?: string;
+    dataKey?: string;
+    color?: string;
+    [key: string]: unknown;
+};
+type ChartLegendContentProps = React.ComponentProps<"div"> & {
+    payload?: LegendPayloadItem[];
+    verticalAlign?: "top" | "bottom";
+    hideIcon?: boolean;
+    nameKey?: string;
+};
+declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: ChartLegendContentProps): import("react/jsx-runtime").JSX.Element | null;
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, };
+//# sourceMappingURL=chart.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/chart.tsx"],"names":[],"mappings":"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"}

package/components/ui/chart.js

@@ -0,0 +1,139 @@
+/**
+ * Chart components wrapping Recharts with theme support.
+ * Provides chart container, legend, tooltip, and axis components with light/dark theme support.
+ */
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+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 = 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({ id, className, children, config, ...props }) {
+    const uniqueId = React.useId();
+    const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+    const contextValue = React.useMemo(() => ({ config }), [config]);
+    return (_jsx(ChartContext.Provider, { value: contextValue, children: _jsxs("div", { "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, children: [_jsx(ChartStyle, { id: chartId, config: config }), _jsx(RechartsPrimitive.ResponsiveContainer, { children: children })] }) }));
+}
+const ChartStyle = ({ id, config }) => {
+    const colorConfig = Object.entries(config).filter(([, config]) => config.theme || config.color);
+    if (!colorConfig.length) {
+        return null;
+    }
+    return (_jsx("style", { 
+        // biome-ignore lint/security/noDangerouslySetInnerHtml: Chart CSS is generated from chart config for scoped CSS variables.
+        dangerouslySetInnerHTML: {
+            __html: Object.entries(THEMES)
+                .map(([theme, prefix]) => `
+${prefix} [data-chart=${id}] {
+${colorConfig
+                .map(([key, itemConfig]) => {
+                const color = itemConfig.theme?.[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(() => {
+        if (hideLabel || !payload?.length) {
+            return null;
+        }
+        const [item] = payload;
+        const key = `${labelKey || item?.dataKey || item?.name || "value"}`;
+        const itemConfig = getPayloadConfigFromPayload(config, item, key);
+        const value = !labelKey && typeof label === "string"
+            ? config[label]?.label || label
+            : itemConfig?.label;
+        if (labelFormatter) {
+            return (_jsx("div", { className: cn("font-medium", labelClassName), children: labelFormatter(value, payload) }));
+        }
+        if (!value) {
+            return null;
+        }
+        return _jsx("div", { className: cn("font-medium", labelClassName), children: value });
+    }, [
+        label,
+        labelFormatter,
+        payload,
+        hideLabel,
+        labelClassName,
+        config,
+        labelKey,
+    ]);
+    if (!active || !payload?.length) {
+        return null;
+    }
+    const nestLabel = payload.length === 1 && indicator !== "dot";
+    return (_jsxs("div", { className: cn("border-border bg-background grid min-w-[8rem] items-start gap-1.5 rounded-sm border px-2.5 py-1.5 text-xs ", className), children: [!nestLabel ? tooltipLabel : null, _jsx("div", { className: "grid gap-1.5", children: payload
+                    .filter((item) => item.type !== "none")
+                    .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 (_jsx("div", { 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"), children: formatter && item?.value !== undefined && item.name ? (formatter(item.value, item.name, item, index)) : (_jsxs(_Fragment, { children: [itemConfig?.icon ? (_jsx(itemConfig.icon, {})) : (!hideIndicator && (_jsx("div", { className: cn("shrink-0 rounded-sm 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,
+                                    } }))), _jsxs("div", { className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"), children: [_jsxs("div", { className: "grid gap-1.5", children: [nestLabel ? tooltipLabel : null, _jsx("span", { className: "text-muted-foreground", children: itemConfig?.label || item.name })] }), item.value && (_jsx("span", { className: "text-foreground font-mono font-medium tabular-nums", children: item.value.toLocaleString() }))] })] })) }, item.dataKey));
+                }) })] }));
+}
+const ChartLegend = RechartsPrimitive.Legend;
+function ChartLegendContent({ className, hideIcon = false, payload, verticalAlign = "bottom", nameKey, }) {
+    const { config } = useChart();
+    if (!payload?.length) {
+        return null;
+    }
+    return (_jsx("div", { className: cn("flex items-center justify-center gap-4", verticalAlign === "top" ? "pb-3" : "pt-3", className), children: payload
+            .filter((item) => item.type !== "none")
+            .map((item) => {
+            const key = `${nameKey || item.dataKey || "value"}`;
+            const itemConfig = getPayloadConfigFromPayload(config, item, key);
+            return (_jsxs("div", { className: cn("[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"), children: [itemConfig?.icon && !hideIcon ? (_jsx(itemConfig.icon, {})) : (_jsx("div", { className: "h-2 w-2 shrink-0 rounded-sm", style: {
+                            backgroundColor: item.color,
+                        } })), itemConfig?.label] }, item.value));
+        }) }));
+}
+// 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/components/ui/code-block.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+export interface CodeBlockProps extends Omit<React.HTMLAttributes<HTMLElement>, "children"> {
+    /** Text content to render (and copy). */
+    value?: string;
+    children?: React.ReactNode;
+    /** Block (default) renders a <pre>; inline renders a <code> span. */
+    variant?: "block" | "inline";
+    /** Wrap long lines instead of scrolling horizontally (block only). */
+    wrap?: boolean;
+    /** Show a top-right copy button. Requires a string value to copy. */
+    copyable?: boolean;
+}
+export declare const CodeBlock: React.ForwardRefExoticComponent<CodeBlockProps & React.RefAttributes<HTMLElement>>;
+//# sourceMappingURL=code-block.d.ts.map

package/components/ui/code-block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-block.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/code-block.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC3D,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,qEAAqE;IACrE,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC7B,sEAAsE;IACtE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAcD,eAAO,MAAM,SAAS,oFAoDrB,CAAC"}

package/components/ui/code-block.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../lib/utils.js";
+import { CopyButton } from "./copy-button.js";
+const baseClassName = "font-mono text-xs leading-6 rounded-sm border border-border/35 bg-bg/35";
+function resolveCopyValue(value, children) {
+    if (typeof value === "string")
+        return value;
+    if (typeof children === "string")
+        return children;
+    return null;
+}
+export const CodeBlock = React.forwardRef(function CodeBlock({ value, children, variant = "block", wrap = false, copyable = false, className, ...props }, ref) {
+    const content = children ?? value ?? "";
+    const copyValue = copyable ? resolveCopyValue(value, children) : null;
+    if (variant === "inline") {
+        return (_jsx("code", { ref: ref, className: cn(baseClassName, "px-1.5 py-0.5", className), ...props, children: content }));
+    }
+    return (_jsxs("div", { className: "relative", children: [_jsx("pre", { ref: ref, className: cn(baseClassName, "m-0 overflow-auto p-3 text-txt", wrap ? "whitespace-pre-wrap break-all" : "whitespace-pre", copyValue !== null ? "pr-10" : undefined, className), ...props, children: content }), copyValue !== null ? (_jsx(CopyButton, { value: copyValue, className: "absolute right-1.5 top-1.5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/35" })) : null] }));
+});
+CodeBlock.displayName = "CodeBlock";

package/components/ui/collapsible.d.ts

@@ -0,0 +1,6 @@
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+declare function Collapsible({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): import("react/jsx-runtime").JSX.Element;
+declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): import("react/jsx-runtime").JSX.Element;
+export { Collapsible, CollapsibleContent, CollapsibleTrigger };
+//# sourceMappingURL=collapsible.d.ts.map