schummar-table 0.4.0 → 0.5.0-beta-2

package/dist/cjs/components/defaultFilterComponent.js

@@ -1,91 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DefaultFilterComponent = exports.DefaultFilter = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@material-ui/core");
-const icons_1 = require("@material-ui/icons");
-const react_1 = require("react");
-const helpers_1 = require("../misc/helpers");
-const table_1 = require("../table");
-class DefaultFilter {
-    constructor(values, filter) {
-        this.values = values;
-        this.filter = filter;
-    }
-}
-exports.DefaultFilter = DefaultFilter;
-const useClasses = (0, core_1.makeStyles)((theme) => ({
-    view: {
-        padding: theme.spacing(2),
-        display: 'grid',
-        '& > :first-child': {
-            marginBottom: theme.spacing(2),
-        },
-    },
-}));
-function DefaultFilterComponent({ filterBy: _filterBy, options: _options, compare = helpers_1.defaultEquals, stringValue = helpers_1.asString, render = stringValue, }) {
-    var _a;
-    const classes = useClasses();
-    const state = (0, table_1.useTableContext)();
-    const columnId = (0, table_1.useColumnContext)();
-    const filterBy = (0, react_1.useCallback)((value, item) => {
-        const values = _filterBy ? _filterBy(value, item) : value;
-        return values instanceof Array ? values : [values];
-    }, [_filterBy]);
-    const { text, options, filter } = state.useState((state) => {
-        const column = state.activeColumns.find((column) => column.id === columnId);
-        const _filter = state.filters.get(columnId);
-        const filter = _filter instanceof DefaultFilter ? _filter : undefined;
-        let options = _options !== null && _options !== void 0 ? _options : (0, helpers_1.orderBy)((0, helpers_1.uniq)((0, helpers_1.flatMap)(state.items, (item) => (column ? filterBy(column.value(item), item) : []))));
-        if (filter)
-            options = options.concat([...filter.values].filter((value) => !options.includes(value)));
-        return { text: state.props.text, options, filter };
-    }, [_options, columnId, filterBy]);
-    const [input, setInput] = (0, react_1.useState)('');
-    const filtered = options.filter((option) => !input || stringValue(option).toLowerCase().includes(input.toLowerCase()));
-    function toggle(value) {
-        var _a;
-        const column = state.getState().activeColumns.find((column) => column.id === columnId);
-        if (!column)
-            return;
-        const newValues = new Set(filter === null || filter === void 0 ? void 0 : filter.values);
-        if (newValues === null || newValues === void 0 ? void 0 : newValues.has(value))
-            newValues.delete(value);
-        else
-            newValues === null || newValues === void 0 ? void 0 : newValues.add(value);
-        const newFilter = newValues.size === 0
-            ? undefined
-            : new DefaultFilter(newValues, (item) => {
-                const itemValues = filterBy(column.value(item), item);
-                return [...newValues].some((value) => itemValues.some((itemValue) => compare(value, itemValue)));
-            });
-        if (!column.filter) {
-            state.update((state) => {
-                if (newFilter)
-                    state.filters.set(column.id, newFilter);
-                else
-                    state.filters.delete(column.id);
-            });
-        }
-        (_a = column.onFilterChange) === null || _a === void 0 ? void 0 : _a.call(column, newFilter);
-    }
-    function deselectAll() {
-        var _a;
-        const column = state.getState().activeColumns.find((column) => column.id === columnId);
-        if (!column)
-            return;
-        if (!column.filter) {
-            state.update((state) => {
-                state.filters.delete(column.id);
-            });
-        }
-        (_a = column.onFilterChange) === null || _a === void 0 ? void 0 : _a.call(column);
-    }
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: classes.view }, { children: [(0, jsx_runtime_1.jsx)(core_1.TextField, { value: input, onChange: (e) => setInput(e.target.value), InputProps: {
-                    endAdornment: input ? ((0, jsx_runtime_1.jsx)(core_1.IconButton, Object.assign({ onClick: () => setInput('') }, { children: (0, jsx_runtime_1.jsx)(icons_1.Clear, {}, void 0) }), void 0)) : ((0, jsx_runtime_1.jsx)(icons_1.Search, {}, void 0)),
-                } }, void 0), (0, jsx_runtime_1.jsx)(core_1.Button, Object.assign({ variant: "outlined", onClick: deselectAll, disabled: !filter }, { children: (_a = text === null || text === void 0 ? void 0 : text.deselectAll) !== null && _a !== void 0 ? _a : 'Deselect all' }), void 0), filtered.map((value, index) => {
-                var _a;
-                return ((0, jsx_runtime_1.jsx)(core_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(core_1.Checkbox, { checked: (_a = filter === null || filter === void 0 ? void 0 : filter.values.has(value)) !== null && _a !== void 0 ? _a : false, onChange: () => toggle(value) }, void 0), label: render(value) }, index));
-            })] }), void 0));
-}
-exports.DefaultFilterComponent = DefaultFilterComponent;

