@storybook/react#storiesOf JavaScript Examples

The following examples show how to use @storybook/react#storiesOf. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: Card.stories.js    From jasper with MIT License 6 votes vote down vote up
storiesOf("Card").add(
  "large-card",
  () => <Card
    type='large-card'
    image={PlaceholderImg}
    title='Card Title That is Very Long to Decribe Something'
    miniTitle='Card Mini Title'
    className="tes"
    text='COMPFEST is an annual one-stop IT event run by students of Faculty of Computer Science, University of Indonesia. Lorem ipsum dolor sit amet Lorem. COMPFEST is an annual one-stop IT event run by students of Faculty of Computer Science, University of Indonesia. Lorem ipsum dolor sit amet Lorem.'
    buttonTop={<Button> Hello </Button>}
    buttonBottom={<Button> Hello </Button>}/>
)
Example #2
Source File: Simple.js    From VTour with MIT License 6 votes vote down vote up
storiesOf('Accordion', module).add('Simple', function () {
  return React.createElement(SimpleAccordion, null);
}).add('Dark no animation', function () {
  return React.createElement(SimpleAccordion, {
    animate: false,
    background: "dark-2"
  });
}).add('Multiple', function () {
  return React.createElement(SimpleAccordion, {
    multiple: true
  });
});
Example #3
Source File: AlertBox.stories.js    From jasper with MIT License 5 votes vote down vote up
storiesOf("AlertBox").add("Default", () => (
  <AlertBox className="testing" message={alertMessage} cancel={alertCancel} proceed={alertProceed} />
))
Example #4
Source File: index.stories.js    From modern-react-qr-reader with MIT License 5 votes vote down vote up
storiesOf("QR Reader", module)
  .add("FacingMode not specified", () => <Wrapper />)
  .add("Choose facingMode", () => <Wrapper selectFacingMode />)
  .add("Legacy mode", () => <Wrapper legacyMode />)
  .add("Choose delay", () => <Wrapper selectDelay />)
  .add("On and off", () => <Wrapper onAndOff />);
Example #5
Source File: AllComponents.js    From VTour with MIT License 5 votes vote down vote up
storiesOf('All', module).add('All', function () {
  return React.createElement(Components, null);
});