@bolio-ui/core 1.1.7 → 1.1.8

package/esm/Slider/stories.js

@@ -1,134 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState } from 'react';
-import Slider from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Data Entry/Slider',
-  component: Slider
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    initialValue: 40
-  })));
-};
-export var Type = function Type() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    initialValue: 40
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    type: "primary",
-    initialValue: 20
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    type: "secondary",
-    initialValue: 70
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    type: "success",
-    initialValue: 60
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    type: "warning",
-    initialValue: 10
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    type: "error",
-    initialValue: 80
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    type: "info",
-    initialValue: 90
-  })));
-};
-export var Disabled = function Disabled() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    initialValue: 50,
-    disabled: true
-  })));
-};
-export var Markers = function Markers() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    step: 10,
-    showMarkers: true,
-    width: "75%"
-  })));
-};
-export var Range = function Range() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    step: 5,
-    max: 50,
-    min: 10,
-    initialValue: 25,
-    showMarkers: true,
-    width: "75%"
-  })), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    step: 0.2,
-    max: 1,
-    min: 0.2,
-    initialValue: 0.4,
-    showMarkers: true,
-    width: "75%"
-  })));
-};
-export var Event = function Event() {
-  var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  var handler = function handler(val) {
-    console.log(val);
-    setValue(val);
-  };
-
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    md: 12
-  }, /*#__PURE__*/React.createElement(Slider, {
-    value: value,
-    onChange: handler,
-    width: "50%"
-  })));
-};

package/esm/Snippet/stories.js

@@ -1,177 +0,0 @@
-import Snippet from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Others/Snippet',
-  component: Snippet
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    width: "300px"
-  })));
-};
-export var Width = function Width() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    width: "100%"
-  })));
-};
-export var Types = function Types() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "primary",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "secondary",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "success",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "warning",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "error",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "secondary",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "lite",
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "dark",
-    width: "300px"
-  })));
-};
-export var Rounded = function Rounded() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    width: "300px",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "primary",
-    width: "300px",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "secondary",
-    width: "300px",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "success",
-    width: "300px",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "warning",
-    width: "300px",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "error",
-    width: "300px",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "lite",
-    width: "300px",
-    rounded: true
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "dark",
-    width: "300px",
-    rounded: true
-  })));
-};
-export var Multiline = function Multiline() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: ['cd project', 'now'],
-    width: "300px"
-  })));
-};
-export var DisabledCopy = function DisabledCopy() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    copy: "prevent",
-    text: "yarn add @bolio-ui/core",
-    width: "300px"
-  })));
-};
-export var CustomSymbol = function CustomSymbol() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    symbol: ">",
-    text: "yarn add @bolio-ui/core",
-    width: "300px"
-  })));
-};
-export var CustomToast = function CustomToast() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    toastText: "Code copied!",
-    toastType: "secondary",
-    text: "yarn add @bolio-ui/core",
-    width: "300px"
-  })));
-};
-export var Filled = function Filled() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "primary",
-    filled: true,
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "secondary",
-    filled: true,
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "success",
-    filled: true,
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "warning",
-    filled: true,
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "error",
-    filled: true,
-    width: "300px"
-  })), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Snippet, {
-    text: "yarn add @bolio-ui/core",
-    type: "info",
-    filled: true,
-    width: "300px"
-  })));
-};

package/esm/Spacer/stories.js

