function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React from 'react';
import { Box, CheckBox, Label } from '../../index.js';
export default {
  title: 'DesignSystem/Atoms/CheckBox',
  component: CheckBox
};
export const Default = props => /*#__PURE__*/React.createElement(Box, {
  flexDirection: "column",
  marginRight: 15
}, /*#__PURE__*/React.createElement(CheckBox, _extends({
  id: "default-checkbox"
}, props)), /*#__PURE__*/React.createElement(Label, {
  inline: true,
  htmlFor: "default-checkbox",
  ml: "default"
}, "Check me!"));
export const AllStates = () => /*#__PURE__*/React.createElement(Box, {
  flex: true
}, /*#__PURE__*/React.createElement(Box, {
  flexDirection: "column",
  marginRight: 15
}, /*#__PURE__*/React.createElement(CheckBox, {
  id: "checkbox1",
  checked: true
}), /*#__PURE__*/React.createElement(Label, {
  inline: true,
  htmlFor: "checkbox1",
  ml: "default"
}, "Checked")), /*#__PURE__*/React.createElement(Box, {
  flexDirection: "column",
  marginRight: 15
}, /*#__PURE__*/React.createElement(CheckBox, {
  id: "checkbox2"
}), /*#__PURE__*/React.createElement(Label, {
  inline: true,
  htmlFor: "checkbox2",
  ml: "default"
}, "Unchecked")), /*#__PURE__*/React.createElement(Box, {
  flexDirection: "column",
  marginRight: 15
}, /*#__PURE__*/React.createElement(CheckBox, {
  id: "checkbox3",
  checked: true,
  disabled: true
}), /*#__PURE__*/React.createElement(Label, {
  inline: true,
  htmlFor: "checkbox3",
  ml: "default"
}, "Disabled")));