@a2v2ai/uikit 0.0.38 → 0.0.39

package/Alert/Alert.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+type AlertVariant = "default" | "destructive" | "success" | "warning" | "info";
+declare const alertVariants: (props?: ({
+    variant?: "default" | "destructive" | "success" | "warning" | "info" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: AlertVariant;
+}
+declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+declare const AlertTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+export { Alert, AlertTitle, AlertDescription, alertVariants };
+export type { AlertVariant };

package/Alert/Alert.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/utils";
+const alertVariants = cva("relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-current [&>svg~*]:pl-7", {
+    variants: {
+        variant: {
+            default: "bg-white text-main-950 border-grey-200",
+            destructive: "border-error-200 bg-error-50 text-error-700 [&>svg]:text-error-600",
+            success: "border-success-200 bg-success-50 text-success-700 [&>svg]:text-success-600",
+            warning: "border-warning-200 bg-warning-50 text-warning-700 [&>svg]:text-warning-600",
+            info: "border-accent-200 bg-accent-50 text-accent-700 [&>svg]:text-accent-600",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+const Alert = React.forwardRef(({ className, variant, ...props }, ref) => (_jsx("div", { ref: ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props })));
+Alert.displayName = "Alert";
+const AlertTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx("h5", { ref: ref, className: cn("mb-1 font-medium leading-none tracking-tight", className), ...props })));
+AlertTitle.displayName = "AlertTitle";
+const AlertDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props })));
+AlertDescription.displayName = "AlertDescription";
+export { Alert, AlertTitle, AlertDescription, alertVariants };

