@eventcatalog/core 3.30.0 → 3.31.1

package/eventcatalog/src/pages/settings/llm-access.astro

@@ -0,0 +1,34 @@
+---
+import SettingsLayout from '@layouts/SettingsLayout.astro';
+import { LlmAccessSettingsForm } from '@components/Settings/LlmAccessSettingsForm';
+import { isDevMode, isEventCatalogScaleEnabled } from '@utils/feature';
+import { buildUrl } from '@utils/url-builder';
+import config from '@config';
+
+const canEdit = isDevMode();
+
+const initial = {
+  llmsTxtEnabled: config?.llmsTxt?.enabled ?? true,
+  chatEnabled: config?.chat?.enabled ?? true,
+};
+
+const hasScalePlan = isEventCatalogScaleEnabled();
+
+const apiBase = buildUrl('/api/settings');
+const llmsTxtUrl = buildUrl('/docs/llm/llms.txt');
+const llmsFullTxtUrl = buildUrl('/docs/llm/llms-full.txt');
+const schemasTxtUrl = buildUrl('/docs/llm/schemas.txt');
+---
+
+<SettingsLayout title="LLM Access" active="llm-access">
+  <LlmAccessSettingsForm
+    client:load
+    canEdit={canEdit}
+    initial={initial}
+    hasScalePlan={hasScalePlan}
+    apiBase={apiBase}
+    llmsTxtUrl={llmsTxtUrl}
+    llmsFullTxtUrl={llmsFullTxtUrl}
+    schemasTxtUrl={schemasTxtUrl}
+  />
+</SettingsLayout>

package/eventcatalog/src/pages/settings/mcp.astro

@@ -0,0 +1,14 @@
+---
+import SettingsLayout from '@layouts/SettingsLayout.astro';
+import { McpSettingsForm } from '@components/Settings/McpSettingsForm';
+import { isSSR, isEventCatalogScaleEnabled } from '@utils/feature';
+import { buildUrl } from '@utils/url-builder';
+
+const hasScalePlan = isEventCatalogScaleEnabled();
+const inSSR = isSSR();
+const mcpUrl = buildUrl('/docs/mcp');
+---
+
+<SettingsLayout title="MCP" active="mcp">
+  <McpSettingsForm client:load hasScalePlan={hasScalePlan} inSSR={inSSR} mcpUrl={mcpUrl} />
+</SettingsLayout>

package/eventcatalog/src/styles/theme.css

@@ -17,19 +17,19 @@
   /* Header */
   --ec-header-bg: 255 255 255; /* #ffffff */
   --ec-header-text: 15 23 42; /* #0f172a (slate-900) */
-  --ec-header-border: 226 232 240; /* #e2e8f0 (slate-200) */
+  --ec-header-border: 229 229 229; /* #e5e5e5 (neutral-200) */
 
   /* Primary brand color */
-  --ec-primary: 168 85 247; /* #a855f7 */
-  --ec-primary-hover: 147 51 234; /* #9333ea */
+  --ec-primary: 126 34 206; /* #7e22ce (purple-700) */
+  --ec-primary-hover: 107 33 168; /* #6b21a8 (purple-800) */
 
   /* Accent colors - used for selections, highlights, interactive elements */
-  --ec-accent: 168 85 247; /* #a855f7 (purple-500) */
-  --ec-accent-hover: 147 51 234; /* #9333ea (purple-600) */
-  --ec-accent-subtle: 243 232 255; /* #f3e8ff (purple-100) */
-  --ec-accent-text: 107 33 168; /* #6b21a8 (purple-800) */
-  --ec-accent-gradient-from: 168 85 247; /* #a855f7 (purple-500) */
-  --ec-accent-gradient-to: 126 34 206; /* #7e22ce (purple-700) */
+  --ec-accent: 126 34 206; /* #7e22ce (purple-700) */
+  --ec-accent-hover: 107 33 168; /* #6b21a8 (purple-800) */
+  --ec-accent-subtle: 233 213 255; /* #e9d5ff (purple-200) */
+  --ec-accent-text: 88 28 135; /* #581c87 (purple-900) */
+  --ec-accent-gradient-from: 126 34 206; /* #7e22ce (purple-700) */
+  --ec-accent-gradient-to: 88 28 135; /* #581c87 (purple-900) */
 
   /* Buttons */
   --ec-button-bg: 15 23 42; /* #0f172a */
