@laerdal/life-react-components 1.0.1-dev.22.full → 1.0.1-dev.29.full

package/dist/js/Modals/ModalDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Modals/ModalDialog.tsx"],"names":["ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","body","buttons","backButton","closeAction","submitAction","tooltip","React","useState","tooltipOpen","setTooltipOpen","getMinWidth","getMaxWidth","getImageHeight","getMarginBottom","getPadding","ModalTitle","ComponentTextStyle","Bold","ModalCloseButton","onClick","COLORS","black","ModalBackButton","neutral_600","map","b","action","variant","text"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAqBO,IAAMA,WAAmD,GAAG,SAAtDA,WAAsD,OAY7D;AAAA,MAXJC,IAWI,QAXJA,IAWI;AAAA,MAVJC,WAUI,QAVJA,WAUI;AAAA,MATJC,uBASI,QATJA,uBASI;AAAA,MARJC,KAQI,QARJA,KAQI;AAAA,MAPJC,QAOI,QAPJA,QAOI;AAAA,MANJC,IAMI,QANJA,IAMI;AAAA,MALJC,OAKI,QALJA,OAKI;AAAA,MAJJC,UAII,QAJJA,UAII;AAAA,MAHJC,WAGI,QAHJA,WAGI;AAAA,MAFJC,YAEI,QAFJA,YAEI;AAAA,MADJC,OACI,QADJA,OACI;;AACJ,wBAAsCC,KAAK,CAACC,QAAN,CAAwB,KAAxB,CAAtC;AAAA;AAAA,MAAOC,WAAP;AAAA,MAAoBC,cAApB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,YAAQf,IAAR;AACE,WAAK,OAAL;AACE,eAAO,OAAP;;AACF,WAAK,QAAL;AACE,eAAO,OAAP;;AACF,WAAK,OAAL;AACE,eAAO,OAAP;;AACF;AACE,eAAO,OAAP;AARJ;AAUD,GAXD;;AAaA,MAAMgB,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,YAAQhB,IAAR;AACE,WAAK,OAAL;AACE,eAAO,OAAP;;AACF,WAAK,QAAL;AACE,eAAO,OAAP;;AACF,WAAK,OAAL;AACE,eAAO,OAAP;;AACF;AACE,eAAO,OAAP;AARJ;AAUD,GAXD;;AAaA,MAAMiB,cAAc,GAAG,SAAjBA,cAAiB,GAAM;AAC3B,YAAQjB,IAAR;AACE,WAAK,OAAL;AACE,eAAO,GAAP;;AACF,WAAK,QAAL;AACE,eAAO,GAAP;;AACF,WAAK,OAAL;AACE,eAAO,GAAP;;AACF;AACE,eAAO,GAAP;AARJ;AAUD,GAXD;;AAaA,MAAMkB,eAAe,GAAG,SAAlBA,eAAkB,GAAM;AAC5B,YAAQlB,IAAR;AACE,WAAK,OAAL;AACE,eAAO,MAAP;;AACF,WAAK,QAAL;AACE,eAAO,MAAP;;AACF,WAAK,OAAL;AACE,eAAO,MAAP;;AACF;AACE,eAAO,MAAP;AARJ;AAUD,GAXD;;AAaA,MAAMmB,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvB,YAAQnB,IAAR;AACE,WAAK,OAAL;AACE,eAAO,eAAP;;AACF,WAAK,QAAL;AACE,eAAO,gBAAP;;AACF,WAAK,OAAL;AACE,eAAO,MAAP;;AACF;AACE,eAAO,gBAAP;AARJ;AAUD,GAXD;;AAaA,MAAMoB,UAAU,GAAG,SAAbA,UAAa,CAACjB,KAAD,EAAgBH,IAAhB,EAAwD;AACzE,YAAQA,IAAR;AACE,WAAK,OAAL;AACE,4BAAO,oBAAC,kBAAD;AAAY,UAAA,SAAS,EAAEqB,2BAAmBC;AAA1C,WAAiDnB,KAAjD,CAAP;;AACF,WAAK,QAAL;AACE,4BAAO,oBAAC,kBAAD;AAAY,UAAA,SAAS,EAAEkB,2BAAmBC;AAA1C,WAAiDnB,KAAjD,CAAP;;AACF,WAAK,OAAL;AACE,4BAAO,oBAAC,mBAAD;AAAa,UAAA,SAAS,EAAEkB,2BAAmBC;AAA3C,WAAkDnB,KAAlD,CAAP;;AACF;AACE,4BAAO,oBAAC,kBAAD;AAAY,UAAA,SAAS,EAAEkB,2BAAmBC;AAA1C,WAAiDnB,KAAjD,CAAP;AARJ;AAUD,GAXD;;AAaA,MAAMoB,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,OAAD,EAAkB;AACzC,wBACE,oBAAC,+BAAD;AAAoB,MAAA,QAAQ,EAAE,CAAC,CAACpB,QAAhC;AAA0C,MAAA,IAAI,EAAEJ;AAAhD,oBACE,oBAAC,kBAAD;AAAY,MAAA,OAAO,EAAC,WAApB;AAAgC,MAAA,KAAK,EAAC,UAAtC;AAAiD,MAAA,MAAM,EAAE;AAAA,eAAMwB,OAAO,EAAb;AAAA,OAAzD;AAA0E,MAAA,YAAY,EAAE;AAAxF,oBACE,oBAAC,kBAAD;AAAO,MAAA,IAAI,EAAC,MAAZ;AAAmB,MAAA,KAAK,EAAEC,eAAOC;AAAjC,MADF,CADF,CADF;AAOD,GARD;;AAUA,MAAMC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;AAC5B,QAAIpB,UAAJ,EAAgB;AACd,0BACE,oBAAC,8BAAD;AAAmB,QAAA,QAAQ,EAAE,CAAC,CAACH,QAA/B;AAAyC,QAAA,IAAI,EAAEJ;AAA/C,sBACE,oBAAC,kBAAD;AAAY,QAAA,OAAO,EAAC,WAApB;AAAgC,QAAA,KAAK,EAAC,UAAtC;AAAiD,QAAA,MAAM,EAAE;AAAA,iBAAMO,UAAU,EAAhB;AAAA,SAAzD;AAA6E,QAAA,YAAY,EAAE;AAA3F,sBACE,oBAAC,0BAAD;AAAe,QAAA,IAAI,EAAC,MAApB;AAA2B,QAAA,KAAK,EAAEkB,eAAOC;AAAzC,QADF,CADF,CADF;AAOD;AACF,GAVD;;AAYA,sBACE,oBAAC,uBAAD;AAAgB,IAAA,SAAS,EAAEzB,WAA3B;AAAwC,IAAA,UAAU,EAAEC,uBAApD;AAA6E,IAAA,QAAQ,EAAEa,WAAW,EAAlG;AAAsG,IAAA,QAAQ,EAAEC,WAAW,EAA3H;AAA+H,IAAA,WAAW,EAAC,MAA3I;AAAkJ,IAAA,OAAO,EAAEG,UAAU;AAArK,kBACE,oBAAC,mBAAD,qBACE;AAAM,IAAA,QAAQ,EAAEV;AAAhB,KACGL,QAAQ,iBACP,oBAAC,8BAAD;AAAmB,IAAA,IAAI,EAAEJ,IAAzB;AAA+B,IAAA,MAAM,EAAEiB,cAAc,EAArD;AAAyD,IAAA,YAAY,EAAEC,eAAe;AAAtF,kBACE;AAAK,IAAA,GAAG,EAAEd,QAAV;AAAoB,IAAA,GAAG,EAAC;AAAxB,IADF,EAEGuB,eAAe,EAFlB,EAGGJ,gBAAgB,CAACf,WAAD,CAHnB,CAFJ,eAQE,oBAAC,8BAAD,QACG,CAACJ,QAAD,IAAauB,eAAe,EAD/B,EAEGxB,KAAK,IAAIiB,UAAU,CAACjB,KAAD,EAAQH,IAAR,CAFtB,EAGGU,OAAO,iBACN;AAAK,IAAA,EAAE,EAAC;AAAR,kBACE;AAAK,IAAA,WAAW,EAAE;AAAA,aAAMI,cAAc,CAAC,IAAD,CAApB;AAAA,KAAlB;AAA8C,IAAA,UAAU,EAAE;AAAA,aAAMA,cAAc,CAAC,KAAD,CAApB;AAAA;AAA1D,kBACE,oBAAC,iBAAD;AAAM,IAAA,IAAI,EAAC,MAAX;AAAkB,IAAA,KAAK,EAAEW,eAAOG;AAAhC,IADF,CADF,EAIGf,WAAW,iBAAI,kCAAOH,OAAP,CAJlB,CAJJ,EAWG,CAACN,QAAD,IAAamB,gBAAgB,CAACf,WAAD,CAXhC,CARF,eAsBE,oBAAC,sBAAD;AAAW,IAAA,IAAI,EAAER;AAAjB,KAAwBK,IAAxB,CAtBF,eAwBE,oBAAC,wBAAD;AAAa,IAAA,IAAI,EAAEL;AAAnB,kBACE,oBAAC,+BAAD;AAAoB,IAAA,IAAI,EAAEA;AAA1B,KACGM,OADH,aACGA,OADH,uBACGA,OAAO,CAAEuB,GAAT,CAAa,UAACC,CAAD;AAAA,wBACZ,oBAAC,cAAD;AAAQ,MAAA,IAAI,EAAE9B,IAAI,KAAK,OAAT,GAAmB,KAAnB,GAA2BA,IAAI,KAAK,QAAT,GAAoB,QAApB,GAA+BA,IAAxE;AAA8E,MAAA,OAAO,EAAE8B,CAAC,CAACC,MAAzF;AAAiG,MAAA,OAAO,EAAED,CAAC,CAACE;AAA5G,OACGF,CAAC,CAACG,IADL,CADY;AAAA,GAAb,CADH,CADF,CAxBF,CADF,CADF,CADF;AAwCD,CA3JM;;;;AAbLjC,EAAAA,I,4BAAO,O,EAAU,Q,EAAW,O;AAC5BC,EAAAA,W;AACAC,EAAAA,uB;AACAC,EAAAA,K;AACAC,EAAAA,Q;AACAC,EAAAA,I;AACAC,EAAAA,O;AAXAyB,IAAAA,M;AACAE,IAAAA,I;;AAWAvB,EAAAA,O;AACAH,EAAAA,U;AACAC,EAAAA,W;AACAC,EAAAA,Y;;eAgKaV,W","sourcesContent":["import * as React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ButtonProps } from '../Button/Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport ModalContainer from './ModalContainer';\nimport { BackButtonWrapper, CloseButtonWrapper, Column, ModalBody, ModalFooter, ModalFooterButtons, ModalTitle, ModalTitleSection, StyledModalHeader } from './ModalStyles';\n\ninterface ButtonAction extends Pick<ButtonProps, 'variant'> {\n  action: () => void;\n  text: string;\n}\n\ninterface NewModalProps {\n  size?: 'small' | 'medium' | 'large';\n  isModalOpen: boolean;\n  closeModalAndClearInput: any;\n  title?: string;\n  topImage?: any;\n  body?: any;\n  buttons?: ButtonAction[];\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  body,\n  buttons,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n}) => {\n  const [tooltipOpen, setTooltipOpen] = React.useState<boolean>(false);\n\n  const getMinWidth = () => {\n    switch (size) {\n      case 'small':\n        return '320px';\n      case 'medium':\n        return '400px';\n      case 'large':\n        return '480px';\n      default:\n        return '400px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case 'small':\n        return '512px';\n      case 'medium':\n        return '400px';\n      case 'large':\n        return '588px';\n      default:\n        return '664px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case 'small':\n        return 160;\n      case 'medium':\n        return 200;\n      case 'large':\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case 'small':\n        return '16px';\n      case 'medium':\n        return '24px';\n      case 'large':\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case 'small':\n        return '16px 16px 8px';\n      case 'medium':\n        return '24px 24px 16px';\n      case 'large':\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const ModalTitle = (title: string, size?: 'small' | 'medium' | 'large') => {\n    switch (size) {\n      case 'small':\n        return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n      case 'medium':\n        return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      case 'large':\n        return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n      default:\n        return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n    }\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  return (\n    <ModalContainer showModal={isModalOpen} closeModal={closeModalAndClearInput} minWidth={getMinWidth()} maxWidth={getMaxWidth()} modalHeight=\"auto\" padding={getPadding()}>\n      <Column>\n        <form onSubmit={submitAction}>\n          {topImage && (\n            <StyledModalHeader size={size} height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <img src={topImage} alt=\"Modal top\" />\n              {ModalBackButton()}\n              {ModalCloseButton(closeAction)}\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            {!topImage && ModalBackButton()}\n            {title && ModalTitle(title, size)}\n            {tooltip && (\n              <div id=\"tooltip\">\n                <div onMouseOver={() => setTooltipOpen(true)} onMouseOut={() => setTooltipOpen(false)}>\n                  <Help size=\"24px\" color={COLORS.neutral_600} />\n                </div>\n                {tooltipOpen && <span>{tooltip}</span>}\n              </div>\n            )}\n            {!topImage && ModalCloseButton(closeAction)}\n          </ModalTitleSection>\n\n          <ModalBody size={size}>{body}</ModalBody>\n\n          <ModalFooter size={size}>\n            <ModalFooterButtons size={size}>\n              {buttons?.map((b) => (\n                <Button size={size === 'large' ? 'big' : size === 'medium' ? 'normal' : size} onClick={b.action} variant={b.variant}>\n                  {b.text}\n                </Button>\n              ))}\n            </ModalFooterButtons>\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"file":"ModalDialog.js"}
+{"version":3,"sources":["../../../src/Modals/ModalDialog.tsx"],"names":["ModalDialog","size","isModalOpen","closeModalAndClearInput","title","topImage","body","buttons","backButton","closeAction","submitAction","tooltip","React","useState","tooltipOpen","setTooltipOpen","getMinWidth","Size","Small","Medium","Large","getMaxWidth","getImageHeight","getMarginBottom","getPadding","ModalTitle","ComponentTextStyle","Bold","ModalCloseButton","onClick","COLORS","black","ModalBackButton","neutral_600","map","b","action","variant","text"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Button, IconButton } from '../Button';\nimport { ButtonProps } from '../Button/Button';\nimport { ArrowLineLeft, Close, Help } from '../icons/systemicons/SystemIcons';\nimport { COLORS, ComponentL, ComponentM, ComponentTextStyle, ComponentXL } from '../styles';\nimport { Size } from '../types'\nimport ModalContainer from './ModalContainer';\nimport { BackButtonWrapper, CloseButtonWrapper, Column, ModalBody, ModalFooter, ModalFooterButtons, ModalTitle, ModalTitleSection, StyledModalHeader } from './ModalStyles';\n\ninterface ButtonAction extends Pick<ButtonProps, 'variant'> {\n  action: () => void;\n  text: string;\n}\n\ninterface NewModalProps {\n  size?: Size;\n  isModalOpen: boolean;\n  closeModalAndClearInput: any;\n  title?: string;\n  topImage?: any;\n  body?: any;\n  buttons?: ButtonAction[];\n  tooltip?: string;\n  backButton?: () => void;\n  closeAction: () => void;\n  submitAction: (event?: React.FormEvent<HTMLFormElement> | undefined) => void;\n}\n\nexport const ModalDialog: React.FunctionComponent<NewModalProps> = ({\n  size,\n  isModalOpen,\n  closeModalAndClearInput,\n  title,\n  topImage,\n  body,\n  buttons,\n  backButton,\n  closeAction,\n  submitAction,\n  tooltip,\n}) => {\n  const [tooltipOpen, setTooltipOpen] = React.useState<boolean>(false);\n\n  const getMinWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '320px';\n      case Size.Medium:\n        return '400px';\n      case Size.Large:\n        return '480px';\n      default:\n        return '400px';\n    }\n  };\n\n  const getMaxWidth = () => {\n    switch (size) {\n      case Size.Small:\n        return '512px';\n      case Size.Medium:\n        return '400px';\n      case Size.Large:\n        return '588px';\n      default:\n        return '664px';\n    }\n  };\n\n  const getImageHeight = () => {\n    switch (size) {\n      case Size.Small:\n        return 160;\n      case Size.Medium:\n        return 200;\n      case Size.Large:\n        return 240;\n      default:\n        return 200;\n    }\n  };\n\n  const getMarginBottom = () => {\n    switch (size) {\n      case Size.Small:\n        return '16px';\n      case Size.Medium:\n        return '24px';\n      case Size.Large:\n        return '32px';\n      default:\n        return '24px';\n    }\n  };\n\n  const getPadding = () => {\n    switch (size) {\n      case 'small':\n        return '16px 16px 8px';\n      case 'medium':\n        return '24px 24px 16px';\n      case 'large':\n        return '32px';\n      default:\n        return '24px 24px 16px';\n    }\n  };\n\n  const ModalTitle = (title: string, size?: 'small' | 'medium' | 'large') => {\n    switch (size) {\n      case 'small':\n        return <ComponentM textStyle={ComponentTextStyle.Bold}>{title}</ComponentM>;\n      case 'medium':\n        return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n      case 'large':\n        return <ComponentXL textStyle={ComponentTextStyle.Bold}>{title}</ComponentXL>;\n      default:\n        return <ComponentL textStyle={ComponentTextStyle.Bold}>{title}</ComponentL>;\n    }\n  };\n\n  const ModalCloseButton = (onClick: any) => {\n    return (\n      <CloseButtonWrapper hasImage={!!topImage} size={size}>\n        <IconButton variant=\"secondary\" shape=\"circular\" action={() => onClick()} borderRadius={48}>\n          <Close size=\"24px\" color={COLORS.black} />\n        </IconButton>\n      </CloseButtonWrapper>\n    );\n  };\n\n  const ModalBackButton = () => {\n    if (backButton) {\n      return (\n        <BackButtonWrapper hasImage={!!topImage} size={size}>\n          <IconButton variant=\"secondary\" shape=\"circular\" action={() => backButton()} borderRadius={48}>\n            <ArrowLineLeft size=\"24px\" color={COLORS.black} />\n          </IconButton>\n        </BackButtonWrapper>\n      );\n    }\n  };\n\n  return (\n    <ModalContainer showModal={isModalOpen} closeModal={closeModalAndClearInput} minWidth={getMinWidth()} maxWidth={getMaxWidth()} modalHeight=\"auto\" padding={getPadding()}>\n      <Column>\n        <form onSubmit={submitAction}>\n          {topImage && (\n            <StyledModalHeader size={size} height={getImageHeight()} marginBottom={getMarginBottom()}>\n              <img src={topImage} alt=\"Modal top\" />\n              {ModalBackButton()}\n              {ModalCloseButton(closeAction)}\n            </StyledModalHeader>\n          )}\n          <ModalTitleSection>\n            {!topImage && ModalBackButton()}\n            {title && ModalTitle(title, size)}\n            {tooltip && (\n              <div id=\"tooltip\">\n                <div onMouseOver={() => setTooltipOpen(true)} onMouseOut={() => setTooltipOpen(false)}>\n                  <Help size=\"24px\" color={COLORS.neutral_600} />\n                </div>\n                {tooltipOpen && <span>{tooltip}</span>}\n              </div>\n            )}\n            {!topImage && ModalCloseButton(closeAction)}\n          </ModalTitleSection>\n\n          <ModalBody size={size}>{body}</ModalBody>\n\n          <ModalFooter size={size}>\n            <ModalFooterButtons size={size}>\n              {buttons?.map((b) => (\n                <Button size={size} onClick={b.action} variant={b.variant}>\n                  {b.text}\n                </Button>\n              ))}\n            </ModalFooterButtons>\n          </ModalFooter>\n        </form>\n      </Column>\n    </ModalContainer>\n  );\n};\n\nexport default ModalDialog;\n"],"file":"ModalDialog.js"}

package/dist/js/Modals/ModalStyles.d.ts

@@ -1,3 +1,4 @@
+import { Size } from '../types';
 /**
  * Modal styles
  */
@@ -17,11 +18,11 @@ export declare const ModalFooterButtons: import("styled-components").StyledCompo
 }, never>;
 export declare const ModalTitleSection: import("styled-components").StyledComponent<"section", any, {}, never>;
 export declare const CloseButtonWrapper: import("styled-components").StyledComponent<"div", any, {
-    size?: string;
+    size?: Size;
     hasImage?: boolean;
 }, never>;
 export declare const BackButtonWrapper: import("styled-components").StyledComponent<"div", any, {
-    size?: string;
+    size?: Size;
     hasImage?: boolean;
 }, never>;
 export declare const ModalTitle: import("styled-components").StyledComponent<"h5", any, {
@@ -31,5 +32,5 @@ export declare const ModalBody: import("styled-components").StyledComponent<"sec
     size?: string;
 }, never>;
 export declare const ModalFooter: import("styled-components").StyledComponent<"section", any, {
-    size?: string;
+    size?: Size;
 }, never>;