package/AlertDialog/AlertDialog.d.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
+type AlertDialogContentType = "desktop" | "mobile";
+type AlertDialogHeaderType = "header" | "close-only" | "icon-button-close";
+type AlertDialogFooterType = "buttons-right" | "full-width" | "single-full-width";
+type AlertDialogCloseButtonVariant = "default" | "icon-button";
+declare const AlertDialog: React.FC<AlertDialogPrimitive.AlertDialogProps>;
+declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogPortal: React.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
+declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const alertDialogContentVariants: (props?: ({
+    type?: "desktop" | "mobile" | null | undefined;
+    scrollable?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface AlertDialogContentProps extends React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content> {
+    type?: AlertDialogContentType;
+    scrollable?: boolean;
+    showCloseButton?: boolean;
+    closeButtonVariant?: AlertDialogCloseButtonVariant;
+    loading?: boolean;
+}
+declare const AlertDialogContent: React.ForwardRefExoticComponent<AlertDialogContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const alertDialogHeaderVariants: (props?: ({
+    type?: "header" | "close-only" | "icon-button-close" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface AlertDialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    type?: AlertDialogHeaderType;
+}
+declare const AlertDialogHeader: React.ForwardRefExoticComponent<AlertDialogHeaderProps & React.RefAttributes<HTMLDivElement>>;
+declare const alertDialogFooterVariants: (props?: ({
+    type?: "buttons-right" | "full-width" | "single-full-width" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface AlertDialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {
+    type?: AlertDialogFooterType;
+}
+declare const AlertDialogFooter: React.ForwardRefExoticComponent<AlertDialogFooterProps & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDialogBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogAction: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogCancel: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>>;
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogBody, AlertDialogAction, AlertDialogCancel, alertDialogContentVariants, alertDialogHeaderVariants, alertDialogFooterVariants, };
+export type { AlertDialogContentType, AlertDialogHeaderType, AlertDialogFooterType, AlertDialogCloseButtonVariant };

package/AlertDialog/AlertDialog.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
+import { X, Loader2 } from "lucide-react";
+import { cva } from "class-variance-authority";
+import { Button } from "../Button/Button";
+import { cn } from "../lib/utils";
+const AlertDialog = AlertDialogPrimitive.Root;
+const AlertDialogTrigger = AlertDialogPrimitive.Trigger;
+const AlertDialogPortal = AlertDialogPrimitive.Portal;
+const AlertDialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Overlay, { ref: ref, className: cn("fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props })));
+AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
+const alertDialogContentVariants = cva("fixed z-50 grid gap-4 bg-white border border-grey-200 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", {
+    variants: {
+        type: {
+            desktop: "left-[50%] top-[50%] translate-x-[-50%] translate-y-[-50%] w-full max-w-[640px] rounded-lg",
+            mobile: "left-[50%] top-[50%] translate-x-[-50%] translate-y-[-50%] w-full max-w-[320px] rounded-lg",
+        },
+        scrollable: {
+            true: "max-h-[80vh] overflow-y-auto",
+            false: "",
+        },
+    },
+    defaultVariants: {
+        type: "desktop",
+        scrollable: false,
+    },
+});
+const AlertDialogContent = React.forwardRef(({ className, children, type, scrollable, showCloseButton = true, closeButtonVariant = "default", loading = false, ...props }, ref) => (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsxs(AlertDialogPrimitive.Content, { ref: ref, className: cn(alertDialogContentVariants({ type, scrollable, className })), ...props, children: [loading && (_jsx("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-white/80 rounded-lg", children: _jsx(Loader2, { className: "size-8 text-main-600 animate-spin" }) })), children, showCloseButton && closeButtonVariant === "default" && !loading && (_jsxs(AlertDialogPrimitive.Cancel, { className: "absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:shadow-[0_0_0_3px_#d4d4d4] disabled:pointer-events-none cursor-pointer", children: [_jsx(X, { className: "size-4 text-grey-600" }), _jsx("span", { className: "sr-only", children: "Close" })] })), showCloseButton && closeButtonVariant === "icon-button" && !loading && (_jsx(AlertDialogPrimitive.Cancel, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "small", className: "absolute right-2 top-2 size-9 p-0", children: [_jsx(X, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "Close" })] }) }))] })] })));
+AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
+const alertDialogHeaderVariants = cva("flex p-4", {
+    variants: {
+        type: {
+            header: "flex-row items-center justify-between",
+            "close-only": "flex-col items-end",
+            "icon-button-close": "flex-col items-end justify-center pr-0",
+        },
+    },
+    defaultVariants: {
+        type: "header",
+    },
+});
+const AlertDialogHeader = React.forwardRef(({ className, type, ...props }, ref) => (_jsx("div", { ref: ref, className: cn(alertDialogHeaderVariants({ type, className })), ...props })));
+AlertDialogHeader.displayName = "AlertDialogHeader";
+const alertDialogFooterVariants = cva("flex gap-2 p-4", {
+    variants: {
+        type: {
+            "buttons-right": "flex-row items-center justify-end",
+            "full-width": "flex-row items-start",
+            "single-full-width": "flex-row items-start",
+        },
+    },
+    defaultVariants: {
+        type: "buttons-right",
+    },
+});
+const AlertDialogFooter = React.forwardRef(({ className, type, children, ...props }, ref) => (_jsx("div", { ref: ref, className: cn(alertDialogFooterVariants({ type, className })), ...props, children: type === "full-width" || type === "single-full-width" ? (_jsx("div", { className: "flex gap-2 w-full", children: React.Children.map(children, (child) => React.isValidElement(child)
+            ? React.cloneElement(child, {
+                className: cn("flex-1", child.props.className),
+            })
+            : child) })) : (children) })));
+AlertDialogFooter.displayName = "AlertDialogFooter";
+const AlertDialogTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Title, { ref: ref, className: cn("text-2xl font-bold leading-[1.2] tracking-tight text-main-950 font-display", className), ...props })));
+AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
+const AlertDialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Description, { ref: ref, className: cn("text-sm text-grey-600", className), ...props })));
+AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
+const AlertDialogBody = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("flex-1 px-4 py-2", className), ...props })));
+AlertDialogBody.displayName = "AlertDialogBody";
+const AlertDialogAction = AlertDialogPrimitive.Action;
+const AlertDialogCancel = AlertDialogPrimitive.Cancel;
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogBody, AlertDialogAction, AlertDialogCancel, alertDialogContentVariants, alertDialogHeaderVariants, alertDialogFooterVariants, };

