contentoh-components-library 21.4.102 → 21.4.104

package/dist/components/organisms/TableResizable/TableResizable.stories.js

@@ -1,20 +1,32 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.DefaultTableResizable = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _ = require(".");
+
 var _utils = require("./utils.js");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/organisms/TableResizable",
   component: _.TableResizable
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_.TableResizable, {
-  ...args
-});
-const DefaultTableResizable = exports.DefaultTableResizable = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.TableResizable, (0, _objectSpread2.default)({}, args));
+};
+
+var DefaultTableResizable = Template.bind({});
+exports.DefaultTableResizable = DefaultTableResizable;
 DefaultTableResizable.args = {
   headers: ["Col 1", "Col 2", "Col 3", "Col 4", "Col 5"],
   tableContent: _utils.data,

package/dist/components/organisms/TableResizable/index.js

@@ -1,72 +1,96 @@
 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TableResizable = void 0;
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/typeof"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _iconsMaterial = require("@mui/icons-material");
+
 var _styles = require("./styles.js");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const createHeaders = headers => {
-  return headers.map(item => ({
-    text: item,
-    ref: (0, _react.useRef)()
-  }));
-};
 
+var createHeaders = function createHeaders(headers) {
+  return headers.map(function (item) {
+    return {
+      text: item,
+      ref: (0, _react.useRef)()
+    };
+  });
+};
 /*
  * Read the blog post here:
  * https://letsbuildui.dev/articles/resizable-tables-with-react-and-css-grid
  */
-const TableResizable = props => {
-  const {
-    gridTemplateColumns,
-    headers,
-    minCellWidth,
-    tableContent,
-    withResetSizeButton
-  } = props;
-  // const [tableHeight, setTableHeight] = useState("auto");
-  const [activeIndex, setActiveIndex] = (0, _react.useState)(null);
-  const tableElement = (0, _react.useRef)(null);
-  const columns = createHeaders(headers);
-
-  // useEffect(() => {
+
+
+var TableResizable = function TableResizable(props) {
+  var gridTemplateColumns = props.gridTemplateColumns,
+      headers = props.headers,
+      minCellWidth = props.minCellWidth,
+      tableContent = props.tableContent,
+      withResetSizeButton = props.withResetSizeButton; // const [tableHeight, setTableHeight] = useState("auto");
+
+  var _useState = (0, _react.useState)(null),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      activeIndex = _useState2[0],
+      setActiveIndex = _useState2[1];
+
+  var tableElement = (0, _react.useRef)(null);
+  var columns = createHeaders(headers); // useEffect(() => {
   //   setTableHeight(tableElement.current.offsetHeight);
   // }, []);
 
-  const mouseDown = index => setActiveIndex(index);
-  const mouseMove = (0, _react.useCallback)(e => {
-    const gridColumns = columns.map((col, i) => {
+  var mouseDown = function mouseDown(index) {
+    return setActiveIndex(index);
+  };
+
+  var mouseMove = (0, _react.useCallback)(function (e) {
+    var gridColumns = columns.map(function (col, i) {
       if (i === activeIndex) {
-        const width = e.clientX - col.ref.current.offsetLeft;
+        var width = e.clientX - col.ref.current.offsetLeft;
         if (width >= minCellWidth) return "".concat(width, "px");
       }
+
       return "".concat(col.ref.current.offsetWidth, "px");
     });
-    const gridTemplateColumns = "".concat(gridColumns.join(" "));
+    var gridTemplateColumns = "".concat(gridColumns.join(" "));
     tableElement.current.style.gridTemplateColumns = gridTemplateColumns;
   }, [activeIndex, columns, minCellWidth]);
-  const removeListeners = (0, _react.useCallback)(() => {
+  var removeListeners = (0, _react.useCallback)(function () {
     window.removeEventListener("mousemove", mouseMove);
     window.removeEventListener("mouseup", removeListeners);
   }, [mouseMove]);
-  const mouseUp = (0, _react.useCallback)(() => {
+  var mouseUp = (0, _react.useCallback)(function () {
     setActiveIndex(null);
     removeListeners();
   }, [setActiveIndex, removeListeners]);
-  (0, _react.useEffect)(() => {
+  (0, _react.useEffect)(function () {
     if (activeIndex > -1) {
       window.addEventListener("mousemove", mouseMove);
       window.addEventListener("mouseup", mouseUp);
     }
-    return () => removeListeners();
+
+    return function () {
+      return removeListeners();
+    };
   }, [activeIndex, mouseMove, mouseUp, removeListeners]);
-  const resetTableCells = () => {
+
+  var resetTableCells = function resetTableCells() {
     tableElement.current.style.gridTemplateColumns = "";
   };
+
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
     gridTemplateColumns: gridTemplateColumns,
     totalColumns: columns === null || columns === void 0 ? void 0 : columns.length,
@@ -86,35 +110,40 @@ const TableResizable = props => {
         ref: tableElement,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("thead", {
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {
-            children: columns === null || columns === void 0 ? void 0 : columns.map((_ref, i) => {
-              let {
-                ref,
-                text
-              } = _ref;
+            children: columns === null || columns === void 0 ? void 0 : columns.map(function (_ref, i) {
+              var ref = _ref.ref,
+                  text = _ref.text;
               return /*#__PURE__*/(0, _jsxRuntime.jsxs)("th", {
                 ref: ref,
                 children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                   children: text
                 }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                   style: {
-                    height: "50px" /* tableHeight */
+                    height: "50px"
+                    /* tableHeight */
+
+                  },
+                  onMouseDown: function onMouseDown() {
+                    return mouseDown(i);
                   },
-                  onMouseDown: () => mouseDown(i),
                   className: "resize-handle ".concat(activeIndex === i ? "active" : "idle")
                 })]
               }, i);
             })
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("tbody", {
-          children: tableContent.map(row => {
+          children: tableContent.map(function (row) {
             var _row$columns;
+
             return /*#__PURE__*/(0, _jsxRuntime.jsx)("tr", {
-              children: row === null || row === void 0 ? void 0 : (_row$columns = row.columns) === null || _row$columns === void 0 ? void 0 : _row$columns.map((column, indexColumn) => /*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
-                className: typeof column === "object" ? "noOverflow" : "",
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-                  children: column
-                })
-              }, "".concat(row.key, "-").concat(indexColumn)))
+              children: row === null || row === void 0 ? void 0 : (_row$columns = row.columns) === null || _row$columns === void 0 ? void 0 : _row$columns.map(function (column, indexColumn) {
+                return /*#__PURE__*/(0, _jsxRuntime.jsx)("td", {
+                  className: (0, _typeof2.default)(column) === "object" ? "noOverflow" : "",
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                    children: column
+                  })
+                }, "".concat(row.key, "-").concat(indexColumn));
+              })
             }, row.key);
           })
         })]
@@ -122,4 +151,5 @@ const TableResizable = props => {
     })]
   });
 };
+
 exports.TableResizable = TableResizable;

package/dist/components/organisms/TableResizable/styles.js

@@ -1,15 +1,28 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Container = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _templateObject;
-const defaultTemplateColumns = totalColumns => "minmax(100px, 1fr) ".repeat(totalColumns);
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  overflow: hidden; /* Clips any scrollbars that appear */\n  font-family: Avenir Next;\n  font-size: 13px;\n  width: 90%;\n\n  .reset-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: 50%;\n    cursor: pointer;\n    padding: 3px;\n    border: 0;\n    background: #f5f5f5;\n    position: absolute;\n    top: 5px;\n    left: 5px;\n    margin: 0;\n    z-index: 10;\n  }\n\n  .table-wrapper {\n    border-radius: 6px;\n    background: #fff;\n  }\n\n  table {\n    width: 100%;\n    height: calc(100vh - 250px);\n    overflow: auto; /* Allow scrolling within the table */\n    display: grid;\n    grid-template-columns: ", ";\n    grid-template-rows: ", ";\n  }\n\n  table th {\n    font-size: 15px;\n  }\n\n  table th,\n  table td {\n    text-align: left;\n    padding: 5px;\n  }\n\n  table th span,\n  table td span {\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    display: block;\n    border-right: 1px solid #ccc;\n    text-align: center;\n    height: 100%;\n  }\n\n  table th:last-child span,\n  table td:last-child span {\n    border-right: 0px;\n  }\n\n  table tr td {\n    border-bottom: 1px solid #ccc;\n  }\n\n  table tr th {\n    border-bottom: 1px solid #ccc;\n  }\n\n  table thead,\n  table tbody,\n  table tr {\n    display: contents;\n    background: red;\n  }\n\n  table thead {\n    -webkit-user-select: none; /* Safari */\n    -ms-user-select: none; /* IE 10 and IE 11 */\n    user-select: none; /* Standard syntax */\n  }\n\n  th {\n    position: sticky;\n    top: 0;\n    background-color: #fff;\n    line-height: 40px;\n    z-index: 8;\n  }\n\n  td {\n    line-height: 40px;\n    height: 50px;\n  }\n\n  .resize-handle {\n    display: block;\n    position: absolute;\n    cursor: col-resize;\n    width: 8px;\n    right: 0;\n    top: 0;\n    z-index: 1;\n    border-right: 1px solid transparent;\n  }\n\n  .resize-handle:hover {\n    border-color: #ccc;\n  }\n\n  .resize-handle.active {\n    border-color: #517ea5;\n  }\n\n  .resizeable-table {\n    width: 100%;\n  }\n\n  .noOverflow {\n    overflow: inherit;\n    span {\n      overflow: inherit;\n    }\n  }\n"])), props => {
+
+var defaultTemplateColumns = function defaultTemplateColumns(totalColumns) {
+  return "minmax(100px, 1fr) ".repeat(totalColumns);
+};
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  overflow: hidden; /* Clips any scrollbars that appear */\n  font-family: Avenir Next;\n  font-size: 13px;\n  width: 90%;\n\n  .reset-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    border-radius: 50%;\n    cursor: pointer;\n    padding: 3px;\n    border: 0;\n    background: #f5f5f5;\n    position: absolute;\n    top: 5px;\n    left: 5px;\n    margin: 0;\n    z-index: 10;\n  }\n\n  .table-wrapper {\n    border-radius: 6px;\n    background: #fff;\n  }\n\n  table {\n    width: 100%;\n    height: calc(100vh - 250px);\n    overflow: auto; /* Allow scrolling within the table */\n    display: grid;\n    grid-template-columns: ", ";\n    grid-template-rows: ", ";\n  }\n\n  table th {\n    font-size: 15px;\n  }\n\n  table th,\n  table td {\n    text-align: left;\n    padding: 5px;\n  }\n\n  table th span,\n  table td span {\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    display: block;\n    border-right: 1px solid #ccc;\n    text-align: center;\n    height: 100%;\n  }\n\n  table th:last-child span,\n  table td:last-child span {\n    border-right: 0px;\n  }\n\n  table tr td {\n    border-bottom: 1px solid #ccc;\n  }\n\n  table tr th {\n    border-bottom: 1px solid #ccc;\n  }\n\n  table thead,\n  table tbody,\n  table tr {\n    display: contents;\n    background: red;\n  }\n\n  table thead {\n    -webkit-user-select: none; /* Safari */\n    -ms-user-select: none; /* IE 10 and IE 11 */\n    user-select: none; /* Standard syntax */\n  }\n\n  th {\n    position: sticky;\n    top: 0;\n    background-color: #fff;\n    line-height: 40px;\n    z-index: 8;\n  }\n\n  td {\n    line-height: 40px;\n    height: 50px;\n  }\n\n  .resize-handle {\n    display: block;\n    position: absolute;\n    cursor: col-resize;\n    width: 8px;\n    right: 0;\n    top: 0;\n    z-index: 1;\n    border-right: 1px solid transparent;\n  }\n\n  .resize-handle:hover {\n    border-color: #ccc;\n  }\n\n  .resize-handle.active {\n    border-color: #517ea5;\n  }\n\n  .resizeable-table {\n    width: 100%;\n  }\n\n  .noOverflow {\n    overflow: inherit;\n    span {\n      overflow: inherit;\n    }\n  }\n"])), function (props) {
   var _props$gridTemplateCo;
+
   return (_props$gridTemplateCo = props.gridTemplateColumns) !== null && _props$gridTemplateCo !== void 0 ? _props$gridTemplateCo : defaultTemplateColumns(props.totalColumns);
-}, props => "repeat(".concat(props.totalRows + 2, ", 50px)"));
+}, function (props) {
+  return "repeat(".concat(props.totalRows + 2, ", 50px)");
+});
+
+exports.Container = Container;

package/dist/components/organisms/TableResizable/utils.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.data = void 0;
-const data = exports.data = [{
+var data = [{
   key: 1,
   object: {},
   columns: ["Large Detroit Style Pizza", 3213456785, "$31.43", "Pending", "Dave"]
@@ -20,4 +20,5 @@ const data = exports.data = [{
   key: 4,
   object: {},
   columns: ["Large Detroit Style Pizza", 3213456785, "$31.43", "Pending", "Dave"]
-}];
+}];
+exports.data = data;

package/dist/components/organisms/VersionSelector/VersionSelector.stories.js

@@ -1,19 +1,30 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.VersionSelectorDefault = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _index = require("./index");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/organisms/VersionSelector",
   component: _index.VersionSelector
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.VersionSelector, {
-  ...args
-});
-const VersionSelectorDefault = exports.VersionSelectorDefault = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.VersionSelector, (0, _objectSpread2.default)({}, args));
+};
+
+var VersionSelectorDefault = Template.bind({});
+exports.VersionSelectorDefault = VersionSelectorDefault;
 VersionSelectorDefault.args = {
   articleId: 35707,
   companyName: "COMPANY DEV",

package/dist/components/organisms/VersionSelector/index.js

@@ -1,56 +1,117 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.VersionSelector = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+
 var _styles = require("./styles");
+
 var _axios = _interopRequireDefault(require("axios"));
+
 var _react = require("react");
+
 var _ScreenHeader = require("../../atoms/ScreenHeader");
+
 var _GeneralButton = require("../../atoms/GeneralButton");
+
 var _addVersion = _interopRequireDefault(require("../../../assets/images/versionSelector/addVersion.svg"));
+
 var _closeVersionSelector = _interopRequireDefault(require("../../../assets/images/versionSelector/closeVersionSelector.svg"));
+
 var _variables = require("../../../../dist/global-files/variables");
+
 var _variables2 = require("../../../global-files/variables");
+
 var _VersionItem = require("../../molecules/VersionItem");
+
 var _CreateVersion = require("../../organisms/CreateVersion");
+
 var _customHooks = require("../../../global-files/customHooks");
+
 var _jsxRuntime = require("react/jsx-runtime");
-const VersionSelector = _ref => {
-  let {
-    modalId,
-    articleId,
-    setVersion,
-    companyName,
-    currentVersion,
-    setShowVersionSelector,
-    jwt
-  } = _ref;
-  const [versions, setVersions] = (0, _react.useState)([]);
-  const [showCreateVersion, setShowCreateVersion] = (0, _customHooks.useCloseModal)("create-version");
-  const [reload, setReload] = (0, _react.useState)(false);
-  const loadProductVersions = async articleId => {
-    try {
-      const response = await _axios.default.get("".concat(process.env.REACT_APP_VERSIONS_ENDPOINT, "?articleId=").concat(articleId, "&provider=true"), {
-        headers: {
-          Authorization: jwt
+
+var VersionSelector = function VersionSelector(_ref) {
+  var modalId = _ref.modalId,
+      articleId = _ref.articleId,
+      setVersion = _ref.setVersion,
+      companyName = _ref.companyName,
+      currentVersion = _ref.currentVersion,
+      setShowVersionSelector = _ref.setShowVersionSelector,
+      jwt = _ref.jwt;
+
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      versions = _useState2[0],
+      setVersions = _useState2[1];
+
+  var _useCloseModal = (0, _customHooks.useCloseModal)("create-version"),
+      _useCloseModal2 = (0, _slicedToArray2.default)(_useCloseModal, 2),
+      showCreateVersion = _useCloseModal2[0],
+      setShowCreateVersion = _useCloseModal2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      reload = _useState4[0],
+      setReload = _useState4[1];
+
+  var loadProductVersions = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(articleId) {
+      var response, versionList;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              _context.next = 3;
+              return _axios.default.get("".concat(process.env.REACT_APP_VERSIONS_ENDPOINT, "?articleId=").concat(articleId, "&provider=true"), {
+                headers: {
+                  Authorization: jwt
+                }
+              });
+
+            case 3:
+              response = _context.sent;
+              versionList = JSON.parse(response.data.body).data;
+              setVersions(versionList);
+              _context.next = 11;
+              break;
+
+            case 8:
+              _context.prev = 8;
+              _context.t0 = _context["catch"](0);
+              console.log(_context.t0);
+
+            case 11:
+            case "end":
+              return _context.stop();
+          }
         }
-      });
-      const versionList = JSON.parse(response.data.body).data;
-      setVersions(versionList);
-    } catch (error) {
-      console.log(error);
-    }
-  };
-  (0, _react.useEffect)(() => {
-    const ac = new AbortController();
+      }, _callee, null, [[0, 8]]);
+    }));
+
+    return function loadProductVersions(_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  (0, _react.useEffect)(function () {
+    var ac = new AbortController();
     loadProductVersions(articleId);
-    return () => {
+    return function () {
       setVersions([]);
       setShowCreateVersion(false);
-      return () => ac.abort(); // Abort both fetches on unmount
+      return function () {
+        return ac.abort();
+      }; // Abort both fetches on unmount
     };
   }, [reload]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
@@ -67,33 +128,42 @@ const VersionSelector = _ref => {
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
           image: _addVersion.default,
           buttonType: "circular-button",
-          onClick: () => setShowCreateVersion(true),
+          onClick: function onClick() {
+            return setShowCreateVersion(true);
+          },
           id: "add-version"
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GeneralButton.Button, {
           image: _closeVersionSelector.default,
           buttonType: "circular-button",
-          onClick: () => setShowVersionSelector(false),
+          onClick: function onClick() {
+            return setShowVersionSelector(false);
+          },
           id: "close-button"
         })]
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "versions-container",
-      children: versions === null || versions === void 0 ? void 0 : versions.map(item => /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionItem.VersionItem, {
-        version: item.version,
-        articleStatus: item.article_status,
-        currentVersion: item.version === currentVersion,
-        productOwner: companyName,
-        setVersion: setVersion,
-        timestamp: item.timestamp
-      }, item.version))
+      children: versions === null || versions === void 0 ? void 0 : versions.map(function (item) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_VersionItem.VersionItem, {
+          version: item.version,
+          articleStatus: item.article_status,
+          currentVersion: item.version === currentVersion,
+          productOwner: companyName,
+          setVersion: setVersion,
+          timestamp: item.timestamp
+        }, item.version);
+      })
     }), showCreateVersion && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CreateVersion.CreateVersion, {
       articleId: articleId,
       version: currentVersion,
       versionsList: versions,
       setShowCreateVersion: setShowCreateVersion,
-      realoadVersion: () => setReload(!reload),
+      realoadVersion: function realoadVersion() {
+        return setReload(!reload);
+      },
       jwt: jwt
     })]
   });
 };
