@epignosis_llc/gnosis 3.0.2 → 3.0.3

package/dist/esm/src/components/Loaders/Loader.js

@@ -2,34 +2,48 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { createElement as jsx } from '../../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js';
 import 'react';
 import { container } from './styles.js';
-import { createElement as jsx } from '../../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js';
+import { u as useTheme } from '../../../node_modules/@emotion/react/dist/emotion-element-6a883da9.browser.esm.js';
 import PulseLoader from '../../../node_modules/react-spinners/esm/PulseLoader.js';
 
 var _excluded = ["fullScreen", "size"];
+var loaderSize = {
+  md: "0.375rem",
+  lg: "0.75rem"
+};
+var loaderMargin = {
+  md: "0.0625rem",
+  lg: "0.625rem"
+};
 var Loader = function Loader(_ref) {
   var _ref$fullScreen = _ref.fullScreen,
     fullScreen = _ref$fullScreen === void 0 ? false : _ref$fullScreen,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? "lg" : _ref$size,
     rest = _objectWithoutProperties(_ref, _excluded);
+  var _useTheme = useTheme(),
+    loader = _useTheme.loader;
   return jsx("div", _extends({
-    css: function css(theme) {
-      return container(theme, {
-        fullScreen: fullScreen,
-        size: size
+    css: function css() {
+      return container({
+        fullScreen: fullScreen
       });
     },
     "data-testid": "loader"
   }, rest, {
-    className: "loading-container".concat(rest !== null && rest !== void 0 && rest.className ? " ".concat(rest === null || rest === void 0 ? void 0 : rest.className) : "")
-  }), jsx(PulseLoader, null));
+    className: "loading-container".concat(rest !== null && rest !== void 0 && rest.className ? "".concat(rest === null || rest === void 0 ? void 0 : rest.className) : "")
+  }), jsx(PulseLoader, {
+    color: loader.color,
+    size: loaderSize[size],
+    margin: loaderMargin[size]
+  }));
 };
 
 export { Loader as default };

package/dist/esm/src/components/Loaders/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../../../src/components/Loaders/Loader.tsx"],"sourcesContent":["import { SerializedStyles } from \"@emotion/react\";\nimport React, { FC } from \"react\";\nimport { PulseLoader } from \"react-spinners\";\nimport { container } from \"./styles\";\n\nexport type LoaderSize = \"md\" | \"lg\";\n\nexport type LoaderProps = React.HTMLAttributes<HTMLDivElement> & {\n  fullScreen?: boolean;\n  size?: \"md\" | \"lg\";\n};\n\nconst Loader: FC<LoaderProps> = ({ fullScreen = false, size = \"lg\", ...rest }) => (\n  <div\n    css={(theme): SerializedStyles => container(theme, { fullScreen, size })}\n    data-testid=\"loader\"\n    {...rest}\n    className={`loading-container${rest?.className ? ` ${rest?.className}` : \"\"}`}\n  >\n    <PulseLoader />\n  </div>\n);\n\nexport default Loader;\n"],"names":["Loader","fullScreen","size","rest","___EmotionJSX","theme","container","className"],"mappings":";;;;;;;;;;;;;;;AAYMA,IAAAA,MAAuB,GAAG,SAA1BA,MAAuB,CAAA,IAAA,EAAA;AAAA,EAAA,IAAA,eAAA,GAAA,IAAA,CAAMC,UAAU;AAAVA,IAAAA,UAAU,gCAAG,KAAK,GAAA,eAAA;AAAA,IAAA,SAAA,GAAA,IAAA,CAAEC,IAAI;AAAJA,IAAAA,IAAI,0BAAG,IAAI,GAAA,SAAA;IAAKC,IAAI,GAAA,wBAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;EAAA,OACzEC,GAAA,CAAA,KAAA,EAAA,QAAA,CAAA;IACE,GAAG,EAAE,aAACC,KAAK,EAAA;MAAA,OAAuBC,SAAS,CAACD,KAAK,EAAE;AAAEJ,QAAAA,UAAU,EAAVA,UAAU;AAAEC,QAAAA,IAAI,EAAJA,IAAAA;AAAK,OAAC,CAAC,CAAA;KAAC;IACzE,aAAY,EAAA,QAAA;AAAQ,GAAA,EAChBC,IAAI,EAAA;AACR,IAAA,SAAS,6BAAsBA,IAAI,KAAA,IAAA,IAAJA,IAAI,KAAA,KAAA,CAAA,IAAJA,IAAI,CAAEI,SAAS,GAAOJ,GAAAA,CAAAA,MAAAA,CAAAA,IAAI,aAAJA,IAAI,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAJA,IAAI,CAAEI,SAAS,IAAK,EAAE,CAAA;GAE3E,CAAA,EAAAH,GAAA,CAAC,WAAW,EAAA,IAAA,CAAG,CACX,CAAA;AAAA;;;;"}
+{"version":3,"file":"Loader.js","sources":["../../../../../src/components/Loaders/Loader.tsx"],"sourcesContent":["import { SerializedStyles, useTheme } from \"@emotion/react\";\nimport React, { FC } from \"react\";\nimport { PulseLoader } from \"react-spinners\";\nimport { container } from \"./styles\";\n\nexport type LoaderSize = \"md\" | \"lg\";\n\nexport type LoaderProps = React.HTMLAttributes<HTMLDivElement> & {\n  fullScreen?: boolean;\n  size?: \"md\" | \"lg\";\n};\n\nconst loaderSize = {\n  md: \"0.375rem\",\n  lg: \"0.75rem\",\n};\n\nconst loaderMargin = {\n  md: \"0.0625rem\",\n  lg: \"0.625rem\",\n};\n\nconst Loader: FC<LoaderProps> = ({ fullScreen = false, size = \"lg\", ...rest }) => {\n  const { loader } = useTheme();\n  return (\n    <div\n      css={(): SerializedStyles => container({ fullScreen })}\n      data-testid=\"loader\"\n      {...rest}\n      className={`loading-container${rest?.className ? `${rest?.className}` : \"\"}`}\n    >\n      <PulseLoader color={loader.color} size={loaderSize[size]} margin={loaderMargin[size]} />\n    </div>\n  );\n};\n\nexport default Loader;\n"],"names":["loaderSize","md","lg","loaderMargin","Loader","fullScreen","size","rest","useTheme","loader","___EmotionJSX","container","className","color"],"mappings":";;;;;;;;;;;;;;;;AAYA,IAAMA,UAAU,GAAG;AACjBC,EAAAA,EAAE,EAAE,UAAU;AACdC,EAAAA,EAAE,EAAE,SAAA;AACN,CAAC,CAAA;AAED,IAAMC,YAAY,GAAG;AACnBF,EAAAA,EAAE,EAAE,WAAW;AACfC,EAAAA,EAAE,EAAE,UAAA;AACN,CAAC,CAAA;AAED,IAAME,MAAuB,GAAG,SAA1BA,MAAuB,CAAqD,IAAA,EAAA;AAAA,EAAA,IAAA,eAAA,GAAA,IAAA,CAA/CC,UAAU;AAAVA,IAAAA,UAAU,gCAAG,KAAK,GAAA,eAAA;AAAA,IAAA,SAAA,GAAA,IAAA,CAAEC,IAAI;AAAJA,IAAAA,IAAI,0BAAG,IAAI,GAAA,SAAA;IAAKC,IAAI,GAAA,wBAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;AACzE,EAAA,IAAA,SAAA,GAAmBC,QAAQ,EAAE;AAArBC,IAAAA,MAAM,aAANA,MAAM,CAAA;EACd,OACEC,GAAA,CAAA,KAAA,EAAA,QAAA,CAAA;AACE,IAAA,GAAG,EAAE,SAAA,GAAA,GAAA;AAAA,MAAA,OAAwBC,SAAS,CAAC;AAAEN,QAAAA,UAAU,EAAVA,UAAAA;AAAW,OAAC,CAAC,CAAA;KAAC;IACvD,aAAY,EAAA,QAAA;AAAQ,GAAA,EAChBE,IAAI,EAAA;AACR,IAAA,SAAS,6BAAsBA,IAAI,KAAA,IAAA,IAAJA,IAAI,KAAA,KAAA,CAAA,IAAJA,IAAI,CAAEK,SAAS,GAAML,EAAAA,CAAAA,MAAAA,CAAAA,IAAI,aAAJA,IAAI,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAJA,IAAI,CAAEK,SAAS,IAAK,EAAE,CAAA;AAAG,GAAA,CAAA,EAE7EF,IAAC,WAAW,EAAA;IAAC,KAAK,EAAED,MAAM,CAACI,KAAM;AAAC,IAAA,IAAI,EAAEb,UAAU,CAACM,IAAI,CAAE;IAAC,MAAM,EAAEH,YAAY,CAACG,IAAI,CAAA;AAAE,GAAA,CAAG,CACpF,CAAA;AAEV;;;;"}

package/dist/esm/src/components/Loaders/styles.js

@@ -2,28 +2,18 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 
 import { css } from '../../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js';
 
