init: @ui-arch 私人组件库 monorepo
- core/table-core: Headless 表格内核(排序/筛选/分页/选择插件 + 冒烟 9 项) - core/frame: signal/computed/effect + hyperscript 微框架(零依赖) - skin/ui: 16 个 DOM 组件(含自绘 select、滑动指示条 tabs、行选择 dataTable、form 表单校验) - design/tokens: --ua-* 设计令牌(light/dark) - tools/cli: ua 命令行(index/list/info/docs/style/mcp)+ MCP 注册表服务 - apps: demo 演示站(esbuild 单文件)+ docs 双轨文档(人类版 + llms-full.txt)
This commit is contained in:
@@ -0,0 +1,15 @@
|
||||
{
|
||||
"name": "@ui-arch/tokens",
|
||||
"version": "0.1.0",
|
||||
"description": "Design tokens for the @ui-arch component library (CSS variables + JSON)",
|
||||
"type": "module",
|
||||
"exports": {
|
||||
"./tokens.css": "./tokens.css",
|
||||
"./tokens.json": "./tokens.json"
|
||||
},
|
||||
"files": [
|
||||
"tokens.css",
|
||||
"tokens.json"
|
||||
],
|
||||
"license": "MIT"
|
||||
}
|
||||
@@ -0,0 +1,40 @@
|
||||
/* @ui-arch design tokens - light theme defaults + dark theme overrides */
|
||||
:root {
|
||||
--ua-color-bg: #ffffff;
|
||||
--ua-color-surface: #f6f7f9;
|
||||
--ua-color-text: #1c1e21;
|
||||
--ua-color-text-muted: #6b7280;
|
||||
--ua-color-border: rgba(0, 0, 0, 0.15);
|
||||
--ua-color-accent: #185fa5;
|
||||
--ua-color-accent-contrast: #ffffff;
|
||||
--ua-color-danger: #a32d2d;
|
||||
--ua-color-success: #0f6e56;
|
||||
--ua-color-warning: #9a6b1f;
|
||||
|
||||
--ua-radius-sm: 4px;
|
||||
--ua-radius-md: 8px;
|
||||
--ua-radius-lg: 12px;
|
||||
|
||||
--ua-space-1: 4px;
|
||||
--ua-space-2: 8px;
|
||||
--ua-space-3: 12px;
|
||||
--ua-space-4: 16px;
|
||||
--ua-space-table-cell: var(--ua-space-2) var(--ua-space-3);
|
||||
|
||||
--ua-font-size-sm: 12px;
|
||||
--ua-font-size-md: 13px;
|
||||
--ua-font-size-lg: 14px;
|
||||
}
|
||||
|
||||
[data-theme='dark'] {
|
||||
--ua-color-bg: #101216;
|
||||
--ua-color-surface: #1a1c22;
|
||||
--ua-color-text: #e7e9ec;
|
||||
--ua-color-text-muted: #888780;
|
||||
--ua-color-border: rgba(255, 255, 255, 0.15);
|
||||
--ua-color-accent: #378add;
|
||||
--ua-color-accent-contrast: #042c53;
|
||||
--ua-color-danger: #d96a6a;
|
||||
--ua-color-success: #4fc39e;
|
||||
--ua-color-warning: #d9a94f;
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
{
|
||||
"$schema": "https://design-tokens.github.io/community-group/format/",
|
||||
"color": {
|
||||
"bg": { "light": "#ffffff", "dark": "#101216" },
|
||||
"surface": { "light": "#f6f7f9", "dark": "#1a1c22" },
|
||||
"text": { "light": "#1c1e21", "dark": "#e7e9ec" },
|
||||
"textMuted": { "light": "#6b7280", "dark": "#888780" },
|
||||
"accent": { "light": "#185fa5", "dark": "#378add" },
|
||||
"danger": "#a32d2d",
|
||||
"success": "#0f6e56"
|
||||
},
|
||||
"radius": { "sm": "4px", "md": "8px", "lg": "12px" },
|
||||
"space": { "1": "4px", "2": "8px", "3": "12px", "4": "16px" }
|
||||
}
|
||||
@@ -0,0 +1,32 @@
|
||||
{
|
||||
"name": "@ui-arch/tokens",
|
||||
"type": "design-tokens",
|
||||
"description": "Single source of design tokens. Skin packages consume CSS variables only - hardcoded colors inside skins are forbidden. Dark theme overrides values under [data-theme='dark'], never names.",
|
||||
"tags": [
|
||||
"tokens",
|
||||
"theme",
|
||||
"css-variables"
|
||||
],
|
||||
"api": {
|
||||
"entry": "tokens.css",
|
||||
"exports": [
|
||||
"tokens.css: import '@ui-arch/tokens/tokens.css' once at app root",
|
||||
"tokens.json: programmatic access for tools and agents"
|
||||
],
|
||||
"keyTypes": [
|
||||
"--ua-color-*",
|
||||
"--ua-space-*",
|
||||
"--ua-radius-*"
|
||||
]
|
||||
},
|
||||
"usage": "import '@ui-arch/tokens/tokens.css'; then use var(--ua-color-accent) etc. in any skin package",
|
||||
"docs": {
|
||||
"intro": "设计令牌唯一来源:CSS 变量 --ua-* + 同名 JSON。皮肤只允许消费变量,禁止硬编码颜色;暗色只换值不换名。",
|
||||
"steps": [
|
||||
"引入:在应用入口 import '@ui-arch/tokens/tokens.css'",
|
||||
"消费:组件样式一律 var(--ua-color-accent) 这类变量,不写死色值",
|
||||
"暗色:根元素设 data-theme=dark,变量值自动切换",
|
||||
"扩展:新令牌先同时加进 tokens.css 与 tokens.json,再重新生成文档站"
|
||||
]
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user