sag_components 1.0.53 → 1.0.55

package/dist/stories/components/FilterContainer.js

@@ -21,10 +21,10 @@ var FilterContainer = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
     height = _ref$height === void 0 ? 950 : _ref$height,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement(_FilterContainer.FilterDivContainer, {
+    className: props.className,
     width: width,
     height: height
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: props.className,
     ref: nodeRef
   }, props.children), /*#__PURE__*/_react.default.createElement(_FilterContainer.FilterFooterContent, null));
 });

package/dist/stories/components/FilterContainer.style.js

@@ -8,11 +8,7 @@ exports.FilterFooterContent = exports.FilterDivContent = exports.FilterDivContai
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3;
-var FilterDivContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    width: ", ";\n    height: ", ";\n    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.05);\n    border-radius: 12px;\n    display: grid;\n"])), function (props) {
-  return props.width.toString().concat("", "px");
-}, function (props) {
-  return props.height.toString().concat("", "px");
-});
+var FilterDivContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    width: 100%;\n    height:100%;\n    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.05);\n    border-radius: 12px;\n    display: grid;\n"])));
 exports.FilterDivContainer = FilterDivContainer;
 var FilterDivContent = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    width: 100%;\n    padding-top: 40px;\n    height: 90%;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    > div{\n        margin: 25px;\n    }\n"])));
 exports.FilterDivContent = FilterDivContent;

package/dist/stories/components/IconButton.js

@@ -0,0 +1,110 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.IconButton = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _DownloadIcon = require("./icons/DownloadIcon");
+var _BellIcon = require("./icons/BellIcon");
+var _ExitIcon = require("./icons/ExitIcon");
+var _FlyIcon = require("./icons/FlyIcon");
+var _MaintenanceIcon = require("./icons/MaintenanceIcon");
+var _EyeIcon = require("./icons/EyeIcon");
+var _IconButtonStyle = require("./IconButton.style.js");
+var _excluded = ["iconName", "width", "height", "disabled", "onClick"];
+/*IconButton*/
+var IconButton = function IconButton(_ref) {
+  var iconName = _ref.iconName,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? 30 : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? 30 : _ref$height,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    onClick = _ref.onClick,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    mouseDownPressed = _useState2[0],
+    setMouseDownPressed = _useState2[1];
+  var getIcon = function getIcon(iconName, iconHeight, iconWidth) {
+    switch (iconName) {
+      case "download":
+        return /*#__PURE__*/_react.default.createElement(_DownloadIcon.DownloadIcon, {
+          height: iconHeight,
+          width: iconWidth
+        });
+      case "fly":
+        return /*#__PURE__*/_react.default.createElement(_FlyIcon.FlyIcon, {
+          height: iconHeight,
+          width: iconWidth
+        });
+      case "bell":
+        return /*#__PURE__*/_react.default.createElement(_BellIcon.BellIcon, {
+          height: iconHeight,
+          width: iconWidth
+        });
+      case "maintenance":
+        return /*#__PURE__*/_react.default.createElement(_MaintenanceIcon.MaintenanceIcon, {
+          height: iconHeight,
+          width: iconWidth
+        });
+      case "exit":
+        return /*#__PURE__*/_react.default.createElement(_ExitIcon.ExitIcon, {
+          height: iconHeight,
+          width: iconWidth
+        });
+      case "eye":
+        return /*#__PURE__*/_react.default.createElement(_EyeIcon.EyeIcon, {
+          height: iconHeight,
+          width: iconWidth
+        });
+      default:
+        return "";
+    }
+  };
+  var onMouseDownHandler = function onMouseDownHandler() {
+    if (disabled) return;
+    setMouseDownPressed(true);
+  };
+  var onMouseUpHandler = function onMouseUpHandler() {
+    if (disabled) return;
+    setMouseDownPressed(false);
+  };
+  var onPointerOutHandler = function onPointerOutHandler() {
+    if (disabled) return;
+    if (!mouseDownPressed) return;
+    setMouseDownPressed(false);
+  };
+  var getClassNameExtention = function getClassNameExtention() {
+    if (disabled) return "disabled";
+    if (mouseDownPressed) return "mouseDownPressed";
+    return "";
+  };
+  var onClickHandler = function onClickHandler(event) {
+    if (disabled) return;
+    onClick(event);
+  };
+  return /*#__PURE__*/_react.default.createElement(_IconButtonStyle.ControlsContainer, {
+    height: height,
+    width: width
+  }, /*#__PURE__*/_react.default.createElement(_IconButtonStyle.ControlsSubContainer, {
+    className: getClassNameExtention(),
+    height: height,
+    width: width,
+    onMouseDown: onMouseDownHandler,
+    onMouseUp: onMouseUpHandler,
+    onPointerOut: onPointerOutHandler,
+    onClick: function onClick(event) {
+      onClickHandler(event);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_IconButtonStyle.IconButtonContainer, null, getIcon(iconName, height, width))));
+};
+exports.IconButton = IconButton;
+var _default = IconButton;
+exports.default = _default;

package/dist/stories/components/IconButton.style.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.IconButtonContainer = exports.ControlsSubContainer = exports.ControlsContainer = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3;
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  id: \"ControlsContainer\";\n  display: flex;\n  //border: 1px solid green;\n  border-radius: 100px;\n  width: ", ";\n  height: ", ";\n\n"])), function (props) {
+  return props.width.toString().concat("", "px");
+}, function (props) {
+  return props.height.toString().concat("", "px");
+});
+exports.ControlsContainer = ControlsContainer;
+var ControlsSubContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  padding: 2px 0 2px;  \n  border-radius: 100px;\n  //border: 1px solid blue;\n  &:hover {\n    cursor: pointer;\n    background-color: #e7f0ff;\n  }\n  &.disabled {\n    background-color: #ccc;\n  }\n  &.mouseDownPressed {\n    margin: 1px 0 1px;  \n    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);\n  }\n"])));
+exports.ControlsSubContainer = ControlsSubContainer;
+var IconButtonContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  width: 95%;\n  height: 95%;\n  //border: 1px solid red;\n  border-radius: 100px;\n"])));
+exports.IconButtonContainer = IconButtonContainer;

