@bolio-ui/core 1.1.7 → 1.1.8

package/esm/Input/stories.js

@@ -1,145 +0,0 @@
-import Input from '.';
-import Grid from '../Grid';
-import Text from '../Text';
-import { Instagram, Facebook } from '@bolio-ui/icons';
-export default {
-  title: 'Data Entry/Input',
-  component: Input
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    placeholder: "Placeholder Text"
-  })));
-};
-export var Sizes = function Sizes() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    scale: 1 / 3,
-    placeholder: "Scale 1/3"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    scale: 2 / 3,
-    placeholder: "Scale 2/3"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    placeholder: "Scale 1"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    scale: 4 / 3,
-    placeholder: "Scale 4/3"
-  })));
-};
-export var SetWidth = function SetWidth() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    placeholder: "Placeholder Text",
-    width: "100%"
-  })));
-};
-export var Unwritable = function Unwritable() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    disabled: true,
-    placeholder: "Disabled"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    readOnly: true,
-    initialValue: "Read Only"
-  })));
-};
-export var BlockLabel = function BlockLabel() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    placeholder: "Block Label"
-  }, /*#__PURE__*/React.createElement(Text, {
-    h3: true
-  }, "Block Label"))), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    placeholder: "Block Label"
-  }, "Block Label")));
-};
-export var Type = function Type() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    placeholder: "Default"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "primary",
-    placeholder: "Primary"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "secondary",
-    placeholder: "Secondary"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "success",
-    placeholder: "Success"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "warning",
-    placeholder: "Warning"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "error",
-    placeholder: "Error"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "info",
-    placeholder: "Info"
-  })));
-};
-export var Rounded = function Rounded() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    placeholder: "Default",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "primary",
-    placeholder: "Primary",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "secondary",
-    placeholder: "Secondary",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "success",
-    placeholder: "Success",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "warning",
-    placeholder: "Warning",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "error",
-    placeholder: "Error",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    type: "info",
-    placeholder: "Info",
-    rounded: true
-  })));
-};
-export var Icon = function Icon() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    icon: /*#__PURE__*/React.createElement(Instagram, null),
-    placeholder: "Instagram"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    iconRight: /*#__PURE__*/React.createElement(Facebook, null),
-    placeholder: "Facebook"
-  })));
-};
-export var Clearable = function Clearable() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input, {
-    clearable: true,
-    initialValue: "Initial Value",
-    placeholder: "Initial Value"
-  })));
-};
-export var Password = function Password() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Input.Password, {
-    initialValue: "123456abc"
-  })));
-};

package/esm/Keyboard/stories.js

@@ -1,43 +0,0 @@
-import Keyboard from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Data Display/Keyboard',
-  component: Keyboard
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, null, "C")));
-};
-export var Modifiers = function Modifiers() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, {
-    command: true,
-    mr: "10px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, {
-    shift: true,
-    mr: "10px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, {
-    option: true,
-    mr: "10px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, {
-    ctrl: true,
-    mr: "10px"
-  })));
-};
-export var Combination = function Combination() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, {
-    command: true,
-    mr: "10px"
-  }, "f")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, {
-    shift: true,
-    mr: "10px"
-  }, "e")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Keyboard, {
-    option: true,
-    ctrl: true,
-    mr: "10px"
-  }, "b")));
-};

package/esm/Link/stories.js

@@ -1,59 +0,0 @@
-import Link from '.';
-import Grid from '../Grid';
-import Text from '../Text';
-export default {
-  title: 'Navigation/Link',
-  component: Link
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#"
-  }, "Is a reference to the data you can follow directly by tapping.")));
-};
-export var Highlight = function Highlight() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#",
-    color: true
-  }, "Is a reference to the data you can follow directly by tapping.")));
-};
-export var WithIcon = function WithIcon() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#",
-    icon: true
-  }, "Is a reference to the data you can follow directly by tapping.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#",
-    icon: true,
-    color: true
-  }, "Is a reference to the data you can follow directly by tapping.")));
-};
-export var Variant = function Variant() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#"
-  }, "Is a reference to the data you can follow directly by tapping."))), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#",
-    color: true
-  }, "Is a reference to the data you can follow directly by tapping."))), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#",
-    underline: true
-  }, "Is a reference to the data you can follow directly by tapping."))), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Text, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#",
-    color: true,
-    underline: true
-  }, "Is a reference to the data you can follow directly by tapping."))));
-};
-export var Block = function Block() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Link, {
-    href: "#",
-    block: true
-  }, "Is a reference to the data you can follow directly by tapping.")));
-};

