<commit_before>import React from 'react';
import { storiesOf } from '@storybook/react';
import { number, select, text } from '@storybook/addon-knobs/react';
import { Box, TextBody, COLORS, TINTS } from '../src';

const displayValues = ['inline', 'inline-block', 'block', 'flex', 'inline-flex'];
const justifyContentValues = ['center', 'flex-start', 'flex-end', 'space-around', 'space-between', 'space-evenly'];
const textAlignValues = ['center', 'left', 'right'];

const spacingOptions = {
  range: true,
  min: 0,
  max: 8,
  step: 1,
};

storiesOf('Box', module)
  .addParameters({
    info: {
      propTablesExclude: [TextBody],
    },
  })
  .add('Basic', () => (
    <Box
      backgroundColor={select('Background color', COLORS, 'neutral')}
      backgroundTint={select('Background tint', TINTS, 'light')}
      borderWidth={number('Border width', 0)}
      borderBottomWidth={number('Border bottom width', 0)}
      borderLeftWidth={number('Border left width', 0)}
      borderRightWidth={number('Border right width', 0)}
      borderTopWidth={number('Border top width', 0)}
      borderColor={select('Border color', COLORS, 'neutral')}
      borderTint={select('Border tint', TINTS, 'dark')}
      borderRadius={text('Border radius', undefined)}
      display={select('Display', displayValues, 'block')}
      justifyContent={select('Justify Content', justifyContentValues, 'flex-start')}
      margin={number('Margin', 0, spacingOptions)}
      padding={number('Padding', 3, spacingOptions)}
      textAlign={select('Text align', textAlignValues, 'left')}
    >
      <TextBody>I'm body text inside a Box component</TextBody>
    </Box>
  ));<commit_msg>Update stories<commit_after>import React from 'react';
import { storiesOf } from '@storybook/react';
import { number, select } from '@storybook/addon-knobs/react';
import { Box, TextBody, COLORS, TINTS } from '../src';

const borderRadiusValues = ['square', 'circle', 'rounded'];
const displayValues = ['inline', 'inline-block', 'block', 'flex', 'inline-flex'];
const justifyContentValues = ['center', 'flex-start', 'flex-end', 'space-around', 'space-between', 'space-evenly'];
const textAlignValues = ['center', 'left', 'right'];

const spacingOptions = {
  range: true,
  min: 0,
  max: 8,
  step: 1,
};

storiesOf('Box', module)
  .addParameters({
    info: {
      propTablesExclude: [TextBody],
    },
  })
  .add('Basic', () => (
    <Box
      backgroundColor={select('Background color', COLORS, 'neutral')}
      backgroundTint={select('Background tint', TINTS, 'light')}
      borderWidth={number('Border width', 0)}
      borderBottomWidth={number('Border bottom width', 0)}
      borderLeftWidth={number('Border left width', 0)}
      borderRightWidth={number('Border right width', 0)}
      borderTopWidth={number('Border top width', 0)}
      borderColor={select('Border color', COLORS, 'neutral')}
      borderTint={select('Border tint', TINTS, 'dark')}
      borderRadius={select('Border radius', borderRadiusValues, 'square')}
      borderTopLeftRadius={select('Border top left radius', borderRadiusValues, 'square')}
      borderTopRightRadius={select('Border top right radius', borderRadiusValues, 'square')}
      borderBottomLeftRadius={select('Border bottom left radius', borderRadiusValues, 'square')}
      borderBottomRightRadius={select('Border bottom right radius', borderRadiusValues, 'square')}
      display={select('Display', displayValues, 'block')}
      justifyContent={select('Justify Content', justifyContentValues, 'flex-start')}
      margin={number('Margin', 0, spacingOptions)}
      padding={number('Padding', 3, spacingOptions)}
      textAlign={select('Text align', textAlignValues, 'left')}
    >
      <TextBody>I'm body text inside a Box component</TextBody>
    </Box>
  ));
{'fraction_non_alphanumeric': 0.16913319238900634, 'fraction_numerical': 0.005285412262156448, 'mean_word_length': 4.7522796352583585, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 13, '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': '602474', 'n_tokens_mistral': 1124, 'n_tokens_neox': 1094, 'n_words': 274}