package/Avatar/Avatar.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+type AvatarSize = "small" | "regular" | "large" | "xlarge";
+declare const avatarVariants: (props?: ({
+    size?: "small" | "regular" | "large" | "xlarge" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface AvatarProps extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root> {
+    size?: AvatarSize;
+}
+declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLSpanElement>>;
+declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
+declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export { Avatar, AvatarImage, AvatarFallback, avatarVariants };
+export type { AvatarSize };

package/Avatar/Avatar.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/utils";
+const avatarVariants = cva("relative flex shrink-0 overflow-hidden rounded-full", {
+    variants: {
+        size: {
+            small: "size-8",
+            regular: "size-10",
+            large: "size-12",
+            xlarge: "size-16",
+        },
+    },
+    defaultVariants: {
+        size: "regular",
+    },
+});
+const Avatar = React.forwardRef(({ className, size, ...props }, ref) => (_jsx(AvatarPrimitive.Root, { ref: ref, className: cn(avatarVariants({ size }), className), ...props })));
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+const AvatarImage = React.forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Image, { ref: ref, className: cn("aspect-square h-full w-full", className), ...props })));
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+const AvatarFallback = React.forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Fallback, { ref: ref, className: cn("flex h-full w-full items-center justify-center rounded-full bg-grey-100 text-grey-600 font-medium", className), ...props })));
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+export { Avatar, AvatarImage, AvatarFallback, avatarVariants };

