feat: stash-ui 0.1.0（40 个组件 + 文档站 + 主题机制）

2026-10-28 20:44:18 +08:00
commit 52296b3368
153 changed files with 17129 additions and 0 deletions
@@ -0,0 +1,51 @@
+import { Card, Steps } from '../../src'
+import { Demo } from '../components/Demo'
+import { PropsTable } from '../components/PropsTable'
+import { Section } from '../components/Section'
+
+const ITEMS = [
+  { title: '建立内容库', description: '首次启动自动建表并灌入种子' },
+  { title: '调整分区与分组', description: '用 SQLite 工具直接改 node 表' },
+  { title: '配置首页卡片', description: 'section_block 决定展示哪个节点' },
+  { title: '发布', description: '条目 body 写 Markdown 即可' },
+]
+
+export function StepsSection() {
+  return (
+    <Section
+      id="steps"
+      title="步骤"
+      api="Steps"
+      desc="纵向流程：已完成打勾、当前项高亮、未开始置灰。适合发布流程、导入向导这类有顺序的任务。"
+    >
+      <Demo
+        title="进行中"
+        desc="current 从 0 开始；index < current 视为已完成。"
+        layout="column"
+        code={`<Steps items={items} current={1} />`}
+      >
+        <Card padding="lg">
+          <Steps items={ITEMS} current={1} />
+        </Card>
+      </Demo>
+
+      <Demo
+        title="全部完成"
+        desc="current 超出最后一项时，所有步骤都显示为已完成。"
+        layout="column"
+        code={`<Steps items={items} current={items.length} />`}
+      >
+        <Card padding="lg">
+          <Steps items={ITEMS} current={ITEMS.length} />
+        </Card>
+      </Demo>
+
+      <PropsTable
+        rows={[
+          { name: 'items', type: 'StepItem[]', required: true, desc: '{ title, description? }' },
+          { name: 'current', type: 'number', required: true, desc: '当前步骤索引，从 0 开始' },
+        ]}
+      />
+    </Section>
+  )
+}