package/dist/js/Modals/ModalStyles.js

@@ -9,6 +9,8 @@ exports.ModalFooter = exports.ModalBody = exports.ModalTitle = exports.BackButto
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
+var _types = require("../types");
+
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -47,7 +49,7 @@ var ModalTitleSection = _styledComponents.default.section(_templateObject5 || (_
 exports.ModalTitleSection = ModalTitleSection;
 
 var CloseButtonWrapper = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  button {\n    ", "\n  }\n"])), function (props) {
-  return props.hasImage ? (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n            position: absolute;\n            right: 0;\n            top: 0;\n            margin: -12px !important;\n          "]))) : (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n            position: absolute;\n            top: 0;\n            right: 0;\n            left: unset;\n            margin: ", " !important;\n          "])), props.size === 'small' ? '4px 4px 0 0' : props.size === 'large' ? '20px 20px 0 0' : '12px 12px 0 0');
+  return props.hasImage ? (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n            position: absolute;\n            right: 0;\n            top: 0;\n            margin: -12px !important;\n          "]))) : (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n            position: absolute;\n            top: 0;\n            right: 0;\n            left: unset;\n            margin: ", " !important;\n          "])), props.size === _types.Size.Small ? '4px 4px 0 0' : props.size === _types.Size.Large ? '20px 20px 0 0' : '12px 12px 0 0');
 });
 
 exports.CloseButtonWrapper = CloseButtonWrapper;
@@ -73,7 +75,7 @@ var ModalBody = _styledComponents.default.section(_templateObject13 || (_templat
 exports.ModalBody = ModalBody;
 
 var ModalFooter = _styledComponents.default.section(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n  margin-top: ", ";\n  display: flex;\n  justify-content: flex-end;\n"])), function (props) {
-  return (props === null || props === void 0 ? void 0 : props.size) === 'small' ? "20px" : (props === null || props === void 0 ? void 0 : props.size) === 'large' ? '28px' : '24px';
+  return (props === null || props === void 0 ? void 0 : props.size) === _types.Size.Small ? "20px" : (props === null || props === void 0 ? void 0 : props.size) === _types.Size.Large ? '28px' : '24px';
 });
 
 exports.ModalFooter = ModalFooter;

package/dist/js/Modals/ModalStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Modals/ModalStyles.ts"],"names":["ModalHeader","styled","section","props","marginBottom","StyledModalHeader","height","size","Column","div","ModalFooterButtons","ModalTitleSection","CloseButtonWrapper","hasImage","css","BackButtonWrapper","ModalTitle","h5","fontSize","ModalBody","ModalFooter"],"mappings":";;;;;;;;;AAAA;;;;;;;;;;AAEA;AACA;AACA;AACO,IAAMA,WAAW,GAAGC,0BAAOC,OAAV,6KAIL,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,YAAN,IAAsB,MAAjC;AAAA,CAJK,CAAjB;;;AAOA,IAAMC,iBAAiB,GAAG,+BAAOL,WAAP,CAAH,0WAKlB,UAACG,KAAD;AAAA,SAAYA,KAAK,CAACG,MAAN,aAAkBH,KAAK,CAACG,MAAN,IAAgBH,KAAK,CAACI,IAAN,KAAe,OAAf,GAAyB,EAAzB,GAA8BJ,KAAK,CAACI,IAAN,KAAe,OAAf,GAAyB,EAAzB,GAA8B,EAA5E,CAAlB,UAAwG,EAApH;AAAA,CALkB,EAQhB,UAACJ,KAAD;AAAA,mBAAcA,KAAK,CAACG,MAApB;AAAA,CARgB,CAAvB;;;AAkBA,IAAME,MAAM,GAAGP,0BAAOQ,GAAV,oKAAZ;;;;AAOA,IAAMC,kBAAkB,GAAGT,0BAAOQ,GAAV,4HAEZ,UAACN,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,YAAmC,KAA/C;AAAA,CAFY,CAAxB;;;;AAMA,IAAMI,iBAAiB,GAAGV,0BAAOC,OAAV,yIAAvB;;;;AAOA,IAAMU,kBAAkB,GAAGX,0BAAOQ,GAAV,qGAEzB,UAACN,KAAD;AAAA,SACAA,KAAK,CAACU,QAAN,OACIC,qBADJ,+MAOIA,qBAPJ,kOAYgBX,KAAK,CAACI,IAAN,KAAe,OAAf,GAAyB,aAAzB,GAAyCJ,KAAK,CAACI,IAAN,KAAe,OAAf,GAAyB,eAAzB,GAA2C,eAZpG,CADA;AAAA,CAFyB,CAAxB;;;;AAoBA,IAAMQ,iBAAiB,GAAGd,0BAAOQ,GAAV,qGAExB,UAACN,KAAD;AAAA,SACAA,KAAK,CAACU,QAAN,OACIC,qBADJ,0NAOIA,qBAPJ,qKADA;AAAA,CAFwB,CAAvB;;;;AAiBA,IAAME,UAAU,GAAGf,0BAAOgB,EAAV,oIAER,UAACd,KAAD;AAAA,SAAWA,KAAK,CAACe,QAAN,IAAkB,QAA7B;AAAA,CAFQ,CAAhB;;;;AAMA,IAAMC,SAAS,GAAGlB,0BAAOC,OAAV,wOAMD,UAACC,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,WAAkC,CAAAJ,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,GAA0B,MAA1B,GAAmC,MAAjF;AAAA,CANC,EAUA,UAACJ,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,WAAkC,CAAAJ,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,GAA0B,MAA1B,GAAmC,MAAjF;AAAA,CAVA,CAAf;;;;AAcA,IAAMa,WAAW,GAAGnB,0BAAOC,OAAV,iJACR,UAACC,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,YAAmC,CAAAJ,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,GAA0B,MAA1B,GAAmC,MAAlF;AAAA,CADQ,CAAjB","sourcesContent":["import styled, { css } from 'styled-components';\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; height?: number }>`\n  flex: 0 calc(50% - 5px);\n  flex-direction: column;\n  position: relative;\n  text-align: left;\n  height: ${(props) => (props.height ? `${props.height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.height}px`};\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    border-radius: 8px 8px 0 0;\n    object-fit: cover;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalFooterButtons = styled.div<{ size?: string }>`\n  button + button {\n    margin-left: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n  }\n`;\n\nexport const ModalTitleSection = styled.section`\n  display: flex;\n  div#tooltip {\n    margin-left: 12px;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: string; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            position: absolute;\n            right: 0;\n            top: 0;\n            margin: -12px !important;\n          `\n        : css`\n            position: absolute;\n            top: 0;\n            right: 0;\n            left: unset;\n            margin: ${props.size === 'small' ? '4px 4px 0 0' : props.size === 'large' ? '20px 20px 0 0' : '12px 12px 0 0'} !important;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: string; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            left: 0;\n            top: 0;\n            position: absolute;\n            margin: -12px 0 0 -12px !important;\n          `\n        : css`\n            position: unset;\n            margin: -12px 0 0 -12px !important;\n          `}\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalBody = styled.section<{ size?: string }>`\n  > :first-child {\n    margin-top: 24px;\n  }\n\n  > :last-child {\n    margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  }\n\n  p: first-of-type {\n    padding-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  }\n`;\n\nexport const ModalFooter = styled.section<{ size?: string }>`\n  margin-top: ${(props) => (props?.size === 'small' ? `20px` : props?.size === 'large' ? '28px' : '24px')};\n  display: flex;\n  justify-content: flex-end;\n`;\n"],"file":"ModalStyles.js"}
+{"version":3,"sources":["../../../src/Modals/ModalStyles.ts"],"names":["ModalHeader","styled","section","props","marginBottom","StyledModalHeader","height","size","Column","div","ModalFooterButtons","ModalTitleSection","CloseButtonWrapper","hasImage","css","Size","Small","Large","BackButtonWrapper","ModalTitle","h5","fontSize","ModalBody","ModalFooter"],"mappings":";;;;;;;;;AAAA;;AACA;;;;;;;;;;AAEA;AACA;AACA;AACO,IAAMA,WAAW,GAAGC,0BAAOC,OAAV,6KAIL,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,YAAN,IAAsB,MAAjC;AAAA,CAJK,CAAjB;;;AAOA,IAAMC,iBAAiB,GAAG,+BAAOL,WAAP,CAAH,0WAKlB,UAACG,KAAD;AAAA,SAAYA,KAAK,CAACG,MAAN,aAAkBH,KAAK,CAACG,MAAN,IAAgBH,KAAK,CAACI,IAAN,KAAe,OAAf,GAAyB,EAAzB,GAA8BJ,KAAK,CAACI,IAAN,KAAe,OAAf,GAAyB,EAAzB,GAA8B,EAA5E,CAAlB,UAAwG,EAApH;AAAA,CALkB,EAQhB,UAACJ,KAAD;AAAA,mBAAcA,KAAK,CAACG,MAApB;AAAA,CARgB,CAAvB;;;AAkBA,IAAME,MAAM,GAAGP,0BAAOQ,GAAV,oKAAZ;;;;AAOA,IAAMC,kBAAkB,GAAGT,0BAAOQ,GAAV,4HAEZ,UAACN,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,YAAmC,KAA/C;AAAA,CAFY,CAAxB;;;;AAMA,IAAMI,iBAAiB,GAAGV,0BAAOC,OAAV,yIAAvB;;;;AAOA,IAAMU,kBAAkB,GAAGX,0BAAOQ,GAAV,qGAEzB,UAACN,KAAD;AAAA,SACAA,KAAK,CAACU,QAAN,OACIC,qBADJ,+MAOIA,qBAPJ,kOAYgBX,KAAK,CAACI,IAAN,KAAeQ,YAAKC,KAApB,GAA4B,aAA5B,GAA4Cb,KAAK,CAACI,IAAN,KAAeQ,YAAKE,KAApB,GAA4B,eAA5B,GAA8C,eAZ1G,CADA;AAAA,CAFyB,CAAxB;;;;AAoBA,IAAMC,iBAAiB,GAAGjB,0BAAOQ,GAAV,qGAExB,UAACN,KAAD;AAAA,SACAA,KAAK,CAACU,QAAN,OACIC,qBADJ,0NAOIA,qBAPJ,qKADA;AAAA,CAFwB,CAAvB;;;;AAiBA,IAAMK,UAAU,GAAGlB,0BAAOmB,EAAV,oIAER,UAACjB,KAAD;AAAA,SAAWA,KAAK,CAACkB,QAAN,IAAkB,QAA7B;AAAA,CAFQ,CAAhB;;;;AAMA,IAAMC,SAAS,GAAGrB,0BAAOC,OAAV,wOAMD,UAACC,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,WAAkC,CAAAJ,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,GAA0B,MAA1B,GAAmC,MAAjF;AAAA,CANC,EAUA,UAACJ,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,WAAkC,CAAAJ,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgB,OAAhB,GAA0B,MAA1B,GAAmC,MAAjF;AAAA,CAVA,CAAf;;;;AAcA,IAAMgB,WAAW,GAAGtB,0BAAOC,OAAV,iJACR,UAACC,KAAD;AAAA,SAAY,CAAAA,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgBQ,YAAKC,KAArB,YAAsC,CAAAb,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,MAAgBQ,YAAKE,KAArB,GAA6B,MAA7B,GAAsC,MAAxF;AAAA,CADQ,CAAjB","sourcesContent":["import styled, { css } from 'styled-components';\nimport { Size } from '../types'\n\n/**\n * Modal styles\n */\nexport const ModalHeader = styled.section<{ marginBottom?: string }>`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: ${(props) => props.marginBottom || '24px'};\n`;\n\nexport const StyledModalHeader = styled(ModalHeader)<{ marginBottom?: string; size?: string; height?: number }>`\n  flex: 0 calc(50% - 5px);\n  flex-direction: column;\n  position: relative;\n  text-align: left;\n  height: ${(props) => (props.height ? `${props.height - (props.size === 'small' ? 16 : props.size === 'large' ? 32 : 24)}px` : '')};\n  img {\n    width: 100%;\n    height: ${(props) => `${props.height}px`};\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    border-radius: 8px 8px 0 0;\n    object-fit: cover;\n  }\n`;\n\nexport const Column = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: stretch;\n  height: 100%;\n`;\n\nexport const ModalFooterButtons = styled.div<{ size?: string }>`\n  button + button {\n    margin-left: ${(props) => (props?.size === 'large' ? `16px` : '8px')};\n  }\n`;\n\nexport const ModalTitleSection = styled.section`\n  display: flex;\n  div#tooltip {\n    margin-left: 12px;\n  }\n`;\n\nexport const CloseButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            position: absolute;\n            right: 0;\n            top: 0;\n            margin: -12px !important;\n          `\n        : css`\n            position: absolute;\n            top: 0;\n            right: 0;\n            left: unset;\n            margin: ${props.size === Size.Small ? '4px 4px 0 0' : props.size === Size.Large ? '20px 20px 0 0' : '12px 12px 0 0'} !important;\n          `}\n  }\n`;\n\nexport const BackButtonWrapper = styled.div<{ size?: Size; hasImage?: boolean }>`\n  button {\n    ${(props) =>\n      props.hasImage\n        ? css`\n            left: 0;\n            top: 0;\n            position: absolute;\n            margin: -12px 0 0 -12px !important;\n          `\n        : css`\n            position: unset;\n            margin: -12px 0 0 -12px !important;\n          `}\n  }\n`;\n\nexport const ModalTitle = styled.h5<{ fontSize?: string }>`\n  margin: 0;\n  font-size: ${(props) => props.fontSize || '1.25em'};\n  font-weight: bold;\n`;\n\nexport const ModalBody = styled.section<{ size?: string }>`\n  > :first-child {\n    margin-top: 24px;\n  }\n\n  > :last-child {\n    margin-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  }\n\n  p: first-of-type {\n    padding-bottom: ${(props) => (props?.size === 'small' ? `8px` : props?.size === 'large' ? '24px' : '16px')};\n  }\n`;\n\nexport const ModalFooter = styled.section<{ size?: Size }>`\n  margin-top: ${(props) => (props?.size === Size.Small ? `20px` : props?.size === Size.Large ? '28px' : '24px')};\n  display: flex;\n  justify-content: flex-end;\n`;\n"],"file":"ModalStyles.js"}

package/dist/js/Paginator/Paginator.js

