Files
wehub-resource-sync e30e75b5d4
Changesets / Create Version PR (push) Has been cancelled
Deploy Shadcn Registry / Deploy Production (push) Has been cancelled
Template Metrics / LOC + Bundle Size (push) Has been cancelled
Code Quality / Oxlint + Oxfmt (push) Has been cancelled
Code Quality / Template Sync (push) Has been cancelled
Code Quality / Build Changed Packages (push) Has been cancelled
Code Quality / Test Changed Packages (push) Has been cancelled
Deploy Expo Example / Deploy Production (push) Has been cancelled
Deploy Ink Example / Deploy Production (push) Has been cancelled
Python Tests / pytest (assistant-stream, 3.10) (push) Has been cancelled
Python Tests / pytest (assistant-stream, 3.12) (push) Has been cancelled
Python Tests / pytest (assistant-ui-sync-server-api, 3.10) (push) Has been cancelled
Python Tests / pytest (assistant-ui-sync-server-api, 3.12) (push) Has been cancelled
chore: import upstream snapshot with attribution
2026-07-13 13:40:13 +08:00

79 lines
1.8 KiB
TypeScript

/**
* Design tokens for the assistant-ui Expo example.
*
* These mirror the canonical web kit (`packages/ui`): a neutral zinc palette,
* a clean ChatGPT-grade look with subtle hairline borders and no heavy glass or
* shadow. Values are the sRGB equivalents of the web `oklch` tokens.
*/
export type Palette = {
background: string;
foreground: string;
card: string;
cardForeground: string;
muted: string;
mutedForeground: string;
accent: string;
border: string;
primary: string;
primaryForeground: string;
composer: string;
destructive: string;
destructiveForeground: string;
destructiveSurface: string;
ring: string;
};
export const Colors: { light: Palette; dark: Palette } = {
light: {
background: "#ffffff",
foreground: "#18181b",
card: "#ffffff",
cardForeground: "#18181b",
muted: "#f4f4f5",
mutedForeground: "#71717a",
accent: "#f4f4f5",
border: "#e4e4e7",
primary: "#18181b",
primaryForeground: "#fafafa",
composer: "#fafafa",
destructive: "#dc2626",
destructiveForeground: "#ffffff",
destructiveSurface: "rgba(220, 38, 38, 0.08)",
ring: "#a1a1aa",
},
dark: {
background: "#18181b",
foreground: "#fafafa",
card: "#27272a",
cardForeground: "#fafafa",
muted: "#3f3f46",
mutedForeground: "#a1a1aa",
accent: "#3f3f46",
border: "rgba(255, 255, 255, 0.1)",
primary: "#e4e4e7",
primaryForeground: "#18181b",
composer: "#232326",
destructive: "#f87171",
destructiveForeground: "#18181b",
destructiveSurface: "rgba(248, 113, 113, 0.12)",
ring: "#52525b",
},
};
export const Radius = {
sm: 6,
md: 8,
lg: 10,
card: 16,
bubble: 18,
composer: 24,
attachment: 14,
pill: 999,
} as const;
export const Spacing = {
threadMaxWidth: 768,
gutter: 16,
} as const;