package/esm/Loading/stories.js

@@ -1,75 +0,0 @@
-import Loading from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Feedback/Loading',
-  component: Loading
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Loading, null)));
-};
-export var WithText = function WithText() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Loading, null, "Loading")));
-};
-export var Types = function Types() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 3,
-    md: 3
-  }, /*#__PURE__*/React.createElement(Loading, null)), /*#__PURE__*/React.createElement(Grid, {
-    xs: 3,
-    md: 3
-  }, /*#__PURE__*/React.createElement(Loading, {
-    type: "primary"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 3,
-    md: 3
-  }, /*#__PURE__*/React.createElement(Loading, {
-    type: "secondary"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 3,
-    md: 3
-  }, /*#__PURE__*/React.createElement(Loading, {
-    type: "success"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 3,
-    md: 3
-  }, /*#__PURE__*/React.createElement(Loading, {
-    type: "warning"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 3,
-    md: 3
-  }, /*#__PURE__*/React.createElement(Loading, {
-    type: "error"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 3,
-    md: 3
-  }, /*#__PURE__*/React.createElement(Loading, {
-    type: "info"
-  })));
-};
-export var Spaces = function Spaces() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 6
-  }, /*#__PURE__*/React.createElement(Loading, {
-    spaceRatio: 10
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 6,
-    md: 6
-  }, /*#__PURE__*/React.createElement(Loading, {
-    spaceRatio: 5
-  })));
-};

package/esm/Modal/stories.js