@@ -1,54 +0,0 @@
-import Spacer from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Layout/Spacer',
-  component: Spacer
-};
-export var Vertical = function Vertical() {
-  return /*#__PURE__*/React.createElement(Grid.Container, null, /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    style: {
-      background: '#444',
-      borderRadius: '15px'
-    }
-  }, /*#__PURE__*/React.createElement(Spacer, {
-    h: 2
-  })), /*#__PURE__*/React.createElement(Spacer, {
-    h: 2
-  }), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    style: {
-      background: '#666',
-      borderRadius: '15px'
-    }
-  }, /*#__PURE__*/React.createElement(Spacer, {
-    h: 3
-  })), /*#__PURE__*/React.createElement(Spacer, {
-    h: 3
-  }), /*#__PURE__*/React.createElement(Grid, {
-    xs: 12,
-    style: {
-      background: '#999',
-      borderRadius: '15px'
-    }
-  }, /*#__PURE__*/React.createElement(Spacer, {
-    h: 4
-  })));
-};
-export var Horizontal = function Horizontal() {
-  return /*#__PURE__*/React.createElement(Grid.Container, null, /*#__PURE__*/React.createElement(Grid, {
-    xs: 4,
-    style: {
-      background: '#444',
-      borderRadius: '15px'
-    }
-  }), /*#__PURE__*/React.createElement(Spacer, {
-    w: 5
-  }), /*#__PURE__*/React.createElement(Grid, {
-    xs: 4,
-    style: {
-      background: '#444',
-      borderRadius: '15px'
-    }
-  }));
-};

package/esm/Spinner/stories.js

@@ -1,13 +0,0 @@
-import Spinner from '.';
-import Grid from '../Grid';
-export default {
-  title: 'Feedback/Spinner',
-  component: Spinner
-};
-export var Default = function Default() {
-  return /*#__PURE__*/React.createElement(Grid.Container, {
-    gap: 2
-  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Spinner, {
-    scale: 2
-  })));
-};

package/esm/Table/stories.js

