@bolio-ui/core 1.1.7 → 2.0.0-alpha.0

package/esm/Capacity/stories.js

@@ -1,85 +0,0 @@
-import useTheme from '../use-theme';
-import Capacity from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Data Display/Capacity',
-  component: Capacity
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 4,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 15,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 4,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 45,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 4,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 95,
-    width: "200px"
-  })));
-};
-export var FixedColor = function FixedColor() {
-  var theme = useTheme();
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 75,
-    color: theme.palette.foreground,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 75,
-    color: theme.palette.primary,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 75,
-    color: theme.palette.secondary,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 75,
-    color: theme.palette.success,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 75,
-    color: theme.palette.warning,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 75,
-    color: theme.palette.error,
-    width: "200px"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Capacity, {
-    value: 75,
-    color: theme.palette.info,
-    width: "200px"
-  })));
-};

package/esm/Card/stories.js

@@ -1,175 +0,0 @@
-import Card from '.';
-import Text from '../Text';
-import Grid from '../Grid';
-import Link from '../Link';
-import Image from '../Image';
-import Code from '../Code';
-import Divider from '../Divider';
-export default {
-  title: 'Surface/Card',
-  component: Card
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Card, null, "A default card.")));
-};
-export var Hover = function Hover() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    hoverable: true
-  }, "A hoverable default card.")), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    hoverable: true,
-    type: "primary"
-  }, "A hoverable primary card.")), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    hoverable: true,
-    type: "secondary"
-  }, "A hoverable secondary card.")));
-};
-export var Border = function Border() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    bordered: true
-  }, "A bordered default card.")), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    bordered: true,
-    type: "primary"
-  }, "A bordered primary card.")), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    bordered: true,
-    type: "secondary"
-  }, "A bordered secondary card.")));
-};
-export var Shadow = function Shadow() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    shadow: true
-  }, "A shadow default card.")), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    shadow: true,
-    type: "primary"
-  }, "A shadow primary card.")), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 4
-  }, /*#__PURE__*/React.createElement(Card, {
-    shadow: true,
-    type: "secondary"
-  }, "A shadow secondary card.")));
-};
-export var Variants = function Variants() {
-  var tuple = function tuple() {
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    return args;
-  };
-
-  var types = tuple('default', 'primary', 'secondary', 'success', 'warning', 'error', 'dark', 'lite', 'info');
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, types.map(function (type) {
-    return /*#__PURE__*/React.createElement(Grid, {
-      xs: 6,
-      md: 4,
-      key: type
-    }, /*#__PURE__*/React.createElement(Card, {
-      type: type,
-      width: "100%"
-    }, /*#__PURE__*/React.createElement(Text, {
-      h4: true,
-      my: 0,
-      style: {
-        textTransform: 'uppercase'
-      }
-    }, type), /*#__PURE__*/React.createElement(Text, null, type)));
-  }));
-};
-export var WithFooter = function WithFooter() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    justify: "center"
-  }, /*#__PURE__*/React.createElement(Card, {
-    width: "100%"
-  }, /*#__PURE__*/React.createElement(Text, {
-    h4: true,
-    my: 0
-  }, "Bolio UI"), /*#__PURE__*/React.createElement(Text, null, "More creative and fun with amazing features for React."), /*#__PURE__*/React.createElement(Card.Footer, null, /*#__PURE__*/React.createElement(Link, {
-    color: true,
-    target: "_blank",
-    href: "https://github.com/bolio-ui/bolio-ui"
-  }, "Visit source code on GitHub.")))), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    justify: "center"
-  }, /*#__PURE__*/React.createElement(Card, {
-    width: "100%",
-    type: "dark"
-  }, /*#__PURE__*/React.createElement(Text, {
-    h4: true,
-    my: 0
-  }, "Bolio UI"), /*#__PURE__*/React.createElement(Text, null, "More creative and fun with amazing features for React."), /*#__PURE__*/React.createElement(Card.Footer, null, /*#__PURE__*/React.createElement(Link, {
-    target: "_blank",
-    href: "https://github.com/bolio-ui/bolio-ui"
-  }, "Visit source code on GitHub.")))));
-};
-export var WithImage = function WithImage() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Card, {
-    width: "350px"
-  }, /*#__PURE__*/React.createElement(Image, {
-    src: "https://images.pexels.com/photos/1779487/pexels-photo-1779487.jpeg",
-    width: "350px",
-    draggable: false
-  }), /*#__PURE__*/React.createElement(Text, {
-    h4: true,
-    mb: 0,
-    mt: 0
-  }, "Bolio UI"), /*#__PURE__*/React.createElement(Text, {
-    type: "secondary",
-    small: true
-  }, "More creative and fun with amazing features for React."), /*#__PURE__*/React.createElement(Card.Footer, null, /*#__PURE__*/React.createElement(Link, {
-    block: true,
-    target: "_blank",
-    href: "https://github.com/bolio-ui/bolio-ui"
-  }, "Visit source code on GitHub.")))));
-};
-export var WithDivider = function WithDivider() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Card, {
-    width: "400px"
-  }, /*#__PURE__*/React.createElement(Card.Content, null, /*#__PURE__*/React.createElement(Text, {
-    b: true,
-    my: 0
-  }, "A Simple Component")), /*#__PURE__*/React.createElement(Divider, {
-    h: "1px",
-    my: 0
-  }), /*#__PURE__*/React.createElement(Card.Content, null, /*#__PURE__*/React.createElement(Text, null, "React components implement a ", /*#__PURE__*/React.createElement(Code, null, "render()"), " method that takes input data and returns what to display. This example uses an XML-like syntax called JSX. Input data that is passed into the component can be accessed by ", /*#__PURE__*/React.createElement(Code, null, "render()"), " via", ' ', /*#__PURE__*/React.createElement(Code, null, "this.props"), ".")))));
-};

