# @factorialco/rjsf-f0 中文文档

规范地址：https://npmcn.com/package/%40factorialco/rjsf-f0/

版本：2\.6\.0
npm 元数据更新时间：2026-11-09T08:34:12.845Z
中文译文更新时间：2026-11-14T08:25:22.031Z
软件包许可：See LICENSE file

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40factorialco/rjsf-f0
原文对照：https://npmcn.com/package/%40factorialco/rjsf-f0/?lang=original
项目主页：https://code.factorialhr.com/docs/forms/

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：2.6 MB，37 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：2 个
- peer 依赖：react ^18\.3\.1 \|\| ^19\.0\.0，react-dom ^18\.3\.1 \|\| ^19\.0\.0，@rjsf/core ^6\.7\.1，@rjsf/utils ^6\.7\.1，@factorialco/f0-react ^4\.39\.0 \|\| ^6 \|\| ^7 \|\| ^8 \|\| ^9 \|\| ^10 \|\| ^11
- 首次发布：2026-08-07T07:19:02.659Z
- 最新版本发布：2026-11-09T08:34:12.659Z
- 近 30 天下载量：162582（2026-10-14 至 2026-11-12，npm 官方下载统计）
- 已发布版本数：13（近 12 个月 13 个）

## 中文简介

反应-jsonschema-form的阶乘f0主题:使RJSF形式具有f0组件.

## 安装

```sh
npm install @factorialco/rjsf-f0
```

也可以使用：`pnpm add @factorialco/rjsf-f0`、`yarn add @factorialco/rjsf-f0`、`bun add @factorialco/rjsf-f0`

## README

# @ factorialco/rjsf-f0 (英语)