package/dist/stories/components/TitleEventComponent.js

@@ -0,0 +1,101 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.TitleEventComponent = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _CommonFunctions = require("./CommonFunctions");
+var _IconButton = require("./IconButton");
+var _TitleEventComponentStyle = require("./TitleEventComponent.style.js");
+var _excluded = ["mainTitle", "infoButtonText", "infoButtonOnClick", "eventLinkLabel", "eventLinkLabelOnClick", "retailerLinkLabel", "retailerLinkLabelOnClick", "objectivesTitle", "objectivesDescriptionLine1", "objectivesDescriptionLine2", "objectivesShowMoreLabel", "objectivesShowMoreOnClick", "RightPanelLine2Title", "RightPanelLine2Value", "RightPanelLine3Title", "RightPanelLine3Value1", "RightPanelLine3Value2", "downloadButtonOnClick", "flyButtonOnClick", "width", "height", "textColor"];
+/*TitleEventComponent*/
+var TitleEventComponent = function TitleEventComponent(_ref) {
+  var mainTitle = _ref.mainTitle,
+    infoButtonText = _ref.infoButtonText,
+    infoButtonOnClick = _ref.infoButtonOnClick,
+    eventLinkLabel = _ref.eventLinkLabel,
+    eventLinkLabelOnClick = _ref.eventLinkLabelOnClick,
+    retailerLinkLabel = _ref.retailerLinkLabel,
+    retailerLinkLabelOnClick = _ref.retailerLinkLabelOnClick,
+    objectivesTitle = _ref.objectivesTitle,
+    objectivesDescriptionLine1 = _ref.objectivesDescriptionLine1,
+    objectivesDescriptionLine2 = _ref.objectivesDescriptionLine2,
+    objectivesShowMoreLabel = _ref.objectivesShowMoreLabel,
+    objectivesShowMoreOnClick = _ref.objectivesShowMoreOnClick,
+    RightPanelLine2Title = _ref.RightPanelLine2Title,
+    RightPanelLine2Value = _ref.RightPanelLine2Value,
+    RightPanelLine3Title = _ref.RightPanelLine3Title,
+    RightPanelLine3Value1 = _ref.RightPanelLine3Value1,
+    RightPanelLine3Value2 = _ref.RightPanelLine3Value2,
+    downloadButtonOnClick = _ref.downloadButtonOnClick,
+    flyButtonOnClick = _ref.flyButtonOnClick,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? 162 : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? 1405 : _ref$height,
+    _ref$textColor = _ref.textColor,
+    textColor = _ref$textColor === void 0 ? "black" : _ref$textColor,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.MainContainer, {
+    height: height,
+    width: width,
+    textColor: textColor
+  }, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelContainer, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine1Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine1Field1, null, mainTitle, "   "), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine1IconButtonContainer, null, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
+    height: 18,
+    width: 18,
+    iconName: "eye",
+    onClick: function onClick(event) {
+      infoButtonOnClick({
+        eventName: "infoButtonOnClick",
+        event: event
+      });
+    }
+  }), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine1InfoButtonText, null, " ", infoButtonText, " "))), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine2Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine2Field1, {
+    onClick: function onClick(event) {
+      eventLinkLabelOnClick({
+        eventName: "eventLinkLabelOnClick",
+        event: event
+      });
+    }
+  }, eventLinkLabel), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.FieldsDelimiter, null, " | "), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine2Field3, {
+    onClick: function onClick(event) {
+      retailerLinkLabelOnClick({
+        eventName: "retailerLinkLabelOnClick",
+        event: event
+      });
+    }
+  }, retailerLinkLabel)), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine3Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine3SubLine1Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine3SubLine1Field1, null, objectivesTitle, "  "), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine3SubLine1Field2, null, objectivesDescriptionLine1)), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine3SubLine2Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine3SubLine2Field1, null, objectivesDescriptionLine2, " ", "   "), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.LeftPanelLine3SubLine2Field2, {
+    onClick: function onClick(event) {
+      objectivesShowMoreOnClick({
+        eventName: "objectivesShowMoreOnClick",
+        event: event
+      });
+    }
+  }, objectivesShowMoreLabel)))), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelContainer, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine1Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine1DownloadIconButtonContainer, null, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
+    height: 20,
+    width: 20,
+    iconName: "download",
+    onClick: function onClick(event) {
+      downloadButtonOnClick({
+        eventName: "downloadButtonOnClick",
+        event: event
+      });
+    }
+  })), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine1FlyIconButtonContainer, null, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
+    height: 20,
+    width: 20,
+    iconName: "fly",
+    onClick: function onClick(event) {
+      flyButtonOnClick({
+        eventName: "flyButtonOnClick",
+        event: event
+      });
+    }
+  }))), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine2Container, null), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3SubLine1Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3SubLine1Field1, null, RightPanelLine2Title, "  "), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3SubLine1Field2, null, RightPanelLine2Value)), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3SubLine2Container, null, /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3SubLine2Field1, null, RightPanelLine3Title, " ", "   "), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3SubLine2Field2, null, RightPanelLine3Value1), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.FieldsDelimiter, null, " | "), /*#__PURE__*/_react.default.createElement(_TitleEventComponentStyle.RightPanelLine3SubLine2Field3, null, RightPanelLine3Value2)))));
+};
+exports.TitleEventComponent = TitleEventComponent;
+var _default = TitleEventComponent;
+exports.default = _default;