package/esm/Checkbox/stories.js

@@ -1,84 +0,0 @@
-import Checkbox from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Data Entry/Checkbox',
-  component: Checkbox
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true
-  }, "Check option")));
-};
-export var Scale = function Scale() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    mr: "15px",
-    checked: true,
-    scale: 0.25
-  }, "scale-0.25")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    mr: "15px",
-    checked: true,
-    scale: 0.5
-  }, "scale-0.5")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    mr: "15px",
-    checked: true,
-    scale: 0.75
-  }, "scale-0.75")));
-};
-export var Type = function Type() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true,
-    type: "default"
-  }, "Checkbox Default")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true,
-    type: "primary"
-  }, "Checkbox Primary")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true,
-    type: "secondary"
-  }, "Checkbox Secondary")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true,
-    type: "success"
-  }, "Checkbox Success")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true,
-    type: "warning"
-  }, "Checkbox Warning")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true,
-    type: "error"
-  }, "Checkbox Error")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: true,
-    type: "info"
-  }, "Checkbox Info")));
-};
-export var Disabled = function Disabled() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, null, "Checkbox option")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox, {
-    disabled: true,
-    checked: true
-  }, "Checkbox option disabled")));
-};
-export var Group = function Group() {
-  var handler = function handler(value) {
-    console.log(value);
-  };
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Checkbox.Group, {
-    value: ['check3'],
-    onChange: handler
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    value: "check1"
-  }, "Checkbox option 1"), /*#__PURE__*/React.createElement(Checkbox, {
-    value: "check2"
-  }, "Checkbox option 2"), /*#__PURE__*/React.createElement(Checkbox, {
-    value: "check3"
-  }, "Checkbox option 3"), /*#__PURE__*/React.createElement(Checkbox, {
-    value: "check4"
-  }, "Checkbox option 4"))));
-};

package/esm/Code/stories.js

