@servicetitan/table 31.2.0 → 32.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/demo/column-hiding/index.js +1 -0
- package/dist/demo/column-hiding/index.js.map +1 -1
- package/dist/demo/column-hiding/product.js +7 -6
- package/dist/demo/column-hiding/product.js.map +1 -1
- package/dist/demo/column-hiding/products.js +12 -11
- package/dist/demo/column-hiding/products.js.map +1 -1
- package/dist/demo/column-hiding/table.js +126 -32
- package/dist/demo/column-hiding/table.js.map +1 -1
- package/dist/demo/column-hiding/table.store.js +30 -27
- package/dist/demo/column-hiding/table.store.js.map +1 -1
- package/dist/demo/filters/async-select-filter.js +59 -12
- package/dist/demo/filters/async-select-filter.js.map +1 -1
- package/dist/demo/filters/categories.js +20 -16
- package/dist/demo/filters/categories.js.map +1 -1
- package/dist/demo/filters/multiselect-filter.js +37 -5
- package/dist/demo/filters/multiselect-filter.js.map +1 -1
- package/dist/demo/filters/range-filter.js +104 -10
- package/dist/demo/filters/range-filter.js.map +1 -1
- package/dist/demo/filters/select-filter.js +139 -41
- package/dist/demo/filters/select-filter.js.map +1 -1
- package/dist/demo/filters/single-select-filter.js +109 -18
- package/dist/demo/filters/single-select-filter.js.map +1 -1
- package/dist/demo/filters/table.store.js +77 -86
- package/dist/demo/filters/table.store.js.map +1 -1
- package/dist/demo/footer-page-size/index.js +1 -0
- package/dist/demo/footer-page-size/index.js.map +1 -1
- package/dist/demo/footer-page-size/table.js +82 -6
- package/dist/demo/footer-page-size/table.js.map +1 -1
- package/dist/demo/index.js +1 -0
- package/dist/demo/index.js.map +1 -1
- package/dist/demo/master-detail/detail-table.js +41 -9
- package/dist/demo/master-detail/detail-table.js.map +1 -1
- package/dist/demo/master-detail/detail-table.store.js +60 -56
- package/dist/demo/master-detail/detail-table.store.js.map +1 -1
- package/dist/demo/master-detail/index.js +1 -0
- package/dist/demo/master-detail/index.js.map +1 -1
- package/dist/demo/master-detail/master-table.store.js +65 -61
- package/dist/demo/master-detail/master-table.store.js.map +1 -1
- package/dist/demo/master-detail/product-detail.js +2 -1
- package/dist/demo/master-detail/product-detail.js.map +1 -1
- package/dist/demo/master-detail/product-details.js +10 -9
- package/dist/demo/master-detail/product-details.js.map +1 -1
- package/dist/demo/master-detail/product.js +7 -6
- package/dist/demo/master-detail/product.js.map +1 -1
- package/dist/demo/master-detail/products.js +12 -11
- package/dist/demo/master-detail/products.js.map +1 -1
- package/dist/demo/master-detail/table-master-detail.js +39 -8
- package/dist/demo/master-detail/table-master-detail.js.map +1 -1
- package/dist/demo/overview/actions-cell.js +47 -10
- package/dist/demo/overview/actions-cell.js.map +1 -1
- package/dist/demo/overview/index.js +1 -0
- package/dist/demo/overview/index.js.map +1 -1
- package/dist/demo/overview/product.js +7 -6
- package/dist/demo/overview/product.js.map +1 -1
- package/dist/demo/overview/products.js +15 -14
- package/dist/demo/overview/products.js.map +1 -1
- package/dist/demo/overview/table.js +176 -21
- package/dist/demo/overview/table.js.map +1 -1
- package/dist/demo/overview/table.store.js +45 -51
- package/dist/demo/overview/table.store.js.map +1 -1
- package/dist/demo/row-details/index.js +1 -0
- package/dist/demo/row-details/index.js.map +1 -1
- package/dist/demo/row-details/row-details-table.js +52 -5
- package/dist/demo/row-details/row-details-table.js.map +1 -1
- package/dist/demo/row-details/row-details-table.store.js +27 -19
- package/dist/demo/row-details/row-details-table.store.js.map +1 -1
- package/dist/demo/state-caching/beverages.js +11 -10
- package/dist/demo/state-caching/beverages.js.map +1 -1
- package/dist/demo/state-caching/index.js +1 -0
- package/dist/demo/state-caching/index.js.map +1 -1
- package/dist/demo/state-caching/product.js +2 -1
- package/dist/demo/state-caching/product.js.map +1 -1
- package/dist/demo/state-caching/products.js +12 -11
- package/dist/demo/state-caching/products.js.map +1 -1
- package/dist/demo/state-caching/state-caching-table.js +44 -3
- package/dist/demo/state-caching/state-caching-table.js.map +1 -1
- package/dist/demo/state-caching/state-caching-table.store.js +42 -54
- package/dist/demo/state-caching/state-caching-table.store.js.map +1 -1
- package/dist/details/expand-column.js +31 -7
- package/dist/details/expand-column.js.map +1 -1
- package/dist/details/index.js +1 -0
- package/dist/details/index.js.map +1 -1
- package/dist/editable-cell/boolean-editable-cell.js +15 -4
- package/dist/editable-cell/boolean-editable-cell.js.map +1 -1
- package/dist/editable-cell/get-action-cell.js +14 -7
- package/dist/editable-cell/get-action-cell.js.map +1 -1
- package/dist/editable-cell/get-editable-cell.js +16 -8
- package/dist/editable-cell/get-editable-cell.js.map +1 -1
- package/dist/editable-cell/get-select-editable-cell.js +19 -5
- package/dist/editable-cell/get-select-editable-cell.js.map +1 -1
- package/dist/editable-cell/index.js +1 -0
- package/dist/editable-cell/index.js.map +1 -1
- package/dist/editable-cell/text-editable-cell.js +23 -5
- package/dist/editable-cell/text-editable-cell.js.map +1 -1
- package/dist/export/export.js +38 -1
- package/dist/export/export.js.map +1 -1
- package/dist/export/export.module.css.d.ts +3 -0
- package/dist/export/index.js +1 -0
- package/dist/export/index.js.map +1 -1
- package/dist/filters/async-select/async-select-filter.js +167 -132
- package/dist/filters/async-select/async-select-filter.js.map +1 -1
- package/dist/filters/column-menu-filters.js +39 -8
- package/dist/filters/column-menu-filters.js.map +1 -1
- package/dist/filters/datetime-filter/datetime-filter.js +73 -50
- package/dist/filters/datetime-filter/datetime-filter.js.map +1 -1
- package/dist/filters/field-values-filter.js +80 -72
- package/dist/filters/field-values-filter.js.map +1 -1
- package/dist/filters/index.js +1 -0
- package/dist/filters/index.js.map +1 -1
- package/dist/filters/multiselect-filter/multiselect-filter.js +77 -73
- package/dist/filters/multiselect-filter/multiselect-filter.js.map +1 -1
- package/dist/filters/numeric-filter-extended/numeric-extended-operators.js +10 -3
- package/dist/filters/numeric-filter-extended/numeric-extended-operators.js.map +1 -1
- package/dist/filters/numeric-filter-extended/numeric-filter-extended.js +39 -16
- package/dist/filters/numeric-filter-extended/numeric-filter-extended.js.map +1 -1
- package/dist/filters/range-filter/range-filter.js +76 -72
- package/dist/filters/range-filter/range-filter.js.map +1 -1
- package/dist/filters/select-filter/object-search.js +4 -3
- package/dist/filters/select-filter/object-search.js.map +1 -1
- package/dist/filters/select-filter/operators.js +6 -5
- package/dist/filters/select-filter/operators.js.map +1 -1
- package/dist/filters/select-filter/select-filter.js +180 -145
- package/dist/filters/select-filter/select-filter.js.map +1 -1
- package/dist/filters/select-filter/value-getter.js +2 -1
- package/dist/filters/select-filter/value-getter.js.map +1 -1
- package/dist/filters/single-select/single-select-filter.js +29 -15
- package/dist/filters/single-select/single-select-filter.js.map +1 -1
- package/dist/filters/standard-filter-with-multiselect/filter-cell-ext.js +114 -67
- package/dist/filters/standard-filter-with-multiselect/filter-cell-ext.js.map +1 -1
- package/dist/filters/standard-filter-with-multiselect/filter-cell-ext.module.css.d.ts +7 -0
- package/dist/filters/standard-filter-with-multiselect/multiselect-operators.js +10 -3
- package/dist/filters/standard-filter-with-multiselect/multiselect-operators.js.map +1 -1
- package/dist/filters/standard-filter-with-multiselect/standard-filter-with-multiselect.js +77 -55
- package/dist/filters/standard-filter-with-multiselect/standard-filter-with-multiselect.js.map +1 -1
- package/dist/filters/standard-filter-with-multiselect/table-column-menu-filter-ext.js +23 -10
- package/dist/filters/standard-filter-with-multiselect/table-column-menu-filter-ext.js.map +1 -1
- package/dist/filters/time-filter/time-filter.js +63 -49
- package/dist/filters/time-filter/time-filter.js.map +1 -1
- package/dist/index.js +4 -2
- package/dist/index.js.map +1 -1
- package/dist/select-cell/index.js +1 -0
- package/dist/select-cell/index.js.map +1 -1
- package/dist/select-cell/select-cell.js +36 -11
- package/dist/select-cell/select-cell.js.map +1 -1
- package/dist/select-cell/select-cell.module.css.d.ts +3 -0
- package/dist/table-state.js +479 -660
- package/dist/table-state.js.map +1 -1
- package/dist/table.js +235 -250
- package/dist/table.js.map +1 -1
- package/dist/table.module.css.d.ts +5 -0
- package/dist/use-observing-table-state/demo/components/use-observing-table-state-demo.js +97 -5
- package/dist/use-observing-table-state/demo/components/use-observing-table-state-demo.js.map +1 -1
- package/dist/use-observing-table-state/demo/stores/use-observing-table-state-demo.store.js +71 -97
- package/dist/use-observing-table-state/demo/stores/use-observing-table-state-demo.store.js.map +1 -1
- package/dist/use-observing-table-state/index.js +1 -0
- package/dist/use-observing-table-state/index.js.map +1 -1
- package/dist/use-observing-table-state/use-observing-table-state.js +26 -20
- package/dist/use-observing-table-state/use-observing-table-state.js.map +1 -1
- package/dist/utils/filters.js +14 -9
- package/dist/utils/filters.js.map +1 -1
- package/dist/utils/use-td-props.js +3 -2
- package/dist/utils/use-td-props.js.map +1 -1
- package/package.json +13 -13
- package/dist/filters/async-select/async-select-filter.stories.js +0 -7
- package/dist/filters/async-select/async-select-filter.stories.js.map +0 -1
- package/dist/filters/multiselect-filter/multiselect-filter.stories.js +0 -7
- package/dist/filters/multiselect-filter/multiselect-filter.stories.js.map +0 -1
- package/dist/filters/range-filter/range-filter.stories.js +0 -9
- package/dist/filters/range-filter/range-filter.stories.js.map +0 -1
- package/dist/filters/select-filter/__tests__/object-search.test.js +0 -28
- package/dist/filters/select-filter/__tests__/object-search.test.js.map +0 -1
- package/dist/filters/select-filter/select-filter.stories.js +0 -8
- package/dist/filters/select-filter/select-filter.stories.js.map +0 -1
- package/dist/filters/single-select/single-select-filter.stories.js +0 -8
- package/dist/filters/single-select/single-select-filter.stories.js.map +0 -1
- package/dist/table.stories.js +0 -12
- package/dist/table.stories.js.map +0 -1
- package/dist/use-observing-table-state/use-observing-table-state.stories.js +0 -11
- package/dist/use-observing-table-state/use-observing-table-state.stories.js.map +0 -1
- package/dist/utils/__tests__/filters.test.js +0 -24
- package/dist/utils/__tests__/filters.test.js.map +0 -1
@@ -1,14 +1,27 @@
|
|
1
|
-
|
1
|
+
function _define_property(obj, key, value) {
|
2
|
+
if (key in obj) {
|
3
|
+
Object.defineProperty(obj, key, {
|
4
|
+
value: value,
|
5
|
+
enumerable: true,
|
6
|
+
configurable: true,
|
7
|
+
writable: true
|
8
|
+
});
|
9
|
+
} else {
|
10
|
+
obj[key] = value;
|
11
|
+
}
|
12
|
+
return obj;
|
13
|
+
}
|
14
|
+
function _ts_decorate(decorators, target, key, desc) {
|
2
15
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
3
16
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
4
|
-
else for
|
17
|
+
else for(var i = decorators.length - 1; i >= 0; i--)if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
5
18
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
6
|
-
}
|
7
|
-
|
19
|
+
}
|
20
|
+
function _ts_metadata(k, v) {
|
8
21
|
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
9
|
-
}
|
22
|
+
}
|
10
23
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
11
|
-
import { Checkbox } from '@servicetitan/design-system';
|
24
|
+
import { TableFilterCellProps, Checkbox } from '@servicetitan/design-system';
|
12
25
|
import { Component, Fragment } from 'react';
|
13
26
|
import { observer } from 'mobx-react';
|
14
27
|
import { observable, computed, runInAction, action, makeObservable } from 'mobx';
|
@@ -18,13 +31,11 @@ export function operator(item, value) {
|
|
18
31
|
return value.includes(item);
|
19
32
|
}
|
20
33
|
export function fieldValuesColumnMenuFilter(tableState, renderItem = defaultRenderItem) {
|
21
|
-
|
34
|
+
class FieldValuesFilterCell extends Component {
|
22
35
|
get processedData() {
|
23
36
|
const searchQuery = this.searchQuery.toLowerCase();
|
24
|
-
const filteredData = !searchQuery
|
25
|
-
|
26
|
-
: this.data.filter(v => v.text.toLowerCase().includes(searchQuery));
|
27
|
-
return filteredData.slice().sort((a, b) => {
|
37
|
+
const filteredData = !searchQuery ? this.data : this.data.filter((v)=>v.text.toLowerCase().includes(searchQuery));
|
38
|
+
return filteredData.slice().sort((a, b)=>{
|
28
39
|
if (a.text === b.text) {
|
29
40
|
return 0;
|
30
41
|
}
|
@@ -41,86 +52,82 @@ export function fieldValuesColumnMenuFilter(tableState, renderItem = defaultRend
|
|
41
52
|
get value() {
|
42
53
|
return this.props.value || [];
|
43
54
|
}
|
44
|
-
constructor(props) {
|
45
|
-
super(props);
|
46
|
-
Object.defineProperty(this, "data", {
|
47
|
-
enumerable: true,
|
48
|
-
configurable: true,
|
49
|
-
writable: true,
|
50
|
-
value: []
|
51
|
-
});
|
52
|
-
Object.defineProperty(this, "searchQuery", {
|
53
|
-
enumerable: true,
|
54
|
-
configurable: true,
|
55
|
-
writable: true,
|
56
|
-
value: ''
|
57
|
-
});
|
58
|
-
Object.defineProperty(this, "handleSearchQueryChange", {
|
59
|
-
enumerable: true,
|
60
|
-
configurable: true,
|
61
|
-
writable: true,
|
62
|
-
value: (ev) => {
|
63
|
-
if (typeof ev.target.value === 'string') {
|
64
|
-
this.searchQuery = ev.target.value;
|
65
|
-
}
|
66
|
-
}
|
67
|
-
});
|
68
|
-
Object.defineProperty(this, "handleChange", {
|
69
|
-
enumerable: true,
|
70
|
-
configurable: true,
|
71
|
-
writable: true,
|
72
|
-
value: (value, checked, ev) => {
|
73
|
-
const newFilterValue = checked
|
74
|
-
? this.value.concat(value.value)
|
75
|
-
: this.value.filter((v) => v !== value.value);
|
76
|
-
const hasValue = newFilterValue.length > 0;
|
77
|
-
this.props.onChange({
|
78
|
-
value: hasValue ? newFilterValue : '',
|
79
|
-
operator: hasValue ? operator : '',
|
80
|
-
syntheticEvent: ev,
|
81
|
-
});
|
82
|
-
}
|
83
|
-
});
|
84
|
-
makeObservable(this);
|
85
|
-
}
|
86
55
|
componentDidMount() {
|
87
56
|
this.fetchData(tableState.dataSource);
|
88
57
|
}
|
89
58
|
render() {
|
90
|
-
return
|
59
|
+
return /*#__PURE__*/ _jsxs(Fragment, {
|
60
|
+
children: [
|
61
|
+
/*#__PURE__*/ _jsx(Input, {
|
62
|
+
value: this.searchQuery,
|
63
|
+
onChange: this.handleSearchQueryChange,
|
64
|
+
placeholder: "Search",
|
65
|
+
className: "m-b-1"
|
66
|
+
}),
|
67
|
+
this.processedData.map((item)=>/*#__PURE__*/ _jsx("span", {
|
68
|
+
className: "k-widget d-b m-b-1",
|
69
|
+
children: /*#__PURE__*/ _jsx(Checkbox, {
|
70
|
+
label: item.text,
|
71
|
+
checked: this.value.includes(item.value),
|
72
|
+
onChange: this.handleChange,
|
73
|
+
value: item
|
74
|
+
})
|
75
|
+
}, JSON.stringify(item)))
|
76
|
+
]
|
77
|
+
});
|
91
78
|
}
|
92
79
|
async fetchData(dataSource) {
|
93
80
|
if (!dataSource) {
|
94
81
|
return;
|
95
82
|
}
|
96
83
|
const items = (await dataSource.getData({})).data;
|
97
|
-
const values = items.map(i
|
98
|
-
const distinctValues = values.filter((v, idx)
|
99
|
-
runInAction(()
|
100
|
-
this.data = distinctValues.map(value
|
84
|
+
const values = items.map((i)=>i[this.field]);
|
85
|
+
const distinctValues = values.filter((v, idx)=>values.indexOf(v) === idx);
|
86
|
+
runInAction(()=>{
|
87
|
+
this.data = distinctValues.map((value)=>({
|
88
|
+
value,
|
89
|
+
text: renderItem(value)
|
90
|
+
}));
|
101
91
|
});
|
102
92
|
}
|
103
|
-
|
104
|
-
|
93
|
+
constructor(props){
|
94
|
+
super(props), _define_property(this, "data", []), _define_property(this, "searchQuery", ''), _define_property(this, "handleSearchQueryChange", (ev)=>{
|
95
|
+
if (typeof ev.target.value === 'string') {
|
96
|
+
this.searchQuery = ev.target.value;
|
97
|
+
}
|
98
|
+
}), _define_property(this, "handleChange", (value, checked, ev)=>{
|
99
|
+
const newFilterValue = checked ? this.value.concat(value.value) : this.value.filter((v)=>v !== value.value);
|
100
|
+
const hasValue = newFilterValue.length > 0;
|
101
|
+
this.props.onChange({
|
102
|
+
value: hasValue ? newFilterValue : '',
|
103
|
+
operator: hasValue ? operator : '',
|
104
|
+
syntheticEvent: ev
|
105
|
+
});
|
106
|
+
});
|
107
|
+
makeObservable(this);
|
108
|
+
}
|
109
|
+
}
|
110
|
+
_ts_decorate([
|
105
111
|
observable,
|
106
|
-
|
112
|
+
_ts_metadata("design:type", Array)
|
107
113
|
], FieldValuesFilterCell.prototype, "data", void 0);
|
108
|
-
|
109
|
-
observable
|
110
|
-
__metadata("design:type", Object)
|
114
|
+
_ts_decorate([
|
115
|
+
observable
|
111
116
|
], FieldValuesFilterCell.prototype, "searchQuery", void 0);
|
112
|
-
|
117
|
+
_ts_decorate([
|
113
118
|
computed,
|
114
|
-
|
115
|
-
|
119
|
+
_ts_metadata("design:type", void 0),
|
120
|
+
_ts_metadata("design:paramtypes", [])
|
116
121
|
], FieldValuesFilterCell.prototype, "processedData", null);
|
117
|
-
|
118
|
-
action
|
119
|
-
__metadata("design:type", Object)
|
122
|
+
_ts_decorate([
|
123
|
+
action
|
120
124
|
], FieldValuesFilterCell.prototype, "handleSearchQueryChange", void 0);
|
121
|
-
FieldValuesFilterCell =
|
125
|
+
FieldValuesFilterCell = _ts_decorate([
|
122
126
|
observer,
|
123
|
-
|
127
|
+
_ts_metadata("design:type", Function),
|
128
|
+
_ts_metadata("design:paramtypes", [
|
129
|
+
typeof TableFilterCellProps === "undefined" ? Object : TableFilterCellProps
|
130
|
+
])
|
124
131
|
], FieldValuesFilterCell);
|
125
132
|
return renderCustomColumnMenuFilter(FieldValuesFilterCell);
|
126
133
|
}
|
@@ -131,4 +138,5 @@ function defaultRenderItem(v) {
|
|
131
138
|
// suppose v has toString();
|
132
139
|
return v.toString();
|
133
140
|
}
|
141
|
+
|
134
142
|
//# sourceMappingURL=field-values-filter.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["../../src/filters/field-values-filter.tsx"],"sourcesContent":["import { TableFilterCellProps, Checkbox } from '@servicetitan/design-system';\nimport { Component, Fragment, FormEvent } from 'react';\n\nimport { observer } from 'mobx-react';\nimport { observable, computed, runInAction, action, makeObservable } from 'mobx';\n\nimport { Input, InputChangeEvent } from '@progress/kendo-react-inputs';\n\nimport { DataSource, IdType } from '@servicetitan/data-query';\nimport { TableState } from '../table-state';\nimport { renderCustomColumnMenuFilter } from './column-menu-filters';\n\nexport function operator<T>(item: T, value: T[]) {\n return value.includes(item);\n}\n\nexport function fieldValuesColumnMenuFilter<T, TId extends IdType = never>(\n tableState: TableState<T, TId>,\n renderItem: (value: T[keyof T]) => string = defaultRenderItem\n) {\n interface Data {\n value: T[keyof T];\n text: string;\n }\n @observer\n class FieldValuesFilterCell extends Component<TableFilterCellProps> {\n @observable data: Data[] = [];\n\n @observable searchQuery = '';\n\n @computed get processedData() {\n const searchQuery = this.searchQuery.toLowerCase();\n\n const filteredData = !searchQuery\n ? this.data\n : this.data.filter(v => v.text.toLowerCase().includes(searchQuery));\n\n return filteredData.slice().sort((a, b) => {\n if (a.text === b.text) {\n return 0;\n }\n\n return a.text < b.text ? -1 : 1;\n });\n }\n\n get field() {\n const field = this.props.field;\n\n if (field === undefined) {\n throw 'missing field';\n }\n\n return field as keyof T;\n }\n\n get value(): T[keyof T][] {\n return this.props.value || [];\n }\n\n constructor(props: TableFilterCellProps) {\n super(props);\n makeObservable(this);\n }\n\n @action\n handleSearchQueryChange = (ev: InputChangeEvent) => {\n if (typeof ev.target.value === 'string') {\n this.searchQuery = ev.target.value;\n }\n };\n\n componentDidMount() {\n this.fetchData(tableState.dataSource);\n }\n\n handleChange = (value: Data, checked: boolean, ev: FormEvent<HTMLInputElement>) => {\n const newFilterValue = checked\n ? this.value.concat(value.value)\n : this.value.filter((v: T[keyof T]) => v !== value.value);\n\n const hasValue = newFilterValue.length > 0;\n\n this.props.onChange({\n value: hasValue ? newFilterValue : '',\n operator: hasValue ? operator : '',\n syntheticEvent: ev,\n });\n };\n\n render() {\n return (\n <Fragment>\n <Input\n value={this.searchQuery}\n onChange={this.handleSearchQueryChange}\n placeholder=\"Search\"\n className=\"m-b-1\"\n />\n\n {this.processedData.map(item => (\n <span key={JSON.stringify(item)} className=\"k-widget d-b m-b-1\">\n <Checkbox\n label={item.text}\n checked={this.value.includes(item.value)}\n onChange={this.handleChange}\n value={item}\n />\n </span>\n ))}\n </Fragment>\n );\n }\n\n private async fetchData(dataSource: DataSource<T, TId> | null) {\n if (!dataSource) {\n return;\n }\n\n const items = (await dataSource.getData({})).data as T[];\n\n const values = items.map(i => i[this.field]);\n\n const distinctValues = values.filter((v, idx) => values.indexOf(v) === idx);\n\n runInAction(() => {\n this.data = distinctValues.map(value => ({ value, text: renderItem(value) }));\n });\n }\n }\n\n return renderCustomColumnMenuFilter(FieldValuesFilterCell);\n}\n\nfunction defaultRenderItem(v: any): string {\n if (v == null) {\n return '';\n }\n\n // suppose v has toString();\n return v.toString();\n}\n"],"names":["TableFilterCellProps","Checkbox","Component","Fragment","observer","observable","computed","runInAction","action","makeObservable","Input","renderCustomColumnMenuFilter","operator","item","value","includes","fieldValuesColumnMenuFilter","tableState","renderItem","defaultRenderItem","FieldValuesFilterCell","processedData","searchQuery","toLowerCase","filteredData","data","filter","v","text","slice","sort","a","b","field","props","undefined","componentDidMount","fetchData","dataSource","render","onChange","handleSearchQueryChange","placeholder","className","map","span","label","checked","handleChange","JSON","stringify","items","getData","values","i","distinctValues","idx","indexOf","constructor","ev","target","newFilterValue","concat","hasValue","length","syntheticEvent","toString"],"mappings":"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"}
|
package/dist/filters/index.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["../../src/filters/index.ts"],"sourcesContent":["export * from './datetime-filter/datetime-filter';\nexport * from './range-filter/range-filter';\nexport * from './standard-filter-with-multiselect/standard-filter-with-multiselect';\nexport * from './time-filter/time-filter';\nexport * from './column-menu-filters';\nexport * from './field-values-filter';\nexport * from './multiselect-filter/multiselect-filter';\nexport * from './numeric-filter-extended/numeric-filter-extended';\nexport * from './single-select/single-select-filter';\nexport * from './async-select/async-select-filter';\nexport * from './select-filter/select-filter';\n"],"names":[],"mappings":"AAAA,cAAc,oCAAoC;AAClD,cAAc,8BAA8B;AAC5C,cAAc,sEAAsE;AACpF,cAAc,4BAA4B;AAC1C,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,0CAA0C;AACxD,cAAc,oDAAoD;AAClE,cAAc,uCAAuC;AACrD,cAAc,qCAAqC;AACnD,cAAc,gCAAgC"}
|
@@ -1,107 +1,111 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
class Selector extends Component {
|
6
|
-
constructor() {
|
7
|
-
super(...arguments);
|
8
|
-
Object.defineProperty(this, "handleChange", {
|
1
|
+
function _define_property(obj, key, value) {
|
2
|
+
if (key in obj) {
|
3
|
+
Object.defineProperty(obj, key, {
|
4
|
+
value: value,
|
9
5
|
enumerable: true,
|
10
6
|
configurable: true,
|
11
|
-
writable: true
|
12
|
-
value: (option, checked, event) => {
|
13
|
-
var _a, _b;
|
14
|
-
const newValue = checked
|
15
|
-
? ((_a = this.props.value) !== null && _a !== void 0 ? _a : []).concat(option)
|
16
|
-
: ((_b = this.props.value) !== null && _b !== void 0 ? _b : []).filter(v => v !== option);
|
17
|
-
this.props.onChange(newValue.length ? newValue : undefined, event);
|
18
|
-
}
|
7
|
+
writable: true
|
19
8
|
});
|
9
|
+
} else {
|
10
|
+
obj[key] = value;
|
20
11
|
}
|
12
|
+
return obj;
|
13
|
+
}
|
14
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
15
|
+
import { Component } from 'react';
|
16
|
+
import { Checkbox } from '@servicetitan/design-system';
|
17
|
+
import { renderCustomColumnMenuFilter } from '../column-menu-filters';
|
18
|
+
class Selector extends Component {
|
21
19
|
render() {
|
22
20
|
const { options, value, renderer } = this.props;
|
23
|
-
return options.map((option, index)
|
24
|
-
|
25
|
-
|
21
|
+
return options.map((option, index)=>// eslint-disable-next-line react/no-array-index-key
|
22
|
+
/*#__PURE__*/ _jsx("span", {
|
23
|
+
className: "k-widget m-b-1-i d-b",
|
24
|
+
children: /*#__PURE__*/ _jsx(Checkbox, {
|
25
|
+
value: option,
|
26
|
+
label: renderer ? renderer(option) : option,
|
27
|
+
checked: (value !== null && value !== void 0 ? value : []).includes(option),
|
28
|
+
onChange: this.handleChange
|
29
|
+
})
|
30
|
+
}, index));
|
31
|
+
}
|
32
|
+
constructor(...args){
|
33
|
+
super(...args), _define_property(this, "handleChange", (option, checked, event)=>{
|
34
|
+
var _this_props_value, _this_props_value1;
|
35
|
+
const newValue = checked ? ((_this_props_value = this.props.value) !== null && _this_props_value !== void 0 ? _this_props_value : []).concat(option) : ((_this_props_value1 = this.props.value) !== null && _this_props_value1 !== void 0 ? _this_props_value1 : []).filter((v)=>v !== option);
|
36
|
+
this.props.onChange(newValue.length ? newValue : undefined, event);
|
37
|
+
});
|
26
38
|
}
|
27
39
|
}
|
28
40
|
export function multiSelectColumnMenuFilter(data, renderItem, opts) {
|
29
|
-
const FilterCell = ({ value, onChange })
|
30
|
-
const handleChange = (value, event)
|
41
|
+
const FilterCell = ({ value, onChange })=>{
|
42
|
+
const handleChange = (value, event)=>{
|
31
43
|
onChange({
|
32
44
|
value: value !== null && value !== void 0 ? value : '',
|
33
45
|
operator: value ? 'in' : '',
|
34
|
-
syntheticEvent: event
|
46
|
+
syntheticEvent: event
|
35
47
|
});
|
36
48
|
};
|
37
|
-
return
|
49
|
+
return /*#__PURE__*/ _jsx(Selector, {
|
50
|
+
options: data,
|
51
|
+
value: value === '' ? undefined : value,
|
52
|
+
onChange: handleChange,
|
53
|
+
renderer: renderItem
|
54
|
+
});
|
38
55
|
};
|
39
56
|
return renderCustomColumnMenuFilter(FilterCell, opts);
|
40
57
|
}
|
41
58
|
export function complexItemMultiSelectColumnMenuFilter(data, renderItem, opts) {
|
42
59
|
class FilterCell extends Component {
|
43
|
-
constructor() {
|
44
|
-
super(...arguments);
|
45
|
-
Object.defineProperty(this, "contains", {
|
46
|
-
enumerable: true,
|
47
|
-
configurable: true,
|
48
|
-
writable: true,
|
49
|
-
value: (item) => {
|
50
|
-
const value = this.props.value || [];
|
51
|
-
return value.some((v) => item[v] === true);
|
52
|
-
}
|
53
|
-
});
|
54
|
-
Object.defineProperty(this, "handleChange", {
|
55
|
-
enumerable: true,
|
56
|
-
configurable: true,
|
57
|
-
writable: true,
|
58
|
-
value: (value, event) => {
|
59
|
-
this.props.onChange({
|
60
|
-
value: value !== null && value !== void 0 ? value : '',
|
61
|
-
operator: value ? this.contains : '',
|
62
|
-
syntheticEvent: event,
|
63
|
-
});
|
64
|
-
}
|
65
|
-
});
|
66
|
-
}
|
67
60
|
render() {
|
68
61
|
const { value } = this.props;
|
69
|
-
return
|
62
|
+
return /*#__PURE__*/ _jsx(Selector, {
|
63
|
+
options: data,
|
64
|
+
value: value === '' ? undefined : value,
|
65
|
+
onChange: this.handleChange,
|
66
|
+
renderer: renderItem
|
67
|
+
});
|
68
|
+
}
|
69
|
+
constructor(...args){
|
70
|
+
super(...args), _define_property(this, "contains", (item)=>{
|
71
|
+
const value = this.props.value || [];
|
72
|
+
return value.some((v)=>item[v] === true);
|
73
|
+
}), _define_property(this, "handleChange", (value, event)=>{
|
74
|
+
this.props.onChange({
|
75
|
+
value: value !== null && value !== void 0 ? value : '',
|
76
|
+
operator: value ? this.contains : '',
|
77
|
+
syntheticEvent: event
|
78
|
+
});
|
79
|
+
});
|
70
80
|
}
|
71
81
|
}
|
72
82
|
return renderCustomColumnMenuFilter(FilterCell, opts);
|
73
83
|
}
|
74
84
|
export function multiItemMultiSelectColumnMenuFilter(data, renderItem, opts) {
|
75
85
|
class FilterCell extends Component {
|
76
|
-
constructor() {
|
77
|
-
super(...arguments);
|
78
|
-
Object.defineProperty(this, "contains", {
|
79
|
-
enumerable: true,
|
80
|
-
configurable: true,
|
81
|
-
writable: true,
|
82
|
-
value: (item) => {
|
83
|
-
const value = this.props.value || [];
|
84
|
-
return value.some((v) => Array.isArray(item) && item.includes(v));
|
85
|
-
}
|
86
|
-
});
|
87
|
-
Object.defineProperty(this, "handleChange", {
|
88
|
-
enumerable: true,
|
89
|
-
configurable: true,
|
90
|
-
writable: true,
|
91
|
-
value: (value, event) => {
|
92
|
-
this.props.onChange({
|
93
|
-
value: value !== null && value !== void 0 ? value : '',
|
94
|
-
operator: value ? this.contains : '',
|
95
|
-
syntheticEvent: event,
|
96
|
-
});
|
97
|
-
}
|
98
|
-
});
|
99
|
-
}
|
100
86
|
render() {
|
101
87
|
const { value } = this.props;
|
102
|
-
return
|
88
|
+
return /*#__PURE__*/ _jsx(Selector, {
|
89
|
+
options: data,
|
90
|
+
value: value === '' ? undefined : value,
|
91
|
+
onChange: this.handleChange,
|
92
|
+
renderer: renderItem
|
93
|
+
});
|
94
|
+
}
|
95
|
+
constructor(...args){
|
96
|
+
super(...args), _define_property(this, "contains", (item)=>{
|
97
|
+
const value = this.props.value || [];
|
98
|
+
return value.some((v)=>Array.isArray(item) && item.includes(v));
|
99
|
+
}), _define_property(this, "handleChange", (value, event)=>{
|
100
|
+
this.props.onChange({
|
101
|
+
value: value !== null && value !== void 0 ? value : '',
|
102
|
+
operator: value ? this.contains : '',
|
103
|
+
syntheticEvent: event
|
104
|
+
});
|
105
|
+
});
|
103
106
|
}
|
104
107
|
}
|
105
108
|
return renderCustomColumnMenuFilter(FilterCell, opts);
|
106
109
|
}
|
110
|
+
|
107
111
|
//# sourceMappingURL=multiselect-filter.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["../../../src/filters/multiselect-filter/multiselect-filter.tsx"],"sourcesContent":["import { Component, SyntheticEvent, ReactNode, FC } from 'react';\n\nimport { TableFilterCellProps, Checkbox } from '@servicetitan/design-system';\n\nimport {\n CustomColumnMenuFilterSingleOpts,\n renderCustomColumnMenuFilter,\n} from '../column-menu-filters';\n\ninterface SelectorProps<T> {\n options: T[];\n value?: T[];\n onChange(value: T[] | undefined, event: SyntheticEvent<HTMLInputElement>): void;\n renderer?(item: T): ReactNode;\n}\n\nclass Selector<T> extends Component<SelectorProps<T>> {\n handleChange = (option: T, checked: boolean, event: SyntheticEvent<HTMLInputElement>) => {\n const newValue = checked\n ? (this.props.value ?? []).concat(option)\n : (this.props.value ?? []).filter(v => v !== option);\n\n this.props.onChange(newValue.length ? newValue : undefined, event);\n };\n\n render() {\n const { options, value, renderer } = this.props;\n\n return options.map((option, index) => (\n // eslint-disable-next-line react/no-array-index-key\n <span key={index} className=\"k-widget m-b-1-i d-b\">\n <Checkbox\n value={option}\n label={renderer ? renderer(option) : option}\n checked={(value ?? []).includes(option)}\n onChange={this.handleChange}\n />\n </span>\n ));\n }\n}\n\nexport function multiSelectColumnMenuFilter<T>(\n data: T[],\n renderItem?: (item: T) => ReactNode,\n opts?: CustomColumnMenuFilterSingleOpts\n) {\n const FilterCell: FC<TableFilterCellProps> = ({ value, onChange }) => {\n const handleChange = (value: T[] | undefined, event: SyntheticEvent<HTMLInputElement>) => {\n onChange({\n value: value ?? '',\n operator: value ? 'in' : '',\n syntheticEvent: event,\n });\n };\n\n return (\n <Selector\n options={data}\n value={value === '' ? undefined : value}\n onChange={handleChange}\n renderer={renderItem}\n />\n );\n };\n\n return renderCustomColumnMenuFilter(FilterCell, opts);\n}\n\nexport function complexItemMultiSelectColumnMenuFilter<T>(\n data: T[],\n renderItem?: (item: T) => ReactNode,\n opts?: CustomColumnMenuFilterSingleOpts\n) {\n class FilterCell extends Component<TableFilterCellProps> {\n contains = (item: any) => {\n const value: T[] = this.props.value || [];\n\n return value.some((v: T) => item[v] === true);\n };\n\n handleChange = (value: T[] | undefined, event: SyntheticEvent<HTMLInputElement>) => {\n this.props.onChange({\n value: value ?? '',\n operator: value ? this.contains : '',\n syntheticEvent: event,\n });\n };\n\n render() {\n const { value } = this.props;\n\n return (\n <Selector\n options={data}\n value={value === '' ? undefined : value}\n onChange={this.handleChange}\n renderer={renderItem}\n />\n );\n }\n }\n\n return renderCustomColumnMenuFilter(FilterCell, opts);\n}\n\nexport function multiItemMultiSelectColumnMenuFilter<T>(\n data: T[],\n renderItem?: (item: T) => ReactNode,\n opts?: CustomColumnMenuFilterSingleOpts\n) {\n class FilterCell extends Component<TableFilterCellProps> {\n contains = (item: any) => {\n const value: T[] = this.props.value || [];\n\n return value.some((v: T) => Array.isArray(item) && item.includes(v));\n };\n\n handleChange = (value: T[] | undefined, event: SyntheticEvent<HTMLInputElement>) => {\n this.props.onChange({\n value: value ?? '',\n operator: value ? this.contains : '',\n syntheticEvent: event,\n });\n };\n\n render() {\n const { value } = this.props;\n\n return (\n <Selector\n options={data}\n value={value === '' ? undefined : value}\n onChange={this.handleChange}\n renderer={renderItem}\n />\n );\n }\n }\n\n return renderCustomColumnMenuFilter(FilterCell, opts);\n}\n"],"names":["Component","Checkbox","renderCustomColumnMenuFilter","Selector","render","options","value","renderer","props","map","option","index","span","className","label","checked","includes","onChange","handleChange","event","newValue","concat","filter","v","length","undefined","multiSelectColumnMenuFilter","data","renderItem","opts","FilterCell","operator","syntheticEvent","complexItemMultiSelectColumnMenuFilter","contains","item","some","multiItemMultiSelectColumnMenuFilter","Array","isArray"],"mappings":";;;;;;;;;;;;;;AAAA,SAASA,SAAS,QAAuC,QAAQ;AAEjE,SAA+BC,QAAQ,QAAQ,8BAA8B;AAE7E,SAEIC,4BAA4B,QACzB,yBAAyB;AAShC,MAAMC,iBAAoBH;IAStBI,SAAS;QACL,MAAM,EAAEC,OAAO,EAAEC,KAAK,EAAEC,QAAQ,EAAE,GAAG,IAAI,CAACC,KAAK;QAE/C,OAAOH,QAAQI,GAAG,CAAC,CAACC,QAAQC,QACxB,oDAAoD;0BACpD,KAACC;gBAAiBC,WAAU;0BACxB,cAAA,KAACZ;oBACGK,OAAOI;oBACPI,OAAOP,WAAWA,SAASG,UAAUA;oBACrCK,SAAS,AAACT,CAAAA,kBAAAA,mBAAAA,QAAS,EAAE,AAAD,EAAGU,QAAQ,CAACN;oBAChCO,UAAU,IAAI,CAACC,YAAY;;eALxBP;IASnB;;QAvBJ,gBACIO,uBAAAA,gBAAe,CAACR,QAAWK,SAAkBI;gBAElC,mBACA;YAFP,MAAMC,WAAWL,UACX,AAAC,CAAA,CAAA,oBAAA,IAAI,CAACP,KAAK,CAACF,KAAK,cAAhB,+BAAA,oBAAoB,EAAE,AAAD,EAAGe,MAAM,CAACX,UAChC,AAAC,CAAA,CAAA,qBAAA,IAAI,CAACF,KAAK,CAACF,KAAK,cAAhB,gCAAA,qBAAoB,EAAE,AAAD,EAAGgB,MAAM,CAACC,CAAAA,IAAKA,MAAMb;YAEjD,IAAI,CAACF,KAAK,CAACS,QAAQ,CAACG,SAASI,MAAM,GAAGJ,WAAWK,WAAWN;QAChE;;AAiBJ;AAEA,OAAO,SAASO,4BACZC,IAAS,EACTC,UAAmC,EACnCC,IAAuC;IAEvC,MAAMC,aAAuC,CAAC,EAAExB,KAAK,EAAEW,QAAQ,EAAE;QAC7D,MAAMC,eAAe,CAACZ,OAAwBa;YAC1CF,SAAS;gBACLX,OAAOA,kBAAAA,mBAAAA,QAAS;gBAChByB,UAAUzB,QAAQ,OAAO;gBACzB0B,gBAAgBb;YACpB;QACJ;QAEA,qBACI,KAAChB;YACGE,SAASsB;YACTrB,OAAOA,UAAU,KAAKmB,YAAYnB;YAClCW,UAAUC;YACVX,UAAUqB;;IAGtB;IAEA,OAAO1B,6BAA6B4B,YAAYD;AACpD;AAEA,OAAO,SAASI,uCACZN,IAAS,EACTC,UAAmC,EACnCC,IAAuC;IAEvC,MAAMC,mBAAmB9B;QAerBI,SAAS;YACL,MAAM,EAAEE,KAAK,EAAE,GAAG,IAAI,CAACE,KAAK;YAE5B,qBACI,KAACL;gBACGE,SAASsB;gBACTrB,OAAOA,UAAU,KAAKmB,YAAYnB;gBAClCW,UAAU,IAAI,CAACC,YAAY;gBAC3BX,UAAUqB;;QAGtB;;YA1BJ,gBACIM,uBAAAA,YAAW,CAACC;gBACR,MAAM7B,QAAa,IAAI,CAACE,KAAK,CAACF,KAAK,IAAI,EAAE;gBAEzC,OAAOA,MAAM8B,IAAI,CAAC,CAACb,IAASY,IAAI,CAACZ,EAAE,KAAK;YAC5C,IAEAL,uBAAAA,gBAAe,CAACZ,OAAwBa;gBACpC,IAAI,CAACX,KAAK,CAACS,QAAQ,CAAC;oBAChBX,OAAOA,kBAAAA,mBAAAA,QAAS;oBAChByB,UAAUzB,QAAQ,IAAI,CAAC4B,QAAQ,GAAG;oBAClCF,gBAAgBb;gBACpB;YACJ;;IAcJ;IAEA,OAAOjB,6BAA6B4B,YAAYD;AACpD;AAEA,OAAO,SAASQ,qCACZV,IAAS,EACTC,UAAmC,EACnCC,IAAuC;IAEvC,MAAMC,mBAAmB9B;QAerBI,SAAS;YACL,MAAM,EAAEE,KAAK,EAAE,GAAG,IAAI,CAACE,KAAK;YAE5B,qBACI,KAACL;gBACGE,SAASsB;gBACTrB,OAAOA,UAAU,KAAKmB,YAAYnB;gBAClCW,UAAU,IAAI,CAACC,YAAY;gBAC3BX,UAAUqB;;QAGtB;;YA1BJ,gBACIM,uBAAAA,YAAW,CAACC;gBACR,MAAM7B,QAAa,IAAI,CAACE,KAAK,CAACF,KAAK,IAAI,EAAE;gBAEzC,OAAOA,MAAM8B,IAAI,CAAC,CAACb,IAASe,MAAMC,OAAO,CAACJ,SAASA,KAAKnB,QAAQ,CAACO;YACrE,IAEAL,uBAAAA,gBAAe,CAACZ,OAAwBa;gBACpC,IAAI,CAACX,KAAK,CAACS,QAAQ,CAAC;oBAChBX,OAAOA,kBAAAA,mBAAAA,QAAS;oBAChByB,UAAUzB,QAAQ,IAAI,CAAC4B,QAAQ,GAAG;oBAClCF,gBAAgBb;gBACpB;YACJ;;IAcJ;IAEA,OAAOjB,6BAA6B4B,YAAYD;AACpD"}
|
@@ -1,6 +1,13 @@
|
|
1
1
|
export const numericExtendedOperators = [
|
2
|
-
{
|
3
|
-
|
2
|
+
{
|
3
|
+
text: 'Is integer',
|
4
|
+
operator: 'isinteger'
|
5
|
+
},
|
6
|
+
{
|
7
|
+
text: 'Is fractional',
|
8
|
+
operator: 'isfractional'
|
9
|
+
}
|
4
10
|
];
|
5
|
-
export const isNumericExtendedOperator = (operator)
|
11
|
+
export const isNumericExtendedOperator = (operator)=>numericExtendedOperators.some((o)=>o.operator === operator);
|
12
|
+
|
6
13
|
//# sourceMappingURL=numeric-extended-operators.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["../../../src/filters/numeric-filter-extended/numeric-extended-operators.ts"],"sourcesContent":["export const numericExtendedOperators = [\n { text: 'Is integer', operator: 'isinteger' },\n { text: 'Is fractional', operator: 'isfractional' },\n];\n\nexport const isNumericExtendedOperator = (operator: string | Function) =>\n numericExtendedOperators.some(o => o.operator === operator);\n"],"names":["numericExtendedOperators","text","operator","isNumericExtendedOperator","some","o"],"mappings":"AAAA,OAAO,MAAMA,2BAA2B;IACpC;QAAEC,MAAM;QAAcC,UAAU;IAAY;IAC5C;QAAED,MAAM;QAAiBC,UAAU;IAAe;CACrD,CAAC;AAEF,OAAO,MAAMC,4BAA4B,CAACD,WACtCF,yBAAyBI,IAAI,CAACC,CAAAA,IAAKA,EAAEH,QAAQ,KAAKA,UAAU"}
|
@@ -1,34 +1,57 @@
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
2
|
import { NumericTextBox } from '@progress/kendo-react-inputs';
|
3
3
|
import { DropDownList } from '@progress/kendo-react-dropdowns';
|
4
|
-
import { IsUnaryFilter, cellOperatorChange
|
4
|
+
import { IsUnaryFilter, cellOperatorChange } from '@progress/kendo-react-grid/dist/npm/filterCommon';
|
5
5
|
import { numericExtendedOperators, isNumericExtendedOperator } from './numeric-extended-operators';
|
6
6
|
import { renderCustomColumnMenuFilter } from '../column-menu-filters';
|
7
7
|
//
|
8
8
|
// like standard filter cell (rendered for numeric type), but with support of some special numeric operators
|
9
|
-
const NumericExtFilterCell = ({ operators, operator = '', value, onChange
|
9
|
+
const NumericExtFilterCell = ({ operators, operator = '', value, onChange })=>{
|
10
10
|
const operatorsExt = operators.concat(numericExtendedOperators);
|
11
|
-
const operatorValue = operatorsExt.find(item
|
12
|
-
const handleInputChange = (e)
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
const handleOperatorChange = (event)
|
11
|
+
const operatorValue = operatorsExt.find((item)=>item.operator === operator);
|
12
|
+
const handleInputChange = (e)=>onChange({
|
13
|
+
operator,
|
14
|
+
value: e.value,
|
15
|
+
syntheticEvent: e.syntheticEvent
|
16
|
+
});
|
17
|
+
const handleOperatorChange = (event)=>{
|
18
18
|
// set value to 0 when switching to unary operator to allow select
|
19
19
|
const newValue = isNumericExtendedOperator(event.target.value.operator) ? 0 : value;
|
20
20
|
cellOperatorChange(event, newValue, onChange);
|
21
21
|
};
|
22
|
-
const isUnary =
|
23
|
-
|
24
|
-
|
22
|
+
const isUnary = typeof operator === 'string' && IsUnaryFilter(operator) || isNumericExtendedOperator(operator);
|
23
|
+
return /*#__PURE__*/ _jsxs("div", {
|
24
|
+
children: [
|
25
|
+
/*#__PURE__*/ _jsx(DropDownList, {
|
26
|
+
className: "m-b-1",
|
27
|
+
value: operatorValue,
|
28
|
+
onChange: handleOperatorChange,
|
29
|
+
data: operatorsExt,
|
30
|
+
textField: "text"
|
31
|
+
}),
|
32
|
+
/*#__PURE__*/ _jsx(NumericTextBox, {
|
33
|
+
value: isUnary ? null : value,
|
34
|
+
onChange: handleInputChange,
|
35
|
+
disabled: isUnary,
|
36
|
+
className: "m-b-1"
|
37
|
+
})
|
38
|
+
]
|
39
|
+
});
|
25
40
|
};
|
26
|
-
const PercentageExtFilterCell = ({ onChange, value, ...restProps })
|
27
|
-
const handleInputChange = (event)
|
28
|
-
onChange({
|
41
|
+
const PercentageExtFilterCell = ({ onChange, value, ...restProps })=>{
|
42
|
+
const handleInputChange = (event)=>{
|
43
|
+
onChange({
|
44
|
+
...event,
|
45
|
+
value: event.value ? event.value / 100 : event.value
|
46
|
+
});
|
29
47
|
};
|
30
|
-
return
|
48
|
+
return /*#__PURE__*/ _jsx(NumericExtFilterCell, {
|
49
|
+
onChange: handleInputChange,
|
50
|
+
value: value ? value * 100 : value,
|
51
|
+
...restProps
|
52
|
+
});
|
31
53
|
};
|
32
54
|
export const NumericFilterExtended = renderCustomColumnMenuFilter(NumericExtFilterCell, true);
|
33
55
|
export const PercentageFilterExtended = renderCustomColumnMenuFilter(PercentageExtFilterCell, true);
|
56
|
+
|
34
57
|
//# sourceMappingURL=numeric-filter-extended.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["../../../src/filters/numeric-filter-extended/numeric-filter-extended.tsx"],"sourcesContent":["import { FC, SyntheticEvent } from 'react';\n\nimport { NumericTextBox, NumericTextBoxChangeEvent } from '@progress/kendo-react-inputs';\nimport { DropDownList, DropDownListChangeEvent } 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 { numericExtendedOperators, isNumericExtendedOperator } from './numeric-extended-operators';\n\nimport { renderCustomColumnMenuFilter } from '../column-menu-filters';\n//\n\n// like standard filter cell (rendered for numeric type), but with support of some special numeric operators\nconst NumericExtFilterCell: FC<TableColumnMenuFilterCellProps> = ({\n operators,\n operator = '',\n value,\n onChange,\n}) => {\n const operatorsExt = operators.concat(numericExtendedOperators);\n const operatorValue = operatorsExt.find(item => item.operator === operator);\n\n const handleInputChange = (e: NumericTextBoxChangeEvent) =>\n onChange({\n operator,\n value: e.value,\n syntheticEvent: e.syntheticEvent,\n });\n\n const handleOperatorChange = (event: DropDownListChangeEvent) => {\n // set value to 0 when switching to unary operator to allow select\n const newValue = isNumericExtendedOperator(event.target.value.operator) ? 0 : value;\n cellOperatorChange(event, newValue, onChange);\n };\n\n const isUnary =\n (typeof operator === 'string' && IsUnaryFilter(operator)) ||\n isNumericExtendedOperator(operator);\n\n return (\n <div>\n <DropDownList\n className=\"m-b-1\"\n value={operatorValue}\n onChange={handleOperatorChange}\n data={operatorsExt}\n textField=\"text\"\n />\n <NumericTextBox\n value={isUnary ? null : value}\n onChange={handleInputChange}\n disabled={isUnary}\n className=\"m-b-1\"\n />\n </div>\n );\n};\nconst PercentageExtFilterCell: FC<TableColumnMenuFilterCellProps> = ({\n onChange,\n value,\n ...restProps\n}) => {\n const handleInputChange = (event: {\n value: any;\n operator: string | Function;\n syntheticEvent: SyntheticEvent<any>;\n }) => {\n onChange({ ...event, value: event.value ? event.value / 100 : event.value });\n };\n return (\n <NumericExtFilterCell\n onChange={handleInputChange}\n value={value ? value * 100 : value}\n {...restProps}\n />\n );\n};\n\nexport const NumericFilterExtended = renderCustomColumnMenuFilter(NumericExtFilterCell, true);\n\nexport const PercentageFilterExtended = renderCustomColumnMenuFilter(PercentageExtFilterCell, true);\n"],"names":["NumericTextBox","DropDownList","IsUnaryFilter","cellOperatorChange","numericExtendedOperators","isNumericExtendedOperator","renderCustomColumnMenuFilter","NumericExtFilterCell","operators","operator","value","onChange","operatorsExt","concat","operatorValue","find","item","handleInputChange","e","syntheticEvent","handleOperatorChange","event","newValue","target","isUnary","div","className","data","textField","disabled","PercentageExtFilterCell","restProps","NumericFilterExtended","PercentageFilterExtended"],"mappings":";AAEA,SAASA,cAAc,QAAmC,+BAA+B;AACzF,SAASC,YAAY,QAAiC,kCAAkC;AAGxF,SACIC,aAAa,EACbC,kBAAkB,QACf,mDAAmD;AAE1D,SAASC,wBAAwB,EAAEC,yBAAyB,QAAQ,+BAA+B;AAEnG,SAASC,4BAA4B,QAAQ,yBAAyB;AACtE,EAAE;AAEF,4GAA4G;AAC5G,MAAMC,uBAA2D,CAAC,EAC9DC,SAAS,EACTC,WAAW,EAAE,EACbC,KAAK,EACLC,QAAQ,EACX;IACG,MAAMC,eAAeJ,UAAUK,MAAM,CAACT;IACtC,MAAMU,gBAAgBF,aAAaG,IAAI,CAACC,CAAAA,OAAQA,KAAKP,QAAQ,KAAKA;IAElE,MAAMQ,oBAAoB,CAACC,IACvBP,SAAS;YACLF;YACAC,OAAOQ,EAAER,KAAK;YACdS,gBAAgBD,EAAEC,cAAc;QACpC;IAEJ,MAAMC,uBAAuB,CAACC;QAC1B,kEAAkE;QAClE,MAAMC,WAAWjB,0BAA0BgB,MAAME,MAAM,CAACb,KAAK,CAACD,QAAQ,IAAI,IAAIC;QAC9EP,mBAAmBkB,OAAOC,UAAUX;IACxC;IAEA,MAAMa,UACF,AAAC,OAAOf,aAAa,YAAYP,cAAcO,aAC/CJ,0BAA0BI;IAE9B,qBACI,MAACgB;;0BACG,KAACxB;gBACGyB,WAAU;gBACVhB,OAAOI;gBACPH,UAAUS;gBACVO,MAAMf;gBACNgB,WAAU;;0BAEd,KAAC5B;gBACGU,OAAOc,UAAU,OAAOd;gBACxBC,UAAUM;gBACVY,UAAUL;gBACVE,WAAU;;;;AAI1B;AACA,MAAMI,0BAA8D,CAAC,EACjEnB,QAAQ,EACRD,KAAK,EACL,GAAGqB,WACN;IACG,MAAMd,oBAAoB,CAACI;QAKvBV,SAAS;YAAE,GAAGU,KAAK;YAAEX,OAAOW,MAAMX,KAAK,GAAGW,MAAMX,KAAK,GAAG,MAAMW,MAAMX,KAAK;QAAC;IAC9E;IACA,qBACI,KAACH;QACGI,UAAUM;QACVP,OAAOA,QAAQA,QAAQ,MAAMA;QAC5B,GAAGqB,SAAS;;AAGzB;AAEA,OAAO,MAAMC,wBAAwB1B,6BAA6BC,sBAAsB,MAAM;AAE9F,OAAO,MAAM0B,2BAA2B3B,6BAA6BwB,yBAAyB,MAAM"}
|