@laerdal/life-react-components 1.10.3-dev.11 → 1.10.3-dev.14

package/dist/MenuItem/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/MenuItem/MenuItem.tsx"],"names":["React","styled","css","COLORS","ComponentTextStyle","focusStyles","LockedOn","Size","ComponentLStyling","ComponentMStyling","ComponentSStyling","defaultOnMouseDownHandler","DropdownButton","button","props","DropdownButtonCSS","size","ItemLabel","div","ItemIcon","ItemIconRight","ItemContent","Small","Large","Regular","neutral_600","Medium","white","primary_20","primary_700","primary_100","primary_800","neutral_20","neutral_800","primary_500","neutral_500","neutral_300","primary_600","MenuItem","forwardRef","ref","active","item","onClickHandler","className","tabIndex","iconRight","id","rest","disabled","locked","showDividerAbove","icon","displayLabel","value","noteLabel","fontSize","lineHeight","neutral_400","cloneElement"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {Link} from 'react-router-dom';\nimport styled, { css } from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronRight, LockedOn} from '../icons/systemicons/SystemIcons';\nimport {Product, Size} from '../types';\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling} from '../styles/typography';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport {CommonInteractionStyling, defaultOnMouseDownHandler} from '../common';\n\nexport interface MenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {\n   item: DropdownItem;\n   onClickHandler: (e: React.MouseEvent) => void;\n   active: boolean;\n   id: string;\n   size?: Size;\n   iconRight?: React.ReactElement;\n}\n\nexport const DropdownButton = styled.button<{ size?: Size }>`\n  ${(props) => DropdownButtonCSS(props.size)}\n`;\n\nexport const ItemLabel = styled.div``;\n\nexport const ItemIcon = styled.div``;\n\nexport const ItemIconRight = styled.div`\n  align-items: center;\n  display: flex;\n`;\n\nexport const ItemContent = styled.div<{size:Size}>`\n    margin: ${props=>props.size===Size.Small?'auto 0 auto 10px':(props.size===Size.Large?'auto 0 auto 26px':'auto 0 auto 18px')};\n    display: flex;\n    align-items: center;\n    flex-grow: 2;\n\n    ${ItemLabel} {\n      flex: 1 0 calc(100% - 40px);\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n    }\n\n    ${ItemIcon} {\n      margin-right: 8px;\n      svg {\n        display: block;\n        margin: auto;\n        height:${props=>props.size===Size.Small?'20px':''};\n        width:${props=>props.size===Size.Small?'20px':''};\n      }\n    }\n\n    ${ItemIconRight} {\n      flex-grow: 2;\n\n      .extraMargin {\n        position: absolute;\n        right: ${props=>props.size===Size.Small?'16px':'24px'};\n      }\n    }\n`;\n\n\nexport const DropdownButtonCSS = (size?: Size) => {\n  return css`\n    ${size == Size.Small && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n    position: relative;\n    text-decoration: none;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    min-height: ${size == Size.Large ? '64px' : size == Size.Medium ? '56px' : '48px'};\n    background-color: ${COLORS.white};\n    border: none;\n    cursor: pointer;\n    background: none;\n    width: 100%;\n    text-align: left;\n\n    span {\n      margin: auto 0 auto 16px;\n      line-height: 48px;\n    }\n\n    ${ItemLabel}, ${ItemIcon} {\n      color: ${COLORS.neutral_600};\n    }\n\n    &:hover:not(.active):not(:disabled):not(.disabled-state),\n    &.hover-state:not(.active):not(:disabled):not(.disabled-state) {\n      background: ${COLORS.primary_20};\n      ${ItemLabel}, ${ItemIcon} {\n        color: ${COLORS.primary_700};\n      }\n    }\n\n    &:focus, &.focus-state, &.focus-visible {\n      ${focusStyles}\n    }\n\n    &:active:not(.active):not(:disabled):not(.disabled-state), &.active-state {\n      background: ${COLORS.primary_100};\n      ${ItemLabel}, ${ItemIcon} {\n        color: ${COLORS.primary_800};\n      }\n    }\n\n    &.active {\n      background: ${COLORS.neutral_20};\n\n      ${ItemLabel}, ${ItemIcon} {\n        color: ${COLORS.neutral_800};\n      }\n\n      &::after {\n        position: absolute;\n        content: ' ';\n        width: 4px;\n        top: ${size == Size.Large ? '8px' : size == Size.Medium ? '6px' : '4px'};\n        bottom: ${size == Size.Large ? '8px' : size == Size.Medium ? '6px' : '4px'};\n        left: 4px;\n        background-color: ${COLORS.primary_500};\n\n        border-radius: 4px;\n      }\n    }\n\n\n    &.locked {\n      background: none;\n      cursor: not-allowed;\n      \n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.neutral_500};\n      }\n    }\n\n    &.active:hover:not(:disabled):not(.locked), &.active-hover-state {\n      background-color: ${COLORS.primary_20};\n\n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.primary_700};\n      }      \n\n      &::after {\n        background-color: ${COLORS.primary_700};\n      }\n    }\n\n    &.active:active:not(:disabled):not(.locked), &.active-active-state {\n      background-color: ${COLORS.primary_100};\n\n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.primary_800};\n      }\n\n      &::after {\n        background-color: ${COLORS.primary_800};\n      }\n    }\n\n    &.active.locked {\n      &::after {\n        background-color: ${COLORS.neutral_500};\n      } \n    }\n\n    &.active:disabled:not(.locked) {\n      &::after {\n        background-color: ${COLORS.neutral_300};\n      }     \n    }\n\n    &:disabled:not(.locked), &.disabled-state {\n      background: none;\n      cursor: not-allowed;\n      \n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.neutral_300} !important;\n      }\n    }\n\n    &.dropdown-hover:not(:disabled) {\n      background-color: ${COLORS.primary_20};\n      color: ${COLORS.primary_600};\n    }\n  `;\n};\n\nconst MenuItem = React.forwardRef<HTMLButtonElement, MenuItemProps>(({\n                                                                       active,\n                                                                       item,\n                                                                       onClickHandler,\n                                                                       size = Size.Medium,\n                                                                       className,\n                                                                       tabIndex,\n                                                                       iconRight,\n                                                                       id,\n                                                                       ...rest\n                                                                     }: MenuItemProps, ref) => {\n  return (\n    <DropdownButton\n        type=\"button\"\n        size={size}\n        disabled={item.disabled || item.locked}\n        tabIndex={tabIndex}\n        onMouseDown={defaultOnMouseDownHandler}\n        ref={ref}\n        onClick={onClickHandler}\n        className={ className + ' ' + (item.locked ? 'locked' : '') + ' ' + (item.showDividerAbove ? 'show-divider-above' : '') + ' ' + (active ? 'active' : '')}\n        id={id}\n        {...rest}>\n        {item.showDividerAbove && <div className=\"divider\" />}\n        <ItemContent size={size}>\n          {item.icon && <ItemIcon>{item.icon}</ItemIcon>}\n          <ItemLabel>\n              <div>\n                <div>{item.displayLabel ?? item.value}</div>\n                {item.noteLabel && <div style={{ fontSize: '12px', lineHeight: '16px' }}>{item.noteLabel}</div>}\n              </div>\n            {\n              item.locked &&\n              <ItemIconRight>\n                <LockedOn color={COLORS.neutral_400} className=\"extraMargin\" size=\"24px\"/>\n              </ItemIconRight>\n            }\n            {\n              !item.locked && !!iconRight &&\n              <ItemIconRight>\n                {React.cloneElement(iconRight, {className: 'extraMargin', size: '24px',})}\n              </ItemIconRight>\n            }\n\n          </ItemLabel>\n        </ItemContent>\n  </DropdownButton>\n  );\n});\n\nexport default MenuItem;\n"],"file":"MenuItem.js"}
+{"version":3,"sources":["../../src/MenuItem/MenuItem.tsx"],"names":["React","styled","css","COLORS","ComponentTextStyle","focusStyles","LockedOn","Size","ComponentLStyling","ComponentMStyling","ComponentSStyling","defaultOnMouseDownHandler","DropdownButton","button","props","DropdownButtonCSS","size","ItemLabel","div","ItemIcon","ItemIconRight","ItemContent","Small","Large","Medium","Regular","neutral_600","white","primary_20","primary_700","primary_100","primary_800","neutral_20","neutral_800","primary_500","neutral_500","neutral_300","primary_600","MenuItem","forwardRef","ref","active","item","onClickHandler","className","tabIndex","iconRight","id","rest","disabled","locked","showDividerAbove","icon","displayLabel","value","noteLabel","fontSize","lineHeight","neutral_400","cloneElement"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {Link} from 'react-router-dom';\nimport styled, { css } from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronRight, LockedOn} from '../icons/systemicons/SystemIcons';\nimport {Product, Size} from '../types';\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling} from '../styles/typography';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport {CommonInteractionStyling, defaultOnMouseDownHandler} from '../common';\n\nexport interface MenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {\n   item: DropdownItem;\n   onClickHandler: (e: React.MouseEvent) => void;\n   active: boolean;\n   id: string;\n   size?: Size;\n   iconRight?: React.ReactElement;\n}\n\nexport const DropdownButton = styled.button<{ size?: Size }>`\n  ${(props) => DropdownButtonCSS(props.size)}\n`;\n\nexport const ItemLabel = styled.div``;\n\nexport const ItemIcon = styled.div``;\n\nexport const ItemIconRight = styled.div`\n  align-items: center;\n  display: flex;\n`;\n\nexport const ItemContent = styled.div<{size:Size}>`\n    margin: ${props=>props.size===Size.Small?'auto 0 auto 10px':(props.size===Size.Large?'auto 0 auto 26px':'auto 0 auto 18px')};\n    display: flex;\n    align-items: center;\n    flex-grow: 2;\n\n    ${ItemLabel} {\n      margin: ${props => props.size === Size.Small || props.size === Size.Medium ? '14px 0' : '16px 0'};\n      flex: 1 0 calc(100% - 40px);\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n    }\n\n    ${ItemIcon} {\n      margin-right: 8px;\n      svg {\n        display: block;\n        margin: auto;\n        height:${props=>props.size===Size.Small?'20px':''};\n        width:${props=>props.size===Size.Small?'20px':''};\n      }\n    }\n\n    ${ItemIconRight} {\n      flex-grow: 2;\n\n      .extraMargin {\n        position: absolute;\n        right: ${props=>props.size===Size.Small?'16px':'24px'};\n      }\n    }\n`;\n\n\nexport const DropdownButtonCSS = (size?: Size) => {\n  return css`\n    ${size == Size.Small && ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${size == Size.Medium && ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n    ${size == Size.Large && ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n    position: relative;\n    text-decoration: none;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    min-height: ${size == Size.Large ? '64px' : size == Size.Medium ? '56px' : '48px'};\n    background-color: ${COLORS.white};\n    border: none;\n    cursor: pointer;\n    background: none;\n    width: 100%;\n    text-align: left;\n\n    span {\n      margin: auto 0 auto 16px;\n      line-height: 48px;\n    }\n\n    ${ItemLabel}, ${ItemIcon} {\n      color: ${COLORS.neutral_600};\n    }\n\n    &:hover:not(.active):not(:disabled):not(.disabled-state),\n    &.hover-state:not(.active):not(:disabled):not(.disabled-state) {\n      background: ${COLORS.primary_20};\n      ${ItemLabel}, ${ItemIcon} {\n        color: ${COLORS.primary_700};\n      }\n    }\n\n    &:focus, &.focus-state, &.focus-visible {\n      ${focusStyles}\n    }\n\n    &:active:not(.active):not(:disabled):not(.disabled-state), &.active-state {\n      background: ${COLORS.primary_100};\n      ${ItemLabel}, ${ItemIcon} {\n        color: ${COLORS.primary_800};\n      }\n    }\n\n    &.active {\n      background: ${COLORS.neutral_20};\n\n      ${ItemLabel}, ${ItemIcon} {\n        color: ${COLORS.neutral_800};\n      }\n\n      &::after {\n        position: absolute;\n        content: ' ';\n        width: 4px;\n        top: ${size == Size.Large ? '8px' : size == Size.Medium ? '6px' : '4px'};\n        bottom: ${size == Size.Large ? '8px' : size == Size.Medium ? '6px' : '4px'};\n        left: 4px;\n        background-color: ${COLORS.primary_500};\n\n        border-radius: 4px;\n      }\n    }\n\n\n    &.locked {\n      background: none;\n      cursor: not-allowed;\n      \n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.neutral_500};\n      }\n    }\n\n    &.active:hover:not(:disabled):not(.locked), &.active-hover-state {\n      background-color: ${COLORS.primary_20};\n\n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.primary_700};\n      }      \n\n      &::after {\n        background-color: ${COLORS.primary_700};\n      }\n    }\n\n    &.active:active:not(:disabled):not(.locked), &.active-active-state {\n      background-color: ${COLORS.primary_100};\n\n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.primary_800};\n      }\n\n      &::after {\n        background-color: ${COLORS.primary_800};\n      }\n    }\n\n    &.active.locked {\n      &::after {\n        background-color: ${COLORS.neutral_500};\n      } \n    }\n\n    &.active:disabled:not(.locked) {\n      &::after {\n        background-color: ${COLORS.neutral_300};\n      }     \n    }\n\n    &:disabled:not(.locked), &.disabled-state {\n      background: none;\n      cursor: not-allowed;\n      \n      ${ItemIcon}, ${ItemLabel} {\n        color: ${COLORS.neutral_300} !important;\n      }\n    }\n\n    &.dropdown-hover:not(:disabled) {\n      background-color: ${COLORS.primary_20};\n      color: ${COLORS.primary_600};\n    }\n  `;\n};\n\nconst MenuItem = React.forwardRef<HTMLButtonElement, MenuItemProps>(({\n                                                                       active,\n                                                                       item,\n                                                                       onClickHandler,\n                                                                       size = Size.Medium,\n                                                                       className,\n                                                                       tabIndex,\n                                                                       iconRight,\n                                                                       id,\n                                                                       ...rest\n                                                                     }: MenuItemProps, ref) => {\n  return (\n    <DropdownButton\n        type=\"button\"\n        size={size}\n        disabled={item.disabled || item.locked}\n        tabIndex={tabIndex}\n        onMouseDown={defaultOnMouseDownHandler}\n        ref={ref}\n        onClick={onClickHandler}\n        className={ className + ' ' + (item.locked ? 'locked' : '') + ' ' + (item.showDividerAbove ? 'show-divider-above' : '') + ' ' + (active ? 'active' : '')}\n        id={id}\n        {...rest}>\n        {item.showDividerAbove && <div className=\"divider\" />}\n        <ItemContent size={size}>\n          {item.icon && <ItemIcon>{item.icon}</ItemIcon>}\n          <ItemLabel>\n              <div>\n                <div>{item.displayLabel ?? item.value}</div>\n                {item.noteLabel && <div style={{ fontSize: '12px', lineHeight: '16px' }}>{item.noteLabel}</div>}\n              </div>\n            {\n              item.locked &&\n              <ItemIconRight>\n                <LockedOn color={COLORS.neutral_400} className=\"extraMargin\" size=\"24px\"/>\n              </ItemIconRight>\n            }\n            {\n              !item.locked && !!iconRight &&\n              <ItemIconRight>\n                {React.cloneElement(iconRight, {className: 'extraMargin', size: '24px',})}\n              </ItemIconRight>\n            }\n\n          </ItemLabel>\n        </ItemContent>\n  </DropdownButton>\n  );\n});\n\nexport default MenuItem;\n"],"file":"MenuItem.js"}

package/dist/Table/TableFooter.cjs

@@ -30,15 +30,12 @@ var _jsxRuntime = require("react/jsx-runtime");
 var TableFooter = function TableFooter(props) {
   var _props$rowsPerPageLab, _props$showMoreLabel, _props$showFewerLabel;
 
-  var rowsPerPageValues = [{
-    value: '10'
-  }, {
-    value: '20'
-  }, {
-    value: '50'
-  }, {
-    value: '100'
-  }];
+  var rowsPerPageOptions = [10, 20, 50, 100];
+  var rowsPerPageValues = rowsPerPageOptions.map(function (x) {
+    return {
+      value: "".concat(x)
+    };
+  });
   var dropDownText = "".concat((_props$rowsPerPageLab = props.rowsPerPageLabel) !== null && _props$rowsPerPageLab !== void 0 ? _props$rowsPerPageLab : 'Rows per page', " : ").concat(props.rowsPerPage);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableStyles.StyledTableFooter, {
     "data-testid": "TestTableFooterRow",
@@ -58,7 +55,7 @@ var TableFooter = function TableFooter(props) {
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowDropUp, {})]
       })]
     }), !props.accordion && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableStyles.StyledTableFooterContent, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownButton, {
+      children: [props.rows && props.rows.length > rowsPerPageOptions[0] && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownButton, {
         type: 'text',
         items: rowsPerPageValues,
         disabled: props.showLoadingIndicator,

package/dist/Table/TableFooter.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Table/TableFooter.tsx"],"names":["TableFooter","props","rowsPerPageValues","value","dropDownText","rowsPerPageLabel","rowsPerPage","accordion","setIsCollapsed","isCollapsed","defaultOnMouseDownHandler","rows","length","showMoreLabel","showFewerLabel","showLoadingIndicator","onRowsPerPageChange","total","from","to","prevPage","COLORS","neutral_600","nextPage"],"mappings":";;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAMA;;AACA;;;;AAeA,IAAMA,WAAsD,GAAG,SAAzDA,WAAyD,CAACC,KAAD,EAAW;AAAA;;AACxE,MAAMC,iBAAiC,GAAG,CAAC;AAACC,IAAAA,KAAK,EAAE;AAAR,GAAD,EAAgB;AAACA,IAAAA,KAAK,EAAE;AAAR,GAAhB,EAA+B;AAACA,IAAAA,KAAK,EAAE;AAAR,GAA/B,EAA8C;AAACA,IAAAA,KAAK,EAAE;AAAR,GAA9C,CAA1C;AAEA,MAAMC,YAAY,sCAAMH,KAAK,CAACI,gBAAZ,yEAAgC,eAAhC,gBAAqDJ,KAAK,CAACK,WAA3D,CAAlB;AAEA,sBACE,sBAAC,8BAAD;AAAmB,mBAAY,oBAA/B;AAAA,eAEQL,KAAK,CAACM,SAAN,iBACA,sBAAC,4CAAD;AAAiC,MAAA,OAAO,EAAE;AAAA,eAAMN,KAAK,CAACO,cAAN,CAAqB,CAACP,KAAK,CAACQ,WAA5B,CAAN;AAAA,OAA1C;AACiC,MAAA,WAAW,EAAEC,iCAD9C;AAEiC,MAAA,QAAQ,EAAET,KAAK,CAACQ,WAAN,IAAqBR,KAAK,CAACU,IAAN,CAAWC,MAAX,IAAqBX,KAAK,CAACK,WAF3F;AAAA,iBAIIL,KAAK,CAACQ,WAAN,iBACA;AAAA,gCACE;AAAA,6CAAOR,KAAK,CAACY,aAAb,uEAA8B,WAA9B,QAA6CZ,KAAK,CAACU,IAAN,CAAWC,MAAX,GAAoBX,KAAK,CAACK,WAAvE;AAAA,UADF,eAEE,qBAAC,kBAAD,CAAa,aAAb,KAFF;AAAA,QALJ,EAWI,CAACL,KAAK,CAACQ,WAAP,iBACA;AAAA,gCACE;AAAA,6CAAOR,KAAK,CAACa,cAAb,yEAA+B;AAA/B,UADF,eAEE,qBAAC,kBAAD,CAAa,WAAb,KAFF;AAAA,QAZJ;AAAA,MAHR,EAuBQ,CAACb,KAAK,CAACM,SAAP,iBACA,sBAAC,qCAAD;AAAA,8BACE,qBAAC,wBAAD;AACE,QAAA,IAAI,EAAE,MADR;AAEE,QAAA,KAAK,EAAEL,iBAFT;AAGE,QAAA,QAAQ,EAAED,KAAK,CAACc,oBAHlB;AAIE,QAAA,KAAK,EAAE,WAAId,KAAK,CAACK,WAAV,EAJT;AAKE,QAAA,OAAO,EAAE,iBAACH,KAAD;AAAA,iBAAWF,KAAK,CAACe,mBAAN,CAA0B,CAACb,KAAK,CAAC,CAAD,CAAhC,CAAX;AAAA,SALX;AAME,QAAA,KAAK,EAAEC,YANT;AAOE,QAAA,SAAS,EAAE;AAPb,QADF,eAUE,sBAAC,yCAAD;AAAA,mBACGH,KAAK,CAACgB,KAAN,KAAgB,CAAhB,GAAoB,CAApB,GAAwBhB,KAAK,CAACiB,IADjC,OACwCjB,KAAK,CAACkB,EAD9C,UACsDlB,KAAK,CAACgB,KAD5D;AAAA,QAVF,eAaE,sBAAC,sCAAD;AAAA,gCACE,qBAAC,kBAAD;AAAY,UAAA,OAAO,EAAC,WAApB;AAAgC,UAAA,KAAK,EAAC,UAAtC;AAAiD,UAAA,MAAM,EAAE;AAAA,mBAAMhB,KAAK,CAACmB,QAAN,EAAN;AAAA,WAAzD;AACY,UAAA,QAAQ,EAAEnB,KAAK,CAACiB,IAAN,KAAe,CAAf,IAAoBjB,KAAK,CAACc,oBADhD;AAAA,iCAEE,qBAAC,wBAAD;AAAa,YAAA,IAAI,EAAC,IAAlB;AAAuB,YAAA,KAAK,EAAEM,eAAOC;AAArC;AAFF,UADF,eAKE,qBAAC,kBAAD;AAAY,UAAA,OAAO,EAAC,WAApB;AAAgC,UAAA,KAAK,EAAC,UAAtC;AAAiD,UAAA,MAAM,EAAE;AAAA,mBAAMrB,KAAK,CAACsB,QAAN,EAAN;AAAA,WAAzD;AACY,UAAA,QAAQ,EAAEtB,KAAK,CAACkB,EAAN,KAAalB,KAAK,CAACgB,KAAnB,IAA4BhB,KAAK,CAACc,oBADxD;AAAA,iCAEE,qBAAC,yBAAD;AAAc,YAAA,IAAI,EAAC,IAAnB;AAAwB,YAAA,KAAK,EAAEM,eAAOC;AAAtC;AAFF,UALF;AAAA,QAbF;AAAA,MAxBR;AAAA,IADF;AAoDD,CAzDD;;;AAXEN,EAAAA,mB;AACAV,EAAAA,W;AACAY,EAAAA,I;AACAC,EAAAA,E;AACAF,EAAAA,K;AACAM,EAAAA,Q;AACAH,EAAAA,Q;AACAZ,EAAAA,c;AACAC,EAAAA,W;;eA+DaT,W","sourcesContent":["import React from 'react';\nimport {TableProps} from './TableTypes';\nimport {DropdownButton, DropdownItem} from '../Dropdown';\nimport {IconButton} from '../Button';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {COLORS} from '../styles';\nimport {\n  StyledTableFooter, StyledTableFooterCollapseButton,\n  StyledTableFooterContent,\n  StyledTableFooterControls,\n  StyledTableFooterCurrentInfo\n} from './TableStyles';\nimport {SystemIcons} from '../icons';\nimport {defaultOnMouseDownHandler} from '../common';\n\n\ninterface TableFooterProps extends TableProps {\n  onRowsPerPageChange: (value: number) => void;\n  rowsPerPage: number;\n  from?: number;\n  to?: number;\n  total?: number;\n  nextPage: () => void;\n  prevPage: () => void;\n  setIsCollapsed: (isCollapsed: boolean) => void;\n  isCollapsed: boolean;\n}\n\nconst TableFooter: React.FunctionComponent<TableFooterProps> = (props) => {\n  const rowsPerPageValues: DropdownItem[] = [{value: '10'}, {value: '20'}, {value: '50'}, {value: '100'}];\n\n  const dropDownText = `${props.rowsPerPageLabel ?? 'Rows per page'} : ${props.rowsPerPage}`;\n\n  return (\n    <StyledTableFooter data-testid=\"TestTableFooterRow\">\n          {\n            props.accordion &&\n            <StyledTableFooterCollapseButton onClick={() => props.setIsCollapsed(!props.isCollapsed)}\n                                             onMouseDown={defaultOnMouseDownHandler}\n                                             disabled={props.isCollapsed && props.rows.length <= props.rowsPerPage}>\n              {\n                props.isCollapsed &&\n                <>\n                  <span>{props.showMoreLabel ?? 'Show more'} ({props.rows.length - props.rowsPerPage})</span>\n                  <SystemIcons.ArrowDropDown/>\n                </>\n              }\n              {\n                !props.isCollapsed &&\n                <>\n                  <span>{props.showFewerLabel ?? 'Show fewer'}</span>\n                  <SystemIcons.ArrowDropUp/>\n                </>\n              }\n            </StyledTableFooterCollapseButton>\n          }\n          {\n            !props.accordion &&\n            <StyledTableFooterContent>\n              <DropdownButton\n                type={'text'}\n                items={rowsPerPageValues}\n                disabled={props.showLoadingIndicator}\n                value={[`${props.rowsPerPage}`]}\n                onClick={(value) => props.onRowsPerPageChange(+value[0])}\n                label={dropDownText}\n                keepLabel={true}\n              />\n              <StyledTableFooterCurrentInfo>\n                {props.total === 0 ? 0 : props.from}-{props.to} of {props.total}\n              </StyledTableFooterCurrentInfo>\n              <StyledTableFooterControls>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.prevPage()}\n                            disabled={props.from === 1 || props.showLoadingIndicator}>\n                  <ChevronLeft size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.nextPage()}\n                            disabled={props.to === props.total || props.showLoadingIndicator}>\n                  <ChevronRight size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n              </StyledTableFooterControls>\n            </StyledTableFooterContent>\n          }\n    </StyledTableFooter>\n  );\n};\n\n\nexport default TableFooter;\n"],"file":"TableFooter.cjs"}
+{"version":3,"sources":["../../src/Table/TableFooter.tsx"],"names":["TableFooter","props","rowsPerPageOptions","rowsPerPageValues","map","x","value","dropDownText","rowsPerPageLabel","rowsPerPage","accordion","setIsCollapsed","isCollapsed","defaultOnMouseDownHandler","rows","length","showMoreLabel","showFewerLabel","showLoadingIndicator","onRowsPerPageChange","total","from","to","prevPage","COLORS","neutral_600","nextPage"],"mappings":";;;;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAMA;;AACA;;;;AAeA,IAAMA,WAAsD,GAAG,SAAzDA,WAAyD,CAACC,KAAD,EAAW;AAAA;;AACxE,MAAMC,kBAAkB,GAAG,CAAC,EAAD,EAAK,EAAL,EAAS,EAAT,EAAa,GAAb,CAA3B;AACA,MAAMC,iBAAiC,GAAGD,kBAAkB,CAACE,GAAnB,CAAuB,UAAAC,CAAC,EAAI;AAAE,WAAO;AAACC,MAAAA,KAAK,YAAKD,CAAL;AAAN,KAAP;AAAuB,GAArD,CAA1C;AAEA,MAAME,YAAY,sCAAMN,KAAK,CAACO,gBAAZ,yEAAgC,eAAhC,gBAAqDP,KAAK,CAACQ,WAA3D,CAAlB;AAEA,sBACE,sBAAC,8BAAD;AAAmB,mBAAY,oBAA/B;AAAA,eAEQR,KAAK,CAACS,SAAN,iBACA,sBAAC,4CAAD;AAAiC,MAAA,OAAO,EAAE;AAAA,eAAMT,KAAK,CAACU,cAAN,CAAqB,CAACV,KAAK,CAACW,WAA5B,CAAN;AAAA,OAA1C;AACiC,MAAA,WAAW,EAAEC,iCAD9C;AAEiC,MAAA,QAAQ,EAAEZ,KAAK,CAACW,WAAN,IAAqBX,KAAK,CAACa,IAAN,CAAWC,MAAX,IAAqBd,KAAK,CAACQ,WAF3F;AAAA,iBAIIR,KAAK,CAACW,WAAN,iBACA;AAAA,gCACE;AAAA,6CAAOX,KAAK,CAACe,aAAb,uEAA8B,WAA9B,QAA6Cf,KAAK,CAACa,IAAN,CAAWC,MAAX,GAAoBd,KAAK,CAACQ,WAAvE;AAAA,UADF,eAEE,qBAAC,kBAAD,CAAa,aAAb,KAFF;AAAA,QALJ,EAWI,CAACR,KAAK,CAACW,WAAP,iBACA;AAAA,gCACE;AAAA,6CAAOX,KAAK,CAACgB,cAAb,yEAA+B;AAA/B,UADF,eAEE,qBAAC,kBAAD,CAAa,WAAb,KAFF;AAAA,QAZJ;AAAA,MAHR,EAuBQ,CAAChB,KAAK,CAACS,SAAP,iBACA,sBAAC,qCAAD;AAAA,iBACIT,KAAK,CAACa,IAAN,IAAcb,KAAK,CAACa,IAAN,CAAWC,MAAX,GAAoBb,kBAAkB,CAAC,CAAD,CAApD,iBAA2D,qBAAC,wBAAD;AAC3D,QAAA,IAAI,EAAE,MADqD;AAE3D,QAAA,KAAK,EAAEC,iBAFoD;AAG3D,QAAA,QAAQ,EAAEF,KAAK,CAACiB,oBAH2C;AAI3D,QAAA,KAAK,EAAE,WAAIjB,KAAK,CAACQ,WAAV,EAJoD;AAK3D,QAAA,OAAO,EAAE,iBAACH,KAAD;AAAA,iBAAWL,KAAK,CAACkB,mBAAN,CAA0B,CAACb,KAAK,CAAC,CAAD,CAAhC,CAAX;AAAA,SALkD;AAM3D,QAAA,KAAK,EAAEC,YANoD;AAO3D,QAAA,SAAS,EAAE;AAPgD,QAD/D,eAUE,sBAAC,yCAAD;AAAA,mBACGN,KAAK,CAACmB,KAAN,KAAgB,CAAhB,GAAoB,CAApB,GAAwBnB,KAAK,CAACoB,IADjC,OACwCpB,KAAK,CAACqB,EAD9C,UACsDrB,KAAK,CAACmB,KAD5D;AAAA,QAVF,eAaE,sBAAC,sCAAD;AAAA,gCACE,qBAAC,kBAAD;AAAY,UAAA,OAAO,EAAC,WAApB;AAAgC,UAAA,KAAK,EAAC,UAAtC;AAAiD,UAAA,MAAM,EAAE;AAAA,mBAAMnB,KAAK,CAACsB,QAAN,EAAN;AAAA,WAAzD;AACY,UAAA,QAAQ,EAAEtB,KAAK,CAACoB,IAAN,KAAe,CAAf,IAAoBpB,KAAK,CAACiB,oBADhD;AAAA,iCAEE,qBAAC,wBAAD;AAAa,YAAA,IAAI,EAAC,IAAlB;AAAuB,YAAA,KAAK,EAAEM,eAAOC;AAArC;AAFF,UADF,eAKE,qBAAC,kBAAD;AAAY,UAAA,OAAO,EAAC,WAApB;AAAgC,UAAA,KAAK,EAAC,UAAtC;AAAiD,UAAA,MAAM,EAAE;AAAA,mBAAMxB,KAAK,CAACyB,QAAN,EAAN;AAAA,WAAzD;AACY,UAAA,QAAQ,EAAEzB,KAAK,CAACqB,EAAN,KAAarB,KAAK,CAACmB,KAAnB,IAA4BnB,KAAK,CAACiB,oBADxD;AAAA,iCAEE,qBAAC,yBAAD;AAAc,YAAA,IAAI,EAAC,IAAnB;AAAwB,YAAA,KAAK,EAAEM,eAAOC;AAAtC;AAFF,UALF;AAAA,QAbF;AAAA,MAxBR;AAAA,IADF;AAoDD,CA1DD;;;AAXEN,EAAAA,mB;AACAV,EAAAA,W;AACAY,EAAAA,I;AACAC,EAAAA,E;AACAF,EAAAA,K;AACAM,EAAAA,Q;AACAH,EAAAA,Q;AACAZ,EAAAA,c;AACAC,EAAAA,W;;eAgEaZ,W","sourcesContent":["import React from 'react';\nimport {TableProps} from './TableTypes';\nimport {DropdownButton, DropdownItem} from '../Dropdown';\nimport {IconButton} from '../Button';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {COLORS} from '../styles';\nimport {\n  StyledTableFooter, StyledTableFooterCollapseButton,\n  StyledTableFooterContent,\n  StyledTableFooterControls,\n  StyledTableFooterCurrentInfo\n} from './TableStyles';\nimport {SystemIcons} from '../icons';\nimport {defaultOnMouseDownHandler} from '../common';\n\n\ninterface TableFooterProps extends TableProps {\n  onRowsPerPageChange: (value: number) => void;\n  rowsPerPage: number;\n  from?: number;\n  to?: number;\n  total?: number;\n  nextPage: () => void;\n  prevPage: () => void;\n  setIsCollapsed: (isCollapsed: boolean) => void;\n  isCollapsed: boolean;\n}\n\nconst TableFooter: React.FunctionComponent<TableFooterProps> = (props) => {\n  const rowsPerPageOptions = [10, 20, 50, 100];\n  const rowsPerPageValues: DropdownItem[] = rowsPerPageOptions.map(x => { return {value: `${x}`}});\n\n  const dropDownText = `${props.rowsPerPageLabel ?? 'Rows per page'} : ${props.rowsPerPage}`;\n\n  return (\n    <StyledTableFooter data-testid=\"TestTableFooterRow\">\n          {\n            props.accordion &&\n            <StyledTableFooterCollapseButton onClick={() => props.setIsCollapsed(!props.isCollapsed)}\n                                             onMouseDown={defaultOnMouseDownHandler}\n                                             disabled={props.isCollapsed && props.rows.length <= props.rowsPerPage}>\n              {\n                props.isCollapsed &&\n                <>\n                  <span>{props.showMoreLabel ?? 'Show more'} ({props.rows.length - props.rowsPerPage})</span>\n                  <SystemIcons.ArrowDropDown/>\n                </>\n              }\n              {\n                !props.isCollapsed &&\n                <>\n                  <span>{props.showFewerLabel ?? 'Show fewer'}</span>\n                  <SystemIcons.ArrowDropUp/>\n                </>\n              }\n            </StyledTableFooterCollapseButton>\n          }\n          {\n            !props.accordion &&\n            <StyledTableFooterContent>\n              { props.rows && props.rows.length > rowsPerPageOptions[0] && <DropdownButton\n                type={'text'}\n                items={rowsPerPageValues}\n                disabled={props.showLoadingIndicator}\n                value={[`${props.rowsPerPage}`]}\n                onClick={(value) => props.onRowsPerPageChange(+value[0])}\n                label={dropDownText}\n                keepLabel={true}\n              />}\n              <StyledTableFooterCurrentInfo>\n                {props.total === 0 ? 0 : props.from}-{props.to} of {props.total}\n              </StyledTableFooterCurrentInfo>\n              <StyledTableFooterControls>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.prevPage()}\n                            disabled={props.from === 1 || props.showLoadingIndicator}>\n                  <ChevronLeft size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.nextPage()}\n                            disabled={props.to === props.total || props.showLoadingIndicator}>\n                  <ChevronRight size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n              </StyledTableFooterControls>\n            </StyledTableFooterContent>\n          }\n    </StyledTableFooter>\n  );\n};\n\n\nexport default TableFooter;\n"],"file":"TableFooter.cjs"}

package/dist/Table/TableFooter.js

@@ -14,15 +14,12 @@ import { Fragment as _Fragment } from "react/jsx-runtime";
 var TableFooter = function TableFooter(props) {
   var _props$rowsPerPageLab, _props$showMoreLabel, _props$showFewerLabel;
 
-  var rowsPerPageValues = [{
-    value: '10'
-  }, {
-    value: '20'
-  }, {
-    value: '50'
-  }, {
-    value: '100'
-  }];
+  var rowsPerPageOptions = [10, 20, 50, 100];
+  var rowsPerPageValues = rowsPerPageOptions.map(function (x) {
+    return {
+      value: "".concat(x)
+    };
+  });
   var dropDownText = "".concat((_props$rowsPerPageLab = props.rowsPerPageLabel) !== null && _props$rowsPerPageLab !== void 0 ? _props$rowsPerPageLab : 'Rows per page', " : ").concat(props.rowsPerPage);
   return /*#__PURE__*/_jsxs(StyledTableFooter, {
     "data-testid": "TestTableFooterRow",
@@ -42,7 +39,7 @@ var TableFooter = function TableFooter(props) {
         }), /*#__PURE__*/_jsx(SystemIcons.ArrowDropUp, {})]
       })]
     }), !props.accordion && /*#__PURE__*/_jsxs(StyledTableFooterContent, {
-      children: [/*#__PURE__*/_jsx(DropdownButton, {
+      children: [props.rows && props.rows.length > rowsPerPageOptions[0] && /*#__PURE__*/_jsx(DropdownButton, {
         type: 'text',
         items: rowsPerPageValues,
         disabled: props.showLoadingIndicator,

package/dist/Table/TableFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Table/TableFooter.tsx"],"names":["React","DropdownButton","IconButton","ChevronLeft","ChevronRight","COLORS","StyledTableFooter","StyledTableFooterCollapseButton","StyledTableFooterContent","StyledTableFooterControls","StyledTableFooterCurrentInfo","SystemIcons","defaultOnMouseDownHandler","TableFooter","props","rowsPerPageValues","value","dropDownText","rowsPerPageLabel","rowsPerPage","accordion","setIsCollapsed","isCollapsed","rows","length","showMoreLabel","showFewerLabel","showLoadingIndicator","onRowsPerPageChange","total","from","to","prevPage","neutral_600","nextPage"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {TableProps} from './TableTypes';\nimport {DropdownButton, DropdownItem} from '../Dropdown';\nimport {IconButton} from '../Button';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {COLORS} from '../styles';\nimport {\n  StyledTableFooter, StyledTableFooterCollapseButton,\n  StyledTableFooterContent,\n  StyledTableFooterControls,\n  StyledTableFooterCurrentInfo\n} from './TableStyles';\nimport {SystemIcons} from '../icons';\nimport {defaultOnMouseDownHandler} from '../common';\n\n\ninterface TableFooterProps extends TableProps {\n  onRowsPerPageChange: (value: number) => void;\n  rowsPerPage: number;\n  from?: number;\n  to?: number;\n  total?: number;\n  nextPage: () => void;\n  prevPage: () => void;\n  setIsCollapsed: (isCollapsed: boolean) => void;\n  isCollapsed: boolean;\n}\n\nconst TableFooter: React.FunctionComponent<TableFooterProps> = (props) => {\n  const rowsPerPageValues: DropdownItem[] = [{value: '10'}, {value: '20'}, {value: '50'}, {value: '100'}];\n\n  const dropDownText = `${props.rowsPerPageLabel ?? 'Rows per page'} : ${props.rowsPerPage}`;\n\n  return (\n    <StyledTableFooter data-testid=\"TestTableFooterRow\">\n          {\n            props.accordion &&\n            <StyledTableFooterCollapseButton onClick={() => props.setIsCollapsed(!props.isCollapsed)}\n                                             onMouseDown={defaultOnMouseDownHandler}\n                                             disabled={props.isCollapsed && props.rows.length <= props.rowsPerPage}>\n              {\n                props.isCollapsed &&\n                <>\n                  <span>{props.showMoreLabel ?? 'Show more'} ({props.rows.length - props.rowsPerPage})</span>\n                  <SystemIcons.ArrowDropDown/>\n                </>\n              }\n              {\n                !props.isCollapsed &&\n                <>\n                  <span>{props.showFewerLabel ?? 'Show fewer'}</span>\n                  <SystemIcons.ArrowDropUp/>\n                </>\n              }\n            </StyledTableFooterCollapseButton>\n          }\n          {\n            !props.accordion &&\n            <StyledTableFooterContent>\n              <DropdownButton\n                type={'text'}\n                items={rowsPerPageValues}\n                disabled={props.showLoadingIndicator}\n                value={[`${props.rowsPerPage}`]}\n                onClick={(value) => props.onRowsPerPageChange(+value[0])}\n                label={dropDownText}\n                keepLabel={true}\n              />\n              <StyledTableFooterCurrentInfo>\n                {props.total === 0 ? 0 : props.from}-{props.to} of {props.total}\n              </StyledTableFooterCurrentInfo>\n              <StyledTableFooterControls>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.prevPage()}\n                            disabled={props.from === 1 || props.showLoadingIndicator}>\n                  <ChevronLeft size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.nextPage()}\n                            disabled={props.to === props.total || props.showLoadingIndicator}>\n                  <ChevronRight size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n              </StyledTableFooterControls>\n            </StyledTableFooterContent>\n          }\n    </StyledTableFooter>\n  );\n};\n\n\nexport default TableFooter;\n"],"file":"TableFooter.js"}
+{"version":3,"sources":["../../src/Table/TableFooter.tsx"],"names":["React","DropdownButton","IconButton","ChevronLeft","ChevronRight","COLORS","StyledTableFooter","StyledTableFooterCollapseButton","StyledTableFooterContent","StyledTableFooterControls","StyledTableFooterCurrentInfo","SystemIcons","defaultOnMouseDownHandler","TableFooter","props","rowsPerPageOptions","rowsPerPageValues","map","x","value","dropDownText","rowsPerPageLabel","rowsPerPage","accordion","setIsCollapsed","isCollapsed","rows","length","showMoreLabel","showFewerLabel","showLoadingIndicator","onRowsPerPageChange","total","from","to","prevPage","neutral_600","nextPage"],"mappings":"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","sourcesContent":["import React from 'react';\nimport {TableProps} from './TableTypes';\nimport {DropdownButton, DropdownItem} from '../Dropdown';\nimport {IconButton} from '../Button';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {COLORS} from '../styles';\nimport {\n  StyledTableFooter, StyledTableFooterCollapseButton,\n  StyledTableFooterContent,\n  StyledTableFooterControls,\n  StyledTableFooterCurrentInfo\n} from './TableStyles';\nimport {SystemIcons} from '../icons';\nimport {defaultOnMouseDownHandler} from '../common';\n\n\ninterface TableFooterProps extends TableProps {\n  onRowsPerPageChange: (value: number) => void;\n  rowsPerPage: number;\n  from?: number;\n  to?: number;\n  total?: number;\n  nextPage: () => void;\n  prevPage: () => void;\n  setIsCollapsed: (isCollapsed: boolean) => void;\n  isCollapsed: boolean;\n}\n\nconst TableFooter: React.FunctionComponent<TableFooterProps> = (props) => {\n  const rowsPerPageOptions = [10, 20, 50, 100];\n  const rowsPerPageValues: DropdownItem[] = rowsPerPageOptions.map(x => { return {value: `${x}`}});\n\n  const dropDownText = `${props.rowsPerPageLabel ?? 'Rows per page'} : ${props.rowsPerPage}`;\n\n  return (\n    <StyledTableFooter data-testid=\"TestTableFooterRow\">\n          {\n            props.accordion &&\n            <StyledTableFooterCollapseButton onClick={() => props.setIsCollapsed(!props.isCollapsed)}\n                                             onMouseDown={defaultOnMouseDownHandler}\n                                             disabled={props.isCollapsed && props.rows.length <= props.rowsPerPage}>\n              {\n                props.isCollapsed &&\n                <>\n                  <span>{props.showMoreLabel ?? 'Show more'} ({props.rows.length - props.rowsPerPage})</span>\n                  <SystemIcons.ArrowDropDown/>\n                </>\n              }\n              {\n                !props.isCollapsed &&\n                <>\n                  <span>{props.showFewerLabel ?? 'Show fewer'}</span>\n                  <SystemIcons.ArrowDropUp/>\n                </>\n              }\n            </StyledTableFooterCollapseButton>\n          }\n          {\n            !props.accordion &&\n            <StyledTableFooterContent>\n              { props.rows && props.rows.length > rowsPerPageOptions[0] && <DropdownButton\n                type={'text'}\n                items={rowsPerPageValues}\n                disabled={props.showLoadingIndicator}\n                value={[`${props.rowsPerPage}`]}\n                onClick={(value) => props.onRowsPerPageChange(+value[0])}\n                label={dropDownText}\n                keepLabel={true}\n              />}\n              <StyledTableFooterCurrentInfo>\n                {props.total === 0 ? 0 : props.from}-{props.to} of {props.total}\n              </StyledTableFooterCurrentInfo>\n              <StyledTableFooterControls>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.prevPage()}\n                            disabled={props.from === 1 || props.showLoadingIndicator}>\n                  <ChevronLeft size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n                <IconButton variant=\"secondary\" shape=\"circular\" action={() => props.nextPage()}\n                            disabled={props.to === props.total || props.showLoadingIndicator}>\n                  <ChevronRight size=\"24\" color={COLORS.neutral_600}/>\n                </IconButton>\n              </StyledTableFooterControls>\n            </StyledTableFooterContent>\n          }\n    </StyledTableFooter>\n  );\n};\n\n\nexport default TableFooter;\n"],"file":"TableFooter.js"}

package/package.json

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