@rio-cloud/rio-uikit 0.16.4-beta.2 → 0.16.4-beta.20

package/components/table/TableSettingsDialogFooter.d.ts

@@ -1,43 +1,43 @@
-export function TableSettingsDialogFooter(props: any): JSX.Element;
-export namespace TableSettingsDialogFooter {
-    namespace defaultProps {
-        const hasChanged: boolean;
-        const isResetAll: boolean;
-        const immediateChange: boolean;
-        const resetButtonText: string;
-        const closeButtonText: string;
-        const cancelButtonText: string;
-        const applyButtonText: string;
-        function onHide(): undefined;
-        function onResetColumnChanges(): undefined;
-        function onDiscardChanges(): undefined;
-        function onApplyChanges(): undefined;
-    }
-    namespace propTypes {
-        const hasChanged_1: PropTypes.Requireable<boolean>;
-        export { hasChanged_1 as hasChanged };
-        const isResetAll_1: PropTypes.Requireable<boolean>;
-        export { isResetAll_1 as isResetAll };
-        const immediateChange_1: PropTypes.Requireable<boolean>;
-        export { immediateChange_1 as immediateChange };
-        const resetButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export { resetButtonText_1 as resetButtonText };
-        const closeButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export { closeButtonText_1 as closeButtonText };
-        const cancelButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export { cancelButtonText_1 as cancelButtonText };
-        const applyButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        export { applyButtonText_1 as applyButtonText };
-        const onHide_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onHide_1 as onHide };
-        const onResetColumnChanges_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onResetColumnChanges_1 as onResetColumnChanges };
-        const onDiscardChanges_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onDiscardChanges_1 as onDiscardChanges };
-        const onApplyChanges_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onApplyChanges_1 as onApplyChanges };
-        export const onConfirmResetColumnChanges: PropTypes.Requireable<(...args: any[]) => any>;
-        export const onCancelResetColumnChanges: PropTypes.Requireable<(...args: any[]) => any>;
-    }
-}
-import PropTypes from "prop-types";
+export function TableSettingsDialogFooter(props: any): import("react/jsx-runtime").JSX.Element;
+export namespace TableSettingsDialogFooter {
+    namespace defaultProps {
+        const hasChanged: boolean;
+        const isResetAll: boolean;
+        const immediateChange: boolean;
+        const resetButtonText: string;
+        const closeButtonText: string;
+        const cancelButtonText: string;
+        const applyButtonText: string;
+        function onHide(): undefined;
+        function onResetColumnChanges(): undefined;
+        function onDiscardChanges(): undefined;
+        function onApplyChanges(): undefined;
+    }
+    namespace propTypes {
+        const hasChanged_1: PropTypes.Requireable<boolean>;
+        export { hasChanged_1 as hasChanged };
+        const isResetAll_1: PropTypes.Requireable<boolean>;
+        export { isResetAll_1 as isResetAll };
+        const immediateChange_1: PropTypes.Requireable<boolean>;
+        export { immediateChange_1 as immediateChange };
+        const resetButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        export { resetButtonText_1 as resetButtonText };
+        const closeButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        export { closeButtonText_1 as closeButtonText };
+        const cancelButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        export { cancelButtonText_1 as cancelButtonText };
+        const applyButtonText_1: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        export { applyButtonText_1 as applyButtonText };
+        const onHide_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onHide_1 as onHide };
+        const onResetColumnChanges_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onResetColumnChanges_1 as onResetColumnChanges };
+        const onDiscardChanges_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onDiscardChanges_1 as onDiscardChanges };
+        const onApplyChanges_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onApplyChanges_1 as onApplyChanges };
+        export const onConfirmResetColumnChanges: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onCancelResetColumnChanges: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+}
+import PropTypes from "prop-types";

package/components/table/TableSettingsDialogFooter.js