@@ -1,53 +0,0 @@
-import Code from '.';
-import Text from '../Text';
-import Grid from '../Grid';
-import WaitTime from '../MdxWidgets/ParsedCodes/WaitTime';
-export default {
-  title: 'General/Code',
-  component: Code
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, {
-    my: 0
-  }, "Run ", /*#__PURE__*/React.createElement(Code, null, "npm i @bolio-ui/core"), " to install."), /*#__PURE__*/React.createElement(Text, {
-    my: 0
-  }, "Or run ", /*#__PURE__*/React.createElement(Code, null, "yarn add @bolio-ui/core"), " to install.")));
-};
-export var Block = function Block() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Code, {
-    block: true,
-    my: 0
-  }, /*#__PURE__*/React.createElement(WaitTime, null))));
-};
-export var Width = function Width() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Code, {
-    block: true,
-    width: "50%",
-    my: 0
-  }, /*#__PURE__*/React.createElement(WaitTime, null))));
-};
-export var Name = function Name() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Code, {
-    block: true,
-    name: "/Components/WaitTime.jsx",
-    my: 0
-  }, /*#__PURE__*/React.createElement(WaitTime, null))));
-};
-export var Classic = function Classic() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Code, {
-    block: true,
-    classic: true,
-    name: "/Components/WaitTime.jsx",
-    my: 0
-  }, /*#__PURE__*/React.createElement(WaitTime, null))));
-};

package/esm/Collapse/stories.js

@@ -1,48 +0,0 @@
-import Collapse from '.';
-import Text from '../Text';
-import Grid from '../Grid';
-export default {
-  title: 'Surface/Collapse',
-  component: Collapse
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Collapse.Group, null, /*#__PURE__*/React.createElement(Collapse, {
-    title: "Lorem ipsum 1"
-  }, /*#__PURE__*/React.createElement(Text, null, "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")), /*#__PURE__*/React.createElement(Collapse, {
-    title: "Lorem ipsum 2"
-  }, /*#__PURE__*/React.createElement(Text, null, "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")))));
-};
-export var Expanded = function Expanded() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Collapse.Group, null, /*#__PURE__*/React.createElement(Collapse, {
-    title: "Lorem ipsum 1",
-    initialVisible: true
-  }, /*#__PURE__*/React.createElement(Text, null, "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")), /*#__PURE__*/React.createElement(Collapse, {
-    title: "Lorem ipsum 2"
-  }, /*#__PURE__*/React.createElement(Text, null, "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")))));
-};
-export var Subtitle = function Subtitle() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Collapse.Group, null, /*#__PURE__*/React.createElement(Collapse, {
-    title: "Lorem ipsum 1",
-    subtitle: "More description about Lorem ipsum 1"
-  }, /*#__PURE__*/React.createElement(Text, null, "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")), /*#__PURE__*/React.createElement(Collapse, {
-    title: "Lorem ipsum 2",
-    subtitle: /*#__PURE__*/React.createElement(React.Fragment, null, "More description about ", /*#__PURE__*/React.createElement(Text, {
-      b: true
-    }, "Lorem ipsum 2"))
-  }, /*#__PURE__*/React.createElement(Text, null, "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.")))));
-};
-export var Shadow = function Shadow() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Collapse, {
-    shadow: true,
-    title: "Lorem ipsum 1",
-    subtitle: "More description about Lorem ipsum 1"
-  }, /*#__PURE__*/React.createElement(Text, null, "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum"))));
-};

package/esm/Description/stories.js

@@ -1,23 +0,0 @@
-import Description from '.';
-import Code from '../Code';
-import Grid from '../Grid';
-export default {
-  title: 'Data Display/Description',
-  component: Description
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Description, {
-    title: "Section Title",
-    content: "Data about this section."
-  })));
-};
-export var WithComponent = function WithComponent() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Description, {
-    title: "Section Title",
-    content: /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement(Code, null, "code"), " about this section.")
-  })));
-};

package/esm/Divider/stories.js