@@ -1,165 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState } from 'react';
-import Modal from '.';
-import Button from '../Button';
-import Grid from '../Grid';
-import useModal from '../use-modal';
-export default {
-  title: 'Feedback/Modal',
-  component: Modal
-};
-export var Default = function Default() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      state = _useState2[0],
-      setState = _useState2[1];
-
-  var handler = function handler() {
-    return setState(true);
-  };
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: handler
-  }, "Show Modal"), /*#__PURE__*/React.createElement(Modal, {
-    visible: state,
-    onClose: function onClose() {
-      return setState(false);
-    }
-  }, /*#__PURE__*/React.createElement(Modal.Title, null, "Modal"), /*#__PURE__*/React.createElement(Modal.Subtitle, null, "Example of a modal"), /*#__PURE__*/React.createElement(Modal.Content, null, /*#__PURE__*/React.createElement("p", null, "Demo content for the modal.")), /*#__PURE__*/React.createElement(Modal.Action, {
-    passive: true,
-    onClick: function onClick() {
-      return setState(false);
-    }
-  }, "Cancel"), /*#__PURE__*/React.createElement(Modal.Action, null, "Accepted"))));
-};
-export var UseModal = function UseModal() {
-  var _useModal = useModal(),
-      setVisible = _useModal.setVisible,
-      bindings = _useModal.bindings;
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return setVisible(true);
-    }
-  }, "Show Modal"), /*#__PURE__*/React.createElement(Modal, bindings, /*#__PURE__*/React.createElement(Modal.Title, null, "Modal"), /*#__PURE__*/React.createElement(Modal.Subtitle, null, "Example of a modal"), /*#__PURE__*/React.createElement(Modal.Content, null, /*#__PURE__*/React.createElement("p", null, "Demo content for the modal.")), /*#__PURE__*/React.createElement(Modal.Action, {
-    passive: true,
-    onClick: function onClick() {
-      return setVisible(false);
-    }
-  }, "Cancel"), /*#__PURE__*/React.createElement(Modal.Action, null, "Accepted"))));
-};
-export var WithoutActions = function WithoutActions() {
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      state = _useState4[0],
-      setState = _useState4[1];
-
-  var handler = function handler() {
-    return setState(true);
-  };
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: handler
-  }, "Show Modal"), /*#__PURE__*/React.createElement(Modal, {
-    visible: state,
-    onClose: function onClose() {
-      return setState(false);
-    }
-  }, /*#__PURE__*/React.createElement(Modal.Title, null, "Modal"), /*#__PURE__*/React.createElement(Modal.Subtitle, null, "Example of a modal"), /*#__PURE__*/React.createElement(Modal.Content, null, /*#__PURE__*/React.createElement("p", null, "Demo content for the modal.")))));
-};
-export var DisabledAction = function DisabledAction() {
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      state = _useState6[0],
-      setState = _useState6[1];
-
-  var handler = function handler() {
-    return setState(true);
-  };
-
-  var closeHandler = function closeHandler() {
-    setState(false);
-    console.log('closed');
-  };
-
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: handler
-  }, "Show Modal"), /*#__PURE__*/React.createElement(Modal, {
-    visible: state,
-    onClose: closeHandler
-  }, /*#__PURE__*/React.createElement(Modal.Title, null, "Modal"), /*#__PURE__*/React.createElement(Modal.Subtitle, null, "Example of a modal"), /*#__PURE__*/React.createElement(Modal.Content, null, /*#__PURE__*/React.createElement("p", null, "Demo content for the modal.")), /*#__PURE__*/React.createElement(Modal.Action, {
-    passive: true,
-    onClick: function onClick() {
-      return setState(false);
-    }
-  }, "Cancel"), /*#__PURE__*/React.createElement(Modal.Action, {
-    disabled: true
-  }, "Submit")));
-};
-export var Customized = function Customized() {
-  var _useModal2 = useModal(),
-      setVisible = _useModal2.setVisible,
-      bindings = _useModal2.bindings;
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return setVisible(true);
-    }
-  }, "Show Modal"), /*#__PURE__*/React.createElement(Modal, _extends({
-    width: "35rem"
-  }, bindings), /*#__PURE__*/React.createElement(Modal.Title, null, "My Favorites"), /*#__PURE__*/React.createElement(Modal.Content, null, /*#__PURE__*/React.createElement("p", null, "This is the width I want.")))));
-};
-export var Loading = function Loading() {
-  var _useModal3 = useModal(),
-      setVisible = _useModal3.setVisible,
-      bindings = _useModal3.bindings;
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return setVisible(true);
-    }
-  }, "Show Modal"), /*#__PURE__*/React.createElement(Modal, bindings, /*#__PURE__*/React.createElement(Modal.Title, null, "Modal"), /*#__PURE__*/React.createElement(Modal.Subtitle, null, "Example of a modal"), /*#__PURE__*/React.createElement(Modal.Content, null, /*#__PURE__*/React.createElement("p", null, "Demo content for the modal.")), /*#__PURE__*/React.createElement(Modal.Action, {
-    passive: true,
-    onClick: function onClick() {
-      return setVisible(false);
-    }
-  }, "Cancel"), /*#__PURE__*/React.createElement(Modal.Action, {
-    loading: true
-  }, "Accepted"))));
-};
-export var Overlong = function Overlong() {
-  var _useModal4 = useModal(),
-      setVisible = _useModal4.setVisible,
-      bindings = _useModal4.bindings;
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    auto: true,
-    onClick: function onClick() {
-      return setVisible(true);
-    }
-  }, "Show Modal"), /*#__PURE__*/React.createElement(Modal, bindings, /*#__PURE__*/React.createElement(Modal.Title, null, "Modal"), /*#__PURE__*/React.createElement(Modal.Subtitle, null, "Modal with a very large content"), /*#__PURE__*/React.createElement(Modal.Content, null, /*#__PURE__*/React.createElement("p", null, "React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started."), /*#__PURE__*/React.createElement("p", null, "React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started."), /*#__PURE__*/React.createElement("p", null, "React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started."), /*#__PURE__*/React.createElement("p", null, "React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started."), /*#__PURE__*/React.createElement("p", null, "React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started."), /*#__PURE__*/React.createElement("p", null, "React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started."), /*#__PURE__*/React.createElement("p", null, "React has been designed from the start for gradual adoption, and you can use as little or as much React as you need. Whether you want to get a taste of React, add some interactivity to a simple HTML page, or start a complex React-powered app, the links in this section will help you get started.")), /*#__PURE__*/React.createElement(Modal.Action, {
-    passive: true,
-    onClick: function onClick() {
-      return setVisible(false);
-    }
-  }, "Cancel"), /*#__PURE__*/React.createElement(Modal.Action, null, "Accepted"))));
-};

package/esm/Note/stories.js

