@laerdal/life-react-components 1.3.2-dev.1.full → 1.3.2-dev.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (139) hide show
  1. package/dist/esm/Accordion/ContentAccordion.js +238 -0
  2. package/dist/esm/Accordion/ContentAccordion.js.map +1 -0
  3. package/dist/esm/Accordion/__tests__/ContetnAccordion.test.js +137 -0
  4. package/dist/esm/Accordion/__tests__/ContetnAccordion.test.js.map +1 -0
  5. package/dist/esm/Accordion/index.js +1 -0
  6. package/dist/esm/Accordion/index.js.map +1 -1
  7. package/dist/esm/AuthPage/AuthPage.js +1 -1
  8. package/dist/esm/AuthPage/AuthPage.js.map +1 -1
  9. package/dist/esm/AuthPage/Information.js +1 -1
  10. package/dist/esm/AuthPage/Information.js.map +1 -1
  11. package/dist/esm/Banners/Banner.js +16 -16
  12. package/dist/esm/Banners/Banner.js.map +1 -1
  13. package/dist/esm/Button/Iconbutton.js +0 -1
  14. package/dist/esm/Button/Iconbutton.js.map +1 -1
  15. package/dist/esm/Dropdown/ChipDropdownInput.js +2 -2
  16. package/dist/esm/Dropdown/ChipDropdownInput.js.map +1 -1
  17. package/dist/esm/Dropdown/CommonStyling.js +4 -0
  18. package/dist/esm/Dropdown/CommonStyling.js.map +1 -1
  19. package/dist/esm/Dropdown/DropdownButton.js +5 -2
  20. package/dist/esm/Dropdown/DropdownButton.js.map +1 -1
  21. package/dist/esm/Dropdown/DropdownFilter.js.map +1 -1
  22. package/dist/esm/HyperLink/HyperLink.js +2 -1
  23. package/dist/esm/HyperLink/HyperLink.js.map +1 -1
  24. package/dist/esm/InputFields/Checkbox.js +23 -13
  25. package/dist/esm/InputFields/Checkbox.js.map +1 -1
  26. package/dist/esm/Table/Table.js +113 -181
  27. package/dist/esm/Table/Table.js.map +1 -1
  28. package/dist/esm/Table/TableBody.js +135 -0
  29. package/dist/esm/Table/TableBody.js.map +1 -0
  30. package/dist/esm/Table/TableFooter.js +60 -0
  31. package/dist/esm/Table/TableFooter.js.map +1 -0
  32. package/dist/esm/Table/TableHeaders.js +55 -0
  33. package/dist/esm/Table/TableHeaders.js.map +1 -0
  34. package/dist/esm/Table/TableStyles.js +130 -117
  35. package/dist/esm/Table/TableStyles.js.map +1 -1
  36. package/dist/esm/Table/__tests__/Table.test.js +0 -21
  37. package/dist/esm/Table/__tests__/Table.test.js.map +1 -1
  38. package/dist/esm/Tabs/TabLink.js +1 -0
  39. package/dist/esm/Tabs/TabLink.js.map +1 -1
  40. package/dist/esm/styles/typography.js +66 -66
  41. package/dist/esm/styles/typography.js.map +1 -1
  42. package/dist/js/Accordion/ContentAccordion.d.ts +18 -0
  43. package/dist/js/Accordion/ContentAccordion.js +151 -0
  44. package/dist/js/Accordion/ContentAccordion.js.map +1 -0
  45. package/dist/js/Accordion/__tests__/ContetnAccordion.test.js +151 -0
  46. package/dist/js/Accordion/__tests__/ContetnAccordion.test.js.map +1 -0
  47. package/dist/js/Accordion/index.d.ts +1 -0
  48. package/dist/js/Accordion/index.js +8 -0
  49. package/dist/js/Accordion/index.js.map +1 -1
  50. package/dist/js/AuthPage/AuthPage.js +1 -1
  51. package/dist/js/AuthPage/AuthPage.js.map +1 -1
  52. package/dist/js/AuthPage/Information.d.ts +1 -1
  53. package/dist/js/AuthPage/Information.js +1 -1
  54. package/dist/js/AuthPage/Information.js.map +1 -1
  55. package/dist/js/Banners/Banner.js +16 -19
  56. package/dist/js/Banners/Banner.js.map +1 -1
  57. package/dist/js/Button/Iconbutton.d.ts +2 -2
  58. package/dist/js/Button/Iconbutton.js +0 -1
  59. package/dist/js/Button/Iconbutton.js.map +1 -1
  60. package/dist/js/Dropdown/ChipDropdownInput.js +3 -1
  61. package/dist/js/Dropdown/ChipDropdownInput.js.map +1 -1
  62. package/dist/js/Dropdown/CommonStyling.js +1 -1
  63. package/dist/js/Dropdown/CommonStyling.js.map +1 -1
  64. package/dist/js/Dropdown/DropdownButton.d.ts +1 -1
  65. package/dist/js/Dropdown/DropdownButton.js +5 -2
  66. package/dist/js/Dropdown/DropdownButton.js.map +1 -1
  67. package/dist/js/Dropdown/DropdownButtonTypes.d.ts +1 -0
  68. package/dist/js/Dropdown/DropdownFilter.d.ts +1 -1
  69. package/dist/js/Dropdown/DropdownFilter.js.map +1 -1
  70. package/dist/js/HyperLink/HyperLink.d.ts +1 -1
  71. package/dist/js/HyperLink/HyperLink.js +2 -2
  72. package/dist/js/HyperLink/HyperLink.js.map +1 -1
  73. package/dist/js/InputFields/Checkbox.d.ts +3 -2
  74. package/dist/js/InputFields/Checkbox.js +13 -11
  75. package/dist/js/InputFields/Checkbox.js.map +1 -1
  76. package/dist/js/Table/Table.js +143 -209
  77. package/dist/js/Table/Table.js.map +1 -1
  78. package/dist/js/Table/TableBody.d.ts +9 -0
  79. package/dist/js/Table/TableBody.js +167 -0
  80. package/dist/js/Table/TableBody.js.map +1 -0
  81. package/dist/js/Table/TableFooter.d.ts +13 -0
  82. package/dist/js/Table/TableFooter.js +82 -0
  83. package/dist/js/Table/TableFooter.js.map +1 -0
  84. package/dist/js/Table/TableHeaders.d.ts +9 -0
  85. package/dist/js/Table/TableHeaders.js +77 -0
  86. package/dist/js/Table/TableHeaders.js.map +1 -0
  87. package/dist/js/Table/TableStyles.d.ts +17 -7
  88. package/dist/js/Table/TableStyles.js +58 -16
  89. package/dist/js/Table/TableStyles.js.map +1 -1
  90. package/dist/js/Table/TableTypes.d.ts +23 -16
  91. package/dist/js/Table/__tests__/Table.test.js +8 -30
  92. package/dist/js/Table/__tests__/Table.test.js.map +1 -1
  93. package/dist/js/Tabs/TabLink.js +1 -1
  94. package/dist/js/Tabs/TabLink.js.map +1 -1
  95. package/dist/js/styles/typography.d.ts +6 -6
  96. package/dist/js/styles/typography.js +66 -66
  97. package/dist/js/styles/typography.js.map +1 -1
  98. package/dist/umd/Accordion/ContentAccordion.js +266 -0
  99. package/dist/umd/Accordion/ContentAccordion.js.map +1 -0
  100. package/dist/umd/Accordion/__tests__/ContetnAccordion.test.js +165 -0
  101. package/dist/umd/Accordion/__tests__/ContetnAccordion.test.js.map +1 -0
  102. package/dist/umd/Accordion/index.js +10 -4
  103. package/dist/umd/Accordion/index.js.map +1 -1
  104. package/dist/umd/AuthPage/AuthPage.js +1 -1
  105. package/dist/umd/AuthPage/AuthPage.js.map +1 -1
  106. package/dist/umd/AuthPage/Information.js +1 -1
  107. package/dist/umd/AuthPage/Information.js.map +1 -1
  108. package/dist/umd/Banners/Banner.js +16 -16
  109. package/dist/umd/Banners/Banner.js.map +1 -1
  110. package/dist/umd/Button/Iconbutton.js +0 -1
  111. package/dist/umd/Button/Iconbutton.js.map +1 -1
  112. package/dist/umd/Dropdown/ChipDropdownInput.js +2 -2
  113. package/dist/umd/Dropdown/ChipDropdownInput.js.map +1 -1
  114. package/dist/umd/Dropdown/CommonStyling.js +4 -0
  115. package/dist/umd/Dropdown/CommonStyling.js.map +1 -1
  116. package/dist/umd/Dropdown/DropdownButton.js +5 -2
  117. package/dist/umd/Dropdown/DropdownButton.js.map +1 -1
  118. package/dist/umd/Dropdown/DropdownFilter.js.map +1 -1
  119. package/dist/umd/HyperLink/HyperLink.js +2 -1
  120. package/dist/umd/HyperLink/HyperLink.js.map +1 -1
  121. package/dist/umd/InputFields/Checkbox.js +23 -13
  122. package/dist/umd/InputFields/Checkbox.js.map +1 -1
  123. package/dist/umd/Table/Table.js +139 -188
  124. package/dist/umd/Table/Table.js.map +1 -1
  125. package/dist/umd/Table/TableBody.js +270 -0
  126. package/dist/umd/Table/TableBody.js.map +1 -0
  127. package/dist/umd/Table/TableFooter.js +82 -0
  128. package/dist/umd/Table/TableFooter.js.map +1 -0
  129. package/dist/umd/Table/TableHeaders.js +91 -0
  130. package/dist/umd/Table/TableHeaders.js.map +1 -0
  131. package/dist/umd/Table/TableStyles.js +134 -122
  132. package/dist/umd/Table/TableStyles.js.map +1 -1
  133. package/dist/umd/Table/__tests__/Table.test.js +0 -21
  134. package/dist/umd/Table/__tests__/Table.test.js.map +1 -1
  135. package/dist/umd/Tabs/TabLink.js +1 -0
  136. package/dist/umd/Tabs/TabLink.js.map +1 -1
  137. package/dist/umd/styles/typography.js +66 -66
  138. package/dist/umd/styles/typography.js.map +1 -1
  139. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Table/TableStyles.ts"],"names":["styled","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","TableWrapper","div","TableLoadingIndicator","TableContainer","table","neutral_200","TableHeaderRowCol","th","neutral_20","Bold","neutral_600","TableColumnHeaderCol","white","neutral_300","primary_20","primary_100","TableDataRow","tr","neutral_100","primary_200","TableDataCol","td","Regular","black","primary_600","primary_700","focus_25","focus","TableFooterCol"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,MAAP,MAAmB,mBAAnB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,iBAAT,EAA+CC,iBAA/C,EAAkEC,kBAAlE,EAAsFC,kBAAtF,QAAgH,sBAAhH;AAEA;AACA;AACA;;AAEA,OAAO,MAAMC,YAAY,GAAGN,MAAM,CAACO,GAAI;AACvC;AACA,CAFO;AAIP,OAAO,MAAMC,qBAAqB,GAAGR,MAAM,CAACO,GAAI;AAChD;AACA;AACA;AACA;AACA;AACA,CANO;AAQP,OAAO,MAAME,cAAc,GAAGT,MAAM,CAACU,KAAM;AAC3C;AACA;AACA,0BAA0BT,MAAM,CAACU,WAAY;AAC7C,6BAA6BV,MAAM,CAACU,WAAY;AAChD,CALO;AAOP,OAAO,MAAMC,iBAAiB,GAAGZ,MAAM,CAACa,EAAG;AAC3C,sBAAsBZ,MAAM,CAACa,UAAW;AACxC,6BAA6Bb,MAAM,CAACU,WAAY;AAChD;AACA,IAAIT,iBAAiB,CAACE,kBAAkB,CAACW,IAApB,EAA0Bd,MAAM,CAACe,WAAjC,CAA8C;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAhBO;AAkBP,OAAO,MAAMC,oBAAoB,GAAGjB,MAAM,CAACa,EAAG;AAC9C,sBAAsBZ,MAAM,CAACiB,KAAM;AACnC,0BAA0BjB,MAAM,CAACkB,WAAY;AAC7C;AACA,IAAIhB,iBAAiB,CAACC,kBAAkB,CAACW,IAApB,EAA0Bd,MAAM,CAACe,WAAjC,CAA8C;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoBf,MAAM,CAACmB,UAAW;AACtC;AACA;AACA;AACA,oBAAoBnB,MAAM,CAACoB,WAAY;AACvC;AACA;AACA,CAvCO;AAyCP,OAAO,MAAMC,YAAY,GAAGtB,MAAM,CAACuB,EAAG;AACtC,sBAAsBtB,MAAM,CAACuB,WAAY;AACzC;AACA;AACA,wBAAwBvB,MAAM,CAACa,UAAW;AAC1C;AACA;AACA;AACA;AACA,wBAAwBb,MAAM,CAACwB,WAAY;AAC3C;AACA;AACA;AACA;AACA,wBAAwBxB,MAAM,CAACuB,WAAY;AAC3C;AACA,CAhBO;AAkBP,OAAO,MAAME,YAAY,GAAG1B,MAAM,CAAC2B,EAAG;AACtC;AACA;AACA,IAAIxB,iBAAiB,CAACC,kBAAkB,CAACwB,OAApB,EAA6B3B,MAAM,CAAC4B,KAApC,CAA2C;AAChE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAa5B,MAAM,CAAC6B,WAAY;AAChC;AACA;AACA;AACA,eAAe7B,MAAM,CAAC8B,WAAY;AAClC;AACA;AACA;AACA;AACA;AACA;AACA,iCAAiC9B,MAAM,CAAC+B,QAAS,iBAAgB/B,MAAM,CAACgC,KAAM;AAC9E,eAAehC,MAAM,CAAC8B,WAAY;AAClC;AACA;AACA;AACA;AACA;AACA;AACA,CA7CO;AA+CP,OAAO,MAAMG,cAAc,GAAGlC,MAAM,CAAC2B,EAAG;AACxC,0BAA0B1B,MAAM,CAACU,WAAY;AAC7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQN,kBAAkB,CAACD,kBAAkB,CAACwB,OAApB,EAA6B3B,MAAM,CAAC4B,KAApC,CAA2C;AACrE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,QAAQ1B,iBAAiB,CAACC,kBAAkB,CAACwB,OAApB,EAA6B3B,MAAM,CAAC4B,KAApC,CAA2C;AACpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CA/BO","sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport { COLORS } from '../styles';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle, ComponentXSStyling } from '../styles/typography';\n\n/**\n * Table styles\n */\n\nexport const TableWrapper = styled.div`\n position: relative;\n`;\n\nexport const TableLoadingIndicator = styled.div`\n height: 100%;\n width: 100%;\n position: absolute;\n background-color: rgba(0, 0, 0, 0.5);\n top: 0;\n`;\n\nexport const TableContainer = styled.table`\n background: transparent;\n width: 100%;\n border-top: 2px solid ${COLORS.neutral_200};\n border-bottom: 2px solid ${COLORS.neutral_200};\n`;\n\nexport const TableHeaderRowCol = styled.th`\n background-color: ${COLORS.neutral_20};\n border-bottom: 1px solid ${COLORS.neutral_200};\n\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n padding: 16px 19px 16px 16px;\n\n div {\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n svg {\n cursor: pointer;\n }\n }\n`;\n\nexport const TableColumnHeaderCol = styled.th`\n background-color: ${COLORS.white};\n border-top: 1px solid ${COLORS.neutral_300};\n\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n padding: 18px 16px;\n text-align: left;\n\n &.justify-center {\n text-align: center;\n }\n\n &.justify-left {\n text-align: left;\n }\n\n &.justify-right {\n text-align: right;\n }\n\n &.no-border {\n border: none;\n }\n\n &.sortable {\n cursor: pointer;\n\n > svg {\n float: right;\n }\n\n &:hover {\n background: ${COLORS.primary_20};\n }\n\n &:focus {\n background: ${COLORS.primary_100};\n }\n }\n`;\n\nexport const TableDataRow = styled.tr`\n background-color: ${COLORS.neutral_100};\n\n &:nth-child(2n) {\n background-color: ${COLORS.neutral_20};\n }\n\n &:hover {\n cursor: pointer;\n background-color: ${COLORS.primary_200};\n }\n\n &.no-rows:hover {\n cursor: default;\n background-color: ${COLORS.neutral_100};\n }\n`;\n\nexport const TableDataCol = styled.td`\n background: transparent;\n\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n padding: 15px 16px;\n border: none;\n\n &.truncate-text {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &.justify-center {\n text-align: center;\n }\n\n &.justify-left {\n text-align: left;\n }\n\n &.justify-right {\n text-align: right;\n }\n\n button {\n color: ${COLORS.primary_600};\n text-decoration: none;\n\n &:hover {\n color: ${COLORS.primary_700};\n text-decoration: underline;\n }\n\n &:focus {\n text-decoration: underline;\n outline: none;\n box-shadow: 0px 4px 12px ${COLORS.focus_25}, 0px 0px 8px ${COLORS.focus} !important;\n color: ${COLORS.primary_700};\n }\n }\n\n &.center {\n text-align: center;\n }\n`;\n\nexport const TableFooterCol = styled.td`\n border-top: 1px solid ${COLORS.neutral_200};\n padding: 3.5px 20px 3.5px 16px;\n\n > div {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n\n > div > div:first-of-type {\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black)}\n display: block;\n padding-top: 11px;\n padding-left: 2px;\n padding-right: 30px;\n }\n\n span {\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n &.current-page-info {\n margin-right: 34px;\n margin-left: 39px;\n }\n }\n\n .controls {\n display: flex;\n justify-content: space-between;\n }\n }\n`;\n"],"file":"TableStyles.js"}
