refactor: use $$restProps API

- add ref prop for applicable components (#196)
- add slot to Content Switcher `Switch` component (#183)
- remove fillArray, css utilities
This commit is contained in:
Eric Liu 2020-07-18 20:00:20 -07:00
commit e886d772c7
288 changed files with 4681 additions and 4498 deletions

View file

@ -1,37 +1,52 @@
import { withKnobs, boolean, text, select } from '@storybook/addon-knobs';
import Component from './Modal.Story.svelte';
import { withKnobs, boolean, text, select } from "@storybook/addon-knobs";
import Component from "./Modal.Story.svelte";
export default { title: 'Modal', decorators: [withKnobs] };
export default { title: "Modal", decorators: [withKnobs] };
const sizes = {
Default: '',
'Extra small (xs)': 'xs',
'Small (sm)': 'sm',
'Large (lg)': 'lg'
Default: "",
"Extra small (xs)": "xs",
"Small (sm)": "sm",
"Large (lg)": "lg",
};
export const Default = () => ({
Component,
props: {
open: boolean('Open (open)', true),
passiveModal: boolean('Without footer (passiveModal)', false),
danger: boolean('Danger mode (danger)', false),
shouldSubmitOnEnter: boolean('Enter key to submit (shouldSubmitOnEnter)', false),
focusTrap: boolean('Trap focus (focusTrap)', false),
hasScrollingContent: boolean('Modal contains scrollable content (hasScrollingContent)', false),
modalHeading: text('Modal heading (modalHeading)', 'Modal heading'),
modalLabel: text('Optional label (modalLabel)', 'Label'),
open: boolean("Open (open)", true),
passiveModal: boolean("Without footer (passiveModal)", false),
danger: boolean("Danger mode (danger)", false),
shouldSubmitOnEnter: boolean(
"Enter key to submit (shouldSubmitOnEnter)",
false
),
focusTrap: boolean("Trap focus (focusTrap)", false),
hasScrollingContent: boolean(
"Modal contains scrollable content (hasScrollingContent)",
false
),
modalHeading: text("Modal heading (modalHeading)", "Modal heading"),
modalLabel: text("Optional label (modalLabel)", "Label"),
modalAriaLabel: text(
'ARIA label, used only if modalLabel not provided (modalAriaLabel)',
'A label to be read by screen readers on the modal root node'
"ARIA label, used only if modalLabel not provided (modalAriaLabel)",
"A label to be read by screen readers on the modal root node"
),
primaryButtonText: text(
"Primary button text (primaryButtonText)",
"Primary Button"
),
secondaryButtonText: text(
"Secondary button text (secondaryButtonText)",
"Secondary Button"
),
primaryButtonText: text('Primary button text (primaryButtonText)', 'Primary Button'),
secondaryButtonText: text('Secondary button text (secondaryButtonText)', 'Secondary Button'),
selectorPrimaryFocus: text(
'Primary focus element selector (selectorPrimaryFocus)',
'[data-modal-primary-focus]'
"Primary focus element selector (selectorPrimaryFocus)",
"[data-modal-primary-focus]"
),
size: select('Size (size)', sizes),
iconDescription: text('Close icon description (iconDescription)', 'Close the modal')
}
size: select("Size (size)", sizes),
iconDescription: text(
"Close icon description (iconDescription)",
"Close the modal"
),
},
});