@invana/forms 0.0.11 → 0.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -2,7 +2,7 @@ import * as React$1 from 'react';
2
2
  import * as _radix_ui_react_slot from '@radix-ui/react-slot';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
4
  import * as react_hook_form from 'react-hook-form';
5
- import { FieldValues, FieldPath, ControllerProps, Control } from 'react-hook-form';
5
+ import { FieldValues, FieldPath, ControllerProps, Control, UseFormReturn } from 'react-hook-form';
6
6
  export { Control, DefaultValues, FieldValues, Mode, SubmitHandler, UseFormReturn } from 'react-hook-form';
7
7
  import * as LabelPrimitive from '@radix-ui/react-label';
8
8
  import * as SelectPrimitive from '@radix-ui/react-select';
@@ -36,17 +36,34 @@ declare const FormMessage: React$1.ForwardRefExoticComponent<React$1.HTMLAttribu
36
36
 
37
37
  type LabelPosition = 'side' | 'top';
38
38
  /**
39
- * Field density. `sm` is the compact look used by dense panels (e.g. the
40
- * modeller property editor) and is the default for backward compatibility.
41
- * `md` renders full-size fields for primary, page-level forms.
39
+ * Field density.
40
+ * - `xs` ultra-dense property-panel look (small controls, tight rows, compact
41
+ * section headers). Use for inspector/side panels like the modeller diagram
42
+ * properties editor.
43
+ * - `sm` — compact look, the default for backward compatibility.
44
+ * - `md` — full-size fields for primary, page-level forms.
42
45
  */
43
- type FieldSize = 'sm' | 'md';
44
- type FieldType = 'text' | 'password' | 'textarea' | 'number' | 'boolean' | 'color' | 'select' | 'icon';
46
+ type FieldSize = 'xs' | 'sm' | 'md';
47
+ type FieldType = 'text' | 'password' | 'textarea' | 'number' | 'boolean' | 'checkbox' | 'radio' | 'color' | 'select' | 'icon';
48
+ /** Widget used to render a single `boolean` field. Defaults to `switch`. */
49
+ type BooleanControl = 'switch' | 'checkbox';
50
+ /** Layout for the `radio` list and the multi-select `checkbox` group. */
51
+ type FieldOrientation = 'vertical' | 'horizontal';
45
52
  type ColorPreset = {
46
53
  label: string;
47
54
  value: string;
48
55
  darkValue?: string;
49
56
  };