@@ -1,37 +1,37 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-export const TableSettingsDialogFooter = props => {
-    const { hasChanged, isResetAll, immediateChange, resetButtonText, onHide, closeButtonText, cancelButtonText, applyButtonText, onResetColumnChanges, onConfirmResetColumnChanges, onCancelResetColumnChanges, onDiscardChanges, onApplyChanges, } = props;
-    const restButtonClassNames = classNames('btn', 'btn-link', !hasChanged && 'disabled');
-    return (_jsxs("div", { children: [_jsxs("div", Object.assign({ className: 'pull-left' }, { children: [!isResetAll && (_jsxs("div", Object.assign({ className: restButtonClassNames, onClick: onResetColumnChanges }, { children: [_jsx("span", { className: 'rioglyph rioglyph-revert text-size-xs margin-right-10' }), resetButtonText] }))), isResetAll && (_jsxs("div", Object.assign({ className: 'btn-group' }, { children: [_jsx("div", Object.assign({ className: 'btn btn-icon-only btn-default margin-right-5 btn-outline', onClick: onCancelResetColumnChanges }, { children: _jsx("span", { className: 'rioglyph rioglyph-remove' }) })), _jsx("div", Object.assign({ className: 'btn btn-primary btn-icon-only', onClick: onConfirmResetColumnChanges }, { children: _jsx("span", { className: 'rioglyph rioglyph-ok' }) }))] })))] })), immediateChange ? (_jsx("div", Object.assign({ className: 'pull-right' }, { children: _jsx("div", Object.assign({ className: 'btn btn-default', onClick: onHide }, { children: closeButtonText })) }))) : (_jsxs("div", Object.assign({ className: 'pull-right' }, { children: [_jsx("div", Object.assign({ className: 'btn btn-default', onClick: onDiscardChanges }, { children: cancelButtonText })), _jsx("div", Object.assign({ className: 'btn btn-primary', onClick: onApplyChanges }, { children: applyButtonText }))] })))] }));
-};
-TableSettingsDialogFooter.defaultProps = {
-    hasChanged: false,
-    isResetAll: false,
-    immediateChange: false,
-    resetButtonText: '',
-    closeButtonText: '',
-    cancelButtonText: '',
-    applyButtonText: '',
-    onHide: () => undefined,
-    onResetColumnChanges: () => undefined,
-    onDiscardChanges: () => undefined,
-    onApplyChanges: () => undefined,
-};
-TableSettingsDialogFooter.propTypes = {
-    hasChanged: PropTypes.bool,
-    isResetAll: PropTypes.bool,
-    immediateChange: PropTypes.bool,
-    resetButtonText: PropTypes.node,
-    closeButtonText: PropTypes.node,
-    cancelButtonText: PropTypes.node,
-    applyButtonText: PropTypes.node,
-    onHide: PropTypes.func,
-    onResetColumnChanges: PropTypes.func,
-    onDiscardChanges: PropTypes.func,
-    onApplyChanges: PropTypes.func,
-    onConfirmResetColumnChanges: PropTypes.func,
-    onCancelResetColumnChanges: PropTypes.func,
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+export const TableSettingsDialogFooter = props => {
+    const { hasChanged, isResetAll, immediateChange, resetButtonText, onHide, closeButtonText, cancelButtonText, applyButtonText, onResetColumnChanges, onConfirmResetColumnChanges, onCancelResetColumnChanges, onDiscardChanges, onApplyChanges, } = props;
+    const restButtonClassNames = classNames('btn', 'btn-link', !hasChanged && 'disabled');
+    return (_jsxs("div", { children: [_jsxs("div", Object.assign({ className: 'pull-left' }, { children: [!isResetAll && (_jsxs("div", Object.assign({ className: restButtonClassNames, onClick: onResetColumnChanges }, { children: [_jsx("span", { className: 'rioglyph rioglyph-revert text-size-xs margin-right-10' }), resetButtonText] }))), isResetAll && (_jsxs("div", Object.assign({ className: 'btn-group' }, { children: [_jsx("div", Object.assign({ className: 'btn btn-icon-only btn-default margin-right-5 btn-outline', onClick: onCancelResetColumnChanges }, { children: _jsx("span", { className: 'rioglyph rioglyph-remove' }) })), _jsx("div", Object.assign({ className: 'btn btn-primary btn-icon-only', onClick: onConfirmResetColumnChanges }, { children: _jsx("span", { className: 'rioglyph rioglyph-ok' }) }))] })))] })), immediateChange ? (_jsx("div", Object.assign({ className: 'pull-right' }, { children: _jsx("div", Object.assign({ className: 'btn btn-default', onClick: onHide }, { children: closeButtonText })) }))) : (_jsxs("div", Object.assign({ className: 'btn-toolbar pull-right' }, { children: [_jsx("div", Object.assign({ className: 'btn btn-default', onClick: onDiscardChanges }, { children: cancelButtonText })), _jsx("div", Object.assign({ className: 'btn btn-primary', onClick: onApplyChanges }, { children: applyButtonText }))] })))] }));
+};
+TableSettingsDialogFooter.defaultProps = {
+    hasChanged: false,
+    isResetAll: false,
+    immediateChange: false,
+    resetButtonText: '',
+    closeButtonText: '',
+    cancelButtonText: '',
+    applyButtonText: '',
+    onHide: () => undefined,
+    onResetColumnChanges: () => undefined,
+    onDiscardChanges: () => undefined,
+    onApplyChanges: () => undefined,
+};
+TableSettingsDialogFooter.propTypes = {
+    hasChanged: PropTypes.bool,
+    isResetAll: PropTypes.bool,
+    immediateChange: PropTypes.bool,
+    resetButtonText: PropTypes.node,
+    closeButtonText: PropTypes.node,
+    cancelButtonText: PropTypes.node,
+    applyButtonText: PropTypes.node,
+    onHide: PropTypes.func,
+    onResetColumnChanges: PropTypes.func,
+    onDiscardChanges: PropTypes.func,
+    onApplyChanges: PropTypes.func,
+    onConfirmResetColumnChanges: PropTypes.func,
+    onCancelResetColumnChanges: PropTypes.func,
+};

package/components/table/TableSettingsListContainer.d.ts

@@ -1,9 +1,9 @@
-export function TableSettingsListContainer(props: any): JSX.Element;
-export namespace TableSettingsListContainer {
-    namespace propTypes {
-        const items: PropTypes.Requireable<(string | null | undefined)[]>;
-        const onSortEnd: PropTypes.Requireable<(...args: any[]) => any>;
-        const itemProps: PropTypes.Requireable<object>;
-    }
-}
-import PropTypes from "prop-types";
+export function TableSettingsListContainer(props: any): import("react/jsx-runtime").JSX.Element;
+export namespace TableSettingsListContainer {
+    namespace propTypes {
+        const items: PropTypes.Requireable<(string | null | undefined)[]>;
+        const onSortEnd: PropTypes.Requireable<(...args: any[]) => any>;
+        const itemProps: PropTypes.Requireable<object>;
+    }
+}
+import PropTypes from "prop-types";

package/components/table/TableSettingsListContainer.js

@@ -1,30 +1,30 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/* eslint-disable new-cap */
-/* eslint-disable no-unused-vars */
-import React, { useState, useCallback } from 'react';
-import PropTypes from 'prop-types';
-import { DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors } from '@dnd-kit/core';
-import { SortableContext, sortableKeyboardCoordinates, rectSortingStrategy } from '@dnd-kit/sortable';
-import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
-import TableSettingsListItem from './TableSettingsListItem';
-export const TableSettingsListContainer = props => {
-    const { items, onSortEnd, itemProps } = props;
-    const [activeDraggedColumn, setActiveDraggedColumn] = useState(null);
-    const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, {
-        coordinateGetter: sortableKeyboardCoordinates,
-    }));
-    const handleDragStart = useCallback(event => {
-        setActiveDraggedColumn(event.active.id);
-    }, []);
-    const handleDragEnd = useCallback(event => {
-        setActiveDraggedColumn(null);
-        onSortEnd(event);
-    }, []);
-    const activeClass = 'table-settings-item shadow-smooth-to-bottom z-index-max';
-    return (_jsx("div", Object.assign({ className: 'table-settings-items-container' }, { children: _jsx(DndContext, Object.assign({ modifiers: [restrictToVerticalAxis], onDragStart: handleDragStart, onDragEnd: handleDragEnd }, { children: _jsx(SortableContext, Object.assign({ items: items, sensors: sensors, collisionDetection: closestCenter, strategy: rectSortingStrategy }, { children: items.map((column, index) => (_jsx(TableSettingsListItem, Object.assign({ index: index, column: column, orderIndex: index, className: activeDraggedColumn === column ? activeClass : '' }, itemProps), column))) })) })) })));
-};
-TableSettingsListContainer.propTypes = {
-    items: PropTypes.arrayOf(PropTypes.string),
-    onSortEnd: PropTypes.func,
-    itemProps: PropTypes.object,
-};
+import { jsx as _jsx } from "react/jsx-runtime";
+/* eslint-disable new-cap */
+/* eslint-disable no-unused-vars */
+import React, { useState, useCallback } from 'react';
+import PropTypes from 'prop-types';
+import { DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors } from '@dnd-kit/core';
+import { SortableContext, sortableKeyboardCoordinates, rectSortingStrategy } from '@dnd-kit/sortable';
+import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
+import TableSettingsListItem from './TableSettingsListItem';
+export const TableSettingsListContainer = props => {
+    const { items, onSortEnd, itemProps } = props;
+    const [activeDraggedColumn, setActiveDraggedColumn] = useState(null);
+    const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, {
+        coordinateGetter: sortableKeyboardCoordinates,
+    }));
+    const handleDragStart = useCallback(event => {
+        setActiveDraggedColumn(event.active.id);
+    }, []);
+    const handleDragEnd = useCallback(event => {
+        setActiveDraggedColumn(null);
+        onSortEnd(event);
+    }, []);
+    const activeClass = 'table-settings-item shadow-smooth-to-bottom z-index-max';
+    return (_jsx("div", Object.assign({ className: 'table-settings-items-container' }, { children: _jsx(DndContext, Object.assign({ modifiers: [restrictToVerticalAxis], onDragStart: handleDragStart, onDragEnd: handleDragEnd }, { children: _jsx(SortableContext, Object.assign({ items: items, sensors: sensors, collisionDetection: closestCenter, strategy: rectSortingStrategy }, { children: items.map((column, index) => (_jsx(TableSettingsListItem, Object.assign({ index: index, column: column, orderIndex: index, className: activeDraggedColumn === column ? activeClass : '' }, itemProps), column))) })) })) })));
+};
+TableSettingsListContainer.propTypes = {
+    items: PropTypes.arrayOf(PropTypes.string),
+    onSortEnd: PropTypes.func,
+    itemProps: PropTypes.object,
+};

