@fangxinyan/lumina 0.1.6 → 0.2.1

package/docs/llms/tabs.md

@@ -0,0 +1,50 @@
+# Tabs 选项卡
+
+> 同一层级的内容分组,通过标签切换。
+
+## 导入
+
+```tsx
+import { Tabs } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### 基础
+
+```tsx
+<Tabs items={[
+  { key: "general", label: "通用", content: <>...</> },
+  { key: "account", label: "账户", content: <>...</> },
+]} />
+```
+
+### 下划线变体
+
+```tsx
+<Tabs variant="line" items={[...]} />
+```
+
+### 居中对齐
+
+centered 让标签条在容器中水平居中。
+
+```tsx
+<Tabs centered items={[...]} />
+```
+
+## API
+
+**Tabs**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| items \* | `TabItem[]` | — | 标签数据 |
+| activeKey / defaultActiveKey | `string` | — | 受控/初始激活 |
+| onChange | `(key: string) => void` | — | 切换 |
+| variant | `"line" | "pill" | "segmented"` | `"line"` | 样式 |
+| centered | `boolean` | `false` | 标签条居中对齐 |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms/tag.md

@@ -0,0 +1,77 @@
+# Tag 标签
+
+> 标记关键词、状态或分类。
+
+## 导入
+
+```tsx
+import { Tag } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### 语气
+
+```tsx
+<Tag>Default</Tag>
+<Tag tone="accent">Accent</Tag>
+<Tag tone="success">Success</Tag>
+```
+
+### 实心
+
+```tsx
+<Tag tone="accent" solid>Solid</Tag>
+```
+
+### 圆点状态
+
+dot 渲染前置色块。
+
+```tsx
+<Tag tone="success" dot>在线</Tag>
+```
+
+### 前置图标
+
+icon 使用内置 Icon 组件,颜色随语气自动适配。
+
+```tsx
+<Tag tone="success" icon="check2">已完成</Tag>
+<Tag tone="info" icon="star">推荐</Tag>
+```
+
+### 无边框
+
+bordered={false} 去除 flat 阴影,只保留文本色。
+
+```tsx
+<Tag bordered={false}>Default</Tag>
+<Tag tone="accent" bordered={false}>Accent</Tag>
+```
+
+### 可移除
+
+removable + onRemove 实现关闭按钮。
+
+```tsx
+<Tag removable onRemove={() => remove(t.id)}>{t.label}</Tag>
+```
+
+## API
+
+**Tag**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| tone | `"neutral" | "accent" | "info" | "success" | "warning" | "danger"` | `"neutral"` | 色调 |
+| solid | `boolean` | `false` | 实心填充 |
+| dot | `boolean` | `false` | 前置圆点 |
+| icon | `IconName` | — | 前置图标 |
+| bordered | `boolean` | `true` | 是否显示外框 flat 阴影 |
+| removable | `boolean` | `false` | 显示 × |
+| onRemove | `() => void` | — | 关闭回调 |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms/theme.md

