@hazelcast/ui 1.3.3-next.3 → 1.3.3-next.31

package/lib/Table/tableTypes.d.ts

@@ -0,0 +1,80 @@
+import { ReactNode } from 'react';
+export type RowData = object;
+export type HeaderProps<D extends RowData> = {
+    rows: RowType<D>[];
+    data: D[];
+};
+export type AccessorFn<TItem> = (item: TItem) => ReactNode | number | string | string[];
+export type Renderable<TProps> = (props: TProps) => ReactNode | JSX.Element | string;
+export type Column<D extends RowData> = {
+    id: string;
+    index: number;
+    hidden: boolean;
+    canHide: boolean;
+    columns: Column<D>[];
+};
+export type ColumnCoreType<D extends RowData = object, V = any> = {
+    width?: number;
+    minWidth?: number;
+    maxWidth?: number;
+    Footer?: string | Renderable<HeaderProps<D>>;
+    notAvailable?: boolean;
+    Cell?: Renderable<CellType<D, V>>;
+    canHide?: boolean;
+    align?: 'left' | 'center' | 'right';
+    disableResizing?: boolean;
+    disableSortBy?: boolean;
+    filterable?: boolean;
+    sortType?: (r1: RowType<D>, r2: RowType<D>) => number;
+};
+export type ColumnIdentifier<D extends RowData> = {
+    id: string;
+    accessor?: keyof D | AccessorFn<D>;
+    Header?: string | Renderable<HeaderProps<D>>;
+} | {
+    id?: never;
+    Header: string;
+    accessor?: keyof D | AccessorFn<D>;
+} | {
+    id?: never;
+    Header?: never;
+    accessor: keyof D;
+};
+export type ColumnType<D extends RowData = object, V = any> = ColumnCoreType<D, V> & ColumnIdentifier<D>;
+export type RowType<D extends RowData, K = any> = {
+    id: string;
+    getCanExpand: () => boolean;
+    getIsExpanded: () => boolean;
+    getToggleExpandedHandler: () => () => void;
+    original: D;
+    subRows: RowType<D, K>[];
+    index: number;
+    getValue: <T = K>(columnId: string) => T;
+};
+export type CellType<D extends RowData, V = any> = {
+    row: RowType<D, V>;
+    column: Column<D>;
+    value: V;
+};
+export type SortingRule = {
+    id: string;
+    desc?: boolean | undefined;
+};
+export type InitialState = Partial<TableState>;
+export type TableState = {
+    hiddenColumns: string[];
+    columnOrder: string[];
+    columnResizing: {
+        columnWidths: Record<string, number>;
+    };
+    sortBy: SortingRule[];
+    paginationOptions?: {
+        pageIndex?: number;
+        pageSize?: number;
+    };
+};
+declare module '@tanstack/react-table' {
+    interface ColumnMeta<TData, TValue> {
+        align?: 'center' | 'left' | 'right';
+    }
+}

package/lib/Table/tableTypes.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=tableTypes.js.map

package/lib/Table/tableTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tableTypes.js","sourceRoot":"","sources":["../../src/Table/tableTypes.ts"],"names":[],"mappings":""}

package/lib/Table/useTrackTableState.d.ts

@@ -0,0 +1,3 @@
+import { Table } from '@tanstack/react-table';
+import { TableState } from './tableTypes';
+export declare const useTrackTableState: <D extends object>(tableInstance: Table<D>, onChange?: ((state: TableState) => void) | null | undefined) => void;

package/lib/Table/useTrackTableState.js

@@ -0,0 +1,30 @@
+import { useEffect, useRef } from 'react';
+import { useRefValue } from '../hooks';
+export const useTrackTableState = (tableInstance, onChange) => {
+    const { columnOrder, columnVisibility, columnSizing, sorting, pagination: { pageSize }, } = tableInstance.getState();
+    const skippedInitialStateChangeRef = useRef(false);
+    const getOnChange = useRefValue(onChange);
+    useEffect(() => {
+        const cb = getOnChange();
+        if (cb && skippedInitialStateChangeRef.current) {
+            cb({
+                sortBy: sorting,
+                paginationOptions: { pageSize },
+                columnOrder: columnOrder,
+                columnResizing: {
+                    columnWidths: columnSizing,
+                },
+                hiddenColumns: Object.entries(columnVisibility).reduce((res, [id, visible]) => {
+                    if (!visible) {
+                        return [...res, id];
+                    }
+                    return res;
+                }, []),
+            });
+        }
+        else {
+            skippedInitialStateChangeRef.current = true;
+        }
+    }, [sorting, pageSize, columnOrder, columnVisibility, columnSizing, getOnChange]);
+};
+//# sourceMappingURL=useTrackTableState.js.map

package/lib/Table/useTrackTableState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrackTableState.js","sourceRoot":"","sources":["../../src/Table/useTrackTableState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAGtC,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAoB,aAAuB,EAAE,QAA+C,EAAE,EAAE;IAChI,MAAM,EACJ,WAAW,EACX,gBAAgB,EAChB,YAAY,EACZ,OAAO,EACP,UAAU,EAAE,EAAE,QAAQ,EAAE,GACzB,GAAG,aAAa,CAAC,QAAQ,EAAE,CAAA;IAC5B,MAAM,4BAA4B,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IAClD,MAAM,WAAW,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAA;IAEzC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,GAAG,WAAW,EAAE,CAAA;QACxB,IAAI,EAAE,IAAI,4BAA4B,CAAC,OAAO,EAAE;YAC9C,EAAE,CAAC;gBACD,MAAM,EAAE,OAAwB;gBAChC,iBAAiB,EAAE,EAAE,QAAQ,EAAE;gBAC/B,WAAW,EAAE,WAAW;gBACxB,cAAc,EAAE;oBACd,YAAY,EAAE,YAAY;iBAC3B;gBACD,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,MAAM,CAAW,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,OAAO,CAAC,EAAE,EAAE;oBACtF,IAAI,CAAC,OAAO,EAAE;wBACZ,OAAO,CAAC,GAAG,GAAG,EAAE,EAAE,CAAC,CAAA;qBACpB;oBAED,OAAO,GAAG,CAAA;gBACZ,CAAC,EAAE,EAAE,CAAC;aACP,CAAC,CAAA;SACH;aAAM;YACL,4BAA4B,CAAC,OAAO,GAAG,IAAI,CAAA;SAC5C;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,gBAAgB,EAAE,YAAY,EAAE,WAAW,CAAC,CAAC,CAAA;AACnF,CAAC,CAAA"}

