bunx @codeatlasdev/ui init --write
这就是设置。 主题、 暗模式、 错误的页面、 不显示白色闪光。 斯维特基特或天体.
12行的整页
<AppList title="Users" data={users} searchKeys={['name', 'email']}>
{#snippet children(list)}
<SimpleTable responsive="cards">
<thead><tr><th>User</th><th>Role</th></tr></thead>
<tbody>
{#each list.rows as u (u.id)}
<tr><td><UserCell name={u.name} email={u.email} /></td><td>{u.role}</td></tr>
{/each}
</tbody>
</SimpleTable>
{/snippet}
</AppList>
搜索“ pagination ” 的空状态 0 个
一个六分之一的品牌
export const theme = defineTheme({
presets: [{ id: 'acme', color: '#2563eb' }],
defaultPreset: 'acme',
});
每一个标志都来自它, 光和黑暗, 在第一帧.
想要一种感觉吗? designStyle('swiss'), (中文(简体) ), 'brutalism', (中文(简体) ), 'sketchbook', (中文(简体) ), 'liquid' (玻璃一)... 相同的组件,新的语言.
为什么它会不同
| 🧱 页面,不是砖头 | AppList AppForm AppSettings AppShellLayout AuthLayout DocsShell |
| 🎨 向下移动 | 组件中没有原始 px, 如果有人溜进来, 将失败 |
| 🪟 样式是主题键 | defaultStyle 选取固体(默认)、平地、平地、平地、陶土、粘土、被霜冻、玻璃等; <Surface material="auto"> 跟着它 |
| 🧭 真实层 | 本地语言 <dialog> + popover上层, 无 z 指数战争 |
| ♿ 无聊的东西,保证 | aa/aa对比,44px触摸目标,无侧道滚动. 测试 |
| 🤖 代理本土 | 技能, llms.txt 和一个 MCP 服务器 (ca-ui-mcp) 生成自代码 |
里面的东西
版式 Box Flex Stack Grid Container Section Surface Card
弹壳 AppShellLayout PageShell MobilePane StickyActions DocsShell
投入 Button TextField Select Combobox DatePicker PinInput MoneyInput .
覆盖 Dialog AlertDialog Sheet Drawer Popover Tooltip CommandPalette
数据 DataTable SimpleTable KpiGrid LiveList + 8个图表(/charts(中文(简体) )
塞尔维亚 Seo, json- ld, sitemap, 生成的外观 + og 图像 (/seo, (中文(简体) ), /vite(中文(简体) )
重件是选入 : /charts 需求 echarts, (中文(简体) ), /table 需求 @tanstack/svelte-table, (中文(简体) ), /code 需求 shiki。 。 。 .
黑进去
git clone https://github.com/codeatlasdev/ui && cd ui
bun install && bun dev # lib watcher + docs site, one command
感谢我们的主要支持者 法比奥·恩里克·阿劳霍 (单位:千美元)@FabioHaraujo (英语)和 理查德森·道格拉斯 (单位:千美元)@Richards0nd (英语)) (中文(简体) )
(单位:千美元) 代码图集