@@ -1,68 +0,0 @@
-import Note from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Feedback/Note',
-  component: Note
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, null, "Check payment pending.")));
-};
-export var Types = function Types() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, null, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "primary"
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "secondary"
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "success"
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "warning"
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "error"
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "info"
-  }, "Check payment pending.")));
-};
-export var HiddenLabel = function HiddenLabel() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    label: false
-  }, "Demo note!")));
-};
-export var CustomLabel = function CustomLabel() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    label: "custom"
-  }, "Customize a note.")));
-};
-export var FilledVariant = function FilledVariant() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    label: "custom",
-    filled: true
-  }, "Customize a note.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    label: false,
-    filled: true
-  }, "Demo note!")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "success",
-    label: "success",
-    filled: true
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "warning",
-    label: "warning",
-    filled: true
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "error",
-    label: "error",
-    filled: true
-  }, "Check payment pending.")), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Note, {
-    type: "secondary",
-    filled: true
-  }, "Check payment pending.")));
-};

package/esm/Page/stories.js

@@ -1,54 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState } from 'react';
-import Page from '.';
-import Button from '../Button';
-import Grid from '../Grid';
-import MockPage from '../MdxWidgets/MockPage';
-export default {
-  title: 'Layout/Page',
-  component: Page
-};
-export var Default = function Default() {
-  var Child = function Child() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h2", null, "Hi my dear!"), /*#__PURE__*/React.createElement("p", null, "This is an example to show the body of a page."));
-  };
-
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      visible = _useState2[0],
-      setVisible = _useState2[1];
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    onClick: function onClick() {
-      return setVisible(true);
-    },
-    auto: true
-  }, "View Page"), /*#__PURE__*/React.createElement(MockPage, {
-    visible: visible,
-    onClose: function onClose() {
-      return setVisible(false);
-    }
-  }, /*#__PURE__*/React.createElement(Page, null, /*#__PURE__*/React.createElement(Child, null)))));
-};
-export var Content = function Content() {
-  var _React$useState = React.useState(false),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      visible = _React$useState2[0],
-      setVisible = _React$useState2[1];
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Button, {
-    onClick: function onClick() {
-      return setVisible(true);
-    },
-    auto: true
-  }, "Header, Body and Footer"), /*#__PURE__*/React.createElement(MockPage, {
-    visible: visible,
-    onClose: function onClose() {
-      return setVisible(false);
-    }
-  }, /*#__PURE__*/React.createElement(Page, null, /*#__PURE__*/React.createElement(Page.Header, null, /*#__PURE__*/React.createElement("h2", null, "Header")), /*#__PURE__*/React.createElement(Page.Content, null, /*#__PURE__*/React.createElement("h2", null, "Hi my dear!"), /*#__PURE__*/React.createElement("p", null, "This is an example to show the body of a page.")), /*#__PURE__*/React.createElement(Page.Footer, null, /*#__PURE__*/React.createElement("h2", null, "Footer"))))));
-};

package/esm/Pagination/stories.js

@@ -1,49 +0,0 @@
-import Pagination from '.';
-import Grid from '../Grid';
-import { ChevronRight, ChevronLeft, ArrowRight, ArrowLeft, ArrowRightCircle, ArrowLeftCircle } from '@bolio-ui/icons';
-export default {
-  title: 'Navigation/Pagination',
-  component: Pagination
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 20,
-    initialPage: 3
-  })));
-};
-export var Limit = function Limit() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2,
-    direction: "column"
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 10,
-    limit: 10
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 5
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 10,
-    initialPage: 6,
-    limit: 5
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 10,
-    initialPage: 6
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 30,
-    initialPage: 6,
-    limit: 10
-  })));
-};
-export var Icon = function Icon() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2,
-    direction: "column"
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 5
-  }, /*#__PURE__*/React.createElement(Pagination.Next, null, /*#__PURE__*/React.createElement(ChevronRight, null)), /*#__PURE__*/React.createElement(Pagination.Previous, null, /*#__PURE__*/React.createElement(ChevronLeft, null)))), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 5
-  }, /*#__PURE__*/React.createElement(Pagination.Next, null, /*#__PURE__*/React.createElement(ArrowRight, null)), /*#__PURE__*/React.createElement(Pagination.Previous, null, /*#__PURE__*/React.createElement(ArrowLeft, null)))), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Pagination, {
-    count: 5
-  }, /*#__PURE__*/React.createElement(Pagination.Next, null, /*#__PURE__*/React.createElement(ArrowRightCircle, null)), /*#__PURE__*/React.createElement(Pagination.Previous, null, /*#__PURE__*/React.createElement(ArrowLeftCircle, null)))));
-};