这个 [f0 (中文(简体) )](https://ds.factorial.dev/) 主题 [反应-jsonschema-形式](https://rjsf-team.github.io/react-jsonschema-form/)。它使一个RJSF格式具有真实的f0组件——输入,选择,复选框,按钮——而不是平面HTML外观为f0.

在一个已经运行 f0 的应用程序内使用它( Cindual 代码仪表板, Cindial 单体). 将表格嵌入任意页面的Apps应该保留表格SDK自己的主题,这个主题不需要设计系统:f0不能被树震动,因此将其拉入成本兆字节.

## 安装

```bash
pnpm add @factorialco/rjsf-f0
```

您必须拥有的同伴: `react`, (中文(简体) ), `react-dom`, (中文(简体) ), `@rjsf/core` 6, (简体中文), `@rjsf/utils` 联合国 `@factorialco/f0-react` 4.39+或6 (英语:.

## 使用量

用"阶乘码"格式SDK——它不断取取出表单光谱并提交,只有渲染变化:

```tsx
import FcodeForm from '@factorialco/fcode-react-forms';
import { Theme, markdownComponents } from '@factorialco/rjsf-f0';
import '@factorialco/rjsf-f0/styles.css';

<FcodeForm
  team="my-team"
  processId="my-process"
  rjsfTheme={Theme}
  // Renders the execution result message (markdown) with f0 components —
  // GFM tables become the f0 table card with Excel/CSV export.
  markdownComponents={markdownComponents}
  // Suppresses the SDK's standalone stylesheet, which resets inherited styles
  // and would fight the host app's own.
  options={{ theme: 'none', locale: 'en' }}
/>;
```

独立,作为任何 RJSF 主题 :

```tsx
import Form from '@factorialco/rjsf-f0';
import validator from '@rjsf/validator-ajv8';
import '@factorialco/rjsf-f0/styles.css';

<Form schema={schema} validator={validator} />;
```

也导出 : `Theme`, (中文(简体) ), `Templates`, (中文(简体) ), `Widgets`, (中文(简体) ), `generateTheme()`, (中文(简体) ), `generateForm()` ——匹配官员布局 `@rjsf/*` 主题软件包——和 `markdownComponents`,f0的标记下标记渲染器作为反应-标记下 `components` 地图(内部用于 `schema.markdown.before/after`传递给 `FcodeForm` 为结果信息).

主机应用程序必须转换为 f0 `F0Provider` 高于窗体并导入 `@factorialco/f0-react/dist/styles.css`;此套件假设同时并只为舰船提供RJSF所编部分的布局规则. 这个 `F0Provider` 也服务于平分表卡, 其标题和导出菜单通过 f0 的 i18n 解析; 导出一个表格懒散导入 `xlsx` 通过f0本身的依赖.

## 制图工作

| 无国界记者协会 | f0 (中文(简体) ) |
| --- | --- |
| 文本 / 电子邮件 / url / 密码 | `F0FormField` `text` |
| 数字/ 整数 / `updown` 编号 : `range` | `F0FormField` `number` |
| `date` 编号 : `datetime-local` 编号 : `time` | `F0FormField` `date` 编号 : `datetime` 编号 : `time` |
| `textarea` | `F0FormField` `textarea` |
| enum 选择, 多选择 | `F0FormField` `select` |
| 布尔复选框, `checkboxes` | `F0Checkbox` |
| `radio` | `F0FormField` `cardSelect` (f0没有无线电控制) |
| `file` 编号 : `data-url` | f0 类 droppzone + 文件芯片(见下文) |
| 提交、增加/移动/复制/删除 | `F0Button` |
| `oauth` 连接控制 | `F0Button` (见下文) |
| 错误摘要 | `F0Alert` |
| 节标题 | `F0Heading` |

绘制地图的两个蓄意后果:

-   **RJSF保留对验证的所有权.** f0 字段通常用 zod 进行验证; 这里被告知它们处于错误状态(`error`)而不是衍生出一种,所以"计划"仍然是真理的唯一来源. 消息是按主题传送的 `FieldErrorTemplate`,而不是通过控制: 一半的地图不是 `F0FormField` 完全 —— 复选框、 文件空投区、 对象和数组级别 —— 因此, 完全针对这些会丢弃一个控件 .
-   **标签由主题提供,而不是由f0提供.** 阶乘码格式标签可能包含平分标记,f0取为平分字符串. 主题让标记下标记本身和手取 f0 纯文本,所以控件保持了可访问的名称.

### 文件字段

`FileWidget` 替换核心的,使一个赤裸的 `<input type="file">`。该输入以 CSS 无法达到两种方式给出一个非本地对话框:其“ 没有选择文件” 文本和浏览按钮 _浏览器_ 标签 _浏览器_ 语言——一种西班牙语形式的英语染色体,我们这边的任何语言传播都无法修复.

主题绘制出自己的滴区和每个被选取的文件一个芯片(名称,人可读大小,去掉按钮). 数值不变:核心本身 `useFileWidgetProps` 仍然拥有 `File` - > (中文) `data:` URL交换,所以RJSF储存的都是同字节.

一种例外,选入:当表格提供时 `formContext.fcode.keptFiles` (单位:千美元)`FcodeForm` 从 `@factorialco/fcode-react-forms` ),一个大于50个米B的单文件(`LARGE_FILE_BYTES`) 在根字段中,完全不读取. 1 GB 附近文件的 Base64 比浏览器所能持有的时间最长的字符串长, 因此在提交表单前编码失败; 大小大小的文件无论如何只能通过上传授权来运行, 它发送 `File` 如来相. 部件将 `File` 改为 `keptFiles.keep(file)` 并存储它返回的字符串: a `data:` 无内容的 URL 和 a `fcode-kept` 参数,因此验证,有条件的schemas和JSON复制的形态数据像其他文件值一样对待它. `keptFiles.get(value)` 返回时 `File` 后面,主机在提交时把它换回来。 多个文件与嵌入地总是被编码. 独自渲染此主题的主机不会 `keptFiles` 并不断得到 `data:` 包含内容的URL. 如果浏览器无法读取所选文件,则部件会显示出错并保留上一个值 .

没错 **没有** 桥到f0's `F0FormField` `file`该字段是由上传钩子驱动的,它返回了一个不透明的识别码,并且——这个阻断器——它的 `accept` 关闭 `MimeType` 没有文件扩展名的允许列表 . `ui:options.accept` 是一个原始的 HTML 接受字符串,所以需要一个图案 `.msj` (或任何没有注册的MIME类型的扩展)都会默默地失去其过滤器. 投放区保持字符串的逐字形.

`ui:options`数字 :

| 选项 | 效果 |
| --- | --- |
| `accept` | 传入输入逐字记录. 也显示为跳动区文字下的提示 . |
| `dropzoneText` | 在任何翻译之前替换空降区副本。 对于一个市场应用来说,这是一条有效的途径: 计划弦通过平台的i18n符号替换,不需要嵌入器的合作. |

### 染色体定位

每个字符串这个主题都使得这个计划不是作者通过 RJSF 的 `translateString` —— 说 `Add Item`, (中文(简体) ), `Remove`, (中文(简体) ), `Move up`, (中文(简体) ), `Move down`, (中文(简体) ), `Copy`, (中文(简体) ), `Errors`,还有空降区副本. **他们都是英语 直到一个主机提供翻译**,因为 RJSF 的默认翻译是身份函数及其 `TranslatableString` 数值 _为:_ 英文本`RemoveButton` 字义 `'Remove'`) (中文(简体) ). 本包中没有任何东西是自己翻译的.

表格上的一个道具将批量定位:

```tsx
<FcodeForm
  translateString={(key, params) => myTable[key] ?? englishStringTranslator(key, params)}
  …
/>
```

由于RJSF没有enum成员

