linkedunion-design-kit 1.9.2 → 1.9.3

package/dist/src/components/Tabs/Tabs.stories.jsx

@@ -0,0 +1,29 @@
+import React from "react";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "./tabs";
+export default {
+    title: "Components/Tabs",
+    component: Tabs,
+    tags: ["autodocs"],
+};
+var Template = function (args) {
+    return <>{args.children}</>;
+};
+export var _Tabs = Template.bind({});
+_Tabs.args = {
+    children: (<Tabs defaultValue="account">
+      <TabsList>
+        <TabsTrigger value="account">Account</TabsTrigger>
+        <TabsTrigger value="password">Password</TabsTrigger>
+      </TabsList>
+      <TabsContent value="account">Account Settings</TabsContent>
+      <TabsContent value="password">Change Password</TabsContent>
+    </Tabs>),
+};
+_Tabs.argTypes = {
+    children: {
+        description: "Pass `TabList` components as children. Each item includes an `TabsTrigger` (the clickable label) and `TabsContent`. You can customize both with any valid React nodes \n\nFor more details and usage examples, refer to the [ShadCN Tabs documentation](https://ui.shadcn.com/docs/components/tabs).",
+        table: {
+            type: { summary: "React.ReactNode" },
+        },
+    },
+};

package/dist/src/components/Tabs/tabs.jsx

@@ -0,0 +1,32 @@
+"use client";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import { cn } from "../../lib/utils";
+function Tabs(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<TabsPrimitive.Root data-slot="tabs" className={cn("flex flex-col gap-6", className)} {...props}/>);
+}
+function TabsList(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<TabsPrimitive.List data-slot="tabs-list" className={cn("bg-blue-100 !p-1 rounded-lg", className)} {...props}/>);
+}
+function TabsTrigger(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<TabsPrimitive.Trigger data-slot="tabs-trigger" className={cn("!py-2 !px-3 transition-all !rounded-sm !text-sm !font-normal !leading-5 w-1/2 max-sm:w-full", "data-[state=active]:bg-blue-600 data-[state=active]:text-blue-50", "data-[state=inactive]:bg-blue-100 data-[state=inactive]:text-blue-600", className)} {...props}/>);
+}
+function TabsContent(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<TabsPrimitive.Content data-slot="tabs-content" className={cn("flex-1 outline-none", className)} {...props}/>);
+}
+export { Tabs, TabsList, TabsTrigger, TabsContent };

package/dist/src/components/Title/Title.jsx

@@ -0,0 +1,8 @@
+import React from "react";
+import { Dummy_Title } from "../../utils/constants";
+import TitleStyles from "./Title.module.css";
+var Title = function (_a) {
+    var _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.children, children = _c === void 0 ? Dummy_Title : _c;
+    return (<h2 className={"".concat(TitleStyles["main-title"], " ").concat(className)}>{children}</h2>);
+};
+export default Title;

package/dist/src/components/Title/Title.stories.jsx

@@ -0,0 +1,37 @@
+import { Dummy_Title } from "../../utils/constants";
+import Title from "./Title";
+export default {
+    title: "Components/Title",
+    component: Title,
+    parameters: {
+        docs: {
+            description: {
+                component: "A configurable body text component with design system-approved styling variants",
+            },
+        },
+    },
+    argTypes: {
+        className: {
+            description: "Additional CSS classes",
+            control: "text",
+            table: {
+                type: { summary: "string" },
+                defaultValue: { summary: "" },
+            },
+        },
+        children: {
+            description: "Text to be displayed",
+            control: "text",
+            table: {
+                type: { summary: "string" },
+                defaultValue: { summary: "Title" },
+            },
+        },
+    },
+};
+var Template = function (args) { return <Title {...args}/>; };
+export var _Title = Template.bind({});
+_Title.args = {
+    children: Dummy_Title,
+    className: "",
+};

package/dist/src/components/Title/Title.test.jsx

@@ -0,0 +1,24 @@
+import { render, screen } from "@testing-library/react";
+import { Dummy_Title } from "../../utils/constants";
+import Title from "./Title";
+describe("Title Component", function () {
+    it("renders with default props", function () {
+        render(<Title />);
+        expect(screen.getByText(Dummy_Title)).toBeInTheDocument();
+    });
+    it("renders with custom children", function () {
+        var customText = "Custom Title";
+        render(<Title>{customText}</Title>);
+        expect(screen.getByText(customText)).toBeInTheDocument();
+    });
+    it("applies custom className", function () {
+        var customClass = "custom-class";
+        render(<Title className={customClass}/>);
+        var titleElement = screen.getByText(Dummy_Title);
+        expect(titleElement).toHaveClass("main-title custom-class");
+    });
+    it("renders without crashing", function () {
+        var container = render(<Title />).container;
+        expect(container).toBeDefined();
+    });
+});

