<commit_before>/* eslint-disable multiline-ternary */
import React from 'react';
import { ThemeProvider } from 'styled-components';
import { storiesOf } from '@storybook/react';
import { text, select, boolean } from '@storybook/addon-knobs';
import { action } from '@storybook/addon-actions';
import Pill from './pill.component';
import OptionsHelper from '../../utils/helpers/options-helper';
import classic from '../../style/themes/classic';
import { THEMES } from '../../style/themes';
import { notes, Info } from './documentation';

const getStatusKnobs = () => {
  const pillRole = select('pillRole', [...OptionsHelper.pillRoles], 'tag');

  return {
    pillRole,
    colorVariant: (pillRole === 'status') ? select('colorVariant',
      [...OptionsHelper.pillColors, OptionsHelper.colors[7]], OptionsHelper.pillColors[0]) : null
  };
};

const getKnobs = (theme) => {
  const knobs = {
    children: text('children', 'Pill'),
    fill: boolean('fill', Pill.defaultProps.fill),
    onDelete: boolean('onDelete', false),
    theme,
    size: select('size', OptionsHelper.sizesRestricted, Pill.defaultProps.size)
  };

  if (theme === THEMES.classic) {
    knobs.as = select('as', [...OptionsHelper.colors, 'disabled'], Pill.defaultProps.as);
  } else {
    Object.assign(knobs, getStatusKnobs());
  }
  return knobs;
};

storiesOf('Pill', module)
  .add(THEMES.classic, () => {
    const {
      children,
      as,
      fill,
      onDelete,
      size
    } = getKnobs(THEMES.classic);

    return (
      <ThemeProvider theme={ classic }>
        <Pill
          as={ as }
          fill={ fill }
          onDelete={ onDelete ? action('delete') : null }
          size={ size }
        >
          {children}
        </Pill>
      </ThemeProvider>
    );
  }, {
    info: { Pill, text: Info },
    notes: { markdown: notes },
    knobs: { escapeHTML: false }
  }).add('default', () => {
    const {
      children,
      colorVariant,
      fill,
      onDelete,
      pillRole,
      size
    } = getKnobs(THEMES.small);
    return (
      <Pill
        colorVariant={ colorVariant }
        fill={ fill }
        onDelete={ onDelete ? action('delete') : null }
        pillRole={ pillRole }
        size={ size }
      >
        { children }
      </Pill>
    );<commit_msg>use isClassic to determine theme<commit_after>/* eslint-disable multiline-ternary */
import React from 'react';
import { ThemeProvider } from 'styled-components';
import { storiesOf } from '@storybook/react';
import { text, select, boolean } from '@storybook/addon-knobs';
import { action } from '@storybook/addon-actions';
import Pill from './pill.component';
import OptionsHelper from '../../utils/helpers/options-helper';
import { isClassic } from '../../utils/helpers/style-helper';
import classic from '../../style/themes/classic';
import { notes, Info } from './documentation';

const getStatusKnobs = () => {
  const pillRole = select('pillRole', [...OptionsHelper.pillRoles], 'tag');

  return {
    pillRole,
    colorVariant: (pillRole === 'status') ? select('colorVariant',
      [...OptionsHelper.pillColors, OptionsHelper.colors[7]], OptionsHelper.pillColors[0]) : null
  };
};

const getKnobs = (theme) => {
  const knobs = {
    children: text('children', 'Pill'),
    fill: boolean('fill', Pill.defaultProps.fill),
    onDelete: boolean('onDelete', false),
    theme,
    size: select('size', OptionsHelper.sizesRestricted, Pill.defaultProps.size)
  };

  if (theme && isClassic(theme)) {
    knobs.as = select('as', [...OptionsHelper.colors, 'disabled'], Pill.defaultProps.as);
  } else {
    Object.assign(knobs, getStatusKnobs());
  }
  return knobs;
};

storiesOf('Pill', module)
  .add('classic', () => {
    const {
      children,
      as,
      fill,
      onDelete,
      size
    } = getKnobs(classic);

    return (
      <ThemeProvider theme={ classic }>
        <Pill
          as={ as }
          fill={ fill }
          onDelete={ onDelete ? action('delete') : null }
          size={ size }
        >
          {children}
        </Pill>
      </ThemeProvider>
    );
  }, {
    info: { Pill, text: Info },
    notes: { markdown: notes },
    knobs: { escapeHTML: false }
  }).add('default', () => {
    const {
      children,
      colorVariant,
      fill,
      onDelete,
      pillRole,
      size
    } = getKnobs();
    return (
      <Pill
        colorVariant={ colorVariant }
        fill={ fill }
        onDelete={ onDelete ? action('delete') : null }
        pillRole={ pillRole }
        size={ size }
      >
        { children }
      </Pill>
    );
{'fraction_non_alphanumeric': 0.16124809077023783, 'fraction_numerical': 0.0008727907484180668, 'mean_word_length': 2.5673151750972765, 'pattern_counts': {'":': 0, '<': 15, '<?xml version=': 0, '>': 23, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2253081', 'n_tokens_mistral': 1433, 'n_tokens_neox': 1420, 'n_words': 320}