package/components/table/TableSettingsListItem.d.ts

@@ -1,27 +1,27 @@
-export function filterColumns(searchValue: any, column: string | undefined, columnLabelStrings: any): boolean;
-export default TableSettingsListItem;
-declare function TableSettingsListItem(props: any): JSX.Element;
-declare namespace TableSettingsListItem {
-    namespace propTypes {
-        export const column: PropTypes.Requireable<string>;
-        export const orderIndex: PropTypes.Requireable<number>;
-        export const columnLabels: PropTypes.Requireable<object>;
-        export const autoLabel: PropTypes.Requireable<string>;
-        export const disabledColumns: PropTypes.Requireable<(string | null | undefined)[]>;
-        export const columnOrder: PropTypes.Requireable<(string | null | undefined)[]>;
-        export const hiddenColumns: PropTypes.Requireable<(string | null | undefined)[]>;
-        export const columnSearchValue: PropTypes.Requireable<string>;
-        export { columnsDetailsPropTypes as columnsDetails };
-        export const columnLabelStrings: PropTypes.Requireable<object>;
-        export const openColumnsDetails: PropTypes.Requireable<object>;
-        export const updateColumnLabelStrings: PropTypes.Requireable<boolean>;
-        export const onColumnWidthChange: PropTypes.Requireable<(...args: any[]) => any>;
-        export const onResetColumnWidth: PropTypes.Requireable<(...args: any[]) => any>;
-        export const onMoveColumn: PropTypes.Requireable<(...args: any[]) => any>;
-        export const onOpenDetails: PropTypes.Requireable<(...args: any[]) => any>;
-        export const onToggleHideColumn: PropTypes.Requireable<(...args: any[]) => any>;
-        export const className: PropTypes.Requireable<string>;
-    }
-}
-import PropTypes from "prop-types";
-import { columnsDetailsPropTypes } from "./tableSettingsPropTypes";
+export function filterColumns(searchValue: any, column: string | undefined, columnLabelStrings: any): boolean;
+export default TableSettingsListItem;
+declare function TableSettingsListItem(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace TableSettingsListItem {
+    namespace propTypes {
+        export const column: PropTypes.Requireable<string>;
+        export const orderIndex: PropTypes.Requireable<number>;
+        export const columnLabels: PropTypes.Requireable<object>;
+        export const autoLabel: PropTypes.Requireable<string>;
+        export const disabledColumns: PropTypes.Requireable<(string | null | undefined)[]>;
+        export const columnOrder: PropTypes.Requireable<(string | null | undefined)[]>;
+        export const hiddenColumns: PropTypes.Requireable<(string | null | undefined)[]>;
+        export const columnSearchValue: PropTypes.Requireable<string>;
+        export { columnsDetailsPropTypes as columnsDetails };
+        export const columnLabelStrings: PropTypes.Requireable<object>;
+        export const openColumnsDetails: PropTypes.Requireable<object>;
+        export const updateColumnLabelStrings: PropTypes.Requireable<boolean>;
+        export const onColumnWidthChange: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onResetColumnWidth: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onMoveColumn: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onOpenDetails: PropTypes.Requireable<(...args: any[]) => any>;
+        export const onToggleHideColumn: PropTypes.Requireable<(...args: any[]) => any>;
+        export const className: PropTypes.Requireable<string>;
+    }
+}
+import PropTypes from "prop-types";
+import { columnsDetailsPropTypes } from "./tableSettingsPropTypes";

package/components/table/TableSettingsListItem.js

@@ -1,64 +1,64 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable new-cap */
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import { useSortable } from '@dnd-kit/sortable';
-import { CSS } from '@dnd-kit/utilities';
-import isEmpty from 'lodash/fp/isEmpty';
-import Checkbox from '../checkbox/Checkbox';
-import Collapse from '../collapse/Collapse';
-import { TableSettingsColumnDetails } from './TableSettingsColumnDetails';
-import { TableSettingsColumnButtons } from './TableSettingsColumnButtons';
-import { columnsDetailsPropTypes } from './tableSettingsPropTypes';
-const MAX_COLUMN_WIDTH = 1000;
-export const filterColumns = (searchValue, column = '', columnLabelStrings) => {
-    if (!searchValue) {
-        return false;
-    }
-    const label = columnLabelStrings[column] || '';
-    return !label.toLowerCase().includes(searchValue.toLowerCase());
-};
-const TableSettingsListItem = props => {
-    const { column, orderIndex, columnLabels, autoLabel, disabledColumns = [], columnOrder, hiddenColumns = [], columnSearchValue, columnsDetails, columnLabelStrings, openColumnsDetails, updateColumnLabelStrings, onColumnWidthChange, onResetColumnWidth, onMoveColumn, onOpenDetails, onToggleHideColumn, className, } = props;
-    const isSortingDisabled = !isEmpty(columnSearchValue);
-    const { attributes, listeners, setNodeRef, transform, transition } = useSortable({
-        id: column,
-        disabled: isSortingDisabled,
-    });
-    const style = {
-        transform: CSS.Transform.toString(transform),
-        transition,
-    };
-    // Filter out items which don't match the search value.
-    // Note that we need to render all items at least once at the beginning in order to get their DOM lables
-    // otherwise the search won't work when initial search value is provided via props.
-    const isFiltered = filterColumns(columnSearchValue, column, columnLabelStrings) && !updateColumnLabelStrings;
-    const itemClassNames = classNames('table-settings-item', updateColumnLabelStrings && 'opacity-0', isFiltered && 'position-offscreen', className);
-    const columnDetails = columnsDetails[column];
-    return (_jsxs("div", Object.assign({ className: itemClassNames, ref: setNodeRef, style: style }, { children: [_jsxs("div", Object.assign({ className: 'table-settings-item-header user-select-none' }, { children: [_jsx("div", Object.assign({ className: 'CheckboxWrapper display-flex align-items-center padding-left-2' }, { children: _jsx(Checkbox, { checked: !hiddenColumns.includes(column), onClick: event => {
-                                onToggleHideColumn(column);
-                                event.stopPropagation();
-                            }, disabled: disabledColumns.includes(column) }) })), _jsx("div", Object.assign({ className: `table-settings-item-label ${isSortingDisabled ? 'no-drag' : ''}`, "data-key": column }, attributes, listeners, { children: columnLabels[column] })), columnDetails && (_jsx("div", Object.assign({ className: 'column-width-label' }, { children: columnDetails.width ? `${columnDetails.width}px` : autoLabel }))), _jsx(TableSettingsColumnButtons, { column: column, index: orderIndex, columnDetails: columnDetails, columnOrder: columnOrder, openColumnsDetails: openColumnsDetails, disabled: isSortingDisabled, onMoveColumn: onMoveColumn, onOpenDetails: onOpenDetails })] })), columnDetails && (_jsx(Collapse, Object.assign({ in: !!openColumnsDetails[column] }, { children: _jsx("div", { children: _jsx(TableSettingsColumnDetails, Object.assign({}, columnDetails, { column: column, maxColumnWidth: MAX_COLUMN_WIDTH, onColumnWidthChange: onColumnWidthChange, onResetColumnWidth: onResetColumnWidth })) }) })))] }), `table-settings-item-${column}`));
-};
-TableSettingsListItem.propTypes = {
-    column: PropTypes.string,
-    orderIndex: PropTypes.number,
-    columnLabels: PropTypes.object,
-    autoLabel: PropTypes.string,
-    disabledColumns: PropTypes.arrayOf(PropTypes.string),
-    columnOrder: PropTypes.arrayOf(PropTypes.string),
-    hiddenColumns: PropTypes.arrayOf(PropTypes.string),
-    columnSearchValue: PropTypes.string,
-    columnsDetails: columnsDetailsPropTypes,
-    columnLabelStrings: PropTypes.object,
-    openColumnsDetails: PropTypes.object,
-    updateColumnLabelStrings: PropTypes.bool,
-    onColumnWidthChange: PropTypes.func,
-    onResetColumnWidth: PropTypes.func,
-    onMoveColumn: PropTypes.func,
-    onOpenDetails: PropTypes.func,
-    onToggleHideColumn: PropTypes.func,
-    className: PropTypes.string,
-};
-export default TableSettingsListItem;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* eslint-disable new-cap */
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import { useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import isEmpty from 'lodash/fp/isEmpty';
+import Checkbox from '../checkbox/Checkbox';
+import Collapse from '../collapse/Collapse';
+import { TableSettingsColumnDetails } from './TableSettingsColumnDetails';
+import { TableSettingsColumnButtons } from './TableSettingsColumnButtons';
+import { columnsDetailsPropTypes } from './tableSettingsPropTypes';
+const MAX_COLUMN_WIDTH = 1000;
+export const filterColumns = (searchValue, column = '', columnLabelStrings) => {
+    if (!searchValue) {
+        return false;
+    }
+    const label = columnLabelStrings[column] || '';
+    return !label.toLowerCase().includes(searchValue.toLowerCase());
+};
+const TableSettingsListItem = props => {
+    const { column, orderIndex, columnLabels, autoLabel, disabledColumns = [], columnOrder, hiddenColumns = [], columnSearchValue, columnsDetails, columnLabelStrings, openColumnsDetails, updateColumnLabelStrings, onColumnWidthChange, onResetColumnWidth, onMoveColumn, onOpenDetails, onToggleHideColumn, className, } = props;
+    const isSortingDisabled = !isEmpty(columnSearchValue);
+    const { attributes, listeners, setNodeRef, transform, transition } = useSortable({
+        id: column,
+        disabled: isSortingDisabled,
+    });
+    const style = {
+        transform: CSS.Transform.toString(transform),
+        transition,
+    };
+    // Filter out items which don't match the search value.
+    // Note that we need to render all items at least once at the beginning in order to get their DOM lables
+    // otherwise the search won't work when initial search value is provided via props.
+    const isFiltered = filterColumns(columnSearchValue, column, columnLabelStrings) && !updateColumnLabelStrings;
+    const itemClassNames = classNames('table-settings-item', updateColumnLabelStrings && 'opacity-0', isFiltered && 'position-offscreen', className);
+    const columnDetails = columnsDetails[column];
+    return (_jsxs("div", Object.assign({ className: itemClassNames, ref: setNodeRef, style: style }, { children: [_jsxs("div", Object.assign({ className: 'table-settings-item-header user-select-none' }, { children: [_jsx("div", Object.assign({ className: 'CheckboxWrapper display-flex align-items-center padding-left-2' }, { children: _jsx(Checkbox, { checked: !hiddenColumns.includes(column), onClick: event => {
+                                onToggleHideColumn(column);
+                                event.stopPropagation();
+                            }, disabled: disabledColumns.includes(column) }) })), _jsx("div", Object.assign({ className: `table-settings-item-label ${isSortingDisabled ? 'no-drag' : ''}`, "data-key": column }, attributes, listeners, { children: columnLabels[column] })), columnDetails && (_jsx("div", Object.assign({ className: 'column-width-label' }, { children: columnDetails.width ? `${columnDetails.width}px` : autoLabel }))), _jsx(TableSettingsColumnButtons, { column: column, index: orderIndex, columnDetails: columnDetails, columnOrder: columnOrder, openColumnsDetails: openColumnsDetails, disabled: isSortingDisabled, onMoveColumn: onMoveColumn, onOpenDetails: onOpenDetails })] })), columnDetails && (_jsx(Collapse, Object.assign({ in: !!openColumnsDetails[column] }, { children: _jsx("div", { children: _jsx(TableSettingsColumnDetails, Object.assign({}, columnDetails, { column: column, maxColumnWidth: MAX_COLUMN_WIDTH, onColumnWidthChange: onColumnWidthChange, onResetColumnWidth: onResetColumnWidth })) }) })))] }), `table-settings-item-${column}`));
+};
+TableSettingsListItem.propTypes = {
+    column: PropTypes.string,
+    orderIndex: PropTypes.number,
+    columnLabels: PropTypes.object,
+    autoLabel: PropTypes.string,
+    disabledColumns: PropTypes.arrayOf(PropTypes.string),
+    columnOrder: PropTypes.arrayOf(PropTypes.string),
+    hiddenColumns: PropTypes.arrayOf(PropTypes.string),
+    columnSearchValue: PropTypes.string,
+    columnsDetails: columnsDetailsPropTypes,
+    columnLabelStrings: PropTypes.object,
+    openColumnsDetails: PropTypes.object,
+    updateColumnLabelStrings: PropTypes.bool,
+    onColumnWidthChange: PropTypes.func,
+    onResetColumnWidth: PropTypes.func,
+    onMoveColumn: PropTypes.func,
+    onOpenDetails: PropTypes.func,
+    onToggleHideColumn: PropTypes.func,
+    className: PropTypes.string,
+};
+export default TableSettingsListItem;

package/components/table/TableToolbar.d.ts

@@ -1,12 +1,12 @@
-export default TableToolbar;
-declare function TableToolbar({ className, children }: {
-    className: any;
-    children: any;
-}): JSX.Element;
-declare namespace TableToolbar {
-    const defaultProps: {};
-    namespace propTypes {
-        const className: PropTypes.Requireable<string>;
-    }
-}
-import PropTypes from "prop-types";
+export default TableToolbar;
+declare function TableToolbar({ className, children }: {
+    className: any;
+    children: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace TableToolbar {
+    const defaultProps: {};
+    namespace propTypes {
+        const className: PropTypes.Requireable<string>;
+    }
+}
+import PropTypes from "prop-types";

package/components/table/TableToolbar.js

@@ -1,13 +1,13 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-const TableToolbar = ({ className, children }) => {
-    const wrapperClassNames = classNames('table-toolbar', className && className);
-    return _jsx("div", Object.assign({ className: wrapperClassNames }, { children: children }));
-};
-TableToolbar.defaultProps = {};
-TableToolbar.propTypes = {
-    className: PropTypes.string,
-};
-export default TableToolbar;
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+const TableToolbar = ({ className, children }) => {
+    const wrapperClassNames = classNames('table-toolbar', className && className);
+    return _jsx("div", Object.assign({ className: wrapperClassNames }, { children: children }));
+};
+TableToolbar.defaultProps = {};
+TableToolbar.propTypes = {
+    className: PropTypes.string,
+};
+export default TableToolbar;

package/components/table/TableViewToggles.d.ts

@@ -1,30 +1,30 @@
-export default TableViewToggles;
-declare function TableViewToggles(props: any): JSX.Element;
-declare namespace TableViewToggles {
-    const VIEW_TYPE_TABLE: string;
-    const VIEW_TYPE_SINGLE_CARD: string;
-    const VIEW_TYPE_MULTI_CARDS: string;
-    namespace defaultProps {
-        import initialViewType = TableViewToggles.VIEW_TYPE_TABLE;
-        export { initialViewType };
-        export function onViewTypeChange(): void;
-        export const disabledViewTypes: never[];
-        export const disabled: boolean;
-    }
-    namespace propTypes {
-        export const viewType: PropTypes.Requireable<string>;
-        const initialViewType_1: PropTypes.Requireable<string>;
-        export { initialViewType_1 as initialViewType };
-        const disabledViewTypes_1: PropTypes.Requireable<(string | null | undefined)[]>;
-        export { disabledViewTypes_1 as disabledViewTypes };
-        const onViewTypeChange_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onViewTypeChange_1 as onViewTypeChange };
-        const disabled_1: PropTypes.Requireable<boolean>;
-        export { disabled_1 as disabled };
-        export const className: PropTypes.Requireable<string>;
-        export const tableViewTooltipContent: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-        export const singleCardViewTooltipContent: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-        export const multiCardsViewTooltipContent: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
-    }
-}
-import PropTypes from "prop-types";
+export default TableViewToggles;
+declare function TableViewToggles(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace TableViewToggles {
+    const VIEW_TYPE_TABLE: string;
+    const VIEW_TYPE_SINGLE_CARD: string;
+    const VIEW_TYPE_MULTI_CARDS: string;
+    namespace defaultProps {
+        import initialViewType = TableViewToggles.VIEW_TYPE_TABLE;
+        export { initialViewType };
+        export function onViewTypeChange(): void;
+        export const disabledViewTypes: never[];
+        export const disabled: boolean;
+    }
+    namespace propTypes {
+        export const viewType: PropTypes.Requireable<string>;
+        const initialViewType_1: PropTypes.Requireable<string>;
+        export { initialViewType_1 as initialViewType };
+        const disabledViewTypes_1: PropTypes.Requireable<(string | null | undefined)[]>;
+        export { disabledViewTypes_1 as disabledViewTypes };
+        const onViewTypeChange_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onViewTypeChange_1 as onViewTypeChange };
+        const disabled_1: PropTypes.Requireable<boolean>;
+        export { disabled_1 as disabled };
+        export const className: PropTypes.Requireable<string>;
+        export const tableViewTooltipContent: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+        export const singleCardViewTooltipContent: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+        export const multiCardsViewTooltipContent: PropTypes.Requireable<NonNullable<PropTypes.ReactNodeLike>>;
+    }
+}
+import PropTypes from "prop-types";