@@ -49,18 +49,23 @@
   /* Sidebar / Vertical Nav (icon bar) */
   --ec-sidebar-bg: 255 255 255; /* #ffffff */
   --ec-sidebar-bg-gradient: 248 250 252; /* #f8fafc (slate-50) */
-  --ec-sidebar-border: 226 232 240; /* #e2e8f0 (slate-200) */
+  --ec-sidebar-border: 229 229 229; /* #e5e5e5 (neutral-200) */
   --ec-sidebar-text: 71 85 105; /* #475569 (slate-600) */
   --ec-sidebar-active-bg: 15 23 42; /* #0f172a */
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 15 23 42; /* #0f172a - black on hover like active */
 
+  /* Rail / inset-panel surface (5% off the sidebar bg). Use for navigation rails,
+     filter panels, and any inset surface that should sit slightly off the page. */
+  --ec-rail-bg: 250 250 250; /* #fafafa - 2% darker than white */
+  --ec-rail-active-bg: 218 218 218; /* ~10% darker than rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 255 255 255; /* #ffffff */
   --ec-content-text: 15 23 42; /* #0f172a (slate-900) */
   --ec-content-text-muted: 100 116 139; /* #64748b (slate-500) */
   --ec-content-text-secondary: 71 85 105; /* #475569 (slate-600) */
-  --ec-content-border: 226 232 240; /* #e2e8f0 (slate-200) */
+  --ec-content-border: 229 229 229; /* #e5e5e5 (neutral-200) */
   --ec-content-hover: 248 250 252; /* #f8fafc (slate-50) */
   --ec-content-active: 245 243 255; /* #f5f3ff (violet-50) */
 
@@ -71,14 +76,14 @@
   --ec-input-placeholder: 148 163 184; /* #94a3b8 (slate-400) */
 
   /* Group headers */
-  --ec-group-icon-bg: 241 245 249; /* #f1f5f9 (slate-100) */
-  --ec-group-icon-text: 71 85 105; /* #475569 (slate-600) */
+  --ec-group-icon-bg: 233 213 255; /* #e9d5ff (purple-200) */
+  --ec-group-icon-text: 88 28 135; /* #581c87 (purple-900) */
 
   /* Main content/docs area */
   --ec-page-bg: 255 255 255; /* #ffffff */
   --ec-page-text: 15 23 42; /* #0f172a */
   --ec-page-text-muted: 100 116 139; /* #64748b */
-  --ec-page-border: 226 232 240; /* #e2e8f0 */
+  --ec-page-border: 229 229 229; /* #e5e5e5 (neutral-200) */
 
   /* Card/elevated surfaces */
   --ec-card-bg: 255 255 255; /* #ffffff */
@@ -119,19 +124,19 @@
   /* Header - deep black with cool border */
   --ec-header-bg: 9 13 13; /* #090d0d */
   --ec-header-text: 240 246 252; /* #f0f6fc - soft white */
-  --ec-header-border: 24 27 32; /* #181b20 - subtle border */
+  --ec-header-border: 38 41 47; /* #26292f - lifted ~20% */
 
   /* Primary brand color */
-  --ec-primary: 168 85 247; /* #a855f7 (purple-500) */
-  --ec-primary-hover: 147 51 234; /* #9333ea (purple-600) */
+  --ec-primary: 147 51 234; /* #9333ea (purple-600) */
+  --ec-primary-hover: 126 34 206; /* #7e22ce (purple-700) */
 
   /* Accent colors - used for selections, highlights, interactive elements */
-  --ec-accent: 168 85 247; /* #a855f7 (purple-500) */
-  --ec-accent-hover: 147 51 234; /* #9333ea (purple-600) */
+  --ec-accent: 147 51 234; /* #9333ea (purple-600) */
+  --ec-accent-hover: 126 34 206; /* #7e22ce (purple-700) */
   --ec-accent-subtle: 88 28 135 / 0.3; /* purple-900/30 */