package/Badge/Badge.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+type BadgeVariant = "default" | "secondary" | "outline" | "destructive" | "success" | "warning";
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "destructive" | "success" | "warning" | "secondary" | "outline" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: BadgeVariant;
+}
+declare function Badge({ className, variant, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export { Badge, badgeVariants };
+export type { BadgeVariant };

package/Badge/Badge.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/utils";
+const badgeVariants = cva("inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-accent-600 focus:ring-offset-2", {
+    variants: {
+        variant: {
+            default: "border-transparent bg-accent-600 text-white",
+            secondary: "border-transparent bg-grey-100 text-main-950",
+            outline: "border-grey-300 text-main-950",
+            destructive: "border-transparent bg-error-600 text-white",
+            success: "border-transparent bg-success-600 text-white",
+            warning: "border-transparent bg-warning-500 text-white",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function Badge({ className, variant, ...props }) {
+    return (_jsx("div", { className: cn(badgeVariants({ variant }), className), ...props }));
+}
+export { Badge, badgeVariants };

package/Breadcrumb/Breadcrumb.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+declare const Breadcrumb: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
+    separator?: React.ReactNode;
+} & React.RefAttributes<HTMLElement>>;
+declare const BreadcrumbList: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
+declare const BreadcrumbItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
+declare const BreadcrumbLink: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    asChild?: boolean;
+} & React.RefAttributes<HTMLAnchorElement>>;
+declare const BreadcrumbPage: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+declare const BreadcrumbSeparator: {
+    ({ children, className, ...props }: React.ComponentProps<"li">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const BreadcrumbEllipsis: {
+    ({ className, ...props }: React.ComponentProps<"span">): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis, };

package/Breadcrumb/Breadcrumb.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { ChevronRight, MoreHorizontal } from "lucide-react";
+import { cn } from "../lib/utils";
+const Breadcrumb = React.forwardRef(({ ...props }, ref) => _jsx("nav", { ref: ref, "aria-label": "breadcrumb", ...props }));
+Breadcrumb.displayName = "Breadcrumb";
+const BreadcrumbList = React.forwardRef(({ className, ...props }, ref) => (_jsx("ol", { ref: ref, className: cn("flex flex-wrap items-center gap-1.5 break-words text-sm text-grey-500 sm:gap-2.5", className), ...props })));
+BreadcrumbList.displayName = "BreadcrumbList";
+const BreadcrumbItem = React.forwardRef(({ className, ...props }, ref) => (_jsx("li", { ref: ref, className: cn("inline-flex items-center gap-1.5", className), ...props })));
+BreadcrumbItem.displayName = "BreadcrumbItem";
+const BreadcrumbLink = React.forwardRef(({ asChild, className, ...props }, ref) => {
+    const Comp = asChild ? Slot : "a";
+    return (_jsx(Comp, { ref: ref, className: cn("transition-colors hover:text-main-950", className), ...props }));
+});
+BreadcrumbLink.displayName = "BreadcrumbLink";
+const BreadcrumbPage = React.forwardRef(({ className, ...props }, ref) => (_jsx("span", { ref: ref, role: "link", "aria-disabled": "true", "aria-current": "page", className: cn("font-normal text-main-950", className), ...props })));
+BreadcrumbPage.displayName = "BreadcrumbPage";
+const BreadcrumbSeparator = ({ children, className, ...props }) => (_jsx("li", { role: "presentation", "aria-hidden": "true", className: cn("[&>svg]:size-3.5", className), ...props, children: children ?? _jsx(ChevronRight, {}) }));
+BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
+const BreadcrumbEllipsis = ({ className, ...props }) => (_jsxs("span", { role: "presentation", "aria-hidden": "true", className: cn("flex h-9 w-9 items-center justify-center", className), ...props, children: [_jsx(MoreHorizontal, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "More" })] }));
+BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis, };

package/Button/Button.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+type ButtonVariant = "primary" | "secondary" | "outline" | "ghost" | "ghost-muted" | "destructive";
+type ButtonSize = "mini" | "small" | "regular" | "large";
+type ButtonRoundness = "default" | "round";
+type ButtonTextVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "body3" | "caption";
+declare const buttonVariants: (props?: ({
+    variant?: "destructive" | "secondary" | "outline" | "primary" | "ghost" | "ghost-muted" | null | undefined;
+    size?: "small" | "regular" | "large" | "mini" | null | undefined;
+    roundness?: "default" | "round" | null | undefined;
+    textVariant?: "h5" | "h2" | "h3" | "caption" | "h1" | "h4" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "body3" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    roundness?: ButtonRoundness;
+    textVariant?: ButtonTextVariant;
+    asChild?: boolean;
+    leftIcon?: React.ReactNode;
+    rightIcon?: React.ReactNode;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };
+export type { ButtonVariant, ButtonSize, ButtonRoundness, ButtonTextVariant };

package/Button/Button.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/utils";
+const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap font-normal font-sans cursor-pointer transition-colors focus-visible:outline-none focus-visible:shadow-[0_0_0_3px_#d4d4d4] disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:shrink-0", {
+    variants: {
+        variant: {
+            primary: "bg-accent-600 text-white hover:bg-accent-700",
+            secondary: "bg-main-100 text-main-950 hover:bg-main-200",
+            outline: "border border-main-300 bg-transparent text-main-950 hover:bg-main-100",
+            ghost: "bg-transparent text-main-600 hover:bg-main-100 hover:text-main-950",
+            "ghost-muted": "bg-transparent text-main-400 hover:bg-main-100 hover:text-main-600",
+            destructive: "bg-error-600 text-white hover:bg-error-700",
+        },
+        size: {
+            mini: "h-6 px-3 text-xs rounded-md [&_svg]:size-3",
+            small: "h-8 px-3 text-sm rounded-md [&_svg]:size-3.5",
+            regular: "h-9 px-4 text-sm rounded-lg [&_svg]:size-4",
+            large: "h-10 px-4 text-base rounded-lg [&_svg]:size-5",
+        },
+        roundness: {
+            default: "",
+            round: "!rounded-full",
+        },
+        textVariant: {
+            h1: "text-[64px] font-extrabold",
+            h2: "text-[48px] font-bold",
+            h3: "text-[32px] font-bold",
+            h4: "text-[24px] font-bold",
+            h5: "text-[20px] font-bold",
+            h6: "text-[20px] font-semibold",
+            subtitle1: "text-[20px] font-semibold",
+            subtitle2: "text-[18px] font-semibold",
+            body1: "text-[16px] font-normal",
+            body2: "text-[14px] font-normal",
+            body3: "text-[12px] font-normal",
+            caption: "text-[12px] font-light",
+        },
+    },
+    defaultVariants: {
+        variant: "primary",
+        size: "regular",
+        roundness: "default",
+    },
+});
+const Button = React.forwardRef(({ className, variant, size, roundness, textVariant, asChild = false, leftIcon, rightIcon, children, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return (_jsxs(Comp, { className: cn(buttonVariants({ variant, size, roundness, textVariant, className })), ref: ref, ...props, children: [leftIcon && _jsx("span", { className: "shrink-0", children: leftIcon }), children, rightIcon && _jsx("span", { className: "shrink-0", children: rightIcon })] }));
+});
+Button.displayName = "Button";
+export { Button, buttonVariants };

package/Calendar/Calendar.d.ts

@@ -0,0 +1,20 @@
+import * as React from "react";
+import { DayButton, DayPicker } from "react-day-picker";
+import { Button } from "../Button/Button";
+export type CalendarProps = React.ComponentProps<typeof DayPicker> & {
+    /**
+     * Variant for navigation buttons
+     * @default "ghost"
+     */
+    buttonVariant?: React.ComponentProps<typeof Button>["variant"];
+    /**
+     * Error message to display below the calendar
+     */
+    error?: string;
+};
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, error, ...props }: CalendarProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Calendar {
+    var displayName: string;
+}
+declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): import("react/jsx-runtime").JSX.Element;
+export { Calendar, CalendarDayButton };

package/Calendar/Calendar.js

@@ -0,0 +1,78 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, } from "lucide-react";
+import { DayButton, DayPicker, getDefaultClassNames } from "react-day-picker";
+import { cn } from "../lib/utils";
+import { Button, buttonVariants } from "../Button/Button";
+import { Typography } from "../Typography/Typography";
+function Calendar({ className, classNames, showOutsideDays = true, captionLayout = "label", buttonVariant = "ghost", formatters, components, error, ...props }) {
+    const defaultClassNames = getDefaultClassNames();
+    return (_jsxs("div", { className: "flex flex-col w-fit", children: [_jsx(DayPicker, { showOutsideDays: showOutsideDays, className: cn("bg-white group/calendar p-3 rounded-lg border", error ? "border-error-500" : "border-grey-200", 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: "small" }), "size-8 aria-disabled:opacity-50 p-0 select-none", defaultClassNames.button_previous),
+                    button_next: cn(buttonVariants({ variant: buttonVariant, size: "small" }), "size-8 aria-disabled:opacity-50 p-0 select-none", defaultClassNames.button_next),
+                    month_caption: cn("flex items-center justify-center h-8 w-full px-8", defaultClassNames.month_caption),
+                    dropdowns: cn("w-full flex items-center text-sm font-medium justify-center h-8 gap-1.5", defaultClassNames.dropdowns),
+                    dropdown_root: cn("relative has-focus:border-grey-400 border border-grey-300 shadow-xs has-focus:ring-grey-300/50 has-focus:ring-[3px] rounded-md", defaultClassNames.dropdown_root),
+                    dropdown: cn("absolute bg-white inset-0 opacity-0", defaultClassNames.dropdown),
+                    caption_label: cn("select-none font-medium text-main-900", captionLayout === "label"
+                        ? "text-sm"
+                        : "rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-main-400 [&>svg]:size-3.5", defaultClassNames.caption_label),
+                    table: "w-full border-collapse",
+                    weekdays: cn("flex", defaultClassNames.weekdays),
+                    weekday: cn("text-main-500 rounded-md flex-1 font-normal text-[0.8rem] select-none w-8 h-8 flex items-center justify-center", defaultClassNames.weekday),
+                    week: cn("flex w-full mt-2", defaultClassNames.week),
+                    week_number_header: cn("select-none w-8", defaultClassNames.week_number_header),
+                    week_number: cn("text-[0.8rem] select-none text-main-400", defaultClassNames.week_number),
+                    day: cn("relative w-8 h-8 p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-md group/day select-none", props.showWeekNumber
+                        ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-md"
+                        : "[&:first-child[data-selected=true]_button]:rounded-l-md", defaultClassNames.day),
+                    range_start: cn("rounded-l-md bg-main-100", defaultClassNames.range_start),
+                    range_middle: cn("rounded-none", defaultClassNames.range_middle),
+                    range_end: cn("rounded-r-md bg-main-100", defaultClassNames.range_end),
+                    today: cn("bg-main-100 text-main-900 rounded-md data-[selected=true]:rounded-none", defaultClassNames.today),
+                    outside: cn("text-main-300 aria-selected:text-main-400", defaultClassNames.outside),
+                    disabled: cn("text-main-300 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-8 items-center justify-center text-center", children: children }) }));
+                    },
+                    ...components,
+                }, ...props }), error && (_jsx(Typography, { variant: "caption", color: "error-600", className: "mt-1", children: error }))] }));
+}
+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: "small", "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("size-8 p-0 font-normal", "data-[selected-single=true]:bg-main-900 data-[selected-single=true]:text-white", "data-[range-middle=true]:bg-main-100 data-[range-middle=true]:text-main-900", "data-[range-start=true]:bg-main-900 data-[range-start=true]:text-white", "data-[range-end=true]:bg-main-900 data-[range-end=true]:text-white", "group-data-[focused=true]/day:border-grey-400 group-data-[focused=true]/day:ring-grey-300/50", "hover:bg-main-100 hover:text-main-900", "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", defaultClassNames.day, className), ...props }));
+}
+Calendar.displayName = "Calendar";
+export { Calendar, CalendarDayButton };