package/dist/stories/components/TitleEventComponent.style.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RightPanelLine3SubLine2Field3 = exports.RightPanelLine3SubLine2Field2 = exports.RightPanelLine3SubLine2Field1 = exports.RightPanelLine3SubLine2Container = exports.RightPanelLine3SubLine1Field2 = exports.RightPanelLine3SubLine1Field1 = exports.RightPanelLine3SubLine1Container = exports.RightPanelLine3Container = exports.RightPanelLine2Container = exports.RightPanelLine1FlyIconButtonContainer = exports.RightPanelLine1DownloadIconButtonContainer = exports.RightPanelLine1Container = exports.RightPanelContainer = exports.MainContainer = exports.LeftPanelLine3SubLine2Field2 = exports.LeftPanelLine3SubLine2Field1 = exports.LeftPanelLine3SubLine2Container = exports.LeftPanelLine3SubLine1Field2 = exports.LeftPanelLine3SubLine1Field1 = exports.LeftPanelLine3SubLine1Container = exports.LeftPanelLine3Container = exports.LeftPanelLine2Field3 = exports.LeftPanelLine2Field1 = exports.LeftPanelLine2Container = exports.LeftPanelLine1InfoButtonText = exports.LeftPanelLine1IconButtonContainer = exports.LeftPanelLine1Field1 = exports.LeftPanelLine1Container = exports.LeftPanelContainer = exports.FieldsDelimiter = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30;
+var MainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  color: ", ";\n  width: ", ";\n  height: ", ";\n//   min-width: 1200px;\n//   min-height: 80px;\n  border-radius: 12px;\n  //border: 1px solid brown;\n"])), function (props) {
+  return props.textColor ? props.textColor : "#000";
+}, function (props) {
+  return props.width.toString().concat("", "px");
+}, function (props) {
+  return props.height.toString().concat("", "px");
+});
+exports.MainContainer = MainContainer;
+var LeftPanelContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n\n  border-radius: 12px;\n  width: 50%;\n  height: 100%;\n  background: #ffffff;\n  //border: 1px solid red;\n"])));
+exports.LeftPanelContainer = LeftPanelContainer;
+var LeftPanelLine1Container = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 30%;\n  //border: 1px solid brown;\n"])));
+exports.LeftPanelLine1Container = LeftPanelLine1Container;
+var LeftPanelLine1Field1 = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  white-space: pre-wrap;\n  font-weight: 700;\n  font-size: 18px;\n"])));
+exports.LeftPanelLine1Field1 = LeftPanelLine1Field1;
+var LeftPanelLine1IconButtonContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center\n  //width: 130px;\n  height: 40px; \n  font-weight: 500;  \n  border: 1px solid red;\n  border-radius: 12px;\n  border-color: #ccc;\n"])));
+exports.LeftPanelLine1IconButtonContainer = LeftPanelLine1IconButtonContainer;
+var LeftPanelLine1InfoButtonText = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  margin-left: 10px;\n  margin-right: 10px;\n"])));
+exports.LeftPanelLine1InfoButtonText = LeftPanelLine1InfoButtonText;
+var LeftPanelLine2Container = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 30%;\n  //border: 1px solid blue;\n"])));
+exports.LeftPanelLine2Container = LeftPanelLine2Container;
+var LeftPanelLine2Field1 = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  color: blue;\n  &:hover {\n    cursor: pointer;\n  }\n"])));
+exports.LeftPanelLine2Field1 = LeftPanelLine2Field1;
+var FieldsDelimiter = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  white-space: pre-wrap;\n  color: #ccc;\n"])));
+exports.FieldsDelimiter = FieldsDelimiter;
+var LeftPanelLine2Field3 = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  color: blue;\n  &:hover {\n    cursor: pointer;\n  }\n"])));
+exports.LeftPanelLine2Field3 = LeftPanelLine2Field3;
+var LeftPanelLine3Container = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  width: 100%;\n  height: 40%;\n  //border: 1px solid red;\n"])));
+exports.LeftPanelLine3Container = LeftPanelLine3Container;
+var LeftPanelLine3SubLine1Field1 = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 700;\n  font-size: 14px;\n  line-height: 20px;\n  white-space: pre-wrap;\n"])));
+exports.LeftPanelLine3SubLine1Field1 = LeftPanelLine3SubLine1Field1;
+var LeftPanelLine3SubLine1Container = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
+exports.LeftPanelLine3SubLine1Container = LeftPanelLine3SubLine1Container;
+var LeftPanelLine3SubLine1Field2 = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n"])));
+exports.LeftPanelLine3SubLine1Field2 = LeftPanelLine3SubLine1Field2;
+var LeftPanelLine3SubLine2Container = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
+exports.LeftPanelLine3SubLine2Container = LeftPanelLine3SubLine2Container;
+var LeftPanelLine3SubLine2Field1 = _styledComponents.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  white-space: pre-wrap;\n"])));
+exports.LeftPanelLine3SubLine2Field1 = LeftPanelLine3SubLine2Field1;
+var LeftPanelLine3SubLine2Field2 = _styledComponents.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  color: blue;\n  &:hover {\n    cursor: pointer;\n  }\n"])));
+exports.LeftPanelLine3SubLine2Field2 = LeftPanelLine3SubLine2Field2;
+var RightPanelContainer = _styledComponents.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  border-radius: 12px;\n  width: 50%;\n  height: 100%;\n  background: #ffffff;\n  //border: 1px solid red;\n"])));
+exports.RightPanelContainer = RightPanelContainer;
+var RightPanelLine1Container = _styledComponents.default.div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  width: 100%;\n  height: 30%;\n  //border: 1px solid brown;\n"])));
+exports.RightPanelLine1Container = RightPanelLine1Container;
+var RightPanelLine1DownloadIconButtonContainer = _styledComponents.default.div(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: 5px;\n  margin-right: 5px;\n"])));
+exports.RightPanelLine1DownloadIconButtonContainer = RightPanelLine1DownloadIconButtonContainer;
+var RightPanelLine1FlyIconButtonContainer = _styledComponents.default.div(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2.default)(["\n  margin-left: 5px;\n  margin-right: 5px;\n"])));
+exports.RightPanelLine1FlyIconButtonContainer = RightPanelLine1FlyIconButtonContainer;
+var RightPanelLine2Container = _styledComponents.default.div(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 30%;  \n  //border: 1px solid blue;\n"])));
+exports.RightPanelLine2Container = RightPanelLine2Container;
+var RightPanelLine3Container = _styledComponents.default.div(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n\n  width: 100%;\n  height: 40%;\n  //border: 1px solid red;\n"])));
+exports.RightPanelLine3Container = RightPanelLine3Container;
+var RightPanelLine3SubLine1Container = _styledComponents.default.div(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
+exports.RightPanelLine3SubLine1Container = RightPanelLine3SubLine1Container;
+var RightPanelLine3SubLine1Field1 = _styledComponents.default.div(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 700;\n  font-size: 14px;\n  line-height: 20px;\n  white-space: pre-wrap;\n  margin-left: 10px;\n"])));
+exports.RightPanelLine3SubLine1Field1 = RightPanelLine3SubLine1Field1;
+var RightPanelLine3SubLine1Field2 = _styledComponents.default.div(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px; \n"])));
+exports.RightPanelLine3SubLine1Field2 = RightPanelLine3SubLine1Field2;
+var RightPanelLine3SubLine2Container = _styledComponents.default.div(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n"])));
+exports.RightPanelLine3SubLine2Container = RightPanelLine3SubLine2Container;
+var RightPanelLine3SubLine2Field1 = _styledComponents.default.div(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 700;\n  font-size: 14px;\n  line-height: 20px;\n  white-space: pre-wrap;\n  margin-left: 10px;\n"])));
+exports.RightPanelLine3SubLine2Field1 = RightPanelLine3SubLine2Field1;
+var RightPanelLine3SubLine2Field2 = _styledComponents.default.div(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n"])));
+exports.RightPanelLine3SubLine2Field2 = RightPanelLine3SubLine2Field2;
+var RightPanelLine3SubLine2Field3 = _styledComponents.default.div(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n"])));
+exports.RightPanelLine3SubLine2Field3 = RightPanelLine3SubLine2Field3;

package/dist/stories/components/TotalBenchmark.style.js

@@ -22,11 +22,11 @@ var Controls = _styledComponents.default.div(_templateObject2 || (_templateObjec
 exports.Controls = Controls;
 var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  width: 200px;\n"])));
 exports.TitleAndValueContainer = TitleAndValueContainer;
-var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 22px;\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 22px;\n"])));
+var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  min-width: 170px;\n  height: 22px;\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 22px;\n"])));
 exports.Title = Title;
 var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  height: 48px;\n  font-weight: 500;\n  font-size: 40px;\n  line-height: 48px;\n  //border: 1px solid red;\n"])));
 exports.FormattedValue = FormattedValue;
-var BenchmarkContainerParent = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  width: 100px;\n  height: 100%;\n"])));
+var BenchmarkContainerParent = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  width: 100px;\n  height: 100%;\n  margin-top: 35px;\n"])));
 exports.BenchmarkContainerParent = BenchmarkContainerParent;
 var BenchmarkContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100px;\n  height: 12px;\n"])));
 exports.BenchmarkContainer = BenchmarkContainer;

package/dist/stories/components/TotalBenchmarkAreachart.js

@@ -8,8 +8,8 @@ exports.default = exports.TotalBenchmarkAreachart = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
-var _ArrowUpIcon = require("./ArrowUpIcon");
-var _ArrowDownIcon = require("./ArrowDownIcon");
+var _ArrowUpIcon = require("./icons/ArrowUpIcon");
+var _ArrowDownIcon = require("./icons/ArrowDownIcon");
 var _recharts = require("recharts");
 var _Benchmark = require("./Benchmark");
 var _TotalBenchmarkAreachartStyle = require("./TotalBenchmarkAreachart.style.js");

package/dist/stories/components/TotalBenchmarkArrows.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.TotalBenchmarkArrows = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
-var _ArrowUpIcon = require("./ArrowUpIcon");
-var _ArrowDownIcon = require("./ArrowDownIcon");
+var _ArrowUpIcon = require("./icons/ArrowUpIcon");
+var _ArrowDownIcon = require("./icons/ArrowDownIcon");
 var _CommonFunctions = require("./CommonFunctions");
 var _Benchmark = require("./Benchmark");
 var _TotalBenchmarkArrowsStyle = require("./TotalBenchmarkArrows.style.js");

package/dist/stories/components/icons/ArrowDownIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ArrowDownIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var ArrowDownIcon = function ArrowDownIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 8 9",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M3.52935 8.81165C3.78967 9.06278 4.21242 9.06278 4.47273 8.81165L7.80476 5.59719C8.06508 5.34606 8.06508 4.93822 7.80476 4.68709C7.54445 4.43596 7.1217 4.43596 6.86138 4.68709L4.66641 6.80663L4.66641 0.642893C4.66641 0.287292 4.36861 -4.08657e-07 4 -4.40881e-07C3.63139 -4.73106e-07 3.33359 0.287292 3.33359 0.642893L3.33359 6.80663L1.13862 4.6891C0.878303 4.43797 0.455551 4.43797 0.195236 4.6891C-0.0650787 4.94023 -0.0650787 5.34807 0.195236 5.5992L3.52727 8.81366L3.52935 8.81165Z",
+    fill: "#F00021"
+  }));
+};
+exports.ArrowDownIcon = ArrowDownIcon;
+var _default = ArrowDownIcon;
+exports.default = _default;

package/dist/stories/components/icons/ArrowUpIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ArrowUpIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var ArrowUpIcon = function ArrowUpIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 8 9",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M4.47065 0.188348C4.21033 -0.0627825 3.78758 -0.0627825 3.52727 0.188348L0.195236 3.40281C-0.0650787 3.65394 -0.0650787 4.06178 0.195236 4.31291C0.455551 4.56404 0.878303 4.56404 1.13862 4.31291L3.33359 2.19337V8.35711C3.33359 8.71271 3.63139 9 4 9C4.36861 9 4.66641 8.71271 4.66641 8.35711V2.19337L6.86138 4.3109C7.1217 4.56203 7.54445 4.56203 7.80476 4.3109C8.06508 4.05977 8.06508 3.65193 7.80476 3.4008L4.47273 0.186338L4.47065 0.188348Z",
+    fill: "#5FCC70"
+  }));
+};
+exports.ArrowUpIcon = ArrowUpIcon;
+var _default = ArrowUpIcon;
+exports.default = _default;

package/dist/stories/components/icons/BellIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.BellIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var BellIcon = function BellIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 18 21",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M8.08569 1.125C8.08569 0.8125 8.39819 0.5 8.71069 0.5C9.06226 0.5 9.37476 0.8125 9.37476 1.125V1.78906C12.4998 2.10156 14.9998 4.75781 14.9998 8V9.17188C14.9998 10.8516 15.6638 12.4922 16.8748 13.7031L16.9919 13.8203C17.3044 14.1328 17.4998 14.5625 17.4998 15.0312C17.4998 16.0078 16.7185 16.75 15.7419 16.75H1.71851C0.741943 16.75 -0.000244141 16.0078 -0.000244141 15.0312C-0.000244141 14.5625 0.156006 14.1328 0.468506 13.8203L0.585693 13.7031C1.79663 12.4922 2.49976 10.8516 2.49976 9.17188V8C2.49976 4.75781 4.96069 2.10156 8.12476 1.78906L8.08569 1.125ZM8.71069 3C5.97632 3 3.71069 5.26562 3.71069 8V9.17188C3.71069 11.2031 2.92944 13.1562 1.48413 14.6016L1.36694 14.6797C1.28882 14.7969 1.21069 14.9141 1.21069 15.0312C1.21069 15.3047 1.44507 15.5 1.71851 15.5H15.7419C16.0154 15.5 16.2498 15.3047 16.2498 15.0312C16.2498 14.9141 16.1716 14.7969 16.0935 14.6797L15.9763 14.6016C14.531 13.1562 13.7498 11.2031 13.7498 9.17188V8C13.7498 5.26562 11.4841 3 8.71069 3ZM8.71069 19.25C9.25757 19.25 9.72632 18.9375 9.92163 18.4297C10.0388 18.1172 10.3904 17.9219 10.7029 18.0391C11.0154 18.1562 11.2107 18.5078 11.0935 18.8594C10.7419 19.8359 9.80444 20.5 8.71069 20.5C7.65601 20.5 6.71851 19.8359 6.36694 18.8594C6.24976 18.5078 6.44507 18.1562 6.75757 18.0391C7.07007 17.9219 7.42163 18.1172 7.53882 18.4297C7.73413 18.9375 8.20288 19.25 8.71069 19.25Z",
+    fill: "#1B30AA"
+  }));
+};
+exports.BellIcon = BellIcon;
+var _default = BellIcon;
+exports.default = _default;

