@kubetail/ui 0.3.0 → 2.0.0-rc1

package/dist/index.css

@@ -1,106 +1,232 @@
-@plugin "@tailwindcss/forms";
+/**
+ * Shadcn theme
+ */
 
-@theme {
-  --color-accent: var(--color-amber-200);
-  --color-accent-foreground: var(--color-gray-800);
-  --color-background: var(--color-white);
-  --color-border: var(--color-gray-200);
-  --color-danger: var(--color-red-500);
-  --color-danger-foreground: var(--color-white);
-  --color-foreground: var(--color-gray-900);
-  --color-input: var(--color-gray-300);
-  --color-muted: var(--color-gray-100);
-  --color-muted-foreground: var(--color-gray-400);
-  --color-popover: var(--color-white);
-  --color-popover-foreground: var(--color-gray-900);
-  --color-primary: rgb(69 110 222);
-  --color-primary-foreground: var(--color-white);
-  --color-ring: var(--color-blue-400);
-  --color-secondary: var(--color-blue-100);
-  --color-secondary-foreground: var(--color-gray-800);
-  --color-chrome-50: var(--color-gray-50);
-  --color-chrome-100: var(--color-gray-100);
-  --color-chrome-200: var(--color-gray-200);
-  --color-chrome-300: var(--color-gray-300);
-  --color-chrome-400: var(--color-gray-400);
-  --color-chrome-500: var(--color-gray-500);
-  --color-chrome-600: var(--color-gray-600);
-  --color-chrome-700: var(--color-gray-700);
-  --color-chrome-800: var(--color-gray-800);
-  --color-chrome-900: var(--color-gray-900);
-  --color-chrome-950: var(--color-gray-950);
-  --color-chrome-foreground: var(--color-gray-800);
-  --color-chrome-foreground-muted: var(--color-gray-500);
-  --color-chrome-foreground-subtle: var(--color-gray-300);
-  --color-chrome-divider: var(--color-gray-300);
+:root, .light {
+  --background: var(--color-white);                           /* color-bg */
+  --foreground: var(--color-zinc-950);                        /* color-text */
+  --card: var(--color-white);
+  --card-foreground: var(--color-zinc-950);
+  --popover: var(--color-white);
+  --popover-foreground: var(--color-zinc-950);
+  --primary: var(--color-blue-700);                           /* color-bg-primary */
+  --primary-foreground: var(--color-white);                   /* color-text-on-color */
+  --secondary: var(--color-zinc-50);                          /* color-bg-secondary */
+  --secondary-foreground: var(--color-zinc-950);              /* color-text */
+  --muted: var(--color-zinc-50);                              /* color-bg-subtle */
+  --muted-foreground: var(--color-zinc-500);                  /* color-text-muted */
+  --accent: var(--color-blue-100);
+  --accent-foreground: var(--color-zinc-950);
+  --destructive: var(--color-red-500);                        /* color-bg-error-strong */
+  --destructive-foreground: var(--color-white);               /* color-text-on-color */ 
+  --border: var(--color-zinc-200);                            /* color-border */
+  --input: var(--color-zinc-200);                             /* color-border-input */
+  --ring: var(--color-blue-500);                              /* color-border-focusRing */
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --radius: 0.625rem;
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.205 0 0);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+}
 
-  --breakpoint-sm: 576px;
-  --breakpoint-md: 768px;
-  --breakooint-lg: 992px;
-  --breakpoint-xl: 1200px;
-  --breakpoint-2xl: 1400px;
+.dark {
+  --background: var(--color-zinc-950);                       /* color-bg */
+  --foreground: var(--color-zinc-50);                        /* color-text */
+  --card: var(--color-zinc-950);
+  --card-foreground: var(--color-white);
+  --popover: var(--color-zinc-950);
+  --popover-foreground: var(--color-white);
+  --primary: var(--color-blue-500);                          /* color-bg-primary */
+  --primary-foreground: var(--color-white);                  /* color-text-on-color */
+  --secondary: var(--color-zinc-600);                        /* color-bg-secondary */
+  --secondary-foreground: var(--color-zinc-50);              /* color-text */
+  --muted: var(--color-zinc-900);                            /* color-bg-subtle */
+  --muted-foreground: var(--color-zinc-400);                 /* color-text-muted */
+  --accent: var(--color-blue-900);
+  --accent-foreground: var(--color-white);
+  --destructive: var(--color-red-400);                       /* color-bg-error-strong */
+  --destructive-foreground: var(--color-zinc-50);            /* color-text */
+  --border: var(--color-zinc-700);                           /* color-border */
+  --input: var(--color-zinc-400);                            /* color-border-input */
+  --ring: var(--color-blue-500);                             /* color-border-focusRing */
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(0.269 0 0);
+  --sidebar-ring: oklch(0.439 0 0);
 }
 
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+}
+ 
 @layer base {
-  :root[class~="dark"] {
-    --color-accent: var(--color-amber-200);
-    --color-accent-foreground: var(--color-gray-800);
-    --color-background: var(--color-neutral-800);
-    --color-border: var(--color-gray-200);
-    --color-danger: var(--color-red-500);
-    --color-danger-foreground: var(--color-white);
-    --color-foreground: var(--color-white);
-    --color-input: var(--color-gray-300);
-    --color-muted: var(--color-gray-100);
-    --color-muted-foreground: var(--color-gray-600);
-    --color-popover: var(--color-neutral-800);
-    --color-popover-foreground: var(--color-white);
-    --color-primary: var(--color-blue-500);
-    --color-primary-foreground: var(--color-white);
-    --color-ring: var(--color-blue-600);
-    --color-secondary: var(--color-blue-100);
-    --color-secondary-foreground: var(--color-gray-800);
-    --color-chrome-50: var(--color-gray-950);
-    --color-chrome-100: var(--color-gray-900);
-    --color-chrome-200: var(--color-gray-800);
-    --color-chrome-300: var(--color-gray-700);
-    --color-chrome-400: var(--color-gray-600);
-    --color-chrome-500: var(--color-gray-500);
-    --color-chrome-600: var(--color-gray-400);
-    --color-chrome-700: var(--color-gray-300);
-    --color-chrome-800: var(--color-gray-200);
-    --color-chrome-900: var(--color-gray-100);
-    --color-chrome-950: var(--color-gray-50);
-    --color-chrome-foreground: var(--color.white);
-    --color-chrome-divider: var(--color-gray-700);
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
   }
 }
 
