@itwin/itwinui-react 3.12.2 → 3.13.0

package/DEV-cjs/core/Table/columns/actionColumn.js

@@ -0,0 +1,81 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ActionColumn", {
+    enumerable: true,
+    get: function() {
+        return ActionColumn;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _Checkbox = require("../../Checkbox/Checkbox.js");
+const _index = require("../../../utils/index.js");
+const _IconButton = require("../../Buttons/IconButton.js");
+const _Table = require("../Table.js");
+const _selectionColumn = require("./selectionColumn.js");
+const _expanderColumn = require("./expanderColumn.js");
+const _Popover = require("../../Popover/Popover.js");
+const _VisuallyHidden = require("../../VisuallyHidden/VisuallyHidden.js");
+const _Flex = require("../../Flex/Flex.js");
+const ACTION_CELL_ID = 'iui-table-action';
+const ActionColumn = ({ columnManager = false } = {})=>({
+        id: ACTION_CELL_ID,
+        disableResizing: true,
+        disableGroupBy: true,
+        minWidth: 48,
+        width: 48,
+        maxWidth: 48,
+        columnClassName: 'iui-slot',
+        cellClassName: 'iui-slot',
+        disableReordering: true,
+        Header: ({ allColumns, dispatch, state })=>{
+            let buttonRef = _react.useRef(null);
+            if (!columnManager) return null;
+            let defaultColumnIds = [
+                _selectionColumn.SELECTION_CELL_ID,
+                _expanderColumn.EXPANDER_CELL_ID,
+                ACTION_CELL_ID
+            ];
+            let headerCheckBoxes = ()=>allColumns.filter(({ id })=>!defaultColumnIds.includes(id)).map((column)=>{
+                    let { checked } = column.getToggleHiddenProps();
+                    let onChange = ()=>{
+                        column.toggleHidden(checked);
+                        if (0 === Object.keys(state.columnResizing.columnWidths).length) return;
+                        dispatch({
+                            type: _Table.tableResizeStartAction
+                        });
+                        queueMicrotask(()=>{
+                            buttonRef.current?.scrollIntoView({
+                                block: 'nearest'
+                            });
+                        });
+                    };
+                    return _react.createElement(_Checkbox.Checkbox, {
+                        key: column.id,
+                        checked: checked,
+                        disabled: column.disableToggleVisibility,
+                        onChange: onChange,
+                        label: column.render('Header')
+                    });
+                });
+            let popoverProps = 'boolean' != typeof columnManager ? columnManager.dropdownMenuProps : {};
+            return _react.createElement(_Popover.Popover, {
+                applyBackground: true,
+                content: _react.createElement(_Flex.Flex, {
+                    as: _index.FieldsetBase,
+                    className: "iui-table-column-manager",
+                    flexDirection: "column",
+                    alignItems: "flex-start"
+                }, _react.createElement(_VisuallyHidden.VisuallyHidden, {
+                    as: "legend"
+                }, "Show/hide columns"), headerCheckBoxes()),
+                ...popoverProps
+            }, _react.createElement(_IconButton.IconButton, {
+                styleType: "borderless",
+                ref: buttonRef,
+                label: "Column manager"
+            }, _react.createElement(_index.SvgColumnManager, null)));
+        }
+    });

package/DEV-cjs/core/Table/columns/expanderColumn.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    EXPANDER_CELL_ID: function() {
+        return EXPANDER_CELL_ID;
+    },
+    ExpanderColumn: function() {
+        return ExpanderColumn;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _index = require("../../../utils/index.js");
+const _IconButton = require("../../Buttons/IconButton.js");
+const _index1 = require("../cells/index.js");
+const EXPANDER_CELL_ID = 'iui-table-expander';
+const ExpanderColumn = (props = {})=>{
+    let { subComponent, isDisabled } = props;
+    return {
+        id: EXPANDER_CELL_ID,
+        disableResizing: true,
+        disableGroupBy: true,
+        disableReordering: true,
+        minWidth: 48,
+        width: 48,
+        maxWidth: 48,
+        columnClassName: 'iui-slot',
+        cellClassName: 'iui-slot',
+        Cell: (props)=>{
+            let { row } = props;
+            if (subComponent?.(row)) return _react.createElement(_IconButton.IconButton, {
+                className: "iui-table-row-expander",
+                styleType: "borderless",
+                size: "small",
+                onClick: (e)=>{
+                    e.stopPropagation();
+                    row.toggleRowExpanded();
+                },
+                disabled: isDisabled?.(props.row.original),
+                "aria-expanded": row.isExpanded
+            }, _react.createElement(_index.SvgChevronRight, null));
+            return null;
+        },
+        cellRenderer: (props)=>_react.createElement(_index1.DefaultCell, {
+                ...props,
+                isDisabled: (rowData)=>!!isDisabled?.(rowData)
+            })
+    };
+};

package/DEV-cjs/core/Table/columns/index.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    ActionColumn: function() {
+        return _actionColumn.ActionColumn;
+    },
+    EXPANDER_CELL_ID: function() {
+        return _expanderColumn.EXPANDER_CELL_ID;
+    },
+    ExpanderColumn: function() {
+        return _expanderColumn.ExpanderColumn;
+    },
+    SELECTION_CELL_ID: function() {
+        return _selectionColumn.SELECTION_CELL_ID;
+    },
+    SelectionColumn: function() {
+        return _selectionColumn.SelectionColumn;
+    }
+});
+const _actionColumn = require("./actionColumn.js");
+const _selectionColumn = require("./selectionColumn.js");
+const _expanderColumn = require("./expanderColumn.js");

