@laerdal/life-react-components 1.3.1 → 1.3.2-dev.3

package/dist/umd/Modals/__tests__/Modal.test.js

@@ -0,0 +1,173 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["react", "@testing-library/react", "..", "../..", "jest-styled-components"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(require("react"), require("@testing-library/react"), require(".."), require("../.."), require("jest-styled-components"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(global.react, global.react, global._, global._, global.jestStyledComponents);
+    global.undefined = mod.exports;
+  }
+})(this, function (_react, _react3, _, _2) {
+  "use strict";
+
+  var _react2 = _interopRequireDefault(_react);
+
+  function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+      default: obj
+    };
+  }
+
+  describe('<ModalDialog />', () => {
+    let mountingDiv;
+    beforeEach(() => {
+      //being rendered as a React.Portal we need to have the 'root' div defined
+      mountingDiv = document.createElement('div');
+      mountingDiv.id = 'root';
+      document.body.appendChild(mountingDiv);
+    });
+    afterEach(() => {
+      document.body.removeChild(mountingDiv);
+    });
+    it('Check modal not rendered when isModalOpen is false', async () => {
+      const {
+        container,
+        getByText
+      } = (0, _react3.render)( /*#__PURE__*/_react2.default.createElement(_.ModalDialog, {
+        key: "smallModalWithoutImage",
+        closeModalAndClearInput: () => {},
+        title: 'Header',
+        size: _2.Size.Small,
+        isModalOpen: false,
+        closeAction: () => {},
+        submitAction: () => {}
+      })); //check modal portal not exists when modal not opened
+
+      expect(container.querySelector('.ReactModalPortal')).toBeNull();
+    });
+    it('Check modal visible, title and footer buttons displayed correctly', async () => {
+      const {
+        container,
+        getByText
+      } = (0, _react3.render)( /*#__PURE__*/_react2.default.createElement(_.ModalDialog, {
+        key: "smallModalWithoutImage",
+        closeModalAndClearInput: () => {},
+        title: 'Header',
+        size: _2.Size.Small,
+        isModalOpen: true,
+        closeAction: () => {},
+        submitAction: () => {},
+        buttons: [{
+          action: () => {},
+          text: 'Close',
+          variant: 'tertiary'
+        }, {
+          action: () => {},
+          text: 'Save'
+        }]
+      })); //check modal portal defined
+
+      expect(container.querySelector('.ReactModalPortal')).toBeDefined(); //Check header and footer buttons
+
+      expect(getByText('Header')).toBeDefined();
+      expect(getByText('Close')).toBeDefined();
+      expect(getByText('Save')).toBeDefined();
+    });
+    it('Check tooltip, and link displayed without right footer buttons', async () => {
+      const {
+        baseElement,
+        getByText
+      } = (0, _react3.render)( /*#__PURE__*/_react2.default.createElement(_.ModalDialog, {
+        key: "smallModalWithoutImage",
+        closeModalAndClearInput: () => {},
+        title: 'Header',
+        size: _2.Size.Small,
+        isModalOpen: true,
+        closeAction: () => {},
+        submitAction: () => {},
+        tooltip: 'some test tooltip',
+        leftFooterAction: {
+          id: 'test-link',
+          actionType: 'hyperlink',
+          text: 'Link',
+          href: 'http://test.com',
+          icon: /*#__PURE__*/_react2.default.createElement(_react2.default.Fragment, null),
+          variant: 'default'
+        }
+      })); //check tooltip displayed
+
+      expect(getByText('some test tooltip').textContent).toBeDefined(); //check footer link displayed
+
+      expect(getByText('Link').children).toBeDefined();
+    });
+    it('Check note and footer note displayed', async () => {
+      const {
+        baseElement,
+        getByText
+      } = (0, _react3.render)( /*#__PURE__*/_react2.default.createElement(_.ModalDialog, {
+        key: "smallModalWithoutImage",
+        closeModalAndClearInput: () => {},
+        title: 'Header',
+        size: _2.Size.Small,
+        isModalOpen: true,
+        closeAction: () => {},
+        submitAction: () => {},
+        leftFooterAction: {
+          id: 'test-note',
+          actionType: 'note',
+          text: 'Test note',
+          icon: /*#__PURE__*/_react2.default.createElement(_2.SystemIcons.Information, null)
+        },
+        note: 'Message text',
+        state: 'critical'
+      })); //check footer note text displayed
+
+      expect(getByText('Test note').textContent).toBeDefined(); //check note section added
+
+      expect(baseElement.querySelectorAll('section')?.length).toEqual(4); //check note message displayed
+
+      expect(getByText('Message text').children).toBeDefined();
+    });
+    it('Check back button and close icon displayed', async () => {
+      const {
+        baseElement,
+        getByText,
+        container
+      } = (0, _react3.render)( /*#__PURE__*/_react2.default.createElement(_.ModalDialog, {
+        key: "smallModalWithoutImage",
+        closeModalAndClearInput: () => {},
+        title: 'Header',
+        size: _2.Size.Small,
+        backButton: () => {},
+        isModalOpen: true,
+        closeAction: () => {},
+        submitAction: () => {}
+      })); //only 2 svg elements should be found in the header of the modal
+
+      expect(baseElement.querySelectorAll('svg')?.length).toEqual(2);
+    });
+    it('Check modal body displayed', async () => {
+      const {
+        baseElement,
+        getByText,
+        container
+      } = (0, _react3.render)( /*#__PURE__*/_react2.default.createElement(_.ModalDialog, {
+        key: "smallModalWithoutImage",
+        closeModalAndClearInput: () => {},
+        title: 'Header',
+        size: _2.Size.Small,
+        isModalOpen: true,
+        closeAction: () => {},
+        submitAction: () => {}
+      }, /*#__PURE__*/_react2.default.createElement("span", null, "Inner modal text"))); //Check all dialog sections are displayed
+
+      expect(baseElement.querySelectorAll('section')?.length).toEqual(3); //Check that the second section (modal body) has the correct text
+
+      expect(baseElement.querySelectorAll('section')?.[1].textContent).toEqual('Inner modal text');
+    });
+  });
+});
+//# sourceMappingURL=Modal.test.js.map

