@servicetitan/table 31.2.0 → 31.3.0

package/dist/filters/standard-filter-with-multiselect/filter-cell-ext.js

@@ -2,85 +2,132 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { runInAction } from 'mobx';
 import { observer, useLocalStore } from 'mobx-react';
 import { multiselectOperators, isMultiselectOperator } from './multiselect-operators';
-import { DropDownList, MultiSelect, } from '@progress/kendo-react-dropdowns';
-import { IsUnaryFilter, cellOperatorChange, } from '@progress/kendo-react-grid/dist/npm/filterCommon';
+import { DropDownList, MultiSelect } from '@progress/kendo-react-dropdowns';
+import { IsUnaryFilter, cellOperatorChange } from '@progress/kendo-react-grid/dist/npm/filterCommon';
 import { Icon, Tooltip } from '@servicetitan/design-system';
 import * as Styles from './filter-cell-ext.module.css';
 import classNames from 'classnames';
 // like standard filter cell (rendered for string type), but with support of multiselect operators
-export const FilterCellExt = observer(props => {
-    const store = useLocalStore(oprops => ({
-        get operators() {
-            return multiselectOperators.concat(oprops.onlyMultiselectAndEmptyOperators
-                ? oprops.operators.filter(o => o.operator === 'isempty' || o.operator === 'isnotempty')
-                : oprops.operators);
-        },
-        get operatorValue() {
-            return this.operators.find(item => item.operator === oprops.operator);
-        },
-        searchQuery: '',
-        filterChange(event) {
-            runInAction(() => (this.searchQuery = event.filter.value));
-        },
-        get filteredValuesSet() {
-            const queryLC = this.searchQuery.toLowerCase();
-            return oprops.options.filter(v => v.textLC.includes(queryLC));
-        },
-        get onlyFirstValues() {
-            return oprops.maxFoundValues &&
-                oprops.maxFoundValues < this.filteredValuesSet.length
-                ? oprops.maxFoundValues
-                : false;
-        },
-        get filteredVisibleValues() {
-            return this.onlyFirstValues
-                ? this.filteredValuesSet.slice(0, this.onlyFirstValues)
-                : this.filteredValuesSet;
-        },
-        get valueTextMap() {
-            return new Map(oprops.options.map(o => [o.value, o.text]));
-        },
-        get multiselectValue() {
-            return Array.isArray(oprops.value)
-                ? oprops.value.map(v => {
-                    var _a;
-                    return ({
+export const FilterCellExt = observer((props)=>{
+    const store = useLocalStore((oprops)=>({
+            get operators () {
+                return multiselectOperators.concat(oprops.onlyMultiselectAndEmptyOperators ? oprops.operators.filter((o)=>o.operator === 'isempty' || o.operator === 'isnotempty') : oprops.operators);
+            },
+            get operatorValue () {
+                return this.operators.find((item)=>item.operator === oprops.operator);
+            },
+            searchQuery: '',
+            filterChange (event) {
+                runInAction(()=>this.searchQuery = event.filter.value);
+            },
+            get filteredValuesSet () {
+                const queryLC = this.searchQuery.toLowerCase();
+                return oprops.options.filter((v)=>v.textLC.includes(queryLC));
+            },
+            get onlyFirstValues () {
+                return oprops.maxFoundValues && oprops.maxFoundValues < this.filteredValuesSet.length ? oprops.maxFoundValues : false;
+            },
+            get filteredVisibleValues () {
+                return this.onlyFirstValues ? this.filteredValuesSet.slice(0, this.onlyFirstValues) : this.filteredValuesSet;
+            },
+            get valueTextMap () {
+                return new Map(oprops.options.map((o)=>[
+                        o.value,
+                        o.text
+                    ]));
+            },
+            get multiselectValue () {
+                return Array.isArray(oprops.value) ? oprops.value.map((v)=>{
+                    var _this_valueTextMap_get;
+                    return {
                         value: v,
-                        text: (_a = this.valueTextMap.get(v)) !== null && _a !== void 0 ? _a : v.toString(),
-                    });
-                })
-                : [];
-        },
-    }), props);
-    const { operator = '', onChange, allowCustomValues, multiselectItemRender, multiselectTagRender, multiselectListNoDataRender, } = props;
-    const handleInputChange = (e) => onChange({
-        operator,
-        value: e.target.value,
-        syntheticEvent: e,
-    });
-    const handleMultiselectChange = (e) => {
-        const newValue = e.value.map((v) => { var _a; return (_a = v.value) !== null && _a !== void 0 ? _a : (props.handleCustomValuesAsNumber ? +v.text : v.text); });
+                        text: (_this_valueTextMap_get = this.valueTextMap.get(v)) !== null && _this_valueTextMap_get !== void 0 ? _this_valueTextMap_get : v.toString()
+                    };
+                }) : [];
+            }
+        }), props);
+    const { operator = '', onChange, allowCustomValues, multiselectItemRender, multiselectTagRender, multiselectListNoDataRender } = props;
+    const handleInputChange = (e)=>onChange({
+            operator,
+            value: e.target.value,
+            syntheticEvent: e
+        });
+    const handleMultiselectChange = (e)=>{
+        const newValue = e.value.map((v)=>{
+            var _v_value;
+            return (_v_value = v.value) !== null && _v_value !== void 0 ? _v_value : props.handleCustomValuesAsNumber ? +v.text : v.text;
+        });
         onChange({
             operator,
-            value: newValue.length ? newValue : '', // for Kendo to handle empty array as an empty value TODO: check if there is another way
-            syntheticEvent: e.syntheticEvent,
+            value: newValue.length ? newValue : '',
+            syntheticEvent: e.syntheticEvent
         });
     };
     // conversions for better compatibility when switching plain/array operators
-    const handleOperatorChange = (event) => {
-        const newValue = isMultiselectOperator(operator) === isMultiselectOperator(event.target.value.operator)
-            ? props.value
-            : '';
+    const handleOperatorChange = (event)=>{
+        const newValue = isMultiselectOperator(operator) === isMultiselectOperator(event.target.value.operator) ? props.value : '';
         cellOperatorChange(event, newValue, onChange);
     };
-    const allowCustomAdd = (allowCustomValues &&
-        store.searchQuery &&
-        (!props.handleCustomValuesAsNumber || !isNaN(+store.searchQuery))) ||
-        false;
-    return (_jsxs("div", { children: [_jsx(DropDownList, { value: store.operatorValue, onChange: handleOperatorChange, data: store.operators, className: "m-b-1", textField: "text" }), (typeof operator !== 'string' || !IsUnaryFilter(operator)) &&
-                (isMultiselectOperator(operator) ? (_jsx(MultiSelect, { value: store.multiselectValue, onChange: handleMultiselectChange, filterable: true, onFilterChange: store.filterChange, allowCustom: allowCustomAdd, data: store.filteredVisibleValues, textField: "text", dataItemKey: "value", className: classNames('m-b-1', Styles.multiSelect), header: allowCustomAdd && _jsx("div", { className: Styles.customItemAddMarker }), footer: allowCustomAdd ? (_jsxs("div", { className: Styles.returnToUse, children: [_jsx(Icon, { name: "keyboard_return" }), "to create filter"] })) : (store.onlyFirstValues && (_jsxs("div", { className: Styles.returnToUse, children: ["First ", store.onlyFirstValues, " values are shown. ", _jsx("br", {}), "Type to search for other values."] }))), itemRender: multiselectItemRender, tagRender: multiselectTagRender !== null && multiselectTagRender !== void 0 ? multiselectTagRender : defaultMultiselectTagRender, listNoDataRender: multiselectListNoDataRender })) : (_jsx("input", { className: "k-input k-input-md k-rounded-md k-input-solid m-b-1", value: props.value, onChange: handleInputChange })))] }));
+    const allowCustomAdd = allowCustomValues && store.searchQuery && (!props.handleCustomValuesAsNumber || !isNaN(+store.searchQuery)) || false;
+    return /*#__PURE__*/ _jsxs("div", {
+        children: [
+            /*#__PURE__*/ _jsx(DropDownList, {
+                value: store.operatorValue,
+                onChange: handleOperatorChange,
+                data: store.operators,
+                className: "m-b-1",
+                textField: "text"
+            }),
+            (typeof operator !== 'string' || !IsUnaryFilter(operator)) && (isMultiselectOperator(operator) ? /*#__PURE__*/ _jsx(MultiSelect, {
+                value: store.multiselectValue,
+                onChange: handleMultiselectChange,
+                filterable: true,
+                onFilterChange: store.filterChange,
+                allowCustom: allowCustomAdd,
+                data: store.filteredVisibleValues,
+                textField: "text",
+                dataItemKey: "value",
+                className: classNames('m-b-1', Styles.multiSelect),
+                header: allowCustomAdd && /*#__PURE__*/ _jsx("div", {
+                    className: Styles.customItemAddMarker
+                }),
+                footer: allowCustomAdd ? /*#__PURE__*/ _jsxs("div", {
+                    className: Styles.returnToUse,
+                    children: [
+                        /*#__PURE__*/ _jsx(Icon, {
+                            name: "keyboard_return"
+                        }),
+                        "to create filter"
+                    ]
+                }) : store.onlyFirstValues && /*#__PURE__*/ _jsxs("div", {
+                    className: Styles.returnToUse,
+                    children: [
+                        "First ",
+                        store.onlyFirstValues,
+                        " values are shown. ",
+                        /*#__PURE__*/ _jsx("br", {}),
+                        "Type to search for other values."
+                    ]
+                }),
+                itemRender: multiselectItemRender,
+                tagRender: multiselectTagRender !== null && multiselectTagRender !== void 0 ? multiselectTagRender : defaultMultiselectTagRender,
+                listNoDataRender: multiselectListNoDataRender
+            }) : /*#__PURE__*/ _jsx("input", {
+                className: "k-input k-input-md k-rounded-md k-input-solid m-b-1",
+                value: props.value,
+                onChange: handleInputChange
+            }))
+        ]
+    });
 });
-const defaultMultiselectTagRender = (tagData, li) => {
-    return (_jsx(Tooltip, { portal: true, text: tagData.text, className: Styles.multiSelectTagTooltipWrapper, popperClassName: Styles.multiSelectTagTooltip, children: li }));
+const defaultMultiselectTagRender = (tagData, li)=>{
+    return /*#__PURE__*/ _jsx(Tooltip, {
+        portal: true,
+        text: tagData.text,
+        className: Styles.multiSelectTagTooltipWrapper,
+        popperClassName: Styles.multiSelectTagTooltip,
+        children: li
+    });
 };
+
 //# sourceMappingURL=filter-cell-ext.js.map

package/dist/filters/standard-filter-with-multiselect/filter-cell-ext.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-cell-ext.js","sourceRoot":"","sources":["../../../src/filters/standard-filter-with-multiselect/filter-cell-ext.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../src/filters/standard-filter-with-multiselect/filter-cell-ext.tsx"],"sourcesContent":["import { ReactElement, ReactNode, FC, ChangeEvent } from 'react';\nimport { runInAction } from 'mobx';\nimport { observer, useLocalStore } from 'mobx-react';\nimport { multiselectOperators, isMultiselectOperator } from './multiselect-operators';\n\nimport {\n    DropDownList,\n    DropDownListChangeEvent,\n    MultiSelect,\n    MultiSelectChangeEvent,\n    MultiSelectFilterChangeEvent,\n    ListItemProps,\n    MultiSelectTagData,\n} from '@progress/kendo-react-dropdowns';\n\nimport { GridColumnMenuFilterCellProps as TableColumnMenuFilterCellProps } from '@progress/kendo-react-grid/dist/npm/columnMenu/GridColumnMenuFilterCell';\nimport {\n    IsUnaryFilter,\n    cellOperatorChange,\n} from '@progress/kendo-react-grid/dist/npm/filterCommon';\n\nimport { Icon, Tooltip } from '@servicetitan/design-system';\n\nimport * as Styles from './filter-cell-ext.module.css';\nimport classNames from 'classnames';\n//\n\ninterface ValueWithLowerCase {\n    value: any;\n    text: string;\n    textLC: string;\n}\n\nexport interface FilterCellExtProps extends TableColumnMenuFilterCellProps {\n    options: ValueWithLowerCase[];\n    maxFoundValues?: number;\n    allowCustomValues?: boolean;\n    onlyMultiselectAndEmptyOperators?: boolean;\n    handleCustomValuesAsNumber?: boolean;\n    multiselectItemRender?(li: ReactElement<HTMLLIElement>, itemProps: ListItemProps): ReactNode;\n    multiselectTagRender?(\n        tagData: MultiSelectTagData,\n        li: ReactElement<HTMLLIElement>\n    ): ReactElement<HTMLLIElement>;\n    multiselectListNoDataRender?(element: ReactElement<HTMLDivElement>): ReactNode;\n}\n\n// like standard filter cell (rendered for string type), but with support of multiselect operators\nexport const FilterCellExt: FC<FilterCellExtProps> = observer(props => {\n    const store = useLocalStore(\n        oprops => ({\n            get operators() {\n                return multiselectOperators.concat(\n                    oprops.onlyMultiselectAndEmptyOperators\n                        ? oprops.operators.filter(\n                              o => o.operator === 'isempty' || o.operator === 'isnotempty'\n                          )\n                        : oprops.operators\n                );\n            },\n            get operatorValue() {\n                return this.operators.find(item => item.operator === oprops.operator);\n            },\n            searchQuery: '',\n            filterChange(event: MultiSelectFilterChangeEvent) {\n                runInAction(() => (this.searchQuery = event.filter.value));\n            },\n            get filteredValuesSet() {\n                const queryLC = this.searchQuery.toLowerCase();\n                return oprops.options.filter(v => v.textLC.includes(queryLC));\n            },\n            get onlyFirstValues() {\n                return oprops.maxFoundValues &&\n                    oprops.maxFoundValues < this.filteredValuesSet.length\n                    ? oprops.maxFoundValues\n                    : false;\n            },\n            get filteredVisibleValues() {\n                return this.onlyFirstValues\n                    ? this.filteredValuesSet.slice(0, this.onlyFirstValues)\n                    : this.filteredValuesSet;\n            },\n            get valueTextMap() {\n                return new Map(oprops.options.map(o => [o.value, o.text]));\n            },\n            get multiselectValue() {\n                return Array.isArray(oprops.value)\n                    ? oprops.value.map(v => ({\n                          value: v,\n                          text: this.valueTextMap.get(v) ?? v.toString(),\n                      }))\n                    : [];\n            },\n        }),\n        props\n    );\n\n    const {\n        operator = '',\n        onChange,\n        allowCustomValues,\n        multiselectItemRender,\n        multiselectTagRender,\n        multiselectListNoDataRender,\n    } = props;\n\n    const handleInputChange = (e: ChangeEvent<HTMLInputElement>) =>\n        onChange({\n            operator,\n            value: e.target.value,\n            syntheticEvent: e,\n        });\n\n    const handleMultiselectChange = (e: MultiSelectChangeEvent) => {\n        const newValue = e.value.map(\n            (v: any) => v.value ?? (props.handleCustomValuesAsNumber ? +v.text : v.text)\n        );\n        onChange({\n            operator,\n            value: newValue.length ? newValue : '', // for Kendo to handle empty array as an empty value TODO: check if there is another way\n            syntheticEvent: e.syntheticEvent,\n        });\n    };\n\n    // conversions for better compatibility when switching plain/array operators\n    const handleOperatorChange = (event: DropDownListChangeEvent) => {\n        const newValue =\n            isMultiselectOperator(operator) === isMultiselectOperator(event.target.value.operator)\n                ? props.value\n                : '';\n        cellOperatorChange(event, newValue, onChange);\n    };\n\n    const allowCustomAdd =\n        (allowCustomValues &&\n            store.searchQuery &&\n            (!props.handleCustomValuesAsNumber || !isNaN(+store.searchQuery))) ||\n        false;\n\n    return (\n        <div>\n            <DropDownList\n                value={store.operatorValue}\n                onChange={handleOperatorChange}\n                data={store.operators}\n                className=\"m-b-1\"\n                textField=\"text\"\n            />\n            {(typeof operator !== 'string' || !IsUnaryFilter(operator)) &&\n                (isMultiselectOperator(operator) ? (\n                    <MultiSelect\n                        value={store.multiselectValue}\n                        onChange={handleMultiselectChange}\n                        filterable\n                        onFilterChange={store.filterChange}\n                        allowCustom={allowCustomAdd}\n                        data={store.filteredVisibleValues}\n                        textField=\"text\"\n                        dataItemKey=\"value\"\n                        className={classNames('m-b-1', Styles.multiSelect)}\n                        header={allowCustomAdd && <div className={Styles.customItemAddMarker} />}\n                        footer={\n                            allowCustomAdd ? (\n                                <div className={Styles.returnToUse}>\n                                    <Icon name=\"keyboard_return\" />\n                                    to create filter\n                                </div>\n                            ) : (\n                                store.onlyFirstValues && (\n                                    <div className={Styles.returnToUse}>\n                                        First {store.onlyFirstValues} values are shown. <br />\n                                        Type to search for other values.\n                                    </div>\n                                )\n                            )\n                        }\n                        itemRender={multiselectItemRender}\n                        tagRender={multiselectTagRender ?? defaultMultiselectTagRender}\n                        listNoDataRender={multiselectListNoDataRender}\n                    />\n                ) : (\n                    <input\n                        className=\"k-input k-input-md k-rounded-md k-input-solid m-b-1\"\n                        value={props.value}\n                        onChange={handleInputChange}\n                    />\n                ))}\n        </div>\n    );\n});\n\nconst defaultMultiselectTagRender = (\n    tagData: MultiSelectTagData,\n    li: ReactElement<HTMLLIElement>\n): ReactElement<HTMLLIElement> => {\n    return (\n        <Tooltip\n            portal\n            text={tagData.text}\n            className={Styles.multiSelectTagTooltipWrapper}\n            popperClassName={Styles.multiSelectTagTooltip}\n        >\n            {li}\n        </Tooltip>\n    );\n};\n"],"names":["runInAction","observer","useLocalStore","multiselectOperators","isMultiselectOperator","DropDownList","MultiSelect","IsUnaryFilter","cellOperatorChange","Icon","Tooltip","Styles","classNames","FilterCellExt","props","store","oprops","operators","concat","onlyMultiselectAndEmptyOperators","filter","o","operator","operatorValue","find","item","searchQuery","filterChange","event","value","filteredValuesSet","queryLC","toLowerCase","options","v","textLC","includes","onlyFirstValues","maxFoundValues","length","filteredVisibleValues","slice","valueTextMap","Map","map","text","multiselectValue","Array","isArray","get","toString","onChange","allowCustomValues","multiselectItemRender","multiselectTagRender","multiselectListNoDataRender","handleInputChange","e","target","syntheticEvent","handleMultiselectChange","newValue","handleCustomValuesAsNumber","handleOperatorChange","allowCustomAdd","isNaN","div","data","className","textField","filterable","onFilterChange","allowCustom","dataItemKey","multiSelect","header","customItemAddMarker","footer","returnToUse","name","br","itemRender","tagRender","defaultMultiselectTagRender","listNoDataRender","input","tagData","li","portal","multiSelectTagTooltipWrapper","popperClassName","multiSelectTagTooltip"],"mappings":"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"}

package/dist/filters/standard-filter-with-multiselect/filter-cell-ext.module.css.d.ts

@@ -0,0 +1,7 @@
+export const __esModule: true;
+export const customItemAddMarker: string;
+export const multiSelect: string;
+export const multiSelectTagTooltip: string;
+export const multiSelectTagTooltipWrapper: string;
+export const returnToUse: string;
+

package/dist/filters/standard-filter-with-multiselect/multiselect-operators.js

@@ -1,6 +1,13 @@
 export const multiselectOperators = [
-    { text: 'Is one of', operator: 'in' },
-    { text: 'Is not one of', operator: 'notin' },
+    {
+        text: 'Is one of',
+        operator: 'in'
+    },
+    {
+        text: 'Is not one of',
+        operator: 'notin'
+    }
 ];
-export const isMultiselectOperator = (operator) => multiselectOperators.some(o => o.operator === operator);
+export const isMultiselectOperator = (operator)=>multiselectOperators.some((o)=>o.operator === operator);
+
 //# sourceMappingURL=multiselect-operators.js.map

package/dist/filters/standard-filter-with-multiselect/multiselect-operators.js.map

@@ -1 +1 @@
-{"version":3,"file":"multiselect-operators.js","sourceRoot":"","sources":["../../../src/filters/standard-filter-with-multiselect/multiselect-operators.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAChC,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE;IACrC,EAAE,IAAI,EAAE,eAAe,EAAE,QAAQ,EAAE,OAAO,EAAE;CAC/C,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,QAA2B,EAAE,EAAE,CACjE,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC"}
+{"version":3,"sources":["../../../src/filters/standard-filter-with-multiselect/multiselect-operators.ts"],"sourcesContent":["export const multiselectOperators = [\n    { text: 'Is one of', operator: 'in' },\n    { text: 'Is not one of', operator: 'notin' },\n];\n\nexport const isMultiselectOperator = (operator: string | Function) =>\n    multiselectOperators.some(o => o.operator === operator);\n"],"names":["multiselectOperators","text","operator","isMultiselectOperator","some","o"],"mappings":"AAAA,OAAO,MAAMA,uBAAuB;IAChC;QAAEC,MAAM;QAAaC,UAAU;IAAK;IACpC;QAAED,MAAM;QAAiBC,UAAU;IAAQ;CAC9C,CAAC;AAEF,OAAO,MAAMC,wBAAwB,CAACD,WAClCF,qBAAqBI,IAAI,CAACC,CAAAA,IAAKA,EAAEH,QAAQ,KAAKA,UAAU"}

package/dist/filters/standard-filter-with-multiselect/standard-filter-with-multiselect.js

@@ -7,71 +7,93 @@ import { FilterCellExt } from './filter-cell-ext';
 /*
  * StandardFilterWithMultiselect is like standard Kendo filter, but with additional operators 'Is one of' / 'Is not one of'.
  * Intended to be used with string fields (though it's possible to adopt for number fields as well, if someone will have a need).
- */
-export function standardFilterWithMultiselect(optionsConfig = {}, filterCellConfig = {}) {
+ */ export function standardFilterWithMultiselect(optionsConfig = {}, filterCellConfig = {}) {
     const optionsConfigFull = {
         maxExtractedLength: 64,
         options: [],
-        ...optionsConfig,
+        ...optionsConfig
     };
     const filterCellConfigFull = {
         allowCustomValues: true,
         maxFoundValues: 1000,
-        ...filterCellConfig,
+        ...filterCellConfig
     };
     // Filter UI with data fetcher
-    const FilterUIWithValues = observer(props => {
-        const store = useLocalStore(oprops => ({
-            get field() {
-                return oprops.firstFilterProps.field;
-            },
-            get itemsFromDataSource() {
-                var _a;
-                const dataSource = (_a = optionsConfigFull.tableState) === null || _a === void 0 ? void 0 : _a.dataSource;
-                return dataSource && this.field && fromPromise(dataSource.getData({}));
-            },
-            get valuesfromTableState() {
-                if (!this.itemsFromDataSource ||
-                    !(this.itemsFromDataSource.state === 'fulfilled')) {
-                    return [];
-                }
-                return this.itemsFromDataSource.value.data
-                    .map(i => i[this.field])
-                    .filter(v => typeof v === 'number' ||
-                    (typeof v === 'string' &&
-                        v.length > 0 &&
-                        v.length <= optionsConfigFull.maxExtractedLength));
-            },
-            get options() {
-                return Array.from(new Set(this.valuesfromTableState.concat(optionsConfigFull.options))).map(v => {
-                    switch (typeof v) {
-                        case 'string':
-                            return {
-                                value: v,
-                                text: v,
-                                textLC: v.toLowerCase(),
-                            };
-                        case 'number':
-                            return {
-                                value: v,
-                                text: v.toString(),
-                                textLC: v.toString().toLowerCase(),
-                            };
-                        case 'object':
-                            return {
-                                value: v.value,
-                                text: v.text,
-                                textLC: v.text.toLowerCase(),
-                            };
-                        default:
-                            throw 'Incompatible option type.';
+    const FilterUIWithValues = observer((props)=>{
+        const store = useLocalStore((oprops)=>({
+                get field () {
+                    return oprops.firstFilterProps.field;
+                },
+                get itemsFromDataSource () {
+                    var _optionsConfigFull_tableState;
+                    const dataSource = (_optionsConfigFull_tableState = optionsConfigFull.tableState) === null || _optionsConfigFull_tableState === void 0 ? void 0 : _optionsConfigFull_tableState.dataSource;
+                    return dataSource && this.field && fromPromise(dataSource.getData({}));
+                },
+                get valuesfromTableState () {
+                    if (!this.itemsFromDataSource || !(this.itemsFromDataSource.state === 'fulfilled')) {
+                        return [];
                     }
-                });
-            },
-        }), props);
-        const { firstFilterProps, secondFilterProps, hideSecondFilter, logicData, logicValue, onLogicChange, } = props;
-        return (_jsxs("div", { children: [_jsx(FilterCellExt, { ...firstFilterProps, options: store.options, ...filterCellConfigFull }), !hideSecondFilter && (_jsxs("div", { children: [_jsx(DropDownList, { data: logicData, value: logicValue, onChange: onLogicChange, className: "k-filter-and m-b-1-i", textField: "text" }), _jsx(FilterCellExt, { ...secondFilterProps, options: store.options, ...filterCellConfigFull })] }))] }));
+                    return this.itemsFromDataSource.value.data.map((i)=>i[this.field]).filter((v)=>typeof v === 'number' || typeof v === 'string' && v.length > 0 && v.length <= optionsConfigFull.maxExtractedLength);
+                },
+                get options () {
+                    return Array.from(new Set(this.valuesfromTableState.concat(optionsConfigFull.options))).map((v)=>{
+                        switch(typeof v){
+                            case 'string':
+                                return {
+                                    value: v,
+                                    text: v,
+                                    textLC: v.toLowerCase()
+                                };
+                            case 'number':
+                                return {
+                                    value: v,
+                                    text: v.toString(),
+                                    textLC: v.toString().toLowerCase()
+                                };
+                            case 'object':
+                                return {
+                                    value: v.value,
+                                    text: v.text,
+                                    textLC: v.text.toLowerCase()
+                                };
+                            default:
+                                throw 'Incompatible option type.';
+                        }
+                    });
+                }
+            }), props);
+        const { firstFilterProps, secondFilterProps, hideSecondFilter, logicData, logicValue, onLogicChange } = props;
+        return /*#__PURE__*/ _jsxs("div", {
+            children: [
+                /*#__PURE__*/ _jsx(FilterCellExt, {
+                    ...firstFilterProps,
+                    options: store.options,
+                    ...filterCellConfigFull
+                }),
+                !hideSecondFilter && /*#__PURE__*/ _jsxs("div", {
+                    children: [
+                        /*#__PURE__*/ _jsx(DropDownList, {
+                            data: logicData,
+                            value: logicValue,
+                            onChange: onLogicChange,
+                            className: "k-filter-and m-b-1-i",
+                            textField: "text"
+                        }),
+                        /*#__PURE__*/ _jsx(FilterCellExt, {
+                            ...secondFilterProps,
+                            options: store.options,
+                            ...filterCellConfigFull
+                        })
+                    ]
+                })
+            ]
+        });
     });
-    return (props) => (_jsx(TableColumnMenuFilterExt, { ...props, filterUI: FilterUIWithValues, expanded: true }));
+    return (props)=>/*#__PURE__*/ _jsx(TableColumnMenuFilterExt, {
+            ...props,
+            filterUI: FilterUIWithValues,
+            expanded: true
+        });
 }
+
 //# sourceMappingURL=standard-filter-with-multiselect.js.map

package/dist/filters/standard-filter-with-multiselect/standard-filter-with-multiselect.js.map

@@ -1 +1 @@
-{"version":3,"file":"standard-filter-with-multiselect.js","sourceRoot":"","sources":["../../../src/filters/standard-filter-with-multiselect/standard-filter-with-multiselect.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../src/filters/standard-filter-with-multiselect/standard-filter-with-multiselect.tsx"],"sourcesContent":["import { FC } from 'react';\nimport { observer, useLocalStore } from 'mobx-react';\nimport { fromPromise } from 'mobx-utils';\n\nimport { DropDownList } from '@progress/kendo-react-dropdowns';\n\nimport { TableColumnMenuProps } from '@servicetitan/design-system';\nimport { GridColumnMenuFilterUIProps as TableColumnMenuFilterUIProps } from '@progress/kendo-react-grid/dist/npm/interfaces/GridColumnMenuFilterUIProps';\nimport { IdType } from '@servicetitan/data-query';\nimport { TableState } from '../../table-state';\n\nimport { TableColumnMenuFilterExt } from './table-column-menu-filter-ext';\nimport { FilterCellExt, FilterCellExtProps } from './filter-cell-ext';\n//\n\ntype AcceptableOption = string | number | { value: any; text: string };\n\ninterface OptionsConfig<T, TId extends IdType = never> {\n    /* tableState is used to extract values set for multiselect */\n    tableState?: TableState<T, TId>;\n    /* values longer than maxExtractedLength wouldn't be extracted from tableState (for sanity). Default is 65 characters */\n    maxExtractedLength?: number;\n    /* set of values for multiselect */\n    options?: AcceptableOption[];\n}\n\ninterface FilterCellConfig {\n    /* maximum number of values to show in Multiselect dropdown list at one time */\n    maxFoundValues?: number;\n    /* allow user to input custom values; default: true */\n    allowCustomValues?: boolean;\n    /* convert user-added Multiselect options to numbers; default: false */\n    handleCustomValuesAsNumber?: boolean;\n    /* allow only \"Is [not] one of\" and \"Is [not] empty\" operators; default: false */\n    onlyMultiselectAndEmptyOperators?: boolean;\n    /* Multiselect itemRender property (for very special cases) */\n    multiselectItemRender?: FilterCellExtProps['multiselectItemRender'];\n    /* Multiselect tagRender property (for very special cases) */\n    multiselectTagRender?: FilterCellExtProps['multiselectTagRender'];\n    /* Multiselect listNoDataRender property (for very special cases) */\n    multiselectListNoDataRender?: FilterCellExtProps['multiselectListNoDataRender'];\n}\n\n/*\n * StandardFilterWithMultiselect is like standard Kendo filter, but with additional operators 'Is one of' / 'Is not one of'.\n * Intended to be used with string fields (though it's possible to adopt for number fields as well, if someone will have a need).\n */\n\nexport function standardFilterWithMultiselect<T, TId extends IdType = never>(\n    optionsConfig: OptionsConfig<T, TId> = {},\n    filterCellConfig: FilterCellConfig = {}\n) {\n    const optionsConfigFull = {\n        maxExtractedLength: 64,\n        options: [] as string[],\n        ...optionsConfig,\n    };\n\n    const filterCellConfigFull = {\n        allowCustomValues: true,\n        maxFoundValues: 1000,\n        ...filterCellConfig,\n    };\n\n    // Filter UI with data fetcher\n    const FilterUIWithValues: FC<TableColumnMenuFilterUIProps> = observer(props => {\n        const store = useLocalStore(\n            oprops => ({\n                get field() {\n                    return oprops.firstFilterProps.field as keyof T;\n                },\n                get itemsFromDataSource() {\n                    const dataSource = optionsConfigFull.tableState?.dataSource;\n                    return dataSource && this.field && fromPromise(dataSource.getData({}));\n                },\n                get valuesfromTableState(): AcceptableOption[] {\n                    if (\n                        !this.itemsFromDataSource ||\n                        !(this.itemsFromDataSource.state === 'fulfilled')\n                    ) {\n                        return [];\n                    }\n                    return (this.itemsFromDataSource.value.data as T[])\n                        .map(i => i[this.field])\n                        .filter(\n                            v =>\n                                typeof v === 'number' ||\n                                (typeof v === 'string' &&\n                                    v.length > 0 &&\n                                    v.length <= optionsConfigFull.maxExtractedLength)\n                        ) as any[];\n                },\n                get options() {\n                    return Array.from(\n                        new Set(this.valuesfromTableState.concat(optionsConfigFull.options))\n                    ).map(v => {\n                        switch (typeof v) {\n                            case 'string':\n                                return {\n                                    value: v,\n                                    text: v,\n                                    textLC: v.toLowerCase(),\n                                };\n                            case 'number':\n                                return {\n                                    value: v,\n                                    text: v.toString(),\n                                    textLC: v.toString().toLowerCase(),\n                                };\n                            case 'object':\n                                return {\n                                    value: v.value,\n                                    text: v.text,\n                                    textLC: v.text.toLowerCase(),\n                                };\n                            default:\n                                throw 'Incompatible option type.';\n                        }\n                    });\n                },\n            }),\n            props\n        );\n\n        const {\n            firstFilterProps,\n            secondFilterProps,\n            hideSecondFilter,\n            logicData,\n            logicValue,\n            onLogicChange,\n        } = props;\n\n        return (\n            <div>\n                <FilterCellExt\n                    {...firstFilterProps}\n                    options={store.options}\n                    {...filterCellConfigFull}\n                />\n                {!hideSecondFilter && (\n                    <div>\n                        <DropDownList\n                            data={logicData}\n                            value={logicValue}\n                            onChange={onLogicChange}\n                            className=\"k-filter-and m-b-1-i\"\n                            textField=\"text\"\n                        />\n                        <FilterCellExt\n                            {...secondFilterProps}\n                            options={store.options}\n                            {...filterCellConfigFull}\n                        />\n                    </div>\n                )}\n            </div>\n        );\n    });\n\n    return (props: TableColumnMenuProps) => (\n        <TableColumnMenuFilterExt {...props} filterUI={FilterUIWithValues} expanded />\n    );\n}\n"],"names":["observer","useLocalStore","fromPromise","DropDownList","TableColumnMenuFilterExt","FilterCellExt","standardFilterWithMultiselect","optionsConfig","filterCellConfig","optionsConfigFull","maxExtractedLength","options","filterCellConfigFull","allowCustomValues","maxFoundValues","FilterUIWithValues","props","store","oprops","field","firstFilterProps","itemsFromDataSource","dataSource","tableState","getData","valuesfromTableState","state","value","data","map","i","filter","v","length","Array","from","Set","concat","text","textLC","toLowerCase","toString","secondFilterProps","hideSecondFilter","logicData","logicValue","onLogicChange","div","onChange","className","textField","filterUI","expanded"],"mappings":"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"}

package/dist/filters/standard-filter-with-multiselect/table-column-menu-filter-ext.js

@@ -4,17 +4,23 @@ import { getDefaultOperator } from '@progress/kendo-react-grid/dist/npm/filterCo
 import { multiselectOperators } from './multiselect-operators';
 // constructor override: if state.filterGroup was filled with default, we override it with new default
 export class TableColumnMenuFilterExt extends TableColumnMenuFilter {
-    constructor(props) {
-        var _a;
+    constructor(props){
         super(props);
-        const defaultOperator = getDefaultOperator(props.filterOperators, (_a = props.column.filter) !== null && _a !== void 0 ? _a : 'text');
+        var _props_column_filter;
+        const defaultOperator = getDefaultOperator(props.filterOperators, (_props_column_filter = props.column.filter) !== null && _props_column_filter !== void 0 ? _props_column_filter : 'text');
         // I know the check is a bit hacky, but that's compensated with its low criticality: even if it fails, nothing really bad happens
         if (comparer.structural(this.state.filterGroup, {
             logic: 'and',
             filters: [
-                { field: props.column.field, operator: defaultOperator },
-                { field: props.column.field, operator: defaultOperator },
-            ],
+                {
+                    field: props.column.field,
+                    operator: defaultOperator
+                },
+                {
+                    field: props.column.field,
+                    operator: defaultOperator
+                }
+            ]
         })) {
             const newDefaultOperator = multiselectOperators[0].operator;
             this.state = {
@@ -22,12 +28,19 @@ export class TableColumnMenuFilterExt extends TableColumnMenuFilter {
                 filterGroup: {
                     logic: 'and',
                     filters: [
-                        { field: props.column.field, operator: newDefaultOperator },
-                        { field: props.column.field, operator: newDefaultOperator },
-                    ],
-                },
+                        {
+                            field: props.column.field,
+                            operator: newDefaultOperator
+                        },
+                        {
+                            field: props.column.field,
+                            operator: newDefaultOperator
+                        }
+                    ]
+                }
             };
         }
     }
 }
+
 //# sourceMappingURL=table-column-menu-filter-ext.js.map

package/dist/filters/standard-filter-with-multiselect/table-column-menu-filter-ext.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-column-menu-filter-ext.js","sourceRoot":"","sources":["../../../src/filters/standard-filter-with-multiselect/table-column-menu-filter-ext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,MAAM,CAAC;AAEhC,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAEpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,kDAAkD,CAAC;AAEtF,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAE/D,sGAAsG;AACtG,MAAM,OAAO,wBAAyB,SAAQ,qBAAqB;IAC/D,YAAY,KAAiC;;QACzC,KAAK,CAAC,KAAK,CAAC,CAAC;QAEb,MAAM,eAAe,GAAG,kBAAkB,CACtC,KAAK,CAAC,eAAe,EACrB,MAAA,KAAK,CAAC,MAAM,CAAC,MAAM,mCAAI,MAAM,CAChC,CAAC;QACF,iIAAiI;QACjI,IACI,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE;YACxC,KAAK,EAAE,KAAK;YACZ,OAAO,EAAE;gBACL,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,eAAe,EAAE;gBACxD,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,eAAe,EAAE;aAC3D;SACJ,CAAC,EACJ,CAAC;YACC,MAAM,kBAAkB,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;YAC5D,IAAI,CAAC,KAAK,GAAG;gBACT,GAAG,IAAI,CAAC,KAAK;gBACb,WAAW,EAAE;oBACT,KAAK,EAAE,KAAK;oBACZ,OAAO,EAAE;wBACL,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,kBAAkB,EAAE;wBAC3D,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,kBAAkB,EAAE;qBAC9D;iBACJ;aACJ,CAAC;QACN,CAAC;IACL,CAAC;CACJ"}
+{"version":3,"sources":["../../../src/filters/standard-filter-with-multiselect/table-column-menu-filter-ext.tsx"],"sourcesContent":["import { comparer } from 'mobx';\n\nimport { TableColumnMenuFilter } from '@servicetitan/design-system';\nimport { GridColumnMenuFilterProps as TableColumnMenuFilterProps } from '@progress/kendo-react-grid/dist/npm/columnMenu/GridColumnMenuFilter';\nimport { getDefaultOperator } from '@progress/kendo-react-grid/dist/npm/filterCommon';\n\nimport { multiselectOperators } from './multiselect-operators';\n\n// constructor override: if state.filterGroup was filled with default, we override it with new default\nexport class TableColumnMenuFilterExt extends TableColumnMenuFilter {\n    constructor(props: TableColumnMenuFilterProps) {\n        super(props);\n\n        const defaultOperator = getDefaultOperator(\n            props.filterOperators,\n            props.column.filter ?? 'text'\n        );\n        // I know the check is a bit hacky, but that's compensated with its low criticality: even if it fails, nothing really bad happens\n        if (\n            comparer.structural(this.state.filterGroup, {\n                logic: 'and',\n                filters: [\n                    { field: props.column.field, operator: defaultOperator },\n                    { field: props.column.field, operator: defaultOperator },\n                ],\n            })\n        ) {\n            const newDefaultOperator = multiselectOperators[0].operator;\n            this.state = {\n                ...this.state,\n                filterGroup: {\n                    logic: 'and',\n                    filters: [\n                        { field: props.column.field, operator: newDefaultOperator },\n                        { field: props.column.field, operator: newDefaultOperator },\n                    ],\n                },\n            };\n        }\n    }\n}\n"],"names":["comparer","TableColumnMenuFilter","getDefaultOperator","multiselectOperators","TableColumnMenuFilterExt","constructor","props","defaultOperator","filterOperators","column","filter","structural","state","filterGroup","logic","filters","field","operator","newDefaultOperator"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,OAAO;AAEhC,SAASC,qBAAqB,QAAQ,8BAA8B;AAEpE,SAASC,kBAAkB,QAAQ,mDAAmD;AAEtF,SAASC,oBAAoB,QAAQ,0BAA0B;AAE/D,sGAAsG;AACtG,OAAO,MAAMC,iCAAiCH;IAC1CI,YAAYC,KAAiC,CAAE;QAC3C,KAAK,CAACA;YAIFA;QAFJ,MAAMC,kBAAkBL,mBACpBI,MAAME,eAAe,EACrBF,CAAAA,uBAAAA,MAAMG,MAAM,CAACC,MAAM,cAAnBJ,kCAAAA,uBAAuB;QAE3B,iIAAiI;QACjI,IACIN,SAASW,UAAU,CAAC,IAAI,CAACC,KAAK,CAACC,WAAW,EAAE;YACxCC,OAAO;YACPC,SAAS;gBACL;oBAAEC,OAAOV,MAAMG,MAAM,CAACO,KAAK;oBAAEC,UAAUV;gBAAgB;gBACvD;oBAAES,OAAOV,MAAMG,MAAM,CAACO,KAAK;oBAAEC,UAAUV;gBAAgB;aAC1D;QACL,IACF;YACE,MAAMW,qBAAqBf,oBAAoB,CAAC,EAAE,CAACc,QAAQ;YAC3D,IAAI,CAACL,KAAK,GAAG;gBACT,GAAG,IAAI,CAACA,KAAK;gBACbC,aAAa;oBACTC,OAAO;oBACPC,SAAS;wBACL;4BAAEC,OAAOV,MAAMG,MAAM,CAACO,KAAK;4BAAEC,UAAUC;wBAAmB;wBAC1D;4BAAEF,OAAOV,MAAMG,MAAM,CAACO,KAAK;4BAAEC,UAAUC;wBAAmB;qBAC7D;gBACL;YACJ;QACJ;IACJ;AACJ"}