package/dist/cjs/components/expandComponent.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import { Id } from '../types';
-export declare function ExpandComponent<T>({ itemId }: {
-    itemId: Id;
-}): JSX.Element;

package/dist/cjs/components/expandComponent.js

@@ -1,38 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ExpandComponent = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@material-ui/core");
-const icons_1 = require("@material-ui/icons");
-const helpers_1 = require("../misc/helpers");
-const table_1 = require("../table");
-function ExpandComponent({ itemId }) {
-    const state = (0, table_1.useTableContext)();
-    const isExpanded = state.useState((state) => state.expanded.has(itemId), [itemId]);
-    function toggle() {
-        const { props: { expanded: controlledExpanded, expandOnlyOne, onExpandedChange }, expanded, activeItemsById, } = state.getState();
-        const newExpanded = new Set(expanded);
-        if (expandOnlyOne)
-            newExpanded.clear();
-        if (isExpanded)
-            newExpanded.delete(itemId);
-        else {
-            newExpanded.add(itemId);
-            const item = activeItemsById.get(itemId);
-            for (const ancestor of item ? (0, helpers_1.getAncestors)(activeItemsById, item) : []) {
-                newExpanded.add(ancestor);
-            }
-        }
-        onExpandedChange === null || onExpandedChange === void 0 ? void 0 : onExpandedChange(newExpanded);
-        if (!controlledExpanded) {
-            state.update((state) => {
-                state.expanded = newExpanded;
-            });
-        }
-    }
-    return ((0, jsx_runtime_1.jsx)(core_1.IconButton, Object.assign({ size: "small", onClick: toggle }, { children: (0, jsx_runtime_1.jsx)(icons_1.ChevronRight, { style: {
-                transition: 'all 500ms',
-                transform: isExpanded ? 'rotate3d(0, 0, 1, 90deg)' : 'none',
-            } }, void 0) }), void 0));
-}
-exports.ExpandComponent = ExpandComponent;

package/dist/cjs/components/export.js

