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

@ -23,7 +23,7 @@
</script>
<DataTable sortable headers="{headers}" rows="{rows}">
<span slot="cell" let:cell>
<svelte:fragment slot="cell" let:cell>
{#if cell.key === "overflow"}
<OverflowMenu flipped>
<OverflowMenuItem text="Restart" />
@ -34,5 +34,5 @@
<OverflowMenuItem danger text="Stop" />
</OverflowMenu>
{:else}{cell.value}{/if}
</span>
</svelte:fragment>
</DataTable>

View file

@ -60,9 +60,9 @@
]}"
rows="{rows}"
>
<div slot="expanded-row" let:row>
<svelte:fragment slot="expanded-row" let:row>
<pre>
{JSON.stringify(row, null, 2)}
</pre>
</div>
</svelte:fragment>
</DataTable>

View file

@ -2,7 +2,12 @@
import { Modal, DatePicker, DatePickerInput } from "carbon-components-svelte";
</script>
<Modal open modalHeading="DatePicker">
<Modal
open
modalHeading="Meeting date"
primaryButtonText="Confirm"
secondaryButtonText="Cancel"
>
<DatePicker datePickerType="single" flatpickrProps="{{ static: true }}">
<DatePickerInput labelText="Meeting date" placeholder="mm/dd/yyyy" />
</DatePicker>

View file

@ -18,9 +18,9 @@
</Button>
<ImageLoader bind:this="{imageLoader}" bind:error fadeIn src="{src}">
<div slot="error">
<svelte:fragment slot="error">
<Button kind="ghost" on:click="{() => imageLoader.loadImage(src)}">
Error. Try again
</Button>
</div>
</svelte:fragment>
</ImageLoader>

View file

@ -8,11 +8,11 @@
<Tab label="Tab label 1" />
<Tab label="Tab label 2" />
<Tab label="Tab label 3" />
<div slot="content">
<svelte:fragment slot="content">
<TabContent>Content 1</TabContent>
<TabContent>Content 2</TabContent>
<TabContent>Content 3</TabContent>
</div>
</svelte:fragment>
</Tabs>
<div>

View file

@ -15,10 +15,9 @@
</script>
<Header company="IBM" platformName="Carbon Svelte" bind:isSideNavOpen>
<div slot="skip-to-content">
<svelte:fragment slot="skip-to-content">
<SkipToContent />
</div>
</svelte:fragment>
<HeaderNav>
<HeaderNavItem href="/" text="Link 1" />
<HeaderNavItem href="/" text="Link 2" />

View file

@ -21,10 +21,9 @@
</script>
<Header company="IBM" platformName="Carbon Svelte" bind:isSideNavOpen>
<div slot="skip-to-content">
<svelte:fragment slot="skip-to-content">
<SkipToContent />
</div>
</svelte:fragment>
<HeaderNav>
<HeaderNavItem href="/" text="Link 1" />
<HeaderNavItem href="/" text="Link 2" />

View file

@ -22,10 +22,9 @@
</script>
<Header company="IBM" platformName="Carbon Svelte" bind:isSideNavOpen>
<div slot="skip-to-content">
<svelte:fragment slot="skip-to-content">
<SkipToContent />
</div>
</svelte:fragment>
<HeaderNav>
<HeaderNavItem href="/" text="Link 1" />
<HeaderNavItem href="/" text="Link 2" />

View file

@ -66,9 +66,9 @@
</script>
<Header company="IBM" platformName="Carbon Svelte">
<div slot="skip-to-content">
<svelte:fragment slot="skip-to-content">
<SkipToContent />
</div>
</svelte:fragment>
<HeaderUtilities>
<HeaderSearch
bind:ref

View file

@ -41,9 +41,9 @@
</script>
<Header company="IBM" platformName="Carbon Svelte" bind:isSideNavOpen>
<div slot="skip-to-content">
<svelte:fragment slot="skip-to-content">
<SkipToContent />
</div>
</svelte:fragment>
<HeaderUtilities>
<HeaderAction bind:isOpen transition="{transitions[selected].value}">
<HeaderPanelLinks>

View file

@ -27,9 +27,9 @@
</script>
<Header company="IBM" platformName="Carbon Svelte" bind:isSideNavOpen>
<div slot="skip-to-content">
<svelte:fragment slot="skip-to-content">
<SkipToContent />
</div>
</svelte:fragment>
<HeaderUtilities>
<HeaderGlobalAction aria-label="Settings" icon="{SettingsAdjust20}" />
<HeaderAction

View file

@ -25,10 +25,9 @@
platformName="Carbon Svelte"
bind:isSideNavOpen
>
<div slot="skip-to-content">
<svelte:fragment slot="skip-to-content">
<SkipToContent />
</div>
</svelte:fragment>
<HeaderNav>
<HeaderNavItem href="/" text="Link 1" />
<HeaderNavItem href="/" text="Link 2" />