@@ -21,7 +21,7 @@ var _SystemIcons = require("../icons/systemicons/SystemIcons");
 
 var _typography = require("../styles/typography");
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -35,9 +35,11 @@ var Container = _styledComponents.default.nav(_templateObject || (_templateObjec
 
 var Items = _styledComponents.default.ul(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: flex;\n"])));
 
-var Item = _styledComponents.default.li(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 48px;\n  height: 45px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  & > * {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    height: 100%;\n    text-decoration: none;\n    border-bottom: 3px solid transparent;\n\n    ", "\n\n    &:focus,\n    &:focus-within {\n      box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n      outline-width: 0;\n    }\n  }\n  & > a:hover {\n    color: ", ";\n    background-color: ", ";\n    border-bottom: 3px solid transparent;\n    box-shadow: none;\n  }\n  & > a:active {\n    color: ", ";\n    background-color: ", ";\n    border-bottom: 3px solid transparent;\n    box-shadow: none;\n  }\n\n  & > a.active {\n    color: ", ";\n    border-bottom: 3px solid ", ";\n    background-color: ", ";\n    cursor: default;\n    box-shadow: none;\n    &:hover {\n      color: ", ";\n      background-color: ", ";\n      border-bottom: 3px solid ", ";\n    }\n    &:active {\n      color: ", ";\n      background-color: ", ";\n      border-bottom: 3px solid ", ";\n    }\n  }\n"])), (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _styles.COLORS.primary_800, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_100, _styles.COLORS.neutral_800, _styles.COLORS.primary_500, _styles.COLORS.neutral_20, _styles.COLORS.primary_800, _styles.COLORS.primary_20, _styles.COLORS.primary_500, _styles.COLORS.primary_700, _styles.COLORS.primary_100, _styles.COLORS.primary_500);
+var Item = _styledComponents.default.li(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 48px;\n  height: 45px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  & > * {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    height: 100%;\n    text-decoration: none;\n    border-bottom: 3px solid transparent;\n\n    ", "\n\n    &:focus,\n    &:focus-within {\n      box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n      outline-width: 0;\n    }\n  }\n\n  & > a:hover {\n    color: ", ";\n    background-color: ", ";\n    box-shadow: none;\n  }\n  & > a:active {\n    color: ", ";\n    background-color: ", ";\n    box-shadow: none;\n  }\n\n  & > a.active {\n    color: ", ";\n    background-color: ", ";\n    cursor: default;\n    box-shadow: none;\n    &:hover {\n      color: ", ";\n      background-color: ", ";\n    }\n    &:active {\n      color: ", ";\n      background-color: ", ";\n    }\n  }\n"])), (0, _typography.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _styles.COLORS.primary_800, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_100, _styles.COLORS.neutral_800, _styles.COLORS.neutral_20, _styles.COLORS.primary_800, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_100);
 
 var Dots = (0, _styledComponents.default)(Item)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  padding-top: 1%;\n  cursor: not-allowed;\n"])));
+var ItemContent = (0, _styledComponents.default)('div')(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  width: 100%;\n  text-align:center;\n  display: table-cell;\n  vertical-align:middle;\n"])));
+var ItemSelected = (0, _styledComponents.default)('div')(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  justify-content: center;\n  margin: 0 20%;\n  border-radius: 4px;\n  text-align: center;\n  height: 4px;\n  background-color: ", "\n"])), _styles.COLORS.primary_500);
 
 var Step = function Step(_ref) {
   var _ref$up = _ref.up,
@@ -120,7 +122,7 @@ var Paginator = function Paginator(_ref2) {
     onClick: function onClick() {
       if (_onPageChange) _onPageChange(1);
     }
-  }, "1")), currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(function (item) {
+  }, /*#__PURE__*/React.createElement(ItemContent, null, /*#__PURE__*/React.createElement("span", null, "1"), currentPage === 1 && /*#__PURE__*/React.createElement(ItemSelected, null)))), currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(function (item) {
     return item === 1;
   }) === -1 && /*#__PURE__*/React.createElement(Dots, null, /*#__PURE__*/React.createElement(_SystemIcons.MoreHorizontal, {
     color: _styles.COLORS.neutral_600
@@ -132,7 +134,7 @@ var Paginator = function Paginator(_ref2) {
       onClick: function onClick() {
         if (_onPageChange) _onPageChange(page);
       }
-    }, page));
+    }, /*#__PURE__*/React.createElement(ItemContent, null, /*#__PURE__*/React.createElement("span", null, page), currentPage === page && /*#__PURE__*/React.createElement(ItemSelected, null))));
   }), pageCount > 5 && currentPage <= pageCount - 3 && /*#__PURE__*/React.createElement(Dots, null, /*#__PURE__*/React.createElement(_SystemIcons.MoreHorizontal, {
     color: _styles.COLORS.neutral_600
   })), pages.findIndex(function (item) {
@@ -142,7 +144,7 @@ var Paginator = function Paginator(_ref2) {
     onClick: function onClick() {
       if (_onPageChange) _onPageChange(pageCount);
     }
-  }, pageCount)), /*#__PURE__*/React.createElement(Step, {
+  }, /*#__PURE__*/React.createElement(ItemContent, null, /*#__PURE__*/React.createElement("span", null, pageCount), currentPage === pageCount && /*#__PURE__*/React.createElement(ItemSelected, null)))), /*#__PURE__*/React.createElement(Step, {
     up: true,
     target: "".concat(baseUrl, "/").concat(currentPage + 1),
     page: currentPage + 1,

package/dist/js/Paginator/Paginator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Paginator/Paginator.tsx"],"names":["Container","styled","nav","BREAKPOINTS","MEDIUM","Items","ul","Item","li","ComponentTextStyle","Regular","COLORS","neutral_600","primary_800","primary_20","primary_700","primary_100","neutral_800","primary_500","neutral_20","Dots","Step","up","target","disabled","page","onPageChange","testId","cursor","neutral_300","Paginator","pageCount","currentPage","baseUrl","pages","from","to","i","push","findIndex","item","map"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {ChevronLeft, ChevronRight, MoreHorizontal} from '../icons/systemicons/SystemIcons';\nimport {ComponentMStyling} from '../styles/typography';\n\nconst Container = styled.nav`\n  margin: 20px 0;\n  display: flex;\n  justify-content: center;\n\n  ${BREAKPOINTS.MEDIUM} {\n    width: 75%;\n  }\n`;\n\nconst Items = styled.ul`\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: flex;\n`;\n\nconst Item = styled.li`\n  width: 48px;\n  height: 45px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  & > * {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    height: 100%;\n    text-decoration: none;\n    border-bottom: 3px solid transparent;\n\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n    &:focus,\n    &:focus-within {\n      box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n      outline-width: 0;\n    }\n  }\n  & > a:hover {\n    color: ${COLORS.primary_800};\n    background-color: ${COLORS.primary_20};\n    border-bottom: 3px solid transparent;\n    box-shadow: none;\n  }\n  & > a:active {\n    color: ${COLORS.primary_700};\n    background-color: ${COLORS.primary_100};\n    border-bottom: 3px solid transparent;\n    box-shadow: none;\n  }\n\n  & > a.active {\n    color: ${COLORS.neutral_800};\n    border-bottom: 3px solid ${COLORS.primary_500};\n    background-color: ${COLORS.neutral_20};\n    cursor: default;\n    box-shadow: none;\n    &:hover {\n      color: ${COLORS.primary_800};\n      background-color: ${COLORS.primary_20};\n      border-bottom: 3px solid ${COLORS.primary_500};\n    }\n    &:active {\n      color: ${COLORS.primary_700};\n      background-color: ${COLORS.primary_100};\n      border-bottom: 3px solid ${COLORS.primary_500};\n    }\n  }\n`;\n\nconst Dots = styled(Item)`\n  padding-top: 1%;\n  cursor: not-allowed;\n`;\n\ntype PaginatorProps = {\n  pageCount: number;\n  currentPage: number;\n  baseUrl: string;\n  onPageChange?: (page: number) => void;\n};\n\nconst Step = ({\n  up = true,\n  target = '',\n  disabled = false,\n  page,\n  onPageChange,\n  testId,\n}: {\n  up: boolean;\n  target: string;\n  disabled: boolean;\n  page: number;\n  onPageChange?: (page: number) => void;\n  testId?: string;\n}) => {\n  if (disabled)\n    return (\n      <Item style={{ cursor: 'not-allowed' }} data-testid={`${testId}_Disabled`}>\n        {up ? <ChevronRight size=\"20\" color={COLORS.neutral_300} /> : <ChevronLeft size=\"20\" color={COLORS.neutral_300} />}\n      </Item>\n    );\n  return (\n    <Item data-testid={`${testId}_Enabled`}>\n      <NavLink\n        to={target}\n        onClick={() => {\n          if (onPageChange) onPageChange(page);\n        }}>\n        {up ? <ChevronRight size=\"20\" /> : <ChevronLeft />}\n      </NavLink>\n    </Item>\n  );\n};\n\nconst Paginator = ({ pageCount = 1, currentPage = 1, baseUrl = '', onPageChange }: PaginatorProps) => {\n  const pages = [];\n  let from = 2;\n  let to = 4;\n  if (pageCount === 0) return null;\n\n  if (pageCount > 1) {\n    if (currentPage >= 4 && currentPage <= pageCount - 2) {\n      from = currentPage - 1;\n      to = currentPage + 1;\n    } else if (pageCount - 2 > 1 && currentPage > pageCount - 2) {\n      from = pageCount - 3;\n      to = pageCount - 1;\n    }\n    if (to > pageCount) {\n      to = pageCount;\n    }\n    for (let i = from; i <= to; i += 1) {\n      pages.push(i);\n    }\n  }\n\n  return (\n    <Container>\n      <Items>\n        <Step\n          up={false}\n          target={`${baseUrl}/${currentPage - 1}`}\n          page={currentPage - 1}\n          disabled={currentPage === 1}\n          onPageChange={() => {\n            if (onPageChange) onPageChange(currentPage - 1);\n          }}\n          testId=\"Test-StepLeft\"\n        />\n        {pages.findIndex(item => item === 1) === -1 && (\n          <Item>\n            <NavLink\n              to={`${baseUrl}/1`}\n              onClick={() => {\n                if (onPageChange) onPageChange(1);\n              }}>\n              1\n            </NavLink>\n          </Item>\n        )}\n        {currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(item => item === 1) === -1 && (\n          <Dots>\n            <MoreHorizontal color={COLORS.neutral_600} />\n          </Dots>\n        )}\n        {pages.map(page => (\n          <Item key={page}>\n            <NavLink\n              to={`${baseUrl}/${page}`}\n              onClick={() => {\n                if (onPageChange) onPageChange(page);\n              }}>\n              {page}\n            </NavLink>\n          </Item>\n        ))}\n        {pageCount > 5 && currentPage <= pageCount - 3 && (\n          <Dots>\n            <MoreHorizontal color={COLORS.neutral_600} />\n          </Dots>\n        )}\n        {pages.findIndex(item => item === pageCount) === -1 && pageCount !== 1 && (\n          <Item>\n            <NavLink\n              to={`${baseUrl}/${pageCount}`}\n              onClick={() => {\n                if (onPageChange) onPageChange(pageCount);\n              }}>\n              {pageCount}\n            </NavLink>\n          </Item>\n        )}\n        <Step\n          up\n          target={`${baseUrl}/${currentPage + 1}`}\n          page={currentPage + 1}\n          disabled={currentPage === pageCount}\n          onPageChange={() => {\n            if (onPageChange) onPageChange(currentPage + 1);\n          }}\n          testId=\"Test-StepRight\"\n        />\n      </Items>\n    </Container>\n  );\n};\n\nexport default Paginator;\n"],"file":"Paginator.js"}
+{"version":3,"sources":["../../../src/Paginator/Paginator.tsx"],"names":["Container","styled","nav","BREAKPOINTS","MEDIUM","Items","ul","Item","li","ComponentTextStyle","Regular","COLORS","neutral_600","primary_800","primary_20","primary_700","primary_100","neutral_800","neutral_20","Dots","ItemContent","ItemSelected","primary_500","Step","up","target","disabled","page","onPageChange","testId","cursor","neutral_300","Paginator","pageCount","currentPage","baseUrl","pages","from","to","i","push","findIndex","item","map"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;AAEA,IAAMA,SAAS,GAAGC,0BAAOC,GAAV,2KAKXC,oBAAYC,MALD,CAAf;;AAUA,IAAMC,KAAK,GAAGJ,0BAAOK,EAAV,6IAAX;;AAOA,IAAMC,IAAI,GAAGN,0BAAOO,EAAV,+9BAgBJ,mCAAkBC,2BAAmBC,OAArC,EAA8CC,eAAOC,WAArD,CAhBI,EA0BGD,eAAOE,WA1BV,EA2BcF,eAAOG,UA3BrB,EA+BGH,eAAOI,WA/BV,EAgCcJ,eAAOK,WAhCrB,EAqCGL,eAAOM,WArCV,EAsCcN,eAAOO,UAtCrB,EA0CKP,eAAOE,WA1CZ,EA2CgBF,eAAOG,UA3CvB,EA8CKH,eAAOI,WA9CZ,EA+CgBJ,eAAOK,WA/CvB,CAAV;;AAoDA,IAAMG,IAAI,GAAG,+BAAOZ,IAAP,CAAH,qHAAV;AAKA,IAAMa,WAAW,GAAG,+BAAO,KAAP,CAAH,iKAAjB;AAMA,IAAMC,YAAY,GAAG,+BAAO,KAAP,CAAH,gNAMIV,eAAOW,WANX,CAAlB;;AAgBA,IAAMC,IAAI,GAAG,SAAPA,IAAO,OAcP;AAAA,qBAbJC,EAaI;AAAA,MAbJA,EAaI,wBAbC,IAaD;AAAA,yBAZJC,MAYI;AAAA,MAZJA,MAYI,4BAZK,EAYL;AAAA,2BAXJC,QAWI;AAAA,MAXJA,QAWI,8BAXO,KAWP;AAAA,MAVJC,IAUI,QAVJA,IAUI;AAAA,MATJC,YASI,QATJA,YASI;AAAA,MARJC,MAQI,QARJA,MAQI;AACJ,MAAIH,QAAJ,EACE,oBACE,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAE;AAAEI,MAAAA,MAAM,EAAE;AAAV,KAAb;AAAwC,6BAAgBD,MAAhB;AAAxC,KACGL,EAAE,gBAAG,oBAAC,yBAAD;AAAc,IAAA,IAAI,EAAC,IAAnB;AAAwB,IAAA,KAAK,EAAEb,eAAOoB;AAAtC,IAAH,gBAA2D,oBAAC,wBAAD;AAAa,IAAA,IAAI,EAAC,IAAlB;AAAuB,IAAA,KAAK,EAAEpB,eAAOoB;AAArC,IADhE,CADF;AAKF,sBACE,oBAAC,IAAD;AAAM,6BAAgBF,MAAhB;AAAN,kBACE,oBAAC,uBAAD;AACE,IAAA,EAAE,EAAEJ,MADN;AAEE,IAAA,OAAO,EAAE,mBAAM;AACb,UAAIG,YAAJ,EAAkBA,YAAY,CAACD,IAAD,CAAZ;AACnB;AAJH,KAKGH,EAAE,gBAAG,oBAAC,yBAAD;AAAc,IAAA,IAAI,EAAC;AAAnB,IAAH,gBAAgC,oBAAC,wBAAD,OALrC,CADF,CADF;AAWD,CAhCD;;AAkCA,IAAMQ,SAAS,GAAG,SAAZA,SAAY,QAAoF;AAAA,8BAAjFC,SAAiF;AAAA,MAAjFA,SAAiF,gCAArE,CAAqE;AAAA,gCAAlEC,WAAkE;AAAA,MAAlEA,WAAkE,kCAApD,CAAoD;AAAA,4BAAjDC,OAAiD;AAAA,MAAjDA,OAAiD,8BAAvC,EAAuC;AAAA,MAAnCP,aAAmC,SAAnCA,YAAmC;AACpG,MAAMQ,KAAK,GAAG,EAAd;AACA,MAAIC,IAAI,GAAG,CAAX;AACA,MAAIC,EAAE,GAAG,CAAT;AACA,MAAIL,SAAS,KAAK,CAAlB,EAAqB,OAAO,IAAP;;AAErB,MAAIA,SAAS,GAAG,CAAhB,EAAmB;AACjB,QAAIC,WAAW,IAAI,CAAf,IAAoBA,WAAW,IAAID,SAAS,GAAG,CAAnD,EAAsD;AACpDI,MAAAA,IAAI,GAAGH,WAAW,GAAG,CAArB;AACAI,MAAAA,EAAE,GAAGJ,WAAW,GAAG,CAAnB;AACD,KAHD,MAGO,IAAID,SAAS,GAAG,CAAZ,GAAgB,CAAhB,IAAqBC,WAAW,GAAGD,SAAS,GAAG,CAAnD,EAAsD;AAC3DI,MAAAA,IAAI,GAAGJ,SAAS,GAAG,CAAnB;AACAK,MAAAA,EAAE,GAAGL,SAAS,GAAG,CAAjB;AACD;;AACD,QAAIK,EAAE,GAAGL,SAAT,EAAoB;AAClBK,MAAAA,EAAE,GAAGL,SAAL;AACD;;AACD,SAAK,IAAIM,CAAC,GAAGF,IAAb,EAAmBE,CAAC,IAAID,EAAxB,EAA4BC,CAAC,IAAI,CAAjC,EAAoC;AAClCH,MAAAA,KAAK,CAACI,IAAN,CAAWD,CAAX;AACD;AACF;;AAED,sBACE,oBAAC,SAAD,qBACE,oBAAC,KAAD,qBACE,oBAAC,IAAD;AACE,IAAA,EAAE,EAAE,KADN;AAEE,IAAA,MAAM,YAAKJ,OAAL,cAAgBD,WAAW,GAAG,CAA9B,CAFR;AAGE,IAAA,IAAI,EAAEA,WAAW,GAAG,CAHtB;AAIE,IAAA,QAAQ,EAAEA,WAAW,KAAK,CAJ5B;AAKE,IAAA,YAAY,EAAE,wBAAM;AAClB,UAAIN,aAAJ,EAAkBA,aAAY,CAACM,WAAW,GAAG,CAAf,CAAZ;AACnB,KAPH;AAQE,IAAA,MAAM,EAAC;AART,IADF,EAWGE,KAAK,CAACK,SAAN,CAAgB,UAAAC,IAAI;AAAA,WAAIA,IAAI,KAAK,CAAb;AAAA,GAApB,MAAwC,CAAC,CAAzC,iBACC,oBAAC,IAAD,qBACE,oBAAC,uBAAD;AACE,IAAA,EAAE,YAAKP,OAAL,OADJ;AAEE,IAAA,OAAO,EAAE,mBAAM;AACb,UAAIP,aAAJ,EAAkBA,aAAY,CAAC,CAAD,CAAZ;AACnB;AAJH,kBAKI,oBAAC,WAAD,qBACC,sCADD,EAEEM,WAAW,KAAK,CAAhB,iBAAqB,oBAAC,YAAD,OAFvB,CALJ,CADF,CAZJ,EAyBGA,WAAW,IAAI,CAAf,IAAoBD,SAAS,GAAG,CAAhC,IAAqCA,SAArC,IAAkDG,KAAK,CAACK,SAAN,CAAgB,UAAAC,IAAI;AAAA,WAAIA,IAAI,KAAK,CAAb;AAAA,GAApB,MAAwC,CAAC,CAA3F,iBACC,oBAAC,IAAD,qBACE,oBAAC,2BAAD;AAAgB,IAAA,KAAK,EAAE/B,eAAOC;AAA9B,IADF,CA1BJ,EA8BGwB,KAAK,CAACO,GAAN,CAAU,UAAAhB,IAAI;AAAA,wBACb,oBAAC,IAAD;AAAM,MAAA,GAAG,EAAEA;AAAX,oBACE,oBAAC,uBAAD;AACE,MAAA,EAAE,YAAKQ,OAAL,cAAgBR,IAAhB,CADJ;AAEE,MAAA,OAAO,EAAE,mBAAM;AACb,YAAIC,aAAJ,EAAkBA,aAAY,CAACD,IAAD,CAAZ;AACnB;AAJH,oBAKI,oBAAC,WAAD,qBACC,kCAAOA,IAAP,CADD,EAEEO,WAAW,KAAKP,IAAhB,iBAAwB,oBAAC,YAAD,OAF1B,CALJ,CADF,CADa;AAAA,GAAd,CA9BH,EA4CGM,SAAS,GAAG,CAAZ,IAAiBC,WAAW,IAAID,SAAS,GAAG,CAA5C,iBACC,oBAAC,IAAD,qBACE,oBAAC,2BAAD;AAAgB,IAAA,KAAK,EAAEtB,eAAOC;AAA9B,IADF,CA7CJ,EAiDGwB,KAAK,CAACK,SAAN,CAAgB,UAAAC,IAAI;AAAA,WAAIA,IAAI,KAAKT,SAAb;AAAA,GAApB,MAAgD,CAAC,CAAjD,IAAsDA,SAAS,KAAK,CAApE,iBACC,oBAAC,IAAD,qBACE,oBAAC,uBAAD;AACE,IAAA,EAAE,YAAKE,OAAL,cAAgBF,SAAhB,CADJ;AAEE,IAAA,OAAO,EAAE,mBAAM;AACb,UAAIL,aAAJ,EAAkBA,aAAY,CAACK,SAAD,CAAZ;AACnB;AAJH,kBAKI,oBAAC,WAAD,qBACC,kCAAOA,SAAP,CADD,EAEEC,WAAW,KAAKD,SAAhB,iBAA6B,oBAAC,YAAD,OAF/B,CALJ,CADF,CAlDJ,eA+DE,oBAAC,IAAD;AACE,IAAA,EAAE,MADJ;AAEE,IAAA,MAAM,YAAKE,OAAL,cAAgBD,WAAW,GAAG,CAA9B,CAFR;AAGE,IAAA,IAAI,EAAEA,WAAW,GAAG,CAHtB;AAIE,IAAA,QAAQ,EAAEA,WAAW,KAAKD,SAJ5B;AAKE,IAAA,YAAY,EAAE,wBAAM;AAClB,UAAIL,aAAJ,EAAkBA,aAAY,CAACM,WAAW,GAAG,CAAf,CAAZ;AACnB,KAPH;AAQE,IAAA,MAAM,EAAC;AART,IA/DF,CADF,CADF;AA8ED,CApGD;;;AAxCED,EAAAA,S;AACAC,EAAAA,W;AACAC,EAAAA,O;AACAP,EAAAA,Y;;eA2IaI,S","sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle} from '../styles';\nimport {ChevronLeft, ChevronRight, MoreHorizontal} from '../icons/systemicons/SystemIcons';\nimport {ComponentMStyling} from '../styles/typography';\n\nconst Container = styled.nav`\n  margin: 20px 0;\n  display: flex;\n  justify-content: center;\n\n  ${BREAKPOINTS.MEDIUM} {\n    width: 75%;\n  }\n`;\n\nconst Items = styled.ul`\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  display: flex;\n`;\n\nconst Item = styled.li`\n  width: 48px;\n  height: 45px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  & > * {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    height: 100%;\n    text-decoration: none;\n    border-bottom: 3px solid transparent;\n\n    ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n    &:focus,\n    &:focus-within {\n      box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n      outline-width: 0;\n    }\n  }\n\n  & > a:hover {\n    color: ${COLORS.primary_800};\n    background-color: ${COLORS.primary_20};\n    box-shadow: none;\n  }\n  & > a:active {\n    color: ${COLORS.primary_700};\n    background-color: ${COLORS.primary_100};\n    box-shadow: none;\n  }\n\n  & > a.active {\n    color: ${COLORS.neutral_800};\n    background-color: ${COLORS.neutral_20};\n    cursor: default;\n    box-shadow: none;\n    &:hover {\n      color: ${COLORS.primary_800};\n      background-color: ${COLORS.primary_20};\n    }\n    &:active {\n      color: ${COLORS.primary_700};\n      background-color: ${COLORS.primary_100};\n    }\n  }\n`;\n\nconst Dots = styled(Item)`\n  padding-top: 1%;\n  cursor: not-allowed;\n`;\n\nconst ItemContent = styled('div')`\n  width: 100%;\n  text-align:center;\n  display: table-cell;\n  vertical-align:middle;\n`\nconst ItemSelected = styled('div')`\n  justify-content: center;\n  margin: 0 20%;\n  border-radius: 4px;\n  text-align: center;\n  height: 4px;\n  background-color: ${COLORS.primary_500}\n`\n\ntype PaginatorProps = {\n  pageCount: number;\n  currentPage: number;\n  baseUrl: string;\n  onPageChange?: (page: number) => void;\n};\n\nconst Step = ({\n  up = true,\n  target = '',\n  disabled = false,\n  page,\n  onPageChange,\n  testId,\n}: {\n  up: boolean;\n  target: string;\n  disabled: boolean;\n  page: number;\n  onPageChange?: (page: number) => void;\n  testId?: string;\n}) => {\n  if (disabled)\n    return (\n      <Item style={{ cursor: 'not-allowed' }} data-testid={`${testId}_Disabled`}>\n        {up ? <ChevronRight size=\"20\" color={COLORS.neutral_300} /> : <ChevronLeft size=\"20\" color={COLORS.neutral_300} />}\n      </Item>\n    );\n  return (\n    <Item data-testid={`${testId}_Enabled`}>\n      <NavLink\n        to={target}\n        onClick={() => {\n          if (onPageChange) onPageChange(page);\n        }}>\n        {up ? <ChevronRight size=\"20\" /> : <ChevronLeft />}\n      </NavLink>\n    </Item>\n  );\n};\n\nconst Paginator = ({ pageCount = 1, currentPage = 1, baseUrl = '', onPageChange }: PaginatorProps) => {\n  const pages = [];\n  let from = 2;\n  let to = 4;\n  if (pageCount === 0) return null;\n\n  if (pageCount > 1) {\n    if (currentPage >= 4 && currentPage <= pageCount - 2) {\n      from = currentPage - 1;\n      to = currentPage + 1;\n    } else if (pageCount - 2 > 1 && currentPage > pageCount - 2) {\n      from = pageCount - 3;\n      to = pageCount - 1;\n    }\n    if (to > pageCount) {\n      to = pageCount;\n    }\n    for (let i = from; i <= to; i += 1) {\n      pages.push(i);\n    }\n  }\n\n  return (\n    <Container>\n      <Items>\n        <Step\n          up={false}\n          target={`${baseUrl}/${currentPage - 1}`}\n          page={currentPage - 1}\n          disabled={currentPage === 1}\n          onPageChange={() => {\n            if (onPageChange) onPageChange(currentPage - 1);\n          }}\n          testId=\"Test-StepLeft\"\n        />\n        {pages.findIndex(item => item === 1) === -1 && (\n          <Item>\n            <NavLink\n              to={`${baseUrl}/1`}\n              onClick={() => {\n                if (onPageChange) onPageChange(1);\n              }}>\n                <ItemContent>\n                 <span>1</span>\n                 {currentPage === 1 && <ItemSelected />}\n                </ItemContent>\n            </NavLink>\n          </Item>\n        )}\n        {currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(item => item === 1) === -1 && (\n          <Dots>\n            <MoreHorizontal color={COLORS.neutral_600} />\n          </Dots>\n        )}\n        {pages.map(page => (\n          <Item key={page}>\n            <NavLink\n              to={`${baseUrl}/${page}`}\n              onClick={() => {\n                if (onPageChange) onPageChange(page);\n              }}>\n                <ItemContent>\n                 <span>{page}</span>\n                 {currentPage === page && <ItemSelected />}\n                </ItemContent>\n            </NavLink>\n          </Item>\n        ))}\n        {pageCount > 5 && currentPage <= pageCount - 3 && (\n          <Dots>\n            <MoreHorizontal color={COLORS.neutral_600} />\n          </Dots>\n        )}\n        {pages.findIndex(item => item === pageCount) === -1 && pageCount !== 1 && (\n          <Item>\n            <NavLink\n              to={`${baseUrl}/${pageCount}`}\n              onClick={() => {\n                if (onPageChange) onPageChange(pageCount);\n              }}>\n                <ItemContent>\n                 <span>{pageCount}</span>\n                 {currentPage === pageCount && <ItemSelected />}\n                </ItemContent>\n            </NavLink>\n          </Item>\n        )}\n        <Step\n          up\n          target={`${baseUrl}/${currentPage + 1}`}\n          page={currentPage + 1}\n          disabled={currentPage === pageCount}\n          onPageChange={() => {\n            if (onPageChange) onPageChange(currentPage + 1);\n          }}\n          testId=\"Test-StepRight\"\n        />\n      </Items>\n    </Container>\n  );\n};\n\nexport default Paginator;\n"],"file":"Paginator.js"}

package/dist/js/Paginator/__tests__/Paginator.test.js

@@ -57,7 +57,7 @@ describe('<Paginator />', function () {
             expect(queryByText('1')).toBeDefined();
             expect(getByTestId('Test-StepLeft_Disabled')).toBeDefined();
             expect(getByTestId('Test-StepRight_Enabled')).toBeDefined();
-            expect(queryByText('6')).toHaveProperty('href'); // Click on stepper to the right. Expect to be taken from 1 to 2
+            expect(queryByText('6')).toBeDefined(); // Click on stepper to the right. Expect to be taken from 1 to 2
 
             getByTestId('Test-StepRight_Enabled').children[0].click();
             expect(history.location.pathname).toBe('/2'); // Click directly on 6. Expect to be taken to /6

package/dist/js/Paginator/__tests__/Paginator.test.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/Paginator/__tests__/Paginator.test.tsx"],"names":["jest","mock","requireActual","useLocation","pathname","describe","it","history","route","push","queryByText","getByTestId","expect","toBeDefined","toHaveProperty","children","click","location","toBe"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;AAEAA,IAAI,CAACC,IAAL,CAAU,kBAAV,EAA8B;AAAA,yCACzBD,IAAI,CAACE,aAAL,CAAmB,kBAAnB,CADyB;AAE5BC,IAAAA,WAAW,EAAE;AAAA,aAAO;AAClBC,QAAAA,QAAQ,EAAE;AADQ,OAAP;AAAA;AAFe;AAAA,CAA9B;AAOAC,QAAQ,CAAC,eAAD,EAAkB,YAAM;AAC9BC,EAAAA,EAAE,CAAC,mBAAD,uEAAsB;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAChBC,YAAAA,OADgB,GACN,mCADM;AAEhBC,YAAAA,KAFgB,GAER,IAFQ;AAGtBD,YAAAA,OAAO,CAACE,IAAR,CAAaD,KAAb;AAHsB,sBAIe,kCACnC,6BAAC,mBAAD;AAAQ,cAAA,OAAO,EAAED;AAAjB,4BACE,6BAAC,gBAAD;AAAW,cAAA,SAAS,EAAE,CAAtB;AAAyB,cAAA,WAAW,EAAE,CAAtC;AAAyC,cAAA,OAAO,EAAC,EAAjD;AAAoD,cAAA,YAAY,EAAE,wBAAM,CAAE;AAA1E,cADF,CADmC,CAJf,EAIdG,WAJc,WAIdA,WAJc,EAIDC,WAJC,WAIDA,WAJC;AAStBC,YAAAA,MAAM,CAACF,WAAW,CAAC,GAAD,CAAZ,CAAN,CAAyBG,WAAzB;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACF,WAAW,CAAC,GAAD,CAAZ,CAAN,CAAyBI,cAAzB,CAAwC,MAAxC,EAZsB,CActB;;AACCH,YAAAA,WAAW,CAAC,wBAAD,CAAX,CAAsCI,QAAtC,CAA+C,CAA/C,CAAD,CAAmEC,KAAnE;AACAJ,YAAAA,MAAM,CAACL,OAAO,CAACU,QAAR,CAAiBb,QAAlB,CAAN,CAAkCc,IAAlC,CAAuC,IAAvC,EAhBsB,CAkBtB;;AACA,4BAAAR,WAAW,CAAC,GAAD,CAAX,8DAAkBM,KAAlB;AACAJ,YAAAA,MAAM,CAACL,OAAO,CAACU,QAAR,CAAiBb,QAAlB,CAAN,CAAkCc,IAAlC,CAAuC,IAAvC;;AApBsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAAtB,GAAF;AAsBD,CAvBO,CAAR","sourcesContent":["import React, { useState } from 'react';\nimport { render } from '@testing-library/react';\nimport { Paginator } from '../index';\nimport { Router } from 'react-router';\nimport { createMemoryHistory } from 'history';\nimport 'jest-styled-components';\n\njest.mock('react-router-dom', () => ({\n  ...jest.requireActual('react-router-dom'),\n  useLocation: () => ({\n    pathname: 'localhost:3000/test',\n  }),\n}));\n\ndescribe('<Paginator />', () => {\n  it('Renders Paginator', async () => {\n    const history = createMemoryHistory();\n    const route = '/1';\n    history.push(route);\n    const { queryByText, getByTestId } = render(\n      <Router history={history}>\n        <Paginator pageCount={6} currentPage={1} baseUrl=\"\" onPageChange={() => {}} />\n      </Router>,\n    );\n    expect(queryByText('1')).toBeDefined();\n    expect(getByTestId('Test-StepLeft_Disabled')).toBeDefined();\n    expect(getByTestId('Test-StepRight_Enabled')).toBeDefined();\n    expect(queryByText('6')).toHaveProperty('href');\n\n    // Click on stepper to the right. Expect to be taken from 1 to 2\n    (getByTestId('Test-StepRight_Enabled').children[0] as HTMLElement).click();\n    expect(history.location.pathname).toBe('/2');\n\n    // Click directly on 6. Expect to be taken to /6\n    queryByText('6')?.click();\n    expect(history.location.pathname).toBe('/6');\n  });\n});\n"],"file":"Paginator.test.js"}
+{"version":3,"sources":["../../../../src/Paginator/__tests__/Paginator.test.tsx"],"names":["jest","mock","requireActual","useLocation","pathname","describe","it","history","route","push","queryByText","getByTestId","expect","toBeDefined","children","click","location","toBe"],"mappings":";;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;AAEAA,IAAI,CAACC,IAAL,CAAU,kBAAV,EAA8B;AAAA,yCACzBD,IAAI,CAACE,aAAL,CAAmB,kBAAnB,CADyB;AAE5BC,IAAAA,WAAW,EAAE;AAAA,aAAO;AAClBC,QAAAA,QAAQ,EAAE;AADQ,OAAP;AAAA;AAFe;AAAA,CAA9B;AAOAC,QAAQ,CAAC,eAAD,EAAkB,YAAM;AAC9BC,EAAAA,EAAE,CAAC,mBAAD,uEAAsB;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAChBC,YAAAA,OADgB,GACN,mCADM;AAEhBC,YAAAA,KAFgB,GAER,IAFQ;AAGtBD,YAAAA,OAAO,CAACE,IAAR,CAAaD,KAAb;AAHsB,sBAIe,kCACnC,6BAAC,mBAAD;AAAQ,cAAA,OAAO,EAAED;AAAjB,4BACE,6BAAC,gBAAD;AAAW,cAAA,SAAS,EAAE,CAAtB;AAAyB,cAAA,WAAW,EAAE,CAAtC;AAAyC,cAAA,OAAO,EAAC,EAAjD;AAAoD,cAAA,YAAY,EAAE,wBAAM,CAAE;AAA1E,cADF,CADmC,CAJf,EAIdG,WAJc,WAIdA,WAJc,EAIDC,WAJC,WAIDA,WAJC;AAStBC,YAAAA,MAAM,CAACF,WAAW,CAAC,GAAD,CAAZ,CAAN,CAAyBG,WAAzB;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACD,WAAW,CAAC,wBAAD,CAAZ,CAAN,CAA8CE,WAA9C;AACAD,YAAAA,MAAM,CAACF,WAAW,CAAC,GAAD,CAAZ,CAAN,CAAyBG,WAAzB,GAZsB,CActB;;AACCF,YAAAA,WAAW,CAAC,wBAAD,CAAX,CAAsCG,QAAtC,CAA+C,CAA/C,CAAD,CAAmEC,KAAnE;AACAH,YAAAA,MAAM,CAACL,OAAO,CAACS,QAAR,CAAiBZ,QAAlB,CAAN,CAAkCa,IAAlC,CAAuC,IAAvC,EAhBsB,CAkBtB;;AACA,4BAAAP,WAAW,CAAC,GAAD,CAAX,8DAAkBK,KAAlB;AACAH,YAAAA,MAAM,CAACL,OAAO,CAACS,QAAR,CAAiBZ,QAAlB,CAAN,CAAkCa,IAAlC,CAAuC,IAAvC;;AApBsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAAtB,GAAF;AAsBD,CAvBO,CAAR","sourcesContent":["import React, { useState } from 'react';\nimport { render } from '@testing-library/react';\nimport { Paginator } from '../index';\nimport { Router } from 'react-router';\nimport { createMemoryHistory } from 'history';\nimport 'jest-styled-components';\n\njest.mock('react-router-dom', () => ({\n  ...jest.requireActual('react-router-dom'),\n  useLocation: () => ({\n    pathname: 'localhost:3000/test',\n  }),\n}));\n\ndescribe('<Paginator />', () => {\n  it('Renders Paginator', async () => {\n    const history = createMemoryHistory();\n    const route = '/1';\n    history.push(route);\n    const { queryByText, getByTestId } = render(\n      <Router history={history}>\n        <Paginator pageCount={6} currentPage={1} baseUrl=\"\" onPageChange={() => {}} />\n      </Router>,\n    );\n    expect(queryByText('1')).toBeDefined();\n    expect(getByTestId('Test-StepLeft_Disabled')).toBeDefined();\n    expect(getByTestId('Test-StepRight_Enabled')).toBeDefined();\n    expect(queryByText('6')).toBeDefined();\n\n    // Click on stepper to the right. Expect to be taken from 1 to 2\n    (getByTestId('Test-StepRight_Enabled').children[0] as HTMLElement).click();\n    expect(history.location.pathname).toBe('/2');\n\n    // Click directly on 6. Expect to be taken to /6\n    queryByText('6')?.click();\n    expect(history.location.pathname).toBe('/6');\n  });\n});\n"],"file":"Paginator.test.js"}

package/dist/js/Table/Table.js

@@ -17,6 +17,8 @@ var _index2 = require("../Dropdown/index");
 
 var _index3 = require("../Button/index");
 
+var _types = require("../types");
+
 var _styles = require("../styles");
 
 var _TableStyles = require("./TableStyles");
@@ -407,7 +409,7 @@ var Table = function Table(_ref) {
           className: "".concat(column.shortenText && "truncate-text", " ").concat(column.justify ? "justify-".concat(column.justify) : '', " "),
           title: column.shortenText && row[column.key]
         }, column.isLink && row[column.key] ? /*#__PURE__*/React.createElement(_index3.Button, {
-          size: "small",
+          size: _types.Size.Small,
           variant: "text",
           onClick: function onClick(event) {
             return onLinkClick(row, column.key, event);

package/dist/js/Table/Table.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Table/Table.tsx"],"names":["Table","rowClick","linkClick","iconClick","previousPageClick","nextPageClick","rowsPerPageChange","triggerSortingChange","title","columns","rows","remotePagination","pagination","showLoadingIndicator","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sortedColumn","setSortedColumn","sortedDirection","setSortedDirection","from","setFrom","to","setTo","total","setTotal","useEffect","tmpFilteredRows","filterAndSortRows","length","rowsFrom","rowsTo","slice","filter","row","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","some","sortingDirection","sortingColumn","find","sort","a","b","sortTableColumn","map","tmpColumn","sortable","undefined","previousPage","nextPage","changeRowsPerPage","value","parseInt","renderHeader","COLORS","neutral_600","width","justify","name","onLinkClick","event","stopPropagation","onIconClick","onRowClick","selectedText","window","getSelection","toString","renderBody","index","colorFn","color","maxWidth","shortenText","isLink","isIcon","icon","icons","size","className","customContent","renderFooter","rowsPerPageValues"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport { MoreVertical, ChevronRight, ChevronLeft, ArrowLineDown, ArrowLineUp } from '../icons/systemicons/SystemIcons';\nimport { SystemIcons as icons } from '../icons/index';\nimport { DropdownFilter } from '../Dropdown/index';\nimport { IconButton, Button } from '../Button/index';\n\n/**\n * Import custom styles.\n */\nimport { COLORS } from '../styles';\nimport { TableHeaderRowCol, TableColumnHeaderCol, TableContainer, TableDataCol, TableDataRow, TableFooterCol, TableWrapper, TableLoadingIndicator } from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport { TableProps, TableColumn, TableSortingDirection } from './TableTypes';\nimport { LoadingIndicator } from '../LoadingIndicator';\n\nconst Table: React.FunctionComponent<TableProps> = ({\n  rowClick,\n  linkClick,\n  iconClick,\n  previousPageClick,\n  nextPageClick,\n  rowsPerPageChange,\n  triggerSortingChange,\n  title,\n  columns,\n  rows,\n  remotePagination,\n  pagination,\n  showLoadingIndicator,\n}: TableProps) => {\n  // States used within the component\n  const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n  const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n  const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n  const [currentPage, setCurrentPage] = React.useState<number>(1);\n  const [sortedColumn, setSortedColumn] = React.useState<string>('');\n  const [sortedDirection, setSortedDirection] = React.useState<TableSortingDirection>('asc');\n  const [from, setFrom] = React.useState<number>();\n  const [to, setTo] = React.useState<number>();\n  const [total, setTotal] = React.useState<number>();\n\n  /**\n   * Takes care of local pagination.\n   * Works only in case remote pagination is not defined or is set to false.\n   */\n  React.useEffect(() => {\n    if (!remotePagination) {\n      // Let's retrieve temporary filtered rows and update globally filtered rows\n      const tmpFilteredRows = filterAndSortRows();\n      setFilteredRows(tmpFilteredRows);\n      setTotal(tmpFilteredRows.length);\n\n      // Assign rows from and rows to\n      const rowsFrom = (currentPage - 1) * rowsPerPage;\n      const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n      // Set from and to values\n      setFrom(rowsFrom + 1);\n      setTo(rowsTo);\n\n      // Filter out the rows\n      setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n    }\n  }, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remotePagination]);\n\n  /**\n   * Takes care of remote pagination.\n   * Works only in case remote pagination is set to true.\n   */\n  React.useEffect(() => {\n    if (remotePagination) {\n      setCurrentPageRows(rows);\n\n      // Let's assign pagination values\n      setFrom(pagination?.from);\n      setTo(pagination?.to);\n      setTotal(pagination?.total);\n      setCurrentPage(pagination?.currentPage!);\n      setRowsPerPage(pagination?.rowsPerPage!);\n    }\n  }, [remotePagination, pagination, rows]);\n\n  /**\n   * Filters out a rows by specific column filters and sorts them if any sorting is set.\n   * @returns Filtered and sorted rows.\n   */\n  const filterAndSortRows = (): any[] => {\n    let tmpFilteredRows = rows.filter((row) => {\n      // Let's start with matched filter criteria\n      let matchFilterCriteria = true;\n\n      // Let's go through columns\n      for (const column of columns) {\n        // Let's check if filter value is specified for the column\n        // And if it doesn't match the current row column value\n        // Then let's update match filter criteria to failed\n        if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n          matchFilterCriteria = false;\n        }\n      }\n\n      // Let's return row only in case match filter criteria succeeds\n      if (matchFilterCriteria) {\n        return row;\n      }\n    });\n\n    // Let's apply sorting if needed\n    if (columns.some((column) => column.sortingDirection)) {\n      // Let's find the sorting column\n      const sortingColumn = columns.find((column) => column.sortingDirection)!;\n\n      // Update sorted column data\n      setSortedDirection(sortingColumn.sortingDirection!);\n      setSortedColumn(sortingColumn.key!);\n\n      // Let's sort the rows\n      tmpFilteredRows.sort((a, b) => {\n        if (a[sortingColumn.key] > b[sortingColumn.key]) {\n          return sortingColumn.sortingDirection === 'asc' ? 1 : -1;\n        } else if (a[sortingColumn.key] < b[sortingColumn.key]) {\n          return sortingColumn.sortingDirection === 'asc' ? -1 : 1;\n        } else {\n          return 0;\n        }\n      });\n    }\n\n    // Let's return filtered rows\n    return tmpFilteredRows;\n  };\n\n  /**\n   * Applies a specific sorting to a column.\n   * If no sorting exists, then applies ascending initially\n   * @param column - Column to which sorting should be applied.\n   */\n  const sortTableColumn = (column: TableColumn): void => {\n    // Let's remove any active sorting\n    columns = columns.map((tmpColumn: TableColumn) => {\n      // Let's apply new sorting\n      // Let's check if it is the column for which we have to apply sorting\n      if (column.key === tmpColumn.key && tmpColumn.sortable) {\n        // Let's check if sorting is not defined\n        // If so, let's toggle the sorting direction\n        if (tmpColumn.sortingDirection !== undefined) {\n          if (tmpColumn.sortingDirection === 'asc') {\n            tmpColumn.sortingDirection = 'desc';\n\n            // Update sorted column and direction\n            setSortedColumn(column.key);\n            setSortedDirection('desc');\n\n            // Let's trigger remote sorting trigger function\n            if (remotePagination && triggerSortingChange) {\n              triggerSortingChange(column.key, 'desc');\n            }\n          } else {\n            tmpColumn.sortingDirection = 'asc';\n\n            // Update sorted column and direction\n            setSortedColumn(column.key);\n            setSortedDirection('asc');\n\n            // Let's trigger remote sorting trigger function\n            if (remotePagination && triggerSortingChange) {\n              triggerSortingChange(column.key, 'asc');\n            }\n          }\n        } else {\n          // Let's apply the initial sorting\n          tmpColumn.sortingDirection = 'asc';\n\n          // Update sorted column and direction\n          setSortedColumn(column.key);\n          setSortedDirection('asc');\n\n          // Let's trigger remote sorting trigger function\n          if (remotePagination && triggerSortingChange) {\n            triggerSortingChange(column.key, 'asc');\n          }\n        }\n      } else if (tmpColumn.sortingDirection !== undefined) {\n        // Let's remove sorting\n        tmpColumn.sortingDirection = undefined;\n      }\n\n      return tmpColumn;\n    });\n  };\n\n  /**\n   * Navigates user back to the previous page and updates the current table page.\n   */\n  const previousPage = () => {\n    if (remotePagination) {\n      // Let's inform parent component about page change\n      if (previousPageClick) {\n        previousPageClick();\n      }\n    } else {\n      // Let's change the page within the component\n      setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n    }\n  };\n\n  /**\n   * Navigates user to the next page and updates the current table page.\n   */\n  const nextPage = () => {\n    if (remotePagination) {\n      // Let's inform parent component about page change\n      if (nextPageClick) {\n        nextPageClick();\n      }\n    } else {\n      // Let's change the page within the component\n      setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n    }\n  };\n\n  /**\n   * Updates the rows per page value and refreshes the table content accordingly.\n   * @param value - Newly selected rows per page value.\n   */\n  const changeRowsPerPage = (value: string) => {\n    // Let's check if we are using remote pagination\n    if (remotePagination) {\n      // Inform parent component about rows per page change\n      if (rowsPerPageChange) {\n        rowsPerPageChange(parseInt(value));\n      }\n    } else {\n      // Let's reset current page to 1\n      setCurrentPage(1);\n    }\n\n    // Let's set rows per page\n    setRowsPerPage(parseInt(value));\n  };\n\n  /**\n   * Renders the table header.\n   */\n  const renderHeader = () => {\n    return (\n      <thead>\n        {title && (\n          <tr data-testid=\"TestTableHeaderRow\">\n            <TableHeaderRowCol colSpan={columns.length}>\n              <div>\n                {title}\n                <MoreVertical size=\"18px\" color={COLORS.neutral_600} />\n              </div>\n            </TableHeaderRowCol>\n          </tr>\n        )}\n        <tr data-testid=\"TestTableColumnHeaderRow\">\n          {columns.map((column: TableColumn) => (\n            <TableColumnHeaderCol\n              onClick={() => sortTableColumn(column)}\n              key={column.key}\n              style={{ width: column.width }}\n              className={`${column.sortable ? 'sortable' : ''} ${!title ? 'no-border' : ''} ${column.justify ? `justify-${column.justify}` : ''}`}>\n              {column.name}\n\n              {column.sortingDirection === 'asc' ? <ArrowLineUp size=\"20px\" /> : column.sortingDirection === 'desc' ? <ArrowLineDown size=\"20px\" /> : ''}\n            </TableColumnHeaderCol>\n          ))}\n        </tr>\n      </thead>\n    );\n  };\n\n  /**\n   * Function which is called when a mouse click happens on a link to pass data to the parent component.\n   * @param row - Row in which the link is located.\n   * @param key - Key of the column for which the link is set.\n   * @param event - Click event handler.\n   */\n  const onLinkClick = (row: any, key: string, event: React.MouseEvent) => {\n    if (linkClick) {\n      event.stopPropagation();\n\n      linkClick(row, key);\n    }\n  };\n\n  /**\n   * Function which is called when a mouse click happens on an icon to pass data to the parent component.\n   * @param row - Row in which the icon is located.\n   * @param key - Key of the column for which the icon is set.\n   * @param event - Click event handler.\n   */\n  const onIconClick = (row: any, key: string, event: React.MouseEvent<HTMLButtonElement>) => {\n    if (iconClick) {\n      event.stopPropagation();\n\n      iconClick(row, key);\n    }\n  };\n\n  /**\n   * Function which is called when a mouse click happens on a row to pass data to the parent component.\n   * @param row - Row in which the link is located.\n   */\n  const onRowClick = (row: any): void => {\n    const selectedText = window?.getSelection()?.toString();\n\n    // Let's trigger row click only if we haven't selected any text and action exists\n    if (selectedText?.length === 0 && rowClick) {\n      rowClick(row);\n    }\n  };\n\n  /**\n   * Renders the table body.\n   */\n  const renderBody = () => {\n    return (\n      <tbody>\n        {currentPageRows.length > 0 ? (\n          currentPageRows.map((row: any, index: number) => (\n            <TableDataRow key={`row_${index}`} onClick={() => onRowClick(row)} data-testid=\"TestTableDataRow\">\n              {columns.map((column: TableColumn) => (\n                <TableDataCol\n                  key={`row_${index}_${column.key}`}\n                  style={column.colorFn ? { color: column.colorFn(row, column.key), maxWidth: column.width } : { maxWidth: column.width }}\n                  className={`${column.shortenText && `truncate-text`} ${column.justify ? `justify-${column.justify}` : ''} `}\n                  title={column.shortenText && row[column.key]}>\n                  {column.isLink && row[column.key] ? (\n                    <Button\n                      size=\"small\"\n                      variant=\"text\"\n                      onClick={(event) => onLinkClick(row, column.key, event)}\n                      style={column.colorFn && { color: column.colorFn(row, column.key) }}>\n                      {row[column.key]}\n                    </Button>\n                  ) : column.isIcon && column.icon ? (\n                    <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground={true} action={(event) => onIconClick(row, column.key, event!)}>\n                      {icons[column.icon!]({ size: '24', className: 'icon' })}\n                    </IconButton>\n                  ) : column.customContent ? (\n                    column.customContent(row, column.key)\n                  ) : (\n                    row[column.key]\n                  )}\n                </TableDataCol>\n              ))}\n            </TableDataRow>\n          ))\n        ) : (\n          <TableDataRow className=\"no-rows\" data-testid=\"TestTableNoDataRow\">\n            <TableDataCol colSpan={columns.length} className=\"center\">\n              There are no rows to display\n            </TableDataCol>\n          </TableDataRow>\n        )}\n      </tbody>\n    );\n  };\n\n  /**\n   * Renders the table footer.\n   */\n  const renderFooter = () => {\n    // Define local values used within the footer\n    const rowsPerPageValues = ['10', '20', '50', '100'];\n\n    return (\n      <tfoot>\n        <tr>\n          <TableFooterCol colSpan={columns.length} data-testid=\"TestTableFooterRow\">\n            <div>\n              <span>Rows per page: </span>\n              <DropdownFilter\n                id=\"rows-per-page\"\n                list={rowsPerPageValues}\n                disableSorting={true}\n                onSelect={(value) => changeRowsPerPage(value)}\n                initalValue={rowsPerPage.toString()}\n                isButton={true}\n              />\n              <span className=\"current-page-info\">\n                {total === 0 ? 0 : from}-{to} of {total}\n              </span>\n              <div className=\"controls\">\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => previousPage()} disabled={from === 1}>\n                  <ChevronLeft size=\"24\" color={COLORS.neutral_600} />\n                </IconButton>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => nextPage()} disabled={to === total}>\n                  <ChevronRight size=\"24\" color={COLORS.neutral_600} />\n                </IconButton>\n              </div>\n            </div>\n          </TableFooterCol>\n        </tr>\n      </tfoot>\n    );\n  };\n\n  /**\n   * Return Table component.\n   */\n  return (\n    <TableWrapper>\n      <TableContainer cellPadding=\"0\" cellSpacing=\"0\" data-testid=\"TestTable\">\n        {renderHeader()}\n        {renderBody()}\n        {renderFooter()}\n      </TableContainer>\n      {showLoadingIndicator && (\n        <TableLoadingIndicator>\n          <LoadingIndicator size=\"medium\" color=\"#ffffff\"></LoadingIndicator>\n        </TableLoadingIndicator>\n      )}\n    </TableWrapper>\n  );\n};\n\nexport default Table;\n"],"file":"Table.js"}
+{"version":3,"sources":["../../../src/Table/Table.tsx"],"names":["Table","rowClick","linkClick","iconClick","previousPageClick","nextPageClick","rowsPerPageChange","triggerSortingChange","title","columns","rows","remotePagination","pagination","showLoadingIndicator","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sortedColumn","setSortedColumn","sortedDirection","setSortedDirection","from","setFrom","to","setTo","total","setTotal","useEffect","tmpFilteredRows","filterAndSortRows","length","rowsFrom","rowsTo","slice","filter","row","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","some","sortingDirection","sortingColumn","find","sort","a","b","sortTableColumn","map","tmpColumn","sortable","undefined","previousPage","nextPage","changeRowsPerPage","value","parseInt","renderHeader","COLORS","neutral_600","width","justify","name","onLinkClick","event","stopPropagation","onIconClick","onRowClick","selectedText","window","getSelection","toString","renderBody","index","colorFn","color","maxWidth","shortenText","isLink","Size","Small","isIcon","icon","icons","size","className","customContent","renderFooter","rowsPerPageValues"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AAMA;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,KAA0C,GAAG,SAA7CA,KAA6C,OAcjC;AAAA,MAbhBC,QAagB,QAbhBA,QAagB;AAAA,MAZhBC,SAYgB,QAZhBA,SAYgB;AAAA,MAXhBC,SAWgB,QAXhBA,SAWgB;AAAA,MAVhBC,iBAUgB,QAVhBA,iBAUgB;AAAA,MAThBC,aASgB,QAThBA,aASgB;AAAA,MARhBC,iBAQgB,QARhBA,iBAQgB;AAAA,MAPhBC,oBAOgB,QAPhBA,oBAOgB;AAAA,MANhBC,KAMgB,QANhBA,KAMgB;AAAA,MALhBC,OAKgB,QALhBA,OAKgB;AAAA,MAJhBC,IAIgB,QAJhBA,IAIgB;AAAA,MAHhBC,gBAGgB,QAHhBA,gBAGgB;AAAA,MAFhBC,UAEgB,QAFhBA,UAEgB;AAAA,MADhBC,oBACgB,QADhBA,oBACgB;;AAChB;AACA,wBAAsCC,KAAK,CAACC,QAAN,CAAuB,EAAvB,CAAtC;AAAA;AAAA,MAAOC,WAAP;AAAA,MAAoBC,cAApB;;AACA,yBAAwCH,KAAK,CAACC,QAAN,CAAsB,EAAtB,CAAxC;AAAA;AAAA,MAAOG,YAAP;AAAA,MAAqBC,eAArB;;AACA,yBAA8CL,KAAK,CAACC,QAAN,CAAsB,EAAtB,CAA9C;AAAA;AAAA,MAAOK,eAAP;AAAA,MAAwBC,kBAAxB;;AACA,yBAAsCP,KAAK,CAACC,QAAN,CAAuB,CAAvB,CAAtC;AAAA;AAAA,MAAOO,WAAP;AAAA,MAAoBC,cAApB;;AACA,yBAAwCT,KAAK,CAACC,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOS,YAAP;AAAA,MAAqBC,eAArB;;AACA,0BAA8CX,KAAK,CAACC,QAAN,CAAsC,KAAtC,CAA9C;AAAA;AAAA,MAAOW,eAAP;AAAA,MAAwBC,kBAAxB;;AACA,0BAAwBb,KAAK,CAACC,QAAN,EAAxB;AAAA;AAAA,MAAOa,IAAP;AAAA,MAAaC,OAAb;;AACA,0BAAoBf,KAAK,CAACC,QAAN,EAApB;AAAA;AAAA,MAAOe,EAAP;AAAA,MAAWC,KAAX;;AACA,0BAA0BjB,KAAK,CAACC,QAAN,EAA1B;AAAA;AAAA,MAAOiB,KAAP;AAAA,MAAcC,QAAd;AAEA;AACF;AACA;AACA;;;AACEnB,EAAAA,KAAK,CAACoB,SAAN,CAAgB,YAAM;AACpB,QAAI,CAACvB,gBAAL,EAAuB;AACrB;AACA,UAAMwB,eAAe,GAAGC,iBAAiB,EAAzC;AACAjB,MAAAA,eAAe,CAACgB,eAAD,CAAf;AACAF,MAAAA,QAAQ,CAACE,eAAe,CAACE,MAAjB,CAAR,CAJqB,CAMrB;;AACA,UAAMC,QAAQ,GAAG,CAAChB,WAAW,GAAG,CAAf,IAAoBN,WAArC;AACA,UAAMuB,MAAM,GAAGD,QAAQ,GAAGtB,WAAX,IAA0BmB,eAAe,CAACE,MAA1C,GAAmDF,eAAe,CAACE,MAAnE,GAA4EC,QAAQ,GAAGtB,WAAtG,CARqB,CAUrB;;AACAa,MAAAA,OAAO,CAACS,QAAQ,GAAG,CAAZ,CAAP;AACAP,MAAAA,KAAK,CAACQ,MAAD,CAAL,CAZqB,CAcrB;;AACAlB,MAAAA,kBAAkB,CAACc,eAAe,CAACK,KAAhB,CAAsBF,QAAtB,EAAgCC,MAAhC,CAAD,CAAlB;AACD;AACF,GAlBD,EAkBG,CAACvB,WAAD,EAAcN,IAAd,EAAoBY,WAApB,EAAiCb,OAAjC,EAA0Ce,YAA1C,EAAwDE,eAAxD,EAAyEf,gBAAzE,CAlBH;AAoBA;AACF;AACA;AACA;;AACEG,EAAAA,KAAK,CAACoB,SAAN,CAAgB,YAAM;AACpB,QAAIvB,gBAAJ,EAAsB;AACpBU,MAAAA,kBAAkB,CAACX,IAAD,CAAlB,CADoB,CAGpB;;AACAmB,MAAAA,OAAO,CAACjB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEgB,IAAb,CAAP;AACAG,MAAAA,KAAK,CAACnB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEkB,EAAb,CAAL;AACAG,MAAAA,QAAQ,CAACrB,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEoB,KAAb,CAAR;AACAT,MAAAA,cAAc,CAACX,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEU,WAAb,CAAd;AACAL,MAAAA,cAAc,CAACL,UAAD,aAACA,UAAD,uBAACA,UAAU,CAAEI,WAAb,CAAd;AACD;AACF,GAXD,EAWG,CAACL,gBAAD,EAAmBC,UAAnB,EAA+BF,IAA/B,CAXH;AAaA;AACF;AACA;AACA;;AACE,MAAM0B,iBAAiB,GAAG,SAApBA,iBAAoB,GAAa;AACrC,QAAID,eAAe,GAAGzB,IAAI,CAAC+B,MAAL,CAAY,UAACC,GAAD,EAAS;AACzC;AACA,UAAIC,mBAAmB,GAAG,IAA1B,CAFyC,CAIzC;;AAJyC,iDAKpBlC,OALoB;AAAA;;AAAA;AAKzC,4DAA8B;AAAA,cAAnBmC,MAAmB;;AAC5B;AACA;AACA;AACA,cAAIA,MAAM,CAACC,WAAP,IAAsBH,GAAG,CAACE,MAAM,CAACE,GAAR,CAAH,CAAgBC,WAAhB,GAA8BC,OAA9B,CAAsCJ,MAAM,CAACC,WAAP,CAAmBE,WAAnB,EAAtC,MAA4E,CAAC,CAAvG,EAA0G;AACxGJ,YAAAA,mBAAmB,GAAG,KAAtB;AACD;AACF,SAZwC,CAczC;;AAdyC;AAAA;AAAA;AAAA;AAAA;;AAezC,UAAIA,mBAAJ,EAAyB;AACvB,eAAOD,GAAP;AACD;AACF,KAlBqB,CAAtB,CADqC,CAqBrC;;AACA,QAAIjC,OAAO,CAACwC,IAAR,CAAa,UAACL,MAAD;AAAA,aAAYA,MAAM,CAACM,gBAAnB;AAAA,KAAb,CAAJ,EAAuD;AACrD;AACA,UAAMC,aAAa,GAAG1C,OAAO,CAAC2C,IAAR,CAAa,UAACR,MAAD;AAAA,eAAYA,MAAM,CAACM,gBAAnB;AAAA,OAAb,CAAtB,CAFqD,CAIrD;;AACAvB,MAAAA,kBAAkB,CAACwB,aAAa,CAACD,gBAAf,CAAlB;AACAzB,MAAAA,eAAe,CAAC0B,aAAa,CAACL,GAAf,CAAf,CANqD,CAQrD;;AACAX,MAAAA,eAAe,CAACkB,IAAhB,CAAqB,UAACC,CAAD,EAAIC,CAAJ,EAAU;AAC7B,YAAID,CAAC,CAACH,aAAa,CAACL,GAAf,CAAD,GAAuBS,CAAC,CAACJ,aAAa,CAACL,GAAf,CAA5B,EAAiD;AAC/C,iBAAOK,aAAa,CAACD,gBAAd,KAAmC,KAAnC,GAA2C,CAA3C,GAA+C,CAAC,CAAvD;AACD,SAFD,MAEO,IAAII,CAAC,CAACH,aAAa,CAACL,GAAf,CAAD,GAAuBS,CAAC,CAACJ,aAAa,CAACL,GAAf,CAA5B,EAAiD;AACtD,iBAAOK,aAAa,CAACD,gBAAd,KAAmC,KAAnC,GAA2C,CAAC,CAA5C,GAAgD,CAAvD;AACD,SAFM,MAEA;AACL,iBAAO,CAAP;AACD;AACF,OARD;AASD,KAxCoC,CA0CrC;;;AACA,WAAOf,eAAP;AACD,GA5CD;AA8CA;AACF;AACA;AACA;AACA;;;AACE,MAAMqB,eAAe,GAAG,SAAlBA,eAAkB,CAACZ,MAAD,EAA+B;AACrD;AACAnC,IAAAA,OAAO,GAAGA,OAAO,CAACgD,GAAR,CAAY,UAACC,SAAD,EAA4B;AAChD;AACA;AACA,UAAId,MAAM,CAACE,GAAP,KAAeY,SAAS,CAACZ,GAAzB,IAAgCY,SAAS,CAACC,QAA9C,EAAwD;AACtD;AACA;AACA,YAAID,SAAS,CAACR,gBAAV,KAA+BU,SAAnC,EAA8C;AAC5C,cAAIF,SAAS,CAACR,gBAAV,KAA+B,KAAnC,EAA0C;AACxCQ,YAAAA,SAAS,CAACR,gBAAV,GAA6B,MAA7B,CADwC,CAGxC;;AACAzB,YAAAA,eAAe,CAACmB,MAAM,CAACE,GAAR,CAAf;AACAnB,YAAAA,kBAAkB,CAAC,MAAD,CAAlB,CALwC,CAOxC;;AACA,gBAAIhB,gBAAgB,IAAIJ,oBAAxB,EAA8C;AAC5CA,cAAAA,oBAAoB,CAACqC,MAAM,CAACE,GAAR,EAAa,MAAb,CAApB;AACD;AACF,WAXD,MAWO;AACLY,YAAAA,SAAS,CAACR,gBAAV,GAA6B,KAA7B,CADK,CAGL;;AACAzB,YAAAA,eAAe,CAACmB,MAAM,CAACE,GAAR,CAAf;AACAnB,YAAAA,kBAAkB,CAAC,KAAD,CAAlB,CALK,CAOL;;AACA,gBAAIhB,gBAAgB,IAAIJ,oBAAxB,EAA8C;AAC5CA,cAAAA,oBAAoB,CAACqC,MAAM,CAACE,GAAR,EAAa,KAAb,CAApB;AACD;AACF;AACF,SAxBD,MAwBO;AACL;AACAY,UAAAA,SAAS,CAACR,gBAAV,GAA6B,KAA7B,CAFK,CAIL;;AACAzB,UAAAA,eAAe,CAACmB,MAAM,CAACE,GAAR,CAAf;AACAnB,UAAAA,kBAAkB,CAAC,KAAD,CAAlB,CANK,CAQL;;AACA,cAAIhB,gBAAgB,IAAIJ,oBAAxB,EAA8C;AAC5CA,YAAAA,oBAAoB,CAACqC,MAAM,CAACE,GAAR,EAAa,KAAb,CAApB;AACD;AACF;AACF,OAxCD,MAwCO,IAAIY,SAAS,CAACR,gBAAV,KAA+BU,SAAnC,EAA8C;AACnD;AACAF,QAAAA,SAAS,CAACR,gBAAV,GAA6BU,SAA7B;AACD;;AAED,aAAOF,SAAP;AACD,KAjDS,CAAV;AAkDD,GApDD;AAsDA;AACF;AACA;;;AACE,MAAMG,YAAY,GAAG,SAAfA,YAAe,GAAM;AACzB,QAAIlD,gBAAJ,EAAsB;AACpB;AACA,UAAIP,iBAAJ,EAAuB;AACrBA,QAAAA,iBAAiB;AAClB;AACF,KALD,MAKO;AACL;AACAmB,MAAAA,cAAc,CAACD,WAAW,GAAG,CAAd,GAAkBA,WAAW,GAAG,CAAhC,GAAoC,CAArC,CAAd;AACD;AACF,GAVD;AAYA;AACF;AACA;;;AACE,MAAMwC,QAAQ,GAAG,SAAXA,QAAW,GAAM;AACrB,QAAInD,gBAAJ,EAAsB;AACpB;AACA,UAAIN,aAAJ,EAAmB;AACjBA,QAAAA,aAAa;AACd;AACF,KALD,MAKO;AACL;AACAkB,MAAAA,cAAc,CAACD,WAAW,GAAGN,WAAd,IAA6BE,YAAY,CAACmB,MAA1C,GAAmDf,WAAnD,GAAiEA,WAAW,GAAG,CAAhF,CAAd;AACD;AACF,GAVD;AAYA;AACF;AACA;AACA;;;AACE,MAAMyC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,KAAD,EAAmB;AAC3C;AACA,QAAIrD,gBAAJ,EAAsB;AACpB;AACA,UAAIL,iBAAJ,EAAuB;AACrBA,QAAAA,iBAAiB,CAAC2D,QAAQ,CAACD,KAAD,CAAT,CAAjB;AACD;AACF,KALD,MAKO;AACL;AACAzC,MAAAA,cAAc,CAAC,CAAD,CAAd;AACD,KAV0C,CAY3C;;;AACAN,IAAAA,cAAc,CAACgD,QAAQ,CAACD,KAAD,CAAT,CAAd;AACD,GAdD;AAgBA;AACF;AACA;;;AACE,MAAME,YAAY,GAAG,SAAfA,YAAe,GAAM;AACzB,wBACE,mCACG1D,KAAK,iBACJ;AAAI,qBAAY;AAAhB,oBACE,oBAAC,8BAAD;AAAmB,MAAA,OAAO,EAAEC,OAAO,CAAC4B;AAApC,oBACE,iCACG7B,KADH,eAEE,oBAAC,yBAAD;AAAc,MAAA,IAAI,EAAC,MAAnB;AAA0B,MAAA,KAAK,EAAE2D,eAAOC;AAAxC,MAFF,CADF,CADF,CAFJ,eAWE;AAAI,qBAAY;AAAhB,OACG3D,OAAO,CAACgD,GAAR,CAAY,UAACb,MAAD;AAAA,0BACX,oBAAC,iCAAD;AACE,QAAA,OAAO,EAAE;AAAA,iBAAMY,eAAe,CAACZ,MAAD,CAArB;AAAA,SADX;AAEE,QAAA,GAAG,EAAEA,MAAM,CAACE,GAFd;AAGE,QAAA,KAAK,EAAE;AAAEuB,UAAAA,KAAK,EAAEzB,MAAM,CAACyB;AAAhB,SAHT;AAIE,QAAA,SAAS,YAAKzB,MAAM,CAACe,QAAP,GAAkB,UAAlB,GAA+B,EAApC,cAA0C,CAACnD,KAAD,GAAS,WAAT,GAAuB,EAAjE,cAAuEoC,MAAM,CAAC0B,OAAP,qBAA4B1B,MAAM,CAAC0B,OAAnC,IAA+C,EAAtH;AAJX,SAKG1B,MAAM,CAAC2B,IALV,EAOG3B,MAAM,CAACM,gBAAP,KAA4B,KAA5B,gBAAoC,oBAAC,wBAAD;AAAa,QAAA,IAAI,EAAC;AAAlB,QAApC,GAAkEN,MAAM,CAACM,gBAAP,KAA4B,MAA5B,gBAAqC,oBAAC,0BAAD;AAAe,QAAA,IAAI,EAAC;AAApB,QAArC,GAAqE,EAP1I,CADW;AAAA,KAAZ,CADH,CAXF,CADF;AA2BD,GA5BD;AA8BA;AACF;AACA;AACA;AACA;AACA;;;AACE,MAAMsB,WAAW,GAAG,SAAdA,WAAc,CAAC9B,GAAD,EAAWI,GAAX,EAAwB2B,KAAxB,EAAoD;AACtE,QAAIvE,SAAJ,EAAe;AACbuE,MAAAA,KAAK,CAACC,eAAN;AAEAxE,MAAAA,SAAS,CAACwC,GAAD,EAAMI,GAAN,CAAT;AACD;AACF,GAND;AAQA;AACF;AACA;AACA;AACA;AACA;;;AACE,MAAM6B,WAAW,GAAG,SAAdA,WAAc,CAACjC,GAAD,EAAWI,GAAX,EAAwB2B,KAAxB,EAAuE;AACzF,QAAItE,SAAJ,EAAe;AACbsE,MAAAA,KAAK,CAACC,eAAN;AAEAvE,MAAAA,SAAS,CAACuC,GAAD,EAAMI,GAAN,CAAT;AACD;AACF,GAND;AAQA;AACF;AACA;AACA;;;AACE,MAAM8B,UAAU,GAAG,SAAbA,UAAa,CAAClC,GAAD,EAAoB;AAAA;;AACrC,QAAMmC,YAAY,cAAGC,MAAH,oEAAG,QAAQC,YAAR,EAAH,yDAAG,qBAAwBC,QAAxB,EAArB,CADqC,CAGrC;;AACA,QAAI,CAAAH,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAExC,MAAd,MAAyB,CAAzB,IAA8BpC,QAAlC,EAA4C;AAC1CA,MAAAA,QAAQ,CAACyC,GAAD,CAAR;AACD;AACF,GAPD;AASA;AACF;AACA;;;AACE,MAAMuC,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvB,wBACE,mCACG7D,eAAe,CAACiB,MAAhB,GAAyB,CAAzB,GACCjB,eAAe,CAACqC,GAAhB,CAAoB,UAACf,GAAD,EAAWwC,KAAX;AAAA,0BAClB,oBAAC,yBAAD;AAAc,QAAA,GAAG,gBAASA,KAAT,CAAjB;AAAmC,QAAA,OAAO,EAAE;AAAA,iBAAMN,UAAU,CAAClC,GAAD,CAAhB;AAAA,SAA5C;AAAmE,uBAAY;AAA/E,SACGjC,OAAO,CAACgD,GAAR,CAAY,UAACb,MAAD;AAAA,4BACX,oBAAC,yBAAD;AACE,UAAA,GAAG,gBAASsC,KAAT,cAAkBtC,MAAM,CAACE,GAAzB,CADL;AAEE,UAAA,KAAK,EAAEF,MAAM,CAACuC,OAAP,GAAiB;AAAEC,YAAAA,KAAK,EAAExC,MAAM,CAACuC,OAAP,CAAezC,GAAf,EAAoBE,MAAM,CAACE,GAA3B,CAAT;AAA0CuC,YAAAA,QAAQ,EAAEzC,MAAM,CAACyB;AAA3D,WAAjB,GAAsF;AAAEgB,YAAAA,QAAQ,EAAEzC,MAAM,CAACyB;AAAnB,WAF/F;AAGE,UAAA,SAAS,YAAKzB,MAAM,CAAC0C,WAAP,mBAAL,cAA8C1C,MAAM,CAAC0B,OAAP,qBAA4B1B,MAAM,CAAC0B,OAAnC,IAA+C,EAA7F,MAHX;AAIE,UAAA,KAAK,EAAE1B,MAAM,CAAC0C,WAAP,IAAsB5C,GAAG,CAACE,MAAM,CAACE,GAAR;AAJlC,WAKGF,MAAM,CAAC2C,MAAP,IAAiB7C,GAAG,CAACE,MAAM,CAACE,GAAR,CAApB,gBACC,oBAAC,cAAD;AACE,UAAA,IAAI,EAAE0C,YAAKC,KADb;AAEE,UAAA,OAAO,EAAC,MAFV;AAGE,UAAA,OAAO,EAAE,iBAAChB,KAAD;AAAA,mBAAWD,WAAW,CAAC9B,GAAD,EAAME,MAAM,CAACE,GAAb,EAAkB2B,KAAlB,CAAtB;AAAA,WAHX;AAIE,UAAA,KAAK,EAAE7B,MAAM,CAACuC,OAAP,IAAkB;AAAEC,YAAAA,KAAK,EAAExC,MAAM,CAACuC,OAAP,CAAezC,GAAf,EAAoBE,MAAM,CAACE,GAA3B;AAAT;AAJ3B,WAKGJ,GAAG,CAACE,MAAM,CAACE,GAAR,CALN,CADD,GAQGF,MAAM,CAAC8C,MAAP,IAAiB9C,MAAM,CAAC+C,IAAxB,gBACF,oBAAC,kBAAD;AAAY,UAAA,OAAO,EAAC,WAApB;AAAgC,UAAA,KAAK,EAAC,UAAtC;AAAiD,UAAA,wBAAwB,EAAE,IAA3E;AAAiF,UAAA,MAAM,EAAE,gBAAClB,KAAD;AAAA,mBAAWE,WAAW,CAACjC,GAAD,EAAME,MAAM,CAACE,GAAb,EAAkB2B,KAAlB,CAAtB;AAAA;AAAzF,WACGmB,mBAAMhD,MAAM,CAAC+C,IAAb,EAAoB;AAAEE,UAAAA,IAAI,EAAE,IAAR;AAAcC,UAAAA,SAAS,EAAE;AAAzB,SAApB,CADH,CADE,GAIAlD,MAAM,CAACmD,aAAP,GACFnD,MAAM,CAACmD,aAAP,CAAqBrD,GAArB,EAA0BE,MAAM,CAACE,GAAjC,CADE,GAGFJ,GAAG,CAACE,MAAM,CAACE,GAAR,CApBP,CADW;AAAA,OAAZ,CADH,CADkB;AAAA,KAApB,CADD,gBA+BC,oBAAC,yBAAD;AAAc,MAAA,SAAS,EAAC,SAAxB;AAAkC,qBAAY;AAA9C,oBACE,oBAAC,yBAAD;AAAc,MAAA,OAAO,EAAErC,OAAO,CAAC4B,MAA/B;AAAuC,MAAA,SAAS,EAAC;AAAjD,sCADF,CAhCJ,CADF;AAyCD,GA1CD;AA4CA;AACF;AACA;;;AACE,MAAM2D,YAAY,GAAG,SAAfA,YAAe,GAAM;AACzB;AACA,QAAMC,iBAAiB,GAAG,CAAC,IAAD,EAAO,IAAP,EAAa,IAAb,EAAmB,KAAnB,CAA1B;AAEA,wBACE,gDACE,6CACE,oBAAC,2BAAD;AAAgB,MAAA,OAAO,EAAExF,OAAO,CAAC4B,MAAjC;AAAyC,qBAAY;AAArD,oBACE,8CACE,oDADF,eAEE,oBAAC,sBAAD;AACE,MAAA,EAAE,EAAC,eADL;AAEE,MAAA,IAAI,EAAE4D,iBAFR;AAGE,MAAA,cAAc,EAAE,IAHlB;AAIE,MAAA,QAAQ,EAAE,kBAACjC,KAAD;AAAA,eAAWD,iBAAiB,CAACC,KAAD,CAA5B;AAAA,OAJZ;AAKE,MAAA,WAAW,EAAEhD,WAAW,CAACgE,QAAZ,EALf;AAME,MAAA,QAAQ,EAAE;AANZ,MAFF,eAUE;AAAM,MAAA,SAAS,EAAC;AAAhB,OACGhD,KAAK,KAAK,CAAV,GAAc,CAAd,GAAkBJ,IADrB,OAC4BE,EAD5B,UACoCE,KADpC,CAVF,eAaE;AAAK,MAAA,SAAS,EAAC;AAAf,oBACE,oBAAC,kBAAD;AAAY,MAAA,OAAO,EAAC,WAApB;AAAgC,MAAA,KAAK,EAAC,UAAtC;AAAiD,MAAA,MAAM,EAAE;AAAA,eAAM6B,YAAY,EAAlB;AAAA,OAAzD;AAA+E,MAAA,QAAQ,EAAEjC,IAAI,KAAK;AAAlG,oBACE,oBAAC,wBAAD;AAAa,MAAA,IAAI,EAAC,IAAlB;AAAuB,MAAA,KAAK,EAAEuC,eAAOC;AAArC,MADF,CADF,eAIE,oBAAC,kBAAD;AAAY,MAAA,OAAO,EAAC,WAApB;AAAgC,MAAA,KAAK,EAAC,UAAtC;AAAiD,MAAA,MAAM,EAAE;AAAA,eAAMN,QAAQ,EAAd;AAAA,OAAzD;AAA2E,MAAA,QAAQ,EAAEhC,EAAE,KAAKE;AAA5F,oBACE,oBAAC,yBAAD;AAAc,MAAA,IAAI,EAAC,IAAnB;AAAwB,MAAA,KAAK,EAAEmC,eAAOC;AAAtC,MADF,CAJF,CAbF,CADF,CADF,CADF,CADF;AA8BD,GAlCD;AAoCA;AACF;AACA;;;AACE,sBACE,oBAAC,yBAAD,qBACE,oBAAC,2BAAD;AAAgB,IAAA,WAAW,EAAC,GAA5B;AAAgC,IAAA,WAAW,EAAC,GAA5C;AAAgD,mBAAY;AAA5D,KACGF,YAAY,EADf,EAEGe,UAAU,EAFb,EAGGe,YAAY,EAHf,CADF,EAMGnF,oBAAoB,iBACnB,oBAAC,kCAAD,qBACE,oBAAC,kCAAD;AAAkB,IAAA,IAAI,EAAC,QAAvB;AAAgC,IAAA,KAAK,EAAC;AAAtC,IADF,CAPJ,CADF;AAcD,CAnZD;;eAqZeb,K","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport { MoreVertical, ChevronRight, ChevronLeft, ArrowLineDown, ArrowLineUp } from '../icons/systemicons/SystemIcons';\nimport { SystemIcons as icons } from '../icons/index';\nimport { DropdownFilter } from '../Dropdown/index';\nimport { IconButton, Button } from '../Button/index';\nimport { Size } from '../types'\n\n/**\n * Import custom styles.\n */\nimport { COLORS } from '../styles';\nimport { TableHeaderRowCol, TableColumnHeaderCol, TableContainer, TableDataCol, TableDataRow, TableFooterCol, TableWrapper, TableLoadingIndicator } from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport { TableProps, TableColumn, TableSortingDirection } from './TableTypes';\nimport { LoadingIndicator } from '../LoadingIndicator';\n\nconst Table: React.FunctionComponent<TableProps> = ({\n  rowClick,\n  linkClick,\n  iconClick,\n  previousPageClick,\n  nextPageClick,\n  rowsPerPageChange,\n  triggerSortingChange,\n  title,\n  columns,\n  rows,\n  remotePagination,\n  pagination,\n  showLoadingIndicator,\n}: TableProps) => {\n  // States used within the component\n  const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n  const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n  const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n  const [currentPage, setCurrentPage] = React.useState<number>(1);\n  const [sortedColumn, setSortedColumn] = React.useState<string>('');\n  const [sortedDirection, setSortedDirection] = React.useState<TableSortingDirection>('asc');\n  const [from, setFrom] = React.useState<number>();\n  const [to, setTo] = React.useState<number>();\n  const [total, setTotal] = React.useState<number>();\n\n  /**\n   * Takes care of local pagination.\n   * Works only in case remote pagination is not defined or is set to false.\n   */\n  React.useEffect(() => {\n    if (!remotePagination) {\n      // Let's retrieve temporary filtered rows and update globally filtered rows\n      const tmpFilteredRows = filterAndSortRows();\n      setFilteredRows(tmpFilteredRows);\n      setTotal(tmpFilteredRows.length);\n\n      // Assign rows from and rows to\n      const rowsFrom = (currentPage - 1) * rowsPerPage;\n      const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n      // Set from and to values\n      setFrom(rowsFrom + 1);\n      setTo(rowsTo);\n\n      // Filter out the rows\n      setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n    }\n  }, [rowsPerPage, rows, currentPage, columns, sortedColumn, sortedDirection, remotePagination]);\n\n  /**\n   * Takes care of remote pagination.\n   * Works only in case remote pagination is set to true.\n   */\n  React.useEffect(() => {\n    if (remotePagination) {\n      setCurrentPageRows(rows);\n\n      // Let's assign pagination values\n      setFrom(pagination?.from);\n      setTo(pagination?.to);\n      setTotal(pagination?.total);\n      setCurrentPage(pagination?.currentPage!);\n      setRowsPerPage(pagination?.rowsPerPage!);\n    }\n  }, [remotePagination, pagination, rows]);\n\n  /**\n   * Filters out a rows by specific column filters and sorts them if any sorting is set.\n   * @returns Filtered and sorted rows.\n   */\n  const filterAndSortRows = (): any[] => {\n    let tmpFilteredRows = rows.filter((row) => {\n      // Let's start with matched filter criteria\n      let matchFilterCriteria = true;\n\n      // Let's go through columns\n      for (const column of columns) {\n        // Let's check if filter value is specified for the column\n        // And if it doesn't match the current row column value\n        // Then let's update match filter criteria to failed\n        if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n          matchFilterCriteria = false;\n        }\n      }\n\n      // Let's return row only in case match filter criteria succeeds\n      if (matchFilterCriteria) {\n        return row;\n      }\n    });\n\n    // Let's apply sorting if needed\n    if (columns.some((column) => column.sortingDirection)) {\n      // Let's find the sorting column\n      const sortingColumn = columns.find((column) => column.sortingDirection)!;\n\n      // Update sorted column data\n      setSortedDirection(sortingColumn.sortingDirection!);\n      setSortedColumn(sortingColumn.key!);\n\n      // Let's sort the rows\n      tmpFilteredRows.sort((a, b) => {\n        if (a[sortingColumn.key] > b[sortingColumn.key]) {\n          return sortingColumn.sortingDirection === 'asc' ? 1 : -1;\n        } else if (a[sortingColumn.key] < b[sortingColumn.key]) {\n          return sortingColumn.sortingDirection === 'asc' ? -1 : 1;\n        } else {\n          return 0;\n        }\n      });\n    }\n\n    // Let's return filtered rows\n    return tmpFilteredRows;\n  };\n\n  /**\n   * Applies a specific sorting to a column.\n   * If no sorting exists, then applies ascending initially\n   * @param column - Column to which sorting should be applied.\n   */\n  const sortTableColumn = (column: TableColumn): void => {\n    // Let's remove any active sorting\n    columns = columns.map((tmpColumn: TableColumn) => {\n      // Let's apply new sorting\n      // Let's check if it is the column for which we have to apply sorting\n      if (column.key === tmpColumn.key && tmpColumn.sortable) {\n        // Let's check if sorting is not defined\n        // If so, let's toggle the sorting direction\n        if (tmpColumn.sortingDirection !== undefined) {\n          if (tmpColumn.sortingDirection === 'asc') {\n            tmpColumn.sortingDirection = 'desc';\n\n            // Update sorted column and direction\n            setSortedColumn(column.key);\n            setSortedDirection('desc');\n\n            // Let's trigger remote sorting trigger function\n            if (remotePagination && triggerSortingChange) {\n              triggerSortingChange(column.key, 'desc');\n            }\n          } else {\n            tmpColumn.sortingDirection = 'asc';\n\n            // Update sorted column and direction\n            setSortedColumn(column.key);\n            setSortedDirection('asc');\n\n            // Let's trigger remote sorting trigger function\n            if (remotePagination && triggerSortingChange) {\n              triggerSortingChange(column.key, 'asc');\n            }\n          }\n        } else {\n          // Let's apply the initial sorting\n          tmpColumn.sortingDirection = 'asc';\n\n          // Update sorted column and direction\n          setSortedColumn(column.key);\n          setSortedDirection('asc');\n\n          // Let's trigger remote sorting trigger function\n          if (remotePagination && triggerSortingChange) {\n            triggerSortingChange(column.key, 'asc');\n          }\n        }\n      } else if (tmpColumn.sortingDirection !== undefined) {\n        // Let's remove sorting\n        tmpColumn.sortingDirection = undefined;\n      }\n\n      return tmpColumn;\n    });\n  };\n\n  /**\n   * Navigates user back to the previous page and updates the current table page.\n   */\n  const previousPage = () => {\n    if (remotePagination) {\n      // Let's inform parent component about page change\n      if (previousPageClick) {\n        previousPageClick();\n      }\n    } else {\n      // Let's change the page within the component\n      setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n    }\n  };\n\n  /**\n   * Navigates user to the next page and updates the current table page.\n   */\n  const nextPage = () => {\n    if (remotePagination) {\n      // Let's inform parent component about page change\n      if (nextPageClick) {\n        nextPageClick();\n      }\n    } else {\n      // Let's change the page within the component\n      setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n    }\n  };\n\n  /**\n   * Updates the rows per page value and refreshes the table content accordingly.\n   * @param value - Newly selected rows per page value.\n   */\n  const changeRowsPerPage = (value: string) => {\n    // Let's check if we are using remote pagination\n    if (remotePagination) {\n      // Inform parent component about rows per page change\n      if (rowsPerPageChange) {\n        rowsPerPageChange(parseInt(value));\n      }\n    } else {\n      // Let's reset current page to 1\n      setCurrentPage(1);\n    }\n\n    // Let's set rows per page\n    setRowsPerPage(parseInt(value));\n  };\n\n  /**\n   * Renders the table header.\n   */\n  const renderHeader = () => {\n    return (\n      <thead>\n        {title && (\n          <tr data-testid=\"TestTableHeaderRow\">\n            <TableHeaderRowCol colSpan={columns.length}>\n              <div>\n                {title}\n                <MoreVertical size=\"18px\" color={COLORS.neutral_600} />\n              </div>\n            </TableHeaderRowCol>\n          </tr>\n        )}\n        <tr data-testid=\"TestTableColumnHeaderRow\">\n          {columns.map((column: TableColumn) => (\n            <TableColumnHeaderCol\n              onClick={() => sortTableColumn(column)}\n              key={column.key}\n              style={{ width: column.width }}\n              className={`${column.sortable ? 'sortable' : ''} ${!title ? 'no-border' : ''} ${column.justify ? `justify-${column.justify}` : ''}`}>\n              {column.name}\n\n              {column.sortingDirection === 'asc' ? <ArrowLineUp size=\"20px\" /> : column.sortingDirection === 'desc' ? <ArrowLineDown size=\"20px\" /> : ''}\n            </TableColumnHeaderCol>\n          ))}\n        </tr>\n      </thead>\n    );\n  };\n\n  /**\n   * Function which is called when a mouse click happens on a link to pass data to the parent component.\n   * @param row - Row in which the link is located.\n   * @param key - Key of the column for which the link is set.\n   * @param event - Click event handler.\n   */\n  const onLinkClick = (row: any, key: string, event: React.MouseEvent) => {\n    if (linkClick) {\n      event.stopPropagation();\n\n      linkClick(row, key);\n    }\n  };\n\n  /**\n   * Function which is called when a mouse click happens on an icon to pass data to the parent component.\n   * @param row - Row in which the icon is located.\n   * @param key - Key of the column for which the icon is set.\n   * @param event - Click event handler.\n   */\n  const onIconClick = (row: any, key: string, event: React.MouseEvent<HTMLButtonElement>) => {\n    if (iconClick) {\n      event.stopPropagation();\n\n      iconClick(row, key);\n    }\n  };\n\n  /**\n   * Function which is called when a mouse click happens on a row to pass data to the parent component.\n   * @param row - Row in which the link is located.\n   */\n  const onRowClick = (row: any): void => {\n    const selectedText = window?.getSelection()?.toString();\n\n    // Let's trigger row click only if we haven't selected any text and action exists\n    if (selectedText?.length === 0 && rowClick) {\n      rowClick(row);\n    }\n  };\n\n  /**\n   * Renders the table body.\n   */\n  const renderBody = () => {\n    return (\n      <tbody>\n        {currentPageRows.length > 0 ? (\n          currentPageRows.map((row: any, index: number) => (\n            <TableDataRow key={`row_${index}`} onClick={() => onRowClick(row)} data-testid=\"TestTableDataRow\">\n              {columns.map((column: TableColumn) => (\n                <TableDataCol\n                  key={`row_${index}_${column.key}`}\n                  style={column.colorFn ? { color: column.colorFn(row, column.key), maxWidth: column.width } : { maxWidth: column.width }}\n                  className={`${column.shortenText && `truncate-text`} ${column.justify ? `justify-${column.justify}` : ''} `}\n                  title={column.shortenText && row[column.key]}>\n                  {column.isLink && row[column.key] ? (\n                    <Button\n                      size={Size.Small}\n                      variant=\"text\"\n                      onClick={(event) => onLinkClick(row, column.key, event)}\n                      style={column.colorFn && { color: column.colorFn(row, column.key) }}>\n                      {row[column.key]}\n                    </Button>\n                  ) : column.isIcon && column.icon ? (\n                    <IconButton variant=\"secondary\" shape=\"circular\" useTransparentBackground={true} action={(event) => onIconClick(row, column.key, event!)}>\n                      {icons[column.icon!]({ size: '24', className: 'icon' })}\n                    </IconButton>\n                  ) : column.customContent ? (\n                    column.customContent(row, column.key)\n                  ) : (\n                    row[column.key]\n                  )}\n                </TableDataCol>\n              ))}\n            </TableDataRow>\n          ))\n        ) : (\n          <TableDataRow className=\"no-rows\" data-testid=\"TestTableNoDataRow\">\n            <TableDataCol colSpan={columns.length} className=\"center\">\n              There are no rows to display\n            </TableDataCol>\n          </TableDataRow>\n        )}\n      </tbody>\n    );\n  };\n\n  /**\n   * Renders the table footer.\n   */\n  const renderFooter = () => {\n    // Define local values used within the footer\n    const rowsPerPageValues = ['10', '20', '50', '100'];\n\n    return (\n      <tfoot>\n        <tr>\n          <TableFooterCol colSpan={columns.length} data-testid=\"TestTableFooterRow\">\n            <div>\n              <span>Rows per page: </span>\n              <DropdownFilter\n                id=\"rows-per-page\"\n                list={rowsPerPageValues}\n                disableSorting={true}\n                onSelect={(value) => changeRowsPerPage(value)}\n                initalValue={rowsPerPage.toString()}\n                isButton={true}\n              />\n              <span className=\"current-page-info\">\n                {total === 0 ? 0 : from}-{to} of {total}\n              </span>\n              <div className=\"controls\">\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => previousPage()} disabled={from === 1}>\n                  <ChevronLeft size=\"24\" color={COLORS.neutral_600} />\n                </IconButton>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => nextPage()} disabled={to === total}>\n                  <ChevronRight size=\"24\" color={COLORS.neutral_600} />\n                </IconButton>\n              </div>\n            </div>\n          </TableFooterCol>\n        </tr>\n      </tfoot>\n    );\n  };\n\n  /**\n   * Return Table component.\n   */\n  return (\n    <TableWrapper>\n      <TableContainer cellPadding=\"0\" cellSpacing=\"0\" data-testid=\"TestTable\">\n        {renderHeader()}\n        {renderBody()}\n        {renderFooter()}\n      </TableContainer>\n      {showLoadingIndicator && (\n        <TableLoadingIndicator>\n          <LoadingIndicator size=\"medium\" color=\"#ffffff\"></LoadingIndicator>\n        </TableLoadingIndicator>\n      )}\n    </TableWrapper>\n  );\n};\n\nexport default Table;\n"],"file":"Table.js"}

package/dist/js/Tabs/TabLink.js

@@ -31,7 +31,7 @@ var StyledTabLink = (0, _styledComponents.default)(_reactRouterDom.NavLink)(_tem
   return props.disabled ? _styles.COLORS.neutral_100 : 'transparent';
 }, function (props) {
   return props.disabled ? 'not-allowed' : 'pointer';
-}, _styles.COLORS.white, _styles.COLORS.white, _styles.COLORS.white, _styles.COLORS.primary_20, _styles.COLORS.white, _styles.COLORS.primary_20, _styles.COLORS.primary_600, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.primary_500, _styles.COLORS.primary_600, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.white, _styles.COLORS.neutral_300, _styles.COLORS.white);
+}, _styles.COLORS.white, _styles.COLORS.white, _styles.COLORS.neutral_20, _styles.COLORS.primary_20, _styles.COLORS.white, _styles.COLORS.primary_20, _styles.COLORS.primary_600, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.primary_500, _styles.COLORS.primary_600, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.white, _styles.COLORS.neutral_300, _styles.COLORS.white);
 
 var OptionalLineWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  margin: 0 0 0 20px;\n  span {\n    margin: 0 0 0 4px !important;\n    font-size: 12px;\n    line-height: 16px;\n  }\n"])));
 

package/dist/js/Tabs/TabLink.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Tabs/TabLink.tsx"],"names":["StyledTabLink","NavLink","COLORS","neutral_600","props","disabled","neutral_100","white","primary_20","primary_600","primary_100","primary_800","primary_500","neutral_300","OptionalLineWrapper","styled","div","NotificationDot","critical_500","TopWrapper","TabLink","to","exact","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","testId","showNotificationDot","location","ref","React","useRef","toString","pathname","current","blur","undefined"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { NavLink, NavLinkProps, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { BaseProps } from '../icons';\nimport { COLORS } from '../styles';\n\ntype TabLinkProps = {\n  disabled?: boolean;\n  requiredLine: string;\n  optionalLine?: string;\n  OptionalLineIcon?: React.FunctionComponent<BaseProps>;\n  onLinkClick?: () => void;\n  testId?: string;\n  showNotificationDot?: boolean;\n} & NavLinkProps;\n\ntype StyledTabLinkProps = {\n  disabled?: boolean;\n  exact: boolean;\n};\n\nconst StyledTabLink = styled(NavLink)<StyledTabLinkProps>`\n  display: flex;\n  flex-direction: column;\n\n  font-size: 16px;\n  line-height: 120%;\n  color: ${COLORS.neutral_600};\n\n  background-color: ${(props) => (props.disabled ? COLORS.neutral_100 : 'transparent')};\n  cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n  border-left: 1px solid transparent;\n  text-decoration: none;\n  position: relative;\n  border-radius: 2px;\n\n  &:not(:last-child) {\n    margin-bottom: 4px;\n  }\n\n  &:focus {\n    background-color: ${COLORS.white};\n    box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n    outline: none;\n\n    &::after {\n      background-color: ${COLORS.white};\n    }\n  }\n\n  &.active {\n    background-color: ${COLORS.white};\n  }\n  &.active:hover {\n    background-color: ${COLORS.primary_20};\n  }\n  &.active:focus {\n    background-color: ${COLORS.white};\n  }\n\n  &:hover {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_600};\n  }\n  &:active {\n    box-shadow: none;\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n  }\n  &.active {\n    &::after {\n      position: absolute;\n      content: ' ';\n      width: 4px;\n      top: 0;\n      bottom: 0;\n      left: -1px;\n      background-color: ${COLORS.primary_500};\n\n      border-top-left-radius: 2px;\n      border-top-right-radius: 2px;\n      border-bottom-left-radius: 2px;\n      border-bottom-right-radius: 2px;\n    }\n  }\n  &.active:hover {\n    &::after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n  &.active:active {\n    background-color: ${COLORS.primary_100};\n\n    &::after {\n      background-color: ${COLORS.primary_800};\n    }\n  }\n  &:disabled {\n    box-shadow: none;\n    background-color: ${COLORS.white};\n    span {\n      color: ${COLORS.neutral_300};\n    }\n    &::after {\n      background-color: ${COLORS.white};\n    }\n  }\n`;\n\nconst OptionalLineWrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  margin: 0 0 0 20px;\n  span {\n    margin: 0 0 0 4px !important;\n    font-size: 12px;\n    line-height: 16px;\n  }\n`;\n\nconst NotificationDot = styled.div`\n  position: absolute;\n  right: 12px;\n  top: calc(50% - 12px);\n  background-color: ${COLORS.critical_500};\n  height: 8px;\n  width: 8px;\n  border-radius: 50%;\n  border: 2px solid ${COLORS.white};\n  margin: 6px;\n`;\n\nconst TopWrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  span:not(:only-child) {\n    width: calc(100% - 32px);\n  }\n`;\n\nconst TabLink = ({ to, disabled = false, exact = false, requiredLine, optionalLine, OptionalLineIcon, onLinkClick, testId, showNotificationDot }: TabLinkProps) => {\n  const location = useLocation();\n  const ref = React.useRef<any>(null);\n\n  return (\n    <StyledTabLink\n      to={to.toString()}\n      activeClassName=\"active\"\n      disabled={disabled}\n      exact={exact}\n      role=\"tab\"\n      aria-selected={to === location.pathname}\n      onClick={() => {\n        ref?.current?.blur();\n        if (onLinkClick) {\n          onLinkClick();\n        }\n      }}\n      ref={ref}\n      data-testid={testId}>\n      <TopWrapper>\n        <span>{requiredLine}</span>\n        {showNotificationDot && <NotificationDot data-testid=\"NotificationDot\" />}\n      </TopWrapper>\n      {optionalLine && OptionalLineIcon ? (\n        <OptionalLineWrapper>\n          {OptionalLineIcon && <OptionalLineIcon size=\"16px\" />}\n          {optionalLine !== undefined && <span>{optionalLine}</span>}\n        </OptionalLineWrapper>\n      ) : optionalLine ? (\n        <div>\n          <span>{optionalLine}</span>\n        </div>\n      ) : (\n        <></>\n      )}\n    </StyledTabLink>\n  );\n};\n\nexport default TabLink;\n"],"file":"TabLink.js"}
+{"version":3,"sources":["../../../src/Tabs/TabLink.tsx"],"names":["StyledTabLink","NavLink","COLORS","neutral_600","props","disabled","neutral_100","white","neutral_20","primary_20","primary_600","primary_100","primary_800","primary_500","neutral_300","OptionalLineWrapper","styled","div","NotificationDot","critical_500","TopWrapper","TabLink","to","exact","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","testId","showNotificationDot","location","ref","React","useRef","toString","pathname","current","blur","undefined"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { NavLink, NavLinkProps, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { BaseProps } from '../icons';\nimport { COLORS } from '../styles';\n\ntype TabLinkProps = {\n  disabled?: boolean;\n  requiredLine: string;\n  optionalLine?: string;\n  OptionalLineIcon?: React.FunctionComponent<BaseProps>;\n  onLinkClick?: () => void;\n  testId?: string;\n  showNotificationDot?: boolean;\n} & NavLinkProps;\n\ntype StyledTabLinkProps = {\n  disabled?: boolean;\n  exact: boolean;\n};\n\nconst StyledTabLink = styled(NavLink)<StyledTabLinkProps>`\n  display: flex;\n  flex-direction: column;\n\n  font-size: 16px;\n  line-height: 120%;\n  color: ${COLORS.neutral_600};\n\n  background-color: ${(props) => (props.disabled ? COLORS.neutral_100 : 'transparent')};\n  cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n  border-left: 1px solid transparent;\n  text-decoration: none;\n  position: relative;\n  border-radius: 2px;\n\n  &:not(:last-child) {\n    margin-bottom: 4px;\n  }\n\n  &:focus {\n    background-color: ${COLORS.white};\n    box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2e7fa1;\n    outline: none;\n\n    &::after {\n      background-color: ${COLORS.white};\n    }\n  }\n\n  &.active {\n    background-color: ${COLORS.neutral_20};\n  }\n  &.active:hover {\n    background-color: ${COLORS.primary_20};\n  }\n  &.active:focus {\n    background-color: ${COLORS.white};\n  }\n\n  &:hover {\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_600};\n  }\n  &:active {\n    box-shadow: none;\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n  }\n  &.active {\n    &::after {\n      position: absolute;\n      content: ' ';\n      width: 4px;\n      top: 0;\n      bottom: 0;\n      left: -1px;\n      background-color: ${COLORS.primary_500};\n\n      border-top-left-radius: 2px;\n      border-top-right-radius: 2px;\n      border-bottom-left-radius: 2px;\n      border-bottom-right-radius: 2px;\n    }\n  }\n  &.active:hover {\n    &::after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n  &.active:active {\n    background-color: ${COLORS.primary_100};\n\n    &::after {\n      background-color: ${COLORS.primary_800};\n    }\n  }\n  &:disabled {\n    box-shadow: none;\n    background-color: ${COLORS.white};\n    span {\n      color: ${COLORS.neutral_300};\n    }\n    &::after {\n      background-color: ${COLORS.white};\n    }\n  }\n`;\n\nconst OptionalLineWrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  margin: 0 0 0 20px;\n  span {\n    margin: 0 0 0 4px !important;\n    font-size: 12px;\n    line-height: 16px;\n  }\n`;\n\nconst NotificationDot = styled.div`\n  position: absolute;\n  right: 12px;\n  top: calc(50% - 12px);\n  background-color: ${COLORS.critical_500};\n  height: 8px;\n  width: 8px;\n  border-radius: 50%;\n  border: 2px solid ${COLORS.white};\n  margin: 6px;\n`;\n\nconst TopWrapper = styled.div`\n  display: flex;\n  flex-direction: row;\n  span:not(:only-child) {\n    width: calc(100% - 32px);\n  }\n`;\n\nconst TabLink = ({ to, disabled = false, exact = false, requiredLine, optionalLine, OptionalLineIcon, onLinkClick, testId, showNotificationDot }: TabLinkProps) => {\n  const location = useLocation();\n  const ref = React.useRef<any>(null);\n\n  return (\n    <StyledTabLink\n      to={to.toString()}\n      activeClassName=\"active\"\n      disabled={disabled}\n      exact={exact}\n      role=\"tab\"\n      aria-selected={to === location.pathname}\n      onClick={() => {\n        ref?.current?.blur();\n        if (onLinkClick) {\n          onLinkClick();\n        }\n      }}\n      ref={ref}\n      data-testid={testId}>\n      <TopWrapper>\n        <span>{requiredLine}</span>\n        {showNotificationDot && <NotificationDot data-testid=\"NotificationDot\" />}\n      </TopWrapper>\n      {optionalLine && OptionalLineIcon ? (\n        <OptionalLineWrapper>\n          {OptionalLineIcon && <OptionalLineIcon size=\"16px\" />}\n          {optionalLine !== undefined && <span>{optionalLine}</span>}\n        </OptionalLineWrapper>\n      ) : optionalLine ? (\n        <div>\n          <span>{optionalLine}</span>\n        </div>\n      ) : (\n        <></>\n      )}\n    </StyledTabLink>\n  );\n};\n\nexport default TabLink;\n"],"file":"TabLink.js"}

package/dist/js/Toasters/Toast.js

@@ -185,7 +185,7 @@ var Toast = function Toast(_ref) {
     className: 'description'
   }, content), opts.action && /*#__PURE__*/React.createElement(ActionButtons, null, opts.action.map(function (action, i) {
     return /*#__PURE__*/React.createElement(_Button.Button, {
-      size: 'small',
+      size: _types.Size.Small,
       variant: action.type === _types.ToastActionType.SECONDARY ? 'secondary' : 'primary',
       colorTheme: opts.color !== _types.ToastColor.WHITE ? 'dark' : 'teal',
       key: i,