-  --ec-accent-text: 216 180 254; /* #d8b4fe (purple-300) */
-  --ec-accent-gradient-from: 168 85 247; /* #a855f7 (purple-500) */
-  --ec-accent-gradient-to: 147 51 234; /* #9333ea (purple-600) */
+  --ec-accent-text: 192 132 252; /* #c084fc (purple-400) */
+  --ec-accent-gradient-from: 147 51 234; /* #9333ea (purple-600) */
+  --ec-accent-gradient-to: 126 34 206; /* #7e22ce (purple-700) */
 
   /* Buttons - accent color for better visibility */
   --ec-button-bg: 147 51 234; /* #9333ea - purple-600 */
@@ -149,20 +154,24 @@
   --ec-icon-hover: 240 246 252; /* #f0f6fc */
 
   /* Sidebar / Vertical Nav (icon bar) */
-  --ec-sidebar-bg: 21 21 26; /* #15151a */
-  --ec-sidebar-bg-gradient: 21 21 26; /* #15151a */
-  --ec-sidebar-border: 33 38 45; /* #21262d */
+  --ec-sidebar-bg: 9 13 13; /* #090d0d - matches page bg */
+  --ec-sidebar-bg-gradient: 9 13 13; /* #090d0d */
+  --ec-sidebar-border: 51 57 65; /* #333941 - lifted ~20% */
   --ec-sidebar-text: 139 148 158; /* #8b949e */
   --ec-sidebar-active-bg: 48 54 61; /* #30363d - subtle highlight */
   --ec-sidebar-active-text: 240 246 252; /* #f0f6fc */
   --ec-sidebar-hover-bg: 33 38 45; /* #21262d */
 
+  /* Rail / inset-panel surface (~2% lifted from the page bg) */
+  --ec-rail-bg: 15 19 19; /* ~2% lighter than #090d0d */
+  --ec-rail-active-bg: 35 38 38; /* ~10% lifted off rail bg */
+
   /* Nested sidebar content */
-  --ec-content-bg: 21 21 26; /* #15151a - lifted surface for nested sidebar */
+  --ec-content-bg: 9 13 13; /* #090d0d - matches page bg */
   --ec-content-text: 201 209 217; /* #c9d1d9 - softer than pure white */
   --ec-content-text-muted: 139 148 158; /* #8b949e */
   --ec-content-text-secondary: 170 178 186; /* #aab2ba - sidebar children text */
-  --ec-content-border: 33 38 45; /* #21262d */
+  --ec-content-border: 51 57 65; /* #333941 - lifted ~20% */
   --ec-content-hover: 22 27 34; /* #161b22 */
   --ec-content-active: 33 38 45; /* #21262d */
 
@@ -174,13 +183,13 @@
 
   /* Group headers */
   --ec-group-icon-bg: 33 38 45; /* #21262d */
-  --ec-group-icon-text: 201 209 217; /* #c9d1d9 */
+  --ec-group-icon-text: 192 132 252; /* #c084fc (purple-400) */
 
   /* Main content/docs area - base dark surface */
   --ec-page-bg: 9 13 13; /* #090d0d */
   --ec-page-text: 240 246 252; /* #f0f6fc */
   --ec-page-text-muted: 163 172 182; /* #a3acb6 */
-  --ec-page-border: 24 27 32; /* #181b20 - more subtle */
+  --ec-page-border: 38 41 47; /* #26292f - lifted ~20% */
 
   /* Card/elevated surfaces - for depth */
   --ec-card-bg: 22 27 34; /* #161b22 */

package/eventcatalog/src/styles/themes/forest.css

@@ -11,7 +11,7 @@
   /* Header - clean white */
   --ec-header-bg: 255 255 255; /* #ffffff */
   --ec-header-text: 20 20 20; /* #141414 */
-  --ec-header-border: 229 231 235; /* #e5e7eb gray-200 */
+  --ec-header-border: 229 229 229; /* #e5e5e5 (neutral-200) */
 
   /* Primary brand color - deep forest green */
   --ec-primary: 22 101 52; /* #166534 green-800 */
@@ -34,7 +34,7 @@
   --ec-dropdown-bg: 255 255 255; /* #ffffff */
   --ec-dropdown-text: 55 65 81; /* #374151 gray-700 */
   --ec-dropdown-hover: 240 253 244; /* #f0fdf4 green-50 */