57
+ /**
58
+ * Small status pill rendered next to a field's label — the "on" / "active" /
59
+ * "no editor" chips seen in inspector panels. `variant` maps to the `Badge`
60
+ * component's variants and defaults to `secondary` (neutral grey). Use
61
+ * `default` for the solid accent ("on") pill.
62
+ */
63
+ type FieldBadge = {
64
+ label: string;
65
+ variant?: 'default' | 'secondary' | 'destructive' | 'outline' | 'soft';
66
+ };
50
67
  type FieldConfig = {
51
68
  name: string;
52
69
  type: FieldType;
@@ -63,22 +80,92 @@ type FieldConfig = {
63
80
  group?: string;
64
81
  row?: string;
65
82
  presetColors?: ColorPreset[];
66
- defaultValue?: string;
83
+ /**
84
+ * Widget for a single `boolean` field: `switch` (default) renders a toggle;
85
+ * `checkbox` renders a compact inline `☑ label`. Ignored by non-boolean types.
86
+ */
87
+ control?: BooleanControl;
88
+ /**
89
+ * Wrap a `switch` boolean in a bordered, padded box. Defaults to `false`
90
+ * (the switch renders inline). Ignored by non-boolean / `checkbox` fields.
91
+ */
92
+ boxed?: boolean;
93
+ /**
94
+ * Layout for `radio` and multi-select `checkbox` groups. Defaults to
95
+ * `vertical`. Ignored by other types.
96
+ */
97
+ orientation?: FieldOrientation;
98
+ /**
99
+ * Initial value. A `string` for most fields, `boolean` for `boolean`, or a
100
+ * `string[]` for a multi-select `checkbox` group.
101
+ */
102
+ defaultValue?: string | number | boolean | string[];
67
103
  /** Number of visible rows for `textarea` fields. */
68
104
  rows?: number;
105
+ /**
106
+ * How many grid columns the field spans on `md+` screens. Defaults to `1`.
107
+ * The grid is two columns by default (see `ObjectField`'s `columns`), so
108
+ * `colSpan: 2` makes a full-width field (textarea, long URI, …). A span
109
+ * larger than the column count simply fills the row. Ignored below `md`,
110
+ * where every field stacks full width.
111
+ */
112
+ colSpan?: number;
113
+ /**
114
+ * Extra classes merged onto the field's grid cell. Escape hatch for
115
+ * per-field layout/spacing tweaks (custom width, ordering, margins, …)
116
+ * without adding a dedicated prop for every case.
117
+ */
118
+ className?: string;
119
+ /**
120
+ * Extra classes merged onto the field's `<FormLabel>`. Escape hatch for
121
+ * per-field label styling (padding, colour, weight, casing, the label→control
122
+ * gap via margin, …) on top of the size-driven defaults.
123
+ */
124
+ labelClassName?: string;
125
+ /**
126
+ * Optional status pill rendered next to the field's label (e.g. an "on" /
127
+ * "active" chip in an inspector row). See {@link FieldBadge}.
128
+ */
129
+ badge?: FieldBadge;
69
130
  };
70
131
  type RowConfig = {
71
132
  id: string;
72
133
  fields: string[];
73
134
  };
135
+ /**
136
+ * Per-group metadata for the section headers of a grouped `ObjectField`.
137
+ * Groups are still discovered from each field's `group` value; this only
138
+ * decorates the matching section header.
139
+ */
140
+ type GroupConfig = {
141
+ /** Matches the `group` value on fields. */
142
+ id: string;
143
+ /** Override the auto-humanized section label (e.g. `viewMode` → "View Mode"). */
144
+ label?: string;
145
+ /**
146
+ * Extra status pills rendered in the section header, after the automatic
147
+ * field-count badge. See {@link FieldBadge}.
148
+ */
149
+ badges?: FieldBadge[];
150
+ /** Show the automatic field-count badge. Defaults to `true`. */
151
+ showCount?: boolean;
152
+ };
74
153
  interface ObjectFieldProps {
75
154
  control: Control<any>;
76
155
  name: string;
77
156
  fields: FieldConfig[];
78
157
  rowConfig?: RowConfig[];
158
+ /** Optional per-group header decoration (extra badges, label override). */
159
+ groupConfig?: GroupConfig[];
79
160
  labelPosition?: LabelPosition;
80
161
  /** Field density. Defaults to `sm` (compact) for backward compatibility. */
81
162
  size?: FieldSize;
163
+ /**
164
+ * Number of columns in the field grid on `md+` screens. Defaults to `2`.
165
+ * Increase it to build wider layouts that fields can span via `colSpan`.
166
+ * Below `md` the grid always collapses to a single column.
167
+ */
168
+ columns?: number;
82
169
  }
83
170
 
84
171
  type AnyValue = any;
@@ -96,17 +183,25 @@ interface BaseFieldProps {
96
183
  max?: number;
97
184
  step?: number;
98
185
  presetColors?: ColorPreset[];
99
- defaultValue?: string;
186
+ defaultValue?: AnyValue;
100
187
  rows?: number;
101
188
  className?: string;
189
+ labelClassName?: string;
190
+ badge?: FieldBadge;
102
191
  labelPosition?: LabelPosition;
103
192
  size?: FieldSize;
193
+ control?: BooleanControl;
194
+ orientation?: FieldOrientation;
195
+ /** Wrap a `switch` boolean in a bordered, padded box. Defaults to `false`. */
196
+ boxed?: boolean;
104
197
  }
105
198
  declare const InputField: React$1.FC<BaseFieldProps>;
106
199
  declare const PasswordField: React$1.FC<BaseFieldProps>;
107
200
  declare const TextareaField: React$1.FC<BaseFieldProps>;
108
201
  declare const SelectField: React$1.FC<BaseFieldProps>;
109
202
  declare const BooleanField: React$1.FC<BaseFieldProps>;
203
+ declare const RadioField: React$1.FC<BaseFieldProps>;
204
+ declare const CheckboxGroupField: React$1.FC<BaseFieldProps>;
110
205
  declare const ColorField: React$1.FC<BaseFieldProps>;
111
206
  declare const NumberField: React$1.FC<BaseFieldProps>;
112
207
  declare const IconField: React$1.FC<BaseFieldProps>;
@@ -115,6 +210,8 @@ declare const Field: {
115
210
  Password: React$1.FC<BaseFieldProps>;
116
211
  Textarea: React$1.FC<BaseFieldProps>;
117
212
  Boolean: React$1.FC<BaseFieldProps>;
213
+ Radio: React$1.FC<BaseFieldProps>;
214
+ CheckboxGroup: React$1.FC<BaseFieldProps>;
118
215
  Color: React$1.FC<BaseFieldProps>;
119
216
  Number: React$1.FC<BaseFieldProps>;
120
217
  Select: React$1.FC<BaseFieldProps>;
@@ -127,6 +224,8 @@ interface FormFieldExtensions {
127
224
  Password: typeof PasswordField;
128
225
  Textarea: typeof TextareaField;
129
226
  Boolean: typeof BooleanField;
227
+ Radio: typeof RadioField;
228
+ CheckboxGroup: typeof CheckboxGroupField;
130
229
  Color: typeof ColorField;
131
230
  Number: typeof NumberField;
132
231
  Select: typeof SelectField;
@@ -135,6 +234,43 @@ interface FormFieldExtensions {
135
234
  type FormFieldType = typeof FormField$1 & FormFieldExtensions;
136
235
  declare const FormField: FormFieldType;
137
236
 
237
+ interface SettingsPanelProps extends Omit<ObjectFieldProps, 'control'> {
238
+ /**
239
+ * The react-hook-form instance (from `useForm`). The panel renders its own
240
+ * `<Form>` provider around the fields, so it is fully self-contained — no
241
+ * external `<Form>` wrapper is required.
242
+ */
243
+ form: UseFormReturn<any>;
244
+ /** Title shown above the fields (uppercase, muted — the panel heading). */
245
+ title?: React$1.ReactNode;
246
+ /** Extra classes merged onto the outer `Card` (e.g. a fixed width). */
247
+ className?: string;
248
+ /** Extra classes merged onto the scrollable `CardContent`. */
249
+ contentClassName?: string;
250
+ /**
251
+ * Extra content rendered inside the form, after the fields — e.g. a footer
252
+ * with Apply / Reset actions. Rendered within the `<Form>` provider so a
253
+ * submit button has form context.
254
+ */
255
+ children?: React$1.ReactNode;
256
+ }
257
+ /**
258
+ * A self-contained, form-driven settings / inspector panel: the card chrome, an
259
+ * uppercase heading and the sectioned {@link ObjectField} accordion in a single
260
+ * component. Consumers own their `useForm` and pass it in; everything else — the
261
+ * `Card`, scroll region, `<Form>` provider, grouped accordions with count
262
+ * badges and per-field status pills — is handled here.
263
+ *
264
+ * ```tsx
265
+ * const form = useForm({ defaultValues });
266
+ * <SettingsPanel title="Canvas Settings" form={form} name="canvas" fields={fields} />
267
+ * ```
268
+ *
269
+ * All {@link ObjectFieldProps} (`name`, `fields`, `rowConfig`, `labelPosition`,
270
+ * `size`, `columns`) are forwarded to the underlying `ObjectField`.
271
+ */
272
+ declare function SettingsPanel({ form, title, className, contentClassName, children, ...objectField }: SettingsPanelProps): react_jsx_runtime.JSX.Element;
273
+
138
274
  interface ColorSwatchesProps {
139
275
  value?: string;
140
276
  onChange?: (value: string) => void;
@@ -232,4 +368,4 @@ declare function InputGroupText({ className, ...props }: React$1.ComponentProps<
232
368
  declare function InputGroupInput({ className, ...props }: React$1.ComponentProps<"input">): react_jsx_runtime.JSX.Element;
233
369
  declare function InputGroupTextarea({ className, ...props }: React$1.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
234
370
 
235
- export { BooleanField, Checkbox, ColorField, type ColorPreset, ColorSwatches, Field, type FieldConfig, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, type FieldSize, FieldTitle, type FieldType, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, IconField, IconInput, Input, InputField, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, type LabelPosition, NumberField, ObjectField, type ObjectFieldProps, PasswordField, PasswordInput, type PasswordInputProps, RadioGroup, RadioGroupItem, type RowConfig, Select, SelectContent, SelectField, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Slider, SliderNumber, Switch, Textarea, TextareaField, useFormField };
371
+ export { type BooleanControl, BooleanField, Checkbox, CheckboxGroupField, ColorField, type ColorPreset, ColorSwatches, Field, type FieldBadge, type FieldConfig, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, type FieldOrientation, FieldSeparator, FieldSet, type FieldSize, FieldTitle, type FieldType, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, type GroupConfig, IconField, IconInput, Input, InputField, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, type LabelPosition, NumberField, ObjectField, type ObjectFieldProps, PasswordField, PasswordInput, type PasswordInputProps, RadioField, RadioGroup, RadioGroupItem, type RowConfig, Select, SelectContent, SelectField, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SettingsPanel, type SettingsPanelProps, Slider, SliderNumber, Switch, Textarea, TextareaField, useFormField };
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ import * as React$1 from 'react';
2
2
  import * as _radix_ui_react_slot from '@radix-ui/react-slot';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
4
  import * as react_hook_form from 'react-hook-form';
5
- import { FieldValues, FieldPath, ControllerProps, Control } from 'react-hook-form';
5
+ import { FieldValues, FieldPath, ControllerProps, Control, UseFormReturn } from 'react-hook-form';
6
6
  export { Control, DefaultValues, FieldValues, Mode, SubmitHandler, UseFormReturn } from 'react-hook-form';
7
7
  import * as LabelPrimitive from '@radix-ui/react-label';
8
8
  import * as SelectPrimitive from '@radix-ui/react-select';
@@ -36,17 +36,34 @@ declare const FormMessage: React$1.ForwardRefExoticComponent<React$1.HTMLAttribu
36
36
 
37
37
  type LabelPosition = 'side' | 'top';
38
38
  /**
39
- * Field density. `sm` is the compact look used by dense panels (e.g. the
40
- * modeller property editor) and is the default for backward compatibility.
41
- * `md` renders full-size fields for primary, page-level forms.
39
+ * Field density.
40
+ * - `xs` ultra-dense property-panel look (small controls, tight rows, compact
41
+ * section headers). Use for inspector/side panels like the modeller diagram
42
+ * properties editor.
43
+ * - `sm` — compact look, the default for backward compatibility.
44
+ * - `md` — full-size fields for primary, page-level forms.
42
45
  */
43
- type FieldSize = 'sm' | 'md';
44
- type FieldType = 'text' | 'password' | 'textarea' | 'number' | 'boolean' | 'color' | 'select' | 'icon';
46
+ type FieldSize = 'xs' | 'sm' | 'md';
47
+ type FieldType = 'text' | 'password' | 'textarea' | 'number' | 'boolean' | 'checkbox' | 'radio' | 'color' | 'select' | 'icon';
48
+ /** Widget used to render a single `boolean` field. Defaults to `switch`. */
49
+ type BooleanControl = 'switch' | 'checkbox';
50
+ /** Layout for the `radio` list and the multi-select `checkbox` group. */
51
+ type FieldOrientation = 'vertical' | 'horizontal';
45
52
  type ColorPreset = {
46
53
  label: string;
47
54
  value: string;
48
55
  darkValue?: string;
49
56
  };
57
+ /**
58
+ * Small status pill rendered next to a field's label — the "on" / "active" /
59
+ * "no editor" chips seen in inspector panels. `variant` maps to the `Badge`
60
+ * component's variants and defaults to `secondary` (neutral grey). Use
61
+ * `default` for the solid accent ("on") pill.
62
+ */
63
+ type FieldBadge = {
64
+ label: string;
65
+ variant?: 'default' | 'secondary' | 'destructive' | 'outline' | 'soft';
66
+ };
50
67
  type FieldConfig = {
51
68
  name: string;
52
69
  type: FieldType;
@@ -63,22 +80,92 @@ type FieldConfig = {
63
80
  group?: string;
64
81
  row?: string;
65
82
  presetColors?: ColorPreset[];
66
- defaultValue?: string;
83
+ /**
84
+ * Widget for a single `boolean` field: `switch` (default) renders a toggle;
85
+ * `checkbox` renders a compact inline `☑ label`. Ignored by non-boolean types.
86
+ */
87
+ control?: BooleanControl;
88
+ /**
89
+ * Wrap a `switch` boolean in a bordered, padded box. Defaults to `false`
90
+ * (the switch renders inline). Ignored by non-boolean / `checkbox` fields.
91
+ */
92
+ boxed?: boolean;
93
+ /**
94
+ * Layout for `radio` and multi-select `checkbox` groups. Defaults to
95
+ * `vertical`. Ignored by other types.
96
+ */
97
+ orientation?: FieldOrientation;
98
+ /**
99
+ * Initial value. A `string` for most fields, `boolean` for `boolean`, or a
100
+ * `string[]` for a multi-select `checkbox` group.
101
+ */
102
+ defaultValue?: string | number | boolean | string[];
67
103
  /** Number of visible rows for `textarea` fields. */
68
104
  rows?: number;
105
+ /**
106
+ * How many grid columns the field spans on `md+` screens. Defaults to `1`.
107
+ * The grid is two columns by default (see `ObjectField`'s `columns`), so
108
+ * `colSpan: 2` makes a full-width field (textarea, long URI, …). A span
109
+ * larger than the column count simply fills the row. Ignored below `md`,
110
+ * where every field stacks full width.
111
+ */
112
+ colSpan?: number;
113
+ /**
114
+ * Extra classes merged onto the field's grid cell. Escape hatch for
115
+ * per-field layout/spacing tweaks (custom width, ordering, margins, …)
116
+ * without adding a dedicated prop for every case.
117
+ */
118
+ className?: string;
119
+ /**
120
+ * Extra classes merged onto the field's `<FormLabel>`. Escape hatch for
121
+ * per-field label styling (padding, colour, weight, casing, the label→control
122
+ * gap via margin, …) on top of the size-driven defaults.
123
+ */
124
+ labelClassName?: string;
125
+ /**
126
+ * Optional status pill rendered next to the field's label (e.g. an "on" /
127
+ * "active" chip in an inspector row). See {@link FieldBadge}.
128
+ */
129
+ badge?: FieldBadge;
69
130
  };
70
131
  type RowConfig = {
71
132
  id: string;
72
133
  fields: string[];
73
134
  };
135
+ /**
136
+ * Per-group metadata for the section headers of a grouped `ObjectField`.
137
+ * Groups are still discovered from each field's `group` value; this only
138
+ * decorates the matching section header.
139
+ */
140
+ type GroupConfig = {
141
+ /** Matches the `group` value on fields. */
142
+ id: string;
143
+ /** Override the auto-humanized section label (e.g. `viewMode` → "View Mode"). */
144
+ label?: string;
145
+ /**
146
+ * Extra status pills rendered in the section header, after the automatic
147
+ * field-count badge. See {@link FieldBadge}.
148
+ */
149
+ badges?: FieldBadge[];
150
+ /** Show the automatic field-count badge. Defaults to `true`. */
151
+ showCount?: boolean;
152
+ };
74
153
  interface ObjectFieldProps {
75
154
  control: Control<any>;
76
155
  name: string;
77
156
  fields: FieldConfig[];
78
157
  rowConfig?: RowConfig[];
158
+ /** Optional per-group header decoration (extra badges, label override). */
159
+ groupConfig?: GroupConfig[];
79
160
  labelPosition?: LabelPosition;
80
161
  /** Field density. Defaults to `sm` (compact) for backward compatibility. */
81
162
  size?: FieldSize;
163
+ /**
164
+ * Number of columns in the field grid on `md+` screens. Defaults to `2`.
165
+ * Increase it to build wider layouts that fields can span via `colSpan`.
166
+ * Below `md` the grid always collapses to a single column.
167
+ */
168
+ columns?: number;
82
169
  }
83
170
 
84
171
  type AnyValue = any;
@@ -96,17 +183,25 @@ interface BaseFieldProps {
96
183
  max?: number;
97
184
  step?: number;
98
185
  presetColors?: ColorPreset[];
99
- defaultValue?: string;
186
+ defaultValue?: AnyValue;
100
187
  rows?: number;
101
188
  className?: string;
189
+ labelClassName?: string;
190
+ badge?: FieldBadge;
102
191
  labelPosition?: LabelPosition;
103
192
  size?: FieldSize;
193
+ control?: BooleanControl;
194
+ orientation?: FieldOrientation;
195
+ /** Wrap a `switch` boolean in a bordered, padded box. Defaults to `false`. */
196
+ boxed?: boolean;
104
197
  }
105
198
  declare const InputField: React$1.FC<BaseFieldProps>;
106
199
  declare const PasswordField: React$1.FC<BaseFieldProps>;
107
200
  declare const TextareaField: React$1.FC<BaseFieldProps>;
108
201
  declare const SelectField: React$1.FC<BaseFieldProps>;
109
202
  declare const BooleanField: React$1.FC<BaseFieldProps>;
203
+ declare const RadioField: React$1.FC<BaseFieldProps>;
204
+ declare const CheckboxGroupField: React$1.FC<BaseFieldProps>;
110
205
  declare const ColorField: React$1.FC<BaseFieldProps>;
111
206
  declare const NumberField: React$1.FC<BaseFieldProps>;
112
207
  declare const IconField: React$1.FC<BaseFieldProps>;
@@ -115,6 +210,8 @@ declare const Field: {
115
210
  Password: React$1.FC<BaseFieldProps>;
116
211
  Textarea: React$1.FC<BaseFieldProps>;
117
212
  Boolean: React$1.FC<BaseFieldProps>;
213
+ Radio: React$1.FC<BaseFieldProps>;
214
+ CheckboxGroup: React$1.FC<BaseFieldProps>;
118
215
  Color: React$1.FC<BaseFieldProps>;
119
216
  Number: React$1.FC<BaseFieldProps>;
120
217
  Select: React$1.FC<BaseFieldProps>;
@@ -127,6 +224,8 @@ interface FormFieldExtensions {
127
224
  Password: typeof PasswordField;
128
225
  Textarea: typeof TextareaField;
129
226
  Boolean: typeof BooleanField;
227
+ Radio: typeof RadioField;
228
+ CheckboxGroup: typeof CheckboxGroupField;
130
229
  Color: typeof ColorField;
131
230
  Number: typeof NumberField;
132
231
  Select: typeof SelectField;
@@ -135,6 +234,43 @@ interface FormFieldExtensions {
135
234
  type FormFieldType = typeof FormField$1 & FormFieldExtensions;
136
235
  declare const FormField: FormFieldType;
137
236
 
237
+ interface SettingsPanelProps extends Omit<ObjectFieldProps, 'control'> {
238
+ /**
239
+ * The react-hook-form instance (from `useForm`). The panel renders its own
240
+ * `<Form>` provider around the fields, so it is fully self-contained — no
241
+ * external `<Form>` wrapper is required.
242
+ */
243
+ form: UseFormReturn<any>;
244
+ /** Title shown above the fields (uppercase, muted — the panel heading). */
245
+ title?: React$1.ReactNode;
246
+ /** Extra classes merged onto the outer `Card` (e.g. a fixed width). */
247
+ className?: string;
248
+ /** Extra classes merged onto the scrollable `CardContent`. */
249
+ contentClassName?: string;
250
+ /**
251
+ * Extra content rendered inside the form, after the fields — e.g. a footer
252
+ * with Apply / Reset actions. Rendered within the `<Form>` provider so a
253
+ * submit button has form context.
254
+ */
255
+ children?: React$1.ReactNode;
256
+ }
257
+ /**
258
+ * A self-contained, form-driven settings / inspector panel: the card chrome, an
259
+ * uppercase heading and the sectioned {@link ObjectField} accordion in a single
260
+ * component. Consumers own their `useForm` and pass it in; everything else — the
261
+ * `Card`, scroll region, `<Form>` provider, grouped accordions with count
262
+ * badges and per-field status pills — is handled here.
263
+ *
264
+ * ```tsx
265
+ * const form = useForm({ defaultValues });
266
+ * <SettingsPanel title="Canvas Settings" form={form} name="canvas" fields={fields} />
267
+ * ```
268
+ *
269
+ * All {@link ObjectFieldProps} (`name`, `fields`, `rowConfig`, `labelPosition`,
270
+ * `size`, `columns`) are forwarded to the underlying `ObjectField`.
271
+ */
272
+ declare function SettingsPanel({ form, title, className, contentClassName, children, ...objectField }: SettingsPanelProps): react_jsx_runtime.JSX.Element;
273
+
138
274
  interface ColorSwatchesProps {
139
275
  value?: string;
140
276
  onChange?: (value: string) => void;
@@ -232,4 +368,4 @@ declare function InputGroupText({ className, ...props }: React$1.ComponentProps<
232
368
  declare function InputGroupInput({ className, ...props }: React$1.ComponentProps<"input">): react_jsx_runtime.JSX.Element;
233
369
  declare function InputGroupTextarea({ className, ...props }: React$1.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
234
370
 
235
- export { BooleanField, Checkbox, ColorField, type ColorPreset, ColorSwatches, Field, type FieldConfig, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, type FieldSize, FieldTitle, type FieldType, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, IconField, IconInput, Input, InputField, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, type LabelPosition, NumberField, ObjectField, type ObjectFieldProps, PasswordField, PasswordInput, type PasswordInputProps, RadioGroup, RadioGroupItem, type RowConfig, Select, SelectContent, SelectField, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Slider, SliderNumber, Switch, Textarea, TextareaField, useFormField };
371
+ export { type BooleanControl, BooleanField, Checkbox, CheckboxGroupField, ColorField, type ColorPreset, ColorSwatches, Field, type FieldBadge, type FieldConfig, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, type FieldOrientation, FieldSeparator, FieldSet, type FieldSize, FieldTitle, type FieldType, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, type GroupConfig, IconField, IconInput, Input, InputField, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, type LabelPosition, NumberField, ObjectField, type ObjectFieldProps, PasswordField, PasswordInput, type PasswordInputProps, RadioField, RadioGroup, RadioGroupItem, type RowConfig, Select, SelectContent, SelectField, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SettingsPanel, type SettingsPanelProps, Slider, SliderNumber, Switch, Textarea, TextareaField, useFormField };