-   `Drag a file here, or click to choose one`
-   `Drag files here, or click to choose them` (当 `multiple`(中文(简体) )

在本地化产品中制取的表单没有这个道具,则显示在已翻译的字段标签旁边的英文按钮. `ui:options.dropzoneText` 只修补发区; 翻译者修补一切.

### 标记下提示

`markdownComponents` 以 GitHub 警示标记为 f0 调用

```markdown
> [!NOTE]
> **Nothing is written yet.** You will see a preview first.
```

| 标记 | f0 变种 |
| --- | --- |
| `[!NOTE]` | `info` |
| `[!TIP]` | `positive` |
| `[!IMPORTANT]` | `info` |
| `[!WARNING]` | `warning` |
| `[!CAUTION]` | `critical` |

任何其它的块引文仍作为 f0 的块引文制作,一个未识别的标记保留在文本中.

有两件事值得了解:

-   **这些不是GFM.** GFM 谱面包括表格、任务列表、切换、自动链接和脚注;提醒是 GitHub.com 常规和 `remark-gfm` 不分析它们。 标记在引文开头时作为普通文本解析幸存下来,这就是这个渲染器的密钥的取出之处——所以没有评论插件和新的依赖关系,共享 `markdown-content.tsx` 以它为首的捆绑,是不被侵犯的。 这也意味着 _无_ 这个渲染器是一个字形 `[!NOTE]` 将打印给用户.
-   **呼唤不是 `F0Alert`。 。 。 .** 那个部件 `title` 财务报告和审定财务报表 `description` 简单 `string`s,所以通过它将块引出会平整身体,并放下一个作者可以合法地放入平分块的粗体,链接,列表和代码. 呼号保留了真正的平分子并借用了f0的语义色彩尺度,所以仍然以暗模式翻转.

### 下行标题级别

一个计划作者选择 `#` 或者说 `###` 内部 `markdown.before` 编号 : `markdown.after` (或结果) `message`)无法看到表格本身的标题是什么。 这就是这个尺度,量度,所以可以故意做出选择.

f0 类型尺度为 **没有** 尾风的默认—— `f0/packages/core/src/tokens/typography.ts` 设置 `base` 在14px时, `lg` 在16px和 `2xl` 在22px时。 所以说:

|  | 来源 | 显示在 |
| --- | --- | --- |
| **表格本身的标题** (司马 `title`(中文(简体) ) | `F0Heading variant="heading"` | **16px / 600 (英语)** |
| `#` | f0 (中文(简体) ) `text-2xl font-medium` | **22px / 500 个** |
| `##` | f0 (中文(简体) ) `text-lg font-medium` | 16px / 500 个 |
| `###` | f0 (中文(简体) ) `text-base font-semibold` | 14px / 600 (韩语) |
| `####` | 此软件包的样式表 | 14px / 600 (韩语) |
| `#####` | 此软件包的样式表 | 14px / 500 个 |
| `######` | 此软件包的样式表 | 14px / 500, 中学 |
| 正文文本 | f0 (中文(简体) ) `text-base font-normal` | 14px / 400 个 |
| `**bold**` | f0 (中文(简体) ) `font-semibold` | 14px / 600 (韩语) |

**关于表格的标题没有这方面的规则.** 在选择一个关卡前读取表格,因为有三行相撞:

-   **`#` 排名高于表格的标题.** 22px对着标题的16px,所以形式内部的取向大于它所坐的取出形式. 避免 `#` 一种形式.
-   **`###` 与 `**bold**`** ——均为14px/600. A `###` 部分标题与粗体句是无法区分的. `####` 土地价值相同,因此无法与两者区分.
-   **`##` 匹配标题大小** 以较轻的一分轻的重量级来表示,这是标题的同级,而不是标题下的一个部分.

压缩是f0's,而不是这个包:在标题(16-600)和正文(14-400)之间,比例尺有两个插槽,而马克下限有6个级别——所以任何映射都必须倒塌的级别而不是保存.

**哪个级别读作一节,取决于它直接下方的是什么**,这就是表不能告诉你的部分。 A 类 `markdown.before` 标题几乎总是后面有两样东西之一,它们不是相同的重量:

| 直接从下方 | 显示在 | 上面的那个方向 |
| --- | --- | --- |
| 普通字段的标签 | 16px / 500, 阴暗 | `###` (14/600,全能)读作明显地是一个标题——更小,但更大胆更暗 |
| 对象或数组的标题( Q)`TitleFieldTemplate` → `F0Heading`(中文(简体) ) | 16px / 600, 全员 | `###` 读作从属于它引入的领域;没有任何东西比它高,因为 `##` 为 16/500 和 `#` 会排出表单本身 |

这么说吧 `###` 是普通字段之上的正确默认,而数组之上的错误默认——和 `##` 因为它只符合标题的大小,同时保持了更轻的重量. `dev/main.tsx` 使两个级别都高于一个字段,从而可以看出差异而不是理由.

标题上方 **对象或数组** 通常是错误的形状而不是错误的级别。 这些字段在16/600时已经形成了自己的标题,因此,一个上方的标记是同一事物的第二个标题,因此无论它使用哪个级别,它都读得很差。 两条出路,都比选别的好 `#`数字 :

```markdown
---
```

一条规则在不竞争标题的情况下打开了组合:它使1px发线与12px的通关,而这个字段自己的标题成为了一节标题. 当标题的要点是将组合与之前的组合分开时使用这个.

或将标记下块放下,让标题自己携带部分. 用这个当标题和标题 说相同的事情.

一个头在打开一群人的时候 就能赢得它的位置 **多个** 字段,每个字段都有自己的标签——在那里,它命名了没有任何一个字段的标题能够命名的东西.

### 分级

一个普通值列表——地址,标记,代号——每件做一行:控件,然后是项目工具栏,然后是数组的添加按钮.

带行 **没有自己的标签**. RJSF 在数组后各加其位置(`Emails-1`, (中文(简体) ), `Emails-2`)并标出每个需要的非核项,在两个地址的可选列表中产生一个重复的标题和两个星号. 数组本身的标题已命名为组,控件通过 f0 保留其可访问名称 `hideLabel`。持有对象或嵌入式阵列的行不受影响:这些是多个字段的块,它们的标签是从下一个字段中分离出来的.

工具栏是RJSF的,所以决定一行能做什么的,是计划:

```json
{ "ui:options": { "orderable": false } }
```

`orderable` (默认) `true`) 向上/向下绘图——当命令没有意义时将其关闭,这是最平面的列表. `copyable` 默认为 `false` 现在, `removable` 财务报告和审定财务报表 `addable` 改为 `true`。 。 。 .