package/lib/Table/utils.d.ts

@@ -0,0 +1,16 @@
+import { CSSProperties } from 'react';
+import { ColumnDef, Row as TableRow, InitialTableState, Cell, Column as TableColumn } from '@tanstack/react-table';
+import { CellType, ColumnType, InitialState, RowType, Column } from './tableTypes';
+export declare const prepareRow: <D extends object>({ getCanExpand, getIsExpanded, getToggleExpandedHandler, original, subRows, id, index, getValue, }: TableRow<D>) => RowType<D, any>;
+export declare const prepareColumn: <D extends object>({ id, columns, getIndex, getCanHide, getIsVisible }: TableColumn<D, unknown>) => Column<D>;
+export declare const prepareCell: <D extends object, V = unknown>({ getValue, row, column }: Cell<D, V>) => CellType<D, V>;
+export declare const getColumnDef: <D extends object>({ id, width: size, minWidth: minSize, maxWidth: maxSize, Header, Footer, Cell, align, filterable, disableSortBy, disableResizing, canHide: enableHiding, sortType: sortingFn, accessor, }: ColumnType<D, any>) => ColumnDef<D, unknown>;
+export declare const getTableInitialState: ({ hiddenColumns, columnOrder, sortBy, columnResizing, paginationOptions: pagination, }: InitialState) => InitialTableState;
+export declare const getCellStyle: ({ size: width, minSize: minWidth, maxSize: maxWidth, }: {
+    size: number;
+    minSize?: number;
+    maxSize?: number;
+}) => CSSProperties;
+export declare const getRowStyle: ({ totalSize }: {
+    totalSize: number;
+}) => CSSProperties;

package/lib/Table/utils.js

@@ -0,0 +1,121 @@
+export const prepareRow = ({ getCanExpand, getIsExpanded, getToggleExpandedHandler, original, subRows, id, index, getValue, }) => ({
+    id,
+    getCanExpand,
+    getIsExpanded,
+    getToggleExpandedHandler,
+    original,
+    index,
+    getValue,
+    subRows: subRows.map(prepareRow),
+});
+export const prepareColumn = ({ id, columns, getIndex, getCanHide, getIsVisible }) => ({
+    id,
+    index: getIndex(),
+    canHide: getCanHide(),
+    hidden: !getIsVisible(),
+    columns: columns.map(prepareColumn),
+});
+export const prepareCell = ({ getValue, row, column }) => ({
+    column: prepareColumn(column),
+    value: getValue(),
+    row: prepareRow(row),
+});
+const getRendererProps = (props) => {
+    const rendererProps = {
+        rows: [],
+        data: [],
+    };
+    props.table.getRowModel().rows.forEach((row) => {
+        const item = prepareRow(row);
+        rendererProps.rows.push(item);
+        rendererProps.data.push(item.original);
+    });
+    return rendererProps;
+};
+export const getColumnDef = ({ id, width: size, minWidth: minSize, maxWidth: maxSize, Header, Footer, Cell, align, filterable, disableSortBy, disableResizing, canHide: enableHiding, sortType: sortingFn, accessor, }) => {
+    const commonDef = {
+        id,
+        header: typeof Header === 'function' ? (props) => Header(getRendererProps(props)) : Header,
+        footer: typeof Footer === 'function' ? (props) => Footer(getRendererProps(props)) : Footer,
+        enableHiding,
+        sortDescFirst: false,
+        enableSorting: true,
+        meta: { align },
+        enableResizing: !disableResizing,
+    };
+    if (size != undefined) {
+        commonDef.size = size;
+    }
+    if (minSize != undefined) {
+        commonDef.minSize = minSize;
+    }
+    if (maxSize !== undefined) {
+        commonDef.maxSize = maxSize;
+    }
+    if (sortingFn != undefined) {
+        commonDef.sortingFn = (rowA, rowB) => sortingFn(prepareRow(rowA), prepareRow(rowB));
+    }
+    if (Cell != undefined) {
+        commonDef.cell =
+            typeof Cell === 'function'
+                ? (props) => Cell({ column: prepareColumn(props.column), row: prepareRow(props.row), value: props.getValue() })
+                : Cell;
+    }
+    if (filterable !== undefined) {
+        commonDef.enableColumnFilter = filterable;
+    }
+    if (disableSortBy !== undefined) {
+        commonDef.enableSorting = !disableSortBy;
+    }
+    if (accessor != undefined) {
+        if (typeof accessor === 'function') {
+            return {
+                id: '',
+                ...commonDef,
+                accessorFn: (value) => accessor(value),
+            };
+        }
+        return {
+            ...commonDef,
+            accessorKey: accessor,
+        };
+    }
+    return commonDef;
+};
+const getColumnVisibility = (hiddenColumns) => {
+    const result = {};
+    hiddenColumns === null || hiddenColumns === void 0 ? void 0 : hiddenColumns.forEach((column) => {
+        result[column] = false;
+    });
+    return result;
+};
+export const getTableInitialState = ({ hiddenColumns, columnOrder, sortBy, columnResizing, paginationOptions: pagination, }) => {
+    var _a, _b;
+    return ({
+        pagination,
+        columnOrder,
+        columnSizing: (_a = columnResizing === null || columnResizing === void 0 ? void 0 : columnResizing.columnWidths) !== null && _a !== void 0 ? _a : {},
+        columnVisibility: getColumnVisibility(hiddenColumns),
+        sorting: (_b = sortBy === null || sortBy === void 0 ? void 0 : sortBy.map(({ id, desc }) => ({ id, desc: !!desc }))) !== null && _b !== void 0 ? _b : [],
+    });
+};
+export const getCellStyle = ({ size: width, minSize: minWidth, maxSize: maxWidth, }) => {
+    const style = {
+        width,
+        minWidth: minWidth || width,
+        flex: `${width} 0 auto`,
+        boxSizing: 'border-box',
+    };
+    if (maxWidth) {
+        style.maxWidth = maxWidth;
+    }
+    return style;
+};
+export const getRowStyle = ({ totalSize }) => {
+    // fix unit tests console error "`NaN` is an invalid value"
+    const minWidth = isNaN(totalSize) ? 0 : totalSize;
+    return {
+        minWidth,
+    };
+};
+//# sourceMappingURL=utils.js.map

