@hai3/uikit 0.1.0-alpha.0 → 0.1.0-alpha.10

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "@hai3/uikit",
-  "version": "0.1.0-alpha.0",
+  "version": "0.1.0-alpha.10",
   "description": "HAI3 UI Kit - Reusable React components built on shadcn/ui",
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "sideEffects": [
     "src/styles/**/*.css"
@@ -11,8 +12,8 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
     },
     "./styles": "./src/styles/globals.css"
   },
@@ -22,8 +23,8 @@
     "README.md"
   ],
   "scripts": {
-    "build": "tsup src/index.ts --format cjs,esm --dts --clean",
-    "dev": "tsup src/index.ts --format cjs,esm --dts --watch"
+    "build": "tsup",
+    "dev": "tsup --watch"
   },
   "keywords": [
     "hai3",
@@ -52,21 +53,49 @@
   },
   "dependencies": {
     "@hai3/uikit-contracts": "*",
+    "@hookform/resolvers": "^5.2.2",
+    "@radix-ui/react-accordion": "^1.2.2",
+    "@radix-ui/react-alert-dialog": "^1.1.6",
+    "@radix-ui/react-aspect-ratio": "^1.1.8",
     "@radix-ui/react-avatar": "^1.1.10",
+    "@radix-ui/react-checkbox": "^1.3.3",
+    "@radix-ui/react-collapsible": "^1.1.3",
+    "@radix-ui/react-context-menu": "^2.2.6",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
+    "@radix-ui/react-hover-card": "^1.1.4",
+    "@radix-ui/react-label": "^2.1.8",
+    "@radix-ui/react-menubar": "^1.1.16",
     "@radix-ui/react-navigation-menu": "^1.2.14",
+    "@radix-ui/react-popover": "^1.1.4",
     "@radix-ui/react-progress": "^1.1.1",
+    "@radix-ui/react-radio-group": "^1.2.3",
+    "@radix-ui/react-scroll-area": "^1.2.10",
     "@radix-ui/react-select": "^2.2.6",
+    "@radix-ui/react-separator": "^1.1.8",
     "@radix-ui/react-slider": "^1.2.2",
     "@radix-ui/react-slot": "^1.2.3",
     "@radix-ui/react-switch": "^1.2.6",
+    "@radix-ui/react-tabs": "^1.1.13",
+    "@radix-ui/react-toggle": "^1.1.10",
+    "@radix-ui/react-toggle-group": "^1.1.11",
     "@radix-ui/react-tooltip": "^1.1.5",
+    "@tanstack/react-table": "^8.21.3",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "cmdk": "^1.1.1",
+    "date-fns": "^4.1.0",
+    "embla-carousel-react": "^8.0.0",
+    "input-otp": "^1.4.2",
     "lodash": "^4.17.21",
     "lucide-react": "^0.344.0",
-    "tailwind-merge": "^2.6.0"
+    "react-day-picker": "^9.12.0",
+    "react-hook-form": "^7.68.0",
+    "react-resizable-panels": "^3.0.6",
+    "recharts": "^2.15.0",
+    "sonner": "^2.0.7",
+    "tailwind-merge": "^2.6.0",
+    "vaul": "^1.1.2"
   },
   "peerDependencies": {
     "@hai3/uikit-contracts": "*",

package/src/styles/applyTheme.ts

@@ -5,7 +5,7 @@
  * Maps to shadcn CSS variable naming convention
  */
 
-import type { Theme } from './themeTypes';
+import type { Theme } from '@hai3/uikit-contracts';
 
 /**
  * Normalize color value for CSS variable
@@ -68,6 +68,13 @@ export const applyTheme = (theme: Theme, themeName?: string): void => {
   root.style.setProperty('--success', hslToVar(theme.colors.success));
   root.style.setProperty('--info', hslToVar(theme.colors.info));
 
+  // Apply chart colors (OKLCH format - pass as-is)
+  root.style.setProperty('--chart-1', theme.colors.chart[1]);
+  root.style.setProperty('--chart-2', theme.colors.chart[2]);
+  root.style.setProperty('--chart-3', theme.colors.chart[3]);
+  root.style.setProperty('--chart-4', theme.colors.chart[4]);
+  root.style.setProperty('--chart-5', theme.colors.chart[5]);
+
   // Apply left menu colors
   root.style.setProperty('--left-menu', hslToVar(theme.colors.mainMenu.DEFAULT));
   root.style.setProperty('--left-menu-foreground', hslToVar(theme.colors.mainMenu.foreground));

package/src/styles/globals.css

@@ -6,7 +6,7 @@
  * Theme CSS variables are now generated dynamically from theme objects
  * See: src/styles/themes/applyTheme.ts
  * Single source of truth: src/styles/themes/*.ts files
- * 
+ *
  * Only default values needed for SSR/initial load below
  */
 
@@ -47,7 +47,49 @@
   * {
     @apply border-border;
   }
+  html {
+    @apply overflow-hidden;
+  }
   body {
-    @apply bg-background text-foreground;
+    @apply bg-background text-foreground overflow-hidden;
+  }
+  #root {
+    @apply h-screen w-screen;
   }
 }
+
+/* Sonner toast styles */
+[data-sonner-toaster] [data-sonner-toast] {
+  --normal-bg: hsl(var(--popover));
+  --normal-text: hsl(var(--popover-foreground));
+  --normal-border: hsl(var(--border));
+}
+
+[data-sonner-toaster] [data-sonner-toast] [data-button] {
+  background-color: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+  font-weight: 500;
+  font-size: 0.875rem;
+  height: 2rem;
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+  border-radius: calc(var(--radius-lg) - 2px);
+  transition: background-color 0.2s;
+}
+
+[data-sonner-toaster] [data-sonner-toast] [data-button]:hover {
+  background-color: hsl(var(--primary) / 0.9);
+}
+
+[data-sonner-toaster] [data-sonner-toast] [data-cancel] {
+  background-color: hsl(var(--muted));
+  color: hsl(var(--muted-foreground));
+}
+
+[data-sonner-toaster] [data-sonner-toast] [data-cancel]:hover {
+  background-color: hsl(var(--muted) / 0.8);
+}
+
+[data-sonner-toaster] [data-sonner-toast] [data-description] {
+  color: hsl(var(--muted-foreground));
+}