@almadar/ui 2.20.1 → 2.20.7

package/index.css

@@ -0,0 +1,156 @@
+/**
+ * Design System Styles
+ */
+
+/* Load Plus Jakarta Sans from Google Fonts (Track A: preferred UI font) */
+@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');
+
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/**
+ * Default fallback theme (minimalist-light — UI/UX improved per Track A eval)
+ * Applied when no data-theme attribute is set.
+ */
+:root:not([data-theme]) {
+    --shadow-main: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.06);
+    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
+    --shadow-lg: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+    --shadow-inner: inset 0 1px 2px rgba(0, 0, 0, 0.05);
+    --shadow-none: none;
+    /* Track A: more pronounced hover lift for interactive cards */
+    --shadow-hover: 0 8px 30px -8px rgba(0, 0, 0, 0.18), 0 2px 6px rgba(0, 0, 0, 0.08);
+    --shadow-active: 0 1px 2px rgba(0, 0, 0, 0.05);
+
+    --radius-none: 0px;
+    --radius-sm: 6px;
+    /* Track A: bump radii from 8/12 → 10/14 for a more modern feel */
+    --radius-md: 10px;
+    --radius-lg: 14px;
+    --radius-xl: 18px;
+    --radius-full: 9999px;
+
+    --border-width: 1px;
+    --border-width-thin: 1px;
+    --border-width-thick: 2px;
+
+    --color-primary: #18181b;
+    --color-primary-hover: #27272a;
+    --color-primary-foreground: #fafafa;
+    --color-secondary: #fafafa;
+    --color-secondary-hover: #f4f4f5;
+    --color-secondary-foreground: #18181b;
+    --color-accent: #18181b;
+    --color-accent-foreground: #fafafa;
+    --color-muted: #f1f5f9;
+    /* Track A: slightly darker muted-foreground for legibility */
+    --color-muted-foreground: #64748b;
+    /* Track A: background ≠ card → natural surface elevation */
+    --color-background: #f8fafc;
+    --color-foreground: #0f172a;
+    --color-card: #ffffff;
+    --color-card-foreground: #0f172a;
+    --color-surface: #f1f5f9;
+    /* Track A: soften border — semi-transparent instead of solid gray */
+    --color-border: rgba(0, 0, 0, 0.08);
+    --color-input: #e2e8f0;
+    --color-ring: #18181b;
+
+    --color-error: #dc2626;
+    --color-error-foreground: #ffffff;
+    --color-success: #16a34a;
+    --color-success-foreground: #ffffff;
+    --color-warning: #ca8a04;
+    --color-warning-foreground: #000000;
+    --color-info: #2563eb;
+    --color-info-foreground: #ffffff;
+
+    /* Track A: Plus Jakarta Sans as first preference, Inter as fallback */
+    --font-family:
+        "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    --font-weight-normal: 400;
+    --font-weight-medium: 500;
+    --font-weight-bold: 600;
+    --letter-spacing: -0.015em;
+    --line-height: 1.6;
+
+    --icon-stroke-width: 1.5;
+    --icon-color: currentColor;
+
+    --transition-fast: 150ms;
+    --transition-normal: 250ms;
+    --transition-slow: 400ms;
+    --transition-timing: cubic-bezier(0.4, 0, 0.2, 1);
+
+    --hover-scale: 1.01;
+    --hover-translate-y: -2px;
+    --hover-translate-x: 0;
+    --active-scale: 0.99;
+    --active-translate-y: 0;
+
+    --focus-ring-width: 2px;
+    --focus-ring-offset: 2px;
+    --focus-ring-color: #18181b;
+}
+
+html {
+    font-family: var(--font-family);
+    line-height: var(--line-height);
+    letter-spacing: var(--letter-spacing);
+    font-weight: var(--font-weight-normal);
+    color-scheme: light dark;
+    font-synthesis: none;
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
+body {
+    margin: 0;
+    min-height: 100vh;
+    background-color: var(--color-background);
+    color: var(--color-foreground);
+}
+
+#root {
+    min-height: 100vh;
+}
+
+::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+}
+
+::-webkit-scrollbar-track {
+    background: var(--color-muted);
+}
+
+::-webkit-scrollbar-thumb {
+    background: var(--color-muted-foreground);
+    border-radius: var(--radius-sm);
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: var(--color-foreground);
+}
+
+@layer utilities {
+    .shadow-theme { box-shadow: var(--shadow-main); }
+    .shadow-theme-sm { box-shadow: var(--shadow-sm); }
+    .shadow-theme-lg { box-shadow: var(--shadow-lg); }
+    .rounded-theme { border-radius: var(--radius-md); }
+    .rounded-theme-sm { border-radius: var(--radius-sm); }
+    .rounded-theme-lg { border-radius: var(--radius-lg); }
+    .border-theme { border-width: var(--border-width); border-color: var(--color-border); }
+    .bg-theme-primary { background-color: var(--color-primary); }
+    .bg-theme-secondary { background-color: var(--color-secondary); }
+    .bg-theme-background { background-color: var(--color-background); }
+    .bg-theme-card { background-color: var(--color-card); }
+    .text-theme-foreground { color: var(--color-foreground); }
+    .text-theme-muted { color: var(--color-muted-foreground); }
+    .text-theme-primary { color: var(--color-primary); }
+    .font-theme-normal { font-weight: var(--font-weight-normal); }
+    .font-theme-medium { font-weight: var(--font-weight-medium); }
+    .font-theme-bold { font-weight: var(--font-weight-bold); }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almadar/ui",
-  "version": "2.20.1",
+  "version": "2.20.7",
   "description": "React UI components, hooks, and providers for Almadar",
   "type": "module",
   "main": "./dist/components/index.js",
@@ -103,6 +103,7 @@
   },
   "files": [
     "dist",
+    "index.css",
     "themes",
     "locales",
     "tailwind-preset.cjs"
@@ -112,9 +113,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@almadar/core": ">=2.1.0",
-    "@almadar/evaluator": ">=2.0.0",
-    "@almadar/patterns": ">=2.0.0",
+    "@almadar/core": ">=2.6.3",
+    "@almadar/evaluator": ">=2.5.4",
+    "@almadar/patterns": ">=2.8.7",
     "@almadar/runtime": ">=2.0.0",
     "clsx": "^2.1.0",
     "elkjs": "0.11.1",
@@ -131,6 +132,7 @@
   "peerDependencies": {
     "@react-three/drei": "^9.92.0 || ^10.0.0",
     "@react-three/fiber": "^9.0.0",
+    "@react-three/postprocessing": "^3.0.0",
     "@tanstack/react-query": "^5.0.0",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0",
@@ -139,6 +141,7 @@
   },
   "devDependencies": {
     "@almadar/eslint-plugin": ">=2.3.0",
+    "@react-three/postprocessing": "3.0.4",
     "@storybook/addon-docs": "^10.2.6",
     "@storybook/addon-links": "^10.2.6",
     "@storybook/addon-themes": "^10.2.6",
@@ -164,6 +167,7 @@
     "jsdom": "^24.0.0",
     "katex": "^0.16.0",
     "postcss": "^8.4.35",
+    "postprocessing": "6.39.0",
     "react": "^19.0.0",
     "react-compiler-runtime": "19.0.0-beta-af1b7da-20250417",
     "react-dom": "^19.0.0",
@@ -181,7 +185,7 @@
     "url": "https://github.com/almadar-io/almadar-ui.git",
     "directory": "docs/packages/ui"
   },
-  "license": "MIT",
+  "license": "BSL-1.1",
   "keywords": [
     "almadar",
     "ui",