@@ -0,0 +1,165 @@
+# Theme 主题
+
+> ThemeProvider + useTheme,覆盖深浅色、强调色、密度、圆角、字体、阴影强度。
+
+## 导入
+
+```tsx
+import { ThemeProvider, useTheme, applyTheme } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### 基础用法
+
+用 ThemeProvider 包住应用,所有 lumina 组件自动生效。
+
+```tsx
+import { ThemeProvider } from "lumina";
+
+function Root() {
+  return (
+    <ThemeProvider
+      mode="system"        // "light" | "dark" | "system"
+      accent="violet"      // 预设 或 自定义颜色
+      density="comfortable"
+      intensity={5}        // 1..10 阴影强度
+      radius={20}          // 圆角基准 px
+      font="sf"            // 字体预设
+      storageKey="app:theme"   // 持久化到 localStorage
+    >
+      <App />
+    </ThemeProvider>
+  );
+}
+```
+
+### useTheme Hook
+
+子组件随时读/改主题。下面这块被独立的 ThemeProvider 包裹,不影响全局。
+
+```tsx
+const t = useTheme();
+t.toggleMode();              // 切换深浅色
+t.setAccent("coral");        // 换强调色
+t.setDensity("compact");     // 改密度
+t.update({ radius: 14 });    // 一次改多个
+t.reset();                   // 重置到 props 初值
+```
+
+### 预设强调色
+
+内置 6 种拟态强调色,点击切换。
+
+```tsx
+<ThemeProvider accent="sky" />
+<ThemeProvider accent="coral" />
+<ThemeProvider accent="mint" />
+<ThemeProvider accent="violet" />
+<ThemeProvider accent="amber" />
+<ThemeProvider accent="rose" />
+```
+
+### 自定义强调色
+
+传任意 CSS 颜色(oklch / hex / rgb)。只给主色,ink / soft / glow 会用 color-mix 自动推导。
+
+```tsx
+// 只给主色,其他自动推导
+<ThemeProvider accent="oklch(70% 0.18 180)" />
+<ThemeProvider accent={{ accent: "#00b894" }} />
+
+// 或给完整调色板
+<ThemeProvider accent={{
+  accent: "oklch(70% 0.18 180)",
+  ink:    "oklch(40% 0.14 180)",
+  soft:   "oklch(93% 0.04 180)",
+  glow:   "oklch(70% 0.18 180 / 0.35)",
+}} />
+```
+
+### 作用域嵌套
+
+target="scope" 只作用于子树,可以层层嵌套。
+
+```tsx
+<ThemeProvider accent="sky">
+  <Page />
+
+  <ThemeProvider target="scope" accent="coral" as="section">
+    <PromoCard />
+
+    <ThemeProvider target="scope" accent="mint" as="div">
+      <InnerCallout />
+    </ThemeProvider>
+  </ThemeProvider>
+</ThemeProvider>
+```
+
+### 覆盖任意 token
+
+tokens prop 可以改 tokens.css 里任何变量 —— 键名可省略 --。
+
+```tsx
+<ThemeProvider
+  tokens={{
+    bg: "#f5f5f7",           // 等价 --bg
+    "--bg-sunken": "#e8e8ed",
+    "shadow-dark": "rgba(0,0,0,0.18)",
+    "--font-display": '"Inter", sans-serif',
+  }}
+/>
+```
+
+### 命令式 API
+
+脱离 React 直接给元素套主题 —— 适合 vanilla JS 或 SSR 早期水合。
+
+```tsx
+import { applyTheme } from "lumina";
+
+applyTheme(document.documentElement, {
+  mode: "dark",
+  accent: "violet",
+  radius: 16,
+});
+```
+
+## API
+
+**ThemeProvider Props**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| mode | `"light" | "dark" | "system"` | `"light"` | 深浅色模式 |
+| accent | `AccentKey | CustomAccentInput` | `"sky"` | 强调色,预设或自定义 |
+| density | `"compact" | "comfortable" | "spacious"` | `"comfortable"` | 密度 |
+| intensity | `number` | `5` | 阴影强度 1-10 |
+| radius | `number` | `20` | 圆角基准 px |
+| font | `FontConfig` | `"sf"` | 字体预设或 CSS 栈 |
+| tokens | `Record<string, string>` | — | 任意 CSS 变量覆写 |
+| target | `"root" | "scope"` | `"root"` | 应用到根还是局部 |
+| as | `keyof JSX.IntrinsicElements` | `"div"` | scope 模式的元素标签 |
+| storageKey | `string` | — | localStorage 持久化 key |
+| onChange | `(value: ThemeValue) => void` | — | 主题值变更回调 |
+
+
+**useTheme() → ThemeValue**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| mode | `ThemeMode` | — | 请求的模式(保留 system) |
+| resolvedMode | `"light" | "dark"` | — | 解析后的具体模式 |
+| accent | `AccentKey | "custom"` | — | 预设 key 或 "custom" |
+| accentPalette | `AccentPalette` | — | 当前完整调色板 |
+| density / intensity / radius / font / tokens | `-` | — | 当前各维度状态 |
+| setMode(m) | `(m: ThemeMode) => void` | — | 切换模式 |
+| toggleMode() | `() => void` | — | light ⇄ dark 切换 |
+| setAccent(a) | `(a: AccentKey | CustomAccentInput) => void` | — | 切换强调色 |
+| setDensity / setIntensity / setRadius / setFont / setTokens | `-` | — | 对应字段的 setter |
+| update(cfg) | `(cfg: Partial<ThemeConfig>) => void` | — | 浅合并多字段 |
+| reset() | `() => void` | — | 重置到初始 props |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms/titlebar.md

@@ -0,0 +1,40 @@
+# TitleBar 标题栏
+
+> Electron 应用窗口顶部的跨平台标题栏。
+
+## 导入
+
+```tsx
+import { TitleBar } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### macOS 风格
+
+```tsx
+<TitleBar platform="mac" title="无标题文档" actions={<>...</>} />
+```
+
+### Windows 风格
+
+```tsx
+<TitleBar platform="windows" title="..." actions={...} />
+```
+
+## API
+
+**TitleBar**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| title | `ReactNode` | — | 标题 |
+| platform | `"mac" | "windows"` | `"mac"` | 平台风格 |
+| actions | `ReactNode` | — | 右侧操作区 |
+| center | `ReactNode` | — | 中部内容 |
+| draggable | `boolean` | `true` | 整条作为拖拽区 |
+| onMinimize / onMaximize / onClose | `() => void` | — | 窗口控件回调 |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms/toast.md

