@fangxinyan/lumina 0.7.0 → 0.8.0

package/dist/index.d.ts

@@ -21,7 +21,7 @@ export { MessageApi, MessageConfig, MessageContainer, MessageContainerProps, Mes
 export { Tooltip, TooltipPlacement, TooltipProps } from './Tooltip.js';
 export { Popover, PopoverPlacement, PopoverProps } from './Popover.js';
 export { Alert, AlertProps, AlertTone } from './Alert.js';
-export { ExpandableConfig, PaginationConfig, RowKey, RowSelectionConfig, Table, TableChangeAction, TableChangeInfo, TableColumn, TableColumnFilterItem, TablePaginationState, TableProps, TableScrollConfig, TableSorterState, TableVariant } from './Table.js';
+export { ExpandableConfig, PaginationConfig, RowKey, RowSelectionConfig, Table, TableChangeAction, TableChangeInfo, TableColumn, TableColumnFilterItem, TablePaginationState, TableProps, TableRowClassName, TableScrollConfig, TableSorterState, TableVariant } from './Table.js';
 export { TablePro, TableProProps } from './TablePro.js';
 export { Pagination, PaginationProps } from './Pagination.js';
 export { DatePicker, DatePickerFormat, DatePickerProps, DatePickerSize } from './DatePicker.js';
@@ -54,6 +54,6 @@ import 'react/jsx-runtime';
 import 'react';
 
 /** Package version — bumped by release scripts. */
-declare const VERSION = "0.7.0";
+declare const VERSION = "0.8.0";
 
 export { VERSION };

package/dist/index.js

@@ -1,15 +1,15 @@
 export { Timeline } from './chunk-6RQJXSWN.js';
 export { Tooltip } from './chunk-U3SG2YT2.js';
 export { Link, Paragraph, Text, Title, Typography } from './chunk-UQI4R32R.js';
-export { TablePro } from './chunk-WMZV7PNO.js';
-export { Table } from './chunk-EA3NZBCZ.js';
-export { Tabs } from './chunk-RAK6CENJ.js';
+export { TablePro } from './chunk-63RSKQID.js';
+export { Table } from './chunk-WMISXERU.js';
+export { Tabs } from './chunk-IJDM2U3B.js';
 import './chunk-EE7IJ3MB.js';
 export { THEME_PANEL_DEFAULT_PRESET_OPTIONS, THEME_PANEL_DEFAULT_THEME_PRESETS, ThemePanel } from './chunk-OLYSSZHP.js';
 export { TimePicker } from './chunk-SXLRWYQQ.js';
 export { Skeleton } from './chunk-5AXNUX3J.js';
 export { Slider } from './chunk-K5HGHOG7.js';
-export { Splitter } from './chunk-LOWTSOWT.js';
+export { Splitter } from './chunk-J5UEQ3ZQ.js';
 export { StatusBar, StatusBarItem } from './chunk-YKHIIC7M.js';
 export { SURFACE_THEME_PRESETS, Surface } from './chunk-DU2DSERH.js';
 export { LUMINA_THEME_PRESETS, cloneLuminaThemePreset, pickLuminaThemePresets } from './chunk-TSL3F2K3.js';
@@ -18,8 +18,8 @@ export { InputNumber } from './chunk-YPMQC5HX.js';
 export { List } from './chunk-VQEMMJHC.js';
 export { MessageContainer, ToastContainer, message, toast } from './chunk-7QAVPVMW.js';
 export { Modal } from './chunk-BKW5PXEO.js';
-export { Pagination } from './chunk-BJDQVVCG.js';
-export { Select } from './chunk-3EHJ5QI3.js';
+export { Pagination } from './chunk-HQNDVNTQ.js';
+export { Select } from './chunk-DURKCGEM.js';
 export { Tag } from './chunk-62VV5COT.js';
 export { Popover } from './chunk-RPO7657K.js';
 export { Progress } from './chunk-HQFKXTX6.js';
@@ -56,6 +56,6 @@ import './chunk-DRDDQCDD.js';
 export { ACCENT_PRESETS, ACCENT_PRESETS_DARK, DEFAULT_THEME_COLORS, FONT_STACKS, ThemeProvider, applyTheme, componentTokensToStyle, deriveThemeColors, normalizeAccentInput, resolveThemeColorScheme, resolveThemeColors, resolveThemeMode, resolveVisualThemeSnapshot, themeColorsToStyle, themeTokenToKebabCase, useTheme, useThemeOptional, visualThemeToStyle } from './chunk-ULTDRMGN.js';
 
 // src/index.ts
-var VERSION = "0.7.0";
+var VERSION = "0.8.0";
 
 export { VERSION };

package/dist/styles.css

@@ -1444,6 +1444,13 @@ svg[data-lumina-icon-color],
 .surface > *:last-child { margin-bottom: 0; }
 /* ============ Tabs ============ */
 .tabs { display: flex; flex-direction: column; gap: var(--gap-3); }
+.tabs.fill {
+  flex: 1 1 auto;
+  width: 100%;
+  height: 100%;
+  min-width: 0;
+  min-height: 0;
+}
 .tabs-nav {
   display: inline-flex;
   padding: 5px;
@@ -1452,6 +1459,7 @@ svg[data-lumina-icon-color],
   box-shadow: var(--lmn-tabs-neu-shadow-inset, var(--neu-shadow-inset));
   gap: 2px;
   align-self: flex-start;
+  flex-shrink: 0;
 }
 .tabs-nav .tab {
   padding: 8px 16px;
@@ -1507,6 +1515,12 @@ svg[data-lumina-icon-color],
 .tabs.centered.line .tabs-nav .tab,
 .tabs.centered.underline .tabs-nav .tab { margin-right: 11px; margin-left: 11px; }
 .tabs-content { padding: var(--gap-2) 0; }
+.tabs.fill .tabs-content {
+  flex: 1 1 auto;
+  min-width: 0;
+  min-height: 0;
+  overflow: auto;
+}
 /* ============ Collapse ============ */
 .collapse { display: flex; flex-direction: column; gap: 10px; }
 .collapse-item {
@@ -2543,6 +2557,7 @@ button.collapse-chev {
   background: var(--lmn-table-bg, var(--bg));
   box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
   overflow: auto;
+  container-type: inline-size;
 }
 /* When scroll=y is on, the wrap itself becomes the scroll region. */
 .table-wrap.scroll-y { overflow-y: auto; }
@@ -2610,6 +2625,10 @@ button.collapse-chev {
 .table.striped tbody tr:nth-child(even) td {
   background: color-mix(in oklch, var(--lmn-table-bg-sunken, var(--bg-sunken)) 40%, transparent);
 }
+.table:not(.cards) tbody tr.active-row td {
+  background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 72%, transparent);
+  color: var(--lmn-table-accent-ink, var(--accent-ink));
+}
 /* Embossed: each row sits on the surface */
 .table.embossed { border-spacing: 0; }
 .table.embossed tbody td {
@@ -2664,10 +2683,32 @@ button.collapse-chev {
 }
 .table.cards.hoverable tbody tr:hover .card-row-surface { box-shadow: var(--lmn-table-neu-shadow-panel, var(--neu-shadow-panel)); }
 .table.cards.hoverable tbody tr:hover td { background: transparent; }
+.table.cards tbody tr.active-row .card-row-surface {
+  box-shadow:
+    var(--lmn-table-neu-shadow-control, var(--neu-shadow-control)),
+    inset 0 0 0 2px var(--lmn-table-accent-glow, var(--accent-glow));
+}
+.table.cards tbody tr.active-row td {
+  color: var(--lmn-table-accent-ink, var(--accent-ink));
+}
 .table .row-check { width: 44px; }
 .table .row-check .checkbox { display: inline-flex; }
 .table .row-expand { width: 40px; text-align: center; }
-.table-empty { padding: 60px 20px; text-align: center; color: var(--lmn-table-fg-muted, var(--fg-muted)); }
+.table .table-empty {
+  padding: 0;
+  color: var(--lmn-table-fg-muted, var(--fg-muted));
+}
+.table-empty-content {
+  box-sizing: border-box;
+  width: 100%;
+  padding: 60px 20px;
+  text-align: center;
+}
+.table-wrap.scroll-x .table-empty-content {
+  position: sticky;
+  left: 0;
+  width: 100cqi;
+}
 /* Expand button */
 .expand-btn {
   width: 22px; height: 22px;

package/docs/llms/drawer.md

@@ -34,7 +34,14 @@ extra 渲染到标题右边,常用来放刷新 / 更多 / 保存按钮。
 抽屉只让正文区滚动，并自动为拟态阴影留出空间；全宽内容可通过 bodyInset="none" 贴边。
 
 ```tsx
-<Drawer open={open} title="连接配置">
+<Drawer
+  open={open}
+  title="连接配置"
+  bodyClassName="connection-drawer-body"
+  bodyStyle={{ scrollBehavior: "smooth" }}
+  bodyProps={{ "data-purpose": "connection-settings" }}
+  bodyOverflow="auto"
+>
   <Card title="远程节点">无需手工补 padding 或修改 overflow。</Card>
 </Drawer>
 ```

package/docs/llms/select.md

@@ -27,6 +27,23 @@ multiple + Tag 形式呈现已选项。
 <Select multiple clearable value={tags} onChange={setTags} options={...} />
 ```
 
+### 数量上限 / 分类限选
+
+maxCount 限制总数；getOptionDisabled 可读取当前选择，实现“一类最多选一个”。
+
+```tsx
+<Select
+  multiple
+  maxCount={2}
+  value={values}
+  onChange={setValues}
+  getOptionDisabled={(option, selectedValues) =>
+    hasOtherSelectionInCategory(option, selectedValues)
+  }
+  options={groupedOptions}
+/>
+```
+
 ### 搜索过滤
 
 searchable + clearable + 选项 icon/description。icon 支持 IconName 或 ReactNode。
@@ -108,6 +125,8 @@ loading 时显示 spinner,emptyContent 自定义空态。
 | placeholder | `string` | `"请选择…"` | 空选择时的提示文本 |
 | multiple | `boolean` | `false` | 多选 |
 | maxTagCount | `number` | — | 多选时显示的标签数(超出折叠 +N) |
+| maxCount | `number` | — | 多选允许的最大选择数；达到上限后禁用未选项 |
+| getOptionDisabled | `(option, selectedValues) => boolean` | — | 基于候选项和当前选择动态判断禁用状态 |
 | searchable | `boolean` | `false` | 可搜索 |
 | showSearch | `boolean` | `false` | searchable 的等价别名 |
 | filterOption | `(input, option) => boolean` | — | 自定义过滤 |

package/docs/llms/splitter.md

@@ -13,7 +13,15 @@ import { Splitter } from "@fangxinyan/lumina";
 ### 水平分栏
 
 ```tsx
-<Splitter defaultSize={200} min={120} max={360}>
+<Splitter
+  defaultSize={200}
+  min={120}
+  max={360}
+  firstPaneClassName="workspace-sidebar-pane"
+  firstPaneStyle={{ overflow: "hidden" }}
+  secondPaneClassName="workspace-main-pane"
+  handle={<span aria-hidden>⋮</span>}
+>
   <SidePanel />
   <MainPanel />
 </Splitter>
@@ -64,6 +72,9 @@ const [w, setW] = useState(220);
 | step | `number` | `16` | 方向键步长 (px) |
 | secondMin | `number` | `24` | 第二面板保留的最小尺寸 |
 | storageKey | `string` | — | 持久化尺寸的本地存储键 |
+| firstPaneClassName / firstPaneStyle | `string / CSSProperties` | — | 第一个面板的 class 与内联样式 |
+| secondPaneClassName / secondPaneStyle | `string / CSSProperties` | — | 第二个面板的 class 与内联样式 |
+| handle | `ReactNode` | — | 正式的分隔手柄内容槽；null 隐藏默认握柄 |
 | handleProps | `HTMLAttributes<HTMLDivElement>` | — | 分隔手柄原生属性与 aria-label |
 | children \* | `[ReactNode, ReactNode]` | — | 必须恰好两个子节点 |
 

package/docs/llms/tablepro.md

@@ -25,6 +25,27 @@ import { TablePro } from "@fangxinyan/lumina";
 />
 ```
 
+### 当前行高亮 / 横向空态
+
+activeRowKey 只表达当前上下文，不会勾选行；横向滚动表格的 empty 会始终居中在可视区域。
+
+```tsx
+<TablePro
+  rowKey="id"
+  activeRowKey={activeRowKey}
+  rowClassName={(row) => row.status === "离线" ? "offline-row" : undefined}
+  onRowClick={(row) => setActiveRowKey(row.id)}
+  data={rows}
+  columns={columns}
+/>
+
+<TablePro
+  data={[]}
+  scroll={{ x: 1200 }}
+  empty={<Tag>当前筛选没有结果</Tag>}
+/>
+```
+
 ### 卡片行分页
 
 variant='cards' 与内置 pagination 共用 TablePro 容器背景,分页区不会单独变成另一块底色。
@@ -59,7 +80,8 @@ TablePro 直接透传 expandable 到 Table。
 
 | Prop | 类型 | 默认 | 说明 |
 | --- | --- | --- | --- |
-| ... | `TableProps` | — | 继承自 Table 全部 props (包括新的 pagination / scroll / rowSelection / expandable / filters) |
+| ... | `TableProps` | — | 继承自 Table 全部 props (包括 pagination / scroll / rowSelection / expandable / filters) |
+| activeRowKey / rowClassName | `RowKey / string | (row, index) => string` | — | 纯高亮当前行，并支持固定或按行计算的业务类名 |
 | toolbar | `ReactNode` | — | 工具栏内容 |
 | actions | `ReactNode` | — | 工具栏右侧操作 |
 | footer | `ReactNode` | — | 底部 (可选,传了会渲染在分页下方) |

package/docs/llms/tabs.md

@@ -25,6 +25,24 @@ import { Tabs } from "@fangxinyan/lumina";
 <Tabs variant="line" items={[...]} />
 ```
 
+### 满高布局 / 正文独立滚动
+
+fill 让 Tabs 占满父容器，标签条保持固定，只有 tabs-content 滚动；两个 className 可定向接入业务布局。
+
+```tsx
+<div style={{ height: 260 }}>
+  <Tabs
+    fill
+    tabBarClassName="workspace-tabs-bar"
+    contentClassName="workspace-tabs-content"
+    items={[
+      { key: "general", label: "通用", content: <LongSettings /> },
+      { key: "advanced", label: "高级", content: <LongSettings /> },
+    ]}
+  />
+</div>
+```
+
 ### 居中对齐
 
 centered 让标签条在容器中水平居中。
@@ -44,6 +62,9 @@ centered 让标签条在容器中水平居中。
 | onChange | `(key: string) => void` | — | 切换 |
 | variant | `"line" | "pill" | "segmented"` | `"line"` | 样式 |
 | centered | `boolean` | `false` | 标签条居中对齐 |
+| tabBarClassName | `string` | — | 标签条容器的附加类名 |
+| contentClassName | `string` | — | 正文容器的附加类名 |
+| fill | `boolean` | `false` | 占满父容器，并让正文区域独立滚动 |
 
 
 ---

package/docs/llms.md

@@ -3,7 +3,7 @@
 > 拟态风格的 React 18 组件库,目标是 Electron 桌面应用。**写给 AI 编程助手**的按需文档 —— 每个组件单独一个 `.md`,避免一次性读取全部。示例源自 playground 的 demo,可直接复制运行。
 
 - **包名**: `@fangxinyan/lumina`
-- **版本**: `0.7.0`
+- **版本**: `0.8.0`
 - **React 最低版本**: 18
 - **环境**: 带打包器的 React 工程(Vite / Next.js / Webpack / Remix / Electron + Vite 等)
 - **零运行时依赖**: 只依赖 `react` / `react-dom` (peer deps)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fangxinyan/lumina",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Lumina — Neumorphic component library for Electron & React apps",
   "type": "module",
   "main": "./dist/index.cjs",