-var loaderMargin = {
-  md: "0.0625rem",
-  lg: "0.625rem"
-};
-var loaderSize = {
-  md: "0.375rem",
-  lg: "0.75rem"
-};
-var container = function container(_ref, _ref2) {
-  var loader = _ref.loader;
-  var fullScreen = _ref2.fullScreen,
-    size = _ref2.size;
+var container = function container(_ref) {
+  var fullScreen = _ref.fullScreen;
   return (
     /*#__PURE__*/
     /*#__PURE__*/
-    css("display:flex;justify-content:center;align-items:center;width:100%;height:", fullScreen ? "100vh" : "auto", ";&.loading-container{span>span{width:", loaderSize[size], ";height:", loaderSize[size], ";background:", loader.color, ";margin:", loaderMargin[size], ";}}" + (process.env.NODE_ENV === "production" ? "" : ";label:container;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQjBCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgU2VyaWFsaXplZFN0eWxlcywgVGhlbWUgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IExvYWRlclNpemUgfSBmcm9tIFwiLi9Mb2FkZXJcIjtcblxuY29uc3QgbG9hZGVyTWFyZ2luID0ge1xuICBtZDogXCIwLjA2MjVyZW1cIixcbiAgbGc6IFwiMC42MjVyZW1cIixcbn07XG5cbmNvbnN0IGxvYWRlclNpemUgPSB7XG4gIG1kOiBcIjAuMzc1cmVtXCIsXG4gIGxnOiBcIjAuNzVyZW1cIixcbn07XG5cbmV4cG9ydCBjb25zdCBjb250YWluZXIgPSAoXG4gIHsgbG9hZGVyIH06IFRoZW1lLFxuICB7IGZ1bGxTY3JlZW4sIHNpemUgfTogeyBmdWxsU2NyZWVuOiBib29sZWFuOyBzaXplOiBMb2FkZXJTaXplIH0sXG4pOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6ICR7ZnVsbFNjcmVlbiA/IFwiMTAwdmhcIiA6IFwiYXV0b1wifTtcblxuICAmLmxvYWRpbmctY29udGFpbmVyIHtcbiAgICBzcGFuID4gc3BhbiB7XG4gICAgICB3aWR0aDogJHtsb2FkZXJTaXplW3NpemVdfTtcbiAgICAgIGhlaWdodDogJHtsb2FkZXJTaXplW3NpemVdfTtcbiAgICAgIGJhY2tncm91bmQ6ICR7bG9hZGVyLmNvbG9yfTtcbiAgICAgIG1hcmdpbjogJHtsb2FkZXJNYXJnaW5bc2l6ZV19O1xuICAgIH1cbiAgfVxuYDtcbiJdfQ== */", process.env.NODE_ENV === "production" ? "" : ";label:container;")
+    css("display:flex;justify-content:center;align-items:center;width:100%;height:", fullScreen ? "100vh" : "auto", ";" + (process.env.NODE_ENV === "production" ? "" : ";label:container;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFMkYiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5cbmV4cG9ydCBjb25zdCBjb250YWluZXIgPSAoeyBmdWxsU2NyZWVuIH06IHsgZnVsbFNjcmVlbjogYm9vbGVhbiB9KTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAke2Z1bGxTY3JlZW4gPyBcIjEwMHZoXCIgOiBcImF1dG9cIn07XG5gO1xuIl19 */", process.env.NODE_ENV === "production" ? "" : ";label:container;")
   );
 };
 

package/dist/esm/src/components/Loaders/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../../src/components/Loaders/styles.ts"],"sourcesContent":["import { css, SerializedStyles, Theme } from \"@emotion/react\";\nimport { LoaderSize } from \"./Loader\";\n\nconst loaderMargin = {\n  md: \"0.0625rem\",\n  lg: \"0.625rem\",\n};\n\nconst loaderSize = {\n  md: \"0.375rem\",\n  lg: \"0.75rem\",\n};\n\nexport const container = (\n  { loader }: Theme,\n  { fullScreen, size }: { fullScreen: boolean; size: LoaderSize },\n): SerializedStyles => css`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: ${fullScreen ? \"100vh\" : \"auto\"};\n\n  &.loading-container {\n    span > span {\n      width: ${loaderSize[size]};\n      height: ${loaderSize[size]};\n      background: ${loader.color};\n      margin: ${loaderMargin[size]};\n    }\n  }\n`;\n"],"names":["loaderMargin","md","lg","loaderSize","container","loader","fullScreen","size","css","color"],"mappings":";;;;;;;;;;AAGA,IAAMA,YAAY,GAAG;AACnBC,EAAAA,EAAE,EAAE,WAAW;AACfC,EAAAA,EAAE,EAAE,UAAA;AACN,CAAC,CAAA;AAED,IAAMC,UAAU,GAAG;AACjBF,EAAAA,EAAE,EAAE,UAAU;AACdC,EAAAA,EAAE,EAAE,SAAA;AACN,CAAC,CAAA;AAEYE,IAAAA,SAAS,GAAG,SAAZA,SAAS,CAAA,IAAA,EAAA,KAAA,EAAA;EAAA,IAClBC,MAAM,QAANA,MAAM,CAAA;EAAA,IACNC,UAAU,SAAVA,UAAU;AAAEC,IAAAA,IAAI,SAAJA,IAAI,CAAA;AAAA,EAAA;AAAA;AAAA;IACGC,GAAG,CAAA,2EAAA,EAKdF,UAAU,GAAG,OAAO,GAAG,MAAM,EAI1BH,uCAAAA,EAAAA,UAAU,CAACI,IAAI,CAAC,EAAA,UAAA,EACfJ,UAAU,CAACI,IAAI,CAAC,EAAA,cAAA,EACZF,MAAM,CAACI,KAAK,EAChBT,UAAAA,EAAAA,YAAY,CAACO,IAAI,CAAC,EAAA,KAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,mBAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,qrCAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,mBAAA,CAAA;AAAA,IAAA;AAAA;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../../src/components/Loaders/styles.ts"],"sourcesContent":["import { css, SerializedStyles } from \"@emotion/react\";\n\nexport const container = ({ fullScreen }: { fullScreen: boolean }): SerializedStyles => css`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: ${fullScreen ? \"100vh\" : \"auto\"};\n`;\n"],"names":["container","fullScreen","css"],"mappings":";;;;;;;;;;AAEaA,IAAAA,SAAS,GAAG,SAAZA,SAAS,CAAA,IAAA,EAAA;EAAA,IAAMC,UAAU,QAAVA,UAAU,CAAA;AAAA,EAAA;AAAA;AAAA;AAAkDC,IAAAA,GAAG,CAK/ED,2EAAAA,EAAAA,UAAU,GAAG,OAAO,GAAG,MAAM,EAAA,GAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,mBAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,6lBAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,mBAAA,CAAA;AAAA,IAAA;AAAA;;;;"}

package/dist/esm/src/components/MediaPlayer/AudioPlayer/AudioPlayer.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/MediaPlayer/MediaPlayer.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/MediaPlayer/VideoPlayer/VideoPlayer.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/MediaPlayer/VideoPlayer/styles.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Modal/Modal.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Modal/styles.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Pagination/Pagination.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Pagination/styles.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Pagination/usePagination.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/ProgressBar/ProgressBar.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/ProgressBar/styles.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Result/Result.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Result/styles.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 

package/dist/esm/src/components/Sidebar/NavHandle.js

@@ -2,32 +2,22 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 
 import 'react';
-import SvgHamburger from '../../icons/hamburger.svg.js';
-import NavItem from './NavItem.js';
 import { navHandleContainer } from './styles.js';
 import { createElement as jsx } from '../../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js';
 
 var NavHandle = function NavHandle(_ref) {
-  var isExpanded = _ref.isExpanded,
-    toggleMainNav = _ref.toggleMainNav,
-    _ref$navItemLabel = _ref.navItemLabel,
-    navItemLabel = _ref$navItemLabel === void 0 ? "" : _ref$navItemLabel;
+  var toggleMainNav = _ref.toggleMainNav,
+    children = _ref.children;
   return jsx("button", {
     className: "nav-handle",
     css: navHandleContainer,
     onClick: toggleMainNav
-  }, jsx(NavItem, {
-    label: navItemLabel,
-    isExpanded: isExpanded,
-    icon: jsx(SvgHamburger, {
-      height: 32
-    })
-  }));
+  }, children);
 };
 
 export { NavHandle as default };

package/dist/esm/src/components/Sidebar/NavHandle.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavHandle.js","sources":["../../../../../src/components/Sidebar/NavHandle.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { HamburgerSVG } from \"../../icons/\";\nimport NavItem from \"./NavItem\";\nimport { navHandleContainer } from \"./styles\";\n\nexport type NavHandleProps = {\n  isExpanded: boolean;\n  navItemLabel?: string;\n  toggleMainNav: () => void;\n};\n\nconst NavHandle: FC<NavHandleProps> = ({ isExpanded, toggleMainNav, navItemLabel = \"\" }) => {\n  return (\n    <button className=\"nav-handle\" css={navHandleContainer} onClick={toggleMainNav}>\n      <NavItem label={navItemLabel} isExpanded={isExpanded} icon={<HamburgerSVG height={32} />} />\n    </button>\n  );\n};\n\nexport default NavHandle;\n"],"names":["NavHandle","isExpanded","toggleMainNav","navItemLabel","___EmotionJSX","navHandleContainer","HamburgerSVG"],"mappings":";;;;;;;;;;;;;;AAWA,IAAMA,SAA6B,GAAG,SAAhCA,SAA6B,CAAyD,IAAA,EAAA;EAAA,IAAnDC,UAAU,QAAVA,UAAU;AAAEC,IAAAA,aAAa,QAAbA,aAAa;AAAA,IAAA,iBAAA,GAAA,IAAA,CAAEC,YAAY;AAAZA,IAAAA,YAAY,kCAAG,EAAE,GAAA,iBAAA,CAAA;EACnF,OACEC,GAAA,CAAA,QAAA,EAAA;AAAQ,IAAA,SAAS,EAAC,YAAY;AAAC,IAAA,GAAG,EAAEC,kBAAmB;AAAC,IAAA,OAAO,EAAEH,aAAAA;AAAc,GAAA,EAC7EE,IAAC,OAAO,EAAA;AAAC,IAAA,KAAK,EAAED,YAAa;AAAC,IAAA,UAAU,EAAEF,UAAW;IAAC,IAAI,EAAEG,IAACE,YAAY,EAAA;AAAC,MAAA,MAAM,EAAE,EAAA;AAAG,KAAA,CAAA;AAAI,GAAA,CAAG,CACrF,CAAA;AAEb;;;;"}
+{"version":3,"file":"NavHandle.js","sources":["../../../../../src/components/Sidebar/NavHandle.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { navHandleContainer } from \"./styles\";\n\nexport type NavHandleProps = {\n  toggleMainNav: () => void;\n};\n\nconst NavHandle: FC<NavHandleProps> = ({ toggleMainNav, children }) => {\n  return (\n    <button className=\"nav-handle\" css={navHandleContainer} onClick={toggleMainNav}>\n      {children}\n    </button>\n  );\n};\n\nexport default NavHandle;\n"],"names":["NavHandle","toggleMainNav","children","___EmotionJSX","navHandleContainer"],"mappings":";;;;;;;;;;;;AAOA,IAAMA,SAA6B,GAAG,SAAhCA,SAA6B,CAAoC,IAAA,EAAA;EAAA,IAA9BC,aAAa,QAAbA,aAAa;AAAEC,IAAAA,QAAQ,QAARA,QAAQ,CAAA;EAC9D,OACEC,GAAA,CAAA,QAAA,EAAA;AAAQ,IAAA,SAAS,EAAC,YAAY;AAAC,IAAA,GAAG,EAAEC,kBAAmB;AAAC,IAAA,OAAO,EAAEH,aAAAA;AAAc,GAAA,EAC5EC,QAAQ,CACF,CAAA;AAEb;;;;"}

package/dist/esm/src/components/Sidebar/NavItem.js