package/dist/stories/components/icons/DownloadIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.DownloadIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var DownloadIcon = function DownloadIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M9.57031 14.8438L3.94531 9.84375C3.67188 9.64844 3.67188 9.21875 3.90625 8.98438C4.10156 8.71094 4.53125 8.71094 4.76562 8.90625L9.375 13.0078V0.625C9.375 0.3125 9.64844 0 10 0C10.3125 0 10.625 0.3125 10.625 0.625V13.0078L15.1953 8.94531C15.4297 8.71094 15.8594 8.71094 16.0547 8.98438C16.2891 9.21875 16.2891 9.64844 16.0156 9.84375L10.3906 14.8438C10.2734 14.9609 10.1172 15 10 15C9.84375 15 9.6875 14.9609 9.57031 14.8438ZM17.5 12.5C18.8672 12.5 20 13.6328 20 15V17.5C20 18.9062 18.8672 20 17.5 20H2.5C1.09375 20 0 18.9062 0 17.5V15C0 13.6328 1.09375 12.5 2.5 12.5H4.375C4.6875 12.5 5 12.8125 5 13.125C5 13.4766 4.6875 13.75 4.375 13.75H2.5C1.79688 13.75 1.25 14.3359 1.25 15V17.5C1.25 18.2031 1.79688 18.75 2.5 18.75H17.5C18.1641 18.75 18.75 18.2031 18.75 17.5V15C18.75 14.3359 18.1641 13.75 17.5 13.75H15.625C15.2734 13.75 15 13.4766 15 13.125C15 12.8125 15.2734 12.5 15.625 12.5H17.5ZM17.1875 16.25C17.1875 16.7969 16.7578 17.1875 16.25 17.1875C15.7031 17.1875 15.3125 16.7969 15.3125 16.25C15.3125 15.7422 15.7031 15.3125 16.25 15.3125C16.7578 15.3125 17.1875 15.7422 17.1875 16.25Z",
+    fill: "#1B30AA"
+  }));
+};
+exports.DownloadIcon = DownloadIcon;
+var _default = DownloadIcon;
+exports.default = _default;

