# form-layout

- 分组：组合组件（Composite）
- 页面：/components/form-layout
- 源码：packages/react/src/components/form-layout.tsx

## 导出

```ts
import { FormActions, FormGrid, FormListAddButton, FormListEditor, FormListItem, FormReadonlyField, FormSection } from "@modra/react";
```

## Props（FormListEditorProps）

| 名称 | 必填 | 类型 | 说明 |
| --- | --- | --- | --- |
| `fields` | 是 | `readonly TField[]` | Current items, e.g. `fields` from `FormList` / `useFieldArray`. |
| `renderItem` | 是 | `(field: TField, index: number) => React.ReactNode` | Renders the fields of one item (without the remove button, which the editor adds). |
| `onAdd` | 否 | `() => void` | Shows the add button. |
| `onRemove` | 否 | `(index: number) => void` | Shows a remove button on each item. |
| `min` | 否 | `number` | Remove buttons are disabled while there are this many items or fewer. Defaults to 0. |
| `max` | 否 | `number` | The add button is disabled once there are this many items. |
| `variant` | 否 | `FormListItemVariant` |  |
| `itemTitle` | 否 | `(field: TField, index: number) => React.ReactNode` | Card header for each item (card variant). |
| `removeLabel` | 否 | `(field: TField, index: number) => string` | Remove button name for each item. Defaults to the locale text. |
| `addLabel` | 否 | `React.ReactNode` | Add button content. Defaults to the locale "Add" text. |
| `getKey` | 否 | `(field: TField, index: number) => React.Key` | Stable key per item. Defaults to `field.id`, then `field.key`, then the index. |
| `labelOffset` | 否 | `boolean` | Forwarded to each inline item; see `FormListItem`. |
| `disabled` | 否 | `boolean` | Disables the add and remove buttons. |
| `empty` | 否 | `React.ReactNode` | Shown when there are no items. |