Update docs (#965)

* chore(docs): run "npx browserslist@latest --update-db"

* chore(docs): upgrade carbon-icons-svelte to latest

* refactor(docs): re-use styles from css/all.scss

* chore(docs): add pnpm install command

* chore(docs): upgrade prettier, prettier-plugin-svelte

* docs(date-picker): improve "DatePicker in a modal" example

* fix(docs): restore "scripts-markup-styles" svelte sort order

* chore(docs): upgrade mdsvex

* chore(deps-dev): bump prettier, prettier-plugin-svelte, svelte

* refactor(docs): use svelte:fragment where applicable

* fix(docs): include missing "options" in svelteSortOrder prettier config
This commit is contained in:
Eric Liu 2022-01-01 10:58:42 -08:00 committed by GitHub
commit dce2dda72a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
27 changed files with 119 additions and 190 deletions

View file

@ -131,20 +131,20 @@ The slot name for the table header cells is `"cell-header"`.
},
]}"
>
<span slot="cell-header" let:header>
<svelte:fragment slot="cell-header" let:header>
{#if header.key === 'port'}
{header.value} (network)
{:else}
{header.value}
{/if}
</span>
<span slot="cell" let:row let:cell>
</svelte:fragment>
<svelte:fragment slot="cell" let:row let:cell>
{#if cell.key === 'rule' && cell.value === 'Round robin'}
<Link icon={Launch16} href="https://en.wikipedia.org/wiki/Round-robin_DNS" target="_blank">{cell.value}</Link>
{:else}
{cell.value}
{/if}
</span>
</svelte:fragment>
</DataTable>
### With title, description
@ -1018,11 +1018,11 @@ In the following example, each row in the sortable data table has an overflow me
},
]}"
>
<div slot="expanded-row" let:row>
<svelte:fragment slot="expanded-row" let:row>
<pre>
{JSON.stringify(row, null, 2)}
</pre>
</div>
</svelte:fragment>
</DataTable>
### Non-expandable rows
@ -1085,11 +1085,11 @@ Use `nonExpandableRowIds` to specify the ids for rows that should not be expanda
},
]}"
>
<div slot="expanded-row" let:row>
<svelte:fragment slot="expanded-row" let:row>
<pre>
{JSON.stringify(row, null, 2)}
</pre>
</div>
</svelte:fragment>
</DataTable>
### Expandable (short size)
@ -1146,11 +1146,11 @@ Use `nonExpandableRowIds` to specify the ids for rows that should not be expanda
},
]}"
>
<div slot="expanded-row" let:row>
<svelte:fragment slot="expanded-row" let:row>
<pre>
{JSON.stringify(row, null, 2)}
</pre>
</div>
</svelte:fragment>
</DataTable>
### Expandable (tall size)
@ -1207,11 +1207,11 @@ Use `nonExpandableRowIds` to specify the ids for rows that should not be expanda
},
]}"
>
<div slot="expanded-row" let:row>
<svelte:fragment slot="expanded-row" let:row>
<pre>
{JSON.stringify(row, null, 2)}
</pre>
</div>
</svelte:fragment>
</DataTable>
### Batch expansion
@ -1268,11 +1268,11 @@ Use `nonExpandableRowIds` to specify the ids for rows that should not be expanda
},
]}"
>
<div slot="expanded-row" let:row>
<svelte:fragment slot="expanded-row" let:row>
<pre>
{JSON.stringify(row, null, 2)}
</pre>
</div>
</svelte:fragment>
</DataTable>
### Skeleton