Skip to content

Commit 6d88f7d

Browse files
authored
docs: adds example for name or label on groups field (#14323)
Adds example to Groups to show they can have name or label
1 parent c1d017a commit 6d88f7d

File tree

1 file changed

+34
-1
lines changed

1 file changed

+34
-1
lines changed

docs/fields/group.mdx

Lines changed: 34 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,7 @@ export const ExampleCollection: CollectionConfig = {
111111

112112
## Presentational group fields
113113

114-
You can also use the Group field to only visually group fields without affecting the data structure. Not defining a label will render just the grouped fields.
114+
You can also use the Group field to only visually group fields without affecting the data structure. Not defining a `name` will render just the grouped fields (no nested object is created). If you want the group to appear as a titled section in the Admin UI, set a `label`.
115115

116116
```ts
117117
import type { CollectionConfig } from 'payload'
@@ -120,6 +120,39 @@ export const ExampleCollection: CollectionConfig = {
120120
slug: 'example-collection',
121121
fields: [
122122
{
123+
label: 'Page meta', // label only → presentational
124+
type: 'group', // required
125+
fields: [
126+
{
127+
name: 'title',
128+
type: 'text',
129+
required: true,
130+
minLength: 20,
131+
maxLength: 100,
132+
},
133+
{
134+
name: 'description',
135+
type: 'textarea',
136+
required: true,
137+
minLength: 40,
138+
maxLength: 160,
139+
},
140+
],
141+
},
142+
],
143+
}
144+
```
145+
146+
## Named group
147+
148+
```ts
149+
import type { CollectionConfig } from 'payload'
150+
151+
export const ExampleCollection: CollectionConfig = {
152+
slug: 'example-collection',
153+
fields: [
154+
{
155+
name: 'pageMeta', // name → nested object in data
123156
label: 'Page meta',
124157
type: 'group', // required
125158
fields: [

0 commit comments

Comments
 (0)