@beyondcorp/beyond-ui 1.0.7 → 1.0.9

package/README.md

@@ -1,89 +1,233 @@
-# beyond-ui
-# beyond-ui
-
-## Tailwind CSS Setup Required
-
-**beyond-ui** components are styled using Tailwind CSS utility classes. To see the styled components, your app must:
-
-1. Install Tailwind CSS (https://tailwindcss.com/docs/installation).
-2. Configure your tailwind.config.js to include your source files and also:
-   ```js
-   content: [
-     "./node_modules/@beyondcorp/beyond-ui/dist/**/*.js",
-     "./src/**/*.{js,ts,jsx,tsx}",
-     // ...your other content paths
-   ]
-   ```
-3. Import Tailwind’s stylesheet in your main entry (usually `import './index.css'` or similar).
-
-**Note:** No CSS is bundled with the library. The consumer project must build Tailwind to activate all required styles, as with all Tailwind component libraries.
-
-### Do I really need Tailwind in my project for beyond-ui components to be styled?
-
-**Yes, for full theme-ability and correct Tailwind utility style application.**
-
-- beyond-ui follows [Tailwind library best practices](https://tailwindcss.com/docs/using-with-preprocessors#using-with-libraries) and emits Tailwind class names, NOT bundled CSS.
-- This gives maximum flexibility: consumers can use their own Tailwind theme, purge unused UI classes, and have zero style conflicts.
-
-**Alternatives:**
-- If you do NOT want consumers to use Tailwind, you would need to ship a pre-built CSS file with all required styles, and users would have to `import 'beyond-ui/styles.css'`.  
-  - This breaks Tailwind composability and is discouraged by Tailwind and most major UI libraries.
-
-**Summary:**  
-To get fully themed, tree-shakable, future-proof components, consumers should add Tailwind. Only in legacy/CSS-bundling approaches should you ship CSS, and that would require a major change to your build and user story.
-
-### Troubleshooting: Styles not applied in consumer project
-
-If you have installed Tailwind CSS but your beyond-ui components are unstyled, check:
-
-1. **Tailwind config content:**  
-   Open your `tailwind.config.js` in the consuming app. Make sure you have something like:
-
-   ```js
-   module.exports = {
-     content: [
-       "./src/**/*.{js,ts,jsx,tsx}",
-       "./node_modules/@beyondcorp/beyond-ui/dist/**/*.{js,jsx,ts,tsx}",
-     ],
-     theme: {
-       // your theme config
-     },
-     plugins: [],
-   }
-   ```
-
-2. **Import Tailwind CSS:**  
-   Make sure your app's entry point (`src/index.js`, `src/main.tsx`, etc.) has:
-   ```js
-   import './index.css'; // or wherever your Tailwind CSS is output
-   ```
-
-3. **Check build output:**  
-   Look in your compiled site's HTML dev tools. Search for Tailwind utilities (e.g., `class="bg-primary-500"`, `p-4`, etc.) injected into the class attributes of beyond-ui components. If present but not styled, Tailwind CSS is not being loaded.
-
-4. **Purge and rebuild:**  
-   Delete your build output and `.next`, `dist`, or similar folders and restart the dev server. Sometimes Tailwind's JIT watcher misses node_modules changes the first time.
-
-5. **No duplicate Tailwind instances:**  
-   Make sure only one Tailwind is present in node_modules (check for accidental hoisting or duplicates).
-
-If after these steps styles are still missing, provide your exact consumer project tailwind.config.js and css imports for further support.
-
-### If Tailwind works but beyond-ui components are unstyled
-
-- Double-check your tailwind.config.js:
-
-  - The `content` **must** include the path to the built JS/CJS files in node_modules:
-    ```js
-    content: [
-      "./src/**/*.{js,ts,jsx,tsx}",
-      "./node_modules/@beyondcorp/beyond-ui/dist/**/*.{js,jsx,cjs,mjs,ts,tsx}"
-    ]
-    ```
-  - Restart your dev server after every tailwind.config.js/content change, so Tailwind JIT detects new files.
-- Make sure you have no `.npmignore`, `.gitignore`, or other config that would prevent node_modules/** imports or CSS output.
-- If you are using frameworks (Next.js, Vite), confirm your tailwind.config.js is at the project root and not shadowed by a monorepo/hoist.
-- Open the page and inspect beyond-ui elements in dev tools. If their classes look correct but they are not styled, it means Tailwind’s CSS did not include those utility classes (purged).
-- Try temporarily adding a utility like `bg-accent-700` in your consumer src/App.tsx and in a beyond-ui component. If it works in src/ but not in beyond-ui, the content config is misconfigured.
-
-If these checks don’t resolve the styling, please paste your consumer project’s tailwind.config.js content and your import statements for additional troubleshooting.
+# Beyond-UI
+
+**A full-fledged React + TailwindCSS component library. Theme-agnostic, reusable, type-safe, and built for productive UIs.**
+
+---
+
+## 🚀 Overview
+
+Beyond-UI is a comprehensive collection of ready-to-use, themeable React UI components and hooks, built with TypeScript, TailwindCSS, and Vite. Inspired by the best of modern design systems, it’s built to be both design-consistent (via semantic theming) and easily composable for dashboards, apps, platforms, and SaaS.
+
+- **Built for teams:** Use everywhere React and TailwindCSS run—admin panels, SaaS, dashboards, internal tools, consumer apps.
+- **Theme-agnostic:** Every style resolves to semantic Tailwind tokens (e.g., `bg-primary`), not hardcoded colors.
+- **Reusable hooks:** Utilities like `useDarkMode`, `useDebounce`, and more included.
+- **Customizable:** Extend via className or swap out theme tokens, with Storybook-ready demos.
+
+---
+
+## 📦 Features
+
+- **20+ reusable, composable components:** Button, Input, Card, Modal, Navbar, Sidebar, Tabs, Table, Alert, Spinner, Badge... (see below)
+- **Variants/Theme support with [class-variance-authority (CVA)](https://cva.style/)**
+- **Super-charged hooks:** `useDarkMode`, `useDebounce`, `useLocalStorage`, `useToggle`, `useBreakpoint`
+- **Utility functions:** `cn()` (merge class names safely), default semantic `theme/default.ts`
+- **Storybook documentation for every component**
+- **Typed end-to-end (TypeScript)**
+- **Testing with Jest & React Testing Library**
+- **Easy Tailwind integration & custom theming**
+- **Out-of-the-box default theme/fallback**
+- **First-class DX: Vite, modern structure, peer deps for React/Tailwind**
+- **NPM published, ready for mass reuse**
+
+---
+
+## 🛠 Installation
+
+```bash
+npm install @beyondcorp/beyond-ui
+# or
+yarn add @beyondcorp/beyond-ui
+```
+
+You must also have `react`, `react-dom`, and `tailwindcss` as peer dependencies.
+
+---
+
+## 🎨 Theming
+
+Beyond-UI is **completely theme-agnostic**:
+
+- Uses tokens like `bg-primary` not `bg-blue-500`.
+- Pulls colors from the consumer project’s `tailwind.config.js`.
+- Ships with a fallback default theme (`theme/default.ts`) for portability.
+
+To customize theme colors, add to your `tailwind.config.js`:
+
+```js
+theme: {
+  extend: {
+    colors: {
+      primary: { ... },
+      secondary: { ... },
+      danger: { ... },
+      // ...refer to theme/default.ts for full palette
+    }
+  }
+}
+```
+
+No configuration? The default theme covers you out of the box.
+
+---
+
+## 🧩 Components
+
+| Name          | Features / Variants             |
+|---------------|---------------------------------|
+| Button        | Variants (primary, secondary, danger, ghost), Sizes (sm, md, lg), Full type safety |
+| Input         | Variants (default, error, success), Sizes, Icon support        |
+| Textarea      | Auto-resize, char counter       |
+| Select        | Dropdown, search, async         |
+| Checkbox      | Label, indeterminate            |
+| Radio         | Group support                   |
+| Switch        | Animation, boolean toggle       |
+| Card          | Header, body, footer slots      |
+| Modal         | Overlay, keyboard dismiss       |
+| Badge         | Variants (info, warning, error) |
+| Tabs          | Horizontal/vertical, variants   |
+| Table         | Sortable, customized cells      |
+| Alert         | Info/success/warning/danger     |
+| Toast         | Notifications, timeouts         |
+| Skeleton      | Loading states                  |
+| Spinner       | Loader, multiple sizes          |
+| Navbar, Sidebar | Layout primitives           |
+| StatsCard     | Dashboard blocks                |
+| ChartWrapper  | Recharts integration            |
+| ...           | More (see Storybook)            |
+
+---
+
+## 🧵 Hooks & Utilities
+
+| Hook                | Purpose                          |
+|---------------------|----------------------------------|
+| useDarkMode         | Toggle and persist theme         |
+| useDebounce         | Debounce values/input            |
+| useLocalStorage     | Persistent state                 |
+| useToggle           | Boolean flip and set             |
+| useBreakpoint       | Responsive breakpoint API        |
+
+| Utility | Description  |
+|---------|--------------|
+| cn()    | Merges class names with tailwind-merge |
+| defaultTheme | Fallback theme definitions |
+
+---
+
+## 🧑‍💻 Usage Example
+
+```tsx
+import { Button, Card, useBreakpoint } from '@beyondcorp/beyond-ui';
+
+export default function Demo() {
+  const { isAbove } = useBreakpoint();
+  return (
+    <Card>
+      <Button variant="primary" size={isAbove('md') ? "lg" : "sm"}>
+        Click me
+      </Button>
+    </Card>
+  );
+}
+```
+
+---
+
+## ⚡️ Getting Started (Tailwind Setup)
+
+1. **Configure Tailwind in your app:**  
+   Extend the `content` array in `tailwind.config.js`:
+
+   ```js
+   content: [
+     "./src/**/*.{js,ts,jsx,tsx}",
+     "./node_modules/@beyondcorp/beyond-ui/dist/components/**/*.{js,jsx}"
+   ]
+   ```
+
+2. **Import Tailwind CSS:**  
+   In your app entry (`src/main.tsx` or `index.js`):  
+   ```js
+   import './index.css'; // or your Tailwind stylesheet
+   ```
+
+3. **(Optional) Extend Theme:**  
+   Define or override theme tokens for your brand.
+
+---
+
+## 📖 Documentation & Storybook
+
+Every component and hook has a demo, props table, variant showcase, and usage guide—launch Storybook locally, or check the online docs (URL).
+
+- `npm run storybook` (from the repo)
+- Getting Started, Theming, and API docs included
+
+---
+
+## 🧪 Testing & CI
+
+- Automated unit tests with Jest + React Testing Library
+- Snapshot and accessibility tests
+- See `/tests` directory for sample tests
+
+---
+
+## 🛠 Project Structure
+
+```
+beyond-ui/
+├─ src/
+│   ├─ components/
+│   ├─ hooks/
+│   ├─ utils/
+│   ├─ theme/
+│   └─ index.ts
+├─ .storybook/
+├─ tests/
+├─ tailwind.config.js
+├─ tsconfig.json
+├─ vite.config.ts
+├─ package.json
+└─ README.md
+```
+
+---
+
+## 🛤 Roadmap & Milestones
+
+- M1: Project setup, theme, utilities
+- M2: Core components (Button, Input, Card, Modal, Badge, ... )
+- M3: All reusable hooks
+- M4: Storybook & docs
+- M5: Complete Jest test coverage & accessibility
+- M6: npm package v1 stable release
+- M7: Dashboard, charts, advanced table, improved theming
+
+See `roadmap.md` for complete breakdown.
+
+---
+
+## 🤝 Contributing
+
+- Contributions, PRs, and issues welcome!
+- Please see `/CONTRIBUTING.md` for details, coding standards, and branch workflow.
+
+---
+
+## 📝 License
+
+MIT © Beyond Corp, Soi Technology Solutions 2025
+
+---
+
+## 📑 References
+
+- initialprompt.md, roadmap.md, technicalspecification.md (see repo)
+- [TailwindCSS](https://tailwindcss.com/docs)
+- [class-variance-authority](https://cva.style/)
+- [Storybook](https://storybook.js.org/)
+
+---
+
+# Beyond-UI: Build clean, scalable UIs faster, with every detail documented and ready to use.

package/dist/_virtual/jsx-runtime.js

@@ -0,0 +1,6 @@
+import { __require as requireJsxRuntime } from '../node_modules/react/jsx-runtime.js';
+
+var jsxRuntimeExports = requireJsxRuntime();
+
+export { jsxRuntimeExports as j };
+//# sourceMappingURL=jsx-runtime.js.map

package/dist/_virtual/jsx-runtime.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jsx-runtime.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/_virtual/jsx-runtime2.js

@@ -0,0 +1,4 @@
+var jsxRuntime = {exports: {}};
+
+export { jsxRuntime as __module };
+//# sourceMappingURL=jsx-runtime2.js.map

package/dist/_virtual/jsx-runtime2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"jsx-runtime2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/_virtual/react-jsx-runtime.development.js

@@ -0,0 +1,4 @@
+var reactJsxRuntime_development = {};
+
+export { reactJsxRuntime_development as __exports };
+//# sourceMappingURL=react-jsx-runtime.development.js.map

package/dist/_virtual/react-jsx-runtime.development.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-jsx-runtime.development.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/_virtual/react-jsx-runtime.production.min.js

@@ -0,0 +1,4 @@
+var reactJsxRuntime_production_min = {};
+
+export { reactJsxRuntime_production_min as __exports };
+//# sourceMappingURL=react-jsx-runtime.production.min.js.map

package/dist/_virtual/react-jsx-runtime.production.min.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-jsx-runtime.production.min.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/components/Alert/Alert.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const alertVariants: (props?: ({
+    variant?: "default" | "success" | "warning" | "danger" | "info" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare const Alert: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    variant?: "default" | "success" | "warning" | "danger" | "info" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & 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 };

package/dist/components/Alert/Alert.js

@@ -0,0 +1,28 @@
+import { j as jsxRuntimeExports } from '../../_virtual/jsx-runtime.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../utils/cn.js';
+
+const alertVariants = cva("relative w-full rounded-lg border p-4", {
+    variants: {
+        variant: {
+            default: "bg-white text-gray-950 border-gray-200",
+            success: "bg-success-50 text-success-800 border-success-200",
+            warning: "bg-warning-50 text-warning-800 border-warning-200",
+            danger: "bg-danger-50 text-danger-800 border-danger-200",
+            info: "bg-primary-50 text-primary-800 border-primary-200",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+const Alert = React.forwardRef(({ className, variant, ...props }, ref) => (jsxRuntimeExports.jsx("div", { ref: ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props })));
+Alert.displayName = "Alert";
+const AlertTitle = React.forwardRef(({ className, ...props }, ref) => (jsxRuntimeExports.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) => (jsxRuntimeExports.jsx("div", { ref: ref, className: cn("text-sm [&_p]:leading-relaxed", className), ...props })));
+AlertDescription.displayName = "AlertDescription";
+
+export { Alert, AlertDescription, AlertTitle, alertVariants };
+//# sourceMappingURL=Alert.js.map

package/dist/components/Alert/Alert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.js","sources":["../../../src/components/Alert/Alert.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../utils/cn\";\n\nconst alertVariants = cva(\n  \"relative w-full rounded-lg border p-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-white text-gray-950 border-gray-200\",\n        success: \"bg-success-50 text-success-800 border-success-200\",\n        warning: \"bg-warning-50 text-warning-800 border-warning-200\",\n        danger: \"bg-danger-50 text-danger-800 border-danger-200\",\n        info: \"bg-primary-50 text-primary-800 border-primary-200\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n);\n\nconst Alert = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>\n>(({ className, variant, ...props }, ref) => (\n  <div\n    ref={ref}\n    role=\"alert\"\n    className={cn(alertVariants({ variant }), className)}\n    {...props}\n  />\n));\nAlert.displayName = \"Alert\";\n\nconst AlertTitle = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLHeadingElement>\n>(({ className, ...props }, ref) => (\n  <h5\n    ref={ref}\n    className={cn(\"mb-1 font-medium leading-none tracking-tight\", className)}\n    {...props}\n  />\n));\nAlertTitle.displayName = \"AlertTitle\";\n\nconst AlertDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\"text-sm [&_p]:leading-relaxed\", className)}\n    {...props}\n  />\n));\nAlertDescription.displayName = \"AlertDescription\";\n\nexport { Alert, AlertTitle, AlertDescription, alertVariants };"],"names":["_jsx"],"mappings":";;;;;AAIA,MAAM,aAAa,GAAG,GAAG,CACvB,uCAAuC,EACvC;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,wCAAwC;AACjD,YAAA,OAAO,EAAE,mDAAmD;AAC5D,YAAA,OAAO,EAAE,mDAAmD;AAC5D,YAAA,MAAM,EAAE,gDAAgD;AACxD,YAAA,IAAI,EAAE,mDAAmD;AAC1D,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,OAAO,EAAE,SAAS;AACnB,KAAA;AACF,CAAA;AAGH,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAG5B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACtCA,qBAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,KAChD,KAAK,EAAA,CACT,CACH;AACD,KAAK,CAAC,WAAW,GAAG,OAAO;AAE3B,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAGjC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MAC7BA,qBAAA,CAAA,IAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,8CAA8C,EAAE,SAAS,CAAC,EAAA,GACpE,KAAK,EAAA,CACT,CACH;AACD,UAAU,CAAC,WAAW,GAAG,YAAY;AAErC,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAGvC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MAC7BA,qBAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,EAAA,GACrD,KAAK,EAAA,CACT,CACH;AACD,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;;;;"}

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

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

package/dist/components/Alert/index.js

@@ -0,0 +1,2 @@
+export { Alert, AlertDescription, AlertTitle, alertVariants } from './Alert.js';
+//# sourceMappingURL=index.js.map

package/dist/components/Alert/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Avatar/Avatar.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const avatarVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare const Avatar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+declare const AvatarImage: React.ForwardRefExoticComponent<React.ImgHTMLAttributes<HTMLImageElement> & React.RefAttributes<HTMLImageElement>>;
+declare const AvatarFallback: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { Avatar, AvatarImage, AvatarFallback, avatarVariants };

package/dist/components/Avatar/Avatar.js

@@ -0,0 +1,27 @@
+import { j as jsxRuntimeExports } from '../../_virtual/jsx-runtime.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../utils/cn.js';
+
+const avatarVariants = cva("relative flex shrink-0 overflow-hidden rounded-full", {
+    variants: {
+        size: {
+            sm: "h-8 w-8",
+            md: "h-10 w-10",
+            lg: "h-16 w-16",
+            xl: "h-20 w-20",
+        },
+    },
+    defaultVariants: {
+        size: "md",
+    },
+});
+const Avatar = React.forwardRef(({ className, size, ...props }, ref) => (jsxRuntimeExports.jsx("div", { ref: ref, className: cn(avatarVariants({ size }), className), ...props })));
+Avatar.displayName = "Avatar";
+const AvatarImage = React.forwardRef(({ className, ...props }, ref) => (jsxRuntimeExports.jsx("img", { ref: ref, className: cn("aspect-square h-full w-full object-cover", className), ...props })));
+AvatarImage.displayName = "AvatarImage";
+const AvatarFallback = React.forwardRef(({ className, ...props }, ref) => (jsxRuntimeExports.jsx("div", { ref: ref, className: cn("flex h-full w-full items-center justify-center rounded-full bg-gray-100 text-gray-600 font-medium", className), ...props })));
+AvatarFallback.displayName = "AvatarFallback";
+
+export { Avatar, AvatarFallback, AvatarImage, avatarVariants };
+//# sourceMappingURL=Avatar.js.map

package/dist/components/Avatar/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../utils/cn\";\n\nconst avatarVariants = cva(\n  \"relative flex shrink-0 overflow-hidden rounded-full\",\n  {\n    variants: {\n      size: {\n        sm: \"h-8 w-8\",\n        md: \"h-10 w-10\",\n        lg: \"h-16 w-16\",\n        xl: \"h-20 w-20\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n);\n\nconst Avatar = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof avatarVariants>\n>(({ className, size, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(avatarVariants({ size }), className)}\n    {...props}\n  />\n));\nAvatar.displayName = \"Avatar\";\n\nconst AvatarImage = React.forwardRef<\n  HTMLImageElement,\n  React.ImgHTMLAttributes<HTMLImageElement>\n>(({ className, ...props }, ref) => (\n  <img\n    ref={ref}\n    className={cn(\"aspect-square h-full w-full object-cover\", className)}\n    {...props}\n  />\n));\nAvatarImage.displayName = \"AvatarImage\";\n\nconst AvatarFallback = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      \"flex h-full w-full items-center justify-center rounded-full bg-gray-100 text-gray-600 font-medium\",\n      className\n    )}\n    {...props}\n  />\n));\nAvatarFallback.displayName = \"AvatarFallback\";\n\nexport { Avatar, AvatarImage, AvatarFallback, avatarVariants };"],"names":["_jsx"],"mappings":";;;;;AAIA,MAAM,cAAc,GAAG,GAAG,CACxB,qDAAqD,EACrD;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,SAAS;AACb,YAAA,EAAE,EAAE,WAAW;AACf,YAAA,EAAE,EAAE,WAAW;AACf,YAAA,EAAE,EAAE,WAAW;AAChB,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,IAAI,EAAE,IAAI;AACX,KAAA;AACF,CAAA;AAGH,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAG7B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACnCA,qBAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,EAAA,GAC9C,KAAK,EAAA,CACT,CACH;AACD,MAAM,CAAC,WAAW,GAAG,QAAQ;AAE7B,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MAC7BA,qBAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,0CAA0C,EAAE,SAAS,CAAC,EAAA,GAChE,KAAK,EAAA,CACT,CACH;AACD,WAAW,CAAC,WAAW,GAAG,aAAa;AAEvC,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAGrC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MAC7BA,qBAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,mGAAmG,EACnG,SAAS,CACV,EAAA,GACG,KAAK,EAAA,CACT,CACH;AACD,cAAc,CAAC,WAAW,GAAG,gBAAgB;;;;"}

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

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

package/dist/components/Avatar/index.js

@@ -0,0 +1,2 @@
+export { Avatar, AvatarFallback, AvatarImage, avatarVariants } from './Avatar.js';
+//# sourceMappingURL=index.js.map

package/dist/components/Avatar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Badge/Badge.d.ts

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

package/dist/components/Badge/Badge.js

@@ -0,0 +1,25 @@
+import { j as jsxRuntimeExports } from '../../_virtual/jsx-runtime.js';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../utils/cn.js';
+
+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-primary-500 focus:ring-offset-2", {
+    variants: {
+        variant: {
+            default: "border-transparent bg-primary-600 text-white hover:bg-primary-700",
+            secondary: "border-transparent bg-secondary-600 text-white hover:bg-secondary-700",
+            success: "border-transparent bg-success-600 text-white hover:bg-success-700",
+            danger: "border-transparent bg-danger-600 text-white hover:bg-danger-700",
+            warning: "border-transparent bg-warning-600 text-white hover:bg-warning-700",
+            outline: "text-gray-700 border-gray-300",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function Badge({ className, variant, ...props }) {
+    return (jsxRuntimeExports.jsx("div", { className: cn(badgeVariants({ variant }), className), ...props }));
+}
+
+export { Badge, badgeVariants };
+//# sourceMappingURL=Badge.js.map

package/dist/components/Badge/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../utils/cn\";\n\nconst badgeVariants = cva(\n  \"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-primary-500 focus:ring-offset-2\",\n  {\n    variants: {\n      variant: {\n        default: \"border-transparent bg-primary-600 text-white hover:bg-primary-700\",\n        secondary: \"border-transparent bg-secondary-600 text-white hover:bg-secondary-700\",\n        success: \"border-transparent bg-success-600 text-white hover:bg-success-700\",\n        danger: \"border-transparent bg-danger-600 text-white hover:bg-danger-700\",\n        warning: \"border-transparent bg-warning-600 text-white hover:bg-warning-700\",\n        outline: \"text-gray-700 border-gray-300\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n);\n\nexport interface BadgeProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof badgeVariants> {}\n\nfunction Badge({ className, variant, ...props }: BadgeProps) {\n  return (\n    <div className={cn(badgeVariants({ variant }), className)} {...props} />\n  );\n}\n\nexport { Badge, badgeVariants };"],"names":["_jsx"],"mappings":";;;;AAIA,MAAM,aAAa,GAAG,GAAG,CACvB,+KAA+K,EAC/K;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,mEAAmE;AAC5E,YAAA,SAAS,EAAE,uEAAuE;AAClF,YAAA,OAAO,EAAE,mEAAmE;AAC5E,YAAA,MAAM,EAAE,iEAAiE;AACzE,YAAA,OAAO,EAAE,mEAAmE;AAC5E,YAAA,OAAO,EAAE,+BAA+B;AACzC,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,OAAO,EAAE,SAAS;AACnB,KAAA;AACF,CAAA;AAOH,SAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAc,EAAA;AACzD,IAAA,QACEA,qBAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,KAAM,KAAK,EAAA,CAAI;AAE5E;;;;"}

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

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

package/dist/components/Badge/index.js

@@ -0,0 +1,2 @@
+export { Badge, badgeVariants } from './Badge.js';
+//# sourceMappingURL=index.js.map

package/dist/components/Badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const buttonVariants: (props?: ({
+    variant?: "success" | "warning" | "danger" | "link" | "secondary" | "outline" | "primary" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };

package/dist/components/Button/Button.js

@@ -0,0 +1,38 @@
+import { j as jsxRuntimeExports } from '../../_virtual/jsx-runtime.js';
+import * as React from 'react';
+import { Root as Slot } from '../../node_modules/@radix-ui/react-slot/dist/index.js';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../utils/cn.js';
+
+const buttonVariants = cva("inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-white transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", {
+    variants: {
+        variant: {
+            primary: "bg-primary-600 text-white hover:bg-primary-700",
+            secondary: "bg-secondary-600 text-white hover:bg-secondary-700",
+            danger: "bg-danger-600 text-white hover:bg-danger-700",
+            success: "bg-success-600 text-white hover:bg-success-700",
+            warning: "bg-warning-600 text-white hover:bg-warning-700",
+            outline: "border border-primary-300 bg-white hover:bg-primary-50",
+            ghost: "bg-transparent hover:bg-primary-50",
+            link: "text-primary-600 underline-offset-4 hover:underline",
+        },
+        size: {
+            sm: "h-8 px-3 text-xs",
+            md: "h-10 px-4 py-2",
+            lg: "h-11 px-8",
+            xl: "h-12 px-10 text-base",
+        },
+    },
+    defaultVariants: {
+        variant: "primary",
+        size: "md",
+    },
+});
+const Button = React.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return (jsxRuntimeExports.jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref: ref, ...props }));
+});
+Button.displayName = "Button";
+
+export { Button, buttonVariants };
+//# sourceMappingURL=Button.js.map

package/dist/components/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../../utils/cn\";\n\nconst buttonVariants = cva(\n  \"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-white transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50\",\n  {\n    variants: {\n      variant: {\n        primary: \"bg-primary-600 text-white hover:bg-primary-700\",\n        secondary: \"bg-secondary-600 text-white hover:bg-secondary-700\",\n        danger: \"bg-danger-600 text-white hover:bg-danger-700\",\n        success: \"bg-success-600 text-white hover:bg-success-700\",\n        warning: \"bg-warning-600 text-white hover:bg-warning-700\",\n        outline: \"border border-primary-300 bg-white hover:bg-primary-50\",\n        ghost: \"bg-transparent hover:bg-primary-50\",\n        link: \"text-primary-600 underline-offset-4 hover:underline\",\n      },\n      size: {\n        sm: \"h-8 px-3 text-xs\",\n        md: \"h-10 px-4 py-2\",\n        lg: \"h-11 px-8\",\n        xl: \"h-12 px-10 text-base\",\n      },\n    },\n    defaultVariants: {\n      variant: \"primary\",\n      size: \"md\",\n    },\n  }\n);\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ className, variant, size, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"button\";\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, className }))}\n        ref={ref}\n        {...props}\n      />\n    );\n  }\n);\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };"],"names":["_jsx"],"mappings":";;;;;;AAKA,MAAM,cAAc,GAAG,GAAG,CACxB,0RAA0R,EAC1R;AACE,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,gDAAgD;AACzD,YAAA,SAAS,EAAE,oDAAoD;AAC/D,YAAA,MAAM,EAAE,8CAA8C;AACtD,YAAA,OAAO,EAAE,gDAAgD;AACzD,YAAA,OAAO,EAAE,gDAAgD;AACzD,YAAA,OAAO,EAAE,wDAAwD;AACjE,YAAA,KAAK,EAAE,oCAAoC;AAC3C,YAAA,IAAI,EAAE,qDAAqD;AAC5D,SAAA;AACD,QAAA,IAAI,EAAE;AACJ,YAAA,EAAE,EAAE,kBAAkB;AACtB,YAAA,EAAE,EAAE,gBAAgB;AACpB,YAAA,EAAE,EAAE,WAAW;AACf,YAAA,EAAE,EAAE,sBAAsB;AAC3B,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,OAAO,EAAE,SAAS;AAClB,QAAA,IAAI,EAAE,IAAI;AACX,KAAA;AACF,CAAA;AASH,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAC7B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,GAAG,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;IAC/D,MAAM,IAAI,GAAG,OAAO,GAAG,IAAI,GAAG,QAAQ;IACtC,QACEA,qBAAA,CAAC,IAAI,EAAA,EACH,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC,EAC3D,GAAG,EAAE,GAAG,EAAA,GACJ,KAAK,EAAA,CACT;AAEN,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

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

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

package/dist/components/Button/index.js

@@ -0,0 +1,2 @@
+export { Button, buttonVariants } from './Button.js';
+//# sourceMappingURL=index.js.map

package/dist/components/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}