@omnifyjp/ui 0.5.2 → 1.0.0

package/dist/lib/types.d.ts

@@ -1 +1,84 @@
-export * from '@omnifyjp/ui-components/lib/types';
+/**
+ * Shared UI types for @omnifyjp/ui components.
+ *
+ * These types enforce consistent APIs across Button, Badge, Alert, and future components.
+ * Import from `@omnifyjp/ui` or `@omnifyjp/ui/lib/types`.
+ *
+ * @example
+ * ```tsx
+ * import type { UIColor, UISize } from '@omnifyjp/ui';
+ * ```
+ */
+/**
+ * Semantic color intent for UI components.
+ *
+ * Each color maps to a pair of CSS custom properties in theme.css:
+ * `--{color}` (background) and `--{color}-foreground` (text on that background).
+ *
+ * | Color | CSS Variable | Default (Light) | Use for |
+ * |-------|-------------|-----------------|---------|
+ * | `primary` | `--primary` | `#030213` | Main actions, active states |
+ * | `destructive` | `--destructive` | `#d4183d` | Delete, errors, dangerous actions |
+ * | `success` | `--success` | `#10b981` | Confirmed, approved, completed |
+ * | `warning` | `--warning` | `#f59e0b` | Caution, needs attention |
+ * | `info` | `--info` | `#3b82f6` | Informational, neutral highlights |
+ *
+ * Consumers override these via CSS custom properties:
+ * ```css
+ * :root { --primary: #dc2626; }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <Button color="success">Approve</Button>
+ * <Badge color="warning">Pending</Badge>
+ * <Alert color="info">Tip: use keyboard shortcuts</Alert>
+ * ```
+ */
+type UIColor = 'primary' | 'destructive' | 'success' | 'warning' | 'info';
+/**
+ * Visual display variant for UI components.
+ *
+ * Controls **how** the color is rendered, independent of **which** color.
+ * Combine with `color` prop for full flexibility: `variant="outline" color="destructive"`.
+ *
+ * | Variant | Description |
+ * |---------|-------------|
+ * | `default` | Solid filled background with contrasting text |
+ * | `secondary` | Muted/gray background (color-independent) |
+ * | `outline` | Border with transparent background, colored text |
+ * | `soft` | Light tinted background (10% opacity of color) |
+ * | `ghost` | Transparent, shows tinted background on hover |
+ * | `link` | Text-only with underline on hover |
+ *
+ * @example
+ * ```tsx
+ * <Button variant="soft" color="success">Approve</Button>
+ * <Button variant="outline" color="destructive">Reject</Button>
+ * <Badge variant="soft" color="warning">In Review</Badge>
+ * ```
+ */
+type UIVariant = 'default' | 'secondary' | 'outline' | 'soft' | 'ghost' | 'link';
+/**
+ * Standard size scale for UI components.
+ *
+ * Maps to density tokens in theme.css for consistent sizing across the system.
+ *
+ * | Size | Height Token | Pixels | Use for |
+ * |------|-------------|--------|---------|
+ * | `xs` | `h-element-xs` | 24px | Compact tables, inline actions |
+ * | `sm` | `h-element-sm` | 28px | Secondary actions, tight layouts |
+ * | `default` | `h-element` | 32px | Standard buttons, inputs |
+ * | `lg` | `h-element-lg` | 36px | Primary CTAs, form actions |
+ * | `xl` | `h-element-xl` | 44px | Login forms, hero sections |
+ *
+ * @example
+ * ```tsx
+ * <Button size="sm">Edit</Button>
+ * <Button size="xl" block>Sign In</Button>
+ * <Input size="lg" />
+ * ```
+ */
+type UISize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';
+
+export type { UIColor, UISize, UIVariant };

package/dist/lib/types.js

@@ -1,3 +1,3 @@
-export * from '@omnifyjp/ui-components/lib/types';
+
 //# sourceMappingURL=types.js.map
 //# sourceMappingURL=types.js.map

package/dist/lib/types.js.map

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

package/dist/lib/utils.d.ts

@@ -1 +1,5 @@
-export * from '@omnifyjp/ui-components/lib/utils';
+import { ClassValue } from 'clsx';
+
+declare function cn(...inputs: ClassValue[]): string;
+
+export { cn };

package/dist/lib/utils.js

@@ -1,3 +1,3 @@
-export * from '@omnifyjp/ui-components/lib/utils';
+export { cn } from '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=utils.js.map
 //# sourceMappingURL=utils.js.map

package/dist/lib/utils.js.map

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

package/package.json

@@ -1,11 +1,13 @@
 {
   "name": "@omnifyjp/ui",
-  "version": "0.5.2",
+  "version": "1.0.0",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
-  "sideEffects": false,
+  "sideEffects": [
+    "*.css"
+  ],
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -15,56 +17,93 @@
       "types": "./dist/components/*.d.ts",
       "import": "./dist/components/*.js"
     },