package/dist/umd/Modals/__tests__/Modal.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Modals/__tests__/Modal.test.tsx"],"names":["describe","beforeEach","mountingDiv","document","afterEach","it","getByText","render","Size","expect","container","action","text","variant","id","actionType","href","icon","baseElement"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport 'jest-styled-components';\nimport { ModalDialog } from '..';\nimport { COLORS, Size, SystemIcons } from '../..';\n\ndescribe('<ModalDialog />', () => {\n  let mountingDiv: HTMLElement;\n\n  beforeEach(() => {\n    //being rendered as a React.Portal we need to have the 'root' div defined\n    mountingDiv = document.createElement('div');\n    mountingDiv.id = 'root';\n    document.body.appendChild(mountingDiv);\n  });\n\n  afterEach(() => {\n    document.body.removeChild(mountingDiv);\n  });\n\n  it('Check modal not rendered when isModalOpen is false', async () => {\n    const { container, getByText } = render(\n      <ModalDialog\n        key=\"smallModalWithoutImage\"\n        closeModalAndClearInput={() => {}}\n        title={'Header'}\n        size={Size.Small}\n        isModalOpen={false}\n        closeAction={() => {}}\n        submitAction={() => {}}\n      />,\n    );\n    //check modal portal not exists when modal not opened\n    expect(container.querySelector('.ReactModalPortal')).toBeNull();\n  });\n\n  it('Check modal visible, title and footer buttons displayed correctly', async () => {\n    const { container, getByText } = render(\n      <ModalDialog\n        key=\"smallModalWithoutImage\"\n        closeModalAndClearInput={() => {}}\n        title={'Header'}\n        size={Size.Small}\n        isModalOpen={true}\n        closeAction={() => {}}\n        submitAction={() => {}}\n        buttons={[\n          {\n            action: () => {},\n            text: 'Close',\n            variant: 'tertiary',\n          },\n          {\n            action: () => {},\n            text: 'Save',\n          },\n        ]}\n      />,\n    );\n    //check modal portal defined\n    expect(container.querySelector('.ReactModalPortal')).toBeDefined();\n    //Check header and footer buttons\n    expect(getByText('Header')).toBeDefined();\n    expect(getByText('Close')).toBeDefined();\n    expect(getByText('Save')).toBeDefined();\n  });\n\n  it('Check tooltip, and link displayed without right footer buttons', async () => {\n    const { baseElement, getByText } = render(\n      <ModalDialog\n        key=\"smallModalWithoutImage\"\n        closeModalAndClearInput={() => {}}\n        title={'Header'}\n        size={Size.Small}\n        isModalOpen={true}\n        closeAction={() => {}}\n        submitAction={() => {}}\n        tooltip={'some test tooltip'}\n        leftFooterAction={{ id: 'test-link', actionType: 'hyperlink', text: 'Link', href: 'http://test.com', icon: <></>, variant: 'default' }}\n      />,\n    );\n    //check tooltip displayed\n    expect(getByText('some test tooltip').textContent).toBeDefined();\n    //check footer link displayed\n    expect(getByText('Link').children).toBeDefined();\n  });\n\n  it('Check note and footer note displayed', async () => {\n    const { baseElement, getByText } = render(\n      <ModalDialog\n        key=\"smallModalWithoutImage\"\n        closeModalAndClearInput={() => {}}\n        title={'Header'}\n        size={Size.Small}\n        isModalOpen={true}\n        closeAction={() => {}}\n        submitAction={() => {}}\n        leftFooterAction={{ id: 'test-note', actionType: 'note', text: 'Test note', icon: <SystemIcons.Information /> }}\n        note={'Message text'}\n        state={'critical'}\n      />,\n    );\n    //check footer note text displayed\n    expect(getByText('Test note').textContent).toBeDefined();\n    //check note section added\n    expect(baseElement.querySelectorAll('section')?.length).toEqual(4);\n    //check note message displayed\n    expect(getByText('Message text').children).toBeDefined();\n  });\n\n  it('Check back button and close icon displayed', async () => {\n    const { baseElement, getByText, container } = render(\n      <ModalDialog\n        key=\"smallModalWithoutImage\"\n        closeModalAndClearInput={() => {}}\n        title={'Header'}\n        size={Size.Small}\n        backButton={() => {}}\n        isModalOpen={true}\n        closeAction={() => {}}\n        submitAction={() => {}}\n      />,\n    );\n    //only 2 svg elements should be found in the header of the modal\n    expect(baseElement.querySelectorAll('svg')?.length).toEqual(2);\n  });\n\n  it('Check modal body displayed', async () => {\n    const { baseElement, getByText, container } = render(\n      <ModalDialog\n        key=\"smallModalWithoutImage\"\n        closeModalAndClearInput={() => {}}\n        title={'Header'}\n        size={Size.Small}\n        isModalOpen={true}\n        closeAction={() => {}}\n        submitAction={() => {}}>\n        <span>Inner modal text</span>\n      </ModalDialog>,\n    );\n    //Check all dialog sections are displayed\n    expect(baseElement.querySelectorAll('section')?.length).toEqual(3);\n    //Check that the second section (modal body) has the correct text\n    expect(baseElement.querySelectorAll('section')?.[1].textContent).toEqual('Inner modal text');\n  });\n});\n"],"file":"Modal.test.js"}