@@ -0,0 +1,51 @@
+# Toast 通知
+
+> 全局轻量提示,4 种语义。
+
+## 导入
+
+```tsx
+import { toast, ToastContainer } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### 四种语义
+
+```tsx
+toast.info("已保存到草稿");
+toast.success("操作完成");
+toast.warn("请注意");
+toast.error("发生错误");
+```
+
+### 带标题
+
+```tsx
+toast.success("已上传 5 个文件", "上传完成");
+```
+
+## API
+
+**toast.***
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| info(message, title?) | `(msg, title?) => id` | — | 信息提示 |
+| success(message, title?) | `(msg, title?) => id` | — | 成功 |
+| warn(message, title?) | `(msg, title?) => id` | — | 警告 |
+| error(message, title?) | `(msg, title?) => id` | — | 错误 |
+| show({ type, message, title?, duration? }) | `(item) => id` | — | 完整 API |
+| dismiss(id) | `(id: number) => void` | — | 关闭一条 |
+| clear() | `() => void` | — | 清空全部 |
+
+
+**ToastContainer**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| placement | `"top-right" | "top-left" | "bottom-right" | "bottom-left" | "top-center"` | `"top-right"` | 位置 |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms/tooltip.md

@@ -0,0 +1,38 @@
+# Tooltip 文字提示
+
+> 鼠标悬浮触发的简短说明。
+
+## 导入
+
+```tsx
+import { Tooltip } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### 基础
+
+```tsx
+<Tooltip content="新建文档"><IconButton icon="plus" /></Tooltip>
+```
+
+### 位置
+
+```tsx
+<Tooltip placement="bottom" content="..." />
+```
+
+## API
+
+**Tooltip**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| content \* | `ReactNode` | — | 提示内容 |
+| placement | `"top" | "bottom" | "left" | "right"` | `"top"` | 位置 |
+| delay | `number` | `250` | 悬浮延时 (ms) |
+| disabled | `boolean` | `false` | 禁用提示 |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms/typography.md

