aha-components 1.7.7 → 1.7.9

package/dist/theme.css

@@ -0,0 +1,112 @@
+/* ==========================================================================
+   Design Tokens — extracted from Untitled UI (Tokens Studio export)
+   Brand: Orange (brand-500 = #fb6011)  |  Font: DM Sans  |  Mode: Light only
+   
+   Layer 1: Primitives (raw color scales)        -> :root
+   Layer 2: Semantic tokens (text/bg/border/fg)  -> :root
+   Layer 3: Spacing / Radius / Typography / Shadow
+   
+   Tailwind v4: the 
+
+/* ==========================================================================
+   SEMANTIC TOKENS — Light mode
+   ========================================================================== */
+:root {
+  /* ---------- TEXT ---------- */
+  --color-text-primary: #1c1917;
+  --color-text-tertiary: #57534e;
+  --color-text-error-primary: #d92d20;
+  --color-text-warning-primary: #dc6803;
+  --color-text-success-primary: #079455;
+  --color-text-white: #ffffff;
+  --color-text-secondary: #44403c;
+  --color-text-disabled: #79716b;
+  --color-text-secondary_hover: #292524;
+  --color-text-tertiary_hover: #44403c;
+  --color-text-brand-secondary: #ec470a;
+  --color-text-placeholder: #79716b;
+  --color-text-placeholder_subtle: #d7d3d0;
+  --color-text-brand-tertiary: #fb6011;
+  --color-text-quaternary: #79716b;
+  --color-text-brand-primary: #7d2511;
+  --color-text-primary_on-brand: #ffffff;
+  --color-text-secondary_on-brand: #ffd1a9;
+  --color-text-tertiary_on-brand: #ffd1a9;
+  --color-text-quaternary_on-brand: #feb073;
+  --color-text-brand-tertiary_alt: #fb6011;
+  --color-text-brand-secondary_hover: #c4330a;
+  --color-text-error-primary_hover: #b42318;
+
+  /* ---------- BORDER ---------- */
+  --color-border-secondary: #e7e5e4;
+  --color-border-error_subtle: #fda29b;
+  --color-border-primary: #d7d3d0;
+  --color-border-brand: #fb6011;
+  --color-border-disabled: #d7d3d0;
+  --color-border-error: #f04438;
+  --color-border-disabled_subtle: #e7e5e4;
+  --color-border-tertiary: #f5f5f4;
+  --color-border-brand_alt: #fb6011;
+  --color-border-secondary_alt: #00000014;
+
+  /* ---------- BG ---------- */
+  --color-bg-primary: #ffffff;
+  --color-bg-tertiary: #f5f5f4;
+  --color-bg-brand-primary: #fff6ed;
+  --color-bg-error-secondary: #fee4e2;
+  --color-bg-warning-primary: #fffaeb;
+  --color-bg-warning-secondary: #fef0c7;
+  --color-bg-success-primary: #ecfdf3;
+  --color-bg-success-secondary: #dcfae6;
+  --color-bg-brand-solid: #fb6011;
+  --color-bg-secondary-solid: #57534e;
+  --color-bg-error-solid: #d92d20;
+  --color-bg-warning-solid: #dc6803;
+  --color-bg-success-solid: #079455;
+  --color-bg-secondary_hover: #f5f5f4;
+  --color-bg-primary_hover: #fafaf9;
+  --color-bg-disabled: #f5f5f4;
+  --color-bg-active: #fafaf9;
+  --color-bg-brand-solid_hover: #ec470a;
+  --color-bg-error-primary: #fef3f2;
+  --color-bg-brand-secondary: #ffead5;
+  --color-bg-secondary: #fafaf9;
+  --color-bg-disabled_subtle: #fafaf9;
+  --color-bg-quaternary: #e7e5e4;
+  --color-bg-primary_alt: #ffffff;
+  --color-bg-brand-primary_alt: #fff6ed;
+  --color-bg-secondary_alt: #fafaf9;
+  --color-bg-overlay: #171412;
+  --color-bg-secondary_subtle: #fdfdfc;
+  --color-bg-brand-section: #c4330a;
+  --color-bg-brand-section_subtle: #ec470a;
+  --color-bg-primary-solid: #171412;
+
+  /* ---------- FG ---------- */
+  --color-fg-secondary: #44403c;
+  --color-fg-warning-primary: #dc6803;
+  --color-fg-success-primary: #079455;
+  --color-fg-white: #ffffff;
+  --color-fg-success-secondary: #17b26a;
+  --color-fg-secondary_hover: #292524;
+  --color-fg-primary: #1c1917;
+  --color-fg-disabled: #a9a29d;
+  --color-fg-brand-secondary: #fb6011;
+  --color-fg-brand-primary: #fb6011;
+  --color-fg-quaternary: #a9a29d;
+  --color-fg-quaternary_hover: #79716b;
+  --color-fg-error-primary: #d92d20;
+  --color-fg-disabled_subtle: #d7d3d0;
+  --color-fg-warning-secondary: #f79009;
+  --color-fg-error-secondary: #f04438;
+  --color-fg-tertiary: #57534e;
+  --color-fg-tertiary_hover: #44403c;
+  --color-fg-brand-primary_alt: #fb6011;
+  --color-fg-brand-secondary_alt: #fb6011;
+  --color-fg-brand-secondary_hover: #fb6011;
+
+}
+
+/* ==========================================================================
+   TAILWIND v4 — exposes tokens as utility classes
+   ========================================================================== */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aha-components",
-  "version": "1.7.7",
+  "version": "1.7.9",
   "description": "A React component library with tree-shaking support",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",
@@ -16,6 +16,9 @@
       "require": "./dist/index.js",
       "types": "./dist/index.d.ts"
     },
+    "./theme.css": "./dist/theme.css",
+    "./design-tokens/theme.css": "./dist/design-tokens/theme.css",
+    "./design-tokens/theme.tailwind4.css": "./dist/design-tokens/theme.tailwind4.css",
     "./package.json": "./package.json"
   },
   "files": [
@@ -24,8 +27,8 @@
     "CHANGELOG.md"
   ],
   "scripts": {
-    "build": "rollup -c",
-    "dev": "NODE_OPTIONS=--max-old-space-size=8192 rollup -c -w",
+    "build": "rollup -c && node scripts/copy-theme-css.js",
+    "dev": "NODE_OPTIONS=--max-old-space-size=8192 rollup -c -w && node scripts/copy-theme-css.js",
     "test": "jest",
     "test:watch": "jest --watch",
     "storybook": "NODE_OPTIONS=--max-old-space-size=8192 storybook dev -p 6006",