lingee-ui 0.0.24 → 0.0.26

package/skill/SKILL.md

@@ -2,17 +2,17 @@
 name: lingee-ui-usage
 description: 使用 lingee-ui 组件库与 lingee-icon 图标库开发 React 界面。当需要编写含按钮、表单、弹窗、表格、下拉、页签、图标等 UI 的 React/TypeScript 代码，或需要查询 lingee-ui 组件 API、Design Token 语义变量、可用图标名时触发。关键词：lingee-ui、lingee-icon、组件库、图标库、Design Token、语义变量、lg- 前缀、UI 组件。
 metadata:
-  lingeeUi: "0.0.24"
-  lingeeIcon: "1.0.22"
+  lingeeUi: "0.0.26"
+  lingeeIcon: "1.0.23"
   generatedBy: "gen-skill.mjs"
 ---
 
 # lingee-ui 组件库使用技能
 
-Kingdee Lingee 设计体系的 React 组件库（42 个组件）与图标库（990 个图标）。
+Kingdee Lingee 设计体系的 React 组件库（45 个组件）与图标库（992 个图标）。
 本技能面向**消费方项目**，只覆盖「如何用」，不含组件库内部开发约定。
 
-- 组件库版本 `0.0.24` ｜ 图标库版本 `1.0.22`
+- 组件库版本 `0.0.26` ｜ 图标库版本 `1.0.23`
 - 组件在线预览：https://kingdee.github.io/lingee-ui/
 - 图标在线预览：https://kingdee.github.io/lingee-icon/
 
@@ -50,7 +50,7 @@ createRoot(el).render(
 );
 ```
 
-详细接入说明（暗色模式、仅用 Token、样式覆盖、SSR）见 `references/setup.md`。
+详细接入说明（主题切换、仅用 Token、样式覆盖、SSR）见 `references/setup.md`。
 
 ## 组件清单
 
@@ -61,6 +61,7 @@ createRoot(el).render(
 | `Breadcrumb` | 面包屑 | 显示当前页面在系统层级结构中的位置，并提供返回之前层级的导航。 | `breadcrumb.md` | — |
 | `Button` | 按钮 | 用于触发一个操作，是用户与系统交互的基础元素。 | `button.md` | ✓ |
 | `Carousel`、`CarouselItem` | 轮播容器 | 水平轮播容器，用于在一屏内循环展示一组内容，支持自动播放、拖拽切换与圆点指示器。 | `carousel.md` | — |
+| `Cascader` | 级联选择 | 逐级展开的多列菜单，用于选择省市区等层级路径。 | `cascader.md` | — |
 | `Checkbox`、`CheckboxGroup` | 多选框 | 在一组选项中进行多项选择。 | `checkbox.md` | — |
 | `ColorPicker` | 颜色选择器 | 用于选择颜色值的交互组件。 | `color-picker.md` | — |
 | `DatePicker` | 日期选择器 | 用于选择日期的输入组件。 | `date-picker.md` | — |
@@ -94,9 +95,11 @@ createRoot(el).render(
 | `Tag` | 标签 | 用于标记和分类的小型标签元素。 | `tag.md` | — |
 | `Textarea` | 多行文本框 | 多行纯文本编辑控件，支持字数统计和自动高度。 | `textarea.md` | — |
 | `TimePicker` | 时间选择器 | 用于选择时间的输入组件。 | `time-picker.md` | — |
+| `Timeline`、`TimelineCard` | 时间轴 | 纵向展示按时间或流程先后排列的一组节点，可配合卡片承载节点详情。 | `timeline.md` | — |
 | `toast` | 全局提示 | 命令式全局提示组件，用于操作反馈。 | `toast.md` | ✓ |
 | `Tooltip` | 文字提示 | 鼠标悬停时显示的简短提示信息。 | `tooltip.md` | ✓ |
 | `Tree` | 树形控件 | 用于展示层级结构数据，支持勾选、拖拽排序、异步加载与虚拟滚动。 | `tree.md` | ✓ |
+| `TreeSelect` | 树选择 | 下拉面板中以树形结构选择单个节点。 | `tree-select.md` | — |
 | `Upload` | 上传 | 文件上传组件，支持点击和拖拽上传。 | `upload.md` | — |
 
 - 「文档」列对应 `references/components/` 下的文件名，含完整 Props 与示例
@@ -137,14 +140,14 @@ import { Search, Trash } from "lingee-icon";
 图标默认 `size="1em"`、`color="currentColor"`，即随父级字号与文字颜色走，
 所以**优先用 CSS 控制颜色**而不是传 `color` prop。
 
-完整 Props 见 `references/setup.md`，990 个图标的名称与中文语义索引见 `references/icons.md`。
+完整 Props 见 `references/setup.md`，992 个图标的名称与中文语义索引见 `references/icons.md`。
 选图标时必须从索引中查找，**不要凭猜测写图标名**，也不要从 `@ant-design/icons`、`lucide-react` 等其他库引入。
 
 ## 颜色：优先用语义 Token
 
 两条铁律：
 
-1. **禁止使用 primitives 色板变量**（`--lg-primary-600`、`--lg-black-82`），它们不随暗色模式切换，这条没有例外
+1. **禁止使用 primitives 色板变量**（`--lg-primary-600`、`--lg-black-82`），它们不随主题切换，这条没有例外
 2. 优先用语义层 `--lg-g-*` 变量，按 CSS 属性选前缀：
 
 | CSS 属性 | Token 前缀 |
@@ -177,7 +180,7 @@ import { Search, Trash } from "lingee-icon";
 | 边框-品牌 | `var(--lg-g-border-color-primary-default)` | `#495DFF` |
 | 边框-危险 | `var(--lg-g-border-color-danger-default)` | `#F12234` |
 