package/Card/Card.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+type CardVariant = "default" | "outline";
+declare const cardVariants: (props?: ({
+    variant?: "default" | "outline" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: CardVariant;
+}
+declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
+declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardDescription: 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, CardHeader, CardFooter, CardTitle, CardDescription, CardContent, cardVariants };
+export type { CardVariant };

package/Card/Card.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../lib/utils";
+const cardVariants = cva("rounded-xl border bg-white text-main-950 shadow-sm", {
+    variants: {
+        variant: {
+            default: "border-grey-200",
+            outline: "border-grey-300 shadow-none",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+const Card = React.forwardRef(({ className, variant, ...props }, ref) => (_jsx("div", { ref: ref, className: cn(cardVariants({ variant }), className), ...props })));
+Card.displayName = "Card";
+const CardHeader = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("flex flex-col space-y-1.5 p-6", className), ...props })));
+CardHeader.displayName = "CardHeader";
+const CardTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("font-semibold leading-none tracking-tight", className), ...props })));
+CardTitle.displayName = "CardTitle";
+const CardDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn("text-sm text-grey-500", className), ...props })));
+CardDescription.displayName = "CardDescription";
+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, CardHeader, CardFooter, CardTitle, CardDescription, CardContent, cardVariants };

package/Carousel/Carousel.d.ts