@@ -1,48 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Export = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@material-ui/core");
-const icons_1 = require("@material-ui/icons");
-const react_1 = require("react");
-const csvExport_1 = require("../misc/csvExport");
-const table_1 = require("../table");
-const useClasses = (0, core_1.makeStyles)((theme) => ({
-    dialog: {
-        padding: theme.spacing(2),
-        display: 'grid',
-        justifyItems: 'stretch',
-        '& > *': {
-            justifyContent: 'start',
-        },
-    },
-}));
-function Export() {
-    const classes = useClasses();
-    const [anchor, setAnchor] = (0, react_1.useState)(null);
-    const state = (0, table_1.useTableContext)();
-    const textTitle = state.useState('props.text.exportTitle');
-    const textCopy = state.useState('props.text.exportCopy');
-    const textDownload = state.useState('props.text.exportDownload');
-    const generate = (options) => {
-        const { activeColumns, activeItems } = state.getState();
-        const data = [
-            activeColumns.map((column) => String(column.id)),
-            ...activeItems.map((item) => activeColumns.map((column) => column.exportCell(column.value(item), item))),
-        ];
-        return (0, csvExport_1.csvExport)(data, options);
-    };
-    const copy = () => {
-        navigator.clipboard.writeText(generate(state.getState().props.enableExport.copy));
-    };
-    const download = () => {
-        const a = document.createElement('a');
-        a.href = 'data:text/csv;charset=utf-8,' + encodeURIComponent(generate(state.getState().props.enableExport.download));
-        a.download = 'export.csv';
-        document.body.appendChild(a);
-        a.click();
-        document.body.removeChild(a);
-    };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(core_1.IconButton, Object.assign({ color: "inherit", size: "small", onClick: (e) => setAnchor(e.currentTarget) }, { children: (0, jsx_runtime_1.jsx)(icons_1.CloudDownload, {}, void 0) }), void 0), (0, jsx_runtime_1.jsx)(core_1.Popover, Object.assign({ open: !!anchor, onClose: () => setAnchor(null), anchorEl: anchor, anchorOrigin: { vertical: 'bottom', horizontal: 'center' }, transformOrigin: { vertical: 'top', horizontal: 'left' } }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: classes.dialog }, { children: [(0, jsx_runtime_1.jsx)(core_1.Typography, Object.assign({ variant: "caption" }, { children: textTitle !== null && textTitle !== void 0 ? textTitle : 'Export' }), void 0), (0, jsx_runtime_1.jsx)(core_1.Button, Object.assign({ startIcon: (0, jsx_runtime_1.jsx)(icons_1.AssignmentReturn, {}, void 0), fullWidth: true, onClick: copy }, { children: textCopy !== null && textCopy !== void 0 ? textCopy : 'In die Zwischenablage' }), void 0), (0, jsx_runtime_1.jsx)(core_1.Button, Object.assign({ startIcon: (0, jsx_runtime_1.jsx)(icons_1.CloudDownload, {}, void 0), fullWidth: true, onClick: download }, { children: textDownload !== null && textDownload !== void 0 ? textDownload : 'Herunterladen' }), void 0)] }), void 0) }), void 0)] }, void 0));
-}
-exports.Export = Export;

package/dist/cjs/components/filterComponent.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-export declare type Filter<T> = {
-    filter(item: T): boolean;
-};
-export declare function FilterComponent<T>(): JSX.Element | null;

package/dist/cjs/components/filterComponent.js

@@ -1,25 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FilterComponent = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@material-ui/core");
-const icons_1 = require("@material-ui/icons");
-const react_1 = require("react");
-const table_1 = require("../table");
-const useClasses = (0, core_1.makeStyles)((theme) => ({
-    active: {
-        background: theme.palette.primary.main,
-    },
-}));
-function FilterComponent() {
-    const state = (0, table_1.useTableContext)();
-    const columnId = (0, table_1.useColumnContext)();
-    const classes = useClasses();
-    const isActive = state.useState((state) => !!state.filters.get(columnId), [columnId]);
-    const filterComponent = state.useState((state) => { var _a; return (_a = state.activeColumns.find((column) => column.id === columnId)) === null || _a === void 0 ? void 0 : _a.filterComponent; });
-    const [anchor, setAnchor] = (0, react_1.useState)(null);
-    if (!filterComponent)
-        return null;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(core_1.IconButton, Object.assign({ size: "small", color: "inherit", onClick: (e) => setAnchor(e.currentTarget), className: isActive ? classes.active : undefined }, { children: isActive ? (0, jsx_runtime_1.jsx)(icons_1.FilterList, {}, void 0) : (0, jsx_runtime_1.jsx)(icons_1.ArrowDropDown, {}, void 0) }), void 0), (0, jsx_runtime_1.jsx)(core_1.Popover, Object.assign({ open: !!anchor, onClose: () => setAnchor(null), anchorEl: anchor, anchorOrigin: { vertical: 'bottom', horizontal: 'center' }, transformOrigin: { vertical: 'top', horizontal: 'center' } }, { children: filterComponent }), void 0)] }, void 0));
-}
-exports.FilterComponent = FilterComponent;