package/dist/stories/components/icons/ExitIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ExitIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var ExitIcon = function ExitIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 20 21",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M14.2263 2.91667C17.3097 4.54167 19.268 7.70833 19.268 11.1667C19.268 16.3333 15.0597 20.5 9.93465 20.5C4.76798 20.5 0.601318 16.3333 0.601318 11.1667C0.601318 7.70833 2.51798 4.54167 5.60132 2.91667C5.93465 2.75 6.35132 2.875 6.51798 3.20833C6.68465 3.5 6.55965 3.91667 6.22632 4.08333C3.55965 5.45833 1.93465 8.20833 1.93465 11.1667C1.93465 15.5833 5.51798 19.1667 9.93465 19.1667C14.3097 19.1667 17.9347 15.5833 17.9347 11.1667C17.9347 8.20833 16.268 5.45833 13.6013 4.08333C13.268 3.91667 13.143 3.5 13.3097 3.20833C13.4763 2.875 13.893 2.75 14.2263 2.91667ZM9.89298 12.5C9.55965 12.5 9.26798 12.2083 9.26798 11.8333V1.16667C9.26798 0.833333 9.60132 0.5 9.93465 0.5C10.268 0.5 10.6013 0.833333 10.6013 1.16667V11.8333C10.6013 12.2083 10.268 12.5 9.89298 12.5Z",
+    fill: "#1B30AA"
+  }));
+};
+exports.ExitIcon = ExitIcon;
+var _default = ExitIcon;
+exports.default = _default;

