@ecopages/radiant-themes 0.3.2 → 0.3.4

package/dist/tokens/roles/zed.css

@@ -0,0 +1,153 @@
+:where(:root),
+:root[data-rui-theme='zed'] {
+	--gray-50: #fafafa;
+	--gray-100: #f3f3f4;
+	--gray-200: #ebebec;
+	--gray-300: #dcdcdd;
+	--gray-400: #c9c9ca;
+	--gray-500: #a3a4a9;
+	--gray-600: #7f8089;
+	--gray-700: #5d5f68;
+	--gray-800: #494b53;
+	--gray-900: #383a41;
+	--gray-950: #26282d;
+
+	--primary: var(--color-zed-accent-solid);
+	--on-primary: white;
+	--primary-light: var(--color-zed-accent);
+	--primary-dark: var(--color-zed-accent-hover);
+	--primary-container: color-mix(in oklab, var(--color-zed-accent), white 82%);
+	--on-primary-container: color-mix(in oklab, var(--color-zed-accent), black 55%);
+
+	--secondary: color-mix(in oklab, var(--color-zed-teal), black 12%);
+	--on-secondary: white;
+	--secondary-light: color-mix(in oklab, var(--color-zed-teal), white 30%);
+	--secondary-dark: color-mix(in oklab, var(--color-zed-teal), black 30%);
+	--secondary-container: color-mix(in oklab, var(--color-zed-teal), white 85%);
+	--on-secondary-container: color-mix(in oklab, var(--color-zed-teal), black 60%);
+
+	--tertiary: var(--color-zed-purple);
+	--on-tertiary: white;
+	--tertiary-container: color-mix(in oklab, var(--color-zed-purple), white 85%);
+	--on-tertiary-container: color-mix(in oklab, var(--color-zed-purple), black 60%);
+
+	--error: color-mix(in oklab, var(--color-zed-red), black 12%);
+	--on-error: white;
+	--error-light: color-mix(in oklab, var(--color-zed-red), white 30%);
+	--error-dark: color-mix(in oklab, var(--color-zed-red), black 30%);
+	--error-container: color-mix(in oklab, var(--color-zed-red), white 85%);
+	--on-error-container: color-mix(in oklab, var(--color-zed-red), black 60%);
+	--success: color-mix(in oklab, var(--color-zed-green), black 15%);
+	--on-success: white;
+	--success-light: color-mix(in oklab, var(--color-zed-green), white 30%);
+	--success-dark: color-mix(in oklab, var(--color-zed-green), black 30%);
+	--success-container: color-mix(in oklab, var(--color-zed-green), white 85%);
+	--on-success-container: color-mix(in oklab, var(--color-zed-green), black 60%);
+	--info: var(--color-zed-accent-solid);
+	--on-info: white;
+	--info-light: var(--color-zed-accent);
+	--info-dark: var(--color-zed-accent-hover);
+	--info-container: color-mix(in oklab, var(--color-zed-accent), white 85%);
+	--on-info-container: color-mix(in oklab, var(--color-zed-accent), black 60%);
+	--warning: var(--color-zed-amber);
+	--on-warning: #2e2410;
+	--warning-light: color-mix(in oklab, var(--color-zed-amber), white 30%);
+	--warning-dark: color-mix(in oklab, var(--color-zed-amber), black 30%);
+	--warning-container: color-mix(in oklab, var(--color-zed-amber), white 70%);
+	--on-warning-container: color-mix(in oklab, var(--color-zed-amber), black 70%);
+
+	--neutral: var(--color-zed-text-muted);
+	--surface: var(--color-zed-background);
+	--on-surface: var(--color-zed-text);
+	--surface-container-lowest: var(--color-zed-background);
+	--on-surface-container-lowest: var(--color-zed-text);
+	--surface-container-low: #f3f3f4;
+	--on-surface-container-low: var(--color-zed-text);
+	--surface-container: var(--color-zed-panel);
+	--on-surface-container: var(--color-zed-text);
+	--surface-container-high: #e3e3e4;
+	--on-surface-container-high: var(--color-zed-text);
+	--surface-container-highest: var(--color-zed-elevated);
+	--on-surface-container-highest: var(--color-zed-text);
+	--background: var(--color-zed-background);
+	--on-background: var(--color-zed-text);
+	--rui-border-color: var(--color-zed-border);
+	--rui-control-border-color: var(--color-zed-border-strong);
+	--rui-border-hover-color: var(--color-zed-text-muted);
+	--rui-border-active-color: var(--color-zed-accent-solid);
+	--border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+	--focus-ring: var(--color-zed-accent-solid);
+	--on-focus-ring: white;
+	--link: var(--color-zed-accent-text);
+	--overlay: oklch(0% 0 0 / 0.35);
+	--background-code: var(--color-zed-panel);
+	--on-background-code: var(--color-zed-text);
+}
+
+:where(.dark),
+:root.dark[data-rui-theme='zed'] {
+	--gray-50: #23262c;
+	--gray-100: #282c33;
+	--gray-200: #2f343e;
+	--gray-300: #363c46;
+	--gray-400: #464b57;
+	--gray-500: #5c6270;
+	--gray-600: #7d8392;
+	--gray-700: #a9afbc;
+	--gray-800: #c4c9d2;
+	--gray-900: #dce0e5;
+	--gray-950: #eef0f3;
+
+	--primary: var(--color-zed-accent-solid);
+	--on-primary: #14233a;
+	--primary-light: var(--color-zed-accent-hover);
+	--primary-dark: color-mix(in oklab, var(--color-zed-accent), black 20%);
+	--primary-container: #2c4466;
+	--on-primary-container: #d5e6fa;
+	--secondary: var(--color-zed-teal);
+	--on-secondary: #0f2428;
+	--secondary-container: #284249;
+	--on-secondary-container: #cfeaee;
+	--tertiary: var(--color-zed-purple);
+	--on-tertiary: #230f2d;
+	--tertiary-container: #442a54;
+	--on-tertiary-container: #ecd6f6;
+	--error: var(--color-zed-red);
+	--on-error: #310c0f;
+	--error-container: #5a2c30;
+	--on-error-container: #fbdadc;
+	--success: var(--color-zed-green);
+	--on-success: #142208;
+	--success-container: #3a4a2c;
+	--on-success-container: #dcecca;
+	--info: var(--color-zed-accent);
+	--on-info: #14233a;
+	--info-container: #2c4466;
+	--on-info-container: #d5e6fa;
+	--warning: var(--color-zed-amber);
+	--on-warning: #2e2410;
+	--warning-container: #4d4126;
+	--on-warning-container: #f5e6c0;
+	--surface: var(--color-zed-background);
+	--on-surface: var(--color-zed-text);
+	--surface-container-lowest: #23262c;
+	--on-surface-container-lowest: var(--color-zed-text);
+	--surface-container-low: #2b2f37;
+	--on-surface-container-low: var(--color-zed-text);
+	--surface-container: var(--color-zed-panel);
+	--on-surface-container: var(--color-zed-text);
+	--surface-container-high: var(--color-zed-elevated);
+	--on-surface-container-high: var(--color-zed-text);
+	--surface-container-highest: #3e444f;
+	--on-surface-container-highest: var(--color-zed-text);
+	--background: var(--color-zed-background);
+	--on-background: var(--color-zed-text);
+	--rui-control-border-color: var(--color-zed-border-strong);
+	--rui-border-hover-color: var(--color-zed-text-muted);
+	--rui-border-active-color: var(--color-zed-accent);
+	--focus-ring: var(--color-zed-accent);
+	--on-focus-ring: #14233a;
+	--link: var(--color-zed-accent);
+	--background-code: #23262c;
+	--on-background-code: var(--color-zed-text);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecopages/radiant-themes",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "Composable color themes and variants for @ecopages/radiant-ui",
   "repository": {
     "type": "git",
@@ -19,14 +19,14 @@
     "**/*.css"
   ],
   "peerDependencies": {
-    "@ecopages/radiant-ui": ">=0.3.2"
+    "@ecopages/radiant-ui": ">=0.3.4"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4.3.3",
     "playwright": "^1.62.1",
     "postcss": "^8.5.24",
     "tailwindcss": "^4.3.0",
-    "@ecopages/radiant-ui": "0.3.2"
+    "@ecopages/radiant-ui": "0.3.4"
   },
   "exports": {
     "./package.json": "./package.json",
@@ -60,6 +60,12 @@
     "./compiled/vercel/compact.css": {
       "default": "./dist/compiled/themes/vercel/compact.css"
     },
+    "./compiled/zed.css": {
+      "default": "./dist/compiled/themes/zed.css"
+    },
+    "./compiled/zed/compact.css": {
+      "default": "./dist/compiled/themes/zed/compact.css"
+    },
     "./compiled/high-contrast.css": {
       "default": "./dist/compiled/themes/high-contrast.css"
     },
@@ -114,6 +120,12 @@
     "./vercel/compact": {
       "default": "./dist/themes/vercel/compact.css"
     },
+    "./zed": {
+      "default": "./dist/themes/zed.css"
+    },
+    "./zed/compact": {
+      "default": "./dist/themes/zed/compact.css"
+    },
     "./high-contrast": {
       "default": "./dist/themes/high-contrast.css"
     },