-  --ec-dropdown-border: 229 231 235; /* #e5e7eb gray-200 */
+  --ec-dropdown-border: 229 229 229; /* #e5e5e5 (neutral-200) */
 
   /* Icons */
   --ec-icon-color: 75 85 99; /* #4b5563 gray-600 */
@@ -43,18 +43,22 @@
   /* Sidebar / Vertical Nav */
   --ec-sidebar-bg: 255 255 255; /* #ffffff */
   --ec-sidebar-bg-gradient: 240 253 244; /* #f0fdf4 green-50 */
-  --ec-sidebar-border: 229 231 235; /* #e5e7eb gray-200 */
+  --ec-sidebar-border: 229 229 229; /* #e5e5e5 (neutral-200) */
   --ec-sidebar-text: 75 85 99; /* #4b5563 gray-600 */
   --ec-sidebar-active-bg: 22 101 52; /* #166534 green-800 */
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 22 101 52; /* #166534 green-800 */
 
+  /* Rail / inset-panel surface (5% off the sidebar bg) */
+  --ec-rail-bg: 250 250 250; /* #fafafa - 2% darker than white */
+  --ec-rail-active-bg: 218 218 218; /* ~10% darker than rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 255 255 255; /* #ffffff */
   --ec-content-text: 17 24 39; /* #111827 gray-900 */
   --ec-content-text-muted: 75 85 99; /* #4b5563 gray-600 */
   --ec-content-text-secondary: 107 114 128; /* #6b7280 gray-500 */
-  --ec-content-border: 229 231 235; /* #e5e7eb gray-200 */
+  --ec-content-border: 229 229 229; /* #e5e5e5 (neutral-200) */
   --ec-content-hover: 249 250 251; /* #f9fafb gray-50 */
   --ec-content-active: 220 252 231; /* #dcfce7 green-100 */
 
@@ -72,7 +76,7 @@
   --ec-page-bg: 255 255 255; /* #ffffff */
   --ec-page-text: 17 24 39; /* #111827 gray-900 */
   --ec-page-text-muted: 75 85 99; /* #4b5563 gray-600 */
-  --ec-page-border: 229 231 235; /* #e5e7eb gray-200 */
+  --ec-page-border: 229 229 229; /* #e5e5e5 (neutral-200) */
 
   /* Card/elevated surfaces */
   --ec-card-bg: 255 255 255; /* #ffffff */
@@ -108,7 +112,7 @@
   /* Header - deep forest dark */
   --ec-header-bg: 3 7 18; /* #030712 gray-950 */
   --ec-header-text: 243 244 246; /* #f3f4f6 gray-100 */
-  --ec-header-border: 17 24 39; /* #111827 gray-900 */
+  --ec-header-border: 31 41 55; /* #1f2937 gray-800 */
 
   /* Accent colors - muted forest green for dark */
   --ec-accent: 74 222 128; /* #4ade80 (green-400) */
@@ -136,18 +140,22 @@
   /* Sidebar / Vertical Nav */
   --ec-sidebar-bg: 3 7 18; /* #030712 gray-950 */
   --ec-sidebar-bg-gradient: 3 7 18; /* #030712 */
-  --ec-sidebar-border: 17 24 39; /* #111827 gray-900 */
+  --ec-sidebar-border: 31 41 55; /* #1f2937 gray-800 */
   --ec-sidebar-text: 156 163 175; /* #9ca3af */
   --ec-sidebar-active-bg: 22 101 52; /* #166534 green-800 */
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 31 41 55; /* #1f2937 */
 
+  /* Rail / inset-panel surface (5% lifted from the sidebar bg) */
+  --ec-rail-bg: 8 12 23; /* ~2% lighter than #030712 */
+  --ec-rail-active-bg: 34 38 49; /* ~10% lifted off rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 3 7 18; /* #030712 */
   --ec-content-text: 243 244 246; /* #f3f4f6 */
   --ec-content-text-muted: 156 163 175; /* #9ca3af */
   --ec-content-text-secondary: 156 163 175; /* #9ca3af */