package/dist/cjs/components/row.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Row = exports.calcClassName = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const helpers_1 = require("../misc/helpers");
-const table_1 = require("../table");
-const cell_1 = require("./cell");
-const expandComponent_1 = require("./expandComponent");
-const selectComponent_1 = require("./selectComponent");
-const useCommonClasses_1 = require("./useCommonClasses");
-function calcClassName(classes, item, index) {
-    return (0, helpers_1.c)((classes === null || classes === void 0 ? void 0 : classes.cell) instanceof Function ? classes.cell(item, index) : classes === null || classes === void 0 ? void 0 : classes.cell, (classes === null || classes === void 0 ? void 0 : classes.evenCell) === undefined ? undefined : { [classes.evenCell]: index % 2 === 0 }, (classes === null || classes === void 0 ? void 0 : classes.oddCell) === undefined ? undefined : { [classes.oddCell]: index % 2 === 1 });
-}
-exports.calcClassName = calcClassName;
-exports.Row = (0, react_1.memo)(function Row({ itemId, rowIndex }) {
-    var _a, _b;
-    const commonClasses = (0, useCommonClasses_1.useCommonClasses)();
-    const state = (0, table_1.useTableContext)();
-    const divRef = (0, react_1.useRef)(null);
-    const { className, indent, hasChildren, hasDeferredChildren, columnIds, enableSelection, rowAction } = state.useState((state) => {
-        var _a, _b;
-        const item = state.activeItemsById.get(itemId);
-        const index = !item ? -1 : state.activeItems.indexOf(item);
-        return {
-            className: calcClassName(state.props.classes, item, index),
-            indent: item ? (0, helpers_1.getAncestors)(state.activeItemsById, item).size : 0,
-            hasChildren: !!(item === null || item === void 0 ? void 0 : item.children.length),
-            hasDeferredChildren: item && ((_b = (_a = state.props).hasDeferredChildren) === null || _b === void 0 ? void 0 : _b.call(_a, item)),
-            columnIds: state.activeColumns.map((column) => column.id),
-            enableSelection: state.props.enableSelection,
-            rowAction: state.props.rowAction instanceof Function ? (item ? state.props.rowAction(item, index) : null) : state.props.rowAction,
-        };
-    }, [itemId]);
-    (0, react_1.useEffect)(() => {
-        const div = divRef.current;
-        if (!div)
-            return;
-        const o = new ResizeObserver(() => {
-            if (!document.contains(div))
-                return;
-            state.update((state) => {
-                state.rowHeights.set(itemId, div.offsetHeight);
-            });
-        });
-        o.observe(div);
-        return () => o.disconnect();
-    }, [divRef.current]);
-    (_b = (_a = state.getState().props).debug) === null || _b === void 0 ? void 0 : _b.call(_a, 'render row', itemId);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: (0, helpers_1.c)(commonClasses.cellFill, className), ref: divRef }, void 0), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, helpers_1.c)(commonClasses.cell, commonClasses.firstCell, className) }, { children: [(0, jsx_runtime_1.jsx)("div", { style: { width: indent * 20 } }, void 0), enableSelection && (0, jsx_runtime_1.jsx)(selectComponent_1.SelectComponent, { itemId: itemId }, void 0), (hasChildren || hasDeferredChildren) && (0, jsx_runtime_1.jsx)(expandComponent_1.ExpandComponent, { itemId: itemId }, void 0), rowAction] }), void 0), columnIds.map((columnId) => ((0, jsx_runtime_1.jsx)(table_1.ColumnContext.Provider, Object.assign({ value: columnId }, { children: (0, jsx_runtime_1.jsx)(cell_1.Cell, { itemId: itemId, rowIndex: rowIndex }, void 0) }), columnId))), (0, jsx_runtime_1.jsx)("div", { className: (0, helpers_1.c)(commonClasses.cellFill, className) }, void 0)] }, void 0));
-});

package/dist/cjs/components/selectComponent.js

