mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-16 19:01:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

chore: update dependencies, remove jest

Browse source 
- remove docs/palimpsest folders (to be replaced)
- remove Layout Storybook component
This commit is contained in:
Eric Liu 2020-07-19 06:53:10 -07:00
commit 76df51674d
110 changed files with 2604 additions and 17979 deletions
Download patch file Download diff file Expand all files Collapse all files

136
src/components/StructuredList/StructuredList.Story.svelte
View file

@ -2,7 +2,7 @@
export let story = undefined;
import CheckmarkFilled16 from "carbon-icons-svelte/lib/CheckmarkFilled16";
import Layout from "../../internal/ui/Layout.svelte";
import StructuredListBody from "./StructuredListBody.svelte";
import StructuredListCell from "./StructuredListCell.svelte";
import StructuredListHead from "./StructuredListHead.svelte";
@ -14,80 +14,78 @@
$: selected = "row-1-value";
</script>
<Layout>
<div>
{#if story === 'skeleton'}
<div style="width: 800px">
<StructuredListSkeleton />
</div>
{:else if story === 'selection'}
<StructuredList selection border bind:selected>
<StructuredListHead>
<StructuredListRow head>
<StructuredListCell head>ColumnA</StructuredListCell>
<StructuredListCell head>ColumnB</StructuredListCell>
<StructuredListCell head>ColumnC</StructuredListCell>
<StructuredListCell head>{''}</StructuredListCell>
</StructuredListRow>
</StructuredListHead>
<StructuredListBody>
{#each [0, 1, 2, 3] as item, i (item)}
<StructuredListRow label for="row-{i}">
<StructuredListCell>Row {i}</StructuredListCell>
<StructuredListCell>Row {i}</StructuredListCell>
<StructuredListCell>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc
dui magna, finibus id tortor sed, aliquet bibendum augue. Aenean
posuere sem vel euismod dignissim. Nulla ut cursus dolor.
Pellentesque vulputate nisl a porttitor interdum.
</StructuredListCell>
<StructuredListInput
id="row-{i}"
value="row-{i}-value"
title="row-{i}-title"
name="row-{i}-name" />
<StructuredListCell>
<CheckmarkFilled16
class="bx--structured-list-svg"
aria-label="select an option"
title="select an option" />
</StructuredListCell>
</StructuredListRow>
{/each}
</StructuredListBody>
</StructuredList>
{:else}
<StructuredList>
<StructuredListHead>
<StructuredListRow head>
<StructuredListCell head>ColumnA</StructuredListCell>
<StructuredListCell head>ColumnB</StructuredListCell>
<StructuredListCell head>ColumnC</StructuredListCell>
</StructuredListRow>
</StructuredListHead>
<StructuredListBody>
<StructuredListRow>
<StructuredListCell noWrap>Row 1</StructuredListCell>
<StructuredListCell>Row 1</StructuredListCell>
<div>
{#if story === 'skeleton'}
<div style="width: 800px">
<StructuredListSkeleton />
</div>
{:else if story === 'selection'}
<StructuredList selection border bind:selected>
<StructuredListHead>
<StructuredListRow head>
<StructuredListCell head>ColumnA</StructuredListCell>
<StructuredListCell head>ColumnB</StructuredListCell>
<StructuredListCell head>ColumnC</StructuredListCell>
<StructuredListCell head>{''}</StructuredListCell>
</StructuredListRow>
</StructuredListHead>
<StructuredListBody>
{#each [0, 1, 2, 3] as item, i (item)}
<StructuredListRow label for="row-{i}">
<StructuredListCell>Row {i}</StructuredListCell>
<StructuredListCell>Row {i}</StructuredListCell>
<StructuredListCell>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
magna, finibus id tortor sed, aliquet bibendum augue. Aenean
posuere sem vel euismod dignissim. Nulla ut cursus dolor.
Pellentesque vulputate nisl a porttitor interdum.
</StructuredListCell>
</StructuredListRow>
<StructuredListRow>
<StructuredListCell noWrap>Row 2</StructuredListCell>
<StructuredListCell>Row 2</StructuredListCell>
<StructuredListInput
id="row-{i}"
value="row-{i}-value"
title="row-{i}-title"
name="row-{i}-name" />
<StructuredListCell>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
magna, finibus id tortor sed, aliquet bibendum augue. Aenean
posuere sem vel euismod dignissim. Nulla ut cursus dolor.
Pellentesque vulputate nisl a porttitor interdum.
<CheckmarkFilled16
class="bx--structured-list-svg"
aria-label="select an option"
title="select an option" />
</StructuredListCell>
</StructuredListRow>
</StructuredListBody>
</StructuredList>
{/if}
</div>
</Layout>
{/each}
</StructuredListBody>
</StructuredList>
{:else}
<StructuredList>
<StructuredListHead>
<StructuredListRow head>
<StructuredListCell head>ColumnA</StructuredListCell>
<StructuredListCell head>ColumnB</StructuredListCell>
<StructuredListCell head>ColumnC</StructuredListCell>
</StructuredListRow>
</StructuredListHead>
<StructuredListBody>
<StructuredListRow>
<StructuredListCell noWrap>Row 1</StructuredListCell>
<StructuredListCell>Row 1</StructuredListCell>
<StructuredListCell>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
vulputate nisl a porttitor interdum.
</StructuredListCell>
</StructuredListRow>
<StructuredListRow>
<StructuredListCell noWrap>Row 2</StructuredListCell>
<StructuredListCell>Row 2</StructuredListCell>
<StructuredListCell>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui
magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere
sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque
vulputate nisl a porttitor interdum.
</StructuredListCell>
</StructuredListRow>
</StructuredListBody>
</StructuredList>
{/if}
</div>