First release

node_modules/nes.css/story/icons/icons.stories.js

@@ -0,0 +1,12 @@
+import { storiesOf } from '@storybook/html';
+import { withKnobs } from '@storybook/addon-knobs';
+
+import Icons from './icons.template';
+import Sprites from './sprites.template';
+import Reactions from './reactions.template';
+
+storiesOf('Icons', module)
+  .addDecorator(withKnobs)
+  .add('Icons', () => Icons())
+  .add('Sprites', () => Sprites())
+  .add('Reactions', () => Reactions());

node_modules/nes.css/story/icons/icons.template.js

@@ -0,0 +1,23 @@
+import { radios, select } from '@storybook/addon-knobs';
+import classNames from 'classnames';
+
+import { Icons, Size } from '../_helpers/icons';
+
+export default () => {
+  const selectedIcon = select('class', {
+    ...Icons,
+  }, 'twitter');
+
+  const iconSize = radios('Icon Size', {
+    ...Size,
+  }, '');
+
+  const iconClasses = classNames(
+    'nes-icon',
+    selectedIcon,
+    iconSize,
+  );
+  return `
+    <i class="${iconClasses}"></i>
+  `;
+};

node_modules/nes.css/story/icons/reactions.template.js

@@ -0,0 +1,33 @@
+import { select } from '@storybook/addon-knobs';
+import classNames from 'classnames';
+
+import { Reactions } from '../_helpers/icons';
+
+export default () => {
+  const reactionIcon = select('Reaction Icon', {
+    ...Reactions,
+  }, 'heart');
+
+  const reactionSize = select('Size Class', {
+    'is-small': 'is-small',
+    'is-medium': 'is-medium',
+    'is-large': 'is-large',
+  }, 'is-large');
+
+  const reactionFill = select('Fill Class', {
+    default: '',
+    'is-half': 'is-half',
+    'is-transparent': 'is-transparent',
+    'is-empty': 'is-empty',
+  });
+
+  const reactionClasses = classNames(
+    'nes-icon',
+    reactionIcon,
+    reactionSize,
+    reactionFill,
+  );
+  return `
+    <i class="${reactionClasses}"></i>
+  `;
+};

node_modules/nes.css/story/icons/sprites.template.js

@@ -0,0 +1,13 @@
+import { select } from '@storybook/addon-knobs';
+
+import { Sprites } from '../_helpers/icons';
+
+export default () => {
+  const selectedSprite = select('class', {
+    ...Sprites,
+  }, 'nes-pokeball');
+
+  return `
+    <i class="${selectedSprite}"></i>
+  `;
+};