package/lib/Table/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/Table/utils.tsx"],"names":[],"mappings":"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"}

package/lib/Tabs/Tab.d.ts

@@ -1,5 +1,4 @@
 import { FC, MouseEvent, KeyboardEvent, ReactNode } from 'react';
-import { IconProps } from '../Icon';
 export type AnchorTabProps = {
     component: 'a';
     href: string;
@@ -10,25 +9,8 @@ export type ButtonTabProps = {
 };
 type TabTypeProps = AnchorTabProps | ButtonTabProps;
 type TabLabelProps = {
-    /** @deprecated The property should not be used */
-    label: string;
-    icon: IconProps['icon'];
-    iconAriaLabel: string;
-    children?: never;
-    ariaLabel?: never;
-} | {
-    /** @deprecated The property should not be used */
-    label: string;
-    icon?: never;
-    iconAriaLabel?: never;
-    children?: never;
-    ariaLabel?: never;
-} | {
-    label?: never;
-    icon?: never;
-    iconAriaLabel?: never;
     children: ReactNode;
-    ariaLabel: string;
+    ariaLabel?: string;
 };
 export type TabCommonProps = {
     value: number;

package/lib/Tabs/Tab.js

@@ -1,6 +1,5 @@
 import React, { useCallback } from 'react';
 import cn from 'classnames';
-import { Icon } from '../Icon';
 import { useTabContext, getTabId, getPanelId } from './TabContext';
 import { keyIsOneOf } from '../utils/keyboard';
 import styles from './Tab.module.scss';
@@ -15,16 +14,7 @@ import styles from './Tab.module.scss';
  * More info - https://www.w3.org/TR/wai-aria-practices/#kbd_selection_follows_focus
  *
  */
-export const Tab = ({ component: Component = 'button', 
-/**
- * @deprecated The property should not be used
- */
-label, value, href, onClick, 
-/** @deprecated The property should not be used */
-icon, 
-/** @deprecated The property should not be used */
-iconAriaLabel, children, ariaLabel, className, }) => {
-    var _a;
+export const Tab = ({ component: Component = 'button', value, href, onClick, children, ariaLabel, className }) => {
     const { onChange, value: activeValue, idPrefix, fullWidth } = useTabContext();
     const selected = value === activeValue;
     const handleClick = useCallback((event) => {
@@ -44,10 +34,6 @@ iconAriaLabel, children, ariaLabel, className, }) => {
             handleClick(event);
         }
     }, [handleClick]);
-    return (React.createElement(Component, { className: cn(styles.tab, { [styles.selected]: selected, [styles.fullWidth]: fullWidth }, className), role: "tab", id: getTabId(idPrefix, value.toString()), "aria-controls": getPanelId(idPrefix, value.toString()), "aria-selected": selected, tabIndex: selected ? 0 : -1, onKeyPress: onKeyPress, onClick: handleClick, ...(Component === 'a' && !selected && { href }), "aria-label": label !== null && label !== void 0 ? label : ariaLabel }, children
-        ? children
-        : (_a = (icon && iconAriaLabel && (React.createElement("span", null,
-            React.createElement(Icon, { icon: icon, ariaLabel: iconAriaLabel, className: styles.icon }),
-            label)))) !== null && _a !== void 0 ? _a : label));
+    return (React.createElement(Component, { className: cn(styles.tab, { [styles.selected]: selected, [styles.fullWidth]: fullWidth }, className), role: "tab", id: getTabId(idPrefix, value.toString()), "aria-controls": getPanelId(idPrefix, value.toString()), "aria-selected": selected, tabIndex: selected ? 0 : -1, onKeyPress: onKeyPress, onClick: handleClick, ...(Component === 'a' && !selected && { href }), "aria-label": ariaLabel }, children));
 };
 //# sourceMappingURL=Tab.js.map

package/lib/Tabs/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../src/Tabs/Tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,WAAW,EAAwC,MAAM,OAAO,CAAA;AACpF,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,IAAI,EAAa,MAAM,SAAS,CAAA;AACzC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAE9C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AA8CtC;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAChC,SAAS,EAAE,SAAS,GAAG,QAAQ;AAC/B;;GAEG;AACH,KAAK,EACL,KAAK,EACL,IAAI,EACJ,OAAO;AACP,kDAAkD;AAClD,IAAI;AACJ,kDAAkD;AAClD,aAAa,EACb,QAAQ,EACR,SAAS,EACT,SAAS,GACV,EAAE,EAAE;;IACH,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,aAAa,EAAE,CAAA;IAC7E,MAAM,QAAQ,GAAG,KAAK,KAAK,WAAW,CAAA;IAEtC,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,KAA+G,EAAE,EAAE;QAClH,IAAI,QAAQ,EAAE;YACZ,OAAM;SACP;QAED,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,KAAK,CAAC,CAAA;SACf;QAED,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjB,CAAC,EACD,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,CAAC,CACrC,CAAA;IAED,wDAAwD;IACxD,+DAA+D;IAC/D,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,KAA2D,EAAE,EAAE;QAC9D,KAAK,CAAC,cAAc,EAAE,CAAA;QAEtB,IAAI,UAAU,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,EAAE;YACvC,WAAW,CAAC,KAAK,CAAC,CAAA;SACnB;IACH,CAAC,EACD,CAAC,WAAW,CAAC,CACd,CAAA;IAED,OAAO,CACL,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,CAAC,EACpG,IAAI,EAAC,KAAK,EACV,EAAE,EAAE,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,mBACzB,UAAU,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,mBACtC,QAAQ,EACvB,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC3B,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,WAAW,KAChB,CAAC,SAAS,KAAK,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,IAAI,EAAE,CAAC,gBACpC,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,SAAS,IAE7B,QAAQ;QACP,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,MAAA,CAAC,IAAI,IAAI,aAAa,IAAI,CACxB;YACE,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,GAAI;YACrE,KAAK,CACD,CACR,CAAC,mCACF,KAAK,CACC,CACb,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../src/Tabs/Tab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAM,WAAW,EAAwC,MAAM,OAAO,CAAA;AACpF,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAE9C,OAAO,MAAM,MAAM,mBAAmB,CAAA;AA0BtC;;;;;;;;;;GAUG;AAEH,MAAM,CAAC,MAAM,GAAG,GAAiB,CAAC,EAAE,SAAS,EAAE,SAAS,GAAG,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,EAAE;IAC7H,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,aAAa,EAAE,CAAA;IAC7E,MAAM,QAAQ,GAAG,KAAK,KAAK,WAAW,CAAA;IAEtC,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,KAA+G,EAAE,EAAE;QAClH,IAAI,QAAQ,EAAE;YACZ,OAAM;SACP;QAED,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,KAAK,CAAC,CAAA;SACf;QAED,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjB,CAAC,EACD,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,CAAC,CACrC,CAAA;IAED,wDAAwD;IACxD,+DAA+D;IAC/D,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,KAA2D,EAAE,EAAE;QAC9D,KAAK,CAAC,cAAc,EAAE,CAAA;QAEtB,IAAI,UAAU,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,EAAE;YACvC,WAAW,CAAC,KAAK,CAAC,CAAA;SACnB;IACH,CAAC,EACD,CAAC,WAAW,CAAC,CACd,CAAA;IAED,OAAO,CACL,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE,SAAS,CAAC,EACpG,IAAI,EAAC,KAAK,EACV,EAAE,EAAE,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,mBACzB,UAAU,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,mBACtC,QAAQ,EACvB,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAC3B,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,WAAW,KAChB,CAAC,SAAS,KAAK,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,IAAI,EAAE,CAAC,gBACpC,SAAS,IAEpB,QAAQ,CACC,CACb,CAAA;AACH,CAAC,CAAA"}

package/lib/Tabs/Tab.module.scss

@@ -24,10 +24,6 @@
   @include c.typographyH3;
   @include h.overflowEllipsis;
 
-  .icon {
-    margin-right: c.$grid * 2;
-  }
-
   &.selected {
     color: c.$colorPrimary;
     border-radius: 0;

package/lib/Tabs/TabPanel.d.ts

@@ -1,8 +1,9 @@
 import { FC, ReactNode } from 'react';
+import { DataTestProp } from '@hazelcast/helpers';
 export type TabPanelProps = {
     value: number;
     children: ReactNode;
-};
+} & DataTestProp;
 /**
  * ### Purpose
  * Serves as a container for tab content.

package/lib/Tabs/TabPanel.js

@@ -9,9 +9,9 @@ import styles from './TabPanel.module.scss';
  * ### General Info
  * - Is hidden unless its associated tab control is activated.
  */
-export const TabPanel = ({ value, children }) => {
+export const TabPanel = ({ value, children, 'data-test': dataTest }) => {
     const { idPrefix, value: selectedValue } = useTabContext();
     const selected = value === selectedValue;
-    return (React.createElement("div", { className: cn(styles.tabPanel, { [styles.hidden]: !selected }), role: "tabpanel", id: getPanelId(idPrefix, value.toString()), "aria-labelledby": getTabId(idPrefix, value.toString()) }, selected ? children : null));
+    return (React.createElement("div", { className: cn(styles.tabPanel, { [styles.hidden]: !selected }), role: "tabpanel", "data-test": dataTest, id: getPanelId(idPrefix, value.toString()), "aria-labelledby": getTabId(idPrefix, value.toString()) }, selected ? children : null));
 };
 //# sourceMappingURL=TabPanel.js.map

package/lib/Tabs/TabPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabPanel.js","sourceRoot":"","sources":["../../src/Tabs/TabPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAElE,OAAO,MAAM,MAAM,wBAAwB,CAAA;AAO3C;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAsB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;IACjE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,GAAG,aAAa,EAAE,CAAA;IAC1D,MAAM,QAAQ,GAAG,KAAK,KAAK,aAAa,CAAA;IAExC,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAC9D,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,UAAU,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,qBACzB,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,IAEpD,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CACvB,CACP,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"TabPanel.js","sourceRoot":"","sources":["../../src/Tabs/TabPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAA;AAC5C,OAAO,EAAE,MAAM,YAAY,CAAA;AAG3B,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAElE,OAAO,MAAM,MAAM,wBAAwB,CAAA;AAO3C;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAsB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE;IACxF,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,GAAG,aAAa,EAAE,CAAA;IAC1D,MAAM,QAAQ,GAAG,KAAK,KAAK,aAAa,CAAA;IAExC,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAC9D,IAAI,EAAC,UAAU,eACJ,QAAQ,EACnB,EAAE,EAAE,UAAU,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,qBACzB,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,IAEpD,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CACvB,CACP,CAAA;AACH,CAAC,CAAA"}

package/lib/TextArea.js

@@ -7,7 +7,7 @@ import { Error, errorId } from './Error';
 import { FieldHeader } from './FieldHeader';
 import styles from './TextArea.module.scss';
 export const TextArea = (props) => {
-    const { error, label, name, onBlur, onChange, placeholder, value, disabled, className, labelClassName, textareaClassName, errorClassName, required, resizable = true, helperText, size = 'medium', 'data-test': dataTest, ...htmlAttrs } = props;
+    const { error, label, name, onBlur, onChange, placeholder, value, disabled, className, labelClassName, textareaClassName, errorClassName, required, resizable = true, helperText, size = 'medium', 'data-test': dataTest = 'textarea', ...htmlAttrs } = props;
     const id = useUID();
     const popperRef = useRef();
     const [resizeListener, sizes] = useResizeAware();
@@ -22,7 +22,7 @@ export const TextArea = (props) => {
             [styles.hasError]: error,
             [styles.withError]: 'error' in props,
         }, className) },
-        React.createElement(FieldHeader, { "data-test": "textarea", label: label, id: id, helperText: helperText, labelClassName: labelClassName, size: size }),
+        React.createElement(FieldHeader, { "data-test": dataTest, label: label, id: id, helperText: helperText, labelClassName: labelClassName, size: size }),
         React.createElement("div", { className: styles.textAreaContainer },
             React.createElement("div", { className: styles.textAreaWrapper },
                 React.createElement("textarea", { "aria-invalid": !!error, "aria-required": required, "aria-errormessage": error && errorId(id), id: id, className: cn({
@@ -30,6 +30,6 @@ export const TextArea = (props) => {
                     }, textareaClassName), placeholder: placeholder, name: name, onBlur: onBlur, onChange: onChange, required: required, value: value !== null && value !== void 0 ? value : '', disabled: disabled, ...htmlAttrs }),
                 React.createElement("div", { className: styles.borderOverlay }),
                 helperText && resizeListener)),
-        React.createElement(Error, { truncated: true, error: error, className: cn(styles.errorContainer, errorClassName), inputId: id })));
+        React.createElement(Error, { "data-test": `${dataTest}-error`, truncated: true, error: error, className: cn(styles.errorContainer, errorClassName), inputId: id })));
 };
 //# sourceMappingURL=TextArea.js.map