@@ -0,0 +1,37 @@
+import * as React from "react";
+import useEmblaCarousel, { type UseEmblaCarouselType } from "embla-carousel-react";
+type CarouselApi = UseEmblaCarouselType[1];
+type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
+type CarouselOptions = UseCarouselParameters[0];
+type CarouselPlugin = UseCarouselParameters[1];
+type CarouselOrientation = "horizontal" | "vertical";
+type CarouselContextProps = {
+    carouselRef: ReturnType<typeof useEmblaCarousel>[0];
+    api: ReturnType<typeof useEmblaCarousel>[1];
+    scrollPrev: () => void;
+    scrollNext: () => void;
+    canScrollPrev: boolean;
+    canScrollNext: boolean;
+} & CarouselProps;
+declare function useCarousel(): CarouselContextProps;
+declare const carouselVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const carouselContentVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const carouselItemVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface CarouselProps {
+    opts?: CarouselOptions;
+    plugins?: CarouselPlugin;
+    orientation?: CarouselOrientation;
+    setApi?: (api: CarouselApi) => void;
+}
+declare const Carousel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & CarouselProps & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselItem: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CarouselPrevious: React.ForwardRefExoticComponent<Omit<import("..").ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const CarouselNext: React.ForwardRefExoticComponent<Omit<import("..").ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, carouselVariants, carouselContentVariants, carouselItemVariants, useCarousel, type CarouselApi, type CarouselProps, type CarouselOptions, type CarouselPlugin, type CarouselOrientation, };