@a2v2ai/uikit 0.0.1

package/InputOTP/InputOTP.js

@@ -0,0 +1,85 @@
+"use strict";
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.inputOTPSlotVariants = exports.inputOTPVariants = exports.InputOTPSeparator = exports.InputOTPSlot = exports.InputOTPGroup = exports.InputOTP = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const input_otp_1 = require("input-otp");
+const lucide_react_1 = require("lucide-react");
+const class_variance_authority_1 = require("class-variance-authority");
+const utils_1 = require("../lib/utils");
+const inputOTPVariants = (0, class_variance_authority_1.cva)("flex items-center gap-2 has-[:disabled]:opacity-50", {
+    variants: {},
+    defaultVariants: {},
+});
+exports.inputOTPVariants = inputOTPVariants;
+const InputOTP = React.forwardRef(({ className, containerClassName, children, ...props }, ref) => ((0, jsx_runtime_1.jsx)(input_otp_1.OTPInput, { ref: ref, containerClassName: (0, utils_1.cn)("flex items-center gap-2 has-[:disabled]:opacity-50", containerClassName), className: (0, utils_1.cn)("disabled:cursor-not-allowed", className), ...props, render: ({ slots, isFocused, isHovering }) => ((0, jsx_runtime_1.jsx)(input_otp_1.OTPInputContext.Provider, { value: { slots, isFocused, isHovering }, children: children })) })));
+exports.InputOTP = InputOTP;
+InputOTP.displayName = "InputOTP";
+const InputOTPGroup = React.forwardRef(({ className, ...props }, ref) => ((0, jsx_runtime_1.jsx)("div", { ref: ref, className: (0, utils_1.cn)("flex items-center", className), ...props })));
+exports.InputOTPGroup = InputOTPGroup;
+InputOTPGroup.displayName = "InputOTPGroup";
+const inputOTPSlotVariants = (0, class_variance_authority_1.cva)(
+// Match Input component styles: border-grey-300, rounded-lg, focus ring
+"relative flex items-center justify-center bg-white border border-grey-300 text-main-950 font-sans transition-all first:rounded-l-lg last:rounded-r-lg first:border-l border-l-0", {
+    variants: {
+        slotSize: {
+            sm: "h-8 w-8 text-sm rounded-md first:rounded-l-md last:rounded-r-md",
+            default: "h-9 w-9 text-sm",
+            lg: "h-10 w-10 text-base",
+        },
+    },
+    defaultVariants: {
+        slotSize: "default",
+    },
+});
+exports.inputOTPSlotVariants = inputOTPSlotVariants;
+const InputOTPSlot = React.forwardRef(({ index, className, slotSize, ...props }, ref) => {
+    const inputOTPContext = React.useContext(input_otp_1.OTPInputContext);
+    const slot = inputOTPContext.slots[index];
+    if (!slot) {
+        return null;
+    }
+    const { char, hasFakeCaret, isActive } = slot;
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, className: (0, utils_1.cn)(inputOTPSlotVariants({ slotSize }), 
+        // Match Input focus style: ring-[3px] ring-grey-300/50
+        isActive && "z-10 border-grey-300 ring-[3px] ring-grey-300/50", className), ...props, children: [char, hasFakeCaret && ((0, jsx_runtime_1.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: (0, jsx_runtime_1.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-main-950 duration-1000" }) }))] }));
+});
+exports.InputOTPSlot = InputOTPSlot;
+InputOTPSlot.displayName = "InputOTPSlot";
+const InputOTPSeparator = React.forwardRef(({ ...props }, ref) => ((0, jsx_runtime_1.jsx)("div", { ref: ref, role: "separator", ...props, children: (0, jsx_runtime_1.jsx)(lucide_react_1.Minus, { className: "text-grey-400" }) })));
+exports.InputOTPSeparator = InputOTPSeparator;
+InputOTPSeparator.displayName = "InputOTPSeparator";

package/Label/Label.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { type VariantProps } from "class-variance-authority";
+declare const labelVariants: (props?: ({
+    variant?: "default" | "error" | "muted" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface LabelProps extends React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, VariantProps<typeof labelVariants> {
+}
+declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
+export { Label, labelVariants };

package/Label/Label.js

@@ -0,0 +1,57 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.labelVariants = exports.Label = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const LabelPrimitive = __importStar(require("@radix-ui/react-label"));
+const class_variance_authority_1 = require("class-variance-authority");
+const utils_1 = require("../lib/utils");
+const labelVariants = (0, class_variance_authority_1.cva)("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", {
+    variants: {
+        variant: {
+            default: "text-main-950",
+            muted: "text-grey-500",
+            error: "text-error-600",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+exports.labelVariants = labelVariants;
+const Label = React.forwardRef(({ className, variant, ...props }, ref) => ((0, jsx_runtime_1.jsx)(LabelPrimitive.Root, { ref: ref, className: (0, utils_1.cn)(labelVariants({ variant }), className), ...props })));
+exports.Label = Label;
+Label.displayName = LabelPrimitive.Root.displayName;

package/Loader/Loader.d.ts

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const loaderVariants: (props?: ({
+    size?: "small" | "regular" | "large" | "mini" | null | undefined;
+    color?: "main" | "current" | "grey" | "white" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export type LoaderProps = Omit<React.HTMLAttributes<HTMLDivElement>, "color"> & VariantProps<typeof loaderVariants> & {
+    /** Optional label for accessibility */
+    label?: string;
+};
+declare const Loader: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "color"> & VariantProps<(props?: ({
+    size?: "small" | "regular" | "large" | "mini" | null | undefined;
+    color?: "main" | "current" | "grey" | "white" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & {
+    /** Optional label for accessibility */
+    label?: string;
+} & React.RefAttributes<HTMLDivElement>>;
+export { Loader, loaderVariants };

package/Loader/Loader.js

@@ -0,0 +1,67 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.loaderVariants = exports.Loader = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const lucide_react_1 = require("lucide-react");
+const class_variance_authority_1 = require("class-variance-authority");
+const Flex_1 = require("../Flex/Flex");
+const Typography_1 = require("../Typography/Typography");
+const utils_1 = require("../lib/utils");
+const loaderVariants = (0, class_variance_authority_1.cva)("animate-spin", {
+    variants: {
+        size: {
+            mini: "size-3",
+            small: "size-4",
+            regular: "size-6",
+            large: "size-8",
+        },
+        color: {
+            main: "text-main-600",
+            grey: "text-grey-600",
+            white: "text-white",
+            current: "text-current",
+        },
+    },
+    defaultVariants: {
+        size: "regular",
+        color: "main",
+    },
+});
+exports.loaderVariants = loaderVariants;
+const Loader = React.forwardRef(({ className, size, color, label = "Loading...", ...props }, ref) => ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { ref: ref, role: "status", "aria-label": label, align: "center", justify: "center", className: (0, utils_1.cn)("inline-flex", className), ...props, children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: (0, utils_1.cn)(loaderVariants({ size, color })) }), (0, jsx_runtime_1.jsx)(Typography_1.Typography, { className: "sr-only", children: label })] })));
+exports.Loader = Loader;
+Loader.displayName = "Loader";

package/Popover/Popover.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
+declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const PopoverAnchor: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React.RefAttributes<HTMLDivElement>>;
+declare const PopoverContent: React.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };

package/Popover/Popover.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PopoverAnchor = exports.PopoverContent = exports.PopoverTrigger = exports.Popover = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const PopoverPrimitive = __importStar(require("@radix-ui/react-popover"));
+const utils_1 = require("../lib/utils");
+const Popover = PopoverPrimitive.Root;
+exports.Popover = Popover;
+const PopoverTrigger = PopoverPrimitive.Trigger;
+exports.PopoverTrigger = PopoverTrigger;
+const PopoverAnchor = PopoverPrimitive.Anchor;
+exports.PopoverAnchor = PopoverAnchor;
+const PopoverContent = React.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => ((0, jsx_runtime_1.jsx)(PopoverPrimitive.Portal, { children: (0, jsx_runtime_1.jsx)(PopoverPrimitive.Content, { ref: ref, align: align, sideOffset: sideOffset, className: (0, utils_1.cn)("z-50 w-72 rounded-lg border border-grey-200 bg-white p-4 text-main-950 shadow-md outline-none 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className), ...props }) })));
+exports.PopoverContent = PopoverContent;
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;

package/Progress/Progress.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import * as ProgressPrimitive from "@radix-ui/react-progress";
+import { type VariantProps } from "class-variance-authority";
+declare const progressVariants: (props?: ({
+    size?: "small" | "regular" | "large" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare const progressIndicatorVariants: (props?: ({
+    variant?: "default" | "destructive" | "success" | "warning" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface ProgressProps extends React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>, VariantProps<typeof progressVariants>, VariantProps<typeof progressIndicatorVariants> {
+}
+declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;
+export { Progress, progressVariants, progressIndicatorVariants };

package/Progress/Progress.js

@@ -0,0 +1,71 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.progressIndicatorVariants = exports.progressVariants = exports.Progress = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const ProgressPrimitive = __importStar(require("@radix-ui/react-progress"));
+const class_variance_authority_1 = require("class-variance-authority");
+const utils_1 = require("../lib/utils");
+const progressVariants = (0, class_variance_authority_1.cva)("relative w-full overflow-hidden rounded-full bg-grey-100", {
+    variants: {
+        size: {
+            small: "h-1",
+            regular: "h-2",
+            large: "h-3",
+        },
+    },
+    defaultVariants: {
+        size: "regular",
+    },
+});
+exports.progressVariants = progressVariants;
+const progressIndicatorVariants = (0, class_variance_authority_1.cva)("h-full w-full flex-1 transition-all", {
+    variants: {
+        variant: {
+            default: "bg-main-950",
+            success: "bg-success-600",
+            warning: "bg-warning-500",
+            destructive: "bg-error-600",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+exports.progressIndicatorVariants = progressIndicatorVariants;
+const Progress = React.forwardRef(({ className, value, size, variant, ...props }, ref) => ((0, jsx_runtime_1.jsx)(ProgressPrimitive.Root, { ref: ref, className: (0, utils_1.cn)(progressVariants({ size }), className), ...props, children: (0, jsx_runtime_1.jsx)(ProgressPrimitive.Indicator, { className: (0, utils_1.cn)(progressIndicatorVariants({ variant })), style: { transform: `translateX(-${100 - (value || 0)}%)` } }) })));
+exports.Progress = Progress;
+Progress.displayName = ProgressPrimitive.Root.displayName;

package/README.md

@@ -0,0 +1,183 @@
+# a2v2-uikit
+
+A React UI component library built with shadcn/ui and Tailwind CSS.
+
+## Installation
+
+```bash
+npm install a2v2-uikit
+```
+
+## Setup
+
+### 1. Import Styles
+
+Add the styles to your app's entry point:
+
+```tsx
+import "a2v2-uikit/styles.css"
+```
+
+### 2. Configure Tailwind CSS
+
+Make sure you have Tailwind CSS v4+ configured in your project.
+
+## Usage
+
+### Components
+
+```tsx
+import { Button, Input, Card, AlertDialog } from "a2v2-uikit"
+
+function App() {
+  return (
+    <Card>
+      <Input placeholder="Enter your name" />
+      <Button variant="primary">Submit</Button>
+    </Card>
+  )
+}
+```
+
+### Toast Notifications
+
+```tsx
+import { Toaster, toast } from "a2v2-uikit"
+
+function App() {
+  return (
+    <>
+      <button onClick={() => toast.success("Saved!")}>Show Toast</button>
+      <Toaster />
+    </>
+  )
+}
+```
+
+### Form Validation
+
+```tsx
+import { Input, Label, ErrorMessage } from "a2v2-uikit"
+
+function Form() {
+  const errors = { email: "Please enter a valid email" }
+  const touched = { email: true }
+
+  return (
+    <div>
+      <Label htmlFor="email">Email</Label>
+      <Input id="email" className={errors.email ? "border-error-500" : ""} />
+      <ErrorMessage name="email" errors={errors} touched={touched} />
+    </div>
+  )
+}
+```
+
+### Icons
+
+```tsx
+import { Home, Settings, User } from "a2v2-uikit/icons"
+
+function Nav() {
+  return (
+    <nav>
+      <Home size={24} />
+      <Settings size={24} />
+      <User size={24} />
+    </nav>
+  )
+}
+```
+
+### Helpers
+
+```tsx
+import { cn, cva } from "a2v2-uikit/helpers"
+
+const buttonVariants = cva("base-class", {
+  variants: {
+    size: {
+      sm: "text-sm",
+      lg: "text-lg",
+    },
+  },
+})
+
+function MyButton({ className, size }) {
+  return <button className={cn(buttonVariants({ size }), className)} />
+}
+```
+
+## Available Components
+
+### Form Controls
+| Component | Description |
+|-----------|-------------|
+| Button | Interactive buttons with variants |
+| IconButton | Icon-only buttons |
+| Input | Text input fields |
+| InputOTP | One-time password input |
+| Textarea | Multi-line text input |
+| Checkbox | Checkbox input |
+| RadioGroup | Radio button groups |
+| Select | Select dropdowns |
+| Switch | Toggle switches |
+| Label | Form labels |
+| ErrorMessage | Form validation errors |
+
+### Layout
+| Component | Description |
+|-----------|-------------|
+| Flex | Flexbox layout component |
+| Card | Container for content |
+| Separator | Visual dividers |
+| ScrollArea | Custom scrollable areas |
+
+### Feedback
+| Component | Description |
+|-----------|-------------|
+| Alert | Displays important messages |
+| Badge | Status indicators and labels |
+| Loader | Loading spinners |
+| Progress | Progress bars |
+| Skeleton | Loading placeholders |
+| Spinner | Animated loading spinner |
+| ChatBubble | Chat message bubbles |
+| Toast | Toast notifications |
+
+### Navigation & Overlay
+| Component | Description |
+|-----------|-------------|
+| AlertDialog | Modal alert dialogs |
+| Breadcrumb | Navigation breadcrumbs |
+| Drawer | Slide-out panels |
+| DropdownMenu | Dropdown menus |
+| Popover | Floating content |
+| Tabs | Tabbed interfaces |
+| Tooltip | Hover tooltips |
+
+### Data Display
+| Component | Description |
+|-----------|-------------|
+| Avatar | User profile images |
+| Calendar | Date picker |
+| Typography | Text styling component |
+
+## Exports
+
+| Path | Description |
+|------|-------------|
+| `a2v2-uikit` | All components and utilities |
+| `a2v2-uikit/icons` | Lucide React icons |
+| `a2v2-uikit/helpers` | Utility functions (cn, cva, clsx, twMerge) |
+| `a2v2-uikit/styles.css` | Component styles |
+
+## Peer Dependencies
+
+- React 18+ or 19+
+- React DOM 18+ or 19+
+- Tailwind CSS 4+
+
+## License
+
+MIT

package/RadioGroup/RadioGroup.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { type VariantProps } from "class-variance-authority";
+declare const RadioGroup: React.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const radioGroupItemVariants: (props?: ({
+    size?: "small" | "regular" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface RadioGroupItemProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>, VariantProps<typeof radioGroupItemVariants> {
+}
+declare const RadioGroupItem: React.ForwardRefExoticComponent<RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>>;
+export { RadioGroup, RadioGroupItem, radioGroupItemVariants };

package/RadioGroup/RadioGroup.js

@@ -0,0 +1,64 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.radioGroupItemVariants = exports.RadioGroupItem = exports.RadioGroup = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const RadioGroupPrimitive = __importStar(require("@radix-ui/react-radio-group"));
+const lucide_react_1 = require("lucide-react");
+const class_variance_authority_1 = require("class-variance-authority");
+const utils_1 = require("../lib/utils");
+const RadioGroup = React.forwardRef(({ className, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(RadioGroupPrimitive.Root, { className: (0, utils_1.cn)("grid gap-2", className), ...props, ref: ref }));
+});
+exports.RadioGroup = RadioGroup;
+RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
+const radioGroupItemVariants = (0, class_variance_authority_1.cva)("aspect-square rounded-full border border-grey-300 bg-white text-main-950 ring-offset-white focus:outline-none focus-visible:ring-2 focus-visible:ring-main-950 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-main-950", {
+    variants: {
+        size: {
+            small: "size-4",
+            regular: "size-5",
+        },
+    },
+    defaultVariants: {
+        size: "regular",
+    },
+});
+exports.radioGroupItemVariants = radioGroupItemVariants;
+const RadioGroupItem = React.forwardRef(({ className, size, ...props }, ref) => {
+    return ((0, jsx_runtime_1.jsx)(RadioGroupPrimitive.Item, { ref: ref, className: (0, utils_1.cn)(radioGroupItemVariants({ size }), className), ...props, children: (0, jsx_runtime_1.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Circle, { className: (0, utils_1.cn)("fill-main-950 text-main-950", size === "small" ? "size-2" : "size-2.5") }) }) }));
+});
+exports.RadioGroupItem = RadioGroupItem;
+RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;

package/ScrollArea/ScrollArea.d.ts

@@ -0,0 +1,5 @@
+import * as React from "react";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+declare const ScrollArea: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ScrollBar: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaScrollbarProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { ScrollArea, ScrollBar };