package/lib/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA+B,MAAM,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,cAAc,MAAM,oBAAoB,CAAA;AAE/C,OAAO,yBAAyB,MAAM,yCAAyC,CAAA;AAC/E,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAElC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AACxC,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAG7D,OAAO,MAAM,MAAM,wBAAwB,CAAA;AAsB3C,MAAM,CAAC,MAAM,QAAQ,GAAsB,CAAC,KAAK,EAAE,EAAE;IACnD,MAAM,EACJ,KAAK,EACL,KAAK,EACL,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,WAAW,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,cAAc,EACd,QAAQ,EACR,SAAS,GAAG,IAAI,EAChB,UAAU,EACV,IAAI,GAAG,QAAQ,EACf,WAAW,EAAE,QAAQ,EACrB,GAAG,SAAS,EACb,GAAG,KAAK,CAAA;IACT,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;IAEnB,MAAM,SAAS,GAAG,MAAM,EAAa,CAAA;IACrC,MAAM,CAAC,cAAc,EAAE,KAAK,CAAC,GAAG,cAAc,EAAE,CAAA;IAEhD,yBAAyB,CAAC,GAAG,EAAE;;QAC7B,IAAI,KAAK,CAAC,MAAM,EAAE;YAChB,MAAA,MAAA,SAAS,CAAC,OAAO,0CAAE,WAAW,kDAAI,CAAA;SACnC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAElB,OAAO,CACL,0CACa,QAAQ,EACnB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,SAAS,EAChB;YACE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;YAC3B,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,KAAK;YACxB,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,OAAO,IAAI,KAAK;SACrC,EACD,SAAS,CACV;QAED,oBAAC,WAAW,iBAAW,UAAU,EAAC,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,cAAc,EAAE,IAAI,EAAE,IAAI,GAAI;QAC9H,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB;YACtC,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe;gBACpC,kDACgB,CAAC,CAAC,KAAK,mBACN,QAAQ,uBACJ,KAAK,IAAI,OAAO,CAAC,EAAE,CAAC,EACvC,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,EAAE,CACX;wBACE,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC,SAAS;qBAClC,EACD,iBAAiB,CAClB,EACD,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE,EAClB,QAAQ,EAAE,QAAQ,KACd,SAAS,GACb;gBACF,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa,GAAI;gBACvC,UAAU,IAAI,cAAc,CACzB,CACF;QACN,oBAAC,KAAK,IAAC,SAAS,QAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,cAAc,EAAE,cAAc,CAAC,EAAE,OAAO,EAAE,EAAE,GAAI,CAChG,CACP,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../src/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA+B,MAAM,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,cAAc,MAAM,oBAAoB,CAAA;AAE/C,OAAO,yBAAyB,MAAM,yCAAyC,CAAA;AAC/E,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAElC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AACxC,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAA;AAG7D,OAAO,MAAM,MAAM,wBAAwB,CAAA;AAsB3C,MAAM,CAAC,MAAM,QAAQ,GAAsB,CAAC,KAAK,EAAE,EAAE;IACnD,MAAM,EACJ,KAAK,EACL,KAAK,EACL,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,WAAW,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,cAAc,EACd,QAAQ,EACR,SAAS,GAAG,IAAI,EAChB,UAAU,EACV,IAAI,GAAG,QAAQ,EACf,WAAW,EAAE,QAAQ,GAAG,UAAU,EAClC,GAAG,SAAS,EACb,GAAG,KAAK,CAAA;IACT,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;IAEnB,MAAM,SAAS,GAAG,MAAM,EAAa,CAAA;IACrC,MAAM,CAAC,cAAc,EAAE,KAAK,CAAC,GAAG,cAAc,EAAE,CAAA;IAEhD,yBAAyB,CAAC,GAAG,EAAE;;QAC7B,IAAI,KAAK,CAAC,MAAM,EAAE;YAChB,MAAA,MAAA,SAAS,CAAC,OAAO,0CAAE,WAAW,kDAAI,CAAA;SACnC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAA;IAElB,OAAO,CACL,0CACa,QAAQ,EACnB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,SAAS,EAChB;YACE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ;YAC3B,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,KAAK;YACxB,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,OAAO,IAAI,KAAK;SACrC,EACD,SAAS,CACV;QAED,oBAAC,WAAW,iBAAY,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,cAAc,EAAE,IAAI,EAAE,IAAI,GAAI;QAC9H,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB;YACtC,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe;gBACpC,kDACgB,CAAC,CAAC,KAAK,mBACN,QAAQ,uBACJ,KAAK,IAAI,OAAO,CAAC,EAAE,CAAC,EACvC,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,EAAE,CACX;wBACE,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC,SAAS;qBAClC,EACD,iBAAiB,CAClB,EACD,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE,EAClB,QAAQ,EAAE,QAAQ,KACd,SAAS,GACb;gBACF,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa,GAAI;gBACvC,UAAU,IAAI,cAAc,CACzB,CACF;QACN,oBAAC,KAAK,iBAAY,GAAG,QAAQ,QAAQ,EAAE,SAAS,QAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,cAAc,EAAE,cAAc,CAAC,EAAE,OAAO,EAAE,EAAE,GAAI,CAChI,CACP,CAAA;AACH,CAAC,CAAA"}