package/dist/stories/components/icons/EyeIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.EyeIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var EyeIcon = function EyeIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 14 12",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M13.9062 5.60156C13.9531 5.71875 14 5.88281 14 6C14 6.11719 13.9531 6.30469 13.9062 6.42188C12.6406 9.30469 10.1094 11.25 7.25 11.25C4.36719 11.25 1.83594 9.30469 0.570312 6.42188C0.523438 6.30469 0.5 6.11719 0.5 6C0.5 5.88281 0.523438 5.71875 0.570312 5.60156C1.83594 2.71875 4.36719 0.75 7.25 0.75C10.1094 0.75 12.6406 2.71875 13.9062 5.60156ZM7.25 10.125C9.57031 10.125 11.7031 8.55469 12.8516 6C11.7266 3.46875 9.57031 1.875 7.25 1.875C4.90625 1.875 2.77344 3.46875 1.625 6.02344C2.75 8.55469 4.90625 10.125 7.25 10.125ZM7.25 3C8.89062 3 10.25 4.35938 10.25 6.02344C10.25 7.66406 8.89062 9 7.25 9C5.58594 9 4.25 7.66406 4.25 6C4.25 4.35938 5.58594 3 7.25 3ZM7.25 7.875C8.28125 7.875 9.125 7.05469 9.125 6.02344C9.125 4.96875 8.28125 4.125 7.25 4.125C7.22656 4.125 7.20312 4.14844 7.17969 4.14844C7.22656 4.26562 7.25 4.38281 7.25 4.5C7.25 5.34375 6.57031 6 5.75 6C5.60938 6 5.49219 6 5.375 5.95312C5.375 5.97656 5.375 6 5.375 6C5.375 7.05469 6.19531 7.875 7.25 7.875Z",
+    fill: "#212121"
+  }));
+};
+exports.EyeIcon = EyeIcon;
+var _default = EyeIcon;
+exports.default = _default;