@@ -1,61 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SelectComponent = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@material-ui/core");
-const helpers_1 = require("../misc/helpers");
-const table_1 = require("../table");
-const useClasses = (0, core_1.makeStyles)({
-    justifiedCheckbox: {
-        justifySelf: 'start',
-        color: 'inherit',
-    },
-});
-function SelectComponent({ itemId }) {
-    const classes = useClasses();
-    const state = (0, table_1.useTableContext)();
-    const isSelected = state.useState((state) => {
-        const itemIds = itemId ? [itemId] : [...state.activeItemsById.keys()];
-        return state.activeItemsById.size > 0 && itemIds.every((itemId) => state.selection.has(itemId));
-    }, [itemId]);
-    function toggle(e) {
-        const mouseEvent = e.nativeEvent;
-        const { activeItems, activeItemsById, lastSelectedId, selection, props: { selectSyncChildren, selection: controlledSelection, onSelectionChange }, } = state.getState();
-        let range;
-        if (mouseEvent.shiftKey && itemId) {
-            const a = lastSelectedId ? activeItems.findIndex((i) => lastSelectedId === i.id) : 0;
-            const b = activeItems.findIndex((item) => item.id === itemId);
-            range = activeItems.slice(Math.min(a, b), Math.max(a, b) + 1);
-        }
-        else {
-            const item = itemId ? activeItemsById.get(itemId) : undefined;
-            range = item ? [item] : activeItems;
-        }
-        const newSelection = new Set(selection);
-        for (const item of range) {
-            if (isSelected)
-                newSelection.delete(item.id);
-            else
-                newSelection.add(item.id);
-        }
-        if (selectSyncChildren && isSelected) {
-            for (const ancestor of (0, helpers_1.getAncestors)(activeItemsById, ...range)) {
-                newSelection.delete(ancestor);
-            }
-            for (const descendant of (0, helpers_1.getDescendants)(...range)) {
-                newSelection.delete(descendant);
-            }
-        }
-        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(newSelection);
-        if (!controlledSelection) {
-            state.update((state) => {
-                state.selection = newSelection;
-            });
-        }
-        state.update((state) => {
-            state.lastSelectedId = itemId;
-        });
-    }
-    return (0, jsx_runtime_1.jsx)(core_1.Checkbox, { className: classes.justifiedCheckbox, checked: isSelected, onChange: toggle }, void 0);
-}
-exports.SelectComponent = SelectComponent;

package/dist/cjs/components/sortComponent.js

@@ -1,52 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SortComponent = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@material-ui/core");
-const icons_1 = require("@material-ui/icons");
-const table_1 = require("../table");
-const useClasses = (0, core_1.makeStyles)({
-    sortView: {
-        userSelect: 'none',
-        display: 'grid',
-        gridTemplateColumns: 'minmax(0, 1fr) max-content',
-        alignItems: 'center',
-        cursor: 'pointer',
-        '& > div': {
-            overflow: 'hidden',
-            textOverflow: 'ellipsis',
-        },
-    },
-    empty: {
-        width: 20,
-    },
-});
-function SortComponent({ children }) {
-    const classes = useClasses();
-    const state = (0, table_1.useTableContext)();
-    const columnId = (0, table_1.useColumnContext)();
-    const { direction, index } = state.useState((state) => {
-        var _a, _b;
-        const index = (_a = state.sort.findIndex((s) => s.columnId === columnId)) !== null && _a !== void 0 ? _a : -1;
-        return {
-            direction: (_b = state.sort[index]) === null || _b === void 0 ? void 0 : _b.direction,
-            index: index >= 0 ? index + 1 : undefined,
-        };
-    });
-    function toggle(e) {
-        const { props: { sort: controlledSort, onSortChange }, } = state.getState();
-        const newDirection = direction === 'asc' ? 'desc' : 'asc';
-        const newSort = (e.getModifierState('Control') ? state.getState().sort.filter((s) => s.columnId !== columnId) : []).concat({
-            columnId,
-            direction: newDirection,
-        });
-        onSortChange === null || onSortChange === void 0 ? void 0 : onSortChange(newSort);
-        if (!controlledSort) {
-            state.update((state) => {
-                state.sort = newSort;
-            });
-        }
-    }
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: classes.sortView, onClick: toggle }, { children: [(0, jsx_runtime_1.jsx)("div", { children: children }, void 0), (0, jsx_runtime_1.jsx)(core_1.Badge, Object.assign({ badgeContent: index }, { children: direction === 'asc' ? ((0, jsx_runtime_1.jsx)(icons_1.ArrowUpward, { fontSize: "small" }, void 0)) : direction === 'desc' ? ((0, jsx_runtime_1.jsx)(icons_1.ArrowDownward, { fontSize: "small" }, void 0)) : ((0, jsx_runtime_1.jsx)("div", { className: classes.empty }, void 0)) }), void 0)] }), void 0));
-}
-exports.SortComponent = SortComponent;

