@flodesk/grain 2.11.0 → 2.14.0

package/es/components/arrange.js

@@ -30,8 +30,9 @@ var _excluded = ["children", "gap", "columns", "autoFlow", "justifyItems", "alig
 var _templateObject;
 
 var __jsx = _react.default.createElement;
-var Wrapper = (0, _styled.default)(_box.Box)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: grid;\n  grid-auto-flow: ", ";\n  justify-content: start;\n  align-items: center;\n  gap: ", ";\n  grid-template-columns: ", ";\n  justify-items: ", ";\n  align-items: ", ";\n  justify-content: ", ";\n  align-content: ", ";\n  place-items: ", ";\n  place-content: ", ";\n"])), function (p) {
-  return p.autoFlow;
+
+var Wrapper = _styled.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: grid;\n  ", ";\n  justify-content: start;\n  align-items: center;\n  gap: ", ";\n  grid-template-columns: ", ";\n  justify-items: ", ";\n  align-items: ", ";\n  justify-content: ", ";\n  align-content: ", ";\n  place-items: ", ";\n  place-content: ", ";\n"])), function (p) {
+  return !p.columns && "grid-auto-flow: ".concat(p.autoFlow);
 }, function (p) {
   return (0, _utilities.getSpace)(p.gap);
 }, function (p) {
@@ -57,7 +58,8 @@ var Arrange = function Arrange(_ref) {
       _ref$autoFlow = _ref.autoFlow,
       autoFlow = _ref$autoFlow === void 0 ? 'column' : _ref$autoFlow,
       justifyItems = _ref.justifyItems,
-      alignItems = _ref.alignItems,
+      _ref$alignItems = _ref.alignItems,
+      alignItems = _ref$alignItems === void 0 ? 'center' : _ref$alignItems,
       justifyContent = _ref.justifyContent,
       alignContent = _ref.alignContent,
       placeItems = _ref.placeItems,
@@ -66,7 +68,13 @@ var Arrange = function Arrange(_ref) {
   return __jsx(Wrapper, (0, _extends2.default)({
     gap: gap,
     columns: columns,
-    autoFlow: autoFlow
+    autoFlow: autoFlow,
+    justifyItems: justifyItems,
+    alignItems: alignItems,
+    justifyContent: justifyContent,
+    alignContent: alignContent,
+    placeItems: placeItems,
+    placeContent: placeContent
   }, props), children);
 };
 
@@ -94,6 +102,30 @@ Arrange.__docgenInfo = {
       "required": false,
       "description": ""
     },
+    "alignItems": {
+      "defaultValue": {
+        "value": "'center'",
+        "computed": false
+      },
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "\"start\"",
+          "computed": false
+        }, {
+          "value": "\"end\"",
+          "computed": false
+        }, {
+          "value": "\"center\"",
+          "computed": false
+        }, {
+          "value": "\"stretch\"",
+          "computed": false
+        }]
+      },
+      "required": false,
+      "description": ""
+    },
     "gap": {
       "type": {
         "name": "union",
@@ -159,26 +191,6 @@ Arrange.__docgenInfo = {
       "required": false,
       "description": ""
     },
-    "alignItems": {
-      "type": {
-        "name": "enum",
-        "value": [{
-          "value": "\"start\"",
-          "computed": false
-        }, {
-          "value": "\"end\"",
-          "computed": false
-        }, {
-          "value": "\"center\"",
-          "computed": false
-        }, {
-          "value": "\"stretch\"",
-          "computed": false
-        }]
-      },
-      "required": false,
-      "description": ""
-    },
     "justifyContent": {
       "type": {
         "name": "enum",

package/es/components/button.js

@@ -19,43 +19,47 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _utilities = require("../utilities");
 
+var _components = require("../components");
+
 var _react = _interopRequireDefault(require("react"));
 
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 
 var _react2 = require("@emotion/react");
 
-var _excluded = ["children", "tag", "variant", "isDisabled"];
+var _excluded = ["children", "tag", "variant", "isDisabled", "icon"];
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
 var __jsx = _react.default.createElement;
-var variables = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  --grn-buttonTextBoxPaddingX-m: 20px;\n  --grn-color-buttonBorder: var(--grn-color-fade4);\n  --grn-color-buttonBorder-hover: var(--grn-color-fade6);\n  --grn-color-buttonBorder-active: var(--grn-color-grey8);\n"])));
+var variables = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  --grn-buttonTextBoxPaddingX-m: 16px;\n  --grn-color-buttonBorder: var(--grn-color-fade4);\n  --grn-color-buttonBorder-hover: var(--grn-color-fade6);\n  --grn-color-buttonBorder-active: var(--grn-color-grey8);\n"])));
 var variants = {
   neutral: (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    color: inherit;\n    background-color: transparent;\n    border-color: var(--grn-color-buttonBorder);\n\n    &:hover {\n      border-color: var(--grn-color-buttonBorder-hover);\n    }\n    &:active {\n      border-color: var(--grn-color-buttonBorder-active);\n    }\n  "]))),
   primary: (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n    color: white;\n    background-color: ", ";\n    border-color: transparent;\n\n    &:hover {\n      background-color: ", ";\n    }\n    &:active {\n      color: ", ";\n      background-color: black;\n    }\n  "])), (0, _utilities.getColor)('accent'), (0, _utilities.getColor)('grey7'), (0, _utilities.getColor)('grey2'))
 };
 
-var Wrapper = _styled.default.button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n  appearance: none;\n  border: none;\n  font-family: inherit;\n  font-size: inherit;\n  cursor: pointer;\n  border-width: 1px;\n  border-style: solid;\n  font-weight: ", ";\n  border-radius: ", ";\n  transition: ", ";\n  height: var(--grn-textBoxHeight-m);\n  padding: 0 var(--grn-buttonTextBoxPaddingX-m);\n  background-color: transparent;\n\n  ", ";\n\n  ", ";\n\n  &:hover {\n    transition: ", ";\n  }\n\n  &:active {\n    transition: 0s;\n  }\n"])), variables, (0, _utilities.getWeight)('medium'), (0, _utilities.getRadius)('s'), (0, _utilities.getTransition)('slow'), function (p) {
+var Wrapper = _styled.default.button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n  appearance: none;\n  border: none;\n  font-family: inherit;\n  font-size: inherit;\n  cursor: pointer;\n  border-width: 1px;\n  border-style: solid;\n  font-weight: ", ";\n  border-radius: ", ";\n  // border-radius: 3px;\n  transition: ", ";\n  height: var(--grn-textBoxHeight-m);\n  padding: 0 var(--grn-buttonTextBoxPaddingX-m);\n  background-color: transparent;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n\n  ", ";\n\n  ", ";\n\n  &:hover {\n    transition: ", ";\n  }\n\n  &:active {\n    transition: 0s;\n  }\n"])), variables, (0, _utilities.getWeight)('medium'), (0, _utilities.getRadius)('s'), (0, _utilities.getTransition)('slow'), function (p) {
   return !p.isDisabled && variants[p.variant];
 }, function (p) {
   return p.isDisabled && "\n    color: ".concat((0, _utilities.getColor)('disabledContent'), ";\n    background-color: ").concat((0, _utilities.getColor)('disabledBackground'), ";\n    border-color: transparent;\n    cursor: default;\n  ");
 }, (0, _utilities.getTransition)('fast'));
 
-var ButtonText = _styled.default.span(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  --opticalCompensation: -0.3px;\n\n  position: relative;\n  top: var(--opticalCompensation);\n"])));
-
 var Button = function Button(_ref) {
   var children = _ref.children,
       tag = _ref.tag,
       _ref$variant = _ref.variant,
       variant = _ref$variant === void 0 ? 'neutral' : _ref$variant,
       isDisabled = _ref.isDisabled,
+      icon = _ref.icon,
       props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return __jsx(Wrapper, (0, _extends2.default)({
     as: tag,
     variant: variant,
-    isDisabled: isDisabled
-  }, props), __jsx(ButtonText, null, children));
+    isDisabled: isDisabled,
+    icon: icon
+  }, props), icon && __jsx(_components.Icon, {
+    icon: icon
+  }), children);
 };
 
 exports.Button = Button;

package/es/components/icon.js

@@ -0,0 +1,123 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Icon = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _utilities = require("../utilities");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+var _types = require("../types");
+
+var _excluded = ["icon", "size", "color"];
+
+var _templateObject;
+
+var __jsx = _react.default.createElement;
+
+var Wrapper = _styled.default.span(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: block;\n  width: fit-content;\n  color: ", ";\n  \n  svg {\n    display: block;\n    height: ", ";\n  }\n"])), function (p) {
+  return (0, _utilities.getColor)(p.color);
+}, function (p) {
+  return (0, _utilities.getIconSize)(p.size);
+});
+
+var Icon = function Icon(_ref) {
+  var icon = _ref.icon,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'm' : _ref$size,
+      color = _ref.color,
+      props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return __jsx(Wrapper, (0, _extends2.default)({
+    size: size,
+    color: color
+  }, props), icon && icon);
+};
+
+exports.Icon = Icon;
+Icon.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "Icon",
+  "props": {
+    "size": {
+      "defaultValue": {
+        "value": "'m'",
+        "computed": false
+      },
+      "type": {
+        "name": "union",
+        "value": [{
+          "name": "enum",
+          "value": [{
+            "value": "\"s\"",
+            "computed": false
+          }, {
+            "value": "\"m\"",
+            "computed": false
+          }, {
+            "value": "\"l\"",
+            "computed": false
+          }, {
+            "value": "\"xl\"",
+            "computed": false
+          }, {
+            "value": "\"xxl\"",
+            "computed": false
+          }]
+        }, {
+          "name": "number"
+        }, {
+          "name": "string"
+        }]
+      },
+      "required": false,
+      "description": ""
+    },
+    "icon": {
+      "type": {
+        "name": "node"
+      },
+      "required": false,
+      "description": ""
+    },
+    "color": {
+      "type": {
+        "name": "union",
+        "value": [{
+          "name": "enum",
+          "value": [{
+            "value": "\"greys\"",
+            "computed": false
+          }, {
+            "value": "\"fades\"",
+            "computed": false
+          }, {
+            "value": "\"baseColors\"",
+            "computed": false
+          }, {
+            "value": "\"semanticColors\"",
+            "computed": false
+          }]
+        }, {
+          "name": "string"
+        }]
+      },
+      "required": false,
+      "description": ""
+    }
+  }
+};

