Initial commit

frontend/src/data/library.ts

@@ -0,0 +1,25 @@
+import type { ButtonExample } from '../components/ButtonMatrix'
+import type { Token } from '../components/TokenGrid'
+
+/* Navigation lives in src/app/routes.tsx, next to the route table it has to
+   match — see tests/routing.test.tsx, which keeps the two in sync. */
+
+export const buttonTabs = ['Preview', 'API reference', 'Usage']
+
+export const buttonExamples: ButtonExample[] = [
+  { name: 'Primary', label: 'Deploy changes', variant: 'primary' },
+  { name: 'Secondary', label: 'View activity', variant: 'secondary' },
+  { name: 'Destructive', label: 'Delete project', variant: 'danger' },
+  { name: 'Ghost', label: 'Cancel', variant: 'ghost' },
+]
+
+export const colorTokens: Token[] = [
+  { name: 'Primary', color: 'var(--primary)', value: 'lab(89.9% -47.9 -15.7)' },
+  { name: 'Background', color: 'var(--background)', value: 'lab(0% 0 0)' },
+  { name: 'Card', color: 'var(--card)', value: 'lab(0.9% 0 0)' },
+  { name: 'Destructive', color: 'var(--destructive)', value: 'lab(54.6% 71.7 50.9)' },
+  { name: 'Chart 1', color: 'var(--chart-1)', value: 'lab(89.9% -47.9 -15.7)' },
+  { name: 'Chart 2', color: 'var(--chart-2)', value: 'lab(67.0% -58.3 19.5)' },
+  { name: 'Chart 3', color: 'var(--chart-3)', value: 'lab(72.7% 31.9 97.9)' },
+  { name: 'Chart 4', color: 'var(--chart-4)', value: 'lab(52.0% 66.1 -78.2)' },
+]

frontend/src/data/patterns.ts

@@ -0,0 +1,12 @@
+/* Pattern catalogue for the showcase. A pattern id is a URL parameter
+   (`/patterns?pattern=table`), so this list is also the source for the
+   sidebar's pattern entries — see src/app/routes.tsx. */
+
+export const PATTERNS = [
+  { id: 'metrics', label: 'Metrics Dashboard', icon: 'sparkles' },
+  { id: 'settings', label: 'Settings & Safeguards', icon: 'settings' },
+  { id: 'table', label: 'Service Monitor Table', icon: 'layers' },
+  { id: 'deploy', label: 'Deployment Flow', icon: 'terminal' },
+] as const
+
+export type PatternId = (typeof PATTERNS)[number]['id']