@@ -2,7 +2,7 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 
@@ -23,7 +23,7 @@ var labelVariants = {
   visible: function visible(_ref) {
     var isReducedMotion = _ref.isReducedMotion;
     return {
-      display: "block",
+      display: "-webkit-box",
       opacity: 1,
       x: 0,
       transition: {
@@ -49,6 +49,8 @@ var labelVariants = {
 var NavItem = function NavItem(_ref3) {
   var isExpanded = _ref3.isExpanded,
     label = _ref3.label,
+    _ref3$fontSize = _ref3.fontSize,
+    fontSize = _ref3$fontSize === void 0 ? "md" : _ref3$fontSize,
     icon = _ref3.icon,
     _ref3$isActive = _ref3.isActive,
     isActive = _ref3$isActive === void 0 ? false : _ref3$isActive;
@@ -58,9 +60,13 @@ var NavItem = function NavItem(_ref3) {
     "nav-item": true
   });
   return jsx("div", {
-    css: navItemContainer,
+    css: function css(theme) {
+      return navItemContainer(theme, fontSize);
+    },
     className: containerClassNames
-  }, icon, jsx(AnimatePresence, null, isExpanded && jsx(m.div, {
+  }, jsx("div", {
+    className: "icon-container"
+  }, icon), jsx(AnimatePresence, null, isExpanded && jsx(m.div, {
     className: "title",
     initial: "hidden",
     animate: "visible",

package/dist/esm/src/components/Sidebar/NavItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavItem.js","sources":["../../../../../src/components/Sidebar/NavItem.tsx"],"sourcesContent":["import React, { FC, ReactNode } from \"react\";\nimport { m, AnimatePresence, Variants, useReducedMotion } from \"framer-motion\";\nimport classNames from \"classnames\";\nimport { navItemContainer } from \"./styles\";\n\nexport type NavItemProps = FC<{\n  isExpanded: boolean;\n  icon: ReactNode;\n  label: string | JSX.Element;\n  isActive?: boolean;\n}>;\n\nconst labelVariants: Variants = {\n  hidden: {\n    display: \"none\",\n    opacity: 0,\n    x: -10,\n  },\n  visible: ({ isReducedMotion }) => ({\n    display: \"block\",\n    opacity: 1,\n    x: 0,\n    transition: {\n      duration: isReducedMotion ? 0 : 0.1,\n      delay: isReducedMotion ? 0 : 0.2,\n    },\n  }),\n  exit: ({ isReducedMotion }) => ({\n    opacity: 0,\n    x: -10,\n    transition: {\n      duration: isReducedMotion ? 0 : 0.1,\n    },\n    transitionEnd: {\n      display: \"none\",\n    },\n  }),\n};\n\nconst NavItem: NavItemProps = ({ isExpanded, label, icon, isActive = false }) => {\n  const isReducedMotion = useReducedMotion();\n  const containerClassNames = classNames({\n    selected: isActive,\n    \"nav-item\": true,\n  });\n\n  return (\n    <div css={navItemContainer} className={containerClassNames}>\n      {icon}\n      <AnimatePresence>\n        {isExpanded && (\n          <m.div\n            className=\"title\"\n            initial=\"hidden\"\n            animate=\"visible\"\n            exit=\"exit\"\n            variants={labelVariants}\n            custom={{ isReducedMotion }}\n          >\n            {label}\n          </m.div>\n        )}\n      </AnimatePresence>\n    </div>\n  );\n};\n\nexport default NavItem;\n"],"names":["labelVariants","hidden","display","opacity","x","visible","isReducedMotion","transition","duration","delay","exit","transitionEnd","NavItem","isExpanded","label","icon","isActive","useReducedMotion","containerClassNames","classNames","selected","___EmotionJSX","navItemContainer"],"mappings":";;;;;;;;;;;;;;;;AAYA,IAAMA,aAAuB,GAAG;AAC9BC,EAAAA,MAAM,EAAE;AACNC,IAAAA,OAAO,EAAE,MAAM;AACfC,IAAAA,OAAO,EAAE,CAAC;AACVC,IAAAA,CAAC,EAAE,CAAC,EAAA;GACL;AACDC,EAAAA,OAAO,EAAE,SAAA,OAAA,CAAA,IAAA,EAAA;IAAA,IAAGC,eAAe,QAAfA,eAAe,CAAA;IAAA,OAAQ;AACjCJ,MAAAA,OAAO,EAAE,OAAO;AAChBC,MAAAA,OAAO,EAAE,CAAC;AACVC,MAAAA,CAAC,EAAE,CAAC;AACJG,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEF,eAAe,GAAG,CAAC,GAAG,GAAG;AACnCG,QAAAA,KAAK,EAAEH,eAAe,GAAG,CAAC,GAAG,GAAA;AAC/B,OAAA;KACD,CAAA;GAAC;AACFI,EAAAA,IAAI,EAAE,SAAA,IAAA,CAAA,KAAA,EAAA;IAAA,IAAGJ,eAAe,SAAfA,eAAe,CAAA;IAAA,OAAQ;AAC9BH,MAAAA,OAAO,EAAE,CAAC;MACVC,CAAC,EAAE,CAAC,EAAE;AACNG,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEF,eAAe,GAAG,CAAC,GAAG,GAAA;OACjC;AACDK,MAAAA,aAAa,EAAE;AACbT,QAAAA,OAAO,EAAE,MAAA;AACX,OAAA;KACD,CAAA;AAAA,GAAA;AACH,CAAC,CAAA;AAED,IAAMU,OAAqB,GAAG,SAAxBA,OAAqB,CAAsD,KAAA,EAAA;EAAA,IAAhDC,UAAU,SAAVA,UAAU;AAAEC,IAAAA,KAAK,SAALA,KAAK;AAAEC,IAAAA,IAAI,SAAJA,IAAI;AAAA,IAAA,cAAA,GAAA,KAAA,CAAEC,QAAQ;AAARA,IAAAA,QAAQ,+BAAG,KAAK,GAAA,cAAA,CAAA;EACxE,IAAMV,eAAe,GAAGW,gBAAgB,EAAE,CAAA;EAC1C,IAAMC,mBAAmB,GAAGC,UAAU,CAAC;AACrCC,IAAAA,QAAQ,EAAEJ,QAAQ;AAClB,IAAA,UAAU,EAAE,IAAA;AACd,GAAC,CAAC,CAAA;EAEF,OACEK,GAAA,CAAA,KAAA,EAAA;AAAK,IAAA,GAAG,EAAEC,gBAAiB;AAAC,IAAA,SAAS,EAAEJ,mBAAAA;GACpCH,EAAAA,IAAI,EACLM,GAAA,CAAC,eAAe,EAAA,IAAA,EACbR,UAAU,IACTQ,GAAA,CAAC,CAAC,CAAC,GAAG,EAAA;AACJ,IAAA,SAAS,EAAC,OAAO;AACjB,IAAA,OAAO,EAAC,QAAQ;AAChB,IAAA,OAAO,EAAC,SAAS;AACjB,IAAA,IAAI,EAAC,MAAM;AACX,IAAA,QAAQ,EAAErB,aAAc;AACxB,IAAA,MAAM,EAAE;AAAEM,MAAAA,eAAe,EAAfA,eAAAA;AAAgB,KAAA;GAEzBQ,EAAAA,KAAK,CAET,CACe,CACd,CAAA;AAEV;;;;"}
+{"version":3,"file":"NavItem.js","sources":["../../../../../src/components/Sidebar/NavItem.tsx"],"sourcesContent":["import React, { FC, ReactNode } from \"react\";\nimport { m, AnimatePresence, Variants, useReducedMotion } from \"framer-motion\";\nimport classNames from \"classnames\";\nimport { navItemContainer } from \"./styles\";\nimport { TypographyLevels } from \"@theme/utils/typography\";\n\nexport type NavItemProps = FC<{\n  isExpanded: boolean;\n  icon: ReactNode;\n  label: string | JSX.Element;\n  fontSize?: TypographyLevels;\n  isActive?: boolean;\n}>;\n\nconst labelVariants: Variants = {\n  hidden: {\n    display: \"none\",\n    opacity: 0,\n    x: -10,\n  },\n  visible: ({ isReducedMotion }) => ({\n    display: \"-webkit-box\",\n    opacity: 1,\n    x: 0,\n    transition: {\n      duration: isReducedMotion ? 0 : 0.1,\n      delay: isReducedMotion ? 0 : 0.2,\n    },\n  }),\n  exit: ({ isReducedMotion }) => ({\n    opacity: 0,\n    x: -10,\n    transition: {\n      duration: isReducedMotion ? 0 : 0.1,\n    },\n    transitionEnd: {\n      display: \"none\",\n    },\n  }),\n};\n\nconst NavItem: NavItemProps = ({ isExpanded, label, fontSize = \"md\", icon, isActive = false }) => {\n  const isReducedMotion = useReducedMotion();\n  const containerClassNames = classNames({\n    selected: isActive,\n    \"nav-item\": true,\n  });\n\n  return (\n    <div css={(theme) => navItemContainer(theme, fontSize)} className={containerClassNames}>\n      <div className=\"icon-container\">{icon}</div>\n      <AnimatePresence>\n        {isExpanded && (\n          <m.div\n            className=\"title\"\n            initial=\"hidden\"\n            animate=\"visible\"\n            exit=\"exit\"\n            variants={labelVariants}\n            custom={{ isReducedMotion }}\n          >\n            {label}\n          </m.div>\n        )}\n      </AnimatePresence>\n    </div>\n  );\n};\n\nexport default NavItem;\n"],"names":["labelVariants","hidden","display","opacity","x","visible","isReducedMotion","transition","duration","delay","exit","transitionEnd","NavItem","isExpanded","label","fontSize","icon","isActive","useReducedMotion","containerClassNames","classNames","selected","___EmotionJSX","theme","navItemContainer"],"mappings":";;;;;;;;;;;;;;;;AAcA,IAAMA,aAAuB,GAAG;AAC9BC,EAAAA,MAAM,EAAE;AACNC,IAAAA,OAAO,EAAE,MAAM;AACfC,IAAAA,OAAO,EAAE,CAAC;AACVC,IAAAA,CAAC,EAAE,CAAC,EAAA;GACL;AACDC,EAAAA,OAAO,EAAE,SAAA,OAAA,CAAA,IAAA,EAAA;IAAA,IAAGC,eAAe,QAAfA,eAAe,CAAA;IAAA,OAAQ;AACjCJ,MAAAA,OAAO,EAAE,aAAa;AACtBC,MAAAA,OAAO,EAAE,CAAC;AACVC,MAAAA,CAAC,EAAE,CAAC;AACJG,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEF,eAAe,GAAG,CAAC,GAAG,GAAG;AACnCG,QAAAA,KAAK,EAAEH,eAAe,GAAG,CAAC,GAAG,GAAA;AAC/B,OAAA;KACD,CAAA;GAAC;AACFI,EAAAA,IAAI,EAAE,SAAA,IAAA,CAAA,KAAA,EAAA;IAAA,IAAGJ,eAAe,SAAfA,eAAe,CAAA;IAAA,OAAQ;AAC9BH,MAAAA,OAAO,EAAE,CAAC;MACVC,CAAC,EAAE,CAAC,EAAE;AACNG,MAAAA,UAAU,EAAE;AACVC,QAAAA,QAAQ,EAAEF,eAAe,GAAG,CAAC,GAAG,GAAA;OACjC;AACDK,MAAAA,aAAa,EAAE;AACbT,QAAAA,OAAO,EAAE,MAAA;AACX,OAAA;KACD,CAAA;AAAA,GAAA;AACH,CAAC,CAAA;AAED,IAAMU,OAAqB,GAAG,SAAxBA,OAAqB,CAAuE,KAAA,EAAA;EAAA,IAAjEC,UAAU,SAAVA,UAAU;AAAEC,IAAAA,KAAK,SAALA,KAAK;AAAA,IAAA,cAAA,GAAA,KAAA,CAAEC,QAAQ;AAARA,IAAAA,QAAQ,+BAAG,IAAI,GAAA,cAAA;AAAEC,IAAAA,IAAI,SAAJA,IAAI;AAAA,IAAA,cAAA,GAAA,KAAA,CAAEC,QAAQ;AAARA,IAAAA,QAAQ,+BAAG,KAAK,GAAA,cAAA,CAAA;EACzF,IAAMX,eAAe,GAAGY,gBAAgB,EAAE,CAAA;EAC1C,IAAMC,mBAAmB,GAAGC,UAAU,CAAC;AACrCC,IAAAA,QAAQ,EAAEJ,QAAQ;AAClB,IAAA,UAAU,EAAE,IAAA;AACd,GAAC,CAAC,CAAA;EAEF,OACEK,GAAA,CAAA,KAAA,EAAA;IAAK,GAAG,EAAE,aAACC,KAAK,EAAA;AAAA,MAAA,OAAKC,gBAAgB,CAACD,KAAK,EAAER,QAAQ,CAAC,CAAA;KAAC;AAAC,IAAA,SAAS,EAAEI,mBAAAA;GACjE,EAAAG,GAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,gBAAA;GAAkBN,EAAAA,IAAI,CAAO,EAC5CM,GAAC,CAAA,eAAe,EACbT,IAAAA,EAAAA,UAAU,IACTS,GAAA,CAAC,CAAC,CAAC,GAAG,EAAA;AACJ,IAAA,SAAS,EAAC,OAAO;AACjB,IAAA,OAAO,EAAC,QAAQ;AAChB,IAAA,OAAO,EAAC,SAAS;AACjB,IAAA,IAAI,EAAC,MAAM;AACX,IAAA,QAAQ,EAAEtB,aAAc;AACxB,IAAA,MAAM,EAAE;AAAEM,MAAAA,eAAe,EAAfA,eAAAA;AAAgB,KAAA;GAEzBQ,EAAAA,KAAK,CAET,CACe,CACd,CAAA;AAEV;;;;"}

package/dist/esm/src/components/Sidebar/Sidebar.js

@@ -2,12 +2,13 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 
 import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import 'react';
+import SvgHamburger from '../../icons/hamburger.svg.js';
 import { mainNavContainer } from './styles.js';
 import NavItem from './NavItem.js';
 import NavHandle from './NavHandle.js';
@@ -17,41 +18,18 @@ import { m } from '../../../node_modules/framer-motion/dist/es/render/dom/motion
 import { domAnimation } from '../../../node_modules/framer-motion/dist/es/render/dom/features-animation.mjs.js';
 import { LazyMotion } from '../../../node_modules/framer-motion/dist/es/components/LazyMotion/index.mjs.js';
 
-var _excluded = ["isCollapsed", "navHandleLabel", "onToggle", "children"];
-var navVariants = {
-  expanded: {
-    minWidth: "15rem",
-    transition: {
-      ease: "easeInOut",
-      duration: 0.2
-    }
-  },
-  collapsed: {
-    minWidth: "4.75rem",
-    transition: {
-      ease: "easeInOut",
-      duration: 0.2,
-      delay: 0.1
-    }
-  },
-  a11yExpanded: {
-    minWidth: "15rem",
-    transition: {
-      duration: 0
-    }
-  },
-  a11yCollapsed: {
-    minWidth: "4.75rem",
-    transition: {
-      duration: 0
-    }
-  }
-};
+var _excluded = ["isCollapsed", "navHandleLabel", "fontSize", "expandedWidth", "collapsedWidth", "onToggle", "children"];
 var Sidebar = function Sidebar(_ref) {
   var _ref$isCollapsed = _ref.isCollapsed,
     isCollapsed = _ref$isCollapsed === void 0 ? false : _ref$isCollapsed,
     _ref$navHandleLabel = _ref.navHandleLabel,
     navHandleLabel = _ref$navHandleLabel === void 0 ? "Menu" : _ref$navHandleLabel,
+    _ref$fontSize = _ref.fontSize,
+    fontSize = _ref$fontSize === void 0 ? "md" : _ref$fontSize,
+    _ref$expandedWidth = _ref.expandedWidth,
+    expandedWidth = _ref$expandedWidth === void 0 ? "16rem" : _ref$expandedWidth,
+    _ref$collapsedWidth = _ref.collapsedWidth,
+    collapsedWidth = _ref$collapsedWidth === void 0 ? "5rem" : _ref$collapsedWidth,
     _ref$onToggle = _ref.onToggle,
     onToggle = _ref$onToggle === void 0 ? function () {
       return void 0;
@@ -60,6 +38,35 @@ var Sidebar = function Sidebar(_ref) {
     rest = _objectWithoutProperties(_ref, _excluded);
   var isReducedMotion = useReducedMotion();
   var animate;
+  var navVariants = {
+    expanded: {
+      minWidth: expandedWidth,
+      transition: {
+        ease: "easeInOut",
+        duration: 0.2
+      }
+    },
+    collapsed: {
+      minWidth: collapsedWidth,
+      transition: {
+        ease: "easeInOut",
+        duration: 0.2,
+        delay: 0.1
+      }
+    },
+    a11yExpanded: {
+      minWidth: expandedWidth,
+      transition: {
+        duration: 0
+      }
+    },
+    a11yCollapsed: {
+      minWidth: collapsedWidth,
+      transition: {
+        duration: 0
+      }
+    }
+  };
   if (isReducedMotion) {
     animate = isCollapsed ? "a11yCollapsed" : "a11yExpanded";
   } else {
@@ -68,7 +75,9 @@ var Sidebar = function Sidebar(_ref) {
   return jsx(LazyMotion, {
     features: domAnimation
   }, jsx(m.nav, _extends({
-    css: mainNavContainer,
+    css: function css(theme) {
+      return mainNavContainer(theme, expandedWidth);
+    },
     initial: false,
     animate: animate,
     variants: navVariants,
@@ -76,10 +85,15 @@ var Sidebar = function Sidebar(_ref) {
   }, rest), jsx("div", {
     className: "nav-items-wrapper"
   }, jsx(NavHandle, {
-    isExpanded: !isCollapsed,
-    navItemLabel: navHandleLabel,
     toggleMainNav: onToggle
-  }), children)));
+  }, jsx(NavItem, {
+    label: navHandleLabel,
+    isExpanded: !isCollapsed,
+    icon: jsx(SvgHamburger, {
+      height: 32
+    }),
+    fontSize: fontSize
+  })), children)));
 };
 Sidebar.Item = NavItem;
 

package/dist/esm/src/components/Sidebar/Sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.js","sources":["../../../../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport {\n  LazyMotion,\n  m,\n  useReducedMotion,\n  Variants,\n  domAnimation,\n  HTMLMotionProps,\n} from \"framer-motion\";\nimport { mainNavContainer } from \"./styles\";\nimport NavItem, { NavItemProps } from \"./NavItem\";\nimport NavHandle from \"./NavHandle\";\n\nexport type SidebarProps = HTMLMotionProps<\"nav\"> & {\n  isCollapsed?: boolean;\n  navHandleLabel?: string;\n  onToggle?: () => void;\n};\n\ntype SidebarCompoundProps = {\n  Item: NavItemProps;\n};\n\nconst navVariants: Variants = {\n  expanded: {\n    minWidth: \"15rem\",\n    transition: {\n      ease: \"easeInOut\",\n      duration: 0.2,\n    },\n  },\n  collapsed: {\n    minWidth: \"4.75rem\",\n    transition: {\n      ease: \"easeInOut\",\n      duration: 0.2,\n      delay: 0.1,\n    },\n  },\n  a11yExpanded: {\n    minWidth: \"15rem\",\n    transition: {\n      duration: 0,\n    },\n  },\n  a11yCollapsed: {\n    minWidth: \"4.75rem\",\n    transition: {\n      duration: 0,\n    },\n  },\n};\n\nconst Sidebar: FC<SidebarProps> & SidebarCompoundProps = ({\n  isCollapsed = false,\n  navHandleLabel = \"Menu\",\n  onToggle = () => void 0,\n  children,\n  ...rest\n}) => {\n  const isReducedMotion = useReducedMotion();\n  let animate: string;\n\n  if (isReducedMotion) {\n    animate = isCollapsed ? \"a11yCollapsed\" : \"a11yExpanded\";\n  } else {\n    animate = isCollapsed ? \"collapsed\" : \"expanded\";\n  }\n\n  return (\n    <LazyMotion features={domAnimation}>\n      <m.nav\n        css={mainNavContainer}\n        initial={false}\n        animate={animate}\n        variants={navVariants}\n        id=\"sidebar\"\n        {...rest}\n      >\n        <div className=\"nav-items-wrapper\">\n          <NavHandle\n            isExpanded={!isCollapsed}\n            navItemLabel={navHandleLabel}\n            toggleMainNav={onToggle}\n          />\n          {children}\n        </div>\n      </m.nav>\n    </LazyMotion>\n  );\n};\n\nSidebar.Item = NavItem;\n\nexport default Sidebar;\n"],"names":["navVariants","expanded","minWidth","transition","ease","duration","collapsed","delay","a11yExpanded","a11yCollapsed","Sidebar","isCollapsed","navHandleLabel","onToggle","children","rest","isReducedMotion","useReducedMotion","animate","___EmotionJSX","domAnimation","mainNavContainer","Item","NavItem"],"mappings":";;;;;;;;;;;;;;;;;;;;AAuBA,IAAMA,WAAqB,GAAG;AAC5BC,EAAAA,QAAQ,EAAE;AACRC,IAAAA,QAAQ,EAAE,OAAO;AACjBC,IAAAA,UAAU,EAAE;AACVC,MAAAA,IAAI,EAAE,WAAW;AACjBC,MAAAA,QAAQ,EAAE,GAAA;AACZ,KAAA;GACD;AACDC,EAAAA,SAAS,EAAE;AACTJ,IAAAA,QAAQ,EAAE,SAAS;AACnBC,IAAAA,UAAU,EAAE;AACVC,MAAAA,IAAI,EAAE,WAAW;AACjBC,MAAAA,QAAQ,EAAE,GAAG;AACbE,MAAAA,KAAK,EAAE,GAAA;AACT,KAAA;GACD;AACDC,EAAAA,YAAY,EAAE;AACZN,IAAAA,QAAQ,EAAE,OAAO;AACjBC,IAAAA,UAAU,EAAE;AACVE,MAAAA,QAAQ,EAAE,CAAA;AACZ,KAAA;GACD;AACDI,EAAAA,aAAa,EAAE;AACbP,IAAAA,QAAQ,EAAE,SAAS;AACnBC,IAAAA,UAAU,EAAE;AACVE,MAAAA,QAAQ,EAAE,CAAA;AACZ,KAAA;AACF,GAAA;AACF,CAAC,CAAA;AAED,IAAMK,OAAgD,GAAG,SAAnDA,OAAgD,CAMhD,IAAA,EAAA;AAAA,EAAA,IAAA,gBAAA,GAAA,IAAA,CALJC,WAAW;AAAXA,IAAAA,WAAW,iCAAG,KAAK,GAAA,gBAAA;AAAA,IAAA,mBAAA,GAAA,IAAA,CACnBC,cAAc;AAAdA,IAAAA,cAAc,oCAAG,MAAM,GAAA,mBAAA;AAAA,IAAA,aAAA,GAAA,IAAA,CACvBC,QAAQ;AAARA,IAAAA,QAAQ,GAAG,aAAA,KAAA,KAAA,CAAA,GAAA,YAAA;AAAA,MAAA,OAAM,KAAK,CAAC,CAAA;AAAA,KAAA,GAAA,aAAA;AACvBC,IAAAA,QAAQ,QAARA,QAAQ;IACLC,IAAI,GAAA,wBAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;EAEP,IAAMC,eAAe,GAAGC,gBAAgB,EAAE,CAAA;AAC1C,EAAA,IAAIC,OAAe,CAAA;AAEnB,EAAA,IAAIF,eAAe,EAAE;AACnBE,IAAAA,OAAO,GAAGP,WAAW,GAAG,eAAe,GAAG,cAAc,CAAA;AAC1D,GAAC,MAAM;AACLO,IAAAA,OAAO,GAAGP,WAAW,GAAG,WAAW,GAAG,UAAU,CAAA;AAClD,GAAA;AAEA,EAAA,OACEQ,IAAC,UAAU,EAAA;AAAC,IAAA,QAAQ,EAAEC,YAAAA;GACpB,EAAAD,GAAA,CAAC,CAAC,CAAC,GAAG,EAAA,QAAA,CAAA;AACJ,IAAA,GAAG,EAAEE,gBAAiB;AACtB,IAAA,OAAO,EAAE,KAAM;AACf,IAAA,OAAO,EAAEH,OAAQ;AACjB,IAAA,QAAQ,EAAElB,WAAY;AACtB,IAAA,EAAE,EAAC,SAAA;AAAS,GAAA,EACRe,IAAI,CAER,EAAAI,GAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,mBAAA;AAAmB,GAAA,EAChCA,IAAC,SAAS,EAAA;IACR,UAAU,EAAE,CAACR,WAAY;AACzB,IAAA,YAAY,EAAEC,cAAe;AAC7B,IAAA,aAAa,EAAEC,QAAAA;AAAS,GAAA,CACxB,EACDC,QAAQ,CACL,CACA,CACG,CAAA;AAEjB,EAAC;AAEDJ,OAAO,CAACY,IAAI,GAAGC,OAAO;;;;"}
+{"version":3,"file":"Sidebar.js","sources":["../../../../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport {\n  LazyMotion,\n  m,\n  useReducedMotion,\n  Variants,\n  domAnimation,\n  HTMLMotionProps,\n} from \"framer-motion\";\nimport { HamburgerSVG } from \"../../icons\";\nimport { mainNavContainer } from \"./styles\";\nimport NavItem, { NavItemProps } from \"./NavItem\";\nimport NavHandle from \"./NavHandle\";\nimport { TypographyLevels } from \"@theme/utils/typography\";\n\nexport type SidebarProps = HTMLMotionProps<\"nav\"> & {\n  isCollapsed?: boolean;\n  navHandleLabel?: string;\n  fontSize?: TypographyLevels;\n  expandedWidth?: string;\n  collapsedWidth?: string;\n  onToggle?: () => void;\n};\n\ntype SidebarCompoundProps = {\n  Item: NavItemProps;\n};\n\nconst Sidebar: FC<SidebarProps> & SidebarCompoundProps = ({\n  isCollapsed = false,\n  navHandleLabel = \"Menu\",\n  fontSize = \"md\",\n  expandedWidth = \"16rem\",\n  collapsedWidth = \"5rem\",\n  onToggle = () => void 0,\n  children,\n  ...rest\n}) => {\n  const isReducedMotion = useReducedMotion();\n  let animate: string;\n\n  const navVariants: Variants = {\n    expanded: {\n      minWidth: expandedWidth,\n      transition: {\n        ease: \"easeInOut\",\n        duration: 0.2,\n      },\n    },\n    collapsed: {\n      minWidth: collapsedWidth,\n      transition: {\n        ease: \"easeInOut\",\n        duration: 0.2,\n        delay: 0.1,\n      },\n    },\n    a11yExpanded: {\n      minWidth: expandedWidth,\n      transition: {\n        duration: 0,\n      },\n    },\n    a11yCollapsed: {\n      minWidth: collapsedWidth,\n      transition: {\n        duration: 0,\n      },\n    },\n  };\n\n  if (isReducedMotion) {\n    animate = isCollapsed ? \"a11yCollapsed\" : \"a11yExpanded\";\n  } else {\n    animate = isCollapsed ? \"collapsed\" : \"expanded\";\n  }\n\n  return (\n    <LazyMotion features={domAnimation}>\n      <m.nav\n        css={(theme) => mainNavContainer(theme, expandedWidth)}\n        initial={false}\n        animate={animate}\n        variants={navVariants}\n        id=\"sidebar\"\n        {...rest}\n      >\n        <div className=\"nav-items-wrapper\">\n          <NavHandle toggleMainNav={onToggle}>\n            <NavItem\n              label={navHandleLabel}\n              isExpanded={!isCollapsed}\n              icon={<HamburgerSVG height={32} />}\n              fontSize={fontSize}\n            />\n          </NavHandle>\n          {children}\n        </div>\n      </m.nav>\n    </LazyMotion>\n  );\n};\n\nSidebar.Item = NavItem;\n\nexport default Sidebar;\n"],"names":["Sidebar","isCollapsed","navHandleLabel","fontSize","expandedWidth","collapsedWidth","onToggle","children","rest","isReducedMotion","useReducedMotion","animate","navVariants","expanded","minWidth","transition","ease","duration","collapsed","delay","a11yExpanded","a11yCollapsed","___EmotionJSX","domAnimation","theme","mainNavContainer","HamburgerSVG","Item","NavItem"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA4BA,IAAMA,OAAgD,GAAG,SAAnDA,OAAgD,CAShD,IAAA,EAAA;AAAA,EAAA,IAAA,gBAAA,GAAA,IAAA,CARJC,WAAW;AAAXA,IAAAA,WAAW,iCAAG,KAAK,GAAA,gBAAA;AAAA,IAAA,mBAAA,GAAA,IAAA,CACnBC,cAAc;AAAdA,IAAAA,cAAc,oCAAG,MAAM,GAAA,mBAAA;AAAA,IAAA,aAAA,GAAA,IAAA,CACvBC,QAAQ;AAARA,IAAAA,QAAQ,8BAAG,IAAI,GAAA,aAAA;AAAA,IAAA,kBAAA,GAAA,IAAA,CACfC,aAAa;AAAbA,IAAAA,aAAa,mCAAG,OAAO,GAAA,kBAAA;AAAA,IAAA,mBAAA,GAAA,IAAA,CACvBC,cAAc;AAAdA,IAAAA,cAAc,oCAAG,MAAM,GAAA,mBAAA;AAAA,IAAA,aAAA,GAAA,IAAA,CACvBC,QAAQ;AAARA,IAAAA,QAAQ,GAAG,aAAA,KAAA,KAAA,CAAA,GAAA,YAAA;AAAA,MAAA,OAAM,KAAK,CAAC,CAAA;AAAA,KAAA,GAAA,aAAA;AACvBC,IAAAA,QAAQ,QAARA,QAAQ;IACLC,IAAI,GAAA,wBAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;EAEP,IAAMC,eAAe,GAAGC,gBAAgB,EAAE,CAAA;AAC1C,EAAA,IAAIC,OAAe,CAAA;AAEnB,EAAA,IAAMC,WAAqB,GAAG;AAC5BC,IAAAA,QAAQ,EAAE;AACRC,MAAAA,QAAQ,EAAEV,aAAa;AACvBW,MAAAA,UAAU,EAAE;AACVC,QAAAA,IAAI,EAAE,WAAW;AACjBC,QAAAA,QAAQ,EAAE,GAAA;AACZ,OAAA;KACD;AACDC,IAAAA,SAAS,EAAE;AACTJ,MAAAA,QAAQ,EAAET,cAAc;AACxBU,MAAAA,UAAU,EAAE;AACVC,QAAAA,IAAI,EAAE,WAAW;AACjBC,QAAAA,QAAQ,EAAE,GAAG;AACbE,QAAAA,KAAK,EAAE,GAAA;AACT,OAAA;KACD;AACDC,IAAAA,YAAY,EAAE;AACZN,MAAAA,QAAQ,EAAEV,aAAa;AACvBW,MAAAA,UAAU,EAAE;AACVE,QAAAA,QAAQ,EAAE,CAAA;AACZ,OAAA;KACD;AACDI,IAAAA,aAAa,EAAE;AACbP,MAAAA,QAAQ,EAAET,cAAc;AACxBU,MAAAA,UAAU,EAAE;AACVE,QAAAA,QAAQ,EAAE,CAAA;AACZ,OAAA;AACF,KAAA;GACD,CAAA;AAED,EAAA,IAAIR,eAAe,EAAE;AACnBE,IAAAA,OAAO,GAAGV,WAAW,GAAG,eAAe,GAAG,cAAc,CAAA;AAC1D,GAAC,MAAM;AACLU,IAAAA,OAAO,GAAGV,WAAW,GAAG,WAAW,GAAG,UAAU,CAAA;AAClD,GAAA;AAEA,EAAA,OACEqB,IAAC,UAAU,EAAA;AAAC,IAAA,QAAQ,EAAEC,YAAAA;GACpB,EAAAD,GAAA,CAAC,CAAC,CAAC,GAAG,EAAA,QAAA,CAAA;IACJ,GAAG,EAAE,aAACE,KAAK,EAAA;AAAA,MAAA,OAAKC,gBAAgB,CAACD,KAAK,EAAEpB,aAAa,CAAC,CAAA;KAAC;AACvD,IAAA,OAAO,EAAE,KAAM;AACf,IAAA,OAAO,EAAEO,OAAQ;AACjB,IAAA,QAAQ,EAAEC,WAAY;AACtB,IAAA,EAAE,EAAC,SAAA;AAAS,GAAA,EACRJ,IAAI,CAER,EAAAc,GAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,mBAAA;AAAmB,GAAA,EAChCA,IAAC,SAAS,EAAA;AAAC,IAAA,aAAa,EAAEhB,QAAAA;AAAS,GAAA,EACjCgB,IAAC,OAAO,EAAA;AACN,IAAA,KAAK,EAAEpB,cAAe;IACtB,UAAU,EAAE,CAACD,WAAY;IACzB,IAAI,EAAEqB,IAACI,YAAY,EAAA;AAAC,MAAA,MAAM,EAAE,EAAA;KAAO,CAAA;AACnC,IAAA,QAAQ,EAAEvB,QAAAA;AAAS,GAAA,CACnB,CACQ,EACXI,QAAQ,CACL,CACA,CACG,CAAA;AAEjB,EAAC;AAEDP,OAAO,CAAC2B,IAAI,GAAGC,OAAO;;;;"}

package/dist/esm/src/components/Sidebar/styles.js

@@ -2,18 +2,18 @@
   /**
    * @license
    * author: epignosis front-end team
-   * @epignosis_llc/gnosis.js v3.0.1
+   * @epignosis_llc/gnosis.js v3.0.2
    * Released under the MIT license.
    */
 
 import { css } from '../../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js';
 
-var mainNavContainer = function mainNavContainer(_ref) {
+var mainNavContainer = function mainNavContainer(_ref, width) {
   var sidebar = _ref.sidebar;
   return (
     /*#__PURE__*/
     /*#__PURE__*/
-    css("position:sticky;top:0;display:flex;flex-direction:column;height:100vh;background:", sidebar.background, ";color:", sidebar.color, ";z-index:1001;.nav-items-wrapper{display:flex;flex-direction:column;flex:1;margin:0 0 1.75rem;}" + (process.env.NODE_ENV === "production" ? "" : ";label:mainNavContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFNkUiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzLCBUaGVtZSB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuXG5leHBvcnQgY29uc3QgbWFpbk5hdkNvbnRhaW5lciA9ICh7IHNpZGViYXIgfTogVGhlbWUpOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgcG9zaXRpb246IHN0aWNreTtcbiAgdG9wOiAwO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBoZWlnaHQ6IDEwMHZoO1xuICBiYWNrZ3JvdW5kOiAke3NpZGViYXIuYmFja2dyb3VuZH07XG4gIGNvbG9yOiAke3NpZGViYXIuY29sb3J9O1xuICB6LWluZGV4OiAxMDAxO1xuXG4gIC5uYXYtaXRlbXMtd3JhcHBlciB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgIGZsZXg6IDE7XG4gICAgbWFyZ2luOiAwIDAgMS43NXJlbTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IG5hdkhhbmRsZUNvbnRhaW5lciA9ICh7IHNpZGViYXIgfTogVGhlbWUpOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgbWluLWhlaWdodDogNC41cmVtO1xuICB3aWR0aDogMTAwJTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIHBhZGRpbmc6IDA7XG4gIGJvcmRlcjogMDtcblxuICAubmF2LWl0ZW0ge1xuICAgIGhlaWdodDogMTAwJTtcbiAgICBib3JkZXItYm90dG9tOiAxcHggc29saWQgJHtzaWRlYmFyLmJvcmRlcn07XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBuYXZJdGVtQ29udGFpbmVyID0gKHsgc2lkZWJhciB9OiBUaGVtZSk6IFNlcmlhbGl6ZWRTdHlsZXMgPT4gY3NzYFxuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBjb2xvcjogJHtzaWRlYmFyLmNvbG9yfTtcbiAgcGFkZGluZzogMC42MjVyZW0gMS41cmVtO1xuXG4gICY6aG92ZXIsXG4gICYuc2VsZWN0ZWQsXG4gICYuZm9jdXMtdmlzaWJsZSB7XG4gICAgYmFja2dyb3VuZDogJHtzaWRlYmFyLmJhY2tncm91bmRIb3Zlcn07XG4gICAgY29sb3I6ICR7c2lkZWJhci5jb2xvckhvdmVyfTtcbiAgfVxuXG4gICYucHJvZmlsZS1pdGVtIHtcbiAgICBwYWRkaW5nOiAwLjVyZW0gMS4xMjVyZW07XG5cbiAgICBpbWcge1xuICAgICAgYm9yZGVyOiBub25lO1xuICAgIH1cblxuICAgIC50aXRsZSB7XG4gICAgICBtYXJnaW4tbGVmdDogMC4yNXJlbTtcbiAgICB9XG4gIH1cblxuICAudGl0bGUge1xuICAgIG1hcmdpbi1sZWZ0OiAwLjVyZW07XG4gIH1cbmA7XG4iXX0= */", process.env.NODE_ENV === "production" ? "" : ";label:mainNavContainer;")
+    css("position:sticky;top:0;display:flex;flex-direction:column;height:100vh;background:", sidebar.background, ";color:", sidebar.color, ";z-index:1001;max-width:", width, ";.nav-items-wrapper{display:flex;flex-direction:column;flex:1;margin:1.5rem 0;}" + (process.env.NODE_ENV === "production" ? "" : ";label:mainNavContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFHNEYiLCJmaWxlIjoic3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzLCBUaGVtZSB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgVHlwb2dyYXBoeUxldmVscyB9IGZyb20gXCJAdGhlbWUvdXRpbHMvdHlwb2dyYXBoeVwiO1xuXG5leHBvcnQgY29uc3QgbWFpbk5hdkNvbnRhaW5lciA9ICh7IHNpZGViYXIgfTogVGhlbWUsIHdpZHRoOiBzdHJpbmcpOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgcG9zaXRpb246IHN0aWNreTtcbiAgdG9wOiAwO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBoZWlnaHQ6IDEwMHZoO1xuICBiYWNrZ3JvdW5kOiAke3NpZGViYXIuYmFja2dyb3VuZH07XG4gIGNvbG9yOiAke3NpZGViYXIuY29sb3J9O1xuICB6LWluZGV4OiAxMDAxO1xuICBtYXgtd2lkdGg6ICR7d2lkdGh9O1xuXG4gIC5uYXYtaXRlbXMtd3JhcHBlciB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICAgIGZsZXg6IDE7XG4gICAgbWFyZ2luOiAxLjVyZW0gMDtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IG5hdkhhbmRsZUNvbnRhaW5lciA9ICh7IHNpZGViYXIgfTogVGhlbWUpOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIHBhZGRpbmc6IDA7XG4gIGJvcmRlcjogMDtcblxuICAubmF2LWl0ZW0ge1xuICAgIGhlaWdodDogMTAwJTtcbiAgICBib3JkZXItYm90dG9tOiAxcHggc29saWQgJHtzaWRlYmFyLmJvcmRlcn07XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBuYXZJdGVtQ29udGFpbmVyID0gKFxuICB7IHNpZGViYXIsIHR5cGVTY2FsZVNpemVzIH06IFRoZW1lLFxuICBmb250U2l6ZTogVHlwb2dyYXBoeUxldmVscyxcbik6IFNlcmlhbGl6ZWRTdHlsZXMgPT4gY3NzYFxuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBjb2xvcjogJHtzaWRlYmFyLmNvbG9yfTtcbiAgcGFkZGluZzogMC4yNXJlbSAxLjVyZW07XG5cbiAgLmljb24tY29udGFpbmVyIHtcbiAgICBoZWlnaHQ6IDJyZW07XG4gIH1cblxuICAmOmhvdmVyLFxuICAmLnNlbGVjdGVkLFxuICAmLmZvY3VzLXZpc2libGUge1xuICAgIGJhY2tncm91bmQ6ICR7c2lkZWJhci5iYWNrZ3JvdW5kSG92ZXJ9O1xuICAgIGNvbG9yOiAke3NpZGViYXIuY29sb3JIb3Zlcn07XG4gIH1cblxuICAmLnByb2ZpbGUtaXRlbSB7XG4gICAgcGFkZGluZzogMC41cmVtIDEuMTI1cmVtO1xuXG4gICAgaW1nIHtcbiAgICAgIGJvcmRlcjogbm9uZTtcbiAgICB9XG5cbiAgICAudGl0bGUge1xuICAgICAgbWFyZ2luLWxlZnQ6IDAuMjVyZW07XG4gICAgfVxuICB9XG5cbiAgLnRpdGxlIHtcbiAgICBtYXJnaW4tbGVmdDogMC41cmVtO1xuICAgIGZvbnQtc2l6ZTogJHt0eXBlU2NhbGVTaXplc1tmb250U2l6ZV19O1xuICAgIGRpc3BsYXk6IC13ZWJraXQtYm94O1xuICAgIC13ZWJraXQtbGluZS1jbGFtcDogMjtcbiAgICAtd2Via2l0LWJveC1vcmllbnQ6IHZlcnRpY2FsO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7XG4gICAgd29yZC1icmVhazogYnJlYWstd29yZDtcbiAgfVxuYDtcbiJdfQ== */", process.env.NODE_ENV === "production" ? "" : ";label:mainNavContainer;")
   );
 };
 var navHandleContainer = function navHandleContainer(_ref2) {
@@ -21,15 +21,16 @@ var navHandleContainer = function navHandleContainer(_ref2) {
   return (
     /*#__PURE__*/
     /*#__PURE__*/
-    css("min-height:4.5rem;width:100%;background-color:transparent;padding:0;border:0;.nav-item{height:100%;border-bottom:1px solid ", sidebar.border, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:navHandleContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQitFIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgU2VyaWFsaXplZFN0eWxlcywgVGhlbWUgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcblxuZXhwb3J0IGNvbnN0IG1haW5OYXZDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIHBvc2l0aW9uOiBzdGlja3k7XG4gIHRvcDogMDtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgaGVpZ2h0OiAxMDB2aDtcbiAgYmFja2dyb3VuZDogJHtzaWRlYmFyLmJhY2tncm91bmR9O1xuICBjb2xvcjogJHtzaWRlYmFyLmNvbG9yfTtcbiAgei1pbmRleDogMTAwMTtcblxuICAubmF2LWl0ZW1zLXdyYXBwZXIge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBmbGV4OiAxO1xuICAgIG1hcmdpbjogMCAwIDEuNzVyZW07XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBuYXZIYW5kbGVDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIG1pbi1oZWlnaHQ6IDQuNXJlbTtcbiAgd2lkdGg6IDEwMCU7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBwYWRkaW5nOiAwO1xuICBib3JkZXI6IDA7XG5cbiAgLm5hdi1pdGVtIHtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7c2lkZWJhci5ib3JkZXJ9O1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgbmF2SXRlbUNvbnRhaW5lciA9ICh7IHNpZGViYXIgfTogVGhlbWUpOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgY29sb3I6ICR7c2lkZWJhci5jb2xvcn07XG4gIHBhZGRpbmc6IDAuNjI1cmVtIDEuNXJlbTtcblxuICAmOmhvdmVyLFxuICAmLnNlbGVjdGVkLFxuICAmLmZvY3VzLXZpc2libGUge1xuICAgIGJhY2tncm91bmQ6ICR7c2lkZWJhci5iYWNrZ3JvdW5kSG92ZXJ9O1xuICAgIGNvbG9yOiAke3NpZGViYXIuY29sb3JIb3Zlcn07XG4gIH1cblxuICAmLnByb2ZpbGUtaXRlbSB7XG4gICAgcGFkZGluZzogMC41cmVtIDEuMTI1cmVtO1xuXG4gICAgaW1nIHtcbiAgICAgIGJvcmRlcjogbm9uZTtcbiAgICB9XG5cbiAgICAudGl0bGUge1xuICAgICAgbWFyZ2luLWxlZnQ6IDAuMjVyZW07XG4gICAgfVxuICB9XG5cbiAgLnRpdGxlIHtcbiAgICBtYXJnaW4tbGVmdDogMC41cmVtO1xuICB9XG5gO1xuIl19 */", process.env.NODE_ENV === "production" ? "" : ";label:navHandleContainer;")
+    css("background-color:transparent;padding:0;border:0;.nav-item{height:100%;border-bottom:1px solid ", sidebar.border, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:navHandleContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQitFIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgU2VyaWFsaXplZFN0eWxlcywgVGhlbWUgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IFR5cG9ncmFwaHlMZXZlbHMgfSBmcm9tIFwiQHRoZW1lL3V0aWxzL3R5cG9ncmFwaHlcIjtcblxuZXhwb3J0IGNvbnN0IG1haW5OYXZDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lLCB3aWR0aDogc3RyaW5nKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIHBvc2l0aW9uOiBzdGlja3k7XG4gIHRvcDogMDtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgaGVpZ2h0OiAxMDB2aDtcbiAgYmFja2dyb3VuZDogJHtzaWRlYmFyLmJhY2tncm91bmR9O1xuICBjb2xvcjogJHtzaWRlYmFyLmNvbG9yfTtcbiAgei1pbmRleDogMTAwMTtcbiAgbWF4LXdpZHRoOiAke3dpZHRofTtcblxuICAubmF2LWl0ZW1zLXdyYXBwZXIge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBmbGV4OiAxO1xuICAgIG1hcmdpbjogMS41cmVtIDA7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBuYXZIYW5kbGVDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBwYWRkaW5nOiAwO1xuICBib3JkZXI6IDA7XG5cbiAgLm5hdi1pdGVtIHtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7c2lkZWJhci5ib3JkZXJ9O1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgbmF2SXRlbUNvbnRhaW5lciA9IChcbiAgeyBzaWRlYmFyLCB0eXBlU2NhbGVTaXplcyB9OiBUaGVtZSxcbiAgZm9udFNpemU6IFR5cG9ncmFwaHlMZXZlbHMsXG4pOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgY29sb3I6ICR7c2lkZWJhci5jb2xvcn07XG4gIHBhZGRpbmc6IDAuMjVyZW0gMS41cmVtO1xuXG4gIC5pY29uLWNvbnRhaW5lciB7XG4gICAgaGVpZ2h0OiAycmVtO1xuICB9XG5cbiAgJjpob3ZlcixcbiAgJi5zZWxlY3RlZCxcbiAgJi5mb2N1cy12aXNpYmxlIHtcbiAgICBiYWNrZ3JvdW5kOiAke3NpZGViYXIuYmFja2dyb3VuZEhvdmVyfTtcbiAgICBjb2xvcjogJHtzaWRlYmFyLmNvbG9ySG92ZXJ9O1xuICB9XG5cbiAgJi5wcm9maWxlLWl0ZW0ge1xuICAgIHBhZGRpbmc6IDAuNXJlbSAxLjEyNXJlbTtcblxuICAgIGltZyB7XG4gICAgICBib3JkZXI6IG5vbmU7XG4gICAgfVxuXG4gICAgLnRpdGxlIHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAwLjI1cmVtO1xuICAgIH1cbiAgfVxuXG4gIC50aXRsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDAuNXJlbTtcbiAgICBmb250LXNpemU6ICR7dHlwZVNjYWxlU2l6ZXNbZm9udFNpemVdfTtcbiAgICBkaXNwbGF5OiAtd2Via2l0LWJveDtcbiAgICAtd2Via2l0LWxpbmUtY2xhbXA6IDI7XG4gICAgLXdlYmtpdC1ib3gtb3JpZW50OiB2ZXJ0aWNhbDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIHdvcmQtYnJlYWs6IGJyZWFrLXdvcmQ7XG4gIH1cbmA7XG4iXX0= */", process.env.NODE_ENV === "production" ? "" : ";label:navHandleContainer;")
   );
 };
-var navItemContainer = function navItemContainer(_ref3) {
-  var sidebar = _ref3.sidebar;
+var navItemContainer = function navItemContainer(_ref3, fontSize) {
+  var sidebar = _ref3.sidebar,
+    typeScaleSizes = _ref3.typeScaleSizes;
   return (
     /*#__PURE__*/
     /*#__PURE__*/
-    css("display:flex;align-items:center;color:", sidebar.color, ";padding:0.625rem 1.5rem;&:hover,&.selected,&.focus-visible{background:", sidebar.backgroundHover, ";color:", sidebar.colorHover, ";}&.profile-item{padding:0.5rem 1.125rem;img{border:none;}.title{margin-left:0.25rem;}}.title{margin-left:0.5rem;}" + (process.env.NODE_ENV === "production" ? "" : ";label:navItemContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQzZFIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgU2VyaWFsaXplZFN0eWxlcywgVGhlbWUgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcblxuZXhwb3J0IGNvbnN0IG1haW5OYXZDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIHBvc2l0aW9uOiBzdGlja3k7XG4gIHRvcDogMDtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgaGVpZ2h0OiAxMDB2aDtcbiAgYmFja2dyb3VuZDogJHtzaWRlYmFyLmJhY2tncm91bmR9O1xuICBjb2xvcjogJHtzaWRlYmFyLmNvbG9yfTtcbiAgei1pbmRleDogMTAwMTtcblxuICAubmF2LWl0ZW1zLXdyYXBwZXIge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBmbGV4OiAxO1xuICAgIG1hcmdpbjogMCAwIDEuNzVyZW07XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBuYXZIYW5kbGVDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIG1pbi1oZWlnaHQ6IDQuNXJlbTtcbiAgd2lkdGg6IDEwMCU7XG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBwYWRkaW5nOiAwO1xuICBib3JkZXI6IDA7XG5cbiAgLm5hdi1pdGVtIHtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7c2lkZWJhci5ib3JkZXJ9O1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgbmF2SXRlbUNvbnRhaW5lciA9ICh7IHNpZGViYXIgfTogVGhlbWUpOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgY29sb3I6ICR7c2lkZWJhci5jb2xvcn07XG4gIHBhZGRpbmc6IDAuNjI1cmVtIDEuNXJlbTtcblxuICAmOmhvdmVyLFxuICAmLnNlbGVjdGVkLFxuICAmLmZvY3VzLXZpc2libGUge1xuICAgIGJhY2tncm91bmQ6ICR7c2lkZWJhci5iYWNrZ3JvdW5kSG92ZXJ9O1xuICAgIGNvbG9yOiAke3NpZGViYXIuY29sb3JIb3Zlcn07XG4gIH1cblxuICAmLnByb2ZpbGUtaXRlbSB7XG4gICAgcGFkZGluZzogMC41cmVtIDEuMTI1cmVtO1xuXG4gICAgaW1nIHtcbiAgICAgIGJvcmRlcjogbm9uZTtcbiAgICB9XG5cbiAgICAudGl0bGUge1xuICAgICAgbWFyZ2luLWxlZnQ6IDAuMjVyZW07XG4gICAgfVxuICB9XG5cbiAgLnRpdGxlIHtcbiAgICBtYXJnaW4tbGVmdDogMC41cmVtO1xuICB9XG5gO1xuIl19 */", process.env.NODE_ENV === "production" ? "" : ";label:navItemContainer;")
+    css("display:flex;align-items:center;color:", sidebar.color, ";padding:0.25rem 1.5rem;.icon-container{height:2rem;}&:hover,&.selected,&.focus-visible{background:", sidebar.backgroundHover, ";color:", sidebar.colorHover, ";}&.profile-item{padding:0.5rem 1.125rem;img{border:none;}.title{margin-left:0.25rem;}}.title{margin-left:0.5rem;font-size:", typeScaleSizes[fontSize], ";display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word;}" + (process.env.NODE_ENV === "production" ? "" : ";label:navItemContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQzBCIiwiZmlsZSI6InN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgU2VyaWFsaXplZFN0eWxlcywgVGhlbWUgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IFR5cG9ncmFwaHlMZXZlbHMgfSBmcm9tIFwiQHRoZW1lL3V0aWxzL3R5cG9ncmFwaHlcIjtcblxuZXhwb3J0IGNvbnN0IG1haW5OYXZDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lLCB3aWR0aDogc3RyaW5nKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIHBvc2l0aW9uOiBzdGlja3k7XG4gIHRvcDogMDtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgaGVpZ2h0OiAxMDB2aDtcbiAgYmFja2dyb3VuZDogJHtzaWRlYmFyLmJhY2tncm91bmR9O1xuICBjb2xvcjogJHtzaWRlYmFyLmNvbG9yfTtcbiAgei1pbmRleDogMTAwMTtcbiAgbWF4LXdpZHRoOiAke3dpZHRofTtcblxuICAubmF2LWl0ZW1zLXdyYXBwZXIge1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBmbGV4OiAxO1xuICAgIG1hcmdpbjogMS41cmVtIDA7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBuYXZIYW5kbGVDb250YWluZXIgPSAoeyBzaWRlYmFyIH06IFRoZW1lKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIGJhY2tncm91bmQtY29sb3I6IHRyYW5zcGFyZW50O1xuICBwYWRkaW5nOiAwO1xuICBib3JkZXI6IDA7XG5cbiAgLm5hdi1pdGVtIHtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7c2lkZWJhci5ib3JkZXJ9O1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgbmF2SXRlbUNvbnRhaW5lciA9IChcbiAgeyBzaWRlYmFyLCB0eXBlU2NhbGVTaXplcyB9OiBUaGVtZSxcbiAgZm9udFNpemU6IFR5cG9ncmFwaHlMZXZlbHMsXG4pOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgY29sb3I6ICR7c2lkZWJhci5jb2xvcn07XG4gIHBhZGRpbmc6IDAuMjVyZW0gMS41cmVtO1xuXG4gIC5pY29uLWNvbnRhaW5lciB7XG4gICAgaGVpZ2h0OiAycmVtO1xuICB9XG5cbiAgJjpob3ZlcixcbiAgJi5zZWxlY3RlZCxcbiAgJi5mb2N1cy12aXNpYmxlIHtcbiAgICBiYWNrZ3JvdW5kOiAke3NpZGViYXIuYmFja2dyb3VuZEhvdmVyfTtcbiAgICBjb2xvcjogJHtzaWRlYmFyLmNvbG9ySG92ZXJ9O1xuICB9XG5cbiAgJi5wcm9maWxlLWl0ZW0ge1xuICAgIHBhZGRpbmc6IDAuNXJlbSAxLjEyNXJlbTtcblxuICAgIGltZyB7XG4gICAgICBib3JkZXI6IG5vbmU7XG4gICAgfVxuXG4gICAgLnRpdGxlIHtcbiAgICAgIG1hcmdpbi1sZWZ0OiAwLjI1cmVtO1xuICAgIH1cbiAgfVxuXG4gIC50aXRsZSB7XG4gICAgbWFyZ2luLWxlZnQ6IDAuNXJlbTtcbiAgICBmb250LXNpemU6ICR7dHlwZVNjYWxlU2l6ZXNbZm9udFNpemVdfTtcbiAgICBkaXNwbGF5OiAtd2Via2l0LWJveDtcbiAgICAtd2Via2l0LWxpbmUtY2xhbXA6IDI7XG4gICAgLXdlYmtpdC1ib3gtb3JpZW50OiB2ZXJ0aWNhbDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIHdvcmQtYnJlYWs6IGJyZWFrLXdvcmQ7XG4gIH1cbmA7XG4iXX0= */", process.env.NODE_ENV === "production" ? "" : ";label:navItemContainer;")
   );
 };
 

package/dist/esm/src/components/Sidebar/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../../src/components/Sidebar/styles.ts"],"sourcesContent":["import { css, SerializedStyles, Theme } from \"@emotion/react\";\n\nexport const mainNavContainer = ({ sidebar }: Theme): SerializedStyles => css`\n  position: sticky;\n  top: 0;\n  display: flex;\n  flex-direction: column;\n  height: 100vh;\n  background: ${sidebar.background};\n  color: ${sidebar.color};\n  z-index: 1001;\n\n  .nav-items-wrapper {\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    margin: 0 0 1.75rem;\n  }\n`;\n\nexport const navHandleContainer = ({ sidebar }: Theme): SerializedStyles => css`\n  min-height: 4.5rem;\n  width: 100%;\n  background-color: transparent;\n  padding: 0;\n  border: 0;\n\n  .nav-item {\n    height: 100%;\n    border-bottom: 1px solid ${sidebar.border};\n  }\n`;\n\nexport const navItemContainer = ({ sidebar }: Theme): SerializedStyles => css`\n  display: flex;\n  align-items: center;\n  color: ${sidebar.color};\n  padding: 0.625rem 1.5rem;\n\n  &:hover,\n  &.selected,\n  &.focus-visible {\n    background: ${sidebar.backgroundHover};\n    color: ${sidebar.colorHover};\n  }\n\n  &.profile-item {\n    padding: 0.5rem 1.125rem;\n\n    img {\n      border: none;\n    }\n\n    .title {\n      margin-left: 0.25rem;\n    }\n  }\n\n  .title {\n    margin-left: 0.5rem;\n  }\n`;\n"],"names":["mainNavContainer","sidebar","css","background","color","navHandleContainer","border","navItemContainer","backgroundHover","colorHover"],"mappings":";;;;;;;;;;AAEaA,IAAAA,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAA,IAAA,EAAA;EAAA,IAAMC,OAAO,QAAPA,OAAO,CAAA;AAAA,EAAA;AAAA;AAAA;AAAgCC,IAAAA,GAAG,sFAM7DD,OAAO,CAACE,UAAU,EACvBF,SAAAA,EAAAA,OAAO,CAACG,KAAK,EAAA,iGAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,q1DAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA;AAAA,IAAA;AAAA,EASvB;AAEYC,IAAAA,kBAAkB,GAAG,SAArBA,kBAAkB,CAAA,KAAA,EAAA;EAAA,IAAMJ,OAAO,SAAPA,OAAO,CAAA;AAAA,EAAA;AAAA;AAAA;IAAgCC,GAAG,CAAA,6HAAA,EAShDD,OAAO,CAACK,MAAM,EAAA,IAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,4BAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,q1DAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,4BAAA,CAAA;AAAA,IAAA;AAAA,EAE5C;AAEYC,IAAAA,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAA,KAAA,EAAA;EAAA,IAAMN,OAAO,SAAPA,OAAO,CAAA;AAAA,EAAA;AAAA;AAAA;IAAgCC,GAAG,CAAA,wCAAA,EAGlED,OAAO,CAACG,KAAK,EAAA,yEAAA,EAMNH,OAAO,CAACO,eAAe,EAAA,SAAA,EAC5BP,OAAO,CAACQ,UAAU,EAAA,oHAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,q1DAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA;AAAA,IAAA;AAAA;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../../src/components/Sidebar/styles.ts"],"sourcesContent":["import { css, SerializedStyles, Theme } from \"@emotion/react\";\nimport { TypographyLevels } from \"@theme/utils/typography\";\n\nexport const mainNavContainer = ({ sidebar }: Theme, width: string): SerializedStyles => css`\n  position: sticky;\n  top: 0;\n  display: flex;\n  flex-direction: column;\n  height: 100vh;\n  background: ${sidebar.background};\n  color: ${sidebar.color};\n  z-index: 1001;\n  max-width: ${width};\n\n  .nav-items-wrapper {\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    margin: 1.5rem 0;\n  }\n`;\n\nexport const navHandleContainer = ({ sidebar }: Theme): SerializedStyles => css`\n  background-color: transparent;\n  padding: 0;\n  border: 0;\n\n  .nav-item {\n    height: 100%;\n    border-bottom: 1px solid ${sidebar.border};\n  }\n`;\n\nexport const navItemContainer = (\n  { sidebar, typeScaleSizes }: Theme,\n  fontSize: TypographyLevels,\n): SerializedStyles => css`\n  display: flex;\n  align-items: center;\n  color: ${sidebar.color};\n  padding: 0.25rem 1.5rem;\n\n  .icon-container {\n    height: 2rem;\n  }\n\n  &:hover,\n  &.selected,\n  &.focus-visible {\n    background: ${sidebar.backgroundHover};\n    color: ${sidebar.colorHover};\n  }\n\n  &.profile-item {\n    padding: 0.5rem 1.125rem;\n\n    img {\n      border: none;\n    }\n\n    .title {\n      margin-left: 0.25rem;\n    }\n  }\n\n  .title {\n    margin-left: 0.5rem;\n    font-size: ${typeScaleSizes[fontSize]};\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    word-break: break-word;\n  }\n`;\n"],"names":["mainNavContainer","width","sidebar","css","background","color","navHandleContainer","border","navItemContainer","fontSize","typeScaleSizes","backgroundHover","colorHover"],"mappings":";;;;;;;;;;IAGaA,gBAAgB,GAAG,SAAnBA,gBAAgB,OAAwBC,KAAa,EAAA;EAAA,IAA/BC,OAAO,QAAPA,OAAO,CAAA;AAAA,EAAA;AAAA;AAAA;IAA+CC,GAAG,CAAA,mFAAA,EAM5ED,OAAO,CAACE,UAAU,aACvBF,OAAO,CAACG,KAAK,EAAA,0BAAA,EAETJ,KAAK,EAAA,iFAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,60EAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA;AAAA,IAAA;AAAA,EAQnB;AAEYK,IAAAA,kBAAkB,GAAG,SAArBA,kBAAkB,CAAA,KAAA,EAAA;EAAA,IAAMJ,OAAO,SAAPA,OAAO,CAAA;AAAA,EAAA;AAAA;AAAA;IAAgCC,GAAG,CAAA,gGAAA,EAOhDD,OAAO,CAACK,MAAM,EAAA,IAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,4BAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,60EAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,4BAAA,CAAA;AAAA,IAAA;AAAA,EAE5C;IAEYC,gBAAgB,GAAG,SAAnBA,gBAAgB,QAE3BC,QAA0B,EAAA;EAAA,IADxBP,OAAO,SAAPA,OAAO;AAAEQ,IAAAA,cAAc,SAAdA,cAAc,CAAA;AAAA,EAAA;AAAA;AAAA;AAEJP,IAAAA,GAAG,2CAGfD,OAAO,CAACG,KAAK,EAAA,qGAAA,EAUNH,OAAO,CAACS,eAAe,EAC5BT,SAAAA,EAAAA,OAAO,CAACU,UAAU,EAAA,6HAAA,EAiBdF,cAAc,CAACD,QAAQ,CAAC,EAAA,sIAAA,IAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,60EAAA,EAAA,OAAA,CAAA,GAAA,CAAA,QAAA,KAAA,YAAA,GAAA,EAAA,GAAA,0BAAA,CAAA;AAAA,IAAA;AAAA;;;;"}