package/es/components/index.js

@@ -35,6 +35,12 @@ Object.defineProperty(exports, "Arrange", {
     return _arrange.Arrange;
   }
 });
+Object.defineProperty(exports, "Icon", {
+  enumerable: true,
+  get: function get() {
+    return _icon.Icon;
+  }
+});
 
 var _text = require("./text");
 
@@ -44,4 +50,6 @@ var _button = require("./button");
 
 var _textInput = require("./text-input");
 
-var _arrange = require("./arrange");
+var _arrange = require("./arrange");
+
+var _icon = require("./icon");

package/es/components/text.js

@@ -99,8 +99,6 @@ Text.__docgenInfo = {
             "value": "\"xxl\"",
             "computed": false
           }]
-        }, {
-          "name": "number"
         }, {
           "name": "string"
         }]

package/es/icons/icon-align-center.js

@@ -0,0 +1,62 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var __jsx = React.createElement;
+
+var IconAlignCenter = function IconAlignCenter(props) {
+  return __jsx("svg", (0, _extends2.default)({
+    viewBox: "0 0 20 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), __jsx("rect", {
+    x: 1,
+    y: 7,
+    width: 18,
+    height: 18,
+    rx: 1,
+    stroke: "currentColor",
+    strokeWidth: 2,
+    strokeLinecap: "square"
+  }), __jsx("path", {
+    fill: "currentColor",
+    d: "M9 4h2v24H9z"
+  }));
+};
+
+IconAlignCenter.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "IconAlignCenter"
+};
+var _default = IconAlignCenter;
+exports.default = _default;

