@dnb/eufemia 9.36.0 → 9.37.0

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); }

package/es/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/es/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/es/icons/e_scooter.d.ts

@@ -0,0 +1,2 @@
+export default e_scooter;
+declare function e_scooter(props: any): JSX.Element;

package/es/icons/e_scooter.js

@@ -0,0 +1,33 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+
+var _g, _defs;
+
+import React from 'react';
+
+const e_scooter = props => React.createElement("svg", _extends({
+  width: 16,
+  height: 16,
+  viewBox: "0 0 16 16",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, props), _g || (_g = React.createElement("g", {
+  clipPath: "url(#a)"
+}, React.createElement("path", {
+  fillRule: "evenodd",
+  clipRule: "evenodd",
+  d: "M13.647 10.593a2.61 2.61 0 0 1 1.15.165.75.75 0 1 0 .537-1.401 4.117 4.117 0 0 0-1.808-.26c-1.232.1-2.29.734-2.994 1.653H6.214a4.154 4.154 0 0 0-3.4-1.43c-.85.05-1.627.35-2.26.823a.75.75 0 1 0 .898 1.201c.404-.301.9-.494 1.45-.526a2.648 2.648 0 0 1 2.315 1.088.748.748 0 0 0 .566.312.74.74 0 0 0 .217.032h4.9a.748.748 0 0 0 .561-.253.742.742 0 0 0 .132-.152c.464-.71 1.203-1.184 2.054-1.252Zm-10.59 2.24a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-2 .5a2 2 0 1 1 4 0 2 2 0 0 1-4 0Zm12.693-.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-2 .5a2 2 0 1 1 4 0 2 2 0 0 1-4 0Z",
+  fill: "#000"
+}), React.createElement("path", {
+  d: "m12.5 9.5-1-8M10 1h3",
+  stroke: "#000",
+  strokeWidth: 1.5,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+}))), _defs || (_defs = React.createElement("defs", null, React.createElement("clipPath", {
+  id: "a"
+}, React.createElement("path", {
+  fill: "#fff",
+  d: "M0 0h16v16H0z"
+})))));
+
+export default e_scooter;

package/es/icons/e_scooter_medium.d.ts

@@ -0,0 +1,2 @@
+export default e_scooter_medium;
+declare function e_scooter_medium(props: any): JSX.Element;

package/es/icons/e_scooter_medium.js

@@ -0,0 +1,21 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+
+var _path;
+
+import React from 'react';
+
+const e_scooter_medium = props => React.createElement("svg", _extends({
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, props), _path || (_path = React.createElement("path", {
+  d: "M21.291 21.061a1.469 1.469 0 1 0 0-2.938 1.469 1.469 0 0 0 0 2.938Zm-18.612 0a1.469 1.469 0 1 0 0-2.938 1.469 1.469 0 0 0 0 2.938ZM.75 16.2a3.917 3.917 0 0 1 5.85 2.9h10.8a3.917 3.917 0 0 1 5.847-2.9M20 15.5 17.806 2.939m-2.393 0h4.898",
+  stroke: "#000",
+  strokeWidth: 1.5,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+})));
+
+export default e_scooter_medium;

package/es/icons/icons-meta.json

@@ -3511,5 +3511,19 @@
     "name": "hierarchy",
     "variant": "secondary",
     "category": "essentials"
+  },
+  "e_scooter_medium": {
+    "tags": ["electric scooter"],
+    "created": 1667637717878,
+    "name": "e_scooter",
+    "variant": "secondary",
+    "category": "products"
+  },
+  "e_scooter": {
+    "tags": ["electric scooter"],
+    "created": 1667637718230,
+    "name": "e_scooter",
+    "variant": "secondary",
+    "category": "products"
   }
 }