package/dist/umd/Tabs/TabLink.js

@@ -195,6 +195,7 @@
 `;
   const TextContainer = _styledComponents2.default.div`
   width: 100%;
+  margin: auto 0 auto 16px !important;
 `;
   const StyledNotification = _styledComponents2.default.div`
   margin: 0 15px 0 0 !important;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Tabs/TabLink.tsx"],"names":["disabled","requiredLine","optionalLine","onLinkClick","testId","showNotificationDot","variant","StyledTabLink","styled","COLORS","neutral_600","props","Z_INDEXES","focus","white","active","neutral_20","primary_20","hover","primary_600","primary_100","primary_800","primary_500","neutral_300","OptionalLineWrapperWithIcon","div","TopWrapper","TextContainer","StyledNotification","OptionalLineWrapper","TabLink","exact","size","Size","location","ref","React","to","OptionalLineIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;MAAA,K;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,QAAMO,aAAa,GAAGC,gCAAM,uBAANA,CAAoC;AAC1D;AACA;AACA;AACA;AACA;AACA;AACA,WAAWC,eAAOC,WAAY;AAC9B;AACA,sBAAuBC,KAAD,IAAYA,KAAK,CAALA,QAAAA,GAAiBF,eAAjBE,WAAAA,GAAsC,aAAe;AACvF,YAAaA,KAAD,IAAYA,KAAK,CAALA,QAAAA,GAAAA,aAAAA,GAAiC,SAAW;AACpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAeC,oBAAUC,KAAM;AAC/B,wBAAwBJ,eAAOK,KAAM;AACrC;AACA;AACA;AACA;AACA,0BAA0BL,eAAOK,KAAM;AACvC;AACA;AACA;AACA;AACA,eAAeF,oBAAUG,MAAO;AAChC,wBAAwBN,eAAOO,UAAW;AAC1C;AACA;AACA;AACA,wBAAwBP,eAAOQ,UAAW;AAC1C;AACA;AACA;AACA,wBAAwBR,eAAOK,KAAM;AACrC;AACA;AACA;AACA,eAAeF,oBAAUM,KAAM;AAC/B,wBAAwBT,eAAOQ,UAAW;AAC1C,aAAaR,eAAOU,WAAY;AAChC;AACA;AACA;AACA,eAAeP,oBAAUG,MAAO;AAChC;AACA,wBAAwBN,eAAOW,WAAY;AAC3C,aAAaX,eAAOY,WAAY;AAChC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0BZ,eAAOa,WAAY;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0Bb,eAAOU,WAAY;AAC7C;AACA;AACA;AACA;AACA,wBAAwBV,eAAOW,WAAY;AAC3C;AACA;AACA,0BAA0BX,eAAOY,WAAY;AAC7C;AACA;AACA;AACA;AACA;AACA,wBAAwBZ,eAAOK,KAAM;AACrC;AACA;AACA,eAAeL,eAAOc,WAAY;AAClC;AACA;AACA;AACA,0BAA0Bd,eAAOK,KAAM;AACvC;AACA;AAhGA,CAAA;AAmGA,QAAMU,2BAA2B,GAAGhB,2BAAOiB,GAAI;AAC/C;AACA;AACA;AACA;AACA;AACA;AACA;AAPA,CAAA;AAUA,QAAMC,UAAU,GAAGlB,2BAAOiB,GAAI;AAC9B;AACA;AACA;AACA;AACA;AALA,CAAA;AAQA,QAAME,aAAa,GAAGnB,2BAAOiB,GAAI;AACjC;AADA,CAAA;AAIA,QAAMG,kBAAkB,GAAGpB,2BAAOiB,GAAI;AACtC;AADA,CAAA;AAIA,QAAMI,mBAAmB,GAAGrB,2BAAOiB,GAAI;AACvC;AADA,CAAA;;AAIA,QAAMK,OAAO,GAAG,CAAC;AAAA,IAAA,EAAA;AAAM9B,IAAAA,QAAQ,GAAd,KAAA;AAAwB+B,IAAAA,KAAK,GAA7B,KAAA;AAAA,IAAA,YAAA;AAAA,IAAA,YAAA;AAAA,IAAA,gBAAA;AAAA,IAAA,WAAA;AAAA,IAAA,MAAA;AAA0G1B,IAAAA,mBAAmB,GAA7H,KAAA;AAAuI2B,IAAAA,IAAI,GAAGC,YAA9I,KAAA;AAA0J3B,IAAAA,OAAO,GAAG;AAApK,GAAD,KAAoM;AAClN,UAAM4B,QAAQ,GAAd,kCAAA;AACA,UAAMC,GAAG,GAAGC,KAAK,CAALA,MAAAA,CAAZ,IAAYA,CAAZ;AAEA,WAAA,aACE,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AACE,MAAA,EAAE,EAAEC,EAAE,CADR,QACMA,EADN;AAEE,MAAA,eAAe,EAFjB,QAAA;AAGE,MAAA,QAAQ,EAHV,QAAA;AAIE,MAAA,KAAK,EAJP,KAAA;AAKE,MAAA,IAAI,EALN,KAAA;AAME,uBAAeA,EAAE,KAAKH,QAAQ,CANhC,QAAA;AAOE,MAAA,OAAO,EAAE,MAAM;AACbC,QAAAA,GAAG,EAAHA,OAAAA,EAAAA,IAAAA;;AACA,YAAA,WAAA,EAAiB;AACfhC,UAAAA,WAAW;AACZ;AAXL,OAAA;AAaE,MAAA,GAAG,EAbL,GAAA;AAcE,qBAAaC;AAdf,KAAA,EAAA,aAeE,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA,IAAA,EAAA,aACA,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAFF,YAEE,CADF,CADA,EAIC,YAAY,IAAZ,gBAAA,GAAA,aACC,KAAA,CAAA,aAAA,CAAA,2BAAA,EAAA,IAAA,EACGkC,gBAAgB,IAAA,aAAI,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AAAkB,MAAA,IAAI,EAAC;AAAvB,KAAA,CADvB,EAEGpC,YAAY,KAAZA,SAAAA,IAAAA,aAA8B,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAHlC,YAGkC,CAFjC,CADD,GAKGA,YAAY,GAAA,aACd,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,EAAA,aACE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAFY,YAEZ,CADF,CADc,GAAA,aAKd,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EA7BJ,IA6BI,CAdF,CAfF,EAAA,aAgCE,KAAA,CAAA,aAAA,CAAA,kBAAA,EAAA,IAAA,EACGG,mBAAmB,IAAA,aAAI,KAAA,CAAA,aAAA,CAAA,gCAAA,EAAA;AAAiB,MAAA,MAAM,EAAvB,iBAAA;AAA0C,MAAA,IAAI,EAA9C,IAAA;AAAsD,MAAA,OAAO,EAAEC;AAA/D,KAAA,CAD1B,CAhCF,CADF;AAJF,GAAA;;;AAjJEN,IAAAA,Q;AACAC,IAAAA,Y;AACAC,IAAAA,Y;AAEAC,IAAAA,W;AACAC,IAAAA,M;AACAC,IAAAA,mB;AAEAC,IAAAA,O,6BAAU,U,EAAa,U;;oBAqLzB,O","sourcesContent":["import * as React from 'react';\nimport { NavLink, NavLinkProps, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { NotificationDot } from '../NotificationDot';\nimport { BaseProps } from '../icons';\nimport { Size } from '../types';\nimport { COLORS } from '../styles';\nimport {Z_INDEXES} from '../styles/z-indexes';\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  size?: Size.Small | Size.Medium | Size.Large;\n  variant?: 'positive' | 'critical';\n} & NavLinkProps;\n\ntype StyledTabLinkProps = {\n  disabled?: boolean;\n  exact: boolean;\n};\n\nconst StyledTabLink = styled(NavLink)<StyledTabLinkProps>`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\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    z-index: ${Z_INDEXES.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    z-index: ${Z_INDEXES.active};\n    background-color: ${COLORS.neutral_20};\n  }\n\n  &.active:hover {\n    background-color: ${COLORS.primary_20};\n  }\n\n  &.active:focus {\n    background-color: ${COLORS.white};\n  }\n\n  &:hover {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_600};\n  }\n\n  &:active {\n    z-index: ${Z_INDEXES.active};\n    box-shadow: none;\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n  }\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-radius: 2px;\n    }\n  }\n\n  &.active:hover {\n    &::after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.active:active {\n    background-color: ${COLORS.primary_100};\n\n    &::after {\n      background-color: ${COLORS.primary_800};\n    }\n  }\n\n  &:disabled {\n    box-shadow: none;\n    background-color: ${COLORS.white};\n\n    span {\n      color: ${COLORS.neutral_300};\n    }\n\n    &::after {\n      background-color: ${COLORS.white};\n    }\n  }\n`;\n\nconst OptionalLineWrapperWithIcon = styled.div`\n  display: flex;\n  flex-direction: row;\n  span {\n    margin: 0 0 0 4px !important;\n    font-size: 12px;\n    line-height: 16px;\n  }\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 TextContainer = styled.div`\n  width: 100%;\n`;\n\nconst StyledNotification = styled.div`\n  margin: 0 15px 0 0 !important;\n`;\n\nconst OptionalLineWrapper = styled.div`\n  font-size: 12px;\n`;\n\nconst TabLink = ({ to, disabled = false, exact = false, requiredLine, optionalLine, OptionalLineIcon, onLinkClick, testId, showNotificationDot = false, size = Size.Small, variant = 'critical' }: 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      <TextContainer>  \n      <TopWrapper>\n        <span>{requiredLine}</span>        \n      </TopWrapper>\n      {optionalLine && OptionalLineIcon ? (\n        <OptionalLineWrapperWithIcon>\n          {OptionalLineIcon && <OptionalLineIcon size=\"16px\" />}\n          {optionalLine !== undefined && <span>{optionalLine}</span>}\n        </OptionalLineWrapperWithIcon>\n      ) : optionalLine ? (\n        <OptionalLineWrapper>\n          <span>{optionalLine}</span>\n        </OptionalLineWrapper>\n      ) : (\n        <></>\n      )}\n      </TextContainer>\n      <StyledNotification>\n        {showNotificationDot && <NotificationDot testId=\"NotificationDot\" size={size} variant={variant} />}\n      </StyledNotification>\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","variant","StyledTabLink","styled","COLORS","neutral_600","props","Z_INDEXES","focus","white","active","neutral_20","primary_20","hover","primary_600","primary_100","primary_800","primary_500","neutral_300","OptionalLineWrapperWithIcon","div","TopWrapper","TextContainer","StyledNotification","OptionalLineWrapper","TabLink","exact","size","Size","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 { NotificationDot } from '../NotificationDot';\nimport { BaseProps } from '../icons';\nimport { Size } from '../types';\nimport { COLORS } from '../styles';\nimport {Z_INDEXES} from '../styles/z-indexes';\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  size?: Size.Small | Size.Medium | Size.Large;\n  variant?: 'positive' | 'critical';\n} & NavLinkProps;\n\ntype StyledTabLinkProps = {\n  disabled?: boolean;\n  exact: boolean;\n};\n\nconst StyledTabLink = styled(NavLink)<StyledTabLinkProps>`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\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    z-index: ${Z_INDEXES.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    z-index: ${Z_INDEXES.active};\n    background-color: ${COLORS.neutral_20};\n  }\n\n  &.active:hover {\n    background-color: ${COLORS.primary_20};\n  }\n\n  &.active:focus {\n    background-color: ${COLORS.white};\n  }\n\n  &:hover {\n    z-index: ${Z_INDEXES.hover};\n    background-color: ${COLORS.primary_20};\n    color: ${COLORS.primary_600};\n  }\n\n  &:active {\n    z-index: ${Z_INDEXES.active};\n    box-shadow: none;\n    background-color: ${COLORS.primary_100};\n    color: ${COLORS.primary_800};\n  }\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-radius: 2px;\n    }\n  }\n\n  &.active:hover {\n    &::after {\n      background-color: ${COLORS.primary_600};\n    }\n  }\n\n  &.active:active {\n    background-color: ${COLORS.primary_100};\n\n    &::after {\n      background-color: ${COLORS.primary_800};\n    }\n  }\n\n  &:disabled {\n    box-shadow: none;\n    background-color: ${COLORS.white};\n\n    span {\n      color: ${COLORS.neutral_300};\n    }\n\n    &::after {\n      background-color: ${COLORS.white};\n    }\n  }\n`;\n\nconst OptionalLineWrapperWithIcon = styled.div`\n  display: flex;\n  flex-direction: row;\n  span {\n    margin: 0 0 0 4px !important;\n    font-size: 12px;\n    line-height: 16px;\n  }\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 TextContainer = styled.div`\n  width: 100%;\n  margin: auto 0 auto 16px !important;\n`;\n\nconst StyledNotification = styled.div`\n  margin: 0 15px 0 0 !important;\n`;\n\nconst OptionalLineWrapper = styled.div`\n  font-size: 12px;\n`;\n\nconst TabLink = ({ to, disabled = false, exact = false, requiredLine, optionalLine, OptionalLineIcon, onLinkClick, testId, showNotificationDot = false, size = Size.Small, variant = 'critical' }: 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      <TextContainer>  \n      <TopWrapper>\n        <span>{requiredLine}</span>        \n      </TopWrapper>\n      {optionalLine && OptionalLineIcon ? (\n        <OptionalLineWrapperWithIcon>\n          {OptionalLineIcon && <OptionalLineIcon size=\"16px\" />}\n          {optionalLine !== undefined && <span>{optionalLine}</span>}\n        </OptionalLineWrapperWithIcon>\n      ) : optionalLine ? (\n        <OptionalLineWrapper>\n          <span>{optionalLine}</span>\n        </OptionalLineWrapper>\n      ) : (\n        <></>\n      )}\n      </TextContainer>\n      <StyledNotification>\n        {showNotificationDot && <NotificationDot testId=\"NotificationDot\" size={size} variant={variant} />}\n      </StyledNotification>\n    </StyledTabLink>\n  );\n};\n\nexport default TabLink;\n"],"file":"TabLink.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@laerdal/life-react-components",
-  "version": "1.3.1",
+  "version": "1.3.2-dev.3",
   "private": false,
   "author": "Thomas Kalve <thomas.kalve@laerdal.com>",
   "contributors": [