-暗色模式给 `<html>` 加 `data-theme="dark"` 即自动切换，无需额外处理。
+主题给 `<html>` 设 `data-theme` 即自动切换：暗色为 `dark`，暖棕为 `warm`，不设为亮色，无需额外处理。
 
 ### 已废弃的错拼 Token
 
@@ -205,7 +208,7 @@ import { Search, Trash } from "lingee-icon";
 
 设计稿给的是 hex 时，到 `references/tokens.md` 搜该 hex，表格含亮/暗两列最终色值，可直接反查。
 
-全量 211 个语义 Token 见 `references/tokens.md`。
+全量 227 个语义 Token 见 `references/tokens.md`。
 
 ## 查阅详细 API
 
@@ -214,7 +217,7 @@ import { Search, Trash } from "lingee-icon";
 
 | 文件 | 内容 |
 |------|------|
-| `references/setup.md` | 安装、样式引入、Provider、暗色模式、样式覆盖、图标 Props |
+| `references/setup.md` | 安装、样式引入、Provider、主题切换、样式覆盖、图标 Props |
 | `references/components/*.md` | 逐组件 API 表 + 最小示例 |
-| `references/tokens.md` | 全量语义 Token（含亮/暗色值，可按 hex 反查） |
+| `references/tokens.md` | 全量语义 Token（含亮 / 暗色值与暖棕差异项，可按 hex 反查） |
 | `references/icons.md` | 全量图标索引（含中文语义） |

package/skill/VERSION.json

@@ -1,7 +1,7 @@
 {
-  "lingeeUi": "0.0.24",
-  "lingeeIcon": "1.0.22",
-  "componentCount": 42,
-  "iconCount": 990,
-  "sourceHash": "3c511f3923bbbc2a"
+  "lingeeUi": "0.0.26",
+  "lingeeIcon": "1.0.23",
+  "componentCount": 45,
+  "iconCount": 992,
+  "sourceHash": "901fcc95868741b1"
 }

package/skill/references/components/cascader.md

@@ -0,0 +1,97 @@
+# Cascader 级联选择
+
+逐级展开的多列菜单，用于选择省市区等层级路径。
+
+- 导入：`import { Cascader } from "lingee-ui";`
+- 可用类型：`CascaderProps`, `CascaderOption`, `CascaderSize`, `CascaderDropdownProps`
+
+## 最小示例
+
+```tsx
+import { useState } from "react";
+import { Cascader } from "lingee-ui";
+import type { CascaderOption } from "lingee-ui";
+
+const options: CascaderOption[] = [
+  {
+    value: "a",
+    label: "Level A",
+    children: [
+      {
+        value: "a-1",
+        label: "Level A-1",
+        children: [
+          { value: "a-1-1", label: "Level A-1-1" },
+          { value: "a-1-2", label: "Level A-1-2" },
+        ],
+      },
+      { value: "a-2", label: "Level A-2" },
+    ],
+  },
+  {
+    value: "b",
+    label: "Level B",
+    children: [{ value: "b-1", label: "Level B-1" }],
+  },
+];
+
+export default function BasicDemo() {
+  const [value, setValue] = useState<string[]>([]);
+
+  return (
+    <div style={{ width: 280 }}>
+      <Cascader
+        options={options}
+        value={value}
+        onChange={setValue}
+        placeholder="Select a path"
+        allowClear
+      />
+    </div>
+  );
+}
+```
+
+## API
+
+### Cascader
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `options` | 级联数据 | `CascaderOption[]` | - |
+| `value` | 当前选中路径（受控），显式传 `undefined` 也视为受控的空值 | `string[]` | - |
+| `defaultValue` | 默认选中路径（非受控） | `string[]` | - |
+| `onChange` | 选中叶子或清空时回调，清空时路径为空数组 | `(value: string[], selectedOptions: CascaderOption[]) => void` | - |
+| `placeholder` | 占位文本 | `string` | - |
+| `disabled` | 是否禁用 | `boolean` | `false` |
+| `error` | 是否错误态 | `boolean` | `false` |
+| `allowClear` | 是否可清空 | `boolean` | `false` |
+| `size` | 尺寸 | `"sm" \| "md" \| "lg"` | `"md"` |
+| `separator` | 触发器中各级文本的分隔符 | `string` | `" / "` |
+| `notFoundContent` | 无数据时面板中展示的内容 | `ReactNode` | 「暂无数据」缺省态 |
+| `dropdown` | 下拉面板配置，字段见 CascaderDropdownProps | `CascaderDropdownProps` | - |
+| `className` | 自定义类名 | `string` | - |
+| `style` | 自定义样式 | `CSSProperties` | - |
+
+### CascaderOption
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `value` | 选项值，同一层级内需唯一 | `string` | - |
+| `label` | 选项文本，选中后按层级拼接显示在触发器中 | `ReactNode` | - |
+| `children` | 下一级选项 | `CascaderOption[]` | - |
+| `disabled` | 是否禁用 | `boolean` | `false` |
+
+### CascaderDropdownProps
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `maxHeight` | 每列的最大高度（px），超出时该列滚动；同时不超出视口可用高度 | `number` | `346` |
+| `className` | 下拉浮层的自定义类名 | `string` | - |
+| `container` | Portal 挂载容器，传 `null` 时就地渲染；长文本的悬浮提示挂在同一容器 | `HTMLElement \| null` | `document.body` |
+
+### CSS 变量
+
+| 变量 | 说明 | 默认值 |
+|------|------|--------|
+| `--lg-cascader-menu-max-width` | 每列的最大宽度，超出的文字省略 | `200px` |