1
+ {"version":3,"sources":["../../../src/Table/TableStyles.ts"],"names":["styled","COLORS","ComponentLStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","TableWrapper","div","StyledTable","table","StyledTableHeader","thead","StyledTableHeaderTitle","tr","StyledTableHeaderTitleContent","neutral_200","Bold","black","StyledTableHeaderColumns","StyledTableHeaderColumnContent","StyledTableHeaderColumn","th","neutral_600","white","primary_20","primary_700","hover","primary_100","primary_800","active","focus_25","focus","StyledTableBodyRow","primary_200","StyledTableBody","tbody","neutral_100","StyledTableCell","td","StyledTableCellContent","Regular","StyledTableCellIcon","neutral_700","StyledTableFooter","tfoot","StyledTableFooterContent","StyledTableFooterCurrentInfo","span","StyledTableFooterControls","StyledTableSpinner"],"mappings":"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","sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport {COLORS} from '../styles';\nimport {\n ComponentLStyling,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling\n} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\n\n/**\n * Table styles\n */\n\nexport const TableWrapper = styled.div`\n position: relative;\n`;\n\n\nexport const StyledTable = styled.table`\n background: transparent;\n width: 100%;\n`;\n\nexport const StyledTableHeader = styled.thead`\n`;\n\nexport const StyledTableHeaderTitle = styled.tr`\n`;\n\nexport const StyledTableHeaderTitleContent = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n box-sizing: border-box;\n min-height: 56px;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 2px solid ${COLORS.neutral_200};\n padding: 0 16px;\n\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.black)}\n .title-menu {\n margin-right: -16px;\n }\n`;\n\nexport const StyledTableHeaderColumns = styled.tr`\n`;\n\nexport const StyledTableHeaderColumnContent = styled.div`\n box-sizing: border-box;\n min-height: 56px;\n padding: 0 16px;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-top: 1px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n`;\n\nexport const StyledTableHeaderColumn = styled.th`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n position: relative;\n\n background-color: ${COLORS.white};\n\n //fixes header heights no idea why\n height: 1px;\n\n &.sortable {\n cursor: pointer;\n\n &:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:active {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n box-shadow: none !important;\n z-index: ${Z_INDEXES.active};\n }\n\n &:focus {\n outline: none;\n box-shadow: 0 4px 12px ${COLORS.focus_25}, 0 0 8px ${COLORS.focus};\n z-index: ${Z_INDEXES.focus};\n }\n }\n\n &.sortable ${StyledTableHeaderColumnContent} > svg {\n opacity: 0;\n }\n\n &.sortable.sorted ${StyledTableHeaderColumnContent} > svg {\n opacity: 1;\n }\n\n`;\n\nexport const StyledTableBodyRow = styled.tr`\n cursor: pointer;\n position: relative;\n outline: none;\n\n &:hover {\n background-color: ${COLORS.primary_200};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:focus {\n background-color: ${COLORS.primary_200};\n box-shadow: 0px 4px 12px rgba(46, 127, 161, 0.25), 0px 0px 8px #2E7FA1;\n z-index: ${Z_INDEXES.focus};\n outline: none;\n }\n\n &:active {\n box-shadow: none;\n z-index: ${Z_INDEXES.active};\n }\n\n`;\n\nexport const StyledTableBody = styled.tbody`\n ${StyledTableBodyRow}:nth-child(odd):not(:hover):not(:focus):not(:active) {\n background-color: ${COLORS.neutral_100};\n }\n\n ${StyledTableBodyRow}:nth-child(even):not(:hover):not(:focus):not(:active) {\n background-color: ${COLORS.white};\n }\n`;\n\n\nexport const StyledTableCell = styled.td``;\n\nexport const StyledTableCellContent = styled.div`\n min-height: 48px;\n\n padding: 0 16px;\n ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n\n display: flex;\n align-items: center;\n gap: 8px;\n\n &.truncate-text,\n &.truncate-text span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &.left {\n justify-content: left;\n }\n\n &.right {\n justify-content: right;\n }\n\n &.center {\n justify-content: center;\n }\n`;\n\nexport const StyledTableCellIcon = styled.div`\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n\n svg {\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n }\n`;\n\n\nexport const StyledTableFooter = styled.tfoot`\n`;\n\nexport const StyledTableFooterContent = styled.div`\n border-top: 2px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n box-sizing: border-box;\n min-height: 56px;\n\n display: flex;\n align-items: center;\n justify-content: right;\n`;\n\nexport const StyledTableFooterCurrentInfo = styled.span`\n padding: 0 16px;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black)}\n`;\n\nexport const StyledTableFooterControls = styled.div`\n display: flex;\n`;\n\nexport const StyledTableSpinner = styled.div`\n height: 100%;\n width: 100%;\n position: absolute;\n background-color: rgba(0, 0, 0, 0.5);\n top: 0;\n`;\n"],"file":"TableStyles.js"}
@@ -212,27 +212,6 @@ describe('<Table />', () => {
212
212
  expect(getByTestId('TestTableColumnHeaderRow').children[0].classList.contains('no-border')).toBe(false);
213
213
  expect(getByTestId('TestTableColumnHeaderRow').children[1].classList.contains('no-border')).toBe(false);
214
214
  });