-  --ec-content-border: 17 24 39; /* #111827 gray-900 */
+  --ec-content-border: 31 41 55; /* #1f2937 gray-800 */
   --ec-content-hover: 17 24 39; /* #111827 */
   --ec-content-active: 31 41 55; /* #1f2937 */
 
@@ -165,7 +173,7 @@
   --ec-page-bg: 3 7 18; /* #030712 */
   --ec-page-text: 243 244 246; /* #f3f4f6 */
   --ec-page-text-muted: 156 163 175; /* #9ca3af */
-  --ec-page-border: 17 24 39; /* #111827 gray-900 */
+  --ec-page-border: 31 41 55; /* #1f2937 gray-800 */
 
   /* Card/elevated surfaces */
   --ec-card-bg: 3 7 18; /* #030712 */

package/eventcatalog/src/styles/themes/ocean.css

@@ -49,6 +49,10 @@
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 13 148 136; /* #0d9488 teal-600 - same as active for consistency */
 
+  /* Rail / inset-panel surface (5% off the sidebar bg) */
+  --ec-rail-bg: 250 250 250; /* #fafafa - 2% darker than white */
+  --ec-rail-active-bg: 218 218 218; /* ~10% darker than rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 255 255 255; /* #ffffff */
   --ec-content-text: 15 23 42; /* #0f172a */
@@ -110,8 +114,8 @@
    * Creates a seamless, immersive dark experience
    */
 
-  /* Header - slightly elevated from page for visual hierarchy */
-  --ec-header-bg: 15 23 42; /* #0f172a slate-900 - subtle lift */
+  /* Header - matches page bg for unified look */
+  --ec-header-bg: 2 6 23; /* #020617 slate-950 - matches page bg */
   --ec-header-text: 226 232 240; /* #e2e8f0 */
   --ec-header-border: 30 41 59; /* #1e293b */
 
@@ -147,6 +151,10 @@
   --ec-sidebar-active-text: 2 6 23; /* #020617 */
   --ec-sidebar-hover-bg: 30 41 59; /* #1e293b */
 
+  /* Rail / inset-panel surface (5% lifted from the sidebar bg) */
+  --ec-rail-bg: 7 11 28; /* ~2% lighter than #020617 */
+  --ec-rail-active-bg: 33 37 54; /* ~10% lifted off rail bg */
+
   /* Nested sidebar content - same as page bg */
   --ec-content-bg: 2 6 23; /* #020617 */
   --ec-content-text: 226 232 240; /* #e2e8f0 */

package/eventcatalog/src/styles/themes/sapphire.css

@@ -49,6 +49,10 @@
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 37 99 235; /* #2563eb blue-600 */
 
+  /* Rail / inset-panel surface (5% off the sidebar bg) */
+  --ec-rail-bg: 250 250 250; /* #fafafa - 2% darker than white */
+  --ec-rail-active-bg: 218 218 218; /* ~10% darker than rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 255 255 255; /* #ffffff */
   --ec-content-text: 15 23 42; /* #0f172a */
