{"size": 1140, "ext": "js", "max_stars_repo_path": "react/Dropdown/Dropdown.sketch.js", "max_stars_repo_name": "FastNinja/seek-style-guide", "max_stars_repo_stars_event_min_datetime": "2017-01-13T04:23:52.000Z", "max_stars_repo_stars_event_max_datetime": "2021-12-31T03:16:59.000Z", "max_issues_repo_path": "react/Dropdown/Dropdown.sketch.js", "max_issues_repo_name": "FastNinja/seek-style-guide", "max_issues_repo_issues_event_min_datetime": "2017-01-13T01:09:49.000Z", "max_issues_repo_issues_event_max_datetime": "2020-07-29T00:05:36.000Z", "max_forks_repo_path": "react/Dropdown/Dropdown.sketch.js", "max_forks_repo_name": "FastNinja/seek-style-guide", "max_forks_repo_forks_event_min_datetime": "2017-02-13T05:31:19.000Z", "max_forks_repo_forks_event_max_datetime": "2021-12-31T03:16:59.000Z"}
{"max_stars_count": 304, "max_issues_count": 279, "max_forks_count": 64, "avg_line_length": 24.2553191489, "max_line_length": 88, "alphanum_fraction": 0.6307017544}
import React from 'react';
import Dropdown from './Dropdown';
import styles from './Dropdown.sketch.less';
import SketchFieldContainer from '../private/SketchFieldContainer/SketchFieldContainer';

const commonProps = {
  className: styles.root,
  label: 'Label',
  placeholder: 'Placeholder text',
  options: [],
  value: '',
  onChange: () => {}
};

export const symbols = {
  'Dropdown/Standard': (
    <SketchFieldContainer>
      <Dropdown {...commonProps} id="dropdown1" message={false} />
    </SketchFieldContainer>
  ),
  'Dropdown/With Help Text': (
    <SketchFieldContainer>
      <Dropdown {...commonProps} id="dropdown2" message="Help text" />
    </SketchFieldContainer>
  ),
  'Dropdown/With Critical Text': (
    <SketchFieldContainer>
      <Dropdown
        {...commonProps}
        id="dropdown3"
        message="Critical text"
        tone="critical"
      />
    </SketchFieldContainer>
  ),
  'Dropdown/With Positive Text': (
    <SketchFieldContainer>
      <Dropdown
        {...commonProps}
        id="dropdown4"
        message="Positive text"
        tone="positive"
      />
    </SketchFieldContainer>
  )
};