package/lib/TextField.js

@@ -18,7 +18,7 @@ import styles from './TextField.module.scss';
  *
  * ### General Info
  * - Text Field is available in 2 variations: `small` (height of 30 px) and `medium` (height of 40 px). The use depends mainly on the space in UI.
- * - All of the variations can be either with the label, or without label.
+ * - All the variations can be either with the label, or without label.
  * - Standard label alignment is left-aligned with the field underneath.
  * - If needed, you can use icon on the left side or on the right side inside the Text Input (e.g. Eye icon to show / hide password).
  *
@@ -26,7 +26,7 @@ import styles from './TextField.module.scss';
  * Use a text input when the expected user input is a single line of text.
  */
 const TextFieldInternal = (props, ref) => {
-    const { 'data-test': dataTest, ariaLabel, className, disabled, error, errorClassName, helperText, helperTextTooltipWordBreak, id: explicitId, inputClassName, inputContainerChild, inputContainerClassName, inputBorderOverlayClassName, inputIcon, inputTrailingIcon, inputTrailingIconLabel, label, labelClassName, showAriaLabel = false, name, size = 'medium', variant = 'primary', onBlur, onFocus, onChange, onKeyPress, placeholder, required, type = 'text', value, readOnly, onClick, clearable, iconSize = size, errorTooltipPlacement = 'top', children, ...htmlAttrs } = props;
+    const { 'data-test': dataTest = 'text-field', ariaLabel, className, disabled, error, errorClassName, helperText, helperTextTooltipWordBreak, id: explicitId, inputClassName, inputContainerChild, inputContainerClassName, inputBorderOverlayClassName, inputIcon, inputTrailingIcon, inputTrailingIconLabel, label, labelClassName, showAriaLabel = false, name, size = 'medium', variant = 'primary', onBlur, onFocus, onChange, onKeyPress, placeholder, required, type = 'text', value, readOnly, onClick, clearable, iconSize = size, errorTooltipPlacement = 'top', children, ...htmlAttrs } = props;
     const autoId = useUID();
     const id = explicitId !== null && explicitId !== void 0 ? explicitId : autoId;
     const inputRef = useRef(null);
@@ -46,10 +46,10 @@ const TextFieldInternal = (props, ref) => {
             [styles.withIcon]: inputIcon,
             [styles.empty]: value === undefined,
         }, className) },