-@layer utilities {
-  .max-w-screen-sm  { max-width: 540px; }
-  .max-w-screen-md  { max-width: 720px; }
-  .max-w-screen-lg  { max-width: 960px; }
-  .max-w-screen-xl  { max-width: 1140px; }
-  .max-w-screen-2xl { max-width: 1320px; }
+/**
+ * Custom theme
+ */
+
+:root, .light {
+  --chrome-50: var(--color-gray-50);
+  --chrome-100: var(--color-gray-100);
+  --chrome-200: var(--color-gray-200);
+  --chrome-300: var(--color-gray-300);
+  --chrome-400: var(--color-gray-400);
+  --chrome-500: var(--color-gray-500);
+  --chrome-600: var(--color-gray-600);
+  --chrome-700: var(--color-gray-700);
+  --chrome-800: var(--color-gray-800);
+  --chrome-900: var(--color-gray-900);
+  --chrome-950: var(--color-gray-950);
 }
 
-/* Default styles */
-@layer base {
-  html {
-    @apply bg-background;
-    @apply text-foreground;
-  }
+.dark {
+  --chrome-50: var(--color-gray-950);
+  --chrome-100: var(--color-gray-900);
+  --chrome-200: var(--color-gray-800);
+  --chrome-300: var(--color-gray-700);
+  --chrome-400: var(--color-gray-600);
+  --chrome-500: var(--color-gray-500);
+  --chrome-600: var(--color-gray-400);
+  --chrome-700: var(--color-gray-300);
+  --chrome-800: var(--color-gray-200);
+  --chrome-900: var(--color-gray-100);
+  --chrome-950: var(--color-gray-50);
+}
+
+@theme inline {
+  --color-chrome-50: var(--chrome-50);
+  --color-chrome-100: var(--chrome-100);
+  --color-chrome-200: var(--chrome-200);
+  --color-chrome-300: var(--chrome-300);
+  --color-chrome-400: var(--chrome-400);
+  --color-chrome-500: var(--chrome-500);
+  --color-chrome-600: var(--chrome-600);
+  --color-chrome-700: var(--chrome-700);
+  --color-chrome-800: var(--chrome-800);
+  --color-chrome-900: var(--chrome-900);
+  --color-chrome-950: var(--chrome-950);
 
+  /* text */
+  --text-base: 1rem;
+  --text-base--line-height: calc(1.5 / 1);
+  --text-xs: 0.75rem;
+  --text-xs--line-height: calc(1 / 0.75);
+  --text-sm: 0.875rem;
+  --text-sm--line-height: calc(1.25 / 0.875);
+  --text-md: var(--text-base);
+  --text-md--line-height: var(--text-base--line-height);
+  --text-lg: 1.125rem;
+  --text-lg--line-height: calc(1.875 / 1.125);
+  --text-xl: 1.25rem;
+  --text-xl--line-height: calc(2 / 1.25);
+  --text-2xl: 1.5rem;
+  --text-2xl--line-height: calc(2.375 / 1.5);
+
+  /* text-heading */
+  --text-heading-base: 1rem;
+  --text-heading-base--line-height: 1.5rem;
+  --text-heading-base--font-weight: 500;
+  --text-heading-sm: 0.875rem;
+  --text-heading-sm--line-height: 1.25rem;
+  --text-heading-sm--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-md: var(--text-heading-base);
+  --text-heading-md--line-height: var(--text-heading-base--line-height);
+  --text-heading-md--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-lg: 1.125rem;
+  --text-heading-lg--line-height: 1.875rem;
+  --text-heading-lg--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-xl: 1.25rem;
+  --text-heading-xl--line-height: 2rem;
+  --text-heading-xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-2xl: 1.5rem;
+  --text-heading-2xl--line-height: 2.375rem;
+  --text-heading-2xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-3xl: 1.875rem;
+  --text-heading-3xl--line-height: 2.625rem;
+  --text-heading-3xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-4xl: 2.25rem;
+  --text-heading-4xl--line-height: 3.25rem;
+  --text-heading-4xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-5xl: 3rem;
+  --text-heading-5xl--line-height: 4.5rem;
+  --text-heading-5xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-6xl: 3.75rem;
+  --text-heading-6xl--line-height: 5.375rem;
+  --text-heading-6xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-7xl: 4.5rem;
+  --text-heading-7xl--line-height: 6.75rem;
+  --text-heading-7xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-8xl: 6rem;
+  --text-heading-8xl--line-height: 9rem;
+  --text-heading-8xl--font-weight: var(--text-heading-base--font-weight);
+  --text-heading-9xl: 8rem;
+  --text-heading-9xl--line-height: 12rem;
+  --text-heading-9xl--font-weight: var(--text-heading-base--font-weight);
+}
+
+@layer base {
   body {
     @apply antialiased;
     font-feature-settings: "rlig" 1, "calt" 1;
   }
-
-  .border {
-    @apply border-border;
-  }
-
-  .ring {
-    @apply ring-ring;
-  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubetail/ui",
-  "version": "v0.3.0",
+  "version": "v2.0.0-rc1",
   "type": "module",
   "sideEffects": false,
   "module": "./dist/index.js",
@@ -30,35 +30,40 @@
     "/dist"
   ],
   "peerDependencies": {
-    "@heroicons/react": "^2",
+    "@radix-ui/react-checkbox": "^1",
     "@radix-ui/react-dropdown-menu": "^2",
+    "@radix-ui/react-label": "^2",
     "@radix-ui/react-popover": "^1",
+    "@radix-ui/react-select": "^2",
     "@radix-ui/react-slot": "^1",
     "@radix-ui/react-tabs": "^1",
-    "@restart/ui": "^1",
     "lucide-react": "*",
     "react": "^19",
-    "react-dom": "^19",
     "react-day-picker": "^9",
+    "react-dom": "^19",
+    "react-hook-form": "^7",
     "tailwindcss": "^4"
   },
   "peerDependenciesMeta": {
-    "@heroicons/react": {
+    "@radix-ui/react-checkbox": {
       "optional": true
     },
     "@radix-ui/react-dropdown-menu": {
       "optional": true
     },
+    "@radix-ui/react-label": {
+      "optional": true
+    },
     "@radix-ui/react-popover": {
       "optional": true
     },
     "@radix-ui/react-slot": {
       "optional": true
     },
-    "@radix-ui/react-tabs": {
+    "@radix-ui/react-select": {
       "optional": true
     },
-    "@restart/ui": {
+    "@radix-ui/react-tabs": {
       "optional": true
     },
     "lucide-react": {
@@ -66,6 +71,9 @@
     },
     "react-day-picker": {
       "optional": true
+    },
+    "react-hook-form": {
+      "optional": true
     }
   },
   "devDependencies": {
@@ -73,13 +81,14 @@
     "@eslint/compat": "^1.3.0",
     "@eslint/js": "^9.28.0",
     "@fontsource-variable/roboto-flex": "^5.2.6",
-    "@heroicons/react": "^2.2.0",
     "@microsoft/api-extractor": "^7.52.8",
+    "@radix-ui/react-checkbox": "^1.3.2",
     "@radix-ui/react-dropdown-menu": "^2.1.15",
+    "@radix-ui/react-label": "^2.1.7",
     "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-select": "^2.2.5",
     "@radix-ui/react-slot": "^1.2.3",
     "@radix-ui/react-tabs": "^1.1.12",
-    "@restart/ui": "^1.9.4",
     "@storybook/addon-docs": "^9.0.9",
     "@storybook/addon-links": "^9.0.9",
     "@storybook/addon-themes": "^9.0.9",
@@ -95,9 +104,8 @@
     "@types/rollup-plugin-auto-external": "^2.0.5",
     "@vitejs/plugin-react-swc": "^3.10.2",
     "@vueless/storybook-dark-mode": "^9.0.5",
-    "date-fns": "^4.1.0",
     "eslint": "^9.28.0",
-    "eslint-config-airbnb-extended": "^1.0.11",
+    "eslint-config-airbnb-extended": "^2.1.2",
     "eslint-config-prettier": "^10.1.5",
     "eslint-import-resolver-typescript": "^4.4.3",
     "eslint-plugin-import-x": "^4.15.2",
@@ -111,20 +119,21 @@
     "jsdom": "^26.1.0",
     "lucide-react": "^0.515.0",
     "prettier": "^3.5.3",
-    "react-day-picker": "^9.7.0",
+    "react-day-picker": "^9.8.1",
+    "react-docgen-typescript": "^2.4.0",
+    "react-hook-form": "^7.61.1",
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-copy": "^3.5.0",
     "storybook": "^9.0.9",
     "tslib": "^2.8.1",
     "typescript": "5.8.3",
     "typescript-eslint": "^8.34.0",
-    "unplugin-dts": "1.0.0-beta.0",
+    "unplugin-dts": "1.0.0-beta.3",
     "unplugin-fonts": "^1.3.1",
     "vite": "^6.3.5",
     "vitest": "^3.2.3"
   },
   "dependencies": {
-    "@tailwindcss/forms": "^0.5.10",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "tailwind-merge": "^3.3.1"

package/dist/elements/Alert.cjs

@@ -1,2 +0,0 @@
-"use strict";const e=require("react/jsx-runtime"),l=require("@heroicons/react/24/solid"),t=({children:s})=>e.jsx("div",{className:"rounded-md bg-yellow-50 p-4",children:e.jsxs("div",{className:"flex",children:[e.jsx("div",{className:"flex-shrink-0",children:e.jsx(l.ExclamationTriangleIcon,{className:"h-5 w-5 text-yellow-400","aria-hidden":"true"})}),e.jsxs("div",{className:"ml-3",children:[e.jsx("h3",{className:"text-sm font-medium text-yellow-800",children:"Attention"}),e.jsx("div",{className:"mt-2 text-sm text-yellow-700",children:e.jsx("div",{children:s})})]})]})});module.exports=t;
-//# sourceMappingURL=Alert.cjs.map

package/dist/elements/Alert.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Alert.cjs","sources":["../../src/elements/Alert.tsx"],"sourcesContent":["// Copyright 2024-2025 Andres Morey\n//\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n//     http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ExclamationTriangleIcon } from '@heroicons/react/24/solid';\nimport type { ReactNode } from 'react';\n\ntype Props = {\n  children?: ReactNode;\n};\n\n/**\n * UI component for displaying alerts\n */\nconst Alert = ({ children }: Props) => (\n  <div className=\"rounded-md bg-yellow-50 p-4\">\n    <div className=\"flex\">\n      <div className=\"flex-shrink-0\">\n        <ExclamationTriangleIcon className=\"h-5 w-5 text-yellow-400\" aria-hidden=\"true\" />\n      </div>\n      <div className=\"ml-3\">\n        <h3 className=\"text-sm font-medium text-yellow-800\">Attention</h3>\n        <div className=\"mt-2 text-sm text-yellow-700\">\n          <div>{children}</div>\n        </div>\n      </div>\n    </div>\n  </div>\n);\n\nexport default Alert;\n"],"names":["Alert","children","jsx","jsxs","ExclamationTriangleIcon"],"mappings":"yFAwBMA,EAAQ,CAAC,CAAE,SAAAC,CAAA,IACfC,EAAAA,IAAC,MAAA,CAAI,UAAU,8BACb,SAAAC,EAAAA,KAAC,MAAA,CAAI,UAAU,OACb,SAAA,CAAAD,EAAAA,IAAC,MAAA,CAAI,UAAU,gBACb,SAAAA,EAAAA,IAACE,2BAAwB,UAAU,0BAA0B,cAAY,MAAA,CAAO,CAAA,CAClF,EACAD,EAAAA,KAAC,MAAA,CAAI,UAAU,OACb,SAAA,CAAAD,EAAAA,IAAC,KAAA,CAAG,UAAU,sCAAsC,SAAA,YAAS,QAC5D,MAAA,CAAI,UAAU,+BACb,SAAAA,EAAAA,IAAC,MAAA,CAAK,SAAAD,EAAS,CAAA,CACjB,CAAA,CAAA,CACF,CAAA,CAAA,CACF,CAAA,CACF"}

package/dist/elements/Alert.d.ts

@@ -1,9 +0,0 @@
-import { ReactNode } from 'react';
-type Props = {
-    children?: ReactNode;
-};
-/**
- * UI component for displaying alerts
- */
-declare const Alert: ({ children }: Props) => import("react/jsx-runtime").JSX.Element;
-export default Alert;

package/dist/elements/Alert.js

@@ -1,13 +0,0 @@
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import { ExclamationTriangleIcon as s } from "@heroicons/react/24/solid";
-const d = ({ children: t }) => /* @__PURE__ */ e("div", { className: "rounded-md bg-yellow-50 p-4", children: /* @__PURE__ */ l("div", { className: "flex", children: [
-  /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e(s, { className: "h-5 w-5 text-yellow-400", "aria-hidden": "true" }) }),
-  /* @__PURE__ */ l("div", { className: "ml-3", children: [
-    /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-yellow-800", children: "Attention" }),
-    /* @__PURE__ */ e("div", { className: "mt-2 text-sm text-yellow-700", children: /* @__PURE__ */ e("div", { children: t }) })
-  ] })
-] }) });
-export {
-  d as default
-};
-//# sourceMappingURL=Alert.js.map

package/dist/elements/Alert.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Alert.js","sources":["../../src/elements/Alert.tsx"],"sourcesContent":["// Copyright 2024-2025 Andres Morey\n//\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n//     http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ExclamationTriangleIcon } from '@heroicons/react/24/solid';\nimport type { ReactNode } from 'react';\n\ntype Props = {\n  children?: ReactNode;\n};\n\n/**\n * UI component for displaying alerts\n */\nconst Alert = ({ children }: Props) => (\n  <div className=\"rounded-md bg-yellow-50 p-4\">\n    <div className=\"flex\">\n      <div className=\"flex-shrink-0\">\n        <ExclamationTriangleIcon className=\"h-5 w-5 text-yellow-400\" aria-hidden=\"true\" />\n      </div>\n      <div className=\"ml-3\">\n        <h3 className=\"text-sm font-medium text-yellow-800\">Attention</h3>\n        <div className=\"mt-2 text-sm text-yellow-700\">\n          <div>{children}</div>\n        </div>\n      </div>\n    </div>\n  </div>\n);\n\nexport default Alert;\n"],"names":["Alert","children","jsx","jsxs","ExclamationTriangleIcon"],"mappings":";;AAwBA,MAAMA,IAAQ,CAAC,EAAE,UAAAC,EAAA,MACf,gBAAAC,EAAC,OAAA,EAAI,WAAU,+BACb,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,QACb,UAAA;AAAA,EAAA,gBAAAD,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA,EAACE,KAAwB,WAAU,2BAA0B,eAAY,OAAA,CAAO,EAAA,CAClF;AAAA,EACA,gBAAAD,EAAC,OAAA,EAAI,WAAU,QACb,UAAA;AAAA,IAAA,gBAAAD,EAAC,MAAA,EAAG,WAAU,uCAAsC,UAAA,aAAS;AAAA,sBAC5D,OAAA,EAAI,WAAU,gCACb,UAAA,gBAAAA,EAAC,OAAA,EAAK,UAAAD,GAAS,EAAA,CACjB;AAAA,EAAA,EAAA,CACF;AAAA,EAAA,CACF,EAAA,CACF;"}

package/dist/elements/Alert.stories.d.ts

@@ -1,11 +0,0 @@
-import { StoryObj } from '@storybook/react-vite';
-declare const meta: {
-    title: string;
-    component: ({ children }: {
-        children?: import('react').ReactNode;
-    }) => import("react/jsx-runtime").JSX.Element;
-    tags: string[];
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;

package/dist/elements/Button.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react/jsx-runtime"),g=require("@restart/ui/Button"),m=require("class-variance-authority"),l=require("react"),b=require("../lib/utils.cjs"),r=m.cva("uppercase inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",{variants:{intent:{primary:"bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm",secondary:"bg-secondary text-secondary-foreground hover:bg-secondary/60 shadow-sm",danger:"bg-danger text-danger-foreground hover:bg-danger/90 shadow-sm",outline:"border border-input bg-background hover:bg-secondary hover:text-secondary-foreground",ghost:"hover:bg-secondary hover:text-secondary-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{xs:"px-2.5 py-1.5 text-xs rounded",sm:"px-3 py-2 text-xs rounded-md",md:"px-4 py-2 text-sm rounded-md",lg:"px-4 py-2 text-base rounded-md",xl:"px-6 py-3 text-base rounded-md"}},defaultVariants:{intent:"primary",size:"md"}}),t=l.forwardRef(({as:n,children:o,className:s,disabled:a,...e},i)=>{const[d,{tagName:u}]=g.useButtonProps({tagName:n,disabled:a,...e});return c.jsx(u,{...e,...d,ref:i,className:b.cn(r(e),s),children:o})});t.displayName="Button";exports.buttonVariants=r;exports.default=t;
-//# sourceMappingURL=Button.cjs.map

package/dist/elements/Button.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.cjs","sources":["../../src/elements/Button.tsx"],"sourcesContent":["// Copyright 2024-2025 Andres Morey\n//\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n//     http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useButtonProps } from '@restart/ui/Button';\nimport type { ButtonProps } from '@restart/ui/Button';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { forwardRef } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nexport type ButtonVariantProps = VariantProps<typeof buttonVariants>;\n\nexport const buttonVariants = cva(\n  'uppercase inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      intent: {\n        primary: 'bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm',\n        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/60 shadow-sm',\n        danger: 'bg-danger text-danger-foreground hover:bg-danger/90 shadow-sm',\n        outline: 'border border-input bg-background hover:bg-secondary hover:text-secondary-foreground',\n        ghost: 'hover:bg-secondary hover:text-secondary-foreground',\n        link: 'text-primary underline-offset-4 hover:underline',\n      },\n      size: {\n        xs: 'px-2.5 py-1.5 text-xs rounded',\n        sm: 'px-3 py-2 text-xs rounded-md',\n        md: 'px-4 py-2 text-sm rounded-md',\n        lg: 'px-4 py-2 text-base rounded-md',\n        xl: 'px-6 py-3 text-base rounded-md',\n      },\n    },\n    defaultVariants: {\n      intent: 'primary',\n      size: 'md',\n    },\n  },\n);\n\nconst Button = forwardRef(({ as, children, className, disabled, ...props }: ButtonProps & ButtonVariantProps, ref) => {\n  const [ariaButtonProps, { tagName: Tag }] = useButtonProps({\n    tagName: as,\n    disabled,\n    ...props,\n  });\n\n  return (\n    <Tag {...props} {...ariaButtonProps} ref={ref} className={cn(buttonVariants(props), className)}>\n      {children}\n    </Tag>\n  );\n});\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["buttonVariants","cva","Button","forwardRef","as","children","className","disabled","props","ref","ariaButtonProps","Tag","useButtonProps","jsx","cn"],"mappings":"wQAuBaA,EAAiBC,EAAAA,IAC5B,mSACA,CACE,SAAU,CACR,OAAQ,CACN,QAAS,mEACT,UAAW,yEACX,OAAQ,gEACR,QAAS,uFACT,MAAO,qDACP,KAAM,iDAAA,EAER,KAAM,CACJ,GAAI,gCACJ,GAAI,+BACJ,GAAI,+BACJ,GAAI,iCACJ,GAAI,gCAAA,CACN,EAEF,gBAAiB,CACf,OAAQ,UACR,KAAM,IAAA,CACR,CAEJ,EAEMC,EAASC,EAAAA,WAAW,CAAC,CAAE,GAAAC,EAAI,SAAAC,EAAU,UAAAC,EAAW,SAAAC,EAAU,GAAGC,CAAA,EAA2CC,IAAQ,CACpH,KAAM,CAACC,EAAiB,CAAE,QAASC,CAAA,CAAK,EAAIC,EAAAA,eAAe,CACzD,QAASR,EACT,SAAAG,EACA,GAAGC,CAAA,CACJ,EAED,OACEK,EAAAA,IAACF,EAAA,CAAK,GAAGH,EAAQ,GAAGE,EAAiB,IAAAD,EAAU,UAAWK,EAAAA,GAAGd,EAAeQ,CAAK,EAAGF,CAAS,EAC1F,SAAAD,CAAA,CACH,CAEJ,CAAC,EAEDH,EAAO,YAAc"}

package/dist/elements/Button.d.ts

@@ -1,9 +0,0 @@
-import { ButtonProps } from '@restart/ui/Button';
-import { VariantProps } from 'class-variance-authority';
-export type ButtonVariantProps = VariantProps<typeof buttonVariants>;
-export declare const buttonVariants: (props?: ({
-    intent?: "link" | "primary" | "secondary" | "danger" | "outline" | "ghost" | null | undefined;
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-declare const Button: import('react').ForwardRefExoticComponent<ButtonProps & ButtonVariantProps & import('react').RefAttributes<unknown>>;
-export default Button;

package/dist/elements/Button.js

@@ -1,44 +0,0 @@
-import { jsx as i } from "react/jsx-runtime";
-import { useButtonProps as m } from "@restart/ui/Button";
-import { cva as u } from "class-variance-authority";
-import { forwardRef as g } from "react";
-import { cn as p } from "../lib/utils.js";
-const f = u(
-  "uppercase inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
-  {
-    variants: {
-      intent: {
-        primary: "bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/60 shadow-sm",
-        danger: "bg-danger text-danger-foreground hover:bg-danger/90 shadow-sm",
-        outline: "border border-input bg-background hover:bg-secondary hover:text-secondary-foreground",
-        ghost: "hover:bg-secondary hover:text-secondary-foreground",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        xs: "px-2.5 py-1.5 text-xs rounded",
-        sm: "px-3 py-2 text-xs rounded-md",
-        md: "px-4 py-2 text-sm rounded-md",
-        lg: "px-4 py-2 text-base rounded-md",
-        xl: "px-6 py-3 text-base rounded-md"
-      }
-    },
-    defaultVariants: {
-      intent: "primary",
-      size: "md"
-    }
-  }
-), c = g(({ as: r, children: o, className: t, disabled: n, ...e }, s) => {
-  const [a, { tagName: d }] = m({
-    tagName: r,
-    disabled: n,
-    ...e
-  });
-  return /* @__PURE__ */ i(d, { ...e, ...a, ref: s, className: p(f(e), t), children: o });
-});
-c.displayName = "Button";
-export {
-  f as buttonVariants,
-  c as default
-};
-//# sourceMappingURL=Button.js.map

package/dist/elements/Button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.js","sources":["../../src/elements/Button.tsx"],"sourcesContent":["// Copyright 2024-2025 Andres Morey\n//\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n//     http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useButtonProps } from '@restart/ui/Button';\nimport type { ButtonProps } from '@restart/ui/Button';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { forwardRef } from 'react';\n\nimport { cn } from '@/lib/utils';\n\nexport type ButtonVariantProps = VariantProps<typeof buttonVariants>;\n\nexport const buttonVariants = cva(\n  'uppercase inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      intent: {\n        primary: 'bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm',\n        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/60 shadow-sm',\n        danger: 'bg-danger text-danger-foreground hover:bg-danger/90 shadow-sm',\n        outline: 'border border-input bg-background hover:bg-secondary hover:text-secondary-foreground',\n        ghost: 'hover:bg-secondary hover:text-secondary-foreground',\n        link: 'text-primary underline-offset-4 hover:underline',\n      },\n      size: {\n        xs: 'px-2.5 py-1.5 text-xs rounded',\n        sm: 'px-3 py-2 text-xs rounded-md',\n        md: 'px-4 py-2 text-sm rounded-md',\n        lg: 'px-4 py-2 text-base rounded-md',\n        xl: 'px-6 py-3 text-base rounded-md',\n      },\n    },\n    defaultVariants: {\n      intent: 'primary',\n      size: 'md',\n    },\n  },\n);\n\nconst Button = forwardRef(({ as, children, className, disabled, ...props }: ButtonProps & ButtonVariantProps, ref) => {\n  const [ariaButtonProps, { tagName: Tag }] = useButtonProps({\n    tagName: as,\n    disabled,\n    ...props,\n  });\n\n  return (\n    <Tag {...props} {...ariaButtonProps} ref={ref} className={cn(buttonVariants(props), className)}>\n      {children}\n    </Tag>\n  );\n});\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["buttonVariants","cva","Button","forwardRef","as","children","className","disabled","props","ref","ariaButtonProps","Tag","useButtonProps","jsx","cn"],"mappings":";;;;;AAuBO,MAAMA,IAAiBC;AAAA,EAC5B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,QAAQ;AAAA,QACN,SAAS;AAAA,QACT,WAAW;AAAA,QACX,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,MAAA;AAAA,MAER,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,iBAAiB;AAAA,MACf,QAAQ;AAAA,MACR,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ,GAEMC,IAASC,EAAW,CAAC,EAAE,IAAAC,GAAI,UAAAC,GAAU,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAA2CC,MAAQ;AACpH,QAAM,CAACC,GAAiB,EAAE,SAASC,EAAA,CAAK,IAAIC,EAAe;AAAA,IACzD,SAASR;AAAA,IACT,UAAAG;AAAA,IACA,GAAGC;AAAA,EAAA,CACJ;AAED,SACE,gBAAAK,EAACF,GAAA,EAAK,GAAGH,GAAQ,GAAGE,GAAiB,KAAAD,GAAU,WAAWK,EAAGd,EAAeQ,CAAK,GAAGF,CAAS,GAC1F,UAAAD,EAAA,CACH;AAEJ,CAAC;AAEDH,EAAO,cAAc;"}

package/dist/elements/Button.stories.d.ts

@@ -1,15 +0,0 @@
-import { StoryObj } from '@storybook/react-vite';
-import { ButtonVariantProps } from './Button';
-declare const meta: {
-    title: string;
-    tags: string[];
-    component: import('react').ForwardRefExoticComponent<import('@restart/ui/Button').ButtonProps & ButtonVariantProps & import('react').RefAttributes<unknown>>;
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Primary: Story;
-export declare const Secondary: Story;
-export declare const Danger: Story;
-export declare const Outline: Story;
-export declare const Ghost: Story;
-export declare const Link: Story;

package/dist/elements/Calendar.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),r=require("react-day-picker"),u=require("../lib/utils.cjs");function c({className:t,showOutsideDays:o=!0,...a}){const e=r.getDefaultClassNames();return n.jsx(r.DayPicker,{mode:"single",showOutsideDays:o,classNames:{today:"bg-accent text-accent-foreground",selected:"bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",root:u.cn(e.root,t),chevron:`${e.chevron} fill-amber-500`,weekday:"text-muted-foreground font-normal text-sm",day_selected:"bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",day_today:"bg-accent text-accent-foreground",outside:"text-muted-foreground"},...a})}exports.Calendar=c;
-//# sourceMappingURL=Calendar.cjs.map

package/dist/elements/Calendar.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Calendar.cjs","sources":["../../src/elements/Calendar.tsx"],"sourcesContent":["import { DayPicker, getDefaultClassNames } from 'react-day-picker';\n\nimport { cn } from '@/lib/utils';\n\nexport type CalendarProps = React.ComponentProps<typeof DayPicker>;\n\nexport function Calendar({ className, showOutsideDays = true, ...props }: CalendarProps) {\n  const defaultClassNames = getDefaultClassNames();\n  return (\n    <DayPicker\n      mode=\"single\"\n      showOutsideDays={showOutsideDays}\n      classNames={{\n        today: 'bg-accent text-accent-foreground',\n        selected:\n          'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',\n        root: cn(defaultClassNames.root, className),\n        chevron: `${defaultClassNames.chevron} fill-amber-500`,\n        weekday: 'text-muted-foreground font-normal text-sm',\n        day_selected:\n          'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',\n        day_today: 'bg-accent text-accent-foreground',\n        outside: 'text-muted-foreground',\n      }}\n      {...props}\n    />\n  );\n}\n"],"names":["Calendar","className","showOutsideDays","props","defaultClassNames","getDefaultClassNames","jsx","DayPicker","cn"],"mappings":"iLAMO,SAASA,EAAS,CAAE,UAAAC,EAAW,gBAAAC,EAAkB,GAAM,GAAGC,GAAwB,CACvF,MAAMC,EAAoBC,EAAAA,qBAAA,EAC1B,OACEC,EAAAA,IAACC,EAAAA,UAAA,CACC,KAAK,SACL,gBAAAL,EACA,WAAY,CACV,MAAO,mCACP,SACE,mIACF,KAAMM,EAAAA,GAAGJ,EAAkB,KAAMH,CAAS,EAC1C,QAAS,GAAGG,EAAkB,OAAO,kBACrC,QAAS,4CACT,aACE,mIACF,UAAW,mCACX,QAAS,uBAAA,EAEV,GAAGD,CAAA,CAAA,CAGV"}

package/dist/elements/Calendar.d.ts

@@ -1,3 +0,0 @@
-import { DayPicker } from 'react-day-picker';
-export type CalendarProps = React.ComponentProps<typeof DayPicker>;
-export declare function Calendar({ className, showOutsideDays, ...props }: CalendarProps): import("react/jsx-runtime").JSX.Element;

package/dist/elements/Calendar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Calendar.js","sources":["../../src/elements/Calendar.tsx"],"sourcesContent":["import { DayPicker, getDefaultClassNames } from 'react-day-picker';\n\nimport { cn } from '@/lib/utils';\n\nexport type CalendarProps = React.ComponentProps<typeof DayPicker>;\n\nexport function Calendar({ className, showOutsideDays = true, ...props }: CalendarProps) {\n  const defaultClassNames = getDefaultClassNames();\n  return (\n    <DayPicker\n      mode=\"single\"\n      showOutsideDays={showOutsideDays}\n      classNames={{\n        today: 'bg-accent text-accent-foreground',\n        selected:\n          'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',\n        root: cn(defaultClassNames.root, className),\n        chevron: `${defaultClassNames.chevron} fill-amber-500`,\n        weekday: 'text-muted-foreground font-normal text-sm',\n        day_selected:\n          'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',\n        day_today: 'bg-accent text-accent-foreground',\n        outside: 'text-muted-foreground',\n      }}\n      {...props}\n    />\n  );\n}\n"],"names":["Calendar","className","showOutsideDays","props","defaultClassNames","getDefaultClassNames","jsx","DayPicker","cn"],"mappings":";;;AAMO,SAASA,EAAS,EAAE,WAAAC,GAAW,iBAAAC,IAAkB,IAAM,GAAGC,KAAwB;AACvF,QAAMC,IAAoBC,EAAA;AAC1B,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,iBAAAL;AAAA,MACA,YAAY;AAAA,QACV,OAAO;AAAA,QACP,UACE;AAAA,QACF,MAAMM,EAAGJ,EAAkB,MAAMH,CAAS;AAAA,QAC1C,SAAS,GAAGG,EAAkB,OAAO;AAAA,QACrC,SAAS;AAAA,QACT,cACE;AAAA,QACF,WAAW;AAAA,QACX,SAAS;AAAA,MAAA;AAAA,MAEV,GAAGD;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/elements/Calendar.stories.d.ts

@@ -1,10 +0,0 @@
-import { StoryObj } from '@storybook/react-vite';
-import { Calendar } from './Calendar';
-declare const meta: {
-    title: string;
-    tags: string[];
-    component: typeof Calendar;
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;

package/dist/elements/Container.cjs

@@ -1,2 +0,0 @@
-"use strict";const c=require("react/jsx-runtime"),t=require("../lib/utils.cjs"),x="container mx-auto sm:max-w-screen-sm md:max-w-screen-md lg:max-w-screen-lg xl:max-w-screen-xl 2xl:max-w-screen-2xl px-4",a=({as:e="div",children:s,className:n})=>{const r=e;return c.jsx(r,{className:t.cn(x,n),children:s})};module.exports=a;
-//# sourceMappingURL=Container.cjs.map