package/dist/cjs/components/textFilterComponent.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { Filter } from './filterComponent';
-export declare class TextFilter<T> implements Filter<T> {
-    readonly query: string;
-    readonly filter: (item: T) => boolean;
-    constructor(query: string, filter: (item: T) => boolean);
-}
-export declare function TextFilterComponent<T, V>({ filterBy, compare, }: {
-    filterBy?: (value: V, item: T) => string;
-    compare?: (a: string, b: string) => boolean;
-}): JSX.Element;

package/dist/cjs/components/textFilterComponent.js

@@ -1,70 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextFilterComponent = exports.TextFilter = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const core_1 = require("@material-ui/core");
-const icons_1 = require("@material-ui/icons");
-const react_1 = require("react");
-const helpers_1 = require("../misc/helpers");
-const textMatch_1 = require("../misc/textMatch");
-const table_1 = require("../table");
-class TextFilter {
-    constructor(query, filter) {
-        this.query = query;
-        this.filter = filter;
-    }
-}
-exports.TextFilter = TextFilter;
-const useClasses = (0, core_1.makeStyles)((theme) => ({
-    view: {
-        padding: theme.spacing(2),
-        display: 'grid',
-        '& > :first-child': {
-            marginBottom: theme.spacing(2),
-        },
-    },
-}));
-function TextFilterComponent({ filterBy = helpers_1.asString, compare = textMatch_1.textMatch, }) {
-    var _a;
-    const classes = useClasses();
-    const state = (0, table_1.useTableContext)();
-    const columnId = (0, table_1.useColumnContext)();
-    const _filter = state.useState((state) => {
-        var _a;
-        const column = state.activeColumns.find((column) => column.id === columnId);
-        return (_a = state.filters.get(columnId)) !== null && _a !== void 0 ? _a : column === null || column === void 0 ? void 0 : column.defaultFilter;
-    }, [columnId]);
-    const filter = _filter instanceof TextFilter ? _filter : undefined;
-    const [input, setInput] = (0, react_1.useState)();
-    (0, react_1.useEffect)(() => {
-        if (input === undefined)
-            return;
-        const handle = setTimeout(() => {
-            var _a;
-            const column = state.getState().activeColumns.find((column) => column.id === columnId);
-            if (!column)
-                return;
-            const newFilter = input
-                ? new TextFilter(input, (item) => {
-                    const itemValue = filterBy(column.value(item), item);
-                    return compare(itemValue, input);
-                })
-                : undefined;
-            if (!column.filter) {
-                state.update((state) => {
-                    if (newFilter)
-                        state.filters.set(column.id, newFilter);
-                    else
-                        state.filters.delete(column.id);
-                });
-            }
-            (_a = column.onFilterChange) === null || _a === void 0 ? void 0 : _a.call(column, newFilter);
-            setInput(undefined);
-        }, 500);
-        return () => clearTimeout(handle);
-    }, [input]);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes.view }, { children: (0, jsx_runtime_1.jsx)(core_1.TextField, { value: (_a = input !== null && input !== void 0 ? input : filter === null || filter === void 0 ? void 0 : filter.query) !== null && _a !== void 0 ? _a : '', onChange: (e) => setInput(e.target.value), InputProps: {
-                endAdornment: (filter === null || filter === void 0 ? void 0 : filter.query) ? ((0, jsx_runtime_1.jsx)(core_1.IconButton, Object.assign({ onClick: () => setInput('') }, { children: (0, jsx_runtime_1.jsx)(icons_1.Clear, {}, void 0) }), void 0)) : ((0, jsx_runtime_1.jsx)(icons_1.Search, {}, void 0)),
-            } }, void 0) }), void 0));
-}
-exports.TextFilterComponent = TextFilterComponent;