package/dist/src/components/ToolTip/Tooltip.jsx

@@ -0,0 +1,18 @@
+import { Tooltip as ShadTooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "../ui/tooltip";
+import { Body } from "../Typography/Body/body";
+var Tooltip = function (_a) {
+    var title = _a.title, className = _a.className, children = _a.children;
+    return (<TooltipProvider>
+      <ShadTooltip>
+        <TooltipTrigger asChild className={className}>
+          {children}
+        </TooltipTrigger>
+        <TooltipContent>
+          <Body variant="body-md" className="text-center">
+            {title}
+          </Body>
+        </TooltipContent>
+      </ShadTooltip>
+    </TooltipProvider>);
+};
+export default Tooltip;

package/dist/src/components/ToolTip/Tooltip.stories.jsx

@@ -0,0 +1,25 @@
+import Tooltip from "./Tooltip";
+import { IconButton } from "../Button/IconButton/IconButton";
+export default {
+    title: "Components/Tooltip",
+    component: Tooltip,
+    tags: ["autodocs"],
+};
+var Template = function (args) { return (<Tooltip {...args}></Tooltip>); };
+export var _ToolTip = Template.bind({});
+_ToolTip.args = {
+    children: <IconButton icon="volume-high" shape="rounded-full"/>,
+    title: "Tooltip",
+};
+_ToolTip.argTypes = {
+    children: {
+        description: "React component to be wrapped",
+        control: false,
+        table: {
+            type: { summary: "string" },
+            defaultValue: {
+                summary: '<IconButton icon={<LUIcon icon="volume-high" size="sm"/>} shape="rounded-full"/>',
+            },
+        },
+    },
+};

package/dist/src/components/Typography/Body/Body.stories.jsx

@@ -0,0 +1,34 @@
+import { Dummy_Para } from "../../../utils/constants";
+import { Body, variant } from "../../../components/Typography/Body/body";
+export default {
+    title: "Components/Typography/Body",
+    component: Body,
+    tags: ["autodocs"],
+};
+var Template = function (args) { return <Body {...args}></Body>; };
+export var _Body = Template.bind({});
+_Body.args = {
+    children: Dummy_Para,
+    variant: "body-base",
+    as: "p",
+};
+_Body.argTypes = {
+    variant: {
+        control: { type: "select" },
+        options: Object.keys(variant),
+        description: "Body Variant",
+        table: {
+            defaultValue: { summary: "body-base" },
+            type: { summary: "string" },
+        },
+    },
+    as: {
+        control: { type: "select" },
+        options: ["p", "span"],
+        description: "HTML tag to render",
+        table: {
+            defaultValue: { summary: "p" },
+            type: { summary: '"p" | "span"' },
+        },
+    },
+};

package/dist/src/components/Typography/Body/body.jsx

@@ -0,0 +1,52 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../../../lib/utils";
+export var variant = {
+    "body-xl": "text-xl font-normal",
+    "body-xl-500": "text-xl font-medium",
+    "body-xl-600": "text-xl font-semibold",
+    "body-xl-700": "text-xl font-bold",
+    "body-lg": "text-lg font-normal",
+    "body-lg-500": "text-lg font-medium",
+    "body-lg-600": "text-lg font-semibold",
+    "body-lg-700": "text-lg font-bold",
+    "body-md": "text-base font-normal",
+    "body-md-500": "text-base font-medium",
+    "body-md-600": "text-base font-semibold",
+    "body-md-700": "text-base font-bold",
+    "body-sm": "text-sm font-normal",
+    "body-sm-500": "text-sm font-medium",
+    "body-sm-600": "text-sm font-semibold",
+    "body-sm-700": "text-sm font-bold",
+    "body-xs": "text-xs font-normal",
+    "body-xs-500": "text-xs font-medium",
+    "body-xs-600": "text-xs font-semibold",
+    "body-xs-700": "text-xs font-bold",
+};
+var bodyVariants = cva("!leading-normal m-0", {
+    variants: {
+        variant: variant,
+    },
+    defaultVariants: {
+        variant: "body-md",
+    },
+});
+function Body(_a) {
+    var as = _a.as, className = _a.className, variant = _a.variant, children = _a.children, props = __rest(_a, ["as", "className", "variant", "children"]);
+    var Tag = as || "p";
+    return (<Tag className={cn(bodyVariants({ variant: variant }), className)} {...props}>
+      {children}
+    </Tag>);
+}
+export { Body, bodyVariants };

package/dist/src/components/Typography/Caption/Caption.stories.jsx

@@ -0,0 +1,24 @@
+import { Dummy_Para } from "../../../utils/constants";
+import { Caption, variantClasses, } from "../../../components/Typography/Caption/caption";
+export default {
+    title: "Components/Typography/Caption",
+    component: Caption,
+    tags: ["autodocs"],
+};
+var Template = function (args) { return <Caption {...args}></Caption>; };
+export var _Caption = Template.bind({});
+_Caption.args = {
+    children: Dummy_Para,
+    variant: "md",
+};
+_Caption.argTypes = {
+    variant: {
+        control: { type: "select" },
+        options: Object.keys(variantClasses),
+        description: "Caption Variant",
+        table: {
+            defaultValue: { summary: "md" },
+            type: { summary: "string" },
+        },
+    },
+};

package/dist/src/components/Typography/Caption/caption.jsx

@@ -0,0 +1,25 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from "react";
+import { cn } from "../../../lib/utils";
+export var variantClasses = {
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base",
+};
+function Caption(_a) {
+    var className = _a.className, children = _a.children, _b = _a.variant, variant = _b === void 0 ? "md" : _b, props = __rest(_a, ["className", "children", "variant"]);
+    return (<p className={cn("!font-normal !leading-normal m-0 inline", variantClasses[variant], className)} {...props}>
+      {children}
+    </p>);
+}
+export { Caption };

package/dist/src/components/Typography/Display/Display.stories.jsx

@@ -0,0 +1,24 @@
+import { Dummy_Para } from "../../../utils/constants";
+import { Display, variant } from "../../../components/Typography/Display/display";
+export default {
+    title: "Components/Typography/Display",
+    component: Display,
+    tags: ["autodocs"],
+};
+var Template = function (args) { return <Display {...args}></Display>; };
+export var _Display = Template.bind({});
+_Display.args = {
+    children: Dummy_Para,
+    variant: "display-md",
+};
+_Display.argTypes = {
+    variant: {
+        control: { type: "select" },
+        options: Object.keys(variant),
+        description: "Display Variant",
+        table: {
+            defaultValue: { summary: "display-md" },
+            type: { summary: "string" },
+        },
+    },
+};

package/dist/src/components/Typography/Display/display.jsx

@@ -0,0 +1,39 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "../../../lib/utils";
+export var variant = {
+    "display-lg": "text-7xl font-bold",
+    "display-md": "text-6xl font-bold",
+    "display-sm": "text-5xl font-bold",
+};
+var displayVariants = cva("!leading-normal", // Default base class
+{
+    variants: {
+        variant: variant,
+    },
+    defaultVariants: {
+        variant: "display-md",
+    },
+});
+function Display(_a) {
+    var className = _a.className, variant = _a.variant, children = _a.children, props = __rest(_a, ["className", "variant", "children"]);
+    var Tag = "div";
+    if (variant === null || variant === void 0 ? void 0 : variant.startsWith("display")) {
+        Tag = "div";
+    }
+    return (<Tag className={cn(displayVariants({ variant: variant, className: className }))} {...props}>
+      {children}
+    </Tag>);
+}
+export { Display, displayVariants };

package/dist/src/components/Typography/Heading/Heading.stories.jsx

@@ -0,0 +1,37 @@
+import { Dummy_Para } from "../../../utils/constants";
+import { Heading, variant } from "./heading";
+export default {
+    title: "Components/Typography/Heading",
+    component: Heading,
+    tags: ["autodocs"],
+};
+var Template = function (args) { return <Heading {...args}></Heading>; };
+export var _Heading = Template.bind({});
+_Heading.args = {
+    children: Dummy_Para,
+    variant: "h2",
+};
+_Heading.argTypes = {
+    variant: {
+        control: { type: "select" },
+        options: Object.keys(variant),
+        description: "Heading Variant",
+        table: {
+            defaultValue: { summary: "h2" },
+            type: { summary: "string" },
+        },
+    },
+};
+export var WithCustomClassName = Template.bind({});
+WithCustomClassName.args = {
+    children: "Heading with custom className (red text)",
+    variant: "h2",
+    className: "text-red-500 underline",
+};
+WithCustomClassName.parameters = {
+    docs: {
+        description: {
+            story: "Demonstrates the usage of the className prop to apply custom styles.",
+        },
+    },
+};

package/dist/src/components/Typography/Heading/heading.jsx

@@ -0,0 +1,53 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from "react";
+import styles from "./heading.module.css";
+import { cn } from "../../../lib/utils";
+export var variant = {
+    h1: styles["h1"],
+    "h1-500": styles["h1-500"],
+    "h1-600": styles["h1-600"],
+    "h1-700": styles["h1-700"],
+    h2: styles["h2"],
+    "h2-500": styles["h2-500"],
+    "h2-600": styles["h2-600"],
+    "h2-700": styles["h2-700"],
+    h3: styles["h3"],
+    "h3-500": styles["h3-500"],
+    "h3-600": styles["h3-600"],
+    "h3-700": styles["h3-700"],
+    h4: styles["h4"],
+    "h4-500": styles["h4-500"],
+    "h4-600": styles["h4-600"],
+    "h4-700": styles["h4-700"],
+    h5: styles["h5"],
+    "h5-500": styles["h5-500"],
+    "h5-600": styles["h5-600"],
+    "h5-700": styles["h5-700"],
+    h6: styles["h6"],
+    "h6-500": styles["h6-500"],
+    "h6-600": styles["h6-600"],
+    "h6-700": styles["h6-700"],
+};
+var Heading = function (_a) {
+    var _b = _a.variant, variant = _b === void 0 ? "h2" : _b, className = _a.className, children = _a.children, props = __rest(_a, ["variant", "className", "children"]);
+    var Tag = "span";
+    if (variant && typeof variant === "string" && variant.startsWith("h")) {
+        Tag = variant.split("-")[0];
+    }
+    return (<Tag className={cn(styles.heading, typeof variant === "string" && styles["".concat(variant)]
+            ? styles["".concat(variant)]
+            : styles["h2"], className)} {...props}>
+      {children}
+    </Tag>);
+};
+export { Heading };

package/dist/src/components/ui/avatar.d.ts

@@ -1,13 +1,6 @@
 import * as React from "react";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
-import { avatar1Size, avatar1Shape, avatarFallbackSize } from "../Avatar/Avatar";
-declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & {
-    size?: keyof typeof avatar1Size;
-    shape?: keyof typeof avatar1Shape;
-    status?: "online" | "offline" | "busy" | "away";
-} & 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"> & {
-    size?: keyof typeof avatarFallbackSize;
-} & React.RefAttributes<HTMLSpanElement>>;
+declare function Avatar({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarImage({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Image>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarFallback({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>): import("react/jsx-runtime").JSX.Element;
 export { Avatar, AvatarImage, AvatarFallback };

package/dist/src/components/ui/avatar.js

@@ -20,34 +20,19 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
 import { cn } from "../../lib/utils";
-import { avatar1Size, avatar1Shape, avatarFallbackSize, iconSizeMap, statusIndicatorSize, statusIndicatorOffset, roundedStatusIndicatorOffset, } from "../Avatar/Avatar";
-import LUIcon from "../Icons/LUIcon";
-import { StatusIndicator } from "../Avatar/StatusIndicator/StatusIndicator";
-var AvatarContext = React.createContext({ size: "md", shape: "rounded" });
-var Avatar = React.forwardRef(function (_a, ref) {
-    var _b;
-    var className = _a.className, _c = _a.size, size = _c === void 0 ? "md" : _c, _d = _a.shape, shape = _d === void 0 ? "rounded" : _d, status = _a.status, children = _a.children, props = __rest(_a, ["className", "size", "shape", "status", "children"]);
-    return (_jsx(AvatarPrimitive.Root, __assign({ ref: ref, className: cn("relative flex shrink-0", className, avatar1Size[size], typeof avatar1Shape[shape] === "string"
-            ? avatar1Shape[shape]
-            : (_b = avatar1Shape[shape]) === null || _b === void 0 ? void 0 : _b[size]), "data-size": size, "data-shape": shape }, props, { children: _jsxs(AvatarContext.Provider, { value: { size: size, shape: shape }, children: [children, status &&
-                    (shape === "rounded" ? (_jsx(StatusIndicator, { status: status, size: statusIndicatorSize[size], className: cn("absolute", roundedStatusIndicatorOffset[size]) })) : (_jsx(StatusIndicator, { status: status, size: statusIndicatorSize[size], className: cn("absolute", statusIndicatorOffset[size]) })))] }) })));
-});
-Avatar.displayName = AvatarPrimitive.Root.displayName;
-var AvatarImage = React.forwardRef(function (_a, ref) {
+function Avatar(_a) {
     var className = _a.className, props = __rest(_a, ["className"]);
-    return (_jsx(AvatarPrimitive.Image, __assign({ ref: ref, className: cn("aspect-square h-full w-full bg-blue-100 rounded-[inherit]", className) }, props)));
-});
-AvatarImage.displayName = AvatarPrimitive.Image.displayName;
-var AvatarFallback = React.forwardRef(function (_a, ref) {
-    var className = _a.className, size = _a.size, children = _a.children, props = __rest(_a, ["className", "size", "children"]);
-    var ctx = React.useContext(AvatarContext);
-    var finalSize = (size !== null && size !== void 0 ? size : ctx.size);
-    return (_jsx(AvatarPrimitive.Fallback, __assign({ ref: ref, className: cn("flex h-full w-full items-center justify-center bg-blue-100 font-medium leading-normal rounded-[inherit]", className, avatarFallbackSize[finalSize]) }, props, { children: children ? (children) : (_jsx(LUIcon, { icon: "user", size: iconSizeMap[finalSize] }) // fallback LUIcon
-        ) })));
-});
-AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+    return (_jsx(AvatarPrimitive.Root, __assign({ "data-slot": "avatar", className: cn("relative flex size-8 shrink-0 overflow-hidden rounded-full", className) }, props)));
+}
+function AvatarImage(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (_jsx(AvatarPrimitive.Image, __assign({ "data-slot": "avatar-image", className: cn("aspect-square size-full", className) }, props)));
+}
+function AvatarFallback(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (_jsx(AvatarPrimitive.Fallback, __assign({ "data-slot": "avatar-fallback", className: cn("bg-muted flex size-full items-center justify-center rounded-full", className) }, props)));
+}
 export { Avatar, AvatarImage, AvatarFallback };

package/dist/src/components/ui/avatar.jsx

@@ -0,0 +1,27 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import * as React from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+import { cn } from "../../lib/utils";
+function Avatar(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AvatarPrimitive.Root data-slot="avatar" className={cn("relative flex size-8 shrink-0 overflow-hidden rounded-full", className)} {...props}/>);
+}
+function AvatarImage(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AvatarPrimitive.Image data-slot="avatar-image" className={cn("aspect-square size-full", className)} {...props}/>);
+}
+function AvatarFallback(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<AvatarPrimitive.Fallback data-slot="avatar-fallback" className={cn("bg-muted flex size-full items-center justify-center rounded-full", className)} {...props}/>);
+}
+export { Avatar, AvatarImage, AvatarFallback };

package/dist/src/components/ui/button.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "link" | "outline" | "ghost" | "destructive" | "secondary" | null | undefined;
+    size?: "default" | "icon" | "sm" | "lg" | "icon-sm" | "icon-lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export { Button, buttonVariants };

package/dist/src/components/ui/button.js

@@ -0,0 +1,56 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { cn } from "../../lib/utils";
+var buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/90",
+            destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+            outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+            link: "text-primary underline-offset-4 hover:underline",
+        },
+        size: {
+            default: "h-9 px-4 py-2 has-[>svg]:px-3",
+            sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+            lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+            icon: "size-9",
+            "icon-sm": "size-8",
+            "icon-lg": "size-10",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+function Button(_a) {
+    var className = _a.className, variant = _a.variant, size = _a.size, _b = _a.asChild, asChild = _b === void 0 ? false : _b, props = __rest(_a, ["className", "variant", "size", "asChild"]);
+    var Comp = asChild ? Slot : "button";
+    return (_jsx(Comp, __assign({ "data-slot": "button", className: cn(buttonVariants({ variant: variant, size: size, className: className })) }, props)));
+}
+export { Button, buttonVariants };