Skip to content

Commit 84baf0e

Browse files
juanmaguitarbph
authored andcommitted
Dataviews docs: Layout properties checks and link (WordPress#64918)
* fix check icons * defaultLayouts clarification and link to properties of layout
1 parent 1ddeda8 commit 84baf0e

File tree

1 file changed

+16
-11
lines changed

1 file changed

+16
-11
lines changed

packages/dataviews/README.md

+16-11
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ Each field is an object with the following properties:
124124

125125
- `value`: The id of the value to filter to (for internal use)
126126
- `label`: The text that will be displayed in the UI for the item.
127-
- `description`: A longer description that describes the element, to also be displayed. Optional.
127+
- `description`: A longer description that describes the element, to also be displayed. Optional.
128128

129129
To enable the filter by a field we just need to set a proper value to the `elements` property of the field we'd like to filter by.
130130

@@ -172,20 +172,23 @@ Properties:
172172
- `perPage`: number of records to show per page.
173173
- `page`: the page that is visible.
174174
- `sort`:
175+
175176
- `field`: the field used for sorting the dataset.
176177
- `direction`: the direction to use for sorting, one of `asc` or `desc`.
177178

178179
- `fields`: the `id` of the fields that are visible in the UI and the specific order in which they are displayed.
179180
- `layout`: config that is specific to a particular layout type.
180181

181-
| Properties of `layout` | Table | Grid | List |
182-
| --- | --- | --- | --- |
183-
| `primaryField`: the field's `id` to be highlighted in each layout. It's not hidable. | ✓ | ✓ | ✓ |
184-
| `mediaField`: the field's `id` to be used for rendering each card's media. It's not hiddable. | | ✓ | ✓ |
185-
| `columnFields`: a list of field's `id` to render vertically stacked instead of horizontally (the default). | | ✓ | |
186-
| `badgeFields`: a list of field's `id` to render without label and styled as badges. | | ✓ | |
187-
| `combinedFields`: a list of "virtual" fields that are made by combining others. See "Combining fields" section. | ✓ | | |
188-
| `styles`: additional `width`, `maxWidth`, `minWidth` styles for each field column. | ✓ | | |
182+
#### Properties of `layout`
183+
184+
| Properties of `layout` | Table | Grid | List |
185+
| --------------------------------------------------------------------------------------------------------------- | ----- | ---- | ---- |
186+
| `primaryField`: the field's `id` to be highlighted in each layout. It's not hidable. ||||
187+
| `mediaField`: the field's `id` to be used for rendering each card's media. It's not hiddable. | |||
188+
| `columnFields`: a list of field's `id` to render vertically stacked instead of horizontally (the default). | || |
189+
| `badgeFields`: a list of field's `id` to render without label and styled as badges. | || |
190+
| `combinedFields`: a list of "virtual" fields that are made by combining others. See "Combining fields" section. || | |
191+
| `styles`: additional `width`, `maxWidth`, `minWidth` styles for each field column. || | |
189192

190193
### `onChangeView`: `function`
191194

@@ -307,6 +310,8 @@ const defaultLayouts = {
307310
};
308311
```
309312

313+
The `defaultLayouts` property should be an object that includes properties named `table`, `grid`, or `list`. Each of these properties should contain a `layout` property, which holds the configuration for each specific layout type. Check [here](#properties-of-layout) the full list of properties available for each layout's configuration
314+
310315
### `onChangeSelection`: `function`
311316

312317
Callback that signals the user selected one of more items, and takes them as parameter. So far, only the `list` view implements it.
@@ -331,8 +336,8 @@ Each "virtual field", has to provide an `id` and `label` (optionally a `header`
331336

332337
Additionally, they need to provide:
333338

334-
- `children`: a list of field's `id` to combine
335-
- `direction`: how should they be stacked, `vertically` or `horizontally`
339+
- `children`: a list of field's `id` to combine
340+
- `direction`: how should they be stacked, `vertically` or `horizontally`
336341

337342
For example, this is how you'd define a `site` field which is a combination of a `title` and `description` fields, which are not displayed:
338343

0 commit comments

Comments
 (0)