+
 exports.VersionSelector = VersionSelector;

package/dist/components/organisms/VersionSelector/styles.js

@@ -1,12 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Container = void 0;
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
+
 var _styledComponents = _interopRequireDefault(require("styled-components"));
+
 var _variables = require("../../../global-files/variables");
+
 var _templateObject;
-const Container = exports.Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 300px;\n  height: 100%;\n  background-color: ", ";\n  padding: 15px;\n  overflow: auto;\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: 500;\n\n  .versions-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    .buttons-container {\n      display: flex;\n      align-items: center;\n\n      button + * {\n        margin-left: 10px;\n      }\n    }\n  }\n"])), _variables.GlobalColors.deep_gray);
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: 300px;\n  height: 100%;\n  background-color: ", ";\n  padding: 15px;\n  overflow: auto;\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: 500;\n\n  .versions-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    .buttons-container {\n      display: flex;\n      align-items: center;\n\n      button + * {\n        margin-left: 10px;\n      }\n    }\n  }\n"])), _variables.GlobalColors.deep_gray);
+
+exports.Container = Container;

package/dist/components/organisms/VersionSelectorv2/VersionSelectorv2.stories.js

@@ -1,19 +1,30 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.VersionSelectorv2Default = void 0;
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+
 var _index = require("./index");
+
 var _jsxRuntime = require("react/jsx-runtime");
-var _default = exports.default = {
+
+var _default = {
   title: "Components/organisms/VersionSelectorv2",
   component: _index.VersionSelectorv2
 };
-const Template = args => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.VersionSelectorv2, {
-  ...args
-});
-const VersionSelectorv2Default = exports.VersionSelectorv2Default = Template.bind({});
+exports.default = _default;
+
+var Template = function Template(args) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.VersionSelectorv2, (0, _objectSpread2.default)({}, args));
+};
+
+var VersionSelectorv2Default = Template.bind({});
+exports.VersionSelectorv2Default = VersionSelectorv2Default;
 VersionSelectorv2Default.args = {
   articleId: 35707,
   companyName: "COMPANY DEV",