### OAuth 连接字段

SDK的表单 `"ui:widget": "oauth"` 字段在弹出时打开提供者,当流量结束时作出反应;部件逻辑船在其中 `@factorialco/fcode-react-forms`。这个主题只贡献它绘制的控制,例如 `Theme.oauth.ConnectControl`页:1 `F0Button` (单位:千美元)`default` 在闲置和等待的时候, `outline` 加上下面的流量错误信息. `FcodeJsonSchemaForm` 找到它通过 `rjsfTheme.oauth`和它找到的一样 `rjsfTheme.multistep`。 。 。 .

### 还没有f0

-   **`range`** 作为数字输入而不是 `F0Slider`。 。 。 .
-   **标题** `h1`– 说吧 –`h3` 来源于f0自己的制造器; `h4`– 说吧 –`h6` 由这个软件包的样式表来取而代之,因为这里的渲染器必须携带由主机的 Tailwind 构建而来从未生成的 Tailwind 工具类(它) `content` glubs不包括此软件包).
-   SDK的表单 `sourceCode` 字段保留其摩纳哥编辑器,它不是f0型.

## 发展

```bash
pnpm test      # vitest: renders forms through the theme and checks value round-trips
pnpm dev       # vite playground with every widget
pnpm build     # tsc + vitest + vite (es + cjs + types + styles.css)
```

## 常见问题

### @factorialco/rjsf-f0 是什么？

反应-jsonschema-form的阶乘f0主题:使RJSF形式具有f0组件\.

### 如何安装 @factorialco/rjsf-f0？

在项目目录运行 npm install @factorialco/rjsf-f0，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（^18\.3\.1 \|\| ^19\.0\.0）、react-dom（^18\.3\.1 \|\| ^19\.0\.0）、@rjsf/core（^6\.7\.1）、@rjsf/utils（^6\.7\.1）、@factorialco/f0-react（^4\.39\.0 \|\| ^6 \|\| ^7 \|\| ^8 \|\| ^9 \|\| ^10 \|\| ^11）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @factorialco/rjsf-f0 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @factorialco/rjsf-f0 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @factorialco/rjsf-f0 可以商用吗？

@factorialco/rjsf-f0 使用 See LICENSE file 许可。声明的许可为 See LICENSE file，请阅读许可原文确认使用条件。以上为概括，不构成法律意见，请以许可原文为准。

### @factorialco/rjsf-f0 的下载量有多少？

根据 npm 官方下载统计，@factorialco/rjsf-f0 在 2026/10/14 – 2026/11/12 这 30 天内被下载 162,582 次，日均约 5,419 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @factorialco/rjsf-f0 还在维护吗？

最新版本 2\.6\.0 发布于 2026/11/09（5 天前）；至今共发布 13 个版本，其中过去 12 个月发布了 13 个；首次发布于 2026/08/07。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。