-        React.createElement(FieldHeader, { id: id, size: size, label: label, variant: variant, helperText: helperText, showAriaLabel: showAriaLabel, labelClassName: labelClassName, helperTextTooltipWordBreak: helperTextTooltipWordBreak }),
+        React.createElement(FieldHeader, { id: id, size: size, label: label, variant: variant, helperText: helperText, showAriaLabel: showAriaLabel, labelClassName: labelClassName, "data-test": `${dataTest}-header`, helperTextTooltipWordBreak: helperTextTooltipWordBreak }),
         React.createElement("div", { className: styles.inputBlock },
             React.createElement("div", { className: cn(styles.inputContainer, inputContainerClassName) },
-                React.createElement("input", { type: type, id: id, ref: mergedRef, value: value !== null && value !== void 0 ? value : '', name: name, onChange: onChange, onBlur: onBlur, onFocus: onFocus, readOnly: readOnly, onKeyPress: onKeyPress, onClick: onClick, "aria-label": showAriaLabel ? ariaLabel : undefined, "aria-invalid": !!error, "aria-required": required, "aria-describedby": helperText && helpTooltipId(id), "aria-errormessage": error && errorId(id), disabled: disabled, placeholder: placeholder, className: cn(inputClassName, {
+                React.createElement("input", { type: type, id: id, ref: mergedRef, value: value !== null && value !== void 0 ? value : '', name: name, onChange: onChange, onBlur: onBlur, onFocus: onFocus, readOnly: readOnly, onKeyPress: onKeyPress, onClick: onClick, "aria-label": showAriaLabel ? ariaLabel || label : undefined, "aria-invalid": !!error, "aria-required": required, "aria-describedby": helperText && helpTooltipId(id), "aria-errormessage": error && errorId(id), disabled: disabled, placeholder: placeholder, className: cn(inputClassName, {
                         [styles.trailingIcon]: inputTrailingIcon,
                     }), ...htmlAttrs }),
                 React.createElement("div", { className: cn(styles.borderOverlay, inputBorderOverlayClassName) }),
@@ -58,7 +58,7 @@ const TextFieldInternal = (props, ref) => {
                 inputContainerChild,
                 inputTrailingIcon && inputTrailingIconLabel && (React.createElement(Icon, { icon: inputTrailingIcon, ariaLabel: inputTrailingIconLabel, containerClassName: cn(styles.inputIconContainer, styles.inputTrailingIconContainer), className: styles.inputIconTrailing, size: iconSize }))),
             children),
-        React.createElement(Error, { truncated: true, inputId: id, error: error, tooltipPlacement: errorTooltipPlacement, className: cn(styles.errorContainer, errorClassName) })));
+        React.createElement(Error, { truncated: true, inputId: id, error: error, "data-test": `${dataTest}-error`, tooltipPlacement: errorTooltipPlacement, className: cn(styles.errorContainer, errorClassName) })));
 };
 const TextFieldWithRef = forwardRef(TextFieldInternal);
 export const TextField = ({ mRef, ...props }) => (React.createElement(TextFieldWithRef, { ref: mRef, ...props }));

package/lib/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../src/TextField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../src/TextField.tsx"],"names":[],"mappings":"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"}

package/lib/TimeField.js

@@ -5,11 +5,11 @@ import SimpleTimeField from 'react-simple-timefield';
 import styles from './TimeField.module.scss';
 import { TextField } from './TextField';
 export const TimeField = (props) => {
-    const { 'data-test': dataTest, className, disabled, error, errorClassName, id: explicitId, inputClassName, label, labelClassName, name, onBlur, onChange, required, seconds = false, value, helperText, size, showAriaLabel, ...rest } = props;
+    const { 'data-test': dataTest = 'time-field', className, disabled, error, errorClassName, id: explicitId, inputClassName, label, labelClassName, name, onBlur, onChange, required, seconds = false, value, helperText, size, showAriaLabel, ...rest } = props;
     // Use an auto generated id if it's not set explicitly
     const autoId = useUID();
     const id = explicitId !== null && explicitId !== void 0 ? explicitId : autoId;
-    return (React.createElement("div", { "data-test": dataTest, className: cn(styles.container, className) },
-        React.createElement(SimpleTimeField, { showSeconds: seconds, input: React.createElement(TextField, { name: name, id: id, label: label, error: error, onChange: onChange, errorClassName: errorClassName, inputClassName: inputClassName, labelClassName: labelClassName, onBlur: onBlur, size: size, required: required, disabled: disabled, showAriaLabel: showAriaLabel, helperText: helperText, ...rest }), onChange: onChange, value: value })));
+    return (React.createElement("div", { className: cn(styles.container, className) },
+        React.createElement(SimpleTimeField, { showSeconds: seconds, input: React.createElement(TextField, { name: name, id: id, label: label, error: error, onChange: onChange, errorClassName: errorClassName, inputClassName: inputClassName, labelClassName: labelClassName, onBlur: onBlur, size: size, required: required, disabled: disabled, showAriaLabel: showAriaLabel, helperText: helperText, "data-test": dataTest, ...rest }), onChange: onChange, value: value })));
 };
 //# sourceMappingURL=TimeField.js.map