package/dist/cjs/components/useCommonClasses.d.ts

@@ -1 +0,0 @@
-export declare const useCommonClasses: (props?: any) => import("@material-ui/styles").ClassNameMap<"table" | "text" | "cell" | "sticky" | "headerCell" | "cellFill" | "firstCell" | "headerFill" | "deferredPlaceholder">;

package/dist/cjs/components/useCommonClasses.js

@@ -1,49 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useCommonClasses = void 0;
-const core_1 = require("@material-ui/core");
-const cell = (theme) => ({
-    padding: theme.spacing(0.1, 1),
-    display: 'flex',
-    alignItems: 'center',
-    borderBottom: `1px solid ${theme.palette.grey[200]}`,
-    whiteSpace: 'nowrap',
-    overflow: 'hidden',
-});
-exports.useCommonClasses = (0, core_1.makeStyles)((theme) => ({
-    table: {
-        position: 'relative',
-        display: 'grid',
-    },
-    cell: cell(theme),
-    cellFill: {
-        borderBottom: `1px solid ${theme.palette.grey[200]}`,
-    },
-    headerCell: Object.assign(Object.assign({}, cell(theme)), { borderBottom: `2px solid ${theme.palette.grey[400]}`, gridTemplateColumns: 'minmax(0, 1fr) max-content', background: theme.palette.common.white, '&:not(:first-child)': {
-            borderLeft: `1px solid ${theme.palette.background.default}`,
-        } }),
-    firstCell: {
-        justifyContent: 'start',
-    },
-    sticky: {
-        position: 'sticky',
-        top: 0,
-        zIndex: 1,
-    },
-    headerFill: {
-        borderBottom: `3px solid ${theme.palette.grey[200]}`,
-        background: theme.palette.common.white,
-    },
-    deferredPlaceholder: {
-        padding: theme.spacing(1),
-        borderBottom: `1px solid ${theme.palette.grey[200]}`,
-        gridColumn: '1 / -1',
-        display: 'grid',
-        justifyContent: 'center',
-    },
-    text: {
-        minWidth: 0,
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
-    },
-}));

package/dist/cjs/components/virtualized.js

