Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
import { addDecorator, addParameters, configure } from '@storybook/react';
import { withKnobs } from '@storybook/addon-knobs';
import { withActions } from '@storybook/addon-actions';
import { theme } from './theme';
// @ts-ignore
import { DocsPage } from '../src/demo/docs-page';
// @ts-ignore
import { DocsContainer } from '../src/demo/docs-container';
// @ts-ignore
import { withCanvas } from '../src/demo/canvas';
addDecorator(withKnobs());
addDecorator(withActions());
addDecorator(withCanvas);
addParameters({
docs: {
container: DocsContainer,
page: DocsPage,
},
options: {
theme,
},
});
configure(require.context('../src', true, /\.stories\.tsx?$/), module);
import '../../spark/manifests/spark/_spark.scss';
import { configure, addParameters, addDecorator } from '@storybook/html';
import { withA11y } from '@storybook/addon-a11y';
import sparkTheme from '../../storybook-spark-theme';
import { withActions } from '@storybook/addon-actions';
addDecorator(withA11y);
addDecorator(withActions('click .sprk-c-Button'));
addDecorator(withActions('click .sprk-b-Link'));
// remove this as a global , individually set on each component (masthead, alert, modal, etc)
addDecorator(story => `<div data-sprk-main="" class="sprk-o-Box">${story()}</div>`);
// Option defaults
addParameters({
options: {
theme: sparkTheme,
},
});
configure(require.context('../../spark', true, /\/vanilla\/.*\.stories\.(js|ts|tsx|mdx)$/), module);
import '../../spark/manifests/spark/_spark.scss';
import { configure, addParameters, addDecorator } from '@storybook/html';
import { withA11y } from '@storybook/addon-a11y';
import sparkTheme from '../../storybook-spark-theme';
import { withActions } from '@storybook/addon-actions';
addDecorator(withA11y);
addDecorator(withActions('click .sprk-c-Button'));
addDecorator(withActions('click .sprk-b-Link'));
// remove this as a global , individually set on each component (masthead, alert, modal, etc)
addDecorator(story => `<div data-sprk-main="" class="sprk-o-Box">${story()}</div>`);
// Option defaults
addParameters({
options: {
theme: sparkTheme,
},
});
configure(require.context('../../spark', true, /\/vanilla\/.*\.stories\.(js|ts|tsx|mdx)$/), module);
import { Box, Button, Grommet, Text } from 'grommet'
import { Add } from 'grommet-icons'
import React from 'react'
import readme from './README.md'
import Tooltip from './Tooltip'
const config = {
notes: {
markdown: readme
}
}
storiesOf('Tooltip', module)
.addDecorator(withKnobs)
.addDecorator(withActions('click button'))
.add('Light theme (default)', () => (
), config)
.add('Dark theme', () => (
import { Grommet } from 'grommet'
import React from 'react'
import AdminCheckbox from './AdminCheckbox'
import readme from './README.md'
const config = {
notes: {
markdown: readme
}
}
const darkZooTheme = { ...zooTheme, dark: true }
storiesOf('ZooFooter/AdminCheckbox', module)
.addDecorator(withActions('change #admin-checkbox'))
.add('Light theme (default)', () => (
), config)
.add('Dark theme', () => (
), config)
class AdminCheckboxStoryExample extends React.Component {
constructor () {
super()
this.onChange = this.onChange.bind(this)
this.state = {
checked: false
}
export const story2 = () => withActions('click', 'contextmenu')(button);
story2.story = { name: 'Multiple actions' };
import { storiesOf } from '@storybook/html';
import { withActions } from "@storybook/addon-actions";
import readme from "./readme.md";
storiesOf('Star Rating', module)
.addDecorator(withActions("enjinStarRating"))
.addParameters({ jest: ["star-rating"] })
.add('Default', () => '', {
notes: {
markdown: readme
}
})
.add('With Rating', () => {
const starRatingEl = document.createElement('enjin-star-rating');
starRatingEl.value = 3;
return starRatingEl;
}, {
notes: {
markdown: readme
}
})
export const story1 = () => withActions('click')(button);
story1.story = { name: 'Hello World' };
export const story2 = () => withActions('click', 'contextmenu')(button);
story2.story = { name: 'Multiple actions' };
import zooTheme from '@zooniverse/grommet-theme'
import { Grommet } from 'grommet'
import { Add } from 'grommet-icons'
import React from 'react'
import PlainButton from './PlainButton'
import readme from './README.md'
const config = {
notes: {
markdown: readme
}
}
storiesOf('PlainButton', module)
.addDecorator(withActions('click button'))
.addDecorator(withKnobs)
.add('Light theme (default)', () => (
), config)
.add('Dark theme', () => (
), config)
.add('With icon', () => (