package/es/icons/icon-align-left.js

@@ -0,0 +1,62 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var __jsx = React.createElement;
+
+var IconAlignLeft = function IconAlignLeft(props) {
+  return __jsx("svg", (0, _extends2.default)({
+    viewBox: "0 0 24 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), __jsx("rect", {
+    x: 5,
+    y: 7,
+    width: 18,
+    height: 18,
+    rx: 1,
+    stroke: "currentColor",
+    strokeWidth: 2,
+    strokeLinecap: "square"
+  }), __jsx("path", {
+    fill: "currentColor",
+    d: "M0 4h2v24H0z"
+  }));
+};
+
+IconAlignLeft.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "IconAlignLeft"
+};
+var _default = IconAlignLeft;
+exports.default = _default;

package/es/icons/icon-align-right.js

@@ -0,0 +1,62 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var __jsx = React.createElement;
+
+var IconAlignRight = function IconAlignRight(props) {
+  return __jsx("svg", (0, _extends2.default)({
+    viewBox: "0 0 24 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), __jsx("rect", {
+    x: 1,
+    y: 7,
+    width: 18,
+    height: 18,
+    rx: 1,
+    stroke: "currentColor",
+    strokeWidth: 2,
+    strokeLinecap: "square"
+  }), __jsx("path", {
+    fill: "currentColor",
+    d: "M22 4h2v24h-2z"
+  }));
+};
+
+IconAlignRight.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "IconAlignRight"
+};
+var _default = IconAlignRight;
+exports.default = _default;