package/DEV-cjs/core/Table/columns/selectionColumn.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SELECTION_CELL_ID: function() {
+        return SELECTION_CELL_ID;
+    },
+    SelectionColumn: function() {
+        return SelectionColumn;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _Checkbox = require("../../Checkbox/Checkbox.js");
+const _index = require("../cells/index.js");
+const SELECTION_CELL_ID = 'iui-table-checkbox-selector';
+const SelectionColumn = (props = {})=>{
+    let { isDisabled, density } = props;
+    let densityWidth = 'condensed' === density ? 42 : 'extra-condensed' === density ? 34 : 48;
+    return {
+        id: SELECTION_CELL_ID,
+        disableResizing: true,
+        disableGroupBy: true,
+        disableReordering: true,
+        minWidth: densityWidth,
+        width: densityWidth,
+        maxWidth: densityWidth,
+        columnClassName: 'iui-slot',
+        cellClassName: 'iui-slot',
+        Header: ({ getToggleAllRowsSelectedProps, toggleAllRowsSelected, rows, preFilteredFlatRows, state })=>{
+            let disabled = preFilteredFlatRows.every((row)=>isDisabled?.(row.original));
+            let checked = preFilteredFlatRows.every((row)=>state.selectedRowIds[row.id] || isDisabled?.(row.original));
+            let indeterminate = !checked && Object.keys(state.selectedRowIds).length > 0;
+            return _react.createElement(_Checkbox.Checkbox, {
+                ...getToggleAllRowsSelectedProps(),
+                style: {},
+                title: "",
+                checked: checked && !disabled,
+                indeterminate: indeterminate,
+                disabled: disabled,
+                onChange: ()=>toggleAllRowsSelected(!rows.some((row)=>row.isSelected))
+            });
+        },
+        Cell: ({ row, selectSubRows = true })=>_react.createElement(_Checkbox.Checkbox, {
+                ...row.getToggleRowSelectedProps(),
+                style: {},
+                title: "",
+                disabled: isDisabled?.(row.original),
+                onClick: (e)=>e.stopPropagation(),
+                onChange: ()=>{
+                    if (row.subRows.length > 0 && selectSubRows) row.toggleRowSelected(!row.subRows.every((subRow)=>subRow.isSelected || isDisabled?.(subRow.original)));
+                    else row.toggleRowSelected();
+                }
+            }),
+        cellRenderer: (props)=>_react.createElement(_index.DefaultCell, {
+                ...props,
+                isDisabled: (rowData)=>!!isDisabled?.(rowData)
+            })
+    };
+};

package/DEV-cjs/core/Table/filters/BaseFilter.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "BaseFilter", {
+    enumerable: true,
+    get: function() {
+        return BaseFilter;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _classnames = _interop_require_default._(require("classnames"));
+const _index = require("../../../utils/index.js");
+const BaseFilter = (props)=>{
+    let { children, className, style, id } = props;
+    (0, _index.useGlobals)();
+    return _react.createElement(_index.Box, {
+        className: (0, _classnames.default)('iui-table-column-filter', className),
+        style: style,
+        onClick: (e)=>{
+            e.stopPropagation();
+        },
+        id: id
+    }, children);
+};

package/DEV-cjs/core/Table/filters/DateRangeFilter/DatePickerInput.js

@@ -0,0 +1,91 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "DatePickerInput", {
+    enumerable: true,
+    get: function() {
+        return DatePickerInput;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _index = require("../../../../utils/index.js");
+const _DatePicker = require("../../../DatePicker/DatePicker.js");
+const _InputGrid = require("../../../InputGrid/InputGrid.js");
+const _Label = require("../../../Label/Label.js");
+const _InputWithDecorations = require("../../../InputWithDecorations/InputWithDecorations.js");
+const _Popover = require("../../../Popover/Popover.js");
+const DatePickerInput = _react.forwardRef((props, forwardedRef)=>{
+    let uid = (0, _index.useId)();
+    let { onChange, date, parseInput, formatDate, label, required, disabled, isFromOrTo, selectedDate, wrapperProps, labelProps, inputWrapperProps, id = uid, localizedNames, showYearSelection, ...rest } = props;
+    let isDateDisabled = (date)=>{
+        if ('to' === isFromOrTo) return (0, _index.isBefore)(date, selectedDate);
+        return (0, _index.isBefore)(selectedDate, date);
+    };
+    let buttonRef = _react.useRef(null);
+    let [inputValue, setInputValue] = _react.useState('');
+    _react.useEffect(()=>{
+        if (date && !isNaN(date.valueOf())) setInputValue(formatDate(date));
+    }, [
+        date,
+        formatDate
+    ]);
+    let [isVisible, setIsVisible] = _react.useState(false);
+    let close = _react.useCallback(()=>setIsVisible(false), []);
+    let onDateSelected = _react.useCallback((date)=>{
+        onChange(date);
+        close();
+        buttonRef.current?.focus();
+    }, [
+        close,
+        onChange
+    ]);
+    let onInputChange = _react.useCallback((event)=>{
+        let value = event.target.value;
+        setInputValue(value);
+        if (!value) onChange(void 0);
+        let parsedDate = parseInput(value);
+        if (parsedDate && !isNaN(parsedDate.valueOf())) onChange(parsedDate);
+    }, [
+        onChange,
+        parseInput
+    ]);
+    return _react.createElement(_InputGrid.InputGrid, {
+        labelPlacement: "inline",
+        ...wrapperProps
+    }, _react.createElement(_Label.Label, {
+        as: "label",
+        required: required,
+        disabled: disabled,
+        htmlFor: id,
+        ...labelProps
+    }, label), _react.createElement(_InputWithDecorations.InputWithDecorations, inputWrapperProps, _react.createElement(_InputWithDecorations.InputWithDecorations.Input, {
+        id: id,
+        value: inputValue,
+        onChange: onInputChange,
+        required: required,
+        disabled: disabled,
+        ref: forwardedRef,
+        ...rest
+    }), _react.createElement(_Popover.Popover, {
+        content: _react.createElement(_DatePicker.DatePicker, {
+            date: date,
+            onChange: onDateSelected,
+            setFocus: true,
+            isDateDisabled: isDateDisabled,
+            localizedNames: localizedNames,
+            applyBackground: false,
+            showDatesOutsideMonth: false,
+            showYearSelection: showYearSelection
+        }),
+        placement: "bottom-end",
+        visible: isVisible,
+        onVisibleChange: setIsVisible,
+        closeOnOutsideClick: true,
+        applyBackground: true
+    }, _react.createElement(_InputWithDecorations.InputWithDecorations.Button, {
+        "aria-label": "Date picker",
+        ref: buttonRef
+    }, _react.createElement(_index.SvgCalendar, null)))));
+});

package/DEV-cjs/core/Table/filters/DateRangeFilter/DateRangeFilter.js

@@ -0,0 +1,98 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "DateRangeFilter", {
+    enumerable: true,
+    get: function() {
+        return DateRangeFilter;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _index = require("../../../../utils/index.js");
+const _FilterButtonBar = require("../FilterButtonBar.js");
+const _BaseFilter = require("../BaseFilter.js");
+const _DatePickerInput = require("./DatePickerInput.js");
+const defaultStrings = {
+    from: 'From',
+    to: 'To'
+};
+const defaultFormatDate = (date)=>{
+    let formatter = new Intl.DateTimeFormat('en-us', {
+        month: 'short',
+        day: 'numeric',
+        year: 'numeric'
+    });
+    return formatter.format(date);
+};
+const defaultParseInput = (text)=>{
+    if (/^[a-z]{3}\s\d{1,2},\s\d{4}$/gi.test(text)) return new Date(text);
+    return new Date('');
+};
+const DateRangeFilter = (props)=>{
+    let { column, translatedLabels, setFilter, clearFilter, formatDate = defaultFormatDate, parseInput = defaultParseInput, placeholder = 'MMM dd, yyyy', showYearSelection } = props;
+    (0, _index.useGlobals)();
+    let translatedStrings = {
+        ...defaultStrings,
+        ...translatedLabels
+    };
+    let [from, setFrom] = _react.useState(column.filterValue?.[0] ? new Date(column.filterValue?.[0]) : void 0);
+    let inputRef = _react.useRef(null);
+    _react.useEffect(()=>{
+        if (inputRef.current) inputRef.current.focus();
+    }, []);
+    let onFromChange = _react.useCallback((date)=>{
+        setFrom((prevDate)=>{
+            if (prevDate || !date) return date;
+            return new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0, 0);
+        });
+    }, []);
+    let [to, setTo] = _react.useState(column.filterValue?.[1] ? new Date(column.filterValue?.[1]) : void 0);
+    let onToChange = _react.useCallback((date)=>{
+        setTo((prevDate)=>{
+            if (prevDate || !date) return date;
+            return new Date(date.getFullYear(), date.getMonth(), date.getDate(), 23, 59, 59, 999);
+        });
+    }, []);
+    let onKeyDown = (event)=>{
+        if (event.altKey) return;
+        if ('Enter' === event.key) setFilter([
+            from,
+            to
+        ]);
+    };
+    return _react.createElement(_BaseFilter.BaseFilter, null, _react.createElement(_DatePickerInput.DatePickerInput, {
+        ref: inputRef,
+        label: translatedStrings.from,
+        date: from,
+        onChange: onFromChange,
+        formatDate: formatDate,
+        parseInput: parseInput,
+        onKeyDown: onKeyDown,
+        placeholder: placeholder,
+        selectedDate: to,
+        isFromOrTo: "from",
+        localizedNames: translatedStrings.datePicker,
+        showYearSelection: showYearSelection
+    }), _react.createElement(_DatePickerInput.DatePickerInput, {
+        label: translatedStrings.to,
+        date: to,
+        onChange: onToChange,
+        formatDate: formatDate,
+        parseInput: parseInput,
+        onKeyDown: onKeyDown,
+        placeholder: placeholder,
+        selectedDate: from,
+        isFromOrTo: "to",
+        localizedNames: translatedStrings.datePicker,
+        showYearSelection: showYearSelection
+    }), _react.createElement(_FilterButtonBar.FilterButtonBar, {
+        setFilter: ()=>setFilter([
+                from,
+                to
+            ]),
+        clearFilter: clearFilter,
+        translatedLabels: translatedLabels
+    }));
+};

package/DEV-cjs/core/Table/filters/FilterButtonBar.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "FilterButtonBar", {
+    enumerable: true,
+    get: function() {
+        return FilterButtonBar;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _classnames = _interop_require_default._(require("classnames"));
+const _index = require("../../../utils/index.js");
+const _Button = require("../../Buttons/Button.js");
+const defaultStrings = {
+    filter: 'Filter',
+    clear: 'Clear'
+};
+const FilterButtonBar = (props)=>{
+    let { children, setFilter, clearFilter, translatedLabels, className, style, id } = props;
+    let translatedStrings = {
+        ...defaultStrings,
+        ...translatedLabels
+    };
+    (0, _index.useGlobals)();
+    return _react.createElement(_index.Box, {
+        className: (0, _classnames.default)('iui-button-bar', className),
+        style: style,
+        id: id
+    }, children, _react.createElement(_Button.Button, {
+        styleType: "high-visibility",
+        onClick: setFilter
+    }, translatedStrings.filter), _react.createElement(_Button.Button, {
+        onClick: clearFilter
+    }, translatedStrings.clear));
+};

package/DEV-cjs/core/Table/filters/FilterToggle.js

@@ -0,0 +1,60 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "FilterToggle", {
+    enumerable: true,
+    get: function() {
+        return FilterToggle;
+    }
+});
+const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _classnames = _interop_require_default._(require("classnames"));
+const _index = require("../../../utils/index.js");
+const _IconButton = require("../../Buttons/IconButton.js");
+const _Popover = require("../../Popover/Popover.js");
+const FilterToggle = (props)=>{
+    let { column, className, ...rest } = props;
+    (0, _index.useGlobals)();
+    let [isVisible, setIsVisible] = _react.useState(false);
+    let close = _react.useCallback(()=>setIsVisible(false), []);
+    let setFilter = _react.useCallback((filterValue)=>{
+        column.setFilter(filterValue);
+        close();
+    }, [
+        close,
+        column
+    ]);
+    let clearFilter = _react.useCallback(()=>{
+        column.setFilter(void 0);
+        close();
+    }, [
+        close,
+        column
+    ]);
+    let isColumnFiltered = null != column.filterValue && '' !== column.filterValue;
+    return _react.createElement(_react.Fragment, null, column.canFilter && column.Filter && _react.createElement(_Popover.Popover, {
+        content: column.render('Filter', {
+            close,
+            setFilter,
+            clearFilter
+        }),
+        placement: "bottom-start",
+        visible: isVisible,
+        onVisibleChange: setIsVisible,
+        closeOnOutsideClick: true,
+        applyBackground: true
+    }, _react.createElement(_IconButton.IconButton, {
+        styleType: "borderless",
+        isActive: isVisible || isColumnFiltered,
+        className: (0, _classnames.default)('iui-table-filter-button', className),
+        "aria-label": "Filter",
+        onClick: (e)=>{
+            e.stopPropagation();
+        },
+        "data-iui-shift": "left",
+        ...rest
+    }, isColumnFiltered ? _react.createElement(_index.SvgFilter, null) : _react.createElement(_index.SvgFilterHollow, null))));
+};

package/DEV-cjs/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "NumberRangeFilter", {
+    enumerable: true,
+    get: function() {
+        return NumberRangeFilter;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _index = require("../../../../utils/index.js");
+const _FilterButtonBar = require("../FilterButtonBar.js");
+const _BaseFilter = require("../BaseFilter.js");
+const _LabeledInput = require("../../../LabeledInput/LabeledInput.js");
+const defaultStrings = {
+    from: 'From',
+    to: 'To'
+};
+const NumberRangeFilter = (props)=>{
+    let { column, translatedLabels, setFilter, clearFilter } = props;
+    (0, _index.useGlobals)();
+    let translatedStrings = {
+        ...defaultStrings,
+        ...translatedLabels
+    };
+    let inputRef = _react.useRef(null);
+    _react.useEffect(()=>{
+        if (inputRef.current) inputRef.current.focus();
+    }, []);
+    let [from, setFrom] = _react.useState(column.filterValue?.[0] ?? '');
+    let [to, setTo] = _react.useState(column.filterValue?.[1] ?? '');
+    let parseInputValue = (value)=>!value || isNaN(Number(value)) ? void 0 : Number(value);
+    let onKeyDown = (event)=>{
+        if (event.altKey) return;
+        if ('Enter' === event.key) setFilter([
+            parseInputValue(from),
+            parseInputValue(to)
+        ]);
+    };
+    return _react.createElement(_BaseFilter.BaseFilter, null, _react.createElement(_LabeledInput.LabeledInput, {
+        ref: inputRef,
+        label: translatedStrings.from,
+        value: from,
+        onChange: (e)=>setFrom(e.target.value),
+        onKeyDown: onKeyDown,
+        type: "number",
+        displayStyle: "inline"
+    }), _react.createElement(_LabeledInput.LabeledInput, {
+        label: translatedStrings.to,
+        value: to,
+        onChange: (e)=>setTo(e.target.value),
+        type: "number",
+        displayStyle: "inline",
+        onKeyDown: onKeyDown
+    }), _react.createElement(_FilterButtonBar.FilterButtonBar, {
+        setFilter: ()=>setFilter([
+                parseInputValue(from),
+                parseInputValue(to)
+            ]),
+        clearFilter: clearFilter,
+        translatedLabels: translatedLabels
+    }));
+};

package/DEV-cjs/core/Table/filters/TextFilter/TextFilter.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TextFilter", {
+    enumerable: true,
+    get: function() {
+        return TextFilter;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = _interop_require_wildcard._(require("react"));
+const _index = require("../../../../utils/index.js");
+const _Input = require("../../../Input/Input.js");
+const _FilterButtonBar = require("../FilterButtonBar.js");
+const _BaseFilter = require("../BaseFilter.js");
+const TextFilter = (props)=>{
+    let { column, translatedLabels, setFilter, clearFilter } = props;
+    (0, _index.useGlobals)();
+    let [text, setText] = _react.useState(column.filterValue ?? '');
+    let inputRef = _react.useRef(null);
+    _react.useEffect(()=>{
+        if (inputRef.current) inputRef.current.focus();
+    }, []);
+    let onKeyDown = (event)=>{
+        if (event.altKey) return;
+        if ('Enter' === event.key) setFilter(text);
+    };
+    return _react.createElement(_BaseFilter.BaseFilter, null, _react.createElement(_Input.Input, {
+        ref: inputRef,
+        value: text,
+        onChange: (e)=>setText(e.target.value),
+        onKeyDown: onKeyDown
+    }), _react.createElement(_FilterButtonBar.FilterButtonBar, {
+        setFilter: ()=>setFilter(text),
+        clearFilter: clearFilter,
+        translatedLabels: translatedLabels
+    }));
+};