mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-16 10:51:06 +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

159
src/components/Modal/Modal.Story.svelte
View file

@ -1,91 +1,88 @@
<script>
import Layout from "../../internal/ui/Layout.svelte";
import { Button } from "../Button";
import Modal from "./Modal.svelte";
let open = $$props.open;
</script>
<Layout>
<div>
<Button
on:click={() => {
open = true;
}}>
Launch modal
</Button>
</div>
<Modal
{...$$props}
bind:open
on:click:button--secondary={() => {
console.log('click button secondary');
open = false;
}}
on:open={() => {
console.log('open');
}}
on:close={() => {
console.log('close');
}}
on:submit={() => {
console.log('submit');
<div>
<Button
on:click={() => {
open = true;
}}>
Launch modal
</Button>
</div>
<Modal
{...$$props}
bind:open
on:click:button--secondary={() => {
console.log('click button secondary');
open = false;
}}
on:open={() => {
console.log('open');
}}
on:close={() => {
console.log('close');
}}
on:submit={() => {
console.log('submit');
}}>
<p>
This component supports two-way binding by default. Please see ComposedModal
for piecemeal functionality.
</p>
{#if $$props.hasScrollingContent}
<p>
This component supports two-way binding by default. Please see
ComposedModal for piecemeal functionality.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt posuere.
Curabitur justo urna, consectetur vel elit iaculis, ultrices condimentum
risus. Nulla facilisi. Etiam venenatis molestie tellus. Quisque
consectetur non risus eu rutrum.{' '}
</p>
{#if $$props.hasScrollingContent}
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt
posuere. Curabitur justo urna, consectetur vel elit iaculis, ultrices
condimentum risus. Nulla facilisi. Etiam venenatis molestie tellus.
Quisque consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt
posuere. Curabitur justo urna, consectetur vel elit iaculis, ultrices
condimentum risus. Nulla facilisi. Etiam venenatis molestie tellus.
Quisque consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt
posuere. Curabitur justo urna, consectetur vel elit iaculis, ultrices
condimentum risus. Nulla facilisi. Etiam venenatis molestie tellus.
Quisque consectetur non risus eu rutrum.{' '}
</p>
<h3>Lorem ipsum</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt
posuere. Curabitur justo urna, consectetur vel elit iaculis, ultrices
condimentum risus. Nulla facilisi. Etiam venenatis molestie tellus.
Quisque consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt
posuere. Curabitur justo urna, consectetur vel elit iaculis, ultrices
condimentum risus. Nulla facilisi. Etiam venenatis molestie tellus.
Quisque consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt
posuere. Curabitur justo urna, consectetur vel elit iaculis, ultrices
condimentum risus. Nulla facilisi. Etiam venenatis molestie tellus.
Quisque consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt
posuere. Curabitur justo urna, consectetur vel elit iaculis, ultrices
condimentum risus. Nulla facilisi. Etiam venenatis molestie tellus.
Quisque consectetur non risus eu rutrum.{' '}
</p>
{/if}
</Modal>
</Layout>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt posuere.
Curabitur justo urna, consectetur vel elit iaculis, ultrices condimentum
risus. Nulla facilisi. Etiam venenatis molestie tellus. Quisque
consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt posuere.
Curabitur justo urna, consectetur vel elit iaculis, ultrices condimentum
risus. Nulla facilisi. Etiam venenatis molestie tellus. Quisque
consectetur non risus eu rutrum.{' '}
</p>
<h3>Lorem ipsum</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt posuere.
Curabitur justo urna, consectetur vel elit iaculis, ultrices condimentum
risus. Nulla facilisi. Etiam venenatis molestie tellus. Quisque
consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt posuere.
Curabitur justo urna, consectetur vel elit iaculis, ultrices condimentum
risus. Nulla facilisi. Etiam venenatis molestie tellus. Quisque
consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt posuere.
Curabitur justo urna, consectetur vel elit iaculis, ultrices condimentum
risus. Nulla facilisi. Etiam venenatis molestie tellus. Quisque
consectetur non risus eu rutrum.{' '}
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean id
accumsan augue. Phasellus consequat augue vitae tellus tincidunt posuere.
Curabitur justo urna, consectetur vel elit iaculis, ultrices condimentum
risus. Nulla facilisi. Etiam venenatis molestie tellus. Quisque
consectetur non risus eu rutrum.{' '}
</p>
{/if}
</Modal>