101 lines
2.4 KiB
Plaintext
101 lines
2.4 KiB
Plaintext
---
|
|
group: Widgets
|
|
title: Object
|
|
weight: 21
|
|
---
|
|
|
|
- **Name:** `object`
|
|
- **UI:** a field containing one or more child widgets
|
|
- **Data type:** Object of child widget values
|
|
|
|
The object widget allows you to group multiple widgets together, nested under a single field. You can choose any widget as a child of an object widget, even other object widgets.
|
|
|
|
## Widget options
|
|
|
|
For common options, see [Common widget options](/docs/widgets#common-widget-options).
|
|
|
|
| Name | Type | Default | Description |
|
|
| --------- | ------- | ------- | ------------------------------------------------------------ |
|
|
| fields | boolean | `false` | A nested list of widget fields to include in your widget |
|
|
| collapsed | boolean | `false` | _Optional_. Collapse the widget's content by default |
|
|
| summary | string | `value` | _Optional_. The label displayed when the object is collapsed |
|
|
|
|
_Please note:_ A default value cannot be set directly on an object widget. Instead you can set defaults within each sub-field's configuration
|
|
|
|
## Example
|
|
|
|
<CodeTabs>
|
|
```yaml
|
|
name: 'profile'
|
|
label: 'Profile'
|
|
widget: 'object'
|
|
summary: '{{fields.name}}: {{fields.birthdate}}'
|
|
fields:
|
|
- name: public
|
|
label: Public
|
|
widget: boolean
|
|
default: true
|
|
- name: name
|
|
label: Name
|
|
widget: string
|
|
- name: 'birthdate'
|
|
label: 'Birthdate'
|
|
widget: 'date'
|
|
default: ''
|
|
format: 'MM/DD/YYYY'
|
|
- name: 'address'
|
|
label: 'Address'
|
|
widget: 'object'
|
|
collapsed: true
|
|
fields:
|
|
- name: street
|
|
label: Street Address
|
|
widget: string
|
|
- name: city
|
|
label: City
|
|
widget: string
|
|
- name: post-code
|
|
label: Postal Code
|
|
widget: string
|
|
```
|
|
|
|
```js
|
|
name: 'profile',
|
|
label: 'Profile',
|
|
widget: 'object',
|
|
summary: '{{fields.name}}: {{fields.birthdate}}',
|
|
fields: [
|
|
{
|
|
name: 'public',
|
|
label: 'Public',
|
|
widget: 'boolean',
|
|
default: true
|
|
},
|
|
{
|
|
name: 'name',
|
|
label: 'Name',
|
|
widget: 'string'
|
|
},
|
|
{
|
|
name: 'birthdate',
|
|
label: 'Birthdate',
|
|
widget: 'date',
|
|
default: '',
|
|
format: 'MM/DD/YYYY'
|
|
},
|
|
{
|
|
name: 'address',
|
|
label: 'Address',
|
|
widget: 'object',
|
|
collapsed: true,
|
|
fields: [
|
|
{ name: 'street', label: 'Street Address', widget: 'string' },
|
|
{ name: 'city', label: 'City', widget: 'string' },
|
|
{ name: 'post-code', label: 'Postal Code', widget: 'string' },
|
|
],
|
|
},
|
|
],
|
|
```
|
|
|
|
</CodeTabs>
|