react-collection-helpers/es/components/First/First.stories.js

React Collection Helpers Component

import React from 'react';
import { storiesOf } from '@kadira/storybook';

import First from '../First';
import Sort from '../Sort';

storiesOf('First', module).add('default (1 item)', function () {
  return React.createElement(
    First,
    { collection: ['Apple', 'Banana', 'Carrot'] },
    function (item) {
      return React.createElement(
        'div',
        null,
        item
      );
    }
  );
}).add('first 3 of 4 items', function () {
  return React.createElement(
    First,
    { collection: ['Apple', 'Banana', 'Carrot', 'Dragonfruit'], num: 3 },
    function (item) {
      return React.createElement(
        'div',
        null,
        item
      );
    }
  );
}).add('composed with Sort', function () {
  var collection = [{ id: 'a', name: 'Apple', price: 5 }, { id: 'b', name: 'Banana', price: 10.25 }, { id: 'c', name: 'Carrot', price: 4.50 }, { id: 'd', name: 'Dragonfruit', price: 7.50 }, { id: 'e', name: 'Eggplant', price: 12.75 }];

  return React.createElement(
    Sort,
    { collection: collection, comparator: 'price' },
    React.createElement(
      First,
      { num: 2 },
      function (item) {
        return React.createElement(
          'div',
          null,
          item.name,
          ' - ',
          item.price
        );
      }
    )
  );
});