docs(data-table): improve example names and descriptions (#1451)

* docs(data-table): "Selectable" -> "Selectable rows (checkbox)"

* docs(data-table): "Selectable (radio)" -> "Selectable rows (radio)"

* docs(data-table): "Expandable" -> "Expandable rows"

* docs(data-table): update "Batch expansion" description

* docs(data-table): "Expandable and selectable" -> "Expandable and selectable rows"
This commit is contained in:
metonym 2022-08-17 07:01:58 -07:00 committed by GitHub
commit b5c4501903
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -1097,7 +1097,9 @@ In the following example, each row in the sortable data table has an overflow me
<FileSource src="/framed/DataTable/DataTableAppendColumns" /> <FileSource src="/framed/DataTable/DataTableAppendColumns" />
### Selectable ### Selectable rows (checkbox)
Set `selectable` to `true` for rows to be multi-selectable.
<FileSource src="/framed/DataTable/SelectableDataTable" /> <FileSource src="/framed/DataTable/SelectableDataTable" />
@ -1125,7 +1127,9 @@ You can also prevent the default "Cancel" behavior in the dispatched `on:cancel`
<FileSource src="/framed/DataTable/DataTableBatchSelectionToolbarControlled" /> <FileSource src="/framed/DataTable/DataTableBatchSelectionToolbarControlled" />
### Selectable (radio) ### Selectable rows (radio)
Set `radio` to `true` for only one row to be selected at a time.
<FileSource src="/framed/DataTable/RadioSelectableDataTable" /> <FileSource src="/framed/DataTable/RadioSelectableDataTable" />
@ -1135,7 +1139,9 @@ Use `nonSelectableRowIds` to specify the ids for rows that should not be selecta
<FileSource src="/framed/DataTable/DataTableNonSelectableRows" /> <FileSource src="/framed/DataTable/DataTableNonSelectableRows" />
### Expandable ### Expandable rows
Set `expandable` to `true` for rows to be expandable.
<DataTable expandable <DataTable expandable
headers="{[ headers="{[
@ -1383,6 +1389,8 @@ Use `nonExpandableRowIds` to specify the ids for rows that should not be expanda
### Batch expansion ### Batch expansion
Set `batchExpansion` to `true` for the ability to expand and collapse all rows at once.
<DataTable batchExpansion <DataTable batchExpansion
headers="{[ headers="{[
{ key: "name", value: "Name" }, { key: "name", value: "Name" },
@ -1440,7 +1448,9 @@ Use `nonExpandableRowIds` to specify the ids for rows that should not be expanda
</svelte:fragment> </svelte:fragment>
</DataTable> </DataTable>
### Expandable and selectable ### Expandable and selectable rows
The `batchExpansion` and `batchSelection` props can be used together.
<FileSource src="/framed/DataTable/DataTableExpandableSelectable" /> <FileSource src="/framed/DataTable/DataTableExpandableSelectable" />