package/lib/TimeField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeField.js","sourceRoot":"","sources":["../src/TimeField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAC/E,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,eAAe,MAAM,wBAAwB,CAAA;AAKpD,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAmBvC,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,KAAK,EAAE,EAAE;IACrD,MAAM,EACJ,WAAW,EAAE,QAAQ,EACrB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,cAAc,EACd,EAAE,EAAE,UAAU,EACd,cAAc,EACd,KAAK,EACL,cAAc,EACd,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,KAAK,EACL,UAAU,EACV,IAAI,EACJ,aAAa,EACb,GAAG,IAAI,EACR,GAAG,KAAK,CAAA;IACT,sDAAsD;IACtD,MAAM,MAAM,GAAG,MAAM,EAAE,CAAA;IACvB,MAAM,EAAE,GAAG,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,MAAM,CAAA;IAE/B,OAAO,CACL,0CAAgB,QAAQ,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC;QAClE,oBAAC,eAAe,IACd,WAAW,EAAE,OAAO,EACpB,KAAK,EACH,oBAAC,SAAS,IACR,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAC9B,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,KAClB,IAAI,GACR,EAEJ,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,GACZ,CACE,CACP,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"TimeField.js","sourceRoot":"","sources":["../src/TimeField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAC/E,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,eAAe,MAAM,wBAAwB,CAAA;AAKpD,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAmBvC,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,KAAK,EAAE,EAAE;IACrD,MAAM,EACJ,WAAW,EAAE,QAAQ,GAAG,YAAY,EACpC,SAAS,EACT,QAAQ,EACR,KAAK,EACL,cAAc,EACd,EAAE,EAAE,UAAU,EACd,cAAc,EACd,KAAK,EACL,cAAc,EACd,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,KAAK,EACL,UAAU,EACV,IAAI,EACJ,aAAa,EACb,GAAG,IAAI,EACR,GAAG,KAAK,CAAA;IACT,sDAAsD;IACtD,MAAM,MAAM,GAAG,MAAM,EAAE,CAAA;IACvB,MAAM,EAAE,GAAG,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,MAAM,CAAA;IAE/B,OAAO,CACL,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC;QAC7C,oBAAC,eAAe,IACd,WAAW,EAAE,OAAO,EACpB,KAAK,EACH,oBAAC,SAAS,IACR,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,EAC9B,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,eACX,QAAQ,KACf,IAAI,GACR,EAEJ,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,GACZ,CACE,CACP,CAAA;AACH,CAAC,CAAA"}

package/lib/Toast.d.ts

@@ -1,5 +1,6 @@
 import React, { FC, ReactNode } from 'react';
 import { Icon as IconType } from 'react-feather';
