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

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Modals/ModalDialog.tsx"],"names":["action","text","size","isModalOpen","closeModalAndClearInput","title","topImage","body","buttons","tooltip","backButton","closeAction","submitAction","ModalDialog","React","getMinWidth","getMaxWidth","getImageHeight","getMarginBottom","getPadding","ModalTitle","ComponentTextStyle","Bold","ModalCloseButton","onClick","COLORS","black","ModalBackButton","setTooltipOpen","neutral_600","tooltipOpen","b","variant"],"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 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":["action","text","isModalOpen","closeModalAndClearInput","title","topImage","body","buttons","tooltip","backButton","closeAction","submitAction","ModalDialog","React","getMinWidth","Size","getMaxWidth","getImageHeight","getMarginBottom","getPadding","ModalTitle","ComponentTextStyle","Bold","ModalCloseButton","onClick","size","COLORS","black","ModalBackButton","setTooltipOpen","neutral_600","tooltipOpen","b","variant"],"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/umd/Modals/ModalStyles.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "styled-components"], factory);
+    define(["exports", "styled-components", "../types"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("styled-components"));
+    factory(exports, require("styled-components"), require("../types"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global.styledComponents);
+    factory(mod.exports, global.styledComponents, global.types);
     global.undefined = mod.exports;
   }
-})(this, function (exports, _styledComponents) {
+})(this, function (exports, _styledComponents, _types) {
   "use strict";
 
   Object.defineProperty(exports, "__esModule", {
@@ -81,7 +81,7 @@
             top: 0;
             right: 0;
             left: unset;
-            margin: ${props.size === 'small' ? '4px 4px 0 0' : props.size === 'large' ? '20px 20px 0 0' : '12px 12px 0 0'} !important;
+            margin: ${props.size === _types.Size.Small ? '4px 4px 0 0' : props.size === _types.Size.Large ? '20px 20px 0 0' : '12px 12px 0 0'} !important;
           `}
   }
 `;
@@ -117,7 +117,7 @@
   }
 `;
   const ModalFooter = exports.ModalFooter = _styledComponents2.default.section`
-  margin-top: ${props => props?.size === 'small' ? `20px` : props?.size === 'large' ? '28px' : '24px'};
+  margin-top: ${props => props?.size === _types.Size.Small ? `20px` : props?.size === _types.Size.Large ? '28px' : '24px'};
   display: flex;
   justify-content: flex-end;
 `;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Modals/ModalStyles.ts"],"names":["ModalHeader","styled","section","props","StyledModalHeader","height","Column","div","ModalFooterButtons","ModalTitleSection","CloseButtonWrapper","css","BackButtonWrapper","ModalTitle","h5","ModalBody","ModalFooter"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACA;AACO,QAAMA,WAAW,WAAXA,WAAW,GAAGC,2BAAOC,OAAmC;AACrE;AACA;AACA;AACA,mBAAoBC,KAAD,IAAWA,KAAK,CAALA,YAAAA,IAAsB,MAAO;AAJpD,CAAA;AAOA,QAAMC,iBAAiB,WAAjBA,iBAAiB,GAAGH,gCAAM,WAANA,CAA+E;AAChH;AACA;AACA;AACA;AACA,YAAaE,KAAD,IAAYA,KAAK,CAALA,MAAAA,GAAgB,GAAEA,KAAK,CAALA,MAAAA,IAAgBA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,EAAAA,GAA8BA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,EAAAA,GAA9CA,EAAAA,CAAlBA,IAAAA,GAAwG,EAAI;AACpI;AACA;AACA,cAAeA,KAAD,IAAY,GAAEA,KAAK,CAACE,MAAO,IAAI;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA;AAfO,CAAA;AAkBA,QAAMC,MAAM,WAANA,MAAM,GAAGL,2BAAOM,GAAI;AACjC;AACA;AACA;AACA;AAJO,CAAA;AAOA,QAAMC,kBAAkB,WAAlBA,kBAAkB,GAAGP,2BAAOM,GAAuB;AAChE;AACA,mBAAoBJ,KAAD,IAAYA,KAAK,EAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAmC,KAAO;AACzE;AAHO,CAAA;AAMA,QAAMM,iBAAiB,WAAjBA,iBAAiB,GAAGR,2BAAOC,OAAQ;AAChD;AACA;AACA;AACA;AAJO,CAAA;AAOA,QAAMQ,kBAAkB,WAAlBA,kBAAkB,GAAGT,2BAAOM,GAA2C;AACpF;AACA,MAAOJ,KAAD,IACA,KAAK,CAAL,QAAA,GACIQ,qBAAI;AACd;AACA;AACA;AACA;AALM,WAAA,GAOIA,qBAAI;AACd;AACA;AACA;AACA;AACA,sBAAsBR,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,aAAAA,GAAyCA,KAAK,CAALA,IAAAA,KAAAA,OAAAA,GAAAA,eAAAA,GAA2C,eAAgB;AAC1H,WAAY;AACZ;AAjBO,CAAA;AAoBA,QAAMS,iBAAiB,WAAjBA,iBAAiB,GAAGX,2BAAOM,GAA2C;AACnF;AACA,MAAOJ,KAAD,IACA,KAAK,CAAL,QAAA,GACIQ,qBAAI;AACd;AACA;AACA;AACA;AALM,WAAA,GAOIA,qBAAI;AACd;AACA;AACA,WAAY;AACZ;AAdO,CAAA;AAiBA,QAAME,UAAU,WAAVA,UAAU,GAAGZ,2BAAOa,EAA0B;AAC3D;AACA,eAAgBX,KAAD,IAAWA,KAAK,CAALA,QAAAA,IAAkB,QAAS;AACrD;AAHO,CAAA;AAMA,QAAMY,SAAS,WAATA,SAAS,GAAGd,2BAAOC,OAA2B;AAC3D;AACA;AACA;AACA;AACA;AACA,qBAAsBC,KAAD,IAAYA,KAAK,EAALA,IAAAA,KAAAA,OAAAA,GAAAA,KAAAA,GAAkCA,KAAK,EAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAmC,MAAQ;AAC9G;AACA;AACA;AACA,sBAAuBA,KAAD,IAAYA,KAAK,EAALA,IAAAA,KAAAA,OAAAA,GAAAA,KAAAA,GAAkCA,KAAK,EAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAmC,MAAQ;AAC/G;AAXO,CAAA;AAcA,QAAMa,WAAW,WAAXA,WAAW,GAAGf,2BAAOC,OAA2B;AAC7D,gBAAiBC,KAAD,IAAYA,KAAK,EAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAmCA,KAAK,EAALA,IAAAA,KAAAA,OAAAA,GAAAA,MAAAA,GAAmC,MAAQ;AAC1G;AACA;AAHO,CAAA","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","StyledModalHeader","height","Column","div","ModalFooterButtons","ModalTitleSection","CloseButtonWrapper","css","Size","BackButtonWrapper","ModalTitle","h5","ModalBody","ModalFooter"],"mappings":"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","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/umd/Paginator/Paginator.js

@@ -118,34 +118,30 @@
       outline-width: 0;
     }
   }
+
   & > a:hover {
     color: ${_styles.COLORS.primary_800};
     background-color: ${_styles.COLORS.primary_20};
-    border-bottom: 3px solid transparent;
     box-shadow: none;
   }
   & > a:active {
     color: ${_styles.COLORS.primary_700};
     background-color: ${_styles.COLORS.primary_100};
-    border-bottom: 3px solid transparent;
     box-shadow: none;
   }
 
   & > a.active {
     color: ${_styles.COLORS.neutral_800};
-    border-bottom: 3px solid ${_styles.COLORS.primary_500};
     background-color: ${_styles.COLORS.neutral_20};
     cursor: default;
     box-shadow: none;
     &:hover {
       color: ${_styles.COLORS.primary_800};
       background-color: ${_styles.COLORS.primary_20};
-      border-bottom: 3px solid ${_styles.COLORS.primary_500};
     }
     &:active {
       color: ${_styles.COLORS.primary_700};
       background-color: ${_styles.COLORS.primary_100};
-      border-bottom: 3px solid ${_styles.COLORS.primary_500};
     }
   }
 `;
@@ -153,6 +149,20 @@
   padding-top: 1%;
   cursor: not-allowed;
 `;
+  const ItemContent = (0, _styledComponents2.default)('div')`
+  width: 100%;
+  text-align:center;
+  display: table-cell;
+  vertical-align:middle;
+`;
+  const ItemSelected = (0, _styledComponents2.default)('div')`
+  justify-content: center;
+  margin: 0 20%;
+  border-radius: 4px;
+  text-align: center;
+  height: 4px;
+  background-color: ${_styles.COLORS.primary_500}
+`;
 
   const Step = ({
     up = true,
@@ -229,7 +239,7 @@
       onClick: () => {
         if (onPageChange) onPageChange(1);
       }
-    }, "1")), currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(item => item === 1) === -1 && /*#__PURE__*/React.createElement(Dots, null, /*#__PURE__*/React.createElement(_SystemIcons.MoreHorizontal, {
+    }, /*#__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(item => item === 1) === -1 && /*#__PURE__*/React.createElement(Dots, null, /*#__PURE__*/React.createElement(_SystemIcons.MoreHorizontal, {
       color: _styles.COLORS.neutral_600
     })), pages.map(page => /*#__PURE__*/React.createElement(Item, {
       key: page
@@ -238,14 +248,14 @@
       onClick: () => {
         if (onPageChange) onPageChange(page);
       }
-    }, page))), pageCount > 5 && currentPage <= pageCount - 3 && /*#__PURE__*/React.createElement(Dots, null, /*#__PURE__*/React.createElement(_SystemIcons.MoreHorizontal, {
+    }, /*#__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(item => item === pageCount) === -1 && pageCount !== 1 && /*#__PURE__*/React.createElement(Item, null, /*#__PURE__*/React.createElement(_reactRouterDom.NavLink, {
       to: `${baseUrl}/${pageCount}`,
       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: `${baseUrl}/${currentPage + 1}`,
       page: currentPage + 1,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Paginator/Paginator.tsx"],"names":["Container","styled","nav","BREAKPOINTS","MEDIUM","Items","ul","Item","li","ComponentMStyling","ComponentTextStyle","COLORS","primary_800","primary_20","primary_700","primary_100","neutral_800","primary_500","neutral_20","Dots","pageCount","currentPage","baseUrl","onPageChange","Step","up","target","disabled","testId","cursor","neutral_300","Paginator","pages","from","to","i","item","neutral_600","page"],"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","ComponentMStyling","ComponentTextStyle","COLORS","primary_800","primary_20","primary_700","primary_100","neutral_800","neutral_20","Dots","ItemContent","ItemSelected","primary_500","pageCount","currentPage","baseUrl","onPageChange","Step","up","target","disabled","testId","cursor","neutral_300","Paginator","pages","from","to","i","item","neutral_600","page"],"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\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/umd/Paginator/__tests__/Paginator.test.js

@@ -98,7 +98,7 @@
       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/umd/Paginator/__tests__/Paginator.test.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/Paginator/__tests__/Paginator.test.tsx"],"names":["jest","useLocation","pathname","describe","it","history","route","getByTestId","render","expect","queryByText"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOAA,EAAAA,IAAI,CAAJA,IAAAA,CAAAA,kBAAAA,EAA8B,MAAA,aAAA,CAAA,aAAA,CAAA,EAAA,EACzBA,IAAI,CAAJA,aAAAA,CADyB,kBACzBA,CADyB,CAAA,EAAA,EAAA,EAAA;AAE5BC,IAAAA,WAAW,EAAE,OAAO;AAClBC,MAAAA,QAAQ,EAAE;AADQ,KAAP;AAFe,GAAA,CAA9BF;AAOAG,EAAAA,QAAQ,CAAA,eAAA,EAAkB,MAAM;AAC9BC,IAAAA,EAAE,CAAA,mBAAA,EAAsB,YAAY;AAClC,YAAMC,OAAO,GAAb,mCAAA;AACA,YAAMC,KAAK,GAAX,IAAA;AACAD,MAAAA,OAAO,CAAPA,IAAAA,CAAAA,KAAAA;AACA,YAAM;AAAA,QAAA,WAAA;AAAeE,QAAAA;AAAf,UAA+BC,qBAAM,aACzC,gBAAA,aAAA,CAAA,mBAAA,EAAA;AAAQ,QAAA,OAAO,EAAEH;AAAjB,OAAA,EAAA,aACE,gBAAA,aAAA,CAAA,gBAAA,EAAA;AAAW,QAAA,SAAS,EAApB,CAAA;AAAyB,QAAA,WAAW,EAApC,CAAA;AAAyC,QAAA,OAAO,EAAhD,EAAA;AAAoD,QAAA,YAAY,EAAE,MAAM,CAAE;AAA1E,OAAA,CADF,CADmCG,CAArC;AAKAC,MAAAA,MAAM,CAACC,WAAW,CAAlBD,GAAkB,CAAZ,CAANA,CAAAA,WAAAA;AACAA,MAAAA,MAAM,CAACF,WAAW,CAAlBE,wBAAkB,CAAZ,CAANA,CAAAA,WAAAA;AACAA,MAAAA,MAAM,CAACF,WAAW,CAAlBE,wBAAkB,CAAZ,CAANA,CAAAA,WAAAA;AACAA,MAAAA,MAAM,CAACC,WAAW,CAAlBD,GAAkB,CAAZ,CAANA,CAAAA,cAAAA,CAZkC,MAYlCA,EAZkC,CAclC;;AACCF,MAAAA,WAAW,CAAXA,wBAAW,CAAXA,CAAAA,QAAAA,CAAD,CAACA,EAAD,KAACA;AACDE,MAAAA,MAAM,CAACJ,OAAO,CAAPA,QAAAA,CAAPI,QAAM,CAANA,CAAAA,IAAAA,CAhBkC,IAgBlCA,EAhBkC,CAkBlC;;AACAC,MAAAA,WAAW,CAAXA,GAAW,CAAXA,EAAAA,KAAAA;AACAD,MAAAA,MAAM,CAACJ,OAAO,CAAPA,QAAAA,CAAPI,QAAM,CAANA,CAAAA,IAAAA,CAAAA,IAAAA;AApBFL,KAAE,CAAFA;AADFD,GAAQ,CAARA","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","useLocation","pathname","describe","it","history","route","getByTestId","render","expect","queryByText"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOAA,EAAAA,IAAI,CAAJA,IAAAA,CAAAA,kBAAAA,EAA8B,MAAA,aAAA,CAAA,aAAA,CAAA,EAAA,EACzBA,IAAI,CAAJA,aAAAA,CADyB,kBACzBA,CADyB,CAAA,EAAA,EAAA,EAAA;AAE5BC,IAAAA,WAAW,EAAE,OAAO;AAClBC,MAAAA,QAAQ,EAAE;AADQ,KAAP;AAFe,GAAA,CAA9BF;AAOAG,EAAAA,QAAQ,CAAA,eAAA,EAAkB,MAAM;AAC9BC,IAAAA,EAAE,CAAA,mBAAA,EAAsB,YAAY;AAClC,YAAMC,OAAO,GAAb,mCAAA;AACA,YAAMC,KAAK,GAAX,IAAA;AACAD,MAAAA,OAAO,CAAPA,IAAAA,CAAAA,KAAAA;AACA,YAAM;AAAA,QAAA,WAAA;AAAeE,QAAAA;AAAf,UAA+BC,qBAAM,aACzC,gBAAA,aAAA,CAAA,mBAAA,EAAA;AAAQ,QAAA,OAAO,EAAEH;AAAjB,OAAA,EAAA,aACE,gBAAA,aAAA,CAAA,gBAAA,EAAA;AAAW,QAAA,SAAS,EAApB,CAAA;AAAyB,QAAA,WAAW,EAApC,CAAA;AAAyC,QAAA,OAAO,EAAhD,EAAA;AAAoD,QAAA,YAAY,EAAE,MAAM,CAAE;AAA1E,OAAA,CADF,CADmCG,CAArC;AAKAC,MAAAA,MAAM,CAACC,WAAW,CAAlBD,GAAkB,CAAZ,CAANA,CAAAA,WAAAA;AACAA,MAAAA,MAAM,CAACF,WAAW,CAAlBE,wBAAkB,CAAZ,CAANA,CAAAA,WAAAA;AACAA,MAAAA,MAAM,CAACF,WAAW,CAAlBE,wBAAkB,CAAZ,CAANA,CAAAA,WAAAA;AACAA,MAAAA,MAAM,CAACC,WAAW,CAAlBD,GAAkB,CAAZ,CAANA,CAZkC,WAYlCA,GAZkC,CAclC;;AACCF,MAAAA,WAAW,CAAXA,wBAAW,CAAXA,CAAAA,QAAAA,CAAD,CAACA,EAAD,KAACA;AACDE,MAAAA,MAAM,CAACJ,OAAO,CAAPA,QAAAA,CAAPI,QAAM,CAANA,CAAAA,IAAAA,CAhBkC,IAgBlCA,EAhBkC,CAkBlC;;AACAC,MAAAA,WAAW,CAAXA,GAAW,CAAXA,EAAAA,KAAAA;AACAD,MAAAA,MAAM,CAACJ,OAAO,CAAPA,QAAAA,CAAPI,QAAM,CAANA,CAAAA,IAAAA,CAAAA,IAAAA;AApBFL,KAAE,CAAFA;AADFD,GAAQ,CAARA","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/umd/Table/Table.js

@@ -1,16 +1,16 @@
 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "react", "../icons/systemicons/SystemIcons", "../icons/index", "../Dropdown/index", "../Button/index", "../styles", "./TableStyles", "../LoadingIndicator"], factory);
+    define(["exports", "react", "../icons/systemicons/SystemIcons", "../icons/index", "../Dropdown/index", "../Button/index", "../types", "../styles", "./TableStyles", "../LoadingIndicator"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("react"), require("../icons/systemicons/SystemIcons"), require("../icons/index"), require("../Dropdown/index"), require("../Button/index"), require("../styles"), require("./TableStyles"), require("../LoadingIndicator"));
+    factory(exports, require("react"), require("../icons/systemicons/SystemIcons"), require("../icons/index"), require("../Dropdown/index"), require("../Button/index"), require("../types"), require("../styles"), require("./TableStyles"), require("../LoadingIndicator"));
   } else {
     var mod = {
       exports: {}
     };
-    factory(mod.exports, global.react, global.SystemIcons, global.index, global.index, global.index, global.styles, global.TableStyles, global.LoadingIndicator);
+    factory(mod.exports, global.react, global.SystemIcons, global.index, global.index, global.index, global.types, global.styles, global.TableStyles, global.LoadingIndicator);
     global.undefined = mod.exports;
   }
-})(this, function (exports, _react, _SystemIcons, _index, _index2, _index3, _styles, _TableStyles, _LoadingIndicator) {
+})(this, function (exports, _react, _SystemIcons, _index, _index2, _index3, _types, _styles, _TableStyles, _LoadingIndicator) {
   "use strict";
 
   Object.defineProperty(exports, "__esModule", {
@@ -389,7 +389,7 @@
         className: `${column.shortenText && `truncate-text`} ${column.justify ? `justify-${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: event => onLinkClick(row, column.key, event),
         style: column.colorFn && {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Table/Table.tsx"],"names":["Table","showLoadingIndicator","React","tmpFilteredRows","filterAndSortRows","setFilteredRows","setTotal","rowsFrom","currentPage","rowsTo","setFrom","setTo","setCurrentPageRows","pagination","setCurrentPage","setRowsPerPage","row","matchFilterCriteria","column","columns","sortingColumn","setSortedDirection","setSortedColumn","a","b","sortTableColumn","tmpColumn","remotePagination","triggerSortingChange","previousPage","previousPageClick","nextPage","nextPageClick","filteredRows","changeRowsPerPage","value","rowsPerPageChange","parseInt","renderHeader","title","length","COLORS","neutral_600","width","justify","onLinkClick","event","linkClick","onIconClick","iconClick","onRowClick","selectedText","window","rowClick","renderBody","currentPageRows","index","key","color","maxWidth","size","className","renderFooter","rowsPerPageValues","rowsPerPage","total","from","to"],"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","showLoadingIndicator","React","tmpFilteredRows","filterAndSortRows","setFilteredRows","setTotal","rowsFrom","currentPage","rowsTo","setFrom","setTo","setCurrentPageRows","pagination","setCurrentPage","setRowsPerPage","row","matchFilterCriteria","column","columns","sortingColumn","setSortedDirection","setSortedColumn","a","b","sortTableColumn","tmpColumn","remotePagination","triggerSortingChange","previousPage","previousPageClick","nextPage","nextPageClick","filteredRows","changeRowsPerPage","value","rowsPerPageChange","parseInt","renderHeader","title","length","COLORS","neutral_600","width","justify","onLinkClick","event","linkClick","onIconClick","iconClick","onRowClick","selectedText","window","rowClick","renderBody","currentPageRows","index","key","color","maxWidth","Size","size","className","renderFooter","rowsPerPageValues","rowsPerPage","total","from","to"],"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';\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/umd/Tabs/TabLink.js

@@ -109,7 +109,7 @@
   }
 
   &.active {
-    background-color: ${_styles.COLORS.white};
+    background-color: ${_styles.COLORS.neutral_20};
   }
   &.active:hover {
     background-color: ${_styles.COLORS.primary_20};

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Tabs/TabLink.tsx"],"names":["disabled","requiredLine","optionalLine","onLinkClick","testId","showNotificationDot","StyledTabLink","styled","COLORS","neutral_600","props","white","primary_20","primary_600","primary_100","primary_800","primary_500","neutral_300","OptionalLineWrapper","div","NotificationDot","critical_500","TopWrapper","TabLink","exact","location","ref","React","to","OptionalLineIcon"],"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":["disabled","requiredLine","optionalLine","onLinkClick","testId","showNotificationDot","StyledTabLink","styled","COLORS","neutral_600","props","white","neutral_20","primary_20","primary_600","primary_100","primary_800","primary_500","neutral_300","OptionalLineWrapper","div","NotificationDot","critical_500","TopWrapper","TabLink","exact","location","ref","React","to","OptionalLineIcon"],"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/umd/Toasters/Toast.js

@@ -380,7 +380,7 @@
     }, opts.icon && /*#__PURE__*/React.createElement(IconContainer, null, opts.icon), /*#__PURE__*/React.createElement(TextContainer, {
       className: 'description'
     }, content), opts.action && /*#__PURE__*/React.createElement(ActionButtons, null, opts.action.map((action, i) => /*#__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,