smart-webcomponents-react 14.2.92 → 14.4.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/alertwindow/alertwindow.d.ts +5 -5
- package/alertwindow/alertwindow.esm.js +10 -85
- package/alertwindow/alertwindow.umd.js +1134 -1209
- package/array/array.d.ts +5 -5
- package/array/array.esm.js +13 -88
- package/array/array.umd.js +752 -827
- package/barcode/barcode.d.ts +3 -3
- package/barcode/barcode.esm.js +6 -61
- package/barcode/barcode.umd.js +311 -366
- package/button/dropdownbutton.d.ts +2 -2
- package/button/multisplitbutton.d.ts +2 -2
- package/calendar/calendar.d.ts +2 -2
- package/calendar/calendar.esm.js +4 -49
- package/calendar/calendar.umd.js +710 -755
- package/card/cardview.d.ts +1 -1
- package/cardview/cardview.d.ts +1 -1
- package/cardview/cardview.esm.js +2 -37
- package/cardview/cardview.umd.js +515 -550
- package/chart/chart.d.ts +9 -9
- package/chart/chart.esm.js +18 -133
- package/chart/chart.umd.js +822 -937
- package/chart/ganttchart.d.ts +20 -20
- package/combobox/combobox.d.ts +4 -4
- package/combobox/combobox.esm.js +8 -73
- package/combobox/combobox.umd.js +1341 -1406
- package/datetimepicker/datetimepicker.d.ts +1 -1
- package/datetimepicker/datetimepicker.esm.js +2 -37
- package/datetimepicker/datetimepicker.umd.js +826 -861
- package/dialogwindow/dialogwindow.d.ts +5 -5
- package/dialogwindow/dialogwindow.esm.js +10 -85
- package/dialogwindow/dialogwindow.umd.js +1134 -1209
- package/dockinglayout/dockinglayout.d.ts +7 -7
- package/dockinglayout/dockinglayout.esm.js +14 -109
- package/dockinglayout/dockinglayout.umd.js +765 -860
- package/dropdownbutton/dropdownbutton.d.ts +2 -2
- package/dropdownbutton/dropdownbutton.esm.js +4 -49
- package/dropdownbutton/dropdownbutton.umd.js +527 -572
- package/dropdownlist/dropdownlist.d.ts +4 -4
- package/dropdownlist/dropdownlist.esm.js +8 -73
- package/dropdownlist/dropdownlist.umd.js +1275 -1340
- package/editor/editor.d.ts +11 -9
- package/editor/editor.esm.js +14 -109
- package/editor/editor.umd.js +911 -1006
- package/fileupload/fileupload.d.ts +2 -1
- package/filterbuilder/filterbuilder.d.ts +1 -1
- package/filterbuilder/filterbuilder.esm.js +2 -37
- package/filterbuilder/filterbuilder.umd.js +463 -498
- package/filterpanel/filterpanel.d.ts +1 -1
- package/filterpanel/filterpanel.esm.js +2 -37
- package/filterpanel/filterpanel.umd.js +354 -389
- package/form/form.d.ts +1 -1
- package/form/form.esm.js +4 -49
- package/form/form.umd.js +1016 -1061
- package/form/formgroup.d.ts +1 -1
- package/ganttchart/ganttchart.d.ts +20 -20
- package/ganttchart/ganttchart.esm.js +40 -265
- package/ganttchart/ganttchart.umd.js +1666 -1891
- package/gauge/gauge.d.ts +2 -2
- package/gauge/gauge.esm.js +4 -49
- package/gauge/gauge.umd.js +664 -709
- package/grid/grid.d.ts +56 -51
- package/grid/grid.esm.js +96 -460
- package/grid/grid.umd.js +2107 -2471
- package/index.d.ts +45 -3
- package/input/input.d.ts +2 -2
- package/input/input.esm.js +4 -49
- package/input/input.umd.js +505 -550
- package/input/numberinput.d.ts +2 -2
- package/input/phoneinput.d.ts +4 -4
- package/kanban/kanban.d.ts +6 -6
- package/kanban/kanban.esm.js +12 -97
- package/kanban/kanban.umd.js +1334 -1419
- package/layout/dockinglayout.d.ts +7 -7
- package/listbox/listbox.d.ts +5 -5
- package/listbox/listbox.esm.js +10 -85
- package/listbox/listbox.umd.js +1170 -1245
- package/listmenu/listmenu.d.ts +1 -1
- package/listmenu/listmenu.esm.js +2 -37
- package/listmenu/listmenu.umd.js +1005 -1040
- package/menu/listmenu.d.ts +1 -1
- package/menu/menu.d.ts +1 -1
- package/menu/menu.esm.js +2 -37
- package/menu/menu.umd.js +1025 -1060
- package/multilinetextbox/multilinetextbox.d.ts +1 -1
- package/multilinetextbox/multilinetextbox.esm.js +2 -37
- package/multilinetextbox/multilinetextbox.umd.js +907 -942
- package/multilinewindow/multilinewindow.d.ts +5 -5
- package/multilinewindow/multilinewindow.esm.js +10 -85
- package/multilinewindow/multilinewindow.umd.js +1134 -1209
- package/multisplitbutton/multisplitbutton.d.ts +2 -2
- package/multisplitbutton/multisplitbutton.esm.js +4 -49
- package/multisplitbutton/multisplitbutton.umd.js +941 -986
- package/numberinput/numberinput.d.ts +2 -2
- package/numberinput/numberinput.esm.js +4 -49
- package/numberinput/numberinput.umd.js +348 -393
- package/numerictextbox/numerictextbox.d.ts +1 -1
- package/numerictextbox/numerictextbox.esm.js +2 -37
- package/numerictextbox/numerictextbox.umd.js +592 -627
- package/package.json +1 -1
- package/phoneinput/phoneinput.d.ts +4 -4
- package/phoneinput/phoneinput.esm.js +8 -73
- package/phoneinput/phoneinput.umd.js +386 -451
- package/pivottable/pivottable.d.ts +3 -3
- package/pivottable/pivottable.esm.js +6 -61
- package/pivottable/pivottable.umd.js +762 -817
- package/progresswindow/progresswindow.d.ts +5 -5
- package/progresswindow/progresswindow.esm.js +10 -85
- package/progresswindow/progresswindow.umd.js +1134 -1209
- package/promptwindow/promptwindow.d.ts +5 -5
- package/promptwindow/promptwindow.esm.js +10 -85
- package/promptwindow/promptwindow.umd.js +1134 -1209
- package/qrcode/qrcode.d.ts +3 -3
- package/qrcode/qrcode.esm.js +6 -61
- package/qrcode/qrcode.umd.js +333 -388
- package/querybuilder/querybuilder.d.ts +6 -1
- package/querybuilder/querybuilder.esm.js +14 -38
- package/querybuilder/querybuilder.umd.js +446 -470
- package/rating/rating.d.ts +1 -1
- package/rating/rating.esm.js +2 -37
- package/rating/rating.umd.js +261 -296
- package/scheduler/scheduler.d.ts +17 -17
- package/scheduler/scheduler.esm.js +34 -229
- package/scheduler/scheduler.umd.js +1782 -1977
- package/slider/slider.d.ts +2 -2
- package/slider/slider.esm.js +4 -49
- package/slider/slider.umd.js +642 -687
- package/source/modules/smart.accordion.js +1 -1
- package/source/modules/smart.array.js +2 -2
- package/source/modules/smart.barcode.js +1 -1
- package/source/modules/smart.breadcrumb.js +1 -1
- package/source/modules/smart.button.js +1 -1
- package/source/modules/smart.buttongroup.js +1 -1
- package/source/modules/smart.calendar.js +2 -2
- package/source/modules/smart.card.js +1 -1
- package/source/modules/smart.cardview.js +3 -3
- package/source/modules/smart.carousel.js +1 -1
- package/source/modules/smart.chart.js +1 -1
- package/source/modules/smart.checkbox.js +1 -1
- package/source/modules/smart.checkinput.js +2 -2
- package/source/modules/smart.chip.js +1 -1
- package/source/modules/smart.colorinput.js +2 -2
- package/source/modules/smart.colorpanel.js +2 -2
- package/source/modules/smart.colorpicker.js +2 -2
- package/source/modules/smart.combobox.js +2 -2
- package/source/modules/smart.common.js +1 -1
- package/source/modules/smart.countryinput.js +2 -2
- package/source/modules/smart.dateinput.js +2 -2
- package/source/modules/smart.daterangeinput.js +3 -3
- package/source/modules/smart.datetimepicker.js +2 -2
- package/source/modules/smart.dockinglayout.js +1 -1
- package/source/modules/smart.dropdownbutton.js +1 -1
- package/source/modules/smart.dropdownlist.js +2 -2
- package/source/modules/smart.editor.js +5 -5
- package/source/modules/smart.element.js +1 -1
- package/source/modules/smart.fileupload.js +3 -3
- package/source/modules/smart.form.js +2 -2
- package/source/modules/smart.formulaparser.js +1 -1
- package/source/modules/smart.ganttchart.js +4 -4
- package/source/modules/smart.gauge.js +1 -1
- package/source/modules/smart.grid.js +10 -10
- package/source/modules/smart.gridpanel.js +3 -3
- package/source/modules/smart.input.js +2 -2
- package/source/modules/smart.kanban.js +4 -4
- package/source/modules/smart.layout.js +1 -1
- package/source/modules/smart.led.js +1 -1
- package/source/modules/smart.listbox.js +2 -2
- package/source/modules/smart.listmenu.js +1 -1
- package/source/modules/smart.map.js +1 -1
- package/source/modules/smart.maskedtextbox.js +2 -2
- package/source/modules/smart.menu.js +1 -1
- package/source/modules/smart.multicomboinput.js +2 -2
- package/source/modules/smart.multiinput.js +2 -2
- package/source/modules/smart.multilinetextbox.js +2 -2
- package/source/modules/smart.multisplitbutton.js +2 -2
- package/source/modules/smart.numberinput.js +2 -2
- package/source/modules/smart.numerictextbox.js +2 -2
- package/source/modules/smart.pager.js +2 -2
- package/source/modules/smart.passwordinput.js +2 -2
- package/source/modules/smart.passwordtextbox.js +2 -2
- package/source/modules/smart.path.js +1 -1
- package/source/modules/smart.phoneinput.js +2 -2
- package/source/modules/smart.pivottable.js +3 -3
- package/source/modules/smart.progressbar.js +1 -1
- package/source/modules/smart.qrcode.js +1 -1
- package/source/modules/smart.querybuilder.js +4 -4
- package/source/modules/smart.radiobutton.js +1 -1
- package/source/modules/smart.rating.js +1 -1
- package/source/modules/smart.router.js +1 -1
- package/source/modules/smart.scheduler.js +3 -3
- package/source/modules/smart.scrollbar.js +1 -1
- package/source/modules/smart.slider.js +1 -1
- package/source/modules/smart.sortable.js +1 -1
- package/source/modules/smart.splitter.js +1 -1
- package/source/modules/smart.switchbutton.js +1 -1
- package/source/modules/smart.table.js +3 -3
- package/source/modules/smart.tabs.js +1 -1
- package/source/modules/smart.tank.js +1 -1
- package/source/modules/smart.textarea.js +2 -2
- package/source/modules/smart.textbox.js +2 -2
- package/source/modules/smart.timeinput.js +2 -2
- package/source/modules/smart.timepicker.js +1 -1
- package/source/modules/smart.toast.js +1 -1
- package/source/modules/smart.tooltip.js +1 -1
- package/source/modules/smart.tree.js +1 -1
- package/source/modules/smart.validator.js +1 -1
- package/source/modules/smart.window.js +2 -2
- package/source/smart.accordion.js +1 -1
- package/source/smart.ajax.js +1 -1
- package/source/smart.array.js +1 -1
- package/source/smart.barcode.js +1 -1
- package/source/smart.bootstrap.js +1 -1
- package/source/smart.breadcrumb.js +1 -1
- package/source/smart.button.js +1 -1
- package/source/smart.buttongroup.js +1 -1
- package/source/smart.calendar.js +1 -1
- package/source/smart.card.js +1 -1
- package/source/smart.cardview.js +1 -1
- package/source/smart.carousel.js +1 -1
- package/source/smart.chart.annotations.js +1 -1
- package/source/smart.chart.api.js +1 -1
- package/source/smart.chart.core.js +1 -1
- package/source/smart.chart.js +1 -1
- package/source/smart.chart.rangeselector.js +1 -1
- package/source/smart.chart.waterfall.js +1 -1
- package/source/smart.checkbox.js +1 -1
- package/source/smart.checkinput.js +1 -1
- package/source/smart.chip.js +1 -1
- package/source/smart.colorinput.js +1 -1
- package/source/smart.colorpanel.js +1 -1
- package/source/smart.colorpicker.js +1 -1
- package/source/smart.combobox.js +1 -1
- package/source/smart.complex.js +1 -1
- package/source/smart.core.js +1 -1
- package/source/smart.countryinput.js +1 -1
- package/source/smart.data.js +1 -1
- package/source/smart.date.js +1 -1
- package/source/smart.dateformatpanel.js +1 -1
- package/source/smart.dateinput.js +1 -1
- package/source/smart.daterangeinput.js +1 -1
- package/source/smart.datetimepicker.js +1 -1
- package/source/smart.dockinglayout.js +1 -1
- package/source/smart.draw.js +1 -1
- package/source/smart.dropdownbutton.js +1 -1
- package/source/smart.dropdownlist.js +1 -1
- package/source/smart.editor.js +2 -2
- package/source/smart.element.js +1 -1
- package/source/smart.elements.js +14 -14
- package/source/smart.export.js +1 -1
- package/source/smart.fileupload.js +2 -2
- package/source/smart.filter.js +1 -1
- package/source/smart.filterbuilder.js +2 -2
- package/source/smart.filterpanel.js +1 -1
- package/source/smart.form.js +1 -1
- package/source/smart.format.js +1 -1
- package/source/smart.formulaparser.js +1 -1
- package/source/smart.ganttchart.js +2 -2
- package/source/smart.gauge.js +1 -1
- package/source/smart.grid.cell.js +2 -2
- package/source/smart.grid.chart.js +1 -1
- package/source/smart.grid.column.js +1 -1
- package/source/smart.grid.core.js +2 -2
- package/source/smart.grid.dialog.js +2 -2
- package/source/smart.grid.edit.js +2 -2
- package/source/smart.grid.export.js +1 -1
- package/source/smart.grid.filter.js +1 -1
- package/source/smart.grid.group.js +1 -1
- package/source/smart.grid.js +1 -1
- package/source/smart.grid.menu.js +2 -2
- package/source/smart.grid.pager.js +1 -1
- package/source/smart.grid.reorder.js +1 -1
- package/source/smart.grid.resize.js +1 -1
- package/source/smart.grid.row.js +1 -1
- package/source/smart.grid.select.js +2 -2
- package/source/smart.grid.sort.js +1 -1
- package/source/smart.grid.toolbar.js +1 -1
- package/source/smart.grid.tree.js +1 -1
- package/source/smart.grid.view.js +1 -1
- package/source/smart.gridpanel.js +1 -1
- package/source/smart.input.js +2 -2
- package/source/smart.kanban.js +2 -2
- package/source/smart.layout.js +1 -1
- package/source/smart.led.js +1 -1
- package/source/smart.listbox.js +2 -2
- package/source/smart.listmenu.js +1 -1
- package/source/smart.map.js +1 -1
- package/source/smart.maskedtextbox.js +1 -1
- package/source/smart.math.js +1 -1
- package/source/smart.menu.js +1 -1
- package/source/smart.multicomboinput.js +1 -1
- package/source/smart.multiinput.js +1 -1
- package/source/smart.multilinetextbox.js +1 -1
- package/source/smart.multisplitbutton.js +1 -1
- package/source/smart.numberformatpanel.js +1 -1
- package/source/smart.numberinput.js +1 -1
- package/source/smart.numeric.js +1 -1
- package/source/smart.numerictextbox.js +1 -1
- package/source/smart.pager.js +1 -1
- package/source/smart.passwordinput.js +1 -1
- package/source/smart.passwordtextbox.js +1 -1
- package/source/smart.path.js +1 -1
- package/source/smart.phoneinput.js +1 -1
- package/source/smart.pivottable.js +1 -1
- package/source/smart.powerbutton.js +1 -1
- package/source/smart.progressbar.js +1 -1
- package/source/smart.qrcode.js +1 -1
- package/source/smart.radiobutton.js +1 -1
- package/source/smart.rating.js +1 -1
- package/source/smart.router.js +1 -1
- package/source/smart.scheduler.js +1 -1
- package/source/smart.scrollbar.js +1 -1
- package/source/smart.slider.js +1 -1
- package/source/smart.sortable.js +1 -1
- package/source/smart.splitter.js +1 -1
- package/source/smart.switchbutton.js +1 -1
- package/source/smart.table.js +1 -1
- package/source/smart.tabs.js +1 -1
- package/source/smart.tank.js +1 -1
- package/source/smart.textarea.js +1 -1
- package/source/smart.textbox.js +1 -1
- package/source/smart.tickintervalhandler.js +1 -1
- package/source/smart.timeinput.js +1 -1
- package/source/smart.timepicker.js +1 -1
- package/source/smart.toast.js +1 -1
- package/source/smart.tooltip.js +1 -1
- package/source/smart.tree.js +1 -1
- package/source/smart.validationpanel.js +1 -1
- package/source/smart.validator.js +1 -1
- package/source/smart.window.js +1 -1
- package/source/typescript/smart.editor.d.ts +4 -2
- package/source/typescript/smart.elements.d.ts +45 -3
- package/source/typescript/smart.fileupload.d.ts +2 -1
- package/source/typescript/smart.grid.d.ts +34 -0
- package/source/typescript/smart.querybuilder.d.ts +5 -0
- package/splitter/splitter.d.ts +3 -3
- package/splitter/splitter.esm.js +6 -61
- package/splitter/splitter.umd.js +901 -956
- package/table/pivottable.d.ts +3 -3
- package/table/table.d.ts +7 -7
- package/table/table.esm.js +14 -109
- package/table/table.umd.js +1278 -1373
- package/tabs/tabs.d.ts +4 -4
- package/tabs/tabs.esm.js +8 -73
- package/tabs/tabs.umd.js +875 -940
- package/tabs/tabswindow.d.ts +5 -5
- package/tabswindow/tabswindow.d.ts +5 -5
- package/tabswindow/tabswindow.esm.js +10 -85
- package/tabswindow/tabswindow.umd.js +1134 -1209
- package/tank/tank.d.ts +2 -2
- package/tank/tank.esm.js +4 -49
- package/tank/tank.umd.js +598 -643
- package/textbox/multilinetextbox.d.ts +1 -1
- package/textbox/numerictextbox.d.ts +1 -1
- package/timepicker/datetimepicker.d.ts +1 -1
- package/toast/toast.d.ts +1 -1
- package/toast/toast.esm.js +2 -37
- package/toast/toast.umd.js +397 -432
- package/tree/tree.d.ts +4 -4
- package/tree/tree.esm.js +8 -73
- package/tree/tree.umd.js +1310 -1375
- package/waitwindow/waitwindow.d.ts +5 -5
- package/waitwindow/waitwindow.esm.js +10 -85
- package/waitwindow/waitwindow.umd.js +1134 -1209
- package/window/alertwindow.d.ts +5 -5
- package/window/dialogwindow.d.ts +5 -5
- package/window/multilinewindow.d.ts +5 -5
- package/window/progresswindow.d.ts +5 -5
- package/window/promptwindow.d.ts +5 -5
- package/window/tabswindow.d.ts +5 -5
- package/window/waitwindow.d.ts +5 -5
- package/window/window.d.ts +5 -5
- package/window/window.esm.js +10 -85
- package/window/window.umd.js +1134 -1209
|
@@ -2,508 +2,473 @@
|
|
|
2
2
|
require('../source/modules/smart.filterbuilder');
|
|
3
3
|
|
|
4
4
|
(function (global, factory) {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react')) :
|
|
6
|
+
typeof define === 'function' && define.amd ? define(['exports', 'react'], factory) :
|
|
7
|
+
(factory((global.filterbuilder = {}),global.React));
|
|
8
8
|
}(this, (function (exports,React) { 'use strict';
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
React = React && React.hasOwnProperty('default') ? React['default'] : React;
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
12
|
+
const Smart = window.Smart;
|
|
13
|
+
/**
|
|
14
|
+
FilterBuilder allows you to dynamically build filters.
|
|
15
|
+
*/
|
|
16
|
+
class FilterBuilder extends React.Component {
|
|
17
|
+
constructor(props) {
|
|
18
|
+
super(props);
|
|
19
|
+
this.componentRef = React.createRef();
|
|
20
|
+
}
|
|
21
|
+
// Gets the id of the React component.
|
|
22
|
+
get id() {
|
|
23
|
+
if (!this._id) {
|
|
24
|
+
this._id = 'FilterBuilder' + Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
|
|
25
|
+
}
|
|
26
|
+
return this._id;
|
|
27
|
+
}
|
|
28
|
+
/** Sets or gets the animation mode. Animation is disabled when the property is set to 'none'
|
|
29
|
+
* Property type: Animation | string
|
|
30
|
+
*/
|
|
31
|
+
get animation() {
|
|
32
|
+
return this.nativeElement ? this.nativeElement.animation : undefined;
|
|
33
|
+
}
|
|
34
|
+
set animation(value) {
|
|
35
|
+
if (this.nativeElement) {
|
|
36
|
+
this.nativeElement.animation = value;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
/** Adds more operations, that can be used in the filter bilder's conditions structure.
|
|
40
|
+
* Property type: {name: string, caption: string, icon: string}[]
|
|
41
|
+
*/
|
|
42
|
+
get customOperations() {
|
|
43
|
+
return this.nativeElement ? this.nativeElement.customOperations : undefined;
|
|
44
|
+
}
|
|
45
|
+
set customOperations(value) {
|
|
46
|
+
if (this.nativeElement) {
|
|
47
|
+
this.nativeElement.customOperations = value;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
/** Enables or disables the context menu.
|
|
51
|
+
* Property type: boolean
|
|
52
|
+
*/
|
|
53
|
+
get disableContextMenu() {
|
|
54
|
+
return this.nativeElement ? this.nativeElement.disableContextMenu : undefined;
|
|
55
|
+
}
|
|
56
|
+
set disableContextMenu(value) {
|
|
57
|
+
if (this.nativeElement) {
|
|
58
|
+
this.nativeElement.disableContextMenu = value;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
/** Enables or disables the element.
|
|
62
|
+
* Property type: boolean
|
|
63
|
+
*/
|
|
64
|
+
get disabled() {
|
|
65
|
+
return this.nativeElement ? this.nativeElement.disabled : undefined;
|
|
66
|
+
}
|
|
67
|
+
set disabled(value) {
|
|
68
|
+
if (this.nativeElement) {
|
|
69
|
+
this.nativeElement.disabled = value;
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
/** Array with filtered fields and their settings.
|
|
73
|
+
* Property type: any
|
|
74
|
+
*/
|
|
75
|
+
get fields() {
|
|
76
|
+
return this.nativeElement ? this.nativeElement.fields : undefined;
|
|
77
|
+
}
|
|
78
|
+
set fields(value) {
|
|
79
|
+
if (this.nativeElement) {
|
|
80
|
+
this.nativeElement.fields = value;
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
/** Sets or gets the format string of the editor of fields with type 'date'.
|
|
84
|
+
* Property type: string
|
|
85
|
+
*/
|
|
86
|
+
get formatStringDate() {
|
|
87
|
+
return this.nativeElement ? this.nativeElement.formatStringDate : undefined;
|
|
88
|
+
}
|
|
89
|
+
set formatStringDate(value) {
|
|
90
|
+
if (this.nativeElement) {
|
|
91
|
+
this.nativeElement.formatStringDate = value;
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
/** Sets or gets the format string of the editor of fields with type 'datetime'.
|
|
95
|
+
* Property type: string
|
|
96
|
+
*/
|
|
97
|
+
get formatStringDateTime() {
|
|
98
|
+
return this.nativeElement ? this.nativeElement.formatStringDateTime : undefined;
|
|
99
|
+
}
|
|
100
|
+
set formatStringDateTime(value) {
|
|
101
|
+
if (this.nativeElement) {
|
|
102
|
+
this.nativeElement.formatStringDateTime = value;
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
/** Sets hint in form of popup message.
|
|
106
|
+
* Property type: string
|
|
107
|
+
*/
|
|
108
|
+
get hint() {
|
|
109
|
+
return this.nativeElement ? this.nativeElement.hint : undefined;
|
|
110
|
+
}
|
|
111
|
+
set hint(value) {
|
|
112
|
+
if (this.nativeElement) {
|
|
113
|
+
this.nativeElement.hint = value;
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
/** Defines icon's representatino as characters.
|
|
117
|
+
* Property type: FilterBuilderIcons
|
|
118
|
+
*/
|
|
119
|
+
get icons() {
|
|
120
|
+
return this.nativeElement ? this.nativeElement.icons : undefined;
|
|
121
|
+
}
|
|
122
|
+
set icons(value) {
|
|
123
|
+
if (this.nativeElement) {
|
|
124
|
+
this.nativeElement.icons = value;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
/** Sets or gets the language. Used in conjunction with the property messages.
|
|
128
|
+
* Property type: string
|
|
129
|
+
*/
|
|
130
|
+
get locale() {
|
|
131
|
+
return this.nativeElement ? this.nativeElement.locale : undefined;
|
|
132
|
+
}
|
|
133
|
+
set locale(value) {
|
|
134
|
+
if (this.nativeElement) {
|
|
135
|
+
this.nativeElement.locale = value;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
/** Callback, related to localization module.
|
|
139
|
+
* Property type: any
|
|
140
|
+
*/
|
|
141
|
+
get localizeFormatFunction() {
|
|
142
|
+
return this.nativeElement ? this.nativeElement.localizeFormatFunction : undefined;
|
|
143
|
+
}
|
|
144
|
+
set localizeFormatFunction(value) {
|
|
145
|
+
if (this.nativeElement) {
|
|
146
|
+
this.nativeElement.localizeFormatFunction = value;
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
/** Defines maximum number of allowed conditions in the element.
|
|
150
|
+
* Property type: number | null
|
|
151
|
+
*/
|
|
152
|
+
get maxConditions() {
|
|
153
|
+
return this.nativeElement ? this.nativeElement.maxConditions : undefined;
|
|
154
|
+
}
|
|
155
|
+
set maxConditions(value) {
|
|
156
|
+
if (this.nativeElement) {
|
|
157
|
+
this.nativeElement.maxConditions = value;
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
/** Defines maximum number of allowed conditions in group.
|
|
161
|
+
* Property type: number | null
|
|
162
|
+
*/
|
|
163
|
+
get maxConditionsPerGroup() {
|
|
164
|
+
return this.nativeElement ? this.nativeElement.maxConditionsPerGroup : undefined;
|
|
165
|
+
}
|
|
166
|
+
set maxConditionsPerGroup(value) {
|
|
167
|
+
if (this.nativeElement) {
|
|
168
|
+
this.nativeElement.maxConditionsPerGroup = value;
|
|
169
|
+
}
|
|
170
|
+
}
|
|
171
|
+
/** Defines maximum level of grouping in the FilterBuilder.
|
|
172
|
+
* Property type: number | null
|
|
173
|
+
*/
|
|
174
|
+
get maxLevel() {
|
|
175
|
+
return this.nativeElement ? this.nativeElement.maxLevel : undefined;
|
|
176
|
+
}
|
|
177
|
+
set maxLevel(value) {
|
|
178
|
+
if (this.nativeElement) {
|
|
179
|
+
this.nativeElement.maxLevel = value;
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
/** Defines field names of the filtered element.
|
|
183
|
+
* Property type: any
|
|
184
|
+
*/
|
|
185
|
+
get messages() {
|
|
186
|
+
return this.nativeElement ? this.nativeElement.messages : undefined;
|
|
187
|
+
}
|
|
188
|
+
set messages(value) {
|
|
189
|
+
if (this.nativeElement) {
|
|
190
|
+
this.nativeElement.messages = value;
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
/** If the element is readonly, users cannot interact with it.
|
|
194
|
+
* Property type: boolean
|
|
195
|
+
*/
|
|
196
|
+
get readonly() {
|
|
197
|
+
return this.nativeElement ? this.nativeElement.readonly : undefined;
|
|
198
|
+
}
|
|
199
|
+
set readonly(value) {
|
|
200
|
+
if (this.nativeElement) {
|
|
201
|
+
this.nativeElement.readonly = value;
|
|
202
|
+
}
|
|
203
|
+
}
|
|
204
|
+
/** In restrictedMode set to true, adding of new groups and groups editing by user interaction are denied.
|
|
205
|
+
* Property type: boolean
|
|
206
|
+
*/
|
|
207
|
+
get restrictedMode() {
|
|
208
|
+
return this.nativeElement ? this.nativeElement.restrictedMode : undefined;
|
|
209
|
+
}
|
|
210
|
+
set restrictedMode(value) {
|
|
211
|
+
if (this.nativeElement) {
|
|
212
|
+
this.nativeElement.restrictedMode = value;
|
|
213
|
+
}
|
|
214
|
+
}
|
|
215
|
+
/** Enables or disables the display of the icons.
|
|
216
|
+
* Property type: boolean
|
|
217
|
+
*/
|
|
218
|
+
get showIcons() {
|
|
219
|
+
return this.nativeElement ? this.nativeElement.showIcons : undefined;
|
|
220
|
+
}
|
|
221
|
+
set showIcons(value) {
|
|
222
|
+
if (this.nativeElement) {
|
|
223
|
+
this.nativeElement.showIcons = value;
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
/** Determines the theme. Theme defines the look of the element
|
|
227
|
+
* Property type: string
|
|
228
|
+
*/
|
|
229
|
+
get theme() {
|
|
230
|
+
return this.nativeElement ? this.nativeElement.theme : undefined;
|
|
231
|
+
}
|
|
232
|
+
set theme(value) {
|
|
233
|
+
if (this.nativeElement) {
|
|
234
|
+
this.nativeElement.theme = value;
|
|
235
|
+
}
|
|
236
|
+
}
|
|
237
|
+
/** If is set to true, the element cannot be focused.
|
|
238
|
+
* Property type: boolean
|
|
239
|
+
*/
|
|
240
|
+
get unfocusable() {
|
|
241
|
+
return this.nativeElement ? this.nativeElement.unfocusable : undefined;
|
|
242
|
+
}
|
|
243
|
+
set unfocusable(value) {
|
|
244
|
+
if (this.nativeElement) {
|
|
245
|
+
this.nativeElement.unfocusable = value;
|
|
246
|
+
}
|
|
247
|
+
}
|
|
248
|
+
/** The value is represented by multidimensional array. The array contains group operators and conditions. Each group can contain nested structures at multiple levels.
|
|
249
|
+
* Property type: string[]
|
|
250
|
+
*/
|
|
251
|
+
get value() {
|
|
252
|
+
return this.nativeElement ? this.nativeElement.value : undefined;
|
|
253
|
+
}
|
|
254
|
+
set value(value) {
|
|
255
|
+
if (this.nativeElement) {
|
|
256
|
+
this.nativeElement.value = value;
|
|
257
|
+
}
|
|
258
|
+
}
|
|
259
|
+
/** Callback used to format the content of the value fields.
|
|
260
|
+
* Property type: any
|
|
261
|
+
*/
|
|
262
|
+
get valueFormatFunction() {
|
|
263
|
+
return this.nativeElement ? this.nativeElement.valueFormatFunction : undefined;
|
|
264
|
+
}
|
|
265
|
+
set valueFormatFunction(value) {
|
|
266
|
+
if (this.nativeElement) {
|
|
267
|
+
this.nativeElement.valueFormatFunction = value;
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
/** Sets the placeholder text used in the condition's value box in case the value is not set.
|
|
271
|
+
* Property type: string
|
|
272
|
+
*/
|
|
273
|
+
get valuePlaceholder() {
|
|
274
|
+
return this.nativeElement ? this.nativeElement.valuePlaceholder : undefined;
|
|
275
|
+
}
|
|
276
|
+
set valuePlaceholder(value) {
|
|
277
|
+
if (this.nativeElement) {
|
|
278
|
+
this.nativeElement.valuePlaceholder = value;
|
|
279
|
+
}
|
|
280
|
+
}
|
|
281
|
+
// Gets the properties of the React component.
|
|
282
|
+
get properties() {
|
|
283
|
+
return ["animation", "customOperations", "disableContextMenu", "disabled", "fields", "formatStringDate", "formatStringDateTime", "hint", "icons", "locale", "localizeFormatFunction", "maxConditions", "maxConditionsPerGroup", "maxLevel", "messages", "readonly", "restrictedMode", "showIcons", "theme", "unfocusable", "value", "valueFormatFunction", "valuePlaceholder"];
|
|
284
|
+
}
|
|
285
|
+
// Gets the events of the React component.
|
|
286
|
+
get eventListeners() {
|
|
287
|
+
return ["onChange", "onEditorClose", "onEditorClosing", "onEditorOpen", "onEditorOpening", "onItemClick", "onOpen", "onOpening", "onClose", "onClosing", "onCreate", "onReady"];
|
|
288
|
+
}
|
|
289
|
+
/** Adds new condition in particular group.
|
|
290
|
+
* @param {string | HTMLElement} parentGroup. A string, representing the id of the item or an HTML Element referencing this condition.
|
|
291
|
+
* @param {any[]} data. An array, representing condition. Condition's element's role is related to their position in the condition's array. At index 0 - field name, index 1 - condition's opertor, index 2 - condition's value.
|
|
292
|
+
*/
|
|
293
|
+
addCondition(parentGroup, data) {
|
|
294
|
+
if (this.nativeElement.isRendered) {
|
|
295
|
+
this.nativeElement.addCondition(parentGroup, data);
|
|
296
|
+
}
|
|
297
|
+
else {
|
|
298
|
+
this.nativeElement.whenRendered(() => {
|
|
299
|
+
this.nativeElement.addCondition(parentGroup, data);
|
|
300
|
+
});
|
|
301
|
+
}
|
|
302
|
+
}
|
|
303
|
+
/** Adds new group in particular parent group.
|
|
304
|
+
* @param {string | HTMLElement} parentGroup. A string, representing the id of the item or an HTML Element referencing this group.
|
|
305
|
+
* @param {string} data. A string, representing the group operator.
|
|
306
|
+
*/
|
|
307
|
+
addGroup(parentGroup, data) {
|
|
308
|
+
if (this.nativeElement.isRendered) {
|
|
309
|
+
this.nativeElement.addGroup(parentGroup, data);
|
|
310
|
+
}
|
|
311
|
+
else {
|
|
312
|
+
this.nativeElement.whenRendered(() => {
|
|
313
|
+
this.nativeElement.addGroup(parentGroup, data);
|
|
314
|
+
});
|
|
315
|
+
}
|
|
316
|
+
}
|
|
317
|
+
/** Removes condition.
|
|
318
|
+
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing this condition.
|
|
319
|
+
*/
|
|
320
|
+
removeCondition(item) {
|
|
321
|
+
if (this.nativeElement.isRendered) {
|
|
322
|
+
this.nativeElement.removeCondition(item);
|
|
323
|
+
}
|
|
324
|
+
else {
|
|
325
|
+
this.nativeElement.whenRendered(() => {
|
|
326
|
+
this.nativeElement.removeCondition(item);
|
|
327
|
+
});
|
|
328
|
+
}
|
|
329
|
+
}
|
|
330
|
+
/** Deletes group and all of it's children
|
|
331
|
+
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing this group.
|
|
332
|
+
*/
|
|
333
|
+
removeGroup(item) {
|
|
334
|
+
if (this.nativeElement.isRendered) {
|
|
335
|
+
this.nativeElement.removeGroup(item);
|
|
336
|
+
}
|
|
337
|
+
else {
|
|
338
|
+
this.nativeElement.whenRendered(() => {
|
|
339
|
+
this.nativeElement.removeGroup(item);
|
|
340
|
+
});
|
|
341
|
+
}
|
|
342
|
+
}
|
|
343
|
+
/** Returns a string representation of the filter builder's value.
|
|
344
|
+
* @param {boolean} useLabels?. Controls the way of string representation. In mode without labels the value object is stringified only.
|
|
345
|
+
* @returns {string}
|
|
346
|
+
*/
|
|
347
|
+
toString(useLabels) {
|
|
348
|
+
const result = this.nativeElement.toString(useLabels);
|
|
349
|
+
return result;
|
|
350
|
+
}
|
|
351
|
+
/** Updates condition.
|
|
352
|
+
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing targeted condition.
|
|
353
|
+
* @param {any[]} data. An array, representing condition. Condition's element's role is related to their position in the condition's array. At index 0 - field name, index 1 - condition's opertor, index 2 - condition's value.
|
|
354
|
+
*/
|
|
355
|
+
updateCondition(item, data) {
|
|
356
|
+
if (this.nativeElement.isRendered) {
|
|
357
|
+
this.nativeElement.updateCondition(item, data);
|
|
358
|
+
}
|
|
359
|
+
else {
|
|
360
|
+
this.nativeElement.whenRendered(() => {
|
|
361
|
+
this.nativeElement.updateCondition(item, data);
|
|
362
|
+
});
|
|
363
|
+
}
|
|
364
|
+
}
|
|
365
|
+
/** Updates group
|
|
366
|
+
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing this group.
|
|
367
|
+
* @param {string} data. A string, representing the group operator.
|
|
368
|
+
*/
|
|
369
|
+
updateGroup(item, data) {
|
|
370
|
+
if (this.nativeElement.isRendered) {
|
|
371
|
+
this.nativeElement.updateGroup(item, data);
|
|
372
|
+
}
|
|
373
|
+
else {
|
|
374
|
+
this.nativeElement.whenRendered(() => {
|
|
375
|
+
this.nativeElement.updateGroup(item, data);
|
|
376
|
+
});
|
|
377
|
+
}
|
|
378
|
+
}
|
|
379
|
+
componentDidRender(initialize) {
|
|
380
|
+
const that = this;
|
|
381
|
+
const props = {};
|
|
382
|
+
const events = {};
|
|
383
|
+
let styles = null;
|
|
384
|
+
for (let prop in that.props) {
|
|
385
|
+
if (prop === 'children') {
|
|
386
|
+
continue;
|
|
387
|
+
}
|
|
388
|
+
if (prop === 'style') {
|
|
389
|
+
styles = that.props[prop];
|
|
390
|
+
continue;
|
|
391
|
+
}
|
|
392
|
+
if (prop.startsWith('on') && that.properties.indexOf(prop) === -1) {
|
|
393
|
+
events[prop] = that.props[prop];
|
|
394
|
+
continue;
|
|
395
|
+
}
|
|
396
|
+
props[prop] = that.props[prop];
|
|
397
|
+
}
|
|
398
|
+
if (initialize) {
|
|
399
|
+
that.nativeElement = this.componentRef.current;
|
|
400
|
+
}
|
|
401
|
+
for (let prop in props) {
|
|
402
|
+
if (prop === 'class' || prop === 'className') {
|
|
403
|
+
const classNames = props[prop].trim().split(' ');
|
|
404
|
+
for (let className in classNames) {
|
|
405
|
+
if (!that.nativeElement.classList.contains(classNames[className]) && classNames[className] !== "") {
|
|
406
|
+
that.nativeElement.classList.add(classNames[className]);
|
|
407
|
+
}
|
|
408
|
+
}
|
|
409
|
+
continue;
|
|
410
|
+
}
|
|
411
|
+
if (props[prop] !== that.nativeElement[prop]) {
|
|
412
|
+
const normalizeProp = (str) => {
|
|
413
|
+
return str.replace(/-([a-z])/g, function (g) {
|
|
414
|
+
return g[1].toUpperCase();
|
|
415
|
+
});
|
|
416
|
+
};
|
|
417
|
+
if (prop === 'hover' || prop === 'active' || prop === 'focus' || prop === 'selected') {
|
|
418
|
+
that.nativeElement.setAttribute(prop, '');
|
|
419
|
+
}
|
|
420
|
+
const normalizedProp = normalizeProp(prop);
|
|
421
|
+
that.nativeElement[normalizedProp] = props[prop];
|
|
422
|
+
}
|
|
423
|
+
}
|
|
424
|
+
for (let eventName in events) {
|
|
425
|
+
that[eventName] = events[eventName];
|
|
426
|
+
that.nativeElement[eventName.toLowerCase()] = events[eventName];
|
|
427
|
+
}
|
|
428
|
+
if (initialize) {
|
|
429
|
+
Smart.Render();
|
|
430
|
+
if (that.onCreate) {
|
|
431
|
+
that.onCreate();
|
|
432
|
+
}
|
|
433
|
+
that.nativeElement.whenRendered(() => {
|
|
434
|
+
if (that.onReady) {
|
|
435
|
+
that.onReady();
|
|
436
|
+
}
|
|
437
|
+
});
|
|
438
|
+
}
|
|
439
|
+
// setup styles.
|
|
440
|
+
if (styles) {
|
|
441
|
+
for (let styleName in styles) {
|
|
442
|
+
that.nativeElement.style[styleName] = styles[styleName];
|
|
443
|
+
}
|
|
444
|
+
}
|
|
445
|
+
}
|
|
446
|
+
componentDidMount() {
|
|
447
|
+
this.componentDidRender(true);
|
|
448
|
+
}
|
|
449
|
+
componentDidUpdate() {
|
|
450
|
+
this.componentDidRender(false);
|
|
451
|
+
}
|
|
452
|
+
componentWillUnmount() {
|
|
453
|
+
const that = this;
|
|
454
|
+
if (!that.nativeElement) {
|
|
455
|
+
return;
|
|
456
|
+
}
|
|
457
|
+
that.nativeElement.whenRenderedCallbacks = [];
|
|
458
|
+
for (let i = 0; i < that.eventListeners.length; i++) {
|
|
459
|
+
const eventName = that.eventListeners[i];
|
|
460
|
+
that.nativeElement.removeEventListener(eventName.substring(2).toLowerCase(), that[eventName]);
|
|
461
|
+
}
|
|
462
|
+
}
|
|
463
|
+
render() {
|
|
464
|
+
return (React.createElement("smart-filter-builder", { ref: this.componentRef }, this.props.children));
|
|
465
|
+
}
|
|
466
|
+
}
|
|
36
467
|
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
*/
|
|
41
|
-
class FilterBuilder extends React.Component {
|
|
42
|
-
constructor(props) {
|
|
43
|
-
super(props);
|
|
44
|
-
this.componentRef = React.createRef();
|
|
45
|
-
}
|
|
46
|
-
// Gets the id of the React component.
|
|
47
|
-
get id() {
|
|
48
|
-
if (!this._id) {
|
|
49
|
-
this._id = 'FilterBuilder' + Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
|
|
50
|
-
}
|
|
51
|
-
return this._id;
|
|
52
|
-
}
|
|
53
|
-
/** Sets or gets the animation mode. Animation is disabled when the property is set to 'none'
|
|
54
|
-
* Property type: Animation | string
|
|
55
|
-
*/
|
|
56
|
-
get animation() {
|
|
57
|
-
return this.nativeElement ? this.nativeElement.animation : undefined;
|
|
58
|
-
}
|
|
59
|
-
set animation(value) {
|
|
60
|
-
if (this.nativeElement) {
|
|
61
|
-
this.nativeElement.animation = value;
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
/** Adds more operations, that can be used in the filter bilder's conditions structure.
|
|
65
|
-
* Property type: {name: string, caption: string, icon: string}[]
|
|
66
|
-
*/
|
|
67
|
-
get customOperations() {
|
|
68
|
-
return this.nativeElement ? this.nativeElement.customOperations : undefined;
|
|
69
|
-
}
|
|
70
|
-
set customOperations(value) {
|
|
71
|
-
if (this.nativeElement) {
|
|
72
|
-
this.nativeElement.customOperations = value;
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
/** Enables or disables the context menu.
|
|
76
|
-
* Property type: boolean
|
|
77
|
-
*/
|
|
78
|
-
get disableContextMenu() {
|
|
79
|
-
return this.nativeElement ? this.nativeElement.disableContextMenu : undefined;
|
|
80
|
-
}
|
|
81
|
-
set disableContextMenu(value) {
|
|
82
|
-
if (this.nativeElement) {
|
|
83
|
-
this.nativeElement.disableContextMenu = value;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
/** Enables or disables the element.
|
|
87
|
-
* Property type: boolean
|
|
88
|
-
*/
|
|
89
|
-
get disabled() {
|
|
90
|
-
return this.nativeElement ? this.nativeElement.disabled : undefined;
|
|
91
|
-
}
|
|
92
|
-
set disabled(value) {
|
|
93
|
-
if (this.nativeElement) {
|
|
94
|
-
this.nativeElement.disabled = value;
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
/** Array with filtered fields and their settings.
|
|
98
|
-
* Property type: any
|
|
99
|
-
*/
|
|
100
|
-
get fields() {
|
|
101
|
-
return this.nativeElement ? this.nativeElement.fields : undefined;
|
|
102
|
-
}
|
|
103
|
-
set fields(value) {
|
|
104
|
-
if (this.nativeElement) {
|
|
105
|
-
this.nativeElement.fields = value;
|
|
106
|
-
}
|
|
107
|
-
}
|
|
108
|
-
/** Sets or gets the format string of the editor of fields with type 'date'.
|
|
109
|
-
* Property type: string
|
|
110
|
-
*/
|
|
111
|
-
get formatStringDate() {
|
|
112
|
-
return this.nativeElement ? this.nativeElement.formatStringDate : undefined;
|
|
113
|
-
}
|
|
114
|
-
set formatStringDate(value) {
|
|
115
|
-
if (this.nativeElement) {
|
|
116
|
-
this.nativeElement.formatStringDate = value;
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
|
-
/** Sets or gets the format string of the editor of fields with type 'datetime'.
|
|
120
|
-
* Property type: string
|
|
121
|
-
*/
|
|
122
|
-
get formatStringDateTime() {
|
|
123
|
-
return this.nativeElement ? this.nativeElement.formatStringDateTime : undefined;
|
|
124
|
-
}
|
|
125
|
-
set formatStringDateTime(value) {
|
|
126
|
-
if (this.nativeElement) {
|
|
127
|
-
this.nativeElement.formatStringDateTime = value;
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
/** Sets hint in form of popup message.
|
|
131
|
-
* Property type: string
|
|
132
|
-
*/
|
|
133
|
-
get hint() {
|
|
134
|
-
return this.nativeElement ? this.nativeElement.hint : undefined;
|
|
135
|
-
}
|
|
136
|
-
set hint(value) {
|
|
137
|
-
if (this.nativeElement) {
|
|
138
|
-
this.nativeElement.hint = value;
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
/** Defines icon's representatino as characters.
|
|
142
|
-
* Property type: FilterBuilderIcons
|
|
143
|
-
*/
|
|
144
|
-
get icons() {
|
|
145
|
-
return this.nativeElement ? this.nativeElement.icons : undefined;
|
|
146
|
-
}
|
|
147
|
-
set icons(value) {
|
|
148
|
-
if (this.nativeElement) {
|
|
149
|
-
this.nativeElement.icons = value;
|
|
150
|
-
}
|
|
151
|
-
}
|
|
152
|
-
/** Sets or gets the language. Used in conjunction with the property messages.
|
|
153
|
-
* Property type: string
|
|
154
|
-
*/
|
|
155
|
-
get locale() {
|
|
156
|
-
return this.nativeElement ? this.nativeElement.locale : undefined;
|
|
157
|
-
}
|
|
158
|
-
set locale(value) {
|
|
159
|
-
if (this.nativeElement) {
|
|
160
|
-
this.nativeElement.locale = value;
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
/** Callback, related to localization module.
|
|
164
|
-
* Property type: any
|
|
165
|
-
*/
|
|
166
|
-
get localizeFormatFunction() {
|
|
167
|
-
return this.nativeElement ? this.nativeElement.localizeFormatFunction : undefined;
|
|
168
|
-
}
|
|
169
|
-
set localizeFormatFunction(value) {
|
|
170
|
-
if (this.nativeElement) {
|
|
171
|
-
this.nativeElement.localizeFormatFunction = value;
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
/** Defines maximum number of allowed conditions in the element.
|
|
175
|
-
* Property type: number | null
|
|
176
|
-
*/
|
|
177
|
-
get maxConditions() {
|
|
178
|
-
return this.nativeElement ? this.nativeElement.maxConditions : undefined;
|
|
179
|
-
}
|
|
180
|
-
set maxConditions(value) {
|
|
181
|
-
if (this.nativeElement) {
|
|
182
|
-
this.nativeElement.maxConditions = value;
|
|
183
|
-
}
|
|
184
|
-
}
|
|
185
|
-
/** Defines maximum number of allowed conditions in group.
|
|
186
|
-
* Property type: number | null
|
|
187
|
-
*/
|
|
188
|
-
get maxConditionsPerGroup() {
|
|
189
|
-
return this.nativeElement ? this.nativeElement.maxConditionsPerGroup : undefined;
|
|
190
|
-
}
|
|
191
|
-
set maxConditionsPerGroup(value) {
|
|
192
|
-
if (this.nativeElement) {
|
|
193
|
-
this.nativeElement.maxConditionsPerGroup = value;
|
|
194
|
-
}
|
|
195
|
-
}
|
|
196
|
-
/** Defines maximum level of grouping in the FilterBuilder.
|
|
197
|
-
* Property type: number | null
|
|
198
|
-
*/
|
|
199
|
-
get maxLevel() {
|
|
200
|
-
return this.nativeElement ? this.nativeElement.maxLevel : undefined;
|
|
201
|
-
}
|
|
202
|
-
set maxLevel(value) {
|
|
203
|
-
if (this.nativeElement) {
|
|
204
|
-
this.nativeElement.maxLevel = value;
|
|
205
|
-
}
|
|
206
|
-
}
|
|
207
|
-
/** Defines field names of the filtered element.
|
|
208
|
-
* Property type: any
|
|
209
|
-
*/
|
|
210
|
-
get messages() {
|
|
211
|
-
return this.nativeElement ? this.nativeElement.messages : undefined;
|
|
212
|
-
}
|
|
213
|
-
set messages(value) {
|
|
214
|
-
if (this.nativeElement) {
|
|
215
|
-
this.nativeElement.messages = value;
|
|
216
|
-
}
|
|
217
|
-
}
|
|
218
|
-
/** If the element is readonly, users cannot interact with it.
|
|
219
|
-
* Property type: boolean
|
|
220
|
-
*/
|
|
221
|
-
get readonly() {
|
|
222
|
-
return this.nativeElement ? this.nativeElement.readonly : undefined;
|
|
223
|
-
}
|
|
224
|
-
set readonly(value) {
|
|
225
|
-
if (this.nativeElement) {
|
|
226
|
-
this.nativeElement.readonly = value;
|
|
227
|
-
}
|
|
228
|
-
}
|
|
229
|
-
/** In restrictedMode set to true, adding of new groups and groups editing by user interaction are denied.
|
|
230
|
-
* Property type: boolean
|
|
231
|
-
*/
|
|
232
|
-
get restrictedMode() {
|
|
233
|
-
return this.nativeElement ? this.nativeElement.restrictedMode : undefined;
|
|
234
|
-
}
|
|
235
|
-
set restrictedMode(value) {
|
|
236
|
-
if (this.nativeElement) {
|
|
237
|
-
this.nativeElement.restrictedMode = value;
|
|
238
|
-
}
|
|
239
|
-
}
|
|
240
|
-
/** Enables or disables the display of the icons.
|
|
241
|
-
* Property type: boolean
|
|
242
|
-
*/
|
|
243
|
-
get showIcons() {
|
|
244
|
-
return this.nativeElement ? this.nativeElement.showIcons : undefined;
|
|
245
|
-
}
|
|
246
|
-
set showIcons(value) {
|
|
247
|
-
if (this.nativeElement) {
|
|
248
|
-
this.nativeElement.showIcons = value;
|
|
249
|
-
}
|
|
250
|
-
}
|
|
251
|
-
/** Determines the theme. Theme defines the look of the element
|
|
252
|
-
* Property type: string
|
|
253
|
-
*/
|
|
254
|
-
get theme() {
|
|
255
|
-
return this.nativeElement ? this.nativeElement.theme : undefined;
|
|
256
|
-
}
|
|
257
|
-
set theme(value) {
|
|
258
|
-
if (this.nativeElement) {
|
|
259
|
-
this.nativeElement.theme = value;
|
|
260
|
-
}
|
|
261
|
-
}
|
|
262
|
-
/** If is set to true, the element cannot be focused.
|
|
263
|
-
* Property type: boolean
|
|
264
|
-
*/
|
|
265
|
-
get unfocusable() {
|
|
266
|
-
return this.nativeElement ? this.nativeElement.unfocusable : undefined;
|
|
267
|
-
}
|
|
268
|
-
set unfocusable(value) {
|
|
269
|
-
if (this.nativeElement) {
|
|
270
|
-
this.nativeElement.unfocusable = value;
|
|
271
|
-
}
|
|
272
|
-
}
|
|
273
|
-
/** The value is represented by multidimensional array. The array contains group operators and conditions. Each group can contain nested structures at multiple levels.
|
|
274
|
-
* Property type: string[]
|
|
275
|
-
*/
|
|
276
|
-
get value() {
|
|
277
|
-
return this.nativeElement ? this.nativeElement.value : undefined;
|
|
278
|
-
}
|
|
279
|
-
set value(value) {
|
|
280
|
-
if (this.nativeElement) {
|
|
281
|
-
this.nativeElement.value = value;
|
|
282
|
-
}
|
|
283
|
-
}
|
|
284
|
-
/** Callback used to format the content of the value fields.
|
|
285
|
-
* Property type: any
|
|
286
|
-
*/
|
|
287
|
-
get valueFormatFunction() {
|
|
288
|
-
return this.nativeElement ? this.nativeElement.valueFormatFunction : undefined;
|
|
289
|
-
}
|
|
290
|
-
set valueFormatFunction(value) {
|
|
291
|
-
if (this.nativeElement) {
|
|
292
|
-
this.nativeElement.valueFormatFunction = value;
|
|
293
|
-
}
|
|
294
|
-
}
|
|
295
|
-
/** Sets the placeholder text used in the condition's value box in case the value is not set.
|
|
296
|
-
* Property type: string
|
|
297
|
-
*/
|
|
298
|
-
get valuePlaceholder() {
|
|
299
|
-
return this.nativeElement ? this.nativeElement.valuePlaceholder : undefined;
|
|
300
|
-
}
|
|
301
|
-
set valuePlaceholder(value) {
|
|
302
|
-
if (this.nativeElement) {
|
|
303
|
-
this.nativeElement.valuePlaceholder = value;
|
|
304
|
-
}
|
|
305
|
-
}
|
|
306
|
-
// Gets the properties of the React component.
|
|
307
|
-
get properties() {
|
|
308
|
-
return ["animation", "customOperations", "disableContextMenu", "disabled", "fields", "formatStringDate", "formatStringDateTime", "hint", "icons", "locale", "localizeFormatFunction", "maxConditions", "maxConditionsPerGroup", "maxLevel", "messages", "readonly", "restrictedMode", "showIcons", "theme", "unfocusable", "value", "valueFormatFunction", "valuePlaceholder"];
|
|
309
|
-
}
|
|
310
|
-
// Gets the events of the React component.
|
|
311
|
-
get eventListeners() {
|
|
312
|
-
return ["onChange", "onEditorClose", "onEditorClosing", "onEditorOpen", "onEditorOpening", "onItemClick", "onOpen", "onOpening", "onClose", "onClosing", "onCreate", "onReady"];
|
|
313
|
-
}
|
|
314
|
-
/** Adds new condition in particular group.
|
|
315
|
-
* @param {string | HTMLElement} parentGroup. A string, representing the id of the item or an HTML Element referencing this condition.
|
|
316
|
-
* @param {any[]} data. An array, representing condition. Condition's element's role is related to their position in the condition's array. At index 0 - field name, index 1 - condition's opertor, index 2 - condition's value.
|
|
317
|
-
*/
|
|
318
|
-
addCondition(parentGroup, data) {
|
|
319
|
-
if (this.nativeElement.isRendered) {
|
|
320
|
-
this.nativeElement.addCondition(parentGroup, data);
|
|
321
|
-
}
|
|
322
|
-
else {
|
|
323
|
-
this.nativeElement.whenRendered(() => {
|
|
324
|
-
this.nativeElement.addCondition(parentGroup, data);
|
|
325
|
-
});
|
|
326
|
-
}
|
|
327
|
-
}
|
|
328
|
-
/** Adds new group in particular parent group.
|
|
329
|
-
* @param {string | HTMLElement} parentGroup. A string, representing the id of the item or an HTML Element referencing this group.
|
|
330
|
-
* @param {string} data. A string, representing the group operator.
|
|
331
|
-
*/
|
|
332
|
-
addGroup(parentGroup, data) {
|
|
333
|
-
if (this.nativeElement.isRendered) {
|
|
334
|
-
this.nativeElement.addGroup(parentGroup, data);
|
|
335
|
-
}
|
|
336
|
-
else {
|
|
337
|
-
this.nativeElement.whenRendered(() => {
|
|
338
|
-
this.nativeElement.addGroup(parentGroup, data);
|
|
339
|
-
});
|
|
340
|
-
}
|
|
341
|
-
}
|
|
342
|
-
/** Removes condition.
|
|
343
|
-
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing this condition.
|
|
344
|
-
*/
|
|
345
|
-
removeCondition(item) {
|
|
346
|
-
if (this.nativeElement.isRendered) {
|
|
347
|
-
this.nativeElement.removeCondition(item);
|
|
348
|
-
}
|
|
349
|
-
else {
|
|
350
|
-
this.nativeElement.whenRendered(() => {
|
|
351
|
-
this.nativeElement.removeCondition(item);
|
|
352
|
-
});
|
|
353
|
-
}
|
|
354
|
-
}
|
|
355
|
-
/** Deletes group and all of it's children
|
|
356
|
-
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing this group.
|
|
357
|
-
*/
|
|
358
|
-
removeGroup(item) {
|
|
359
|
-
if (this.nativeElement.isRendered) {
|
|
360
|
-
this.nativeElement.removeGroup(item);
|
|
361
|
-
}
|
|
362
|
-
else {
|
|
363
|
-
this.nativeElement.whenRendered(() => {
|
|
364
|
-
this.nativeElement.removeGroup(item);
|
|
365
|
-
});
|
|
366
|
-
}
|
|
367
|
-
}
|
|
368
|
-
/** Returns a string representation of the filter builder's value.
|
|
369
|
-
* @param {boolean} useLabels?. Controls the way of string representation. In mode without labels the value object is stringified only.
|
|
370
|
-
* @returns {string}
|
|
371
|
-
*/
|
|
372
|
-
toString(useLabels) {
|
|
373
|
-
return __awaiter(this, void 0, void 0, function* () {
|
|
374
|
-
const getResultOnRender = () => {
|
|
375
|
-
return new Promise(resolve => {
|
|
376
|
-
this.nativeElement.whenRendered(() => {
|
|
377
|
-
const result = this.nativeElement.toString(useLabels);
|
|
378
|
-
resolve(result);
|
|
379
|
-
});
|
|
380
|
-
});
|
|
381
|
-
};
|
|
382
|
-
const result = yield getResultOnRender();
|
|
383
|
-
return result;
|
|
384
|
-
});
|
|
385
|
-
}
|
|
386
|
-
/** Updates condition.
|
|
387
|
-
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing targeted condition.
|
|
388
|
-
* @param {any[]} data. An array, representing condition. Condition's element's role is related to their position in the condition's array. At index 0 - field name, index 1 - condition's opertor, index 2 - condition's value.
|
|
389
|
-
*/
|
|
390
|
-
updateCondition(item, data) {
|
|
391
|
-
if (this.nativeElement.isRendered) {
|
|
392
|
-
this.nativeElement.updateCondition(item, data);
|
|
393
|
-
}
|
|
394
|
-
else {
|
|
395
|
-
this.nativeElement.whenRendered(() => {
|
|
396
|
-
this.nativeElement.updateCondition(item, data);
|
|
397
|
-
});
|
|
398
|
-
}
|
|
399
|
-
}
|
|
400
|
-
/** Updates group
|
|
401
|
-
* @param {string | HTMLElement} item. A string, representing the id of the item or an HTML Element referencing this group.
|
|
402
|
-
* @param {string} data. A string, representing the group operator.
|
|
403
|
-
*/
|
|
404
|
-
updateGroup(item, data) {
|
|
405
|
-
if (this.nativeElement.isRendered) {
|
|
406
|
-
this.nativeElement.updateGroup(item, data);
|
|
407
|
-
}
|
|
408
|
-
else {
|
|
409
|
-
this.nativeElement.whenRendered(() => {
|
|
410
|
-
this.nativeElement.updateGroup(item, data);
|
|
411
|
-
});
|
|
412
|
-
}
|
|
413
|
-
}
|
|
414
|
-
componentDidRender(initialize) {
|
|
415
|
-
const that = this;
|
|
416
|
-
const props = {};
|
|
417
|
-
const events = {};
|
|
418
|
-
let styles = null;
|
|
419
|
-
for (let prop in that.props) {
|
|
420
|
-
if (prop === 'children') {
|
|
421
|
-
continue;
|
|
422
|
-
}
|
|
423
|
-
if (prop === 'style') {
|
|
424
|
-
styles = that.props[prop];
|
|
425
|
-
continue;
|
|
426
|
-
}
|
|
427
|
-
if (prop.startsWith('on') && that.properties.indexOf(prop) === -1) {
|
|
428
|
-
events[prop] = that.props[prop];
|
|
429
|
-
continue;
|
|
430
|
-
}
|
|
431
|
-
props[prop] = that.props[prop];
|
|
432
|
-
}
|
|
433
|
-
if (initialize) {
|
|
434
|
-
that.nativeElement = this.componentRef.current;
|
|
435
|
-
}
|
|
436
|
-
for (let prop in props) {
|
|
437
|
-
if (prop === 'class' || prop === 'className') {
|
|
438
|
-
const classNames = props[prop].trim().split(' ');
|
|
439
|
-
for (let className in classNames) {
|
|
440
|
-
if (!that.nativeElement.classList.contains(classNames[className]) && classNames[className] !== "") {
|
|
441
|
-
that.nativeElement.classList.add(classNames[className]);
|
|
442
|
-
}
|
|
443
|
-
}
|
|
444
|
-
continue;
|
|
445
|
-
}
|
|
446
|
-
if (props[prop] !== that.nativeElement[prop]) {
|
|
447
|
-
const normalizeProp = (str) => {
|
|
448
|
-
return str.replace(/-([a-z])/g, function (g) {
|
|
449
|
-
return g[1].toUpperCase();
|
|
450
|
-
});
|
|
451
|
-
};
|
|
452
|
-
if (prop === 'hover' || prop === 'active' || prop === 'focus' || prop === 'selected') {
|
|
453
|
-
that.nativeElement.setAttribute(prop, '');
|
|
454
|
-
}
|
|
455
|
-
const normalizedProp = normalizeProp(prop);
|
|
456
|
-
that.nativeElement[normalizedProp] = props[prop];
|
|
457
|
-
}
|
|
458
|
-
}
|
|
459
|
-
for (let eventName in events) {
|
|
460
|
-
that[eventName] = events[eventName];
|
|
461
|
-
that.nativeElement[eventName.toLowerCase()] = events[eventName];
|
|
462
|
-
}
|
|
463
|
-
if (initialize) {
|
|
464
|
-
Smart.Render();
|
|
465
|
-
if (that.onCreate) {
|
|
466
|
-
that.onCreate();
|
|
467
|
-
}
|
|
468
|
-
that.nativeElement.whenRendered(() => {
|
|
469
|
-
if (that.onReady) {
|
|
470
|
-
that.onReady();
|
|
471
|
-
}
|
|
472
|
-
});
|
|
473
|
-
}
|
|
474
|
-
// setup styles.
|
|
475
|
-
if (styles) {
|
|
476
|
-
for (let styleName in styles) {
|
|
477
|
-
that.nativeElement.style[styleName] = styles[styleName];
|
|
478
|
-
}
|
|
479
|
-
}
|
|
480
|
-
}
|
|
481
|
-
componentDidMount() {
|
|
482
|
-
this.componentDidRender(true);
|
|
483
|
-
}
|
|
484
|
-
componentDidUpdate() {
|
|
485
|
-
this.componentDidRender(false);
|
|
486
|
-
}
|
|
487
|
-
componentWillUnmount() {
|
|
488
|
-
const that = this;
|
|
489
|
-
if (!that.nativeElement) {
|
|
490
|
-
return;
|
|
491
|
-
}
|
|
492
|
-
that.nativeElement.whenRenderedCallbacks = [];
|
|
493
|
-
for (let i = 0; i < that.eventListeners.length; i++) {
|
|
494
|
-
const eventName = that.eventListeners[i];
|
|
495
|
-
that.nativeElement.removeEventListener(eventName.substring(2).toLowerCase(), that[eventName]);
|
|
496
|
-
}
|
|
497
|
-
}
|
|
498
|
-
render() {
|
|
499
|
-
return (React.createElement("smart-filter-builder", { ref: this.componentRef }, this.props.children));
|
|
500
|
-
}
|
|
501
|
-
}
|
|
468
|
+
exports.Smart = Smart;
|
|
469
|
+
exports.FilterBuilder = FilterBuilder;
|
|
470
|
+
exports.default = FilterBuilder;
|
|
502
471
|
|
|
503
|
-
|
|
504
|
-
exports.FilterBuilder = FilterBuilder;
|
|
505
|
-
exports.default = FilterBuilder;
|
|
506
|
-
|
|
507
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
472
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
508
473
|
|
|
509
474
|
})));
|