+import { DataTestProp } from '@hazelcast/helpers';
 export type ToastType = 'success' | 'info' | 'warning' | 'critical';
 export type ToastIconDescriptor = {
     icon: IconType;
@@ -14,7 +15,7 @@ export type ToastProps = {
     dismissableByEscKey?: boolean;
     closeToast?: (e?: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
     className?: string;
-};
+} & DataTestProp;
 /**
  * ### Purpose
  * A toast is a non-modal dialog that appears and disappears in the span of a few seconds. It may also optionally have a small close “X”. Typically, toast messages display one or two-line non-critical messages that do not require user interaction. For example: In a map client, once you hit the search button the toast may display a message that looks something like “Searching for location” which disappears once the matching results or “no results found” is displayed.

package/lib/Toast.js

@@ -34,7 +34,7 @@ export const ToastIcon = {
  * ### Note
  * The toast is designed to be integrated with https://fkhadra.github.io/react-toastify/introduction/
  */
-export const Toast = ({ type, content, dismissableByEscKey = true, closeToast, className }) => {
+export const Toast = ({ type, content, dismissableByEscKey = true, closeToast, className, 'data-test': dataTest = 'toast', }) => {
     const { icon, ariaLabel } = ToastIcon[type];
     const closeByEsc = useCallback((nativeEvent) => {
         if (dismissableByEscKey) {
@@ -43,14 +43,14 @@ export const Toast = ({ type, content, dismissableByEscKey = true, closeToast, c
         }
     }, [closeToast, dismissableByEscKey]);
     useKey(escKeyFilterPredicate, closeByEsc, { options: { once: true } }, [closeByEsc, dismissableByEscKey]);
-    return (React.createElement("div", { className: cn(styles.toast, {
+    return (React.createElement("div", { "data-test": dataTest, className: cn(styles.toast, {
             [styles.success]: type === 'success',
             [styles.info]: type === 'info',
             [styles.warning]: type === 'warning',
             [styles.critical]: type === 'critical',
         }, className) },
-        React.createElement(Icon, { "data-test": "toast-icon", ariaLabel: ariaLabel, icon: icon, className: styles.icon }),
-        React.createElement("div", { "data-test": "toast-content", className: styles.content }, content),
-        closeToast && (React.createElement(IconButton, { "data-test": "toast-close", kind: "transparent", className: styles.close, ariaLabel: "Close icon", icon: X, onClick: closeToast }))));
+        React.createElement(Icon, { "data-test": `${dataTest}-icon`, ariaLabel: ariaLabel, icon: icon, className: styles.icon }),
+        React.createElement("div", { "data-test": `${dataTest}-content`, className: styles.content }, content),
+        closeToast && (React.createElement(IconButton, { "data-test": `${dataTest}-close`, kind: "transparent", className: styles.close, ariaLabel: "Close icon", icon: X, onClick: closeToast }))));
 };
 //# sourceMappingURL=Toast.js.map

package/lib/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","sourceRoot":"","sources":["../src/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,WAAW,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,EAAE,IAAI,EAAoB,CAAC,EAAE,MAAM,eAAe,CAAA;AAElG,OAAO,MAAM,MAAM,sBAAsB,CAAA;AACzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAE7B,OAAO,MAAM,MAAM,qBAAqB,CAAA;AASxC,MAAM,CAAC,MAAM,SAAS,GAAgD;IACpE,OAAO,EAAE;QACP,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,mBAAmB;KAC/B;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,IAAI;QACV,SAAS,EAAE,kBAAkB;KAC9B;IACD,OAAO,EAAE;QACP,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,uBAAuB;KACnC;IACD,QAAQ,EAAE;QACR,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,2BAA2B;KACvC;CACF,CAAA;AAUD;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,KAAK,GAAmB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,mBAAmB,GAAG,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,EAAE;IAC5G,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC,IAAI,CAAC,CAAA;IAE3C,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,WAA0B,EAAE,EAAE;QAC7B,IAAI,mBAAmB,EAAE;YACvB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;YACd,WAAW,CAAC,wBAAwB,EAAE,CAAA;SACvC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAClC,CAAA;IAED,MAAM,CAAC,qBAAqB,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAAC,CAAA;IAEzG,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,KAAK,EACZ;YACE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,MAAM;YAC9B,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,IAAI,KAAK,UAAU;SACvC,EACD,SAAS,CACV;QAED,oBAAC,IAAI,iBAAW,YAAY,EAAC,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,GAAI;QACzF,0CAAe,eAAe,EAAC,SAAS,EAAE,MAAM,CAAC,OAAO,IACrD,OAAO,CACJ;QACL,UAAU,IAAI,CACb,oBAAC,UAAU,iBACC,aAAa,EACvB,IAAI,EAAC,aAAa,EAClB,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,SAAS,EAAC,YAAY,EACtB,IAAI,EAAE,CAAC,EACP,OAAO,EAAE,UAAU,GACnB,CACH,CACG,CACP,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Toast.js","sourceRoot":"","sources":["../src/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,WAAW,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,EAAE,IAAI,EAAoB,CAAC,EAAE,MAAM,eAAe,CAAA;AAElG,OAAO,MAAM,MAAM,sBAAsB,CAAA;AAEzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAE7B,OAAO,MAAM,MAAM,qBAAqB,CAAA;AASxC,MAAM,CAAC,MAAM,SAAS,GAAgD;IACpE,OAAO,EAAE;QACP,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,mBAAmB;KAC/B;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,IAAI;QACV,SAAS,EAAE,kBAAkB;KAC9B;IACD,OAAO,EAAE;QACP,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,uBAAuB;KACnC;IACD,QAAQ,EAAE;QACR,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,2BAA2B;KACvC;CACF,CAAA;AAUD;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,KAAK,GAAmB,CAAC,EACpC,IAAI,EACJ,OAAO,EACP,mBAAmB,GAAG,IAAI,EAC1B,UAAU,EACV,SAAS,EACT,WAAW,EAAE,QAAQ,GAAG,OAAO,GAChC,EAAE,EAAE;IACH,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC,IAAI,CAAC,CAAA;IAE3C,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,WAA0B,EAAE,EAAE;QAC7B,IAAI,mBAAmB,EAAE;YACvB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;YACd,WAAW,CAAC,wBAAwB,EAAE,CAAA;SACvC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAClC,CAAA;IAED,MAAM,CAAC,qBAAqB,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAAC,CAAA;IAEzG,OAAO,CACL,0CACa,QAAQ,EACnB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,KAAK,EACZ;YACE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,MAAM;YAC9B,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,IAAI,KAAK,UAAU;SACvC,EACD,SAAS,CACV;QAED,oBAAC,IAAI,iBAAY,GAAG,QAAQ,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,GAAI;QACjG,0CAAgB,GAAG,QAAQ,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,IAC7D,OAAO,CACJ;QACL,UAAU,IAAI,CACb,oBAAC,UAAU,iBACE,GAAG,QAAQ,QAAQ,EAC9B,IAAI,EAAC,aAAa,EAClB,SAAS,EAAE,MAAM,CAAC,KAAK,EACvB,SAAS,EAAC,YAAY,EACtB,IAAI,EAAE,CAAC,EACP,OAAO,EAAE,UAAU,GACnB,CACH,CACG,CACP,CAAA;AACH,CAAC,CAAA"}

package/lib/Toggle.js

@@ -5,7 +5,7 @@ import { Error, errorId } from './Error';
 import { Help, helpTooltipId } from './Help';
 import styles from './Toggle.module.scss';
 export const Toggle = (props) => {
-    const { name, value, onChange, onBlur, error, checked, label, helperText, disabled, className, classNameLabel, 'data-test': dataTest, } = props;
+    const { name, value, onChange, onBlur, error, checked, label, helperText, disabled, className, classNameLabel, 'data-test': dataTest = 'toggle', } = props;
     const id = useUID();
     return (React.createElement("div", { className: cn(styles.wrapper, className, { [styles.withError]: 'error' in props }), "data-test": dataTest },
         React.createElement("input", { type: "checkbox", id: id, name: name, checked: !!checked, onChange: onChange, onBlur: onBlur, value: value, disabled: disabled, "aria-invalid": !!error, "aria-describedby": helperText && helpTooltipId(id), "aria-errormessage": error && errorId(id) }),
@@ -13,10 +13,10 @@ export const Toggle = (props) => {
                 [styles.error]: !!error,
                 [styles.disabled]: disabled,
             }, classNameLabel), htmlFor: id },
-            label && React.createElement("span", { className: styles.labelText }, label),
+            label && (React.createElement("span", { className: styles.labelText, "data-test": `${dataTest}-label` }, label)),
             React.createElement("span", { className: styles.toggleTrack },
-                React.createElement("span", { className: styles.toggleTrackText }, checked ? 'ON' : 'OFF'))),
-        helperText && React.createElement(Help, { parentId: id, helperText: helperText, className: styles.helperText }),
-        React.createElement(Error, { truncated: true, error: error, className: styles.errorContainer, inputId: id })));
+                React.createElement("span", { className: styles.toggleTrackText, "data-test": `${dataTest}-state` }, checked ? 'ON' : 'OFF'))),
+        helperText && React.createElement(Help, { parentId: id, helperText: helperText, className: styles.helperText, "data-test": `${dataTest}-helperText` }),
+        React.createElement(Error, { "data-test": `${dataTest}-error`, truncated: true, error: error, className: styles.errorContainer, inputId: id })));
 };
 //# sourceMappingURL=Toggle.js.map