@@ -105,8 +109,8 @@
 
 /* Sapphire Dark Mode */
 :root[data-catalog-theme="sapphire"][data-theme="dark"] {
-  /* Header - slightly elevated for visual hierarchy */
-  --ec-header-bg: 15 23 42; /* #0f172a slate-900 */
+  /* Header - matches page bg for unified look */
+  --ec-header-bg: 2 6 23; /* #020617 slate-950 - matches page bg */
   --ec-header-text: 226 232 240; /* #e2e8f0 */
   --ec-header-border: 30 41 59; /* #1e293b slate-800 */
 
@@ -142,6 +146,10 @@
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 30 41 59; /* #1e293b */
 
+  /* Rail / inset-panel surface (5% lifted from the sidebar bg) */
+  --ec-rail-bg: 7 11 28; /* ~2% lighter than #020617 */
+  --ec-rail-active-bg: 33 37 54; /* ~10% lifted off rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 2 6 23; /* #020617 */
   --ec-content-text: 226 232 240; /* #e2e8f0 */

package/eventcatalog/src/styles/themes/sunset.css

@@ -14,16 +14,16 @@
   --ec-header-border: 229 229 229; /* #e5e5e5 neutral-200 */
 
   /* Primary brand color - sunset orange */
-  --ec-primary: 249 115 22; /* #f97316 orange-500 */
-  --ec-primary-hover: 234 88 12; /* #ea580c orange-600 */
+  --ec-primary: 255 106 0; /* #ff6a00 vivid orange */
+  --ec-primary-hover: 232 93 0; /* #e85d00 deeper vivid orange */
 
   /* Accent colors - sunset orange */
-  --ec-accent: 249 115 22; /* #f97316 (orange-500) */
-  --ec-accent-hover: 234 88 12; /* #ea580c (orange-600) */
-  --ec-accent-subtle: 255 237 213; /* #ffedd5 (orange-100) */
-  --ec-accent-text: 154 52 18; /* #9a3412 (orange-800) */
-  --ec-accent-gradient-from: 249 115 22; /* #f97316 (orange-500) */
-  --ec-accent-gradient-to: 234 88 12; /* #ea580c (orange-600) */
+  --ec-accent: 255 106 0; /* #ff6a00 vivid orange */
+  --ec-accent-hover: 232 93 0; /* #e85d00 deeper vivid orange */
+  --ec-accent-subtle: 255 232 209; /* #ffe8d1 (subtle vivid orange) */
+  --ec-accent-text: 122 46 16; /* #7a2e10 burnt orange */
+  --ec-accent-gradient-from: 255 106 0; /* #ff6a00 */
+  --ec-accent-gradient-to: 232 93 0; /* #e85d00 */
 
   /* Buttons */
   --ec-button-bg: 234 88 12; /* #ea580c orange-600 */
@@ -49,6 +49,10 @@
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 234 88 12; /* #ea580c orange-600 */
 
+  /* Rail / inset-panel surface (5% off the sidebar bg) */
+  --ec-rail-bg: 250 250 250; /* #fafafa - 2% darker than white */
+  --ec-rail-active-bg: 218 218 218; /* ~10% darker than rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 255 255 255; /* #ffffff */
   --ec-content-text: 23 23 23; /* #171717 neutral-900 */
@@ -105,18 +109,18 @@
 
 /* Sunset Dark Mode */
 :root[data-catalog-theme="sunset"][data-theme="dark"] {
-  /* Header - warm dark */
-  --ec-header-bg: 23 23 23; /* #171717 neutral-900 */
+  /* Header - matches page bg for unified look */
+  --ec-header-bg: 10 10 10; /* #0a0a0a neutral-950 - matches page bg */
   --ec-header-text: 245 245 245; /* #f5f5f5 neutral-100 */
   --ec-header-border: 38 38 38; /* #262626 neutral-800 */
 
   /* Accent colors - sunset orange for dark */
-  --ec-accent: 251 146 60; /* #fb923c (orange-400) */
-  --ec-accent-hover: 249 115 22; /* #f97316 (orange-500) */
-  --ec-accent-subtle: 154 52 18 / 0.3; /* orange-800/30 */
-  --ec-accent-text: 253 186 116; /* #fdba74 (orange-300) */
-  --ec-accent-gradient-from: 251 146 60; /* #fb923c (orange-400) */
-  --ec-accent-gradient-to: 249 115 22; /* #f97316 (orange-500) */
+  --ec-accent: 255 138 61; /* #ff8a3d punchier vivid orange */
+  --ec-accent-hover: 255 106 0; /* #ff6a00 vivid orange */
+  --ec-accent-subtle: 122 46 16 / 0.3; /* burnt orange/30 */
+  --ec-accent-text: 255 119 51; /* #ff7733 deep vivid orange */
+  --ec-accent-gradient-from: 255 138 61; /* #ff8a3d */
+  --ec-accent-gradient-to: 255 106 0; /* #ff6a00 */
 
   /* Buttons */
   --ec-button-bg: 249 115 22; /* #f97316 orange-500 */
@@ -142,6 +146,10 @@
   --ec-sidebar-active-text: 255 255 255; /* #ffffff */
   --ec-sidebar-hover-bg: 38 38 38; /* #262626 */
 
+  /* Rail / inset-panel surface (5% lifted from the sidebar bg) */
+  --ec-rail-bg: 15 15 15; /* ~2% lighter than #0a0a0a */
+  --ec-rail-active-bg: 41 41 41; /* ~10% lifted off rail bg */
+
   /* Nested sidebar content */
   --ec-content-bg: 10 10 10; /* #0a0a0a */
   --ec-content-text: 245 245 245; /* #f5f5f5 */
@@ -159,7 +167,7 @@
 
   /* Group headers */
   --ec-group-icon-bg: 38 38 38; /* #262626 */
-  --ec-group-icon-text: 253 186 116; /* #fdba74 orange-300 */
+  --ec-group-icon-text: 255 119 51; /* #ff7733 deep vivid orange */
 
   /* Main content/docs area */
   --ec-page-bg: 10 10 10; /* #0a0a0a */

package/eventcatalog/src/utils/eventcatalog-config/config-schema.ts

@@ -0,0 +1,49 @@
+import { z } from 'zod';
+
+export const KNOWN_THEMES = ['default', 'ocean', 'sapphire', 'sunset', 'forest'] as const;
+export type KnownTheme = (typeof KNOWN_THEMES)[number];
+
+const optionalString = (max: number) =>
+  z
+    .string()
+    .max(max)
+    .optional()
+    .transform((v) => (v === undefined || v.trim() === '' ? undefined : v));
+
+const optionalUrl = z
+  .string()
+  .max(2048)
+  .optional()
+  .transform((v) => (v === undefined || v.trim() === '' ? undefined : v))
+  .refine((v) => v === undefined || /^https?:\/\//i.test(v), {
+    message: 'Must be a valid URL starting with http:// or https://',
+  });
+
+export const generalSettingsSchema = z.object({
+  title: z.string().min(1, 'Title is required').max(100),
+  tagline: optionalString(500),
+  organizationName: optionalString(100),
+  homepageLink: optionalUrl,
+  editUrl: optionalUrl,
+  repositoryUrl: optionalUrl,
+  logo: z
+    .object({
+      alt: optionalString(200),
+      text: optionalString(50),
+    })
+    .partial()
+    .optional(),
+  // Allow unknown current theme value (e.g., user hand-edited) so we don't clobber it.
+  theme: z.string().min(1).max(100),
+});
+
+export type GeneralSettings = z.infer<typeof generalSettingsSchema>;
+
+export const aiSettingsSchema = z.object({
+  llmsTxtEnabled: z.boolean(),
+  chatEnabled: z.boolean(),
+});
+
+export type AiSettings = z.infer<typeof aiSettingsSchema>;
+
+export const isKnownTheme = (value: string): value is KnownTheme => (KNOWN_THEMES as readonly string[]).includes(value);

package/eventcatalog/src/utils/eventcatalog-config/config-writer.ts

@@ -0,0 +1,149 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import * as recast from 'recast';
+import babelParser from 'recast/parsers/babel.js';
+
+const b = recast.types.builders;
+type ASTNode = recast.types.ASTNode;
+type ObjectExpression = recast.types.namedTypes.ObjectExpression;
+type Property = recast.types.namedTypes.Property;
+type ObjectProperty = recast.types.namedTypes.ObjectProperty;
+
+export type ConfigPrimitive = string | boolean;
+
+export type ConfigUpdate = {
+  // Primitive value → set; `null` → remove; object → recurse one level.
+  [key: string]: ConfigPrimitive | null | NestedConfigUpdate;
+};
+
+type NestedConfigUpdate = {
+  [key: string]: ConfigPrimitive | null;
+};
+
+const projectRoot = () => process.env.PROJECT_DIR ?? process.cwd();
+
+export const getConfigPath = () => path.join(projectRoot(), 'eventcatalog.config.js');
+
+export const readConfigSource = (): string => fs.readFileSync(getConfigPath(), 'utf8');
+
+const parse = (source: string) => recast.parse(source, { parser: babelParser });
+
+const isObjectProperty = (n: any): n is Property | ObjectProperty => n && (n.type === 'ObjectProperty' || n.type === 'Property');
+
+const propertyKeyName = (prop: Property | ObjectProperty): string | null => {
+  const key: any = prop.key;
+  if (!key) return null;
+  if (key.type === 'Identifier') return key.name;
+  if (key.type === 'Literal' || key.type === 'StringLiteral') return String(key.value);
+  return null;
+};
+
+const findExportedObject = (ast: ASTNode): ObjectExpression => {
+  let result: ObjectExpression | null = null;
+  recast.visit(ast, {
+    visitExportDefaultDeclaration(p) {
+      const decl: any = p.node.declaration;
+      if (decl?.type === 'ObjectExpression') {
+        result = decl as ObjectExpression;
+      } else if (decl?.type === 'TSAsExpression' && decl.expression?.type === 'ObjectExpression') {
+        result = decl.expression as ObjectExpression;
+      }
+      return false;
+    },
+  });
+  if (!result) throw new Error('Could not find `export default { ... }` in eventcatalog.config.js');
+  return result;
+};
+
+const findProperty = (obj: ObjectExpression, name: string): (Property | ObjectProperty) | null => {
+  for (const prop of obj.properties) {
+    if (isObjectProperty(prop) && propertyKeyName(prop) === name) return prop as Property | ObjectProperty;
+  }
+  return null;
+};
+
+const removeProperty = (obj: ObjectExpression, name: string): boolean => {
+  const idx = obj.properties.findIndex((p) => isObjectProperty(p) && propertyKeyName(p) === name);
+  if (idx === -1) return false;
+  obj.properties.splice(idx, 1);
+  return true;
+};
+
+const buildLiteral = (value: ConfigPrimitive) => (typeof value === 'boolean' ? b.booleanLiteral(value) : b.stringLiteral(value));
+
+const setPrimitiveProperty = (obj: ObjectExpression, name: string, value: ConfigPrimitive) => {
+  const existing = findProperty(obj, name);
+  const literal = buildLiteral(value);
+  if (existing) {
+    (existing as any).value = literal;
+    return;
+  }
+  obj.properties.push(b.property('init', b.identifier(name), literal) as any);
+};
+
+const ensureNestedObject = (obj: ObjectExpression, name: string): ObjectExpression => {
+  const existing = findProperty(obj, name);
+  if (existing && (existing as any).value?.type === 'ObjectExpression') {
+    return (existing as any).value as ObjectExpression;
+  }
+  const fresh = b.objectExpression([]);
+  if (existing) {
+    (existing as any).value = fresh;
+  } else {
+    obj.properties.push(b.property('init', b.identifier(name), fresh) as any);
+  }
+  return fresh;
+};
+
+const removeNestedObjectIfEmpty = (obj: ObjectExpression, name: string) => {
+  const existing = findProperty(obj, name);
+  if (!existing) return;
+  const value: any = (existing as any).value;
+  if (value?.type === 'ObjectExpression' && value.properties.length === 0) {
+    removeProperty(obj, name);
+  }
+};
+
+/**
+ * Apply an update to eventcatalog.config.js, preserving formatting/comments via recast.
+ *
+ * - String value → replace existing or insert new property
+ * - `null` value → remove property if present
+ * - Nested object value → recurse one level (sufficient for v1 fields like `logo`)
+ *
+ * Returns the updated source. Caller is responsible for writing it.
+ */
+export const applyConfigUpdate = (source: string, update: ConfigUpdate): string => {
+  const ast = parse(source);
+  const root = findExportedObject(ast);
+
+  for (const [key, value] of Object.entries(update)) {
+    if (value === null) {
+      removeProperty(root, key);
+      continue;
+    }
+    if (typeof value === 'string' || typeof value === 'boolean') {
+      setPrimitiveProperty(root, key, value);
+      continue;
+    }
+    // nested object update
+    const nested = ensureNestedObject(root, key);
+    for (const [nestedKey, nestedValue] of Object.entries(value)) {
+      if (nestedValue === null) {
+        removeProperty(nested, nestedKey);
+      } else if (typeof nestedValue === 'string' || typeof nestedValue === 'boolean') {
+        setPrimitiveProperty(nested, nestedKey, nestedValue);
+      }
+    }
+    removeNestedObjectIfEmpty(root, key);
+  }
+
+  return recast.print(ast, { quote: 'single' }).code;
+};
+
+export const writeConfigUpdate = (update: ConfigUpdate): string => {
+  const source = readConfigSource();
+  const updated = applyConfigUpdate(source, update);
+  fs.writeFileSync(getConfigPath(), updated, 'utf8');
+  return updated;
+};