@@ -0,0 +1,103 @@
+# Typography 排版
+
+> 标题、段落、文本、链接一体化排版组件,支持语义色、修饰、复制、编辑、省略。
+
+## 导入
+
+```tsx
+import { Typography } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### 基础组合
+
+```tsx
+<Typography>
+  <Typography.Title level={2}>Lumina 排版</Typography.Title>
+  <Typography.Paragraph>...</Typography.Paragraph>
+  <Typography.Text type="secondary">次要文字</Typography.Text>
+  <Typography.Link href="..." external>外部链接</Typography.Link>
+</Typography>
+```
+
+### 标题层级
+
+```tsx
+<Typography.Title level={1..5}>...</Typography.Title>
+```
+
+### 语义色
+
+```tsx
+<Typography.Text type="success">...</Typography.Text>
+```
+
+### 文字修饰
+
+```tsx
+<Typography.Text strong>...</Typography.Text>
+```
+
+### 可复制
+
+点击右侧图标复制文本，自动切成 ✓ 状态并 2.4 秒后复位。
+
+```tsx
+<Typography.Text copyable>...</Typography.Text>
+```
+
+### 可编辑
+
+点击图标或文本进入编辑状态，Enter 保存、Esc 取消。
+
+```tsx
+<Typography.Text editable={{ onChange, triggerType: ["icon", "text"] }}>{value}</Typography.Text>
+```
+
+### 省略截断
+
+多行截断并支持「展开」。
+
+```tsx
+<Typography.Paragraph ellipsis={{ rows: 2, expandable: true }}>{long}</Typography.Paragraph>
+```
+
+### 链接
+
+```tsx
+<Typography.Link href="..." external>...</Typography.Link>
+```
+
+## API
+
+**Typography.Title**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| level | `1 | 2 | 3 | 4 | 5` | `1` | 标题级别 |
+
+
+**通用 Props (Title / Text / Paragraph / Link)**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| type | `"secondary" | "success" | "warning" | "danger"` | — | 语义色 |
+| disabled | `boolean` | `false` | 禁用态 |
+| mark / code / keyboard / underline / delete / strong / italic | `boolean` | `false` | 文字修饰 |
+| copyable | `boolean | CopyableConfig` | — | 显示复制按钮 |
+| editable | `boolean | EditableConfig` | — | 显示编辑按钮 |
+| ellipsis | `boolean | EllipsisConfig` | — | 截断省略 |
+
+
+**Typography.Link**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| href | `string` | — | 链接地址 |
+| target / rel | `string` | — | 原生锚点属性 |
+| external | `boolean` | `false` | 追加外链箭头 |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms/windowcontrols.md

@@ -0,0 +1,31 @@
+# WindowControls 窗口控件
+
+> 独立的窗口控件按钮组。
+
+## 导入
+
+```tsx
+import { WindowControls } from "@fangxinyan/lumina";
+```
+
+## 示例
+
+### 两种平台
+
+```tsx
+<WindowControls platform="mac" />
+<WindowControls platform="windows" />
+```
+
+## API
+
+**WindowControls**
+
+| Prop | 类型 | 默认 | 说明 |
+| --- | --- | --- | --- |
+| platform | `"mac" | "windows"` | `"mac"` | 平台 |
+| onMinimize / onMaximize / onClose | `() => void` | — | 回调 |
+
+
+---
+[← 回到索引](../llms.md)

package/docs/llms.md

@@ -0,0 +1,97 @@
+# @fangxinyan/lumina · LLM Reference
+
+> 拟态风格的 React 18 组件库,目标是 Electron 桌面应用。**写给 AI 编程助手**的按需文档 —— 每个组件单独一个 `.md`,避免一次性读取全部。示例源自 playground 的 demo,可直接复制运行。
+
+- **包名**: `@fangxinyan/lumina`
+- **版本**: `0.2.1`
+- **React 最低版本**: 18
+- **环境**: 带打包器的 React 工程(Vite / Next.js / Webpack / Remix / Electron + Vite 等)
+- **零运行时依赖**: 只依赖 `react` / `react-dom` (peer deps)
+- **仓库**: git+https://github.com/LHorTL/lumina.git
+
+## 用法建议(给 AI)
+
+- **只需要某个组件时**: 直接读 `./llms/<id>.md`(例如 `./llms/button.md`)。每份 50-300 行,覆盖导入 / 示例 / 完整 Props 表。
+- **需要全局概念时**(安装、主题、图标、浮层): 读本文件底部的「必读 · 全局约定」一节。
+- **通过 npm 包内置路径**:
+  - 索引: `node_modules/@fangxinyan/lumina/docs/llms.md` 或子路径导出 `@fangxinyan/lumina/llms.md`
+  - 单组件: `node_modules/@fangxinyan/lumina/docs/llms/<id>.md`
+
+## 必读 · 全局约定
+
+1. **安装**  
+   `npm install @fangxinyan/lumina`
+2. **引入样式**(任一即可):  
+   ```tsx
+   import "@fangxinyan/lumina/styles"; // 一次性引入全部组件样式
+   ```
+   或按组件单独引入(适合 tree-shake 到极限):  
+   ```tsx
+   import "@fangxinyan/lumina/tokens";         // 设计令牌 + 全局 reset
+   import { Button } from "@fangxinyan/lumina"; // 会自动带上 Button.css
+   ```
+3. **TypeScript**: 所有 `XxxProps` 接口都是 `export`,可直接 `import { Button, type ButtonProps } from "@fangxinyan/lumina";`
+4. **主题**: 用 `<ThemeProvider>` 包根;运行时可通过 `useTheme()` 改。六种强调色 (`rose / sky / coral / mint / violet / amber`) × 两种模式 (`light / dark` + `system`) × 三档密度 (`compact / comfortable / spacious`)。详见 [`llms/theme.md`](./llms/theme.md)。
+5. **图标**: 所有接受 `icon / leadingIcon / trailingIcon` 的 prop 用字符串 `IconName`。完整列表见 [`llms/icon.md`](./llms/icon.md)。
+6. **浮层组件**(Tooltip / Popover / Select / Cascader / ColorPicker / Modal / Drawer): 内部已 `createPortal` 到 `document.body` + 视口边界翻转,放在 `overflow: hidden` 的容器里也不会被裁。
+7. **Electron 专属组件**: `TitleBar` / `WindowControls` / `Sidebar` / `AppShell` 提供 macOS / Windows 原生风格的标题栏与导航。
+
+## 组件索引
+
+### 起步
+
+- [Lumina](./llms/intro.md) — 为 Electron 应用定制的拟态风格 React 组件库。
+- [Theme 主题](./llms/theme.md) — ThemeProvider + useTheme,覆盖深浅色、强调色、密度、圆角、字体、阴影强度。
+
+### 通用
+
+- [Button 按钮](./llms/button.md) — 标记一个操作命令,响应用户点击行为,触发相应业务逻辑。
+- [Icon 图标](./llms/icon.md) — 线性图标集,继承当前文字颜色,可调整尺寸与描边。
+- [Typography 排版](./llms/typography.md) — 标题、段落、文本、链接一体化排版组件,支持语义色、修饰、复制、编辑、省略。
+
+### 表单
+
+- [Input 输入框](./llms/input.md) — 凹陷凹槽式输入域,支持前后置图标、错误态、禁用态。
+- [Switch 开关](./llms/switch.md) — 二元状态切换器。
+- [Checkbox 复选框](./llms/checkbox.md) — 在一组选项中进行多项选择,或独立切换某个开关项。
+- [Radio 单选](./llms/radio.md) — 在多个互斥选项中进行单项选择。
+- [Slider 滑块](./llms/slider.md) — 在连续数值区间内取值。
+- [Select 下拉选择](./llms/select.md) — 下拉选择,支持单/多选、搜索、分组、加载态。
+- [Cascader 级联选择](./llms/cascader.md) — 层级关联数据集合中的多级选择。
+- [ColorPicker 颜色选择](./llms/colorpicker.md) — 拟态风格的颜色选择器:HSV 色域、色相、hex 输入、预设调色板。
+
+### 数据展示
+
+- [Card 卡片](./llms/card.md) — 信息分组容器,提供 raised / flat / sunken 三种视觉变体。
+- [Tag 标签](./llms/tag.md) — 标记关键词、状态或分类。
+- [Badge 徽标数](./llms/badge.md) — 右上角的小型计数或状态指示器。
+- [Avatar 头像](./llms/avatar.md) — 用图像、首字母代表用户或事物。
+- [Divider 分隔符](./llms/divider.md) — 对内容进行分割。
+- [Progress 进度](./llms/progress.md) — 条形进度 Progress 与环形进度 Ring。
+- [List 列表](./llms/list.md) — 承载一组结构化的同质化数据。
+- [Table 表格](./llms/table.md) — 结构化数据展示。
+- [Table Pro](./llms/tablepro.md) — 带工具栏 / 搜索 / 筛选 / 排序 / 多选 / 分页的全功能表格。
+- [Image 图片](./llms/image.md) — 凹陷外框包裹的图片容器,带预览、错误占位。
+- [Calendar 日历](./llms/calendar.md) — 查看与选择日期。
+- [Pagination 分页](./llms/pagination.md) — 分页控件,支持快速跳转与每页条数切换。
+- [Tabs 选项卡](./llms/tabs.md) — 同一层级的内容分组,通过标签切换。
+- [Accordion 折叠面板](./llms/accordion.md) — 纵向折叠面板。
+
+### 反馈
+
+- [Modal 对话框](./llms/modal.md) — 在不离开当前页面的前提下处理事务。
+- [Drawer 抽屉](./llms/drawer.md) — 从屏幕边缘滑出的浮层。
+- [Toast 通知](./llms/toast.md) — 全局轻量提示,4 种语义。
+- [Tooltip 文字提示](./llms/tooltip.md) — 鼠标悬浮触发的简短说明。
+- [Popover 气泡卡片](./llms/popover.md) — 比 Tooltip 更丰富,可承载交互内容。
+- [Alert 警告提示](./llms/alert.md) — 页面中嵌入的警告/提示。
+- [Empty 空状态](./llms/empty.md) — 列表、页面或容器无数据时的占位。
+- [Spinner 加载](./llms/spinner.md) — 表示任务正在进行,提示用户等待。
+- [Skeleton 骨架屏](./llms/skeleton.md) — 数据加载前展示页面结构轮廓。
+
+### Electron
+
+- [TitleBar 标题栏](./llms/titlebar.md) — Electron 应用窗口顶部的跨平台标题栏。
+- [WindowControls 窗口控件](./llms/windowcontrols.md) — 独立的窗口控件按钮组。
+- [Sidebar 侧边栏](./llms/sidebar.md) — 应用主导航,沿屏幕左侧垂直排列。
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fangxinyan/lumina",
-  "version": "0.1.6",
+  "version": "0.2.1",
   "description": "Lumina — Neumorphic component library for Electron & React apps",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -14,6 +14,9 @@
     },
     "./styles": "./dist/styles.css",
     "./tokens": "./dist/tokens.css",
+    "./llms.md": "./docs/llms.md",
+    "./llms/*": "./docs/llms/*",
+    "./package.json": "./package.json",
     "./*": {
       "types": "./dist/*.d.ts",
       "import": "./dist/*.js",
@@ -22,6 +25,8 @@
   },
   "files": [
     "dist",
+    "docs/llms.md",
+    "docs/llms",
     "README.md",
     "LICENSE"
   ],
@@ -34,7 +39,8 @@
     "build:lib": "tsup",
     "preview": "vite preview",
     "typecheck": "tsc --noEmit",
-    "prepublishOnly": "npm run typecheck && npm run build:lib"
+    "gen:docs": "node scripts/gen-llms-doc.mjs",
+    "prepublishOnly": "npm run typecheck && npm run gen:docs && npm run build:lib"
   },
   "peerDependencies": {
     "react": ">=18",