@@ -1,41 +0,0 @@
-import Divider from '.';
-import Text from '../Text';
-import Grid from '../Grid';
-export default {
-  title: 'Others/Divider',
-  component: Divider
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, "React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes."), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(Text, null, "Declarative views make your code more predictable and easier to debug.")));
-};
-export var WithText = function WithText() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, "React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes."), /*#__PURE__*/React.createElement(Divider, null, "A Simple Component"), /*#__PURE__*/React.createElement(Text, null, "React components implement a render() method that takes input data and returns what to display. This example uses an XML-like syntax called JSX. Input data that is passed into the component can be accessed by render() via this.props."), /*#__PURE__*/React.createElement(Divider, {
-    align: "start"
-  }, "A Stateful Component"), /*#__PURE__*/React.createElement(Text, null, "In addition to taking input data (accessed via this.props), a component can maintain internal state data (accessed via this.state). When a component\u2019s state data changes, the rendered markup will be updated by re-invoking render().")));
-};
-export var Space = function Space() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, "React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes."), /*#__PURE__*/React.createElement(Divider, {
-    h: 5
-  }, "A Simple Component"), /*#__PURE__*/React.createElement(Text, null, "React components implement a render() method that takes input data and returns what to display. This example uses an XML-like syntax called JSX. Input data that is passed into the component can be accessed by render() via this.props."), /*#__PURE__*/React.createElement(Divider, {
-    my: 5,
-    h: 5
-  }, "A Stateful Component"), /*#__PURE__*/React.createElement(Text, null, "In addition to taking input data (accessed via this.props), a component can maintain internal state data (accessed via this.state). When a component\u2019s state data changes, the rendered markup will be updated by re-invoking render().")));
-};
-export var Types = function Types() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, "React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes."), /*#__PURE__*/React.createElement(Divider, {
-    h: 3,
-    type: "success"
-  }, "A Simple Component"), /*#__PURE__*/React.createElement(Text, null, "React components implement a render() method that takes input data and returns what to display. This example uses an XML-like syntax called JSX. Input data that is passed into the component can be accessed by render() via this.props."), /*#__PURE__*/React.createElement(Divider, {
-    h: 3,
-    my: 3,
-    type: "warning"
-  }, "A Stateful Component"), /*#__PURE__*/React.createElement(Text, null, "In addition to taking input data (accessed via this.props), a component can maintain internal state data (accessed via this.state). When a component\u2019s state data changes, the rendered markup will be updated by re-invoking render().")));
-};

package/esm/Dot/stories.js

@@ -1,40 +0,0 @@
-import Dot from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Data Display/Dot',
-  component: Dot
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, null)), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "primary"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "secondary"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "success"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "warning"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "error"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "info"
-  })));
-};
-export var Text = function Text() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, null, "Canceled")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "primary"
-  }, "Primary")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "secondary"
-  }, "Secondary")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "success"
-  }, "Ready")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "warning"
-  }, "Warning")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "error"
-  }, "Error")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Dot, {
-    type: "info"
-  }, "Info")));
-};

package/esm/Drawer/stories.js

@@ -1,79 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState } from 'react';
-import Drawer from '.';
-import Button from '../Button';
-import Grid from '../Grid';
-export default {
-  title: 'Feedback/Drawer',
-  component: Drawer
-};
-export var Default = function Default() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return setState(true);
-    }
-  }, "Show Drawer"), /*#__PURE__*/React.createElement(Drawer, {
-    visible: state,
-    onClose: function onClose() {
-      return setState(false);
-    },
-    placement: "right"
-  }, /*#__PURE__*/React.createElement(Drawer.Title, null, "Drawer"), /*#__PURE__*/React.createElement(Drawer.Subtitle, null, "Example of a drawer"), /*#__PURE__*/React.createElement(Drawer.Content, null, /*#__PURE__*/React.createElement("p", null, "Demo content for the drawer.")))));
-};
-export var Placement = function Placement() {
-  var _React$useState = React.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      state = _React$useState2[0],
-      setState = _React$useState2[1];
-
-  var _React$useState3 = React.useState('bottom'),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      placement = _React$useState4[0],
-      setPlacement = _React$useState4[1];
-
-  var open = function open(text) {
-    setPlacement(text);
-    setState(true);
-  };
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return open('top');
-    },
-    mr: "10px"
-  }, "Top")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return open('right');
-    },
-    mr: "10px"
-  }, "Right")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return open('bottom');
-    },
-    mr: "10px"
-  }, "Bottom")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return open('left');
-    }
-  }, "Left")), /*#__PURE__*/React.createElement(Drawer, {
-    visible: state,
-    onClose: function onClose() {
-      return setState(false);
-    },
-    placement: placement
-  }, /*#__PURE__*/React.createElement(Drawer.Title, null, "Drawer"), /*#__PURE__*/React.createElement(Drawer.Subtitle, null, "Example of a drawer"), /*#__PURE__*/React.createElement(Drawer.Content, null, /*#__PURE__*/React.createElement("p", null, "Demo content for the drawer."))));
-};