@hazelcast/ui 1.3.2-next.9 → 1.3.2-next.91

package/lib/Select/SelectFieldFormik.d.ts

@@ -2,7 +2,7 @@ import { ReactElement } from 'react';
 import { SelectFieldExtraProps } from './SelectField';
 import { FieldValidatorGeneric } from '../utils/formik';
 import { ExtractKeysOfValueType } from '../utils/types';
-export declare type SelectFieldFormikProps<V extends object, OV = string> = SelectFieldExtraProps<OV> & {
+export type SelectFieldFormikProps<V extends object, OV = string> = SelectFieldExtraProps<OV> & {
     name: ExtractKeysOfValueType<V, OV | null>;
     validate?: FieldValidatorGeneric<OV | null>;
     onChange?: (value: OV | null) => void;

package/lib/Select/helpers.d.ts

@@ -1,10 +1,10 @@
-import { GroupedOptionsType, OptionsType } from 'react-select';
-export declare type SelectFieldOption<V> = {
+import { Options, GroupBase } from 'react-select';
+export type SelectFieldOption<V> = {
     label: string;
     value: V;
 };
-export declare type SelectFieldOptionsMap<V> = {
+export type SelectFieldOptionsMap<V> = {
     [key: string]: SelectFieldOption<V>;
 };
-export declare const getOptionsMap: <V extends string | number>(options: OptionsType<SelectFieldOption<V>> | GroupedOptionsType<SelectFieldOption<V>>) => SelectFieldOptionsMap<V>;
+export declare const getOptionsMap: <V extends string | number>(options: Options<SelectFieldOption<V>> | readonly GroupBase<SelectFieldOption<V>>[]) => SelectFieldOptionsMap<V>;
 export declare const getMenuContainer: (menuPortalTarget: 'body' | 'self' | HTMLElement | null) => HTMLElement | null | undefined;

package/lib/Select/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../src/Select/helpers.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAWxC,MAAM,cAAc,GAAG,CAAI,MAA8D,EAAkC,EAAE,CAC3H,CAAC,CAAE,MAA+B,CAAC,KAAK,CAAA;AAE1C,MAAM,CAAC,MAAM,aAAa,GAAG,CAC3B,OAAqF,EAC3D,EAAE;AAC5B,uGAAuG;AACtG,OAAyE,CAAC,MAAM,CAC/E,CAAC,GAA6B,EAAE,aAAqE,EAA4B,EAAE;IACjI,oCAAoC;IACpC,IAAI,cAAc,CAAC,aAAa,CAAC,EAAE;QACjC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,GAAG,aAAa,CAAA;QACxC,2BAA2B;KAC5B;SAAM;QACL,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,QAAkC,EAAE,MAA4B,EAAE,EAAE;YAChG,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,MAAM,CAAA;YAC/B,OAAO,QAAQ,CAAA;QACjB,CAAC,EAAE,GAAG,CAAC,CAAA;KACR;IACD,OAAO,GAAG,CAAA;AACZ,CAAC,EACD,EAA8B,CAC/B,CAAA;AAEH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,gBAAsD,EAAkC,EAAE;IACzH,IAAI,gBAAgB,IAAI,MAAM,EAAE;QAC9B,0CAA0C;QAC1C,OAAO,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAA;KAC7C;IACD,IAAI,gBAAgB,IAAI,MAAM,EAAE;QAC9B,OAAO,SAAS,CAAA;KACjB;IACD,OAAO,gBAAgB,CAAA;AACzB,CAAC,CAAA"}
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../src/Select/helpers.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAWxC,MAAM,cAAc,GAAG,CAAI,MAA8D,EAAkC,EAAE,CAC3H,CAAC,CAAE,MAA+B,CAAC,KAAK,CAAA;AAE1C,MAAM,CAAC,MAAM,aAAa,GAAG,CAC3B,OAAuF,EAC7D,EAAE;AAC5B,uGAAuG;AACtG,OAAyE,CAAC,MAAM,CAC/E,CAAC,GAA6B,EAAE,aAAqE,EAA4B,EAAE;IACjI,oCAAoC;IACpC,IAAI,cAAc,CAAC,aAAa,CAAC,EAAE;QACjC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,GAAG,aAAa,CAAA;QACxC,2BAA2B;KAC5B;SAAM;QACL,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,QAAkC,EAAE,MAA4B,EAAE,EAAE;YAChG,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,MAAM,CAAA;YAC/B,OAAO,QAAQ,CAAA;QACjB,CAAC,EAAE,GAAG,CAAC,CAAA;KACR;IACD,OAAO,GAAG,CAAA;AACZ,CAAC,EACD,EAA8B,CAC/B,CAAA;AAEH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,gBAAsD,EAAkC,EAAE;IACzH,IAAI,gBAAgB,IAAI,MAAM,EAAE;QAC9B,0CAA0C;QAC1C,OAAO,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAA;KAC7C;IACD,IAAI,gBAAgB,IAAI,MAAM,EAAE;QAC9B,OAAO,SAAS,CAAA;KACjB;IACD,OAAO,gBAAgB,CAAA;AACzB,CAAC,CAAA"}

package/lib/SimpleTable.d.ts

@@ -1,5 +1,5 @@
 import { HTMLAttributes, TdHTMLAttributes, ThHTMLAttributes } from 'react';
-export declare type SimpleTableProps = HTMLAttributes<HTMLTableElement>;
+export type SimpleTableProps = HTMLAttributes<HTMLTableElement>;
 export declare const SimpleTable: {
     (props: SimpleTableProps): JSX.Element;
     Body(props: HTMLAttributes<HTMLTableSectionElement>): JSX.Element;

package/lib/Slider.d.ts

@@ -1,20 +1,20 @@
 import { ChangeEvent, ReactNode } from 'react';
 import { DataTestProp } from '@hazelcast/helpers';
-export declare type SliderValue = number | [number, number];
-declare type SliderMark = {
+export type SliderValue = number | [number, number];
+type SliderMark = {
     value: number;
     label: ReactNode;
 };
-declare type ChangeEventType = ChangeEvent<HTMLInputElement> | MouseEvent;
-declare type SingleValueChangeFn = (val: number, e?: ChangeEventType) => void;
-declare type MultiValueChangeFn = (val: [number, number], e?: ChangeEventType) => void;
-export declare type SliderCoreProps<T extends SliderValue> = {
+type ChangeEventType = ChangeEvent<HTMLInputElement> | MouseEvent;
+type SingleValueChangeFn = (val: number, e?: ChangeEventType) => void;
+type MultiValueChangeFn = (val: [number, number], e?: ChangeEventType) => void;
+export type SliderCoreProps<T extends SliderValue> = {
     value: T;
     onChange: T extends number ? SingleValueChangeFn : MultiValueChangeFn;
     name: string;
     error?: string;
 };
-export declare type SliderExtraProps = {
+export type SliderExtraProps = {
     step?: number;
     min: number;
     max: number;
@@ -26,7 +26,7 @@ export declare type SliderExtraProps = {
     hideValueIndicators?: boolean;
     formatCurrentValue?: (val: number) => ReactNode;
 };
-declare type SliderProps<T extends SliderValue = number> = SliderExtraProps & SliderCoreProps<T> & Partial<Pick<HTMLInputElement, 'disabled'>> & DataTestProp;
+type SliderProps<T extends SliderValue = number> = SliderExtraProps & SliderCoreProps<T> & Partial<Pick<HTMLInputElement, 'disabled'>> & DataTestProp;
 /**
  * Determines the absolute left position of the mark given the markValue
  * @param markValue - value of the mark

package/lib/Slider.module.scss

@@ -23,7 +23,7 @@ $currentValueIndicatorHeight: c.$grid * 6;
 
 @mixin thumb() {
   box-shadow: 0 c.$sliderThumbShadowSize c.$sliderThumbShadowBlur c.$colorShadow;
-  background: c.$colorSuccessLight; // background will represent the dot inside
+  background: c.$colorSuccess; // background will represent the dot inside
   border: c.$sliderThumbBorderSize solid c.$colorNeutralWhite; // the white part will be done by the border
   box-sizing: content-box; /* and because of all of this, we need content-box */
   border-radius: 50%;
@@ -162,7 +162,7 @@ ul.markDescriptions {
       }
 
       &.focus,
-      &:focus {
+      &:focus-visible {
         @include styleThumb {
           box-shadow: 0 0 0 c.$outlineWidth c.$colorAccessibilityOutline;
         }

package/lib/SliderFormik.d.ts

@@ -2,7 +2,7 @@ import { ReactElement } from 'react';
 import { FieldValidator } from 'formik';
 import { SliderExtraProps, SliderValue } from './Slider';
 import { ExtractKeysOfValueType } from './utils/types';
-export declare type SliderFormikProps<V extends object> = SliderExtraProps & Partial<Pick<HTMLInputElement, 'disabled'>> & {
+export type SliderFormikProps<V extends object> = SliderExtraProps & Partial<Pick<HTMLInputElement, 'disabled'>> & {
     name: ExtractKeysOfValueType<V, SliderValue>;
     validate?: FieldValidator;
 };

package/lib/Table/Cell.d.ts

@@ -1,17 +1,25 @@
-import { FC } from 'react';
+import { FC, RefObject } from 'react';
 import { TableCellProps } from 'react-table';
-export declare type CellWarningProps = {
+export type CellWarningProps = {
     align: 'left' | 'right';
     warning: string;
 };
 export declare const CellWarning: FC<CellWarningProps>;
-export declare type CellProps = {
+export type CellProps = {
     /**
      * Number fields should be right aligned as that allows
      * you to compare them or add them up quickly in your head.
      */
     align?: 'left' | 'right' | 'center';
+    selected?: boolean;
     warning?: string;
     colSpan?: number;
+    cellId?: string;
+    selectionStartedRef?: RefObject<boolean>;
+    onMouseEnterSelection?: (id: string) => void;
+    onClickSelection?: (id: string, modifiers: {
+        ctrl: boolean;
+        shift: boolean;
+    }) => void;
 } & Omit<TableCellProps, 'key'>;
 export declare const Cell: FC<CellProps>;

package/lib/Table/Cell.js

@@ -1,9 +1,11 @@
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
 import { AlertTriangle } from 'react-feather';
 import { useUID } from 'react-uid';
 import cn from 'classnames';
 import { Icon } from '../Icon';
 import { Tooltip } from '../Tooltip';
+import { useOpenCloseState } from '../hooks';
+import { CellCopyablePopover } from './features/columnsSelection';
 import styles from './Cell.module.scss';
 export const CellWarning = ({ align, warning }) => {
     const id = useUID();
@@ -13,12 +15,45 @@ export const CellWarning = ({ align, warning }) => {
         }) },
         React.createElement(Icon, { icon: AlertTriangle, ariaLabelledBy: id, size: "small" })))));
 };
-export const Cell = ({ align = 'left', warning, colSpan, children, style, className, role }) => (React.createElement("div", { "data-test": "table-cell", className: cn(styles.td, {
-        [styles.alignLeft]: align === 'left',
-        [styles.alignRight]: align === 'right',
-        [styles.alignCenter]: align === 'center',
-    }, className), "aria-colspan": colSpan, style: style, role: role },
-    warning && align === 'right' && React.createElement(CellWarning, { warning: warning, align: "right" }),
-    children,
-    warning && (align === 'left' || align === 'center') && React.createElement(CellWarning, { warning: warning, align: "left" })));
+export const Cell = ({ align = 'left', warning, colSpan, children, style, className, role, cellId, onClickSelection, selected, onMouseEnterSelection, selectionStartedRef, }) => {
+    const rootRef = useRef(null);
+    const { isOpen, open, close } = useOpenCloseState();
+    const handleClick = (e) => {
+        if (onClickSelection && cellId) {
+            if (e.button === 2 && selected) {
+                return;
+            }
+            onClickSelection(cellId, {
+                shift: e.shiftKey,
+                ctrl: e.ctrlKey || e.metaKey,
+            });
+        }
+    };
+    const handleMouseEnter = () => {
+        if (cellId && onMouseEnterSelection && (selectionStartedRef === null || selectionStartedRef === void 0 ? void 0 : selectionStartedRef.current)) {
+            onMouseEnterSelection(cellId);
+        }
+    };
+    useEffect(() => {
+        if (!selected) {
+            close();
+        }
+    }, [close, selected]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { ref: rootRef, "data-test": "table-cell", className: cn(styles.td, {
+                [styles.alignLeft]: align === 'left',
+                [styles.alignRight]: align === 'right',
+                [styles.alignCenter]: align === 'center',
+                [styles.selectable]: onClickSelection,
+                [styles.selected]: selected,
+            }, className), "aria-colspan": colSpan, style: style, role: role, onDoubleClick: selected ? open : undefined, onMouseEnter: onClickSelection ? handleMouseEnter : undefined, onMouseDown: onClickSelection ? handleClick : undefined },
+            warning && align === 'right' && React.createElement(CellWarning, { warning: warning, align: "right" }),
+            children,
+            warning && (align === 'left' || align === 'center') && React.createElement(CellWarning, { warning: warning, align: "left" })),
+        selected && (React.createElement(CellCopyablePopover, { anchorElement: rootRef.current, isOpen: isOpen, onClose: close, contentClassName: cn(styles.td, {
+                [styles.alignLeft]: align === 'left',
+                [styles.alignRight]: align === 'right',
+                [styles.alignCenter]: align === 'center',
+            }) }, children))));
+};
 //# sourceMappingURL=Cell.js.map

package/lib/Table/Cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"Cell.js","sourceRoot":"","sources":["../../src/Table/Cell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAa,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AAEpC,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAOvC,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IACtE,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;IAEnB,OAAO,CACL,oBAAC,OAAO,IAAC,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,IAC9B,CAAC,UAAU,EAAE,EAAE,CAAC,CACf,0CACY,sBAAsB,EAChC,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE;YAChC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,KAAK,MAAM;YAC/B,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,OAAO;SAClC,CAAC;QAEF,oBAAC,IAAI,IAAC,IAAI,EAAE,aAAa,EAAE,cAAc,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,GAAG,CAC1D,CACP,CACO,CACX,CAAA;AACH,CAAC,CAAA;AAYD,MAAM,CAAC,MAAM,IAAI,GAAkB,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAC7G,0CACY,YAAY,EACtB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,EAAE,EACT;QACE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,KAAK,KAAK,MAAM;QACpC,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,KAAK,KAAK,OAAO;QACtC,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,KAAK,KAAK,QAAQ;KACzC,EACD,SAAS,CACV,kBACa,OAAO,EACrB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI;IAET,OAAO,IAAI,KAAK,KAAK,OAAO,IAAI,oBAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAC,OAAO,GAAG;IAC/E,QAAQ;IACR,OAAO,IAAI,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,QAAQ,CAAC,IAAI,oBAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAC,MAAM,GAAG,CAClG,CACP,CAAA"}
+{"version":3,"file":"Cell.js","sourceRoot":"","sources":["../../src/Table/Cell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6B,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAC3E,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEjE,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAOvC,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IACtE,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;IAEnB,OAAO,CACL,oBAAC,OAAO,IAAC,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,IAC9B,CAAC,UAAU,EAAE,EAAE,CAAC,CACf,0CACY,sBAAsB,EAChC,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE;YAChC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,KAAK,MAAM;YAC/B,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,OAAO;SAClC,CAAC;QAEF,oBAAC,IAAI,IAAC,IAAI,EAAE,aAAa,EAAE,cAAc,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,GAAG,CAC1D,CACP,CACO,CACX,CAAA;AACH,CAAC,CAAA;AAiBD,MAAM,CAAC,MAAM,IAAI,GAAkB,CAAC,EAClC,KAAK,GAAG,MAAM,EACd,OAAO,EACP,OAAO,EACP,QAAQ,EACR,KAAK,EACL,SAAS,EACT,IAAI,EACJ,MAAM,EACN,gBAAgB,EAChB,QAAQ,EACR,qBAAqB,EACrB,mBAAmB,GACpB,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAC5B,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,iBAAiB,EAAE,CAAA;IACnD,MAAM,WAAW,GAAG,CAAC,CAAa,EAAE,EAAE;QACpC,IAAI,gBAAgB,IAAI,MAAM,EAAE;YAC9B,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,IAAI,QAAQ,EAAE;gBAC9B,OAAM;aACP;YACD,gBAAgB,CAAC,MAAM,EAAE;gBACvB,KAAK,EAAE,CAAC,CAAC,QAAQ;gBACjB,IAAI,EAAE,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO;aAC7B,CAAC,CAAA;SACH;IACH,CAAC,CAAA;IACD,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,IAAI,MAAM,IAAI,qBAAqB,KAAI,mBAAmB,aAAnB,mBAAmB,uBAAnB,mBAAmB,CAAE,OAAO,CAAA,EAAE;YACnE,qBAAqB,CAAC,MAAM,CAAC,CAAA;SAC9B;IACH,CAAC,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ,EAAE;YACb,KAAK,EAAE,CAAA;SACR;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAA;IAErB,OAAO,CACL;QAEE,6BACE,GAAG,EAAE,OAAO,eACF,YAAY,EACtB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,EAAE,EACT;gBACE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,KAAK,KAAK,MAAM;gBACpC,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,KAAK,KAAK,OAAO;gBACtC,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,KAAK,KAAK,QAAQ;gBACxC,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,gBAAgB;gBACrC,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;aAC5B,EACD,SAAS,CACV,kBACa,OAAO,EACrB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC1C,YAAY,EAAE,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,EAC7D,WAAW,EAAE,gBAAgB,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS;YAEtD,OAAO,IAAI,KAAK,KAAK,OAAO,IAAI,oBAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAC,OAAO,GAAG;YAC/E,QAAQ;YACR,OAAO,IAAI,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,QAAQ,CAAC,IAAI,oBAAC,WAAW,IAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAC,MAAM,GAAG,CAClG;QACL,QAAQ,IAAI,CACX,oBAAC,mBAAmB,IAClB,aAAa,EAAE,OAAO,CAAC,OAAO,EAC9B,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,KAAK,EACd,gBAAgB,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,EAAE;gBAC9B,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,KAAK,KAAK,MAAM;gBACpC,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,KAAK,KAAK,OAAO;gBACtC,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,KAAK,KAAK,QAAQ;aACzC,CAAC,IAED,QAAQ,CACW,CACvB,CACA,CACJ,CAAA;AACH,CAAC,CAAA"}

package/lib/Table/Cell.module.scss

@@ -26,6 +26,10 @@
     justify-content: center;
   }
 
+  &.selected {
+    background: lighten((c.$colorPrimary), 30) !important;
+  }
+
   &:not(:last-of-type) {
     border-right: c.$borderWidth solid c.$colorNeutral;
   }
@@ -42,3 +46,7 @@
     margin-right: c.$grid * 2;
   }
 }
+
+.selectable {
+  user-select: none;
+}

package/lib/Table/CellWrapper.d.ts

@@ -0,0 +1,11 @@
+import { RefObject } from 'react';
+import { ColumnInterface, ColumnInterfaceBasedOnValue, Cell, UseResizeColumnsState } from 'react-table';
+import { CellProps } from './Cell';
+export type CellWrapperProps<D extends object> = CellProps & {
+    cell: Cell<D>;
+    selectable?: boolean;
+    column?: ColumnInterface<D> & ColumnInterfaceBasedOnValue;
+    selectedColumnValuesRef?: RefObject<(string | undefined)[][]>;
+    columnResizing: UseResizeColumnsState<D>['columnResizing'];
+};
+export declare const CellWrapper: <D extends object>(props: CellWrapperProps<D>) => JSX.Element;

package/lib/Table/CellWrapper.js

@@ -0,0 +1,29 @@
+import React, { useEffect } from 'react';
+import { ROW_EXPANDER_COLUMN_ID } from './constants';
+import { Cell as TableCell } from './Cell';
+import { EnhancedCellRenderer } from './EnhancedRenderers';
+export const CellWrapper = (props) => {
+    const { selectable, column, cell, columnResizing, selectedColumnValuesRef, onClickSelection, onMouseEnterSelection, selectionStartedRef, ...rest } = props;
+    const isSelectable = selectable && (column === null || column === void 0 ? void 0 : column.id) !== ROW_EXPANDER_COLUMN_ID;
+    useEffect(() => {
+        if (rest.cellId) {
+            const [rowIndex, cellIndex] = rest.cellId.split(':');
+            if (selectedColumnValuesRef === null || selectedColumnValuesRef === void 0 ? void 0 : selectedColumnValuesRef.current) {
+                if (rest.selected) {
+                    const row = selectedColumnValuesRef.current[Number(rowIndex)];
+                    if (row) {
+                        row[Number(cellIndex)] = typeof cell.value !== 'object' ? String(cell.value) : '';
+                    }
+                }
+                else {
+                    if (selectedColumnValuesRef.current[Number(rowIndex)] && selectedColumnValuesRef.current[Number(rowIndex)][Number(cellIndex)]) {
+                        selectedColumnValuesRef.current[Number(rowIndex)][Number(cellIndex)] = undefined;
+                    }
+                }
+            }
+        }
+    }, [rest, cell, selectedColumnValuesRef]);
+    const content = column ? (React.createElement(EnhancedCellRenderer, { cell: cell, hasCellRenderer: !!column.Cell, columnResizing: columnResizing })) : (cell.render('Cell'));
+    return (React.createElement(TableCell, { onClickSelection: isSelectable ? onClickSelection : undefined, selectionStartedRef: isSelectable ? selectionStartedRef : undefined, onMouseEnterSelection: isSelectable ? onMouseEnterSelection : undefined, ...rest }, content));
+};
+//# sourceMappingURL=CellWrapper.js.map

package/lib/Table/CellWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellWrapper.js","sourceRoot":"","sources":["../../src/Table/CellWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,SAAS,EAAE,MAAM,OAAO,CAAA;AAGnD,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAA;AACpD,OAAO,EAAa,IAAI,IAAI,SAAS,EAAE,MAAM,QAAQ,CAAA;AACrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAU1D,MAAM,CAAC,MAAM,WAAW,GAAG,CAAmB,KAA0B,EAAE,EAAE;IAC1E,MAAM,EACJ,UAAU,EACV,MAAM,EACN,IAAI,EACJ,cAAc,EACd,uBAAuB,EACvB,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACnB,GAAG,IAAI,EACR,GAAG,KAAK,CAAA;IAET,MAAM,YAAY,GAAG,UAAU,IAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,EAAE,MAAK,sBAAsB,CAAA;IAExE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAAqB,CAAA;YAExE,IAAI,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CAAE,OAAO,EAAE;gBACpC,IAAI,IAAI,CAAC,QAAQ,EAAE;oBACjB,MAAM,GAAG,GAAG,uBAAuB,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAA;oBAC7D,IAAI,GAAG,EAAE;wBACP,GAAG,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;qBAClF;iBACF;qBAAM;oBACL,IAAI,uBAAuB,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,IAAI,uBAAuB,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,EAAE;wBAC7H,uBAAuB,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,GAAG,SAAS,CAAA;qBACjF;iBACF;aACF;SACF;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,uBAAuB,CAAC,CAAC,CAAA;IAEzC,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC,CACvB,oBAAC,oBAAoB,IAAC,IAAI,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,cAAc,EAAE,cAAc,GAAI,CACrG,CAAC,CAAC,CAAC,CACF,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CACpB,CAAA;IAED,OAAO,CACL,oBAAC,SAAS,IACR,gBAAgB,EAAE,YAAY,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,EAC7D,mBAAmB,EAAE,YAAY,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,SAAS,EACnE,qBAAqB,EAAE,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,KACnE,IAAI,IAEP,OAAO,CACE,CACb,CAAA;AACH,CAAC,CAAA"}

package/lib/Table/EnhancedRenderers.d.ts

@@ -9,13 +9,13 @@ import { Cell as CellType, HeaderGroup, UseResizeColumnsState } from 'react-tabl
  * The above also applies to simple functions returning string - react-table transforms them into react components.
  * Here's how react-table renderers are made: https://github.com/tannerlinsley/react-table/blob/6e2fe31ac028e543ce0f9d56168d5f922389fbbc/src/publicUtils.js#L199
  */
-export declare type EnhancedHeaderFooterRendererProps<D extends object> = {
+export type EnhancedHeaderFooterRendererProps<D extends object> = {
     column: HeaderGroup<D>;
     columnResizing: UseResizeColumnsState<D>['columnResizing'];
     type: 'Header' | 'Footer';
 };
 export declare const EnhancedHeaderFooterRenderer: <D extends object>({ column, columnResizing, type }: EnhancedHeaderFooterRendererProps<D>) => JSX.Element;
-export declare type EnhancedCellRendererProps<D extends object> = {
+export type EnhancedCellRendererProps<D extends object> = {
     cell: CellType<D, ReactText>;
     hasCellRenderer: boolean;
     columnResizing: UseResizeColumnsState<D>['columnResizing'];

package/lib/Table/Header.d.ts

@@ -1,6 +1,6 @@
 import { FC, MouseEvent, KeyboardEvent, DragEvent } from 'react';
 import { TableHeaderProps, TableResizerProps } from 'react-table';
-export declare type HeaderProps = {
+export type HeaderProps = {
     /**
      * Number fields should be right aligned as that allows
      * you to compare them or add them up quickly in your head.
@@ -14,7 +14,6 @@ export declare type HeaderProps = {
     canResize: boolean;
     isResizing: boolean;
     getResizerProps: (props?: Partial<TableResizerProps>) => TableResizerProps;
-    isLastHeader: boolean;
     index: number;
     onDragStart?: (e: DragEvent) => void;
     onDrop?: (e: DragEvent, index: number) => void;

package/lib/Table/Header.js

@@ -4,7 +4,7 @@ import cn from 'classnames';
 import { Icon } from '../Icon';
 import { keyIsOneOf } from '../utils/keyboard';
 import styles from './Header.module.scss';
-export const Header = ({ align = 'left', colSpan, children, canSort, isSorted, isSortedDesc, canResize, isResizing, getResizerProps, isLastHeader, onClick, style, className, role, index, onDragStart, onDrop, }) => {
+export const Header = ({ align = 'left', colSpan, children, canSort, isSorted, isSortedDesc, canResize, isResizing, getResizerProps, onClick, style, className, role, index, onDragStart, onDrop, }) => {
     const rootRef = useRef(null);
     const isDragStarterRef = useRef(false);
     const counterRef = useRef(0);
@@ -16,6 +16,7 @@ export const Header = ({ align = 'left', colSpan, children, canSort, isSorted, i
     const Chevron = useMemo(() => (React.createElement(Icon, { className: cn(styles.sortingIcon, {
             [styles.left]: align === 'left',
             [styles.right]: align === 'right',
+            [styles.isSorted]: isSorted,
         }), icon: !isSorted ? ChevronUp : isSortedDesc ? ChevronDown : ChevronUp, ariaLabel: !isSorted ? 'Not Sorted' : isSortedDesc ? 'Descending' : 'Ascending', size: "smallMedium" })), [align, isSorted, isSortedDesc]);
     const DraggableIcon = (React.createElement(Icon, { icon: Menu, size: "small", ariaLabel: "draggable-indicator", className: cn(styles.dragIcon, { [styles.dragIconRight]: align === 'right' }) }));
     const onKeyPress = useCallback((event) => {
@@ -74,7 +75,7 @@ export const Header = ({ align = 'left', colSpan, children, canSort, isSorted, i
             children,
             canSort && (align === 'left' || align === 'center') && Chevron,
             draggable && (align === 'left' || align === 'center') && DraggableIcon),
-        canResize && !isLastHeader && (React.createElement("div", { "data-test": "table-header-column-resizer-container", className: styles.resizer, ...getResizerProps() },
+        canResize && (React.createElement("div", { "data-test": "table-header-column-resizer-container", className: styles.resizer, ...getResizerProps() },
             React.createElement("div", { "data-test": "table-header-column-resizer", className: cn(styles.separator, {
                     [styles.resizing]: isResizing,
                 }) })))));

package/lib/Table/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../src/Table/Header.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../src/Table/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,OAAO,EAAE,WAAW,EAAwD,MAAM,EAAE,MAAM,OAAO,CAAA;AACrH,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAE5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAE9C,OAAO,MAAM,MAAM,sBAAsB,CAAA;AAqBzC,MAAM,CAAC,MAAM,MAAM,GAAoB,CAAC,EACtC,KAAK,GAAG,MAAM,EACd,OAAO,EACP,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,UAAU,EACV,eAAe,EACf,OAAO,EACP,KAAK,EACL,SAAS,EACT,IAAI,EACJ,KAAK,EACL,WAAW,EACX,MAAM,GACP,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC5C,MAAM,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IACtC,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,CAAA;IAE5B,MAAM,SAAS,GAAG,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,WAAW,CAAA;IAC3C,IAAI,QAAqC,CAAA;IACzC,IAAI,QAAQ,EAAE;QACZ,QAAQ,GAAG,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,CAAA;KACrD;IAED,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,CACJ,oBAAC,IAAI,IACH,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE;YAChC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,KAAK,MAAM;YAC/B,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,OAAO;YACjC,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;SAC5B,CAAC,EACF,IAAI,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EACpE,SAAS,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,EAC/E,IAAI,EAAC,aAAa,GAClB,CACH,EACD,CAAC,KAAK,EAAE,QAAQ,EAAE,YAAY,CAAC,CAChC,CAAA;IACD,MAAM,aAAa,GAAG,CACpB,oBAAC,IAAI,IACH,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,qBAAqB,EAC/B,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAE,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,KAAK,KAAK,OAAO,EAAE,CAAC,GAC7E,CACH,CAAA;IAED,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,KAAoC,EAAE,EAAE;QACvC,KAAK,CAAC,cAAc,EAAE,CAAA;QACtB,IAAI,UAAU,CAAC,KAAK,EAAE,OAAO,CAAC,IAAI,OAAO,EAAE;YACzC,OAAO,CAAC,KAAK,CAAC,CAAA;SACf;IACH,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAA;IAED,MAAM,eAAe,GAAG;QACtB,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;QACjC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;QACpC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS;QAC5C,OAAO;KACR,CAAA;IAED,OAAO,CACL,6BACE,GAAG,EAAE,OAAO,eACF,wBAAwB,EAClC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,EAC1C,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,kBACI,OAAO,eACV,QAAQ;QAEnB,6BACE,SAAS,EAAE,SAAS,eACV,sBAAsB,EAChC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,EAAE;gBACvB,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,OAAO;gBAC1B,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,KAAK,KAAK,MAAM;gBACpC,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,KAAK,KAAK,OAAO;gBACtC,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,KAAK,KAAK,QAAQ;aACzC,CAAC,EACF,WAAW,EACT,SAAS;gBACP,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE;oBACJ,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,YAAY,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAA;oBACnD,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAA;oBAC/B,WAAW,IAAI,WAAW,CAAC,CAAC,CAAC,CAAA;gBAC/B,CAAC;gBACH,CAAC,CAAC,SAAS,EAEf,SAAS,EAAE,GAAG,EAAE;gBACd,gBAAgB,CAAC,OAAO,GAAG,KAAK,CAAA;YAClC,CAAC,EACD,UAAU,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EACrC,WAAW,EACT,SAAS;gBACP,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE;oBACJ,CAAC,CAAC,cAAc,EAAE,CAAA;oBAClB,IAAI,CAAC,gBAAgB,CAAC,OAAO,IAAI,OAAO,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,KAAK,CAAC,EAAE;wBAC5E,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;qBAC/C;oBACD,UAAU,CAAC,OAAO,EAAE,CAAA;gBACtB,CAAC;gBACH,CAAC,CAAC,SAAS,EAEf,WAAW,EACT,SAAS;gBACP,CAAC,CAAC,GAAG,EAAE;oBACH,UAAU,CAAC,OAAO,EAAE,CAAA;oBACpB,IAAI,OAAO,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,KAAK,CAAC,EAAE;wBAC/C,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;qBAClD;gBACH,CAAC;gBACH,CAAC,CAAC,SAAS,EAEf,MAAM,EACJ,SAAS;gBACP,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE;oBACJ,MAAM,IAAI,MAAM,CAAC,CAAC,EAAE,KAAK,CAAC,CAAA;oBAC1B,IAAI,OAAO,CAAC,OAAO,EAAE;wBACnB,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;qBAClD;oBACD,gBAAgB,CAAC,OAAO,GAAG,KAAK,CAAA;oBAChC,UAAU,CAAC,OAAO,GAAG,CAAC,CAAA;gBACxB,CAAC;gBACH,CAAC,CAAC,SAAS,KAEX,eAAe;YAElB,SAAS,IAAI,KAAK,KAAK,OAAO,IAAI,aAAa;YAC/C,OAAO,IAAI,KAAK,KAAK,OAAO,IAAI,OAAO;YACvC,QAAQ;YACR,OAAO,IAAI,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,QAAQ,CAAC,IAAI,OAAO;YAC9D,SAAS,IAAI,CAAC,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,QAAQ,CAAC,IAAI,aAAa,CACnE;QACL,SAAS,IAAI,CACZ,0CAAe,uCAAuC,EAAC,SAAS,EAAE,MAAM,CAAC,OAAO,KAAM,eAAe,EAAE;YACrG,0CACY,6BAA6B,EACvC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE;oBAC9B,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,UAAU;iBAC9B,CAAC,GACF,CACE,CACP,CACG,CACP,CAAA;AACH,CAAC,CAAA"}

package/lib/Table/Header.module.scss

@@ -1,6 +1,36 @@
 @use '../../styles/constants' as c;
 @use '../../styles/helpers' as h;
 
+.resizer {
+  position: absolute;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: c.$grid * 5;
+  height: 100%;
+  top: 0;
+  right: -(c.$grid * 2.5);
+  z-index: c.$zIndex100;
+  cursor: col-resize;
+  user-select: none;
+
+  // Prevents from scrolling while dragging on touch devices
+  /* doiuse-disable css-touch-action */
+  touch-action: none;
+  /* doiuse-enable css-touch-action */
+
+  .separator {
+    width: 2px;
+    height: 50%;
+    background: c.$colorNeutral;
+  }
+
+  .resizing,
+  &:hover .separator {
+    background-color: c.$colorPrimary;
+  }
+}
+
 .container {
   position: relative;
 
@@ -26,12 +56,16 @@
       &.right {
         margin-right: c.$grid * 1.25;
       }
+
+      &:not(.isSorted) {
+        color: c.$colorNeutral;
+      }
     }
 
     &.sortable {
       cursor: pointer;
 
-      &:focus {
+      &:focus-visible {
         // Do not remove outline for high-contrast modes
         // https://stackoverflow.com/a/52616313
         outline: c.$outlineWidth solid transparent;
@@ -66,34 +100,12 @@
       /* doiuse-enable css3-cursors-newer */
     }
   }
-}
 
-.resizer {
-  position: absolute;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: c.$grid * 5;
-  height: 100%;
-  top: 0;
-  right: -(c.$grid * 2.5);
-  z-index: c.$zIndex100;
-  cursor: col-resize;
-
-  // Prevents from scrolling while dragging on touch devices
-  /* doiuse-disable css-touch-action */
-  touch-action: none;
-  /* doiuse-enable css-touch-action */
-
-  .separator {
-    width: 2px;
-    height: 50%;
-    background: c.$colorNeutral;
-  }
-
-  .resizing,
-  &:hover .separator {
-    background-color: c.$colorPrimary;
+  &:last-child {
+    .resizer {
+      width: c.$grid;
+      right: 0;
+    }
   }
 }
 

package/lib/Table/Row.d.ts

@@ -1,16 +1,16 @@
 import { FC, AnchorHTMLAttributes } from 'react';
 import { TableHeaderGroupProps } from 'react-table';
-declare type RowBase = Omit<TableHeaderGroupProps, 'key'> & {
+type RowBase = Omit<TableHeaderGroupProps, 'key'> & {
     ariaRowIndex?: number;
 };
-export declare type RowProps = RowBase & {
+export type RowProps = RowBase & {
     onClick?: () => void;
 };
-export declare type LinkRowProps = RowBase & {
+export type LinkRowProps = RowBase & {
     href: string;
     AnchorComponent?: FC<AnchorHTMLAttributes<HTMLAnchorElement>>;
 };
-export declare type HeaderRowProps = RowBase;
+export type HeaderRowProps = RowBase;
 export declare const Row: FC<RowProps>;
 export declare const LinkRow: FC<LinkRowProps>;
 export declare const HeaderRow: FC<HeaderRowProps>;

package/lib/Table/Row.js

@@ -1,6 +1,7 @@
 import React, { useCallback } from 'react';
 import cn from 'classnames';
 import styles from './Row.module.scss';
+import { useUID } from 'react-uid';
 import { keyIsOneOf } from '../utils/keyboard';
 export const Row = ({ children, className, style, role, ariaRowIndex, onClick }) => {
     const onKeyPress = useCallback((event) => {
@@ -15,7 +16,10 @@ export const Row = ({ children, className, style, role, ariaRowIndex, onClick })
 };
 // eslint-disable-next-line jsx-a11y/anchor-has-content
 const DefaultAnchor = (props) => React.createElement("a", { ...props });
-export const LinkRow = ({ children, className, style, role, ariaRowIndex, href, AnchorComponent = DefaultAnchor }) => (React.createElement("div", { "data-test": "table-cell-row", className: cn(styles.linkRow, className), role: role, "aria-rowindex": ariaRowIndex },
-    React.createElement(AnchorComponent, { className: styles.link, style: style, href: href }, children)));
+export const LinkRow = ({ children, className, style, role, ariaRowIndex, href, AnchorComponent = DefaultAnchor }) => {
+    const anchorId = useUID();
+    return (React.createElement("div", { "data-test": "table-cell-row", className: cn(styles.linkRow, className), role: role, "aria-rowindex": ariaRowIndex, "aria-owns": anchorId },
+        React.createElement(AnchorComponent, { className: styles.link, style: style, href: href, id: anchorId }, children)));
+};
 export const HeaderRow = ({ children, className, style, role, ariaRowIndex }) => (React.createElement("div", { "data-test": "table-header-row", className: cn(styles.headerRow, className), style: style, role: role, "aria-rowindex": ariaRowIndex }, children));
 //# sourceMappingURL=Row.js.map

package/lib/Table/Row.js.map

@@ -1 +1 @@
-{"version":3,"file":"Row.js","sourceRoot":"","sources":["../../src/Table/Row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,WAAW,EAAuC,MAAM,OAAO,CAAA;AACnF,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAO9C,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,EAAE,EAAE;IAC/F,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,KAAoC,EAAE,EAAE;QACvC,KAAK,CAAC,cAAc,EAAE,CAAA;QACtB,IAAI,UAAU,CAAC,KAAK,EAAE,OAAO,CAAC,IAAI,OAAO,EAAE;YACzC,OAAO,EAAE,CAAA;SACV;IACH,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAA;IAED,OAAO,CACL,0CACY,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,GAAG,EACV;YACE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,OAAO;SAC9B,EACD,SAAS,CACV,EACD,KAAK,EAAE,KAAK,mBACG,YAAY,EAC3B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EACjC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,EAC5C,OAAO,EAAE,OAAO,IAEf,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,uDAAuD;AACvD,MAAM,aAAa,GAAgD,CAAC,KAAK,EAAE,EAAE,CAAC,8BAAO,KAAK,GAAI,CAAA;AAE9F,MAAM,CAAC,MAAM,OAAO,GAAqB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,eAAe,GAAG,aAAa,EAAE,EAAE,EAAE,CAAC,CACtI,0CAAe,gBAAgB,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,EAAE,IAAI,EAAE,IAAI,mBAAiB,YAAY;IAC/G,oBAAC,eAAe,IAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,IAC9D,QAAQ,CACO,CACd,CACP,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,CACnG,0CAAe,kBAAkB,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,mBAAiB,YAAY,IAChI,QAAQ,CACL,CACP,CAAA"}
+{"version":3,"file":"Row.js","sourceRoot":"","sources":["../../src/Table/Row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,WAAW,EAAuC,MAAM,OAAO,CAAA;AACnF,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAO9C,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,EAAE,EAAE;IAC/F,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,KAAoC,EAAE,EAAE;QACvC,KAAK,CAAC,cAAc,EAAE,CAAA;QACtB,IAAI,UAAU,CAAC,KAAK,EAAE,OAAO,CAAC,IAAI,OAAO,EAAE;YACzC,OAAO,EAAE,CAAA;SACV;IACH,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAA;IAED,OAAO,CACL,0CACY,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,GAAG,EACV;YACE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,OAAO;SAC9B,EACD,SAAS,CACV,EACD,KAAK,EAAE,KAAK,mBACG,YAAY,EAC3B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EACjC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,EAC5C,OAAO,EAAE,OAAO,IAEf,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,uDAAuD;AACvD,MAAM,aAAa,GAAgD,CAAC,KAAK,EAAE,EAAE,CAAC,8BAAO,KAAK,GAAI,CAAA;AAE9F,MAAM,CAAC,MAAM,OAAO,GAAqB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,eAAe,GAAG,aAAa,EAAE,EAAE,EAAE;IACrI,MAAM,QAAQ,GAAG,MAAM,EAAE,CAAA;IAEzB,OAAO,CACL,0CAAe,gBAAgB,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,EAAE,IAAI,EAAE,IAAI,mBAAiB,YAAY,eAAa,QAAQ;QACpI,oBAAC,eAAe,IAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,QAAQ,IAC5E,QAAQ,CACO,CACd,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,CACnG,0CAAe,kBAAkB,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,mBAAiB,YAAY,IAChI,QAAQ,CACL,CACP,CAAA"}

package/lib/Table/Row.module.scss

@@ -12,7 +12,7 @@
   &.clickable {
     cursor: pointer;
 
-    &:focus {
+    &:focus-visible {
       @include h.outlineSimple;
 
       // Do not remove outline for high-contrast modes
@@ -36,7 +36,7 @@
     text-decoration: none;
     background-color: inherit;
 
-    &:focus {
+    &:focus-visible {
       @include h.outlineSimple;
 
       // Do not remove outline for high-contrast modes