package/dist/stories/components/icons/FlyIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.FlyIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var FlyIcon = function FlyIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M19.4965 0.234375C19.8879 0.507812 20.0836 0.976562 19.9662 1.48438L17.4611 17.6953C17.422 18.0859 17.1871 18.4375 16.8349 18.5938C16.7174 18.6719 16.4826 18.75 16.2478 18.75C16.0912 18.75 15.9346 18.75 15.7389 18.6719L11.042 16.7188L7.67587 19.9219C7.63673 20 7.55844 20 7.48016 20C7.40188 20 7.28446 19.9609 7.20618 19.8047L4.77943 14.0625L0.747903 12.3828C0.317351 12.1875 0.00422266 11.7578 0.00422266 11.3281C-0.0349184 10.8594 0.199928 10.4297 0.630479 10.1562L18.1657 0.195312C18.3614 0.078125 18.5571 0 18.7919 0C19.0268 0 19.2616 0.078125 19.4965 0.234375ZM1.25674 11.25L4.81857 12.7734L16.1303 2.77344L1.25674 11.25ZM7.83243 18.0859L9.86777 16.1328L8.53697 15.5859C8.34127 15.5469 8.22384 15.3906 8.14556 15.1953C8.10642 15 8.14556 14.8047 8.26298 14.6484L14.8778 5.54688L5.91452 13.4766L7.83243 18.0859ZM16.2869 17.3438L18.5571 2.61719L9.75034 14.7266L16.2869 17.3438Z",
+    fill: "#1B30AA"
+  }));
+};
+exports.FlyIcon = FlyIcon;
+var _default = FlyIcon;
+exports.default = _default;