package/es/icons/icon-arrow-down.js

@@ -0,0 +1,55 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var __jsx = React.createElement;
+
+var IconArrowDown = function IconArrowDown(props) {
+  return __jsx("svg", (0, _extends2.default)({
+    viewBox: "0 0 24 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), __jsx("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M13 24.172V4h-2v20.172l-9.586-9.586L0 16l10.586 10.586L12 28l1.414-1.414L24 16l-1.414-1.414L13 24.172Z",
+    fill: "currentColor"
+  }));
+};
+
+IconArrowDown.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "IconArrowDown"
+};
+var _default = IconArrowDown;
+exports.default = _default;

package/es/icons/icon-arrow-left.js

@@ -0,0 +1,55 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var __jsx = React.createElement;
+
+var IconArrowLeft = function IconArrowLeft(props) {
+  return __jsx("svg", (0, _extends2.default)({
+    viewBox: "0 0 24 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), __jsx("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M1.414 14.586 12 4l1.414 1.414L3.828 15H24v2H3.828l9.586 9.586L12 28 1.414 17.414 0 16l1.414-1.414Z",
+    fill: "currentColor"
+  }));
+};
+
+IconArrowLeft.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "IconArrowLeft"
+};
+var _default = IconArrowLeft;
+exports.default = _default;

package/es/icons/icon-arrow-right.js

@@ -0,0 +1,55 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var __jsx = React.createElement;
+
+var IconArrowRight = function IconArrowRight(props) {
+  return __jsx("svg", (0, _extends2.default)({
+    viewBox: "0 0 24 32",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), __jsx("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M22.586 17.414 12 28l-1.414-1.414L20.172 17H0v-2h20.172l-9.586-9.586L12 4l10.586 10.586L24 16l-1.414 1.414Z",
+    fill: "currentColor"
+  }));
+};
+
+IconArrowRight.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "IconArrowRight"
+};
+var _default = IconArrowRight;
+exports.default = _default;