package/skill/references/components/color-picker.md

@@ -3,7 +3,7 @@
 用于选择颜色值的交互组件。
 
 - 导入：`import { ColorPicker } from "lingee-ui";`
-- 可用类型：`ColorPickerProps`, `ColorPickerSize`
+- 可用类型：`ColorPickerProps`, `ColorPickerRgba`, `ColorPickerSize`
 
 ## 最小示例
 
@@ -17,7 +17,7 @@ export default function BasicDemo() {
   return (
     <div style={{ width: 260 }}>
       <ColorPicker value={color} onChange={setColor} />
-      <p style={{ marginTop: 12, fontSize: 14, color: "#666" }}>
+      <p style={{ marginTop: 12, fontSize: 14, color: "var(--lg-g-fg-color-black-muted)" }}>
         Current color: {color}
       </p>
     </div>
@@ -31,7 +31,8 @@ export default function BasicDemo() {
 |------|------|------|--------|
 | `value` | 当前颜色值（受控） | `string` | - |
 | `defaultValue` | 默认颜色值（非受控） | `string` | - |
-| `onChange` | 颜色变化回调 | `(color: string) => void` | - |
+| `onChange` | 颜色变化回调，`color` 为 hex（含透明度时为 8 位） | `(color: string, rgba: ColorPickerRgba) => void` | - |
+| `onChangeComplete` | 拖拽结束回调，适合只在最终色值上触发请求的场景 | `(color: string, rgba: ColorPickerRgba) => void` | - |
 | `disabled` | 是否禁用 | `boolean` | `false` |
 | `disabledAlpha` | 是否禁用透明度 | `boolean` | `false` |
 | `size` | 尺寸 | `"sm" \| "md" \| "lg"` | `"md"` |
@@ -39,4 +40,10 @@ export default function BasicDemo() {
 | `placement` | 面板弹出方向 | `"top" \| "bottom" \| "left" \| "right"` | `"bottom"` |
 | `panelExtra` | 面板额外内容（如预设色板） | `ReactNode` | - |
 | `placeholder` | 占位文本 | `string` | - |
-| `onChangeComplete` | 拖拽结束回调，适合只在最终色值上触发请求的场景 | `(color: string) => void` | - |
+| `children` | 自定义触发器，需为能接收 ref 与点击事件的单个元素；传入后 `size` / `error` / `placeholder` / `className` / `style` 不再作用于触发器 | `ReactElement` | - |
+| `showInput` | 面板内显示十六进制与透明度输入框 | `boolean` | `false` |
+| `getPopupContainer` | 浮层挂载容器，打开面板时求值；全屏元素内使用时需返回该元素，否则面板不可见 | `() => HTMLElement` | `document.body` |
+| `className` | 默认触发器的自定义类名 | `string` | - |
+| `style` | 默认触发器的自定义样式 | `CSSProperties` | - |
+
+`ColorPickerRgba` 为 `{ r: number; g: number; b: number; a: number }`，`r` / `g` / `b` 取 0–255，`a` 取 0–1。

package/skill/references/components/date-picker.md

@@ -18,7 +18,7 @@ export default function BasicDemo() {
     <div style={{ width: 292 }}>
       {/* 不传 placeholder，展示组件跟随 Provider 语言的默认占位符 */}
       <DatePicker value={value} onChange={(v) => setValue(v)} />
-      <p style={{ marginTop: 12, fontSize: 14, color: "#666" }}>
+      <p style={{ marginTop: 12, fontSize: 14, color: "var(--lg-g-fg-color-black-muted)" }}>
         {value ? value.toLocaleDateString() : "—"}
       </p>
     </div>

package/skill/references/components/dialog.md

@@ -28,7 +28,7 @@ export default function BasicDemo() {
         onOk={() => setOpen(false)}
         onCancel={() => setOpen(false)}
       >
-        <p style={{ padding: "0 20px", color: "rgba(0,0,0,0.64)" }}>
+        <p style={{ padding: "0 20px", color: "var(--lg-g-fg-color-black-muted)" }}>
           This is the dialog content area. You can put anything here.
         </p>
       </Dialog>

package/skill/references/components/drawer.md

@@ -40,6 +40,6 @@ export default function BasicDemo() {
 | `modal` | 是否为模态模式 | `boolean` | `false` |
 | `footer` | 底部操作区 | `ReactNode` | - |
 | `extra` | 标题栏右侧额外内容 | `ReactNode` | - |
-| `destroyOnHidden` | 关闭后是否销毁子节点 | `boolean` | `true` |
+| `destroyOnHidden` | 关闭后是否销毁子节点。`false` 时首次打开后子节点常驻，关闭只隐藏、重开复用原实例（适合承载需保留会话的 iframe）；隐藏期间面板仍挂着 Esc 监听，处于最上层时 Esc 事件会被标记 `defaultPrevented` | `boolean` | `true` |
 | `zIndex` | 自定义 z-index，优先于 Provider 基线 | `number` | - |
 | `children` | 内容区域 | `ReactNode` | - |

package/skill/references/components/scroll-area.md

@@ -14,7 +14,7 @@ const items = Array.from({ length: 50 }, (_, i) => `Item ${i + 1}`);
 
 export default function BasicDemo() {
   return (
-    <div style={{ width: 280, border: "1px solid #e0e0e0", borderRadius: 8 }}>
+    <div style={{ width: 280, border: "1px solid var(--lg-g-border-color-black-muted)", borderRadius: 8 }}>
       <ScrollArea style={{ maxHeight: 300 }}>
         <div style={{ padding: 8 }}>
           {items.map((item) => (
@@ -22,7 +22,7 @@ export default function BasicDemo() {
               key={item}
               style={{
                 padding: "8px 12px",
-                borderBottom: "1px solid #f0f0f0",
+                borderBottom: "1px solid var(--lg-g-border-color-black-subtle)",
                 fontSize: 14,
               }}
             >

package/skill/references/components/slider.md

@@ -17,7 +17,7 @@ export default function BasicDemo() {
   return (
     <div style={{ width: 300 }}>
       <Slider value={value} onChange={setValue} />
-      <p style={{ marginTop: 12, fontSize: 14, color: "#666" }}>
+      <p style={{ marginTop: 12, fontSize: 14, color: "var(--lg-g-fg-color-black-muted)" }}>
         Current value: {value[0]}
       </p>
     </div>

package/skill/references/components/table.md

@@ -3,7 +3,7 @@
 用于展示行列数据的表格组件，支持排序、行选择、加载态等。
 
 - 导入：`import { Table } from "lingee-ui";`
-- 可用类型：`TableProps`, `TableColumnType`, `TableRowSelection`, `TableSize`, `TableSorterState`, `TableStatusType`, `TableStatusText`
+- 可用类型：`TableProps`, `TableColumnType`, `TableRowSelection`, `TableSize`, `TableSorterState`, `TableStatusType`, `TableStatusText`, `TableComponents`
 
 ## 最小示例
 
@@ -44,6 +44,7 @@ export default function BasicDemo() {
 | `bordered` | 是否显示边框 | `boolean` | `false` |
 | `striped` | 是否显示斑马纹 | `boolean` | `false` |
 | `hoverable` | 是否行悬浮高亮 | `boolean` | `true` |
+| `components` | 替换表格内部元素的渲染组件，需保持引用稳定 | `TableComponents` | - |
 | `scroll` | 滚动设置 | `{ x?: number, y?: number }` | - |
 | `showHeader` | 是否显示表头 | `boolean` | `true` |
 | `title` | 表格标题 | `ReactNode \| (() => ReactNode)` | - |

package/skill/references/components/timeline.md

@@ -0,0 +1,75 @@
+# Timeline 时间轴
+
+纵向展示按时间或流程先后排列的一组节点，可配合卡片承载节点详情。
+
+- 导入：`import { Timeline, TimelineCard } from "lingee-ui";`
+- 可用类型：`TimelineProps`, `TimelineItem`, `TimelineStatus`, `TimelineCardProps`, `TimelineCardStatus`
+
+## 最小示例
+
+```tsx
+import { Timeline } from "lingee-ui";
+
+const items = [
+  { key: "1", time: "09:00", content: "Item 1" },
+  { key: "2", time: "11:00", content: "Item 2" },
+  { key: "3", time: "12:40", content: "Item 3" },
+  { key: "4", time: "14:00", content: "Item 4" },
+];
+
+export default function BasicDemo() {
+  return <Timeline items={items} />;
+}
+```
+
+## API
+
+### Timeline
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `items` | 节点数据 | `TimelineItem[]` | - |
+| `className` | 自定义类名 | `string` | - |
+| `style` | 自定义样式 | `CSSProperties` | - |
+
+### TimelineItem
+
+继承 `HTMLAttributes<HTMLLIElement>`（`content`、`color` 除外）。
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `key` | 唯一标识，缺省用索引 | `Key` | - |
+| `time` | 节点左侧的时间或标签，右对齐 | `ReactNode` | - |
+| `content` | 节点内容 | `ReactNode` | - |
+| `status` | 节点状态，决定圆点颜色 | `"default" \| "processing" \| "completed" \| "unfinished" \| "disabled"` | `"default"` |
+| `color` | 自定义圆点颜色，优先于 `status` | `string` | - |
+| `filled` | 是否实心圆点 | `boolean` | `false` |
+
+### TimelineCard
+
+即 `Timeline.Card`，继承 `HTMLAttributes<HTMLDivElement>`（`title` 除外）。
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `time` | 卡片顶部的时间段 | `ReactNode` | - |
+| `extra` | 右上角内容，有 `time` 时与它同行，否则放在标题行末尾 | `ReactNode` | - |
+| `title` | 标题 | `ReactNode` | - |
+| `titleLines` | 标题最多显示的行数，超出省略 | `number` | `1` |
+| `tag` | 紧跟标题的标签 | `ReactNode` | - |
+| `description` | 描述 | `ReactNode` | - |
+| `descriptionLines` | 描述最多显示的行数，超出省略 | `number` | `2` |
+| `footer` | 底部内容，如操作或附加信息 | `ReactNode` | - |
+| `status` | 卡片状态 | `"default" \| "processing" \| "completed"` | `"default"` |
+| `hoverable` | 悬停时高亮背景 | `boolean` | `false` |
+
+### CSS 变量
+
+| 变量 | 说明 | 默认值 |
+|------|------|--------|
+| `--_timeline-dot-size` | 圆点直径 | `10px` |
+| `--_timeline-rail-color` | 连接线颜色 | `var(--lg-timeline-border-color-line)` |
+| `--_timeline-tail-width` | 连接线宽度 | `2px` |
+| `--_timeline-line-height` | 时间与内容首行的行高，圆点按它垂直居中 | `22px` |
+| `--_timeline-head-offset` | 内容首行距节点顶部的距离，需带单位；内容是卡片时自动取 `16px` | `0px` |
+| `--_timeline-time-width` | 时间列宽度 | `72px` |
+| `--_timeline-gap` | 节点间距 | `var(--lg-spacing-small)` |

package/skill/references/components/tree-select.md

@@ -0,0 +1,86 @@
+# TreeSelect 树选择
+
+下拉面板中以树形结构选择单个节点。
+
+- 导入：`import { TreeSelect } from "lingee-ui";`
+- 可用类型：`TreeSelectProps`, `TreeSelectNode`, `TreeSelectSize`, `TreeSelectDropdownProps`
+
+## 最小示例
+
+```tsx
+import { useState } from "react";
+import { TreeSelect } from "lingee-ui";
+import type { TreeSelectNode } from "lingee-ui";
+
+const treeData: TreeSelectNode[] = [
+  {
+    value: "folder-1",
+    title: "Folder 1",
+    children: [
+      { value: "folder-1-1", title: "Folder 1-1" },
+      { value: "folder-1-2", title: "Folder 1-2" },
+    ],
+  },
+  {
+    value: "folder-2",
+    title: "Folder 2",
+    children: [{ value: "folder-2-1", title: "Folder 2-1" }],
+  },
+];
+
+export default function BasicDemo() {
+  const [value, setValue] = useState<string>();
+
+  return (
+    <div style={{ width: 280 }}>
+      <TreeSelect
+        treeData={treeData}
+        value={value}
+        onChange={setValue}
+        placeholder="Select a folder"
+        defaultExpandAll
+        allowClear
+      />
+    </div>
+  );
+}
+```
+
+## API
+
+### TreeSelect
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `treeData` | 树形数据 | `TreeSelectNode[]` | - |
+| `value` | 当前选中值（受控），显式传 `undefined` 也视为受控的空值 | `string` | - |
+| `defaultValue` | 默认选中值（非受控） | `string` | - |
+| `onChange` | 选中或清空时回调，清空时两个参数均为 `undefined` | `(value: string \| undefined, node: TreeSelectNode \| undefined) => void` | - |
+| `placeholder` | 占位文本 | `string` | - |
+| `disabled` | 是否禁用 | `boolean` | `false` |
+| `error` | 是否错误态 | `boolean` | `false` |
+| `allowClear` | 是否可清空 | `boolean` | `false` |
+| `size` | 尺寸 | `"sm" \| "md" \| "lg"` | `"md"` |
+| `defaultExpandAll` | 是否默认展开全部节点 | `boolean` | `false` |
+| `notFoundContent` | 无数据时面板中展示的内容 | `ReactNode` | 「暂无数据」缺省态 |
+| `dropdown` | 下拉面板配置，字段见 TreeSelectDropdownProps | `TreeSelectDropdownProps` | - |
+| `className` | 自定义类名 | `string` | - |
+| `style` | 自定义样式 | `CSSProperties` | - |
+
+### TreeSelectNode
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `value` | 节点值，同一棵树内需唯一 | `string` | - |
+| `title` | 节点标题，选中后同时作为触发器中的文本 | `ReactNode` | - |
+| `children` | 子节点 | `TreeSelectNode[]` | - |
+| `disabled` | 是否禁用 | `boolean` | `false` |
+
+### TreeSelectDropdownProps
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `maxHeight` | 面板最大高度（px），超出时滚动 | `number` | `346` |
+| `width` | 面板宽度（px），`"auto"` 时按内容自适应 | `number \| "auto"` | 与触发器同宽 |
+| `className` | 下拉浮层的自定义类名 | `string` | - |
+| `container` | Portal 挂载容器，传 `null` 时就地渲染 | `HTMLElement \| null` | `document.body` |

package/skill/references/components/upload.md

@@ -3,7 +3,7 @@
 文件上传组件，支持点击和拖拽上传。
 
 - 导入：`import { Upload } from "lingee-ui";`
-- 可用类型：`UploadProps`, `UploadFile`, `UploadFileStatus`, `CustomRequestOptions`, `CustomRequestReturn`, `RejectReason`, `FileItemActions`
+- 可用类型：`UploadProps`, `UploadFile`, `UploadFileStatus`, `CustomRequestOptions`, `CustomRequestReturn`, `RejectReason`, `FileItemActions`, `UploadListType`
 
 ## 最小示例
 
@@ -33,6 +33,7 @@ export default function BasicDemo() {
 | `maxSize` | 单文件最大大小（字节） | `number` | - |
 | `fileList` | 文件列表（受控） | `UploadFile[]` | - |
 | `showFileList` | 是否显示文件列表 | `boolean` | `true` |
+| `listType` | 文件列表形态，`picture-card` 为图片缩略卡片 | `"text" \| "picture-card"` | `"text"` |
 | `onChange` | 文件列表变化回调 | `(fileList: UploadFile[]) => void` | - |
 | `onReject` | 校验未通过回调 | `(files: File[], reason: "size" \| "type" \| "count") => void` | - |
 | `customRequest` | 自定义上传请求。与 `action` 同时传入时优先 | `(options: CustomRequestOptions) => { abort }` | - |

package/skill/references/icons.md

@@ -1,6 +1,6 @@
 # 图标索引
 
-图标库 `1.0.22`，共 990 个图标、27 个分类。图标名为 PascalCase，直接作为 React 组件名从 `lingee-icon` 导入。
+图标库 `1.0.23`，共 992 个图标、27 个分类。图标名为 PascalCase，直接作为 React 组件名从 `lingee-icon` 导入。
 
 ```tsx
 import { Search } from "lingee-icon";
@@ -12,7 +12,7 @@ import { Search } from "lingee-icon";
 
 ---
 
-## 通用类（58）
+## 通用类（59）
 
 | 图标名 | 语义/用途 |
 |--------|----------|
@@ -49,6 +49,7 @@ import { Search } from "lingee-icon";
 | LayoutDashboard | 更多操作（竖向） |
 | Like | 点赞（选中） |
 | Like1 | 点赞 |
+| LingeeLogo | 灵基 Logo（品牌标识） |
 | Location | 定位/位置 |
 | Map | 地图 |
 | MeetingRoom | 会议室 |
@@ -544,7 +545,7 @@ import { Search } from "lingee-icon";
 | Wifi | WiFi |
 | WifiOff | WiFi关闭 |
 
-## 代码开发（33）
+## 代码开发（34）
 
 | 图标名 | 语义/用途 |
 |--------|----------|
@@ -570,6 +571,7 @@ import { Search } from "lingee-icon";
 | Hourglass | 沙漏/等待 |
 | Key | 密钥 |
 | Layers | 图层 |
+| LayersOutline | 层叠描边/企业资产（kcode） |
 | Organize | 组织/整理 |
 | SquareCode | 代码块 |
 | Terminal | 终端 |

package/skill/references/setup.md

@@ -1,6 +1,6 @@
 # 接入指南
 
-组件库 `0.0.24` ｜ 图标库 `1.0.22`
+组件库 `0.0.26` ｜ 图标库 `1.0.23`
 
 ## 安装
 
@@ -56,14 +56,22 @@ import { LingeeProvider, enUS } from "lingee-ui";
 
 需要在业务代码里复用组件库文案时，用 `useLocale()` 取完整语言包，或 `useComponentLocale("Pagination")` 取单个组件的片段。
 
-## 暗色模式
+## 主题切换
 
-给 `<html>` 加 `data-theme="dark"`，全部语义 Token 自动切换：
+内置亮色（默认）、暗色、暖棕三套主题。给 `<html>` 设 `data-theme`，全部语义 Token 自动切换：
 
 ```ts
 document.documentElement.setAttribute("data-theme", "dark");
 ```
 
+| 主题 | `data-theme` | `color-scheme` |
+|------|----------------|------------------|
+| 亮色 | 不设，或 `light` | `light` |
+| 暗色 | `dark` | `dark` |
+| 暖棕 | `warm` | `light` |
+
+暖棕是浅底主题，与亮色只有少数底色不同，差异项见 `references/tokens.md` 的「暖棕主题」。原生控件与滚动条按 `color-scheme` 绘制，它只认 `light` / `dark`，暖棕写 `light`。业务代码按主题分支时只认 `dark`，其余值（含 `warm`）按亮色处理，不要写成「不是 `light` 就是暗色」。
+
 前提是组件与业务样式都只用语义层 `--lg-g-*` 变量。用了 primitives 或硬编码色值的地方不会跟随切换。
 
 ## 按需引入

package/skill/references/tokens.md

@@ -1,8 +1,10 @@
 # 语义 Token 全表
 
-组件库 `0.0.24`。仅列语义层（`--lg-g-*`）。
+组件库 `0.0.26`。仅列语义层（`--lg-g-*`）。
 
-亮色与暗色**变量名完全相同**，给 `<html>` 加 `data-theme="dark"` 即自动切换，业务代码只写一次。
+亮色、暗色与暖棕**变量名完全相同**，给 `<html>` 加 `data-theme="dark"` 或 `data-theme="warm"` 即自动切换，业务代码只写一次。
+
+暖棕与亮色只有少数 Token 取值不同，单独列在「暖棕主题」一节，全表不再重复暖棕列。
 
 下表「亮色 / 暗色」列是各主题下的最终色值，用途有两个：
 
@@ -24,6 +26,15 @@
 | `var(--lg-g-fg-color-violet-default)` | ~~`--lg-g-fg-color-violet-defauit`~~ |
 | `var(--lg-g-bg-color-emerald-translucent-soft)` | ~~`--lg-g-bg-color-emeraid-translucent-soft`~~ |
 
+## 暖棕主题（2）
+
+`data-theme="warm"` 是亮色的浅底变体，只有下列 Token 与亮色取值不同，其余同亮色：
+
+| Token | 亮色 | 暖棕 |
+|-------|------|------|
+| `var(--lg-g-bg-color-page-default)` | `#F7F7FA` | `#F5F5F2` |
+| `var(--lg-g-bg-color-navigation)` | `#F1F1F6` | `#F0EFEB` |
+
 ## 前景色 fg（color / fill / stroke）（54）
 
 | Token | 亮色 | 暗色 |
@@ -76,12 +87,12 @@
 | `var(--lg-g-fg-color-lime-low)` | `#74D70B` | `#74D70B` |
 | `var(--lg-g-fg-color-violet-low)` | `#7858F9` | `#7858F9` |
 | `var(--lg-g-fg-color-black-title)` | `rgba(0, 0, 0, 0.64)` | `rgba(255, 255, 255, 0.46)` |
-| `var(--lg-g-fg-color-black-blue-moderate)` | `rgba(0, 29, 65, 0.18)` | `#FFFFFF` |
-| `var(--lg-g-fg-color-black-blue-faint)` | `rgba(0, 29, 65, 0.28)` | `#FFFFFF` |
-| `var(--lg-g-fg-color-black-blue-default)` | `rgba(0, 29, 65, 0.46)` | `#FFFFFF` |
-| `var(--lg-g-fg-color-black-blue-muted)` | `rgba(0, 29, 65, 0.64)` | `#FFFFFF` |
-| `var(--lg-g-fg-color-black-blue-strong)` | `rgba(0, 29, 65, 0.82)` | `#FFFFFF` |
-| `var(--lg-g-fg-color-black-blue-intense)` | `rgba(0, 29, 65, 0.94)` | `#FFFFFF` |
+| `var(--lg-g-fg-color-black-blue-moderate)` | `rgba(0, 29, 65, 0.18)` | `rgba(255, 255, 255, 0.18)` |
+| `var(--lg-g-fg-color-black-blue-faint)` | `rgba(0, 29, 65, 0.28)` | `rgba(255, 255, 255, 0.28)` |
+| `var(--lg-g-fg-color-black-blue-default)` | `rgba(0, 29, 65, 0.46)` | `rgba(255, 255, 255, 0.46)` |
+| `var(--lg-g-fg-color-black-blue-muted)` | `rgba(0, 29, 65, 0.64)` | `rgba(255, 255, 255, 0.64)` |
+| `var(--lg-g-fg-color-black-blue-strong)` | `rgba(0, 29, 65, 0.82)` | `rgba(255, 255, 255, 0.82)` |
+| `var(--lg-g-fg-color-black-blue-intense)` | `rgba(0, 29, 65, 0.94)` | `rgba(255, 255, 255, 0.94)` |
 
 ## 背景色 bg（background）（108）
 
@@ -196,7 +207,7 @@
 | `var(--lg-g-bg-color-black-translucent-muted)` | `rgba(0, 0, 0, 0.02)` | `rgba(255, 255, 255, 0.06)` |
 | `var(--lg-g-bg-color-color)` | `#E4EEFF` | `#E4EEFF` |
 
-## 边框色 border（border-color / outline）（45）
+## 边框色 border（border-color / outline）（61）
 
 | Token | 亮色 | 暗色 |
 |-------|------|------|
@@ -245,6 +256,22 @@
 | `var(--lg-g-border-color-black-stroke)` | `rgba(0, 0, 0, 0.06)` | `rgba(255, 255, 255, 0.08)` |
 | `var(--lg-g-border-color-warning-muted)` | `#FFBE90` | `#BA5002` |
 | `var(--lg-g-border-color-success-muted)` | `#7AEB9C` | `#0C5B31` |
+| `var(--lg-g-border-color-white-heavy)` | `#FFFFFF` | `#FFFFFF` |
+| `var(--lg-g-border-color-primary-translucent-moderate)` | `rgba(109, 128, 255, 0.28)` | `rgba(109, 128, 255, 0.28)` |
+| `var(--lg-g-border-color-warning-translucent-moderate)` | `rgba(255, 119, 0, 0.28)` | `rgba(255, 119, 0, 0.28)` |
+| `var(--lg-g-border-color-danger-translucent-moderate)` | `rgba(255, 41, 59, 0.28)` | `rgba(255, 41, 59, 0.28)` |
+| `var(--lg-g-border-color-success-translucent-moderate)` | `rgba(8, 204, 80, 0.28)` | `rgba(8, 204, 80, 0.28)` |
+| `var(--lg-g-border-color-blue-translucent-moderate)` | `rgba(77, 137, 255, 0.28)` | `rgba(77, 137, 255, 0.28)` |
+| `var(--lg-g-border-color-amber-translucent-moderate)` | `rgba(255, 178, 0, 0.28)` | `rgba(255, 178, 0, 0.28)` |
+| `var(--lg-g-border-color-teal-translucent-moderate)` | `rgba(0, 229, 229, 0.28)` | `rgba(0, 229, 229, 0.28)` |
+| `var(--lg-g-border-color-emerald-translucent-moderate)` | `rgba(8, 199, 135, 0.28)` | `rgba(8, 199, 135, 0.28)` |
+| `var(--lg-g-border-color-lime-translucent-moderate)` | `rgba(116, 215, 11, 0.28)` | `rgba(116, 215, 11, 0.28)` |
+| `var(--lg-g-border-color-cyan-translucent-moderate)` | `rgba(0, 163, 244, 0.28)` | `rgba(0, 163, 244, 0.28)` |
+| `var(--lg-g-border-color-purple-translucent-moderate)` | `rgba(143, 64, 255, 0.28)` | `rgba(143, 64, 255, 0.28)` |
+| `var(--lg-g-border-color-indigo-translucent-moderate)` | `rgba(81, 85, 246, 0.28)` | `rgba(81, 85, 246, 0.28)` |
+| `var(--lg-g-border-color-violet-translucent-moderate)` | `rgba(120, 88, 249, 0.28)` | `rgba(120, 88, 249, 0.28)` |
+| `var(--lg-g-border-color-fuchsia-translucent-moderate)` | `rgba(248, 88, 208, 0.28)` | `rgba(248, 88, 208, 0.28)` |
+| `var(--lg-g-border-color-pink-translucent-moderate)` | `rgba(255, 36, 109, 0.28)` | `rgba(255, 36, 109, 0.28)` |
 
 ## 其他（4）