-    "./contexts/*": {
-      "types": "./dist/contexts/*.d.ts",
-      "import": "./dist/contexts/*.js"
-    },
     "./hooks/*": {
       "types": "./dist/hooks/*.d.ts",
       "import": "./dist/hooks/*.js"
     },
-    "./i18n": {
-      "types": "./dist/i18n.d.ts",
-      "import": "./dist/i18n.js"
-    },
-    "./types": {
-      "types": "./dist/types.d.ts",
-      "import": "./dist/types.js"
-    },
     "./lib/*": {
       "types": "./dist/lib/*.d.ts",
       "import": "./dist/lib/*.js"
     },
-    "./styles": "./src/styles/index.css"
+    "./styles": "./src/styles/theme.css"
   },
   "files": [
     "dist",
     "src/styles"
   ],
-  "scripts": {
-    "build": "tsup",
-    "dev": "tsup --watch",
-    "lint": "eslint src/",
-    "type-check": "tsc --noEmit"
-  },
   "peerDependencies": {
     "react": ">=19",
     "react-dom": ">=19",
-    "react-router": ">=7"
+    "date-fns": ">=3",
+    "recharts": ">=2",
+    "react-hook-form": ">=7"
+  },
+  "peerDependenciesMeta": {
+    "date-fns": {
+      "optional": true
+    },
+    "recharts": {
+      "optional": true
+    },
+    "react-hook-form": {
+      "optional": true
+    }
   },
   "dependencies": {
-    "@omnifyjp/ui-components": "0.5.2",
-    "@omnifyjp/ui-mcp": "^0.5.2",
-    "i18next": "^24.0.0",
-    "react-i18next": "^15.0.0",
-    "date-fns": "3.6.0",
+    "@radix-ui/react-accordion": "1.2.3",
+    "@radix-ui/react-alert-dialog": "1.1.6",
+    "@radix-ui/react-aspect-ratio": "1.1.2",
+    "@radix-ui/react-avatar": "1.1.3",
+    "@radix-ui/react-checkbox": "1.1.4",
+    "@radix-ui/react-collapsible": "1.1.3",
+    "@radix-ui/react-context-menu": "2.2.6",
+    "@radix-ui/react-dialog": "1.1.6",
+    "@radix-ui/react-dropdown-menu": "2.1.6",
+    "@radix-ui/react-hover-card": "1.1.6",
+    "@radix-ui/react-label": "2.1.2",
+    "@radix-ui/react-menubar": "1.1.6",
+    "@radix-ui/react-navigation-menu": "1.2.5",
+    "@radix-ui/react-popover": "1.1.6",
+    "@radix-ui/react-progress": "1.1.2",
+    "@radix-ui/react-radio-group": "1.2.3",
+    "@radix-ui/react-scroll-area": "1.2.3",
+    "@radix-ui/react-select": "2.1.6",
+    "@radix-ui/react-separator": "1.1.2",
+    "@radix-ui/react-slider": "1.2.3",
+    "@radix-ui/react-slot": "1.1.2",
+    "@radix-ui/react-switch": "1.1.3",
+    "@radix-ui/react-tabs": "1.1.3",
+    "@radix-ui/react-toggle": "1.1.2",
+    "@radix-ui/react-toggle-group": "1.1.2",
+    "@radix-ui/react-tooltip": "1.1.8",
+    "class-variance-authority": "0.7.1",
+    "clsx": "2.1.1",
+    "cmdk": "1.1.1",
+    "embla-carousel-react": "8.6.0",
+    "input-otp": "1.4.2",
     "lucide-react": "0.487.0",
-    "sonner": "2.0.3"
+    "react-day-picker": "9.6.4",
+    "react-resizable-panels": "2.1.7",
+    "sonner": "2.0.3",
+    "tailwind-merge": "3.2.0",
+    "vaul": "1.1.2"
   },
   "devDependencies": {
     "tsup": "^8.0.0",
     "typescript": "^5.9.3",
     "@types/react": "^19.2.13",
-    "@types/react-dom": "^19.2.3"
+    "@types/react-dom": "^19.2.3",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "jsdom": "^28.1.0",
+    "vitest": "^4.0.18"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "lint": "eslint src/",
+    "type-check": "tsc --noEmit",
+    "test": "vitest run",
+    "test:watch": "vitest"
   }
-}
+}

package/src/styles/index.css

@@ -1 +1,3 @@
-@import '@omnifyjp/ui-components/styles';
+@import './fonts.css';
+@import './tailwind.css';
+@import './theme.css';

package/src/styles/tailwind.css

@@ -0,0 +1,4 @@
+@import 'tailwindcss' source(none);
+@source '../**/*.{js,ts,jsx,tsx}';
+
+@import 'tw-animate-css';