| children*required | (helpers: FieldRowHelpers, index: number) => React.ReactNode | | A function that returns the content for each row. This "render prop" provides
maximum flexibility for defining the inputs within each row.
Can return 1 child (single-column) or 2 children (two-column).
The second parameter provides the 0-based index of the current row. |
| firstColumnLabel*required | React.ReactNode | | Label for the first column |
| onAddRow*required | (event: React.MouseEvent) => void | | A callback triggered when the "Add" button is clicked. |
| onRemoveRow*required | (event: React.MouseEvent, index: number) => void | | A callback triggered when a "Remove" button is clicked, which receives the index of the row to remove. |
| rowCount*required | number | | The total number of rows to render. This should be derived from the length of the state array managed by the parent. |
| addButtonContent | React.ReactNode | | Content for the "Add" button. Defaults to "Add another". |
| addButtonProps | Omit<ButtonProps, 'onClick'> | {} | Additional props to customize the "Add" button. |
| aria-label | string | | Provides an accessible name for the field builder table via a human readable string. |
| aria-labelledby | string | | Provides an accessible name for the field builder table via a space separated list of IDs. |
| fieldBuilderIdPrefix | string | 'field-builder' | Unique ID prefix for this FieldBuilder instance.
This ensures unique IDs when multiple FieldBuilders exist on the same page. |
| onAddRowAnnouncement | (rowNumber: number, rowGroupLabelPrefix: string) => string | | Callback to customize the announcement message when a row is added.
If not provided, defaults to "New {rowGroupLabelPrefix} added. {rowGroupLabelPrefix} {newRowNumber}." |
| onRemoveRowAnnouncement | (rowNumber: number, rowGroupLabelPrefix: string) => string | | Callback to customize the announcement message when a row is removed.
If not provided, defaults to "{rowGroupLabelPrefix} {removedRowNumber} removed." |
| removeButtonAriaLabel | (rowNumber: number, rowGroupLabelPrefix: string) => string | | Callback to customize the aria-label for remove buttons.
If not provided, defaults to "Remove {rowGroupLabelPrefix} {rowNumber}". |
| removeButtonProps | Omit<ButtonProps, 'onClick' | 'ref'> | {} | Additional props to customize the "Remove" buttons. |
| rowGroupLabelPrefix | string | 'Row' | Label prefix for each row group. Defaults to "Row". This is also used to create a default
Table accessible name when the aria-label nor aria-labelledby are not provided. |
| secondColumnLabel | React.ReactNode | | Label for the second column in a two-column layout |