@@ -1,269 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState } from 'react';
-import Table from '.';
-import Code from '../Code';
-import Text from '../Text';
-import Button from '../Button';
-export default {
-  title: 'Data Display/Table',
-  component: Table
-};
-export var Default = function Default() {
-  var data = [{
-    property: 'type',
-    description: 'Content type',
-    type: 'secondary | warning',
-    "default": '-'
-  }, {
-    property: 'Component',
-    description: 'DOM element to use',
-    type: 'string',
-    "default": '-'
-  }, {
-    property: 'bold',
-    description: 'Bold style',
-    type: 'boolean',
-    "default": 'true'
-  }];
-  return /*#__PURE__*/React.createElement(Table, {
-    data: data
-  }, /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "property",
-    label: "property"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "description",
-    label: "description"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "type",
-    label: "type"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "default",
-    label: "default"
-  }));
-};
-export var Compose = function Compose() {
-  var data = [{
-    property: 'type',
-    description: 'Content type',
-    type: 'secondary | warning',
-    "default": '-'
-  }, {
-    property: 'Component',
-    description: 'DOM element to use',
-    type: /*#__PURE__*/React.createElement(Code, null, "string"),
-    "default": '-'
-  }, {
-    property: /*#__PURE__*/React.createElement(Text, {
-      b: true
-    }, "bold"),
-    description: 'Bold style',
-    type: /*#__PURE__*/React.createElement(Code, null, "boolean"),
-    "default": /*#__PURE__*/React.createElement(Code, null, "true")
-  }];
-  return /*#__PURE__*/React.createElement(Table, {
-    data: data
-  }, /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "property",
-    label: "property"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "description",
-    label: "description"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "type",
-    label: "type"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "default",
-    label: "default"
-  }));
-};
-export var Width = function Width() {
-  var data = [{
-    property: 'type',
-    description: 'Content type',
-    type: 'secondary | warning',
-    "default": '-'
-  }, {
-    property: 'Component',
-    description: 'DOM element to use',
-    type: /*#__PURE__*/React.createElement(Code, null, "string"),
-    "default": '-'
-  }, {
-    property: /*#__PURE__*/React.createElement(Text, {
-      b: true
-    }, "bold"),
-    description: 'Bold style',
-    type: /*#__PURE__*/React.createElement(Code, null, "boolean"),
-    "default": /*#__PURE__*/React.createElement(Code, null, "true")
-  }];
-  return /*#__PURE__*/React.createElement(Table, {
-    data: data
-  }, /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "property",
-    label: "property",
-    width: 50
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "description",
-    label: "description"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "type",
-    label: "type"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "default",
-    label: "default"
-  }));
-};
-export var Actions = function Actions() {
-  var dataSource = [{
-    property: 'type',
-    description: 'Content type',
-    operation: ''
-  }, {
-    property: 'Component',
-    description: 'DOM element to use',
-    operation: ''
-  }, {
-    property: /*#__PURE__*/React.createElement(Text, {
-      b: true
-    }, "bold"),
-    description: 'Bold style',
-    operation: ''
-  }];
-
-  var _useState = useState(dataSource),
-      _useState2 = _slicedToArray(_useState, 2),
-      data = _useState2[0],
-      setData = _useState2[1];
-
-  var renderAction = function renderAction(value, rowData, index) {
-    var removeHandler = function removeHandler() {
-      setData(function (last) {
-        return last.filter(function (_, dataIndex) {
-          return dataIndex !== index;
-        });
-      });
-    };
-
-    return /*#__PURE__*/React.createElement(Button, {
-      type: "error",
-      auto: true,
-      scale: 1 / 3,
-      font: "12px",
-      onClick: removeHandler
-    }, "Remove");
-  };
-
-  return /*#__PURE__*/React.createElement(Table, {
-    data: data,
-    onChange: function onChange(value) {
-      return setData(value);
-    }
-  }, /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "property",
-    label: "property"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "description",
-    label: "description"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "operation",
-    label: "operation",
-    width: 150,
-    render: renderAction
-  }));
-};
-export var UpdateRow = function UpdateRow() {
-  var dataSource = [{
-    property: 'type',
-    description: 'Content type',
-    operation: ''
-  }, {
-    property: 'Component',
-    description: 'DOM element to use',
-    operation: ''
-  }, {
-    property: /*#__PURE__*/React.createElement(Text, {
-      b: true
-    }, "bold"),
-    description: 'Bold style',
-    operation: ''
-  }];
-
-  var _React$useState = React.useState(dataSource),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      data = _React$useState2[0],
-      setData = _React$useState2[1];
-
-  var renderAction = function renderAction(value, rowData, rowIndex) {
-    var updateHandler = function updateHandler() {
-      setData(function (last) {
-        return last.map(function (item, dataIndex) {
-          if (dataIndex !== rowIndex) return item;
-          return _extends({}, item, {
-            property: Math.random().toString(16).slice(-5)
-          });
-        });
-      });
-    };
-
-    return /*#__PURE__*/React.createElement(Button, {
-      type: "secondary",
-      auto: true,
-      scale: 1 / 3,
-      font: "12px",
-      onClick: updateHandler
-    }, "Update");
-  };
-
-  return /*#__PURE__*/React.createElement(Table, {
-    data: data,
-    onChange: function onChange(value) {
-      return setData(value);
-    }
-  }, /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "property",
-    label: "property"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "description",
-    label: "description"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "operation",
-    label: "operation",
-    width: 150,
-    render: renderAction
-  }));
-};
-export var CustomHead = function CustomHead() {
-  var data = [{
-    property: 'type',
-    description: 'Content type',
-    type: 'secondary | warning',
-    "default": '-'
-  }, {
-    property: 'Component',
-    description: 'DOM element to use',
-    type: /*#__PURE__*/React.createElement(Code, null, "string"),
-    "default": '-'
-  }, {
-    property: /*#__PURE__*/React.createElement(Text, {
-      b: true
-    }, "bold"),
-    description: 'Bold style',
-    type: /*#__PURE__*/React.createElement(Code, null, "boolean"),
-    "default": /*#__PURE__*/React.createElement(Code, null, "true")
-  }];
-  return /*#__PURE__*/React.createElement(Table, {
-    data: data
-  }, /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "property",
-    label: "property"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "description",
-    label: "description"
-  }), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "type"
-  }, /*#__PURE__*/React.createElement(Code, null, "type")), /*#__PURE__*/React.createElement(Table.Column, {
-    prop: "default"
-  }, /*#__PURE__*/React.createElement(Text, {
-    b: true
-  }, "default")));
-};