package/dist/stories/components/icons/MaintenanceIcon.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.MaintenanceIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var MaintenanceIcon = function MaintenanceIcon(_ref) {
+  var clicked = _ref.clicked,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? "8" : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? "9" : _ref$height;
+  return /*#__PURE__*/_react.default.createElement("svg", {
+    width: width,
+    height: height,
+    viewBox: "0 0 20 21",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M10.0701 20.5C7.88257 20.5 7.10132 20.0703 7.10132 19.1328V17.5703C6.47632 17.3359 5.92944 16.9844 5.42163 16.6328L4.09351 17.375C3.89819 17.4922 3.70288 17.5312 3.50757 17.5312C2.06226 17.5312 0.499756 13.9375 0.499756 13.3125C0.499756 12.8828 0.734131 12.4531 1.12476 12.2578L2.45288 11.4766C2.45288 11.1641 2.41382 10.8125 2.41382 10.5C2.41382 10.1484 2.45288 9.83594 2.49194 9.52344L1.16382 8.78125C0.773193 8.58594 0.538818 8.15625 0.538818 7.72656C0.538818 7.25781 2.02319 3.46875 3.50757 3.46875C3.74194 3.46875 3.93726 3.54688 4.13257 3.66406L5.46069 4.40625C5.96851 4.05469 6.51538 3.70312 7.10132 3.46875V1.90625C7.10132 0.695312 8.50757 0.5 10.1091 0.5C11.6326 0.5 13.0388 0.695312 13.0388 1.90625V3.46875C13.6248 3.70312 14.1716 4.01562 14.6794 4.40625L16.0076 3.66406C16.2029 3.54688 16.3982 3.50781 16.6326 3.50781C18.0388 3.50781 19.6013 7.10156 19.6013 7.72656C19.6013 8.15625 19.3669 8.58594 18.9763 8.78125L17.6482 9.5625C17.6873 9.875 17.7263 10.1875 17.7263 10.5C17.7263 10.8125 17.6873 11.1641 17.6482 11.4766L18.9763 12.2578C19.3669 12.4531 19.6013 12.8828 19.6013 13.3125C19.6013 13.7812 18.1169 17.5312 16.6326 17.5312C16.3982 17.5312 16.2029 17.4922 16.0076 17.375L14.6794 16.6328C14.1716 16.9844 13.6248 17.3359 13.0388 17.5703V19.1328C13.0779 20.0703 12.2966 20.5 10.0701 20.5ZM5.57788 15.1094C6.98413 16.3203 7.64819 16.4375 8.35132 16.7109V19.1328C8.93726 19.2109 9.48413 19.25 10.0701 19.25C10.656 19.25 11.2419 19.2109 11.8279 19.0938L11.7888 16.7109C12.4529 16.4766 13.1951 16.2812 14.5623 15.1094L16.6716 16.3203C17.4138 15.4609 17.9998 14.4453 18.3513 13.3125L16.3201 12.1406C16.3982 11.5547 16.4763 11.125 16.4763 10.5781C16.4763 10.1875 16.4373 9.67969 16.3201 8.89844L18.3904 7.72656C17.9998 6.63281 17.4138 5.61719 16.6326 4.71875L14.5623 5.92969C13.1951 4.71875 12.531 4.60156 11.7888 4.32812V1.90625C11.2419 1.82812 10.6951 1.78906 10.1091 1.78906C9.52319 1.78906 8.93726 1.82812 8.31226 1.94531L8.35132 4.32812C7.72632 4.5625 6.98413 4.71875 5.57788 5.92969L3.50757 4.71875C2.76538 5.61719 2.17944 6.63281 1.78882 7.76562L3.85913 8.89844C3.78101 9.48438 3.70288 9.91406 3.70288 10.4219C3.70288 10.8516 3.74194 11.3594 3.85913 12.1016L1.78882 13.3125C2.17944 14.3672 2.76538 15.3828 3.54663 16.2812L5.57788 15.1094ZM10.1091 14.25C8.03882 14.25 6.35913 12.5703 6.35913 10.5C6.35913 8.42969 8.03882 6.75 10.1091 6.75C12.1404 6.75 13.8591 8.42969 13.8591 10.5C13.8591 12.5703 12.1404 14.25 10.1091 14.25ZM10.1091 8C8.70288 8 7.60913 9.09375 7.60913 10.5C7.60913 11.8672 8.70288 13 10.1091 13C11.4763 13 12.6091 11.8672 12.6091 10.5C12.6091 9.09375 11.4763 8 10.1091 8Z",
+    fill: "#1B30AA"
+  }));
+};
+exports.MaintenanceIcon = MaintenanceIcon;
+var _default = MaintenanceIcon;
+exports.default = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sag_components",
-  "version": "1.0.53",
+  "version": "1.0.55",
   "description": "",
   "main": "dist/index.js",
   "scripts": {