@dnb/eufemia 9.35.0 → 9.37.0

package/components/table/TableContext.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Web TableContext Context
+ *
+ */
+import React from 'react';
+declare const TableContext: React.Context<any>;
+export default TableContext;

package/components/table/TableContext.js

@@ -0,0 +1,3 @@
+import React from 'react';
+var TableContext = React.createContext(null);
+export default TableContext;

package/components/table/TableTd.js

@@ -12,7 +12,7 @@ var Td = function Td(componentProps) {
   return React.createElement("td", _extends({
     role: "cell",
     className: classnames('dnb-table__td', className)
-  }, props));
+  }, props), children);
 };
 
 export default Td;

package/components/table/style/themes/dnb-table-theme-ui.css

@@ -25,6 +25,7 @@
   .dnb-table > tr > td,
   .dnb-table > thead > tr > th,
   .dnb-table > tbody > tr > td, .dnb-table__th, .dnb-table__td {
+    position: relative;
     font-size: 1.125rem;
     font-size: var(--font-size-basis);
     line-height: 1.5rem;
@@ -76,19 +77,15 @@
   .dnb-table .dnb-table__tr--even {
     background-color: #f2f2f5;
     background-color: var(--color-lavender); }
-  .dnb-table > thead > tr,
-  .dnb-table > tbody > tr,
-  .dnb-table .dnb-table__tr {
-    position: relative; }
-  .dnb-table > thead > tr:last-of-type::after,
-  .dnb-table > tbody > tr:last-of-type::after,
-  .dnb-table > .dnb-table__tr:last-of-type::after {
+  .dnb-table > thead > tr > th::after,
+  .dnb-table > tbody > tr:last-of-type > td::after,
+  .dnb-table > thead > .dnb-table__tr > .dnb-table__th::after,
+  .dnb-table > tbody > .dnb-table__tr:last-of-type > .dnb-table__td::after {
     content: '';
     position: absolute;
     left: 0;
     right: 0;
     bottom: -1px;
-    z-index: 1;
     height: 1px;
     background-color: #ebebeb;
     background-color: var(--color-black-8); }

package/components/table/style/themes/dnb-table-theme-ui.min.css

@@ -1,2 +1,2 @@
-.dnb-table>tbody>tr>td,.dnb-table>thead>tr>th,.dnb-table>tr>td,.dnb-table>tr>th,.dnb-table__td,.dnb-table__th{border-spacing:0;font-size:1.125rem;font-size:var(--font-size-basis);line-height:1.5rem;line-height:var(--line-height-basis);word-break:keep-all}.dnb-table>thead>tr>th,.dnb-table>tr>th,.dnb-table__th{background-color:#fff;background-color:var(--color-white);color:#000;color:var(--color-black);font-weight:500;font-weight:var(--font-weight-medium);padding:3rem 1rem .5rem;padding:var(--spacing-x-large) var(--spacing-small) var(--spacing-x-small);vertical-align:bottom}.dnb-table>thead>tr>th:not([align]):not(.dnb-table--left):not(.dnb-table--right):not(.dnb-table--center),.dnb-table>tr>th:not([align]):not(.dnb-table--left):not(.dnb-table--right):not(.dnb-table--center),.dnb-table__th:not([align]):not(.dnb-table--left):not(.dnb-table--right):not(.dnb-table--center){text-align:inherit}@supports (-moz-appearance:meterbar) and (background-blend-mode:difference,normal){.dnb-table>thead>tr>th,.dnb-table>tr>th,.dnb-table__th{padding-bottom:calc(.5rem - .5px);padding-bottom:calc(var(--spacing-x-small) - .5px)}}.dnb-table>tbody>tr>td,.dnb-table>tr>td,.dnb-table>tr>th[scope=row],.dnb-table__td{color:currentColor;color:var(--theme-color-black-80,currentColor);padding:1rem;padding:var(--spacing-small);padding-bottom:1.188rem;padding-bottom:calc(var(--spacing-small)*1.188);padding-top:1.25rem;padding-top:calc(var(--spacing-small)*1.25)}.dnb-table .dnb-table__tr,.dnb-table .dnb-table__tr--odd,.dnb-table>tbody>tr{background-color:#fff;background-color:var(--color-white)}.dnb-table .dnb-table__tr--even,.dnb-table .dnb-table__tr:not(.dnb-table__tr--odd):nth-of-type(2n),.dnb-table>tbody>tr:not(.dnb-table__tr--odd):nth-of-type(2n){background-color:#f2f2f5;background-color:var(--color-lavender)}.dnb-table .dnb-table__tr,.dnb-table>tbody>tr,.dnb-table>thead>tr{position:relative}.dnb-table>.dnb-table__tr:last-of-type:after,.dnb-table>tbody>tr:last-of-type:after,.dnb-table>thead>tr:last-of-type:after{background-color:#ebebeb;background-color:var(--color-black-8);bottom:-1px;content:"";height:1px;left:0;position:absolute;right:0;z-index:1}.dnb-table .dnb-table__th.dnb-table--sortable,.dnb-table>thead>tr>th.dnb-table--sortable{color:#14555a;color:var(--color-emerald-green)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-shadow:none;box-shadow:none;color:inherit;font-size:inherit;font-weight:500;font-weight:var(--font-weight-medium);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0 .5rem 0 0;position:relative;text-align:inherit;z-index:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor>.dnb-icon,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button>.dnb-icon{opacity:0;-webkit-transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out,-webkit-transform .5s ease-out}[data-visual-test-wrapper] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor>.dnb-icon,[data-visual-test-wrapper] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button>.dnb-icon,[data-visual-test-wrapper] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor>.dnb-icon,[data-visual-test-wrapper] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button>.dnb-icon{-webkit-transition:none;transition:none}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor .dnb-button__text,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button .dnb-button__text{font-size:inherit;margin:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button .dnb-button__text:after{right:1rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor .dnb-button__icon,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button .dnb-button__icon{-ms-flex-item-align:end;align-self:flex-end;margin-bottom:.25rem;margin-top:auto}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:not(:focus) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:not(:focus) .dnb-button__text:after{color:#14555a;color:var(--color-emerald-green);opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:not([disabled]){color:#007272;color:var(--color-sea-green)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:not([disabled]):not(:focus) .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus[disabled],.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon{opacity:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active[disabled],.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]),.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]){color:#14555a;color:var(--color-emerald-green)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;height:inherit;left:-.5rem;outline:none;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:not(:hover) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--active .dnb-button:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-button:not(:hover) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-anchor .dnb-icon,.dnb-table .dnb-table__th.dnb-table--active .dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-anchor .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-button .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-button:hover:not([disabled]) .dnb-button__text:after{color:#007272;color:var(--color-sea-green);opacity:1}.dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:visible}html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard]
+.dnb-table>tbody>tr>td,.dnb-table>thead>tr>th,.dnb-table>tr>td,.dnb-table>tr>th,.dnb-table__td,.dnb-table__th{border-spacing:0;font-size:1.125rem;font-size:var(--font-size-basis);line-height:1.5rem;line-height:var(--line-height-basis);position:relative;word-break:keep-all}.dnb-table>thead>tr>th,.dnb-table>tr>th,.dnb-table__th{background-color:#fff;background-color:var(--color-white);color:#000;color:var(--color-black);font-weight:500;font-weight:var(--font-weight-medium);padding:3rem 1rem .5rem;padding:var(--spacing-x-large) var(--spacing-small) var(--spacing-x-small);vertical-align:bottom}.dnb-table>thead>tr>th:not([align]):not(.dnb-table--left):not(.dnb-table--right):not(.dnb-table--center),.dnb-table>tr>th:not([align]):not(.dnb-table--left):not(.dnb-table--right):not(.dnb-table--center),.dnb-table__th:not([align]):not(.dnb-table--left):not(.dnb-table--right):not(.dnb-table--center){text-align:inherit}@supports (-moz-appearance:meterbar) and (background-blend-mode:difference,normal){.dnb-table>thead>tr>th,.dnb-table>tr>th,.dnb-table__th{padding-bottom:calc(.5rem - .5px);padding-bottom:calc(var(--spacing-x-small) - .5px)}}.dnb-table>tbody>tr>td,.dnb-table>tr>td,.dnb-table>tr>th[scope=row],.dnb-table__td{color:currentColor;color:var(--theme-color-black-80,currentColor);padding:1rem;padding:var(--spacing-small);padding-bottom:1.188rem;padding-bottom:calc(var(--spacing-small)*1.188);padding-top:1.25rem;padding-top:calc(var(--spacing-small)*1.25)}.dnb-table .dnb-table__tr,.dnb-table .dnb-table__tr--odd,.dnb-table>tbody>tr{background-color:#fff;background-color:var(--color-white)}.dnb-table .dnb-table__tr--even,.dnb-table .dnb-table__tr:not(.dnb-table__tr--odd):nth-of-type(2n),.dnb-table>tbody>tr:not(.dnb-table__tr--odd):nth-of-type(2n){background-color:#f2f2f5;background-color:var(--color-lavender)}.dnb-table>tbody>.dnb-table__tr:last-of-type>.dnb-table__td:after,.dnb-table>tbody>tr:last-of-type>td:after,.dnb-table>thead>.dnb-table__tr>.dnb-table__th:after,.dnb-table>thead>tr>th:after{background-color:#ebebeb;background-color:var(--color-black-8);bottom:-1px;content:"";height:1px;left:0;position:absolute;right:0}.dnb-table .dnb-table__th.dnb-table--sortable,.dnb-table>thead>tr>th.dnb-table--sortable{color:#14555a;color:var(--color-emerald-green)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-shadow:none;box-shadow:none;color:inherit;font-size:inherit;font-weight:500;font-weight:var(--font-weight-medium);line-height:1.5rem;line-height:var(--line-height-basis);margin:0;padding:0 .5rem 0 0;position:relative;text-align:inherit;z-index:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor>.dnb-icon,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button>.dnb-icon{opacity:0;-webkit-transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,-webkit-transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out;transition:opacity .2s ease-out,transform .5s ease-out,-webkit-transform .5s ease-out}[data-visual-test-wrapper] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor>.dnb-icon,[data-visual-test-wrapper] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button>.dnb-icon,[data-visual-test-wrapper] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor>.dnb-icon,[data-visual-test-wrapper] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button>.dnb-icon{-webkit-transition:none;transition:none}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor .dnb-button__text,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button .dnb-button__text{font-size:inherit;margin:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button .dnb-button__text:after{right:1rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor .dnb-button__icon,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button .dnb-button__icon{-ms-flex-item-align:end;align-self:flex-end;margin-bottom:.25rem;margin-top:auto}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:not(:focus) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:not(:focus) .dnb-button__text:after{color:#14555a;color:var(--color-emerald-green);opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:not([disabled]){color:#007272;color:var(--color-sea-green)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:not([disabled]):not(:focus) .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus[disabled],.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:focus:not([disabled]) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:focus:not([disabled]) .dnb-icon{opacity:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active[disabled],.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]),.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]){color:#14555a;color:var(--color-emerald-green)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;height:inherit;left:-.5rem;outline:none;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{--border-color:var(--color-emerald-green);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color)}@media screen and (-ms-high-contrast:none){html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green)}}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:active:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--sortable .dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:not(:hover) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--active .dnb-button:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-button:not(:hover) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-anchor .dnb-icon,.dnb-table .dnb-table__th.dnb-table--active .dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-anchor .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-button .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-button:hover:not([disabled]) .dnb-button__text:after{color:#007272;color:var(--color-sea-green);opacity:1}.dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:visible}html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-anchor:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-button:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard]
 .dnb-table>thead>tr>th.dnb-table--active .dnb-anchor:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard] .dnb-table>thead>tr>th.dnb-table--active .dnb-button:hover:focus .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--reversed .dnb-anchor .dnb-icon,.dnb-table .dnb-table__th.dnb-table--reversed .dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--reversed .dnb-anchor .dnb-icon,.dnb-table>thead>tr>th.dnb-table--reversed .dnb-button .dnb-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transform-origin:50% 50%;transform-origin:50% 50%}.dnb-table .dnb-table__th.dnb-table--no-wrap,.dnb-table>tbody>tr>th.dnb-table--no-wrap,.dnb-table>thead>tr>th.dnb-table--no-wrap{white-space:nowrap}

package/components/table/style/themes/dnb-table-theme-ui.scss

@@ -15,6 +15,8 @@
   & > tbody > tr > td,
   &__th,
   &__td {
+    position: relative;
+
     font-size: var(--font-size-basis);
     line-height: var(--line-height-basis);
     border-spacing: 0;
@@ -72,22 +74,16 @@
     background-color: var(--color-lavender);
   }
 
-  & > thead > tr,
-  & > tbody > tr,
-  & &__tr {
-    position: relative;
-  }
-
   // Border
-  & > thead > tr:last-of-type::after,
-  & > tbody > tr:last-of-type::after,
-  & > &__tr:last-of-type::after {
+  & > thead > tr > th::after,
+  & > tbody > tr:last-of-type > td::after,
+  & > thead > &__tr > &__th::after,
+  & > tbody > &__tr:last-of-type > &__td::after {
     content: '';
     position: absolute;
     left: 0;
     right: 0;
     bottom: -1px;
-    z-index: 1; // lower than "tr.sticky"
 
     height: 1px;
     background-color: var(--color-black-8);

package/elements/Element.d.ts

@@ -49,5 +49,5 @@ declare const Element: React.ForwardRefExoticComponent<Pick<{
     skeleton_method?: SkeletonMethods;
 } & import("../shared/types").SpacingElementProps & {
     space?: import("../shared/types").SpaceTypes | import("../shared/types").SpacingElementProps;
-} & ElementInternalProps & React.HTMLProps<HTMLElement>, "aria-hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "accessKey" | "key" | "value" | "top" | "right" | "bottom" | "left" | "width" | "height" | "size" | "children" | "className" | "skeleton" | "space" | "alt" | "src" | "shape" | "list" | "step" | "content" | "inner_ref" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "as" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "default" | "defer" | "disabled" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "nonce" | "noValidate" | "open" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "sizes" | "srcDoc" | "srcLang" | "srcSet" | "start" | "target" | "type" | "useMap" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "class" | "innerRef" | "skeletonMethod" | "internalClass" | "css" | "skeleton_method"> & React.RefAttributes<unknown>>;
+} & ElementInternalProps & React.HTMLProps<HTMLElement>, "aria-hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "accessKey" | "key" | "value" | "top" | "right" | "bottom" | "left" | "space" | "width" | "height" | "size" | "children" | "className" | "skeleton" | "alt" | "src" | "shape" | "list" | "step" | "content" | "inner_ref" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "as" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "default" | "defer" | "disabled" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "nonce" | "noValidate" | "open" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "sizes" | "srcDoc" | "srcLang" | "srcSet" | "start" | "target" | "type" | "useMap" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "class" | "innerRef" | "skeletonMethod" | "internalClass" | "css" | "skeleton_method"> & React.RefAttributes<unknown>>;
 export default Element;

package/es/components/input-masked/addons/createNumberMask.d.ts

@@ -1,4 +1,4 @@
-export default function createNumberMask({ prefix, suffix, includeThousandsSeparator, thousandsSeparatorSymbol, allowDecimal, decimalSymbol, decimalLimit, requireDecimal, allowNegative, }?: {
+export default function createNumberMask({ prefix, suffix, includeThousandsSeparator, thousandsSeparatorSymbol, allowDecimal, decimalSymbol, decimalLimit, integerLimit, requireDecimal, allowNegative, }?: {
     prefix?: string;
     suffix?: string;
     includeThousandsSeparator?: boolean;
@@ -6,6 +6,7 @@ export default function createNumberMask({ prefix, suffix, includeThousandsSepar
     allowDecimal?: boolean;
     decimalSymbol?: string;
     decimalLimit?: number;
+    integerLimit?: boolean;
     requireDecimal?: boolean;
     allowNegative?: boolean;
 }): {

package/es/components/input-masked/addons/createNumberMask.js

@@ -24,6 +24,7 @@ export default function createNumberMask({
   allowDecimal = false,
   decimalSymbol = ',',
   decimalLimit = 2,
+  integerLimit = false,
   requireDecimal = false,
   allowNegative = true
 } = {}) {
@@ -72,6 +73,11 @@ export default function createNumberMask({
     }
 
     integer = integer.replace(nonDigitsRegExp, emptyString);
+
+    if (typeof integerLimit === number) {
+      integer = integer.slice(0, integerLimit);
+    }
+
     integer = includeThousandsSeparator ? addThousandsSeparator(integer, thousandsSeparatorSymbol) : integer;
     mask = convertToMask(integer);
 

package/es/components/space/Space.js

@@ -43,9 +43,9 @@ function Element(_ref) {
   }
 
   if (isTrue(no_collapse)) {
-    const R = E === 'span' || isInline(Element) ? 'span' : 'div';
+    const R = E === 'span' || isInline(element) ? 'span' : 'div';
     return React.createElement(R, {
-      className: 'dnb-space--no-collapse' + (isInline(Element) ? " dnb-space--inline" : "")
+      className: 'dnb-space--no-collapse' + (isInline(element) ? " dnb-space--inline" : "")
     }, component);
   }
 

package/es/components/space/SpacingUtils.d.ts

@@ -2,6 +2,14 @@
  * Space helper
  *
  */
+import type { SpacingProps } from './types';
+declare type Props = SpacingProps | Record<string, unknown>;
+declare type StyleObjectProps = {
+    maxWidth?: string;
+    maxHeight?: string;
+    width?: string;
+    height?: string;
+};
 export declare const spacingDefaultProps: {
     space: any;
     top: any;
@@ -27,12 +35,9 @@ export declare const findType: (num: any, { returnObject }?: {
     returnObject?: boolean;
 }) => string | [string, number];
 export declare const findNearestTypes: (num: any) => any[];
-export declare const isValidSpaceProp: (prop: any) => boolean;
-export declare const removeSpaceProps: ({ ...props }: {
-    [x: string]: any;
-}) => {
-    [x: string]: any;
-};
-export declare const createSpacingClasses: (props: any, Element?: any) => any[];
-export declare const createStyleObject: (props: any) => {};
-export declare const isInline: (Element: any) => boolean;
+export declare const isValidSpaceProp: (propName: string) => boolean;
+export declare const removeSpaceProps: (props: Props) => Props;
+export declare const createSpacingClasses: (props: Props, Element?: any) => any[];
+export declare const createStyleObject: (props: Props & StyleObjectProps) => {};
+export declare const isInline: (elementName: string) => boolean;
+export {};

package/es/components/space/SpacingUtils.js

@@ -1,4 +1,9 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 import { warn } from '../../shared/component-helper';
 export const spacingDefaultProps = {
   space: null,
@@ -121,34 +126,38 @@ export const findNearestTypes = num => {
 
   return res;
 };
-export const isValidSpaceProp = prop => prop && ['top', 'right', 'bottom', 'left'].includes(prop);
-export const removeSpaceProps = _ref => {
-  let props = _extends({}, _ref);
+export const isValidSpaceProp = propName => propName && ['top', 'right', 'bottom', 'left'].includes(propName);
+export const removeSpaceProps = props => {
+  const p = Object.isFrozen(props) ? _objectSpread({}, props) : props;
 
-  for (const i in props) {
+  for (const i in p) {
     if (isValidSpaceProp(i)) {
-      delete props[i];
+      delete p[i];
     }
   }
 
-  return props;
+  return p;
 };
 export const createSpacingClasses = (props, Element = null) => {
-  if (typeof props.space !== 'undefined') {
-    if (typeof props.space === 'string' || typeof props.space === 'number' || typeof props.space === 'boolean' && props.space) {
-      props.top = props.right = props.bottom = props.left = props.space;
+  const p = Object.isFrozen(props) ? _objectSpread({}, props) : props;
+
+  if (typeof p.space !== 'undefined') {
+    if (typeof p.space === 'string' || typeof p.space === 'number' || typeof p.space === 'boolean' && p.space) {
+      p.top = p.right = p.bottom = p.left = p.space;
     }
 
-    for (const i in props.space) {
-      if (!props[i] && isValidSpaceProp(i)) {
-        props[i] = props.space[i];
+    if (typeof p.space === 'object') {
+      for (const i in p.space) {
+        if (!p[i] && isValidSpaceProp(i)) {
+          p[i] = p.space[i];
+        }
       }
     }
 
-    delete props.space;
+    delete p.space;
   }
 
-  return Object.entries(props).reduce((acc, [direction, cur]) => {
+  return Object.entries(p).reduce((acc, [direction, cur]) => {
     if (isValidSpaceProp(direction)) {
       if (String(cur) === '0' || String(cur) === 'false') {
         acc.push(`dnb-space__${direction}--zero`);
@@ -175,29 +184,31 @@ export const createSpacingClasses = (props, Element = null) => {
   }, []);
 };
 export const createStyleObject = props => {
-  if (props.top && !(parseFloat(props.top) > 0)) {
-    props.top = sumTypes(props.top);
+  const p = Object.isFrozen(props) ? _objectSpread({}, props) : props;
+
+  if (p.top && !(parseFloat(String(p.top)) > 0)) {
+    p.top = sumTypes(p.top);
   }
 
-  if (props.bottom && !(parseFloat(props.bottom) > 0)) {
-    props.bottom = sumTypes(props.bottom);
+  if (p.bottom && !(parseFloat(String(p.bottom)) > 0)) {
+    p.bottom = sumTypes(p.bottom);
   }
 
-  if (props.left && !(parseFloat(props.left) > 0)) {
-    props.left = sumTypes(props.left);
+  if (p.left && !(parseFloat(String(p.left)) > 0)) {
+    p.left = sumTypes(p.left);
   }
 
-  if (props.right && !(parseFloat(props.right) > 0)) {
-    props.right = sumTypes(props.right);
+  if (p.right && !(parseFloat(String(p.right)) > 0)) {
+    p.right = sumTypes(p.right);
   }
 
   return Object.entries({
-    marginTop: props.top && `${props.top}rem`,
-    marginBottom: props.bottom && `${props.bottom}rem`,
-    maxWidth: props.maxWidth && `${props.maxWidth}rem`,
-    maxHeight: props.maxHeight && `${props.maxHeight}rem`,
-    width: props.width && `${props.width}rem`,
-    height: props.height && `${props.height}rem`
+    marginTop: p.top && `${p.top}rem`,
+    marginBottom: p.bottom && `${p.bottom}rem`,
+    maxWidth: p.maxWidth && `${p.maxWidth}rem`,
+    maxHeight: p.maxHeight && `${p.maxHeight}rem`,
+    width: p.width && `${p.width}rem`,
+    height: p.height && `${p.height}rem`
   }).reduce((acc, [key, val]) => {
     if (typeof val !== 'undefined') {
       acc[key] = val;
@@ -206,10 +217,8 @@ export const createStyleObject = props => {
     return acc;
   }, {});
 };
-export const isInline = Element => {
-  let inline = false;
-
-  switch (Element) {
+export const isInline = elementName => {
+  switch (elementName) {
     case 'h1':
     case 'h2':
     case 'h3':
@@ -217,9 +226,8 @@ export const isInline = Element => {
     case 'h5':
     case 'h6':
     case 'p':
-      inline = true;
-      break;
+      return true;
   }
 
-  return inline;
+  return false;
 };

package/es/components/step-indicator/StepIndicatorSidebar.js

@@ -5,11 +5,13 @@ var _StepIndicatorList;
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import classnames from 'classnames';
 import { extendPropsWithContextInClassComponent } from '../../shared/component-helper';
 import Context from '../../shared/Context';
 import StepIndicatorList from './StepIndicatorList';
 import { stepIndicatorPropTypes, stepIndicatorDefaultProps } from './StepIndicatorProps';
 import { StepIndicatorProvider } from './StepIndicatorContext';
+import { createSpacingClasses } from '../space/SpacingHelper';
 export default class StepIndicatorSidebar extends React.PureComponent {
   constructor(...args) {
     super(...args);
@@ -54,7 +56,7 @@ export default class StepIndicatorSidebar extends React.PureComponent {
     const providerProps = this.state.showInitialData ? this.getContextAndProps() : null;
     return React.createElement("div", {
       id: 'sidebar__' + this.props.sidebar_id,
-      className: "dnb-step-indicator-v2 dnb-step-indicator__sidebar" + (this._hasSkeletonData && providerProps !== null && providerProps !== void 0 && providerProps.skeleton ? " dnb-step-indicator__sidebar--ssr-skeleton" : "")
+      className: classnames("dnb-step-indicator-v2 dnb-step-indicator__sidebar", createSpacingClasses(this.props), this._hasSkeletonData && (providerProps === null || providerProps === void 0 ? void 0 : providerProps.skeleton) && 'dnb-step-indicator__sidebar--ssr-skeleton')
     }, providerProps && React.createElement(StepIndicatorProvider, _extends({
       isSidebar: true,
       sidebar_id: this.props.internalId || this.props.sidebar_id

package/es/components/table/Table.d.ts

@@ -2,8 +2,8 @@ import React from 'react';
 import { SkeletonShow } from '../skeleton/Skeleton';
 import { SpacingProps } from '../../shared/types';
 import { StickyHelper, StickyTableHeaderProps } from './TableStickyHeader';
-export declare type TableSizes = 'medium' | 'large';
-export declare type TableVariants = 'basis' | 'not-defined-yet';
+export declare type TableSizes = 'large' | 'medium';
+export declare type TableVariants = 'generic';
 export { StickyHelper };
 export interface TableProps extends StickyTableHeaderProps {
     /**
@@ -24,8 +24,8 @@ export interface TableProps extends StickyTableHeaderProps {
      */
     size?: TableSizes;
     /**
-     * The variant of the component.
-     * Default: basis.
+     * The style variant of the component.
+     * Default: generic.
      */
     variant?: TableVariants;
 }

package/es/components/table/Table.js

@@ -7,12 +7,13 @@ import Context from '../../shared/Context';
 import Provider from '../../shared/Provider';
 import { createSpacingClasses } from '../space/SpacingHelper';
 import { createSkeletonClass } from '../skeleton/SkeletonHelper';
-import { validateDOMAttributes, extendPropsWithContext } from '../../shared/component-helper';
+import { extendPropsWithContext, validateDOMAttributes } from '../../shared/component-helper';
+import TableContext from './TableContext';
 import { useStickyHeader, StickyHelper } from './TableStickyHeader';
 export { StickyHelper };
 export const defaultProps = {
   size: 'large',
-  variant: 'basis'
+  variant: 'generic'
 };
 
 const Table = componentProps => {
@@ -37,13 +38,23 @@ const Table = componentProps => {
   const {
     elementRef
   } = useStickyHeader(allProps);
+  const trTmpRef = React.useRef({
+    count: 0
+  });
+  React.useLayoutEffect(() => {
+    trTmpRef.current.count = 0;
+  });
   validateDOMAttributes(allProps, props);
   return React.createElement(Provider, {
     skeleton: Boolean(skeleton)
+  }, React.createElement(TableContext.Provider, {
+    value: {
+      trTmpRef
+    }
   }, React.createElement("table", _extends({
-    className: classnames(`dnb-table dnb-table__variant--${variant || 'basis'} dnb-table__size--${size || 'large'}`, spacingClasses, skeletonClasses, className, sticky && `dnb-table--sticky`),
+    className: classnames('dnb-table', spacingClasses, skeletonClasses, className, variant && `dnb-table__variant--${variant}`, size && `dnb-table__size--${size}`, sticky && `dnb-table--sticky`),
     ref: elementRef
-  }, props), children));
+  }, props), children)));
 };
 
 export default Table;

package/es/components/table/TableContext.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Web TableContext Context
+ *
+ */
+import React from 'react';
+declare const TableContext: React.Context<any>;
+export default TableContext;

package/es/components/table/TableContext.js

@@ -0,0 +1,3 @@
+import React from 'react';
+const TableContext = React.createContext(null);
+export default TableContext;

package/es/components/table/TableTd.js

@@ -14,7 +14,7 @@ const Td = componentProps => {
   return React.createElement("td", _extends({
     role: "cell",
     className: classnames('dnb-table__td', className)
-  }, props));
+  }, props), children);
 };
 
 export default Td;

package/es/components/table/style/themes/dnb-table-theme-ui.css

@@ -25,6 +25,7 @@
   .dnb-table > tr > td,
   .dnb-table > thead > tr > th,
   .dnb-table > tbody > tr > td, .dnb-table__th, .dnb-table__td {
+    position: relative;
     font-size: 1.125rem;
     font-size: var(--font-size-basis);
     line-height: 1.5rem;
@@ -76,19 +77,15 @@
   .dnb-table .dnb-table__tr--even {
     background-color: #f2f2f5;
     background-color: var(--color-lavender); }
-  .dnb-table > thead > tr,
-  .dnb-table > tbody > tr,
-  .dnb-table .dnb-table__tr {
-    position: relative; }
-  .dnb-table > thead > tr:last-of-type::after,
-  .dnb-table > tbody > tr:last-of-type::after,
-  .dnb-table > .dnb-table__tr:last-of-type::after {
+  .dnb-table > thead > tr > th::after,
+  .dnb-table > tbody > tr:last-of-type > td::after,
+  .dnb-table > thead > .dnb-table__tr > .dnb-table__th::after,
+  .dnb-table > tbody > .dnb-table__tr:last-of-type > .dnb-table__td::after {
     content: '';
     position: absolute;
     left: 0;
     right: 0;
     bottom: -1px;
-    z-index: 1;
     height: 1px;
     background-color: #ebebeb;
     background-color: var(--color-black-8); }