@@ -1,98 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Virtualized = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const throttle_1 = require("../misc/throttle");
-const table_1 = require("../table");
-const onAncestorScroll = (x, onScroll) => {
-    const find = (x) => (x.parentElement ? [x.parentElement, ...find(x.parentElement)] : [document]);
-    const ancestors = find(x);
-    for (const ancestor of ancestors) {
-        ancestor.addEventListener('scroll', onScroll);
-    }
-    return () => {
-        for (const ancestor of ancestors) {
-            ancestor.removeEventListener('scroll', onScroll);
-        }
-    };
-};
-const findScrollRoot = (x) => {
-    const parent = x.parentElement;
-    if (!parent)
-        return document.documentElement;
-    if (parent.scrollHeight > parent.clientHeight)
-        return parent;
-    return findScrollRoot(parent);
-};
-const relativeOffset = (x, y) => {
-    if (x.offsetParent === y.offsetParent || !x.offsetParent)
-        return x.offsetTop - y.offsetTop;
-    if (x.offsetParent instanceof HTMLElement)
-        return relativeOffset(x.offsetParent, y) + x.offsetTop;
-    return 0;
-};
-function Virtualized(_a) {
-    var _b, _c, _d, _e;
-    var { header, children } = _a, props = __rest(_a, ["header", "children"]);
-    const state = (0, table_1.useTableContext)();
-    const virtual = state.useState('props.virtual');
-    const probeRef = (0, react_1.useRef)(null);
-    const [counter, setCounter] = (0, react_1.useState)(0);
-    const { itemIds = [], from = 0, to, before = 0, after = 0, } = state.useState((state) => {
-        var _a;
-        const itemIds = state.activeItems.map((item) => item.id);
-        const root = probeRef.current && findScrollRoot(probeRef.current);
-        if (!state.props.virtual)
-            return { itemIds };
-        if (!probeRef.current || !root || !document.contains(root))
-            return {};
-        const { rowHeight, initalRowHeight, overscan = 200, overscanTop, overscanBottom, } = (_a = (state.props.virtual instanceof Object ? state.props.virtual : undefined)) !== null && _a !== void 0 ? _a : {};
-        let totalHeight = 0;
-        const rowHeights = itemIds.map((itemId, index) => {
-            var _a, _b;
-            const h = (_b = (_a = rowHeight !== null && rowHeight !== void 0 ? rowHeight : state.rowHeights.get(itemId)) !== null && _a !== void 0 ? _a : initalRowHeight) !== null && _b !== void 0 ? _b : (index === 0 ? 100 : totalHeight / index);
-            totalHeight += h;
-            return h;
-        });
-        const probeOffset = relativeOffset(probeRef.current, root);
-        const headerHeight = probeRef.current.offsetTop;
-        const topOfTable = root.scrollTop - probeOffset + headerHeight;
-        const bottomOfTable = topOfTable + root.clientHeight - headerHeight;
-        let from = 0, to = itemIds.length, before = 0, after = 0;
-        for (const h of rowHeights) {
-            if (before + h > topOfTable - (overscanTop !== null && overscanTop !== void 0 ? overscanTop : overscan))
-                break;
-            from++;
-            before += h;
-        }
-        for (const h of rowHeights.reverse()) {
-            if (after + h > totalHeight - bottomOfTable - (overscanBottom !== null && overscanBottom !== void 0 ? overscanBottom : overscan))
-                break;
-            to--;
-            after += h;
-        }
-        return { itemIds: itemIds.slice(from, to), from, to, before, after };
-    }, [probeRef.current, counter]);
-    const throttleScroll = (_c = (_b = (typeof virtual === 'boolean' ? undefined : virtual)) === null || _b === void 0 ? void 0 : _b.throttleScroll) !== null && _c !== void 0 ? _c : 500;
-    const incCounter = (0, react_1.useMemo)(() => (0, throttle_1.throttle)(() => setCounter((c) => c + 1), throttleScroll), [throttleScroll]);
-    (0, react_1.useEffect)(() => {
-        if (!virtual || !probeRef.current)
-            return;
-        return onAncestorScroll(probeRef.current, incCounter);
-    }, [probeRef.current, incCounter]);
-    (_e = (_d = state.getState().props).debug) === null || _e === void 0 ? void 0 : _e.call(_d, `Virtualalized render ${from} to ${to}`);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, props, { children: [header, virtual && (0, jsx_runtime_1.jsx)("div", { style: { gridColumn: '1 / -1', height: before }, ref: probeRef }, void 0), children(itemIds, from), virtual && (0, jsx_runtime_1.jsx)("div", { style: { gridColumn: '1 / -1', height: after } }, void 0)] }), void 0));
-}
-exports.Virtualized = Virtualized;

package/dist/cjs/index.d.ts

@@ -1,6 +0,0 @@
-export { DefaultFilter, DefaultFilterComponent } from './components/defaultFilterComponent';
-export type { Filter } from './components/filterComponent';
-export { TextFilter, TextFilterComponent } from './components/textFilterComponent';
-export { termMatch, textMatch } from './misc/textMatch';
-export { ColumnContext, Table, TableContext, useColumnContext, useTableContext } from './table';
-export type { Column, Id, InternalColumn, Rows, Sort, SortDirection, TableProps } from './types';