215
- it('Should render columns with no-border class in the column header row, in case title is not passed', () => {
216
- const columns = [{
217
- key: 'column1',
218
- name: 'Column 1'
219
- }, {
220
- key: 'column2',
221
- name: 'Column 2'
222
- }];
223
- const rows = [{
224
- column1: 'Test content',
225
- column2: 'Test content 2'
226
- }];
227
- const {
228
- getByTestId
229
- } = render( /*#__PURE__*/React.createElement(Table, {
230
- rows: rows,
231
- columns: columns
232
- }));
233
- expect(getByTestId('TestTableColumnHeaderRow').children[0].classList.contains('no-border')).toBe(true);
234
- expect(getByTestId('TestTableColumnHeaderRow').children[1].classList.contains('no-border')).toBe(true);
235
- });
236
215
  });
237
216
  describe('Table Body Row tests', () => {
238
217
  it('Should not render "No Data" row in case there are rows', () => {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/Table/__tests__/Table.test.tsx"],"names":["React","render","Table","describe","it","columns","key","name","rows","column1","column2","getByTestId","expect","toBeDefined","queryByTestId","not","toBeNull","tableHeaderRow","children","textContent","toContain","getElementsByTagName","length","toEqual","classList","contains","toBe"],"mappings":"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","sourcesContent":["import React from 'react';\n/**\n * Import React libraries.\n */\nimport { render } from '@testing-library/react';\n\n/**\n * Import custom components.\n */\nimport { Table } from '../index';\n\n/**\n * Import third-party libraries.\n */\nimport 'jest-styled-components';\n\n/**\n * Import custom types.\n */\nimport { TableColumn } from '../TableTypes';\n\ndescribe('<Table />', () => {\n it('Renders the Table', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} title=\"Test title\" />);\n expect(getByTestId('TestTable')).toBeDefined();\n });\n\n describe('Table Header Row Tests', () => {\n it('Should render table header row in case title is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} title=\"Test title\" />);\n expect(queryByTestId('TestTableHeaderRow')).not.toBeNull();\n });\n\n it('Should not render table header row in case title is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(queryByTestId('TestTableHeaderRow')).toBeNull();\n });\n\n describe('Table Header Row functional tests', () => {\n it('Should have title', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} title=\"Test Title\" />);\n const tableHeaderRow = queryByTestId('TestTableHeaderRow');\n expect(tableHeaderRow?.children[0].children[0].textContent).toContain('Test Title');\n });\n\n it('Should have options menu', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} title=\"Test Title\" />);\n expect(queryByTestId('TestTableHeaderRow')?.getElementsByTagName('svg')).not.toBeNull();\n });\n });\n });\n\n describe('Table Column Header Row Tests', () => {\n it('Should render column header row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableColumnHeaderRow')).not.toBeNull();\n });\n\n it('Should render two columns in the column header row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableColumnHeaderRow').children.length).toEqual(2);\n });\n\n it('Should render correct column names in the column header row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableColumnHeaderRow').children[0].textContent).toEqual('Column 1');\n expect(getByTestId('TestTableColumnHeaderRow').children[1].textContent).toEqual('Column 2');\n });\n\n it('Should render columns without no-border class in the column header row, in case title is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} title=\"test title\" />);\n expect(getByTestId('TestTableColumnHeaderRow').children[0].classList.contains('no-border')).toBe(false);\n expect(getByTestId('TestTableColumnHeaderRow').children[1].classList.contains('no-border')).toBe(false);\n });\n\n it('Should render columns with no-border class in the column header row, in case title is not passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableColumnHeaderRow').children[0].classList.contains('no-border')).toBe(true);\n expect(getByTestId('TestTableColumnHeaderRow').children[1].classList.contains('no-border')).toBe(true);\n });\n });\n\n describe('Table Body Row tests', () => {\n it('Should not render \"No Data\" row in case there are rows', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(queryByTestId('TestTableNoDataRow')).toBeNull();\n });\n\n it('Should render \"No Data\" row in case there are no rows', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(queryByTestId('TestTableNoDataRow')).not.toBeNull();\n expect(queryByTestId('TestTableNoDataRow')?.textContent).toEqual('There are no rows to display');\n });\n\n it('Should render a data row with correct content for each row that is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableDataRow')).toBeDefined();\n expect(getByTestId('TestTableDataRow').children.length).toEqual(2);\n expect(getByTestId('TestTableDataRow').children[0].textContent).toEqual('Test content');\n expect(getByTestId('TestTableDataRow').children[1].textContent).toEqual('Test content 2');\n });\n });\n\n it('Should render footer row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableFooterRow')).toBeDefined();\n });\n});\n"],"file":"Table.test.js"}
1
+ {"version":3,"sources":["../../../../src/Table/__tests__/Table.test.tsx"],"names":["React","render","Table","describe","it","columns","key","name","rows","column1","column2","getByTestId","expect","toBeDefined","queryByTestId","not","toBeNull","tableHeaderRow","children","textContent","toContain","getElementsByTagName","length","toEqual","classList","contains","toBe"],"mappings":"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","sourcesContent":["import React from 'react';\n/**\n * Import React libraries.\n */\nimport { render } from '@testing-library/react';\n\n/**\n * Import custom components.\n */\nimport { Table } from '../index';\n\n/**\n * Import third-party libraries.\n */\nimport 'jest-styled-components';\n\n/**\n * Import custom types.\n */\nimport { TableColumn } from '../TableTypes';\n\ndescribe('<Table />', () => {\n it('Renders the Table', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} title=\"Test title\" />);\n expect(getByTestId('TestTable')).toBeDefined();\n });\n\n describe('Table Header Row Tests', () => {\n it('Should render table header row in case title is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} title=\"Test title\" />);\n expect(queryByTestId('TestTableHeaderRow')).not.toBeNull();\n });\n\n it('Should not render table header row in case title is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(queryByTestId('TestTableHeaderRow')).toBeNull();\n });\n\n describe('Table Header Row functional tests', () => {\n it('Should have title', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} title=\"Test Title\" />);\n const tableHeaderRow = queryByTestId('TestTableHeaderRow');\n expect(tableHeaderRow?.children[0].children[0].textContent).toContain('Test Title');\n });\n\n it('Should have options menu', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} title=\"Test Title\" />);\n expect(queryByTestId('TestTableHeaderRow')?.getElementsByTagName('svg')).not.toBeNull();\n });\n });\n });\n\n describe('Table Column Header Row Tests', () => {\n it('Should render column header row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableColumnHeaderRow')).not.toBeNull();\n });\n\n it('Should render two columns in the column header row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableColumnHeaderRow').children.length).toEqual(2);\n });\n\n it('Should render correct column names in the column header row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableColumnHeaderRow').children[0].textContent).toEqual('Column 1');\n expect(getByTestId('TestTableColumnHeaderRow').children[1].textContent).toEqual('Column 2');\n });\n\n it('Should render columns without no-border class in the column header row, in case title is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} title=\"test title\" />);\n expect(getByTestId('TestTableColumnHeaderRow').children[0].classList.contains('no-border')).toBe(false);\n expect(getByTestId('TestTableColumnHeaderRow').children[1].classList.contains('no-border')).toBe(false);\n });\n\n });\n\n describe('Table Body Row tests', () => {\n it('Should not render \"No Data\" row in case there are rows', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(queryByTestId('TestTableNoDataRow')).toBeNull();\n });\n\n it('Should render \"No Data\" row in case there are no rows', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [];\n const { queryByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(queryByTestId('TestTableNoDataRow')).not.toBeNull();\n expect(queryByTestId('TestTableNoDataRow')?.textContent).toEqual('There are no rows to display');\n });\n\n it('Should render a data row with correct content for each row that is passed', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableDataRow')).toBeDefined();\n expect(getByTestId('TestTableDataRow').children.length).toEqual(2);\n expect(getByTestId('TestTableDataRow').children[0].textContent).toEqual('Test content');\n expect(getByTestId('TestTableDataRow').children[1].textContent).toEqual('Test content 2');\n });\n });\n\n it('Should render footer row', () => {\n const columns: TableColumn[] = [\n {\n key: 'column1',\n name: 'Column 1',\n },\n {\n key: 'column2',\n name: 'Column 2',\n },\n ];\n const rows: any[] = [\n {\n column1: 'Test content',\n column2: 'Test content 2',\n },\n ];\n const { getByTestId } = render(<Table rows={rows} columns={columns} />);\n expect(getByTestId('TestTableFooterRow')).toBeDefined();\n });\n});\n"],"file":"Table.test.js"}
@@ -122,6 +122,7 @@ const TopWrapper = styled.div`
122
122
  `;
123
123
  const TextContainer = styled.div`
124
124
  width: 100%;
125
+ margin: auto 0 auto 16px !important;
125
126
  `;
126
127
  const StyledNotification = styled.div`
127
128
  margin: 0 15px 0 0 !important;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/Tabs/TabLink.tsx"],"names":["React","NavLink","useLocation","styled","NotificationDot","Size","COLORS","Z_INDEXES","StyledTabLink","neutral_600","props","disabled","neutral_100","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","to","exact","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","testId","showNotificationDot","size","Small","variant","location","ref","useRef","toString","pathname","current","blur","undefined"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { NavLink, NavLinkProps, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { 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"}
1
+ {"version":3,"sources":["../../../src/Tabs/TabLink.tsx"],"names":["React","NavLink","useLocation","styled","NotificationDot","Size","COLORS","Z_INDEXES","StyledTabLink","neutral_600","props","disabled","neutral_100","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","to","exact","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","testId","showNotificationDot","size","Small","variant","location","ref","useRef","toString","pathname","current","blur","undefined"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { NavLink, NavLinkProps, useLocation } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { 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"}
@@ -7,22 +7,22 @@ const TYPOGRAPHY = {
7
7
  fontFamily: 'Lato, sans-serif'
8
8
  };
9
9
  const TypographyBase = styled('div')(({
10
- color,
10
+ $color,
11
11
  lineHeight,
12
- fontSize,
13
- fontWeight,
14
- fontStyle,
12
+ $fontSize,
13
+ $fontWeight,
14
+ $fontStyle,
15
15
  textTransform,
16
16
  textDecorationLine
17
17
  }) => ({
18
18
  fontFamily: TYPOGRAPHY.fontFamily,
19
- fontSize: fontSize,
20
- fontWeight: fontWeight,
19
+ fontSize: $fontSize,
20
+ fontWeight: $fontWeight,
21
21
  lineHeight: lineHeight + 'px',
22
22
  textTransform: textTransform ? textTransform : 'none',
23
23
  textDecorationLine: textDecorationLine ? textDecorationLine : 'none',
24
- fontStyle: fontStyle ? fontStyle : 'normal',
25
- color: color ? color : COLORS.black
24
+ fontStyle: $fontStyle ? $fontStyle : 'normal',
25
+ color: $color ? $color : COLORS.black
26
26
  }));
27
27
 
28
28
  const HeadlineBaseStyling = (fontSize, lineHeight, color) => {
@@ -36,74 +36,74 @@ const HeadlineBaseStyling = (fontSize, lineHeight, color) => {
36
36
  };
37
37
 
38
38
  const HeadlineBase = styled(TypographyBase)(({
39
- color,
39
+ $color,
40
40
  lineHeight,
41
41
  fontSize
42
42
  }) => ({
43
43
  fontSize: fontSize,
44
44
  fontWeight: 700,
45
45
  lineHeight: lineHeight,
46
- color: color
46
+ color: $color
47
47
  }));
48
48
 
49
49
  const HeadlineXLStyling = color => HeadlineBaseStyling('48px', '64px', color);
50
50
 
51
51
  const HeadlineXL = styled(HeadlineBase)(({
52
- color
52
+ $color
53
53
  }) => ({
54
54
  fontSize: '48px',
55
55
  lineHeight: '64px',
56
- color: color
56
+ color: $color
57
57
  }));
58
58
 
59
59
  const HeadlineLStyling = color => HeadlineBaseStyling('40px', '52px', color);
60
60
 
61
61
  const HeadlineL = styled(HeadlineBase)(({
62
- color
62
+ $color
63
63
  }) => ({
64
64
  fontSize: '40px',
65
65
  lineHeight: '52px',
66
- color: color
66
+ color: $color
67
67
  }));
68
68
 
69
69
  const HeadlineMStyling = color => HeadlineBaseStyling('32px', '40px', color);
70
70
 
71
71
  const HeadlineM = styled(HeadlineBase)(({
72
- color
72
+ $color
73
73
  }) => ({
74
74
  fontSize: '32px',
75
75
  lineHeight: '40px',
76
- color: color
76
+ color: $color
77
77
  }));
78
78
 
79
79
  const HeadlineSStyling = color => HeadlineBaseStyling('28px', '36px', color);
80
80
 
81
81
  const HeadlineS = styled(HeadlineBase)(({
82
- color
82
+ $color
83
83
  }) => ({
84
84
  fontSize: '28px',
85
85
  lineHeight: '36px',
86
- color: color
86
+ color: $color
87
87
  }));
88
88
 
89
89
  const HeadlineXSStyling = color => HeadlineBaseStyling('24px', '32px', color);
90
90
 
91
91
  const HeadlineXS = styled(HeadlineBase)(({
92
- color
92
+ $color
93
93
  }) => ({
94
94
  fontSize: '24px',
95
95
  lineHeight: '32px',
96
- color: color
96
+ color: $color
97
97
  }));
98
98
 
99
99
  const HeadlineXXSStyling = color => HeadlineBaseStyling('20px', '24px', color);
100
100
 
101
101
  const HeadlineXXS = styled(HeadlineBase)(({
102
- color
102
+ $color
103
103
  }) => ({
104
104
  fontSize: '20px',
105
105
  lineHeight: '24px',
106
- color: color
106
+ color: $color
107
107
  }));
108
108
  const ParagraphStyling = css`
109
109
  :lang(ja-jp) > h1,
@@ -200,11 +200,11 @@ const ParagraphXL = ({
200
200
  let fontStyle = paragraphFontStyle(textStyle);
201
201
  let textDecorationLine = paragraphTextDecorationLine(textStyle);
202
202
  return /*#__PURE__*/React.createElement(ParagraphBase, {
203
- color: color,
203
+ $color: color,
204
204
  lineHeight: 36,
205
- fontSize: 24,
206
- fontWeight: fontWeight,
207
- fontStyle: fontStyle,
205
+ $fontSize: 24,
206
+ $fontWeight: fontWeight,
207
+ $fontStyle: fontStyle,
208
208
  textDecorationLine: textDecorationLine,
209
209
  marginBetweenParagraphs: "18px"
210
210
  }, children);
@@ -226,11 +226,11 @@ const ParagraphL = ({
226
226
  let fontStyle = paragraphFontStyle(textStyle);
227
227
  let textDecorationLine = paragraphTextDecorationLine(textStyle);
228
228
  return /*#__PURE__*/React.createElement(ParagraphBase, {
229
- color: color,
229
+ $color: color,
230
230
  lineHeight: 32,
231
- fontSize: 20,
232
- fontWeight: fontWeight,
233
- fontStyle: fontStyle,
231
+ $fontSize: 20,
232
+ $fontWeight: fontWeight,
233
+ $fontStyle: fontStyle,
234
234
  textDecorationLine: textDecorationLine,
235
235
  marginBetweenParagraphs: "16px"
236
236
  }, children);
@@ -252,11 +252,11 @@ const ParagraphM = ({
252
252
  let fontStyle = paragraphFontStyle(textStyle);
253
253
  let textDecorationLine = paragraphTextDecorationLine(textStyle);
254
254
  return /*#__PURE__*/React.createElement(ParagraphBase, {
255
- color: color,
255
+ $color: color,
256
256
  lineHeight: 28,
257
- fontSize: 18,
258
- fontWeight: fontWeight,
259
- fontStyle: fontStyle,
257
+ $fontSize: 18,
258
+ $fontWeight: fontWeight,
259
+ $fontStyle: fontStyle,
260
260
  textDecorationLine: textDecorationLine,
261
261
  marginBetweenParagraphs: "14px"
262
262
  }, children);
@@ -278,11 +278,11 @@ const ParagraphS = ({
278
278
  let fontStyle = paragraphFontStyle(textStyle);
279
279
  let textDecorationLine = paragraphTextDecorationLine(textStyle);
280
280
  return /*#__PURE__*/React.createElement(ParagraphBase, {
281
- color: color,
281
+ $color: color,
282
282
  lineHeight: 24,
283
- fontSize: 16,
284
- fontWeight: fontWeight,
285
- fontStyle: fontStyle,
283
+ $fontSize: 16,
284
+ $fontWeight: fontWeight,
285
+ $fontStyle: fontStyle,
286
286
  textDecorationLine: textDecorationLine,
287
287
  marginBetweenParagraphs: "12px"
288
288
  }, children);
@@ -304,11 +304,11 @@ const ParagraphXS = ({
304
304
  let fontStyle = paragraphFontStyle(textStyle);
305
305
  let textDecorationLine = paragraphTextDecorationLine(textStyle);
306
306
  return /*#__PURE__*/React.createElement(ParagraphBase, {
307
- color: color,
307
+ $color: color,
308
308
  lineHeight: 20,
309
- fontSize: 14,
310
- fontWeight: fontWeight,
311
- fontStyle: fontStyle,
309
+ $fontSize: 14,
310
+ $fontWeight: fontWeight,
311
+ $fontStyle: fontStyle,
312
312
  textDecorationLine: textDecorationLine,
313
313
  marginBetweenParagraphs: "10px"
314
314
  }, children);
@@ -370,11 +370,11 @@ const ComponentXL = ({
370
370
  let fontStyle = componentFontStyle(textStyle);
371
371
  return /*#__PURE__*/React.createElement(TypographyBase, {
372
372
  className: className,
373
- color: color,
373
+ $color: color,
374
374
  lineHeight: 28,
375
- fontSize: 24,
376
- fontWeight: fontWeight,
377
- fontStyle: fontStyle
375
+ $fontSize: 24,
376
+ $fontWeight: fontWeight,
377
+ $fontStyle: fontStyle
378
378
  }, children);
379
379
  };
380
380
 
@@ -396,11 +396,11 @@ const ComponentL = ({
396
396
  let fontStyle = componentFontStyle(textStyle);
397
397
  return /*#__PURE__*/React.createElement(TypographyBase, {
398
398
  className: className,
399
- color: color,
399
+ $color: color,
400
400
  lineHeight: 24,
401
- fontSize: 20,
402
- fontWeight: fontWeight,
403
- fontStyle: fontStyle
401
+ $fontSize: 20,
402
+ $fontWeight: fontWeight,
403
+ $fontStyle: fontStyle
404
404
  }, children);
405
405
  };
406
406
 
@@ -422,11 +422,11 @@ const ComponentM = ({
422
422
  let fontStyle = componentFontStyle(textStyle);
423
423
  return /*#__PURE__*/React.createElement(TypographyBase, {
424
424
  className: className,
425
- color: color,
425
+ $color: color,
426
426
  lineHeight: 24,
427
- fontSize: 18,
428
- fontWeight: fontWeight,
429
- fontStyle: fontStyle
427
+ $fontSize: 18,
428
+ $fontWeight: fontWeight,
429
+ $fontStyle: fontStyle
430
430
  }, children);
431
431
  };
432
432
 
@@ -448,11 +448,11 @@ const ComponentS = ({
448
448
  let fontStyle = componentFontStyle(textStyle);
449
449
  return /*#__PURE__*/React.createElement(TypographyBase, {
450
450
  className: className,
451
- color: color,
451
+ $color: color,
452
452
  lineHeight: 20,
453
- fontSize: 16,
454
- fontWeight: fontWeight,
455
- fontStyle: fontStyle
453
+ $fontSize: 16,
454
+ $fontWeight: fontWeight,
455
+ $fontStyle: fontStyle
456
456
  }, children);
457
457
  };
458
458
 
@@ -475,11 +475,11 @@ const ComponentXS = ({
475
475
  let textTransform = componentTextTransformation(textStyle);
476
476
  return /*#__PURE__*/React.createElement(TypographyBase, {
477
477
  className: className,
478
- color: color,
478
+ $color: color,
479
479
  lineHeight: 16,
480
- fontSize: 14,
481
- fontWeight: fontWeight,
482
- fontStyle: fontStyle,
480
+ $fontSize: 14,
481
+ $fontWeight: fontWeight,
482
+ $fontStyle: fontStyle,
483
483
  textTransform: textTransform
484
484
  }, children);
485
485
  };
@@ -503,11 +503,11 @@ const ComponentXXS = ({
503
503
  let textTransform = componentTextTransformation(textStyle);
504
504
  return /*#__PURE__*/React.createElement(TypographyBase, {
505
505
  className: className,
506
- color: color,
506
+ $color: color,
507
507
  lineHeight: 16,
508
- fontSize: 12,
509
- fontWeight: fontWeight,
510
- fontStyle: fontStyle,
508
+ $fontSize: 12,
509
+ $fontWeight: fontWeight,
510
+ $fontStyle: fontStyle,
511
511
  textTransform: textTransform
512
512
  }, children);
513
513
  };