@vitrosoftware/common-ui-ts 1.1.51 → 1.1.52
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/css/std/controls/checkbox/checkbox.css +2 -2
- package/css/std/controls/search/checkbox-list.css +6 -0
- package/css/std/controls/search/input.css +55 -18
- package/css/std/controls/search/search.css +8 -1
- package/css/std/controls/tooltip/tooltip.css +3 -0
- package/dist/constants/Control.d.ts +10 -0
- package/dist/controls/Criterion/Condition.d.ts +6 -0
- package/dist/controls/Criterion/ConditionSelect.d.ts +3 -6
- package/dist/controls/Criterion/Criterion.d.ts +6 -10
- package/dist/controls/Criterion/Operator.d.ts +4 -0
- package/dist/controls/DatePicker/DatePicker.d.ts +2 -0
- package/dist/controls/FieldIterator/FieldIterator.d.ts +1 -1
- package/dist/controls/LookupPicker/LookupPicker.d.ts +1 -0
- package/dist/controls/Search/Filter.d.ts +6 -10
- package/dist/controls/Search/Input.d.ts +1 -1
- package/dist/controls/Search/Search.d.ts +6 -10
- package/dist/controls/TimePicker/TimePicker.d.ts +2 -0
- package/dist/controls/UserLookupPicker/UserLookupPicker.d.ts +1 -0
- package/dist/index.css +75 -23
- package/dist/index.d.ts +2 -0
- package/dist/index.js +197 -73
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/dist/EventConstants.d.ts +0 -4
- package/dist/index.modern.js +0 -64186
- package/dist/index.modern.js.map +0 -1
- package/dist/index.test.d.ts +0 -1
package/dist/index.js
CHANGED
|
@@ -61304,7 +61304,7 @@ var DatePicker = React.forwardRef(function (props, ref) {
|
|
|
61304
61304
|
return props.isWorkDay(date);
|
|
61305
61305
|
},
|
|
61306
61306
|
open: function open(e) {
|
|
61307
|
-
onFocus();
|
|
61307
|
+
onFocus(e);
|
|
61308
61308
|
if (props.onOpen) {
|
|
61309
61309
|
props.onOpen(e, $$3(container.current));
|
|
61310
61310
|
}
|
|
@@ -61315,7 +61315,7 @@ var DatePicker = React.forwardRef(function (props, ref) {
|
|
|
61315
61315
|
}
|
|
61316
61316
|
},
|
|
61317
61317
|
close: function close(e) {
|
|
61318
|
-
onBlur();
|
|
61318
|
+
onBlur(e);
|
|
61319
61319
|
if (props.onClose) {
|
|
61320
61320
|
props.onClose(e.sender.value(), props.name);
|
|
61321
61321
|
}
|
|
@@ -61370,7 +61370,7 @@ var DatePicker = React.forwardRef(function (props, ref) {
|
|
|
61370
61370
|
React.useEffect(function () {
|
|
61371
61371
|
$$3(inputRef.current).data(componentName).setOptions({
|
|
61372
61372
|
open: function open(e) {
|
|
61373
|
-
onFocus();
|
|
61373
|
+
onFocus(e);
|
|
61374
61374
|
if (props.onOpen) {
|
|
61375
61375
|
props.onOpen(e, $$3(container.current));
|
|
61376
61376
|
}
|
|
@@ -61380,7 +61380,7 @@ var DatePicker = React.forwardRef(function (props, ref) {
|
|
|
61380
61380
|
React.useEffect(function () {
|
|
61381
61381
|
$$3(inputRef.current).data(componentName).setOptions({
|
|
61382
61382
|
close: function close(e) {
|
|
61383
|
-
onBlur();
|
|
61383
|
+
onBlur(e);
|
|
61384
61384
|
if (props.onClose) {
|
|
61385
61385
|
props.onClose(e.sender.value(), props.name);
|
|
61386
61386
|
}
|
|
@@ -61405,11 +61405,17 @@ var DatePicker = React.forwardRef(function (props, ref) {
|
|
|
61405
61405
|
}
|
|
61406
61406
|
};
|
|
61407
61407
|
});
|
|
61408
|
-
var onFocus = function onFocus() {
|
|
61408
|
+
var onFocus = function onFocus(e) {
|
|
61409
61409
|
setState(styles$m['vitro-focus']);
|
|
61410
|
+
if (props.onFocus) {
|
|
61411
|
+
props.onFocus(e);
|
|
61412
|
+
}
|
|
61410
61413
|
};
|
|
61411
|
-
var onBlur = function onBlur() {
|
|
61414
|
+
var onBlur = function onBlur(e) {
|
|
61412
61415
|
setState(props.errorMessage ? styles$m['vitro-error'] : styles$m[CTRL.EMPTY]);
|
|
61416
|
+
if (props.onBlur) {
|
|
61417
|
+
props.onBlur(e);
|
|
61418
|
+
}
|
|
61413
61419
|
};
|
|
61414
61420
|
var copyValue = function copyValue() {
|
|
61415
61421
|
navigator.clipboard.writeText("" + props.value);
|
|
@@ -61488,13 +61494,13 @@ var TimePicker = React.forwardRef(function (props, ref) {
|
|
|
61488
61494
|
}
|
|
61489
61495
|
},
|
|
61490
61496
|
open: function open(e) {
|
|
61491
|
-
onFocus();
|
|
61497
|
+
onFocus(e);
|
|
61492
61498
|
if (props.onOpen) {
|
|
61493
61499
|
props.onOpen(e, $$4(container.current));
|
|
61494
61500
|
}
|
|
61495
61501
|
},
|
|
61496
61502
|
close: function close(e) {
|
|
61497
|
-
onBlur();
|
|
61503
|
+
onBlur(e);
|
|
61498
61504
|
if (props.onClose) {
|
|
61499
61505
|
props.onClose(e, $$4(container.current));
|
|
61500
61506
|
}
|
|
@@ -61519,11 +61525,17 @@ var TimePicker = React.forwardRef(function (props, ref) {
|
|
|
61519
61525
|
}
|
|
61520
61526
|
};
|
|
61521
61527
|
});
|
|
61522
|
-
var onFocus = function onFocus() {
|
|
61528
|
+
var onFocus = function onFocus(e) {
|
|
61523
61529
|
setState(styles$n['vitro-focus']);
|
|
61530
|
+
if (props.onFocus) {
|
|
61531
|
+
props.onFocus(e);
|
|
61532
|
+
}
|
|
61524
61533
|
};
|
|
61525
|
-
var onBlur = function onBlur() {
|
|
61534
|
+
var onBlur = function onBlur(e) {
|
|
61526
61535
|
setState(props.errorMessage ? styles$n['vitro-error'] : styles$n[CTRL.EMPTY]);
|
|
61536
|
+
if (props.onBlur) {
|
|
61537
|
+
props.onBlur(e);
|
|
61538
|
+
}
|
|
61527
61539
|
};
|
|
61528
61540
|
var copyValue = function copyValue() {
|
|
61529
61541
|
navigator.clipboard.writeText("" + props.value);
|
|
@@ -61852,9 +61864,12 @@ var LookupPicker = React.forwardRef(function (props, ref) {
|
|
|
61852
61864
|
}
|
|
61853
61865
|
});
|
|
61854
61866
|
};
|
|
61855
|
-
var onFocus = function onFocus() {
|
|
61867
|
+
var onFocus = function onFocus(e) {
|
|
61856
61868
|
setState(styles$q['vitro-focus']);
|
|
61857
61869
|
setValueListVisible(true);
|
|
61870
|
+
if (props.onFocus) {
|
|
61871
|
+
props.onFocus(e);
|
|
61872
|
+
}
|
|
61858
61873
|
};
|
|
61859
61874
|
var onCollapseButtonClick = function onCollapseButtonClick(valueListVisible) {
|
|
61860
61875
|
setValueListVisible(!valueListVisible);
|
|
@@ -64296,6 +64311,16 @@ var ActivityMessage = function ActivityMessage(props) {
|
|
|
64296
64311
|
}));
|
|
64297
64312
|
};
|
|
64298
64313
|
|
|
64314
|
+
var CONTROL = function CONTROL() {};
|
|
64315
|
+
CONTROL.LOOKUP_PICKER = 'LookupPicker';
|
|
64316
|
+
CONTROL.DATE_PICKER = 'DatePicker';
|
|
64317
|
+
CONTROL.CHECKBOX = 'Checkbox';
|
|
64318
|
+
CONTROL.IMAGE_PICKER = 'ImagePicker';
|
|
64319
|
+
CONTROL.AVATAR = 'Avatar';
|
|
64320
|
+
CONTROL.INPUT = 'Input';
|
|
64321
|
+
CONTROL.PASSWORD = 'Password';
|
|
64322
|
+
CONTROL.TIME_PICKER = 'TimePicker';
|
|
64323
|
+
|
|
64299
64324
|
var LOCALE$6;
|
|
64300
64325
|
(function (LOCALE) {
|
|
64301
64326
|
LOCALE["PLACEHOLDER"] = "app.common.messageInput.placeholder";
|
|
@@ -64465,7 +64490,7 @@ var ImagePicker = function ImagePicker(props) {
|
|
|
64465
64490
|
var styles$L = {"vitro-criterion-container":"_criterion_vitro-criterion-container_2cYcSkL","vitro-block":"_criterion_vitro-block_3E9-RXM","vitro-control":"_criterion_vitro-control_2JLaybj","vitro-label":"_criterion_vitro-label_3F6a8dj","vitro-operator-select-container":"_criterion_vitro-operator-select-container_3OkjzXG","vitro-operator-select":"_criterion_vitro-operator-select_1guNlk9","vitro-operator-list":"_criterion_vitro-operator-list_3A2VZsd","vitro-button-cancel":"_criterion_vitro-button-cancel_2C2G0sL","vitro-focus":"_criterion_vitro-focus_3FNLsoN","vitro-error":"_criterion_vitro-error_3pvFrlW","vitro-condition-select":"_criterion_vitro-condition-select_1hTBBg-","vitro-icon":"_criterion_vitro-icon_1DmS0jh","vitro-condition-list":"_criterion_vitro-condition-list_10UIxJI"};
|
|
64466
64491
|
|
|
64467
64492
|
var ConditionSelect = function ConditionSelect(props) {
|
|
64468
|
-
var _useState = React.useState(props.itemList[0]),
|
|
64493
|
+
var _useState = React.useState(props.defaultValue || props.itemList[0]),
|
|
64469
64494
|
condition = _useState[0],
|
|
64470
64495
|
setCondition = _useState[1];
|
|
64471
64496
|
var _useState2 = React.useState(false),
|
|
@@ -64527,7 +64552,7 @@ var ConditionSelect = function ConditionSelect(props) {
|
|
|
64527
64552
|
};
|
|
64528
64553
|
|
|
64529
64554
|
var Criterion = function Criterion(props) {
|
|
64530
|
-
var _useState = React.useState(props.operatorList
|
|
64555
|
+
var _useState = React.useState(props.operatorList[0]),
|
|
64531
64556
|
operator = _useState[0],
|
|
64532
64557
|
setOperator = _useState[1];
|
|
64533
64558
|
var _useState2 = React.useState(false),
|
|
@@ -64539,19 +64564,30 @@ var Criterion = function Criterion(props) {
|
|
|
64539
64564
|
var _useState4 = React.useState(CTRL.EMPTY),
|
|
64540
64565
|
state = _useState4[0],
|
|
64541
64566
|
setState = _useState4[1];
|
|
64567
|
+
var componentProps = props.content.props;
|
|
64568
|
+
var defaultOperator = (componentProps.value ? props.operatorList.find(function (x) {
|
|
64569
|
+
return x.type === componentProps.value.operator;
|
|
64570
|
+
}) : props.operatorList.find(function (x) {
|
|
64571
|
+
return x.type === props.defaultOperator;
|
|
64572
|
+
})) || props.operatorList[0];
|
|
64573
|
+
var defaultCondition = (componentProps.value ? props.conditionList.find(function (x) {
|
|
64574
|
+
return x.type === componentProps.value.condition;
|
|
64575
|
+
}) : props.conditionList.find(function (x) {
|
|
64576
|
+
return x.type === props.defaultCondition;
|
|
64577
|
+
})) || props.conditionList[0];
|
|
64542
64578
|
var value = React.useMemo(function () {
|
|
64543
|
-
var _props$operatorList$, _props$conditionList$;
|
|
64544
64579
|
return {
|
|
64545
|
-
internalName:
|
|
64546
|
-
operator:
|
|
64547
|
-
valueList: [],
|
|
64548
|
-
condition:
|
|
64580
|
+
internalName: componentProps.name,
|
|
64581
|
+
operator: defaultOperator.type,
|
|
64582
|
+
valueList: componentProps.value ? componentProps.value.valueList : [],
|
|
64583
|
+
condition: defaultCondition.type
|
|
64549
64584
|
};
|
|
64550
64585
|
}, []);
|
|
64551
64586
|
var selectRef = React.useRef(null);
|
|
64552
64587
|
var labelRef = React.useRef(null);
|
|
64553
64588
|
React.useEffect(function () {
|
|
64554
64589
|
window.addEventListener(exports.EVENT.CLICK, onBlurSelect);
|
|
64590
|
+
setOperator(defaultOperator);
|
|
64555
64591
|
return function () {
|
|
64556
64592
|
window.removeEventListener(exports.EVENT.CLICK, onBlurSelect);
|
|
64557
64593
|
};
|
|
@@ -64581,26 +64617,23 @@ var Criterion = function Criterion(props) {
|
|
|
64581
64617
|
};
|
|
64582
64618
|
var onFocus = function onFocus(e) {
|
|
64583
64619
|
setState(styles$L['vitro-focus']);
|
|
64584
|
-
if (
|
|
64585
|
-
|
|
64620
|
+
if (componentProps.onFocus) {
|
|
64621
|
+
componentProps.onFocus(e);
|
|
64586
64622
|
}
|
|
64587
64623
|
};
|
|
64588
64624
|
var onBlur = function onBlur(e) {
|
|
64589
|
-
setState(
|
|
64590
|
-
if (
|
|
64591
|
-
|
|
64625
|
+
setState(componentProps.errorMessage ? styles$L['vitro-error'] : CTRL.EMPTY);
|
|
64626
|
+
if (componentProps.onBlur) {
|
|
64627
|
+
componentProps.onBlur(e);
|
|
64592
64628
|
}
|
|
64593
64629
|
};
|
|
64594
64630
|
var onChange = function onChange(val) {
|
|
64595
64631
|
if (props.onChange) {
|
|
64596
|
-
props.onChange(val,
|
|
64632
|
+
props.onChange(val, componentProps.name);
|
|
64597
64633
|
}
|
|
64598
64634
|
};
|
|
64599
64635
|
var onControlChange = function onControlChange(val, name) {
|
|
64600
|
-
|
|
64601
|
-
value.valueList = valueArray.map(function (v) {
|
|
64602
|
-
return v && v.id ? v.id : v;
|
|
64603
|
-
});
|
|
64636
|
+
value.valueList = Array.isArray(val) ? val : [val];
|
|
64604
64637
|
onChange(value);
|
|
64605
64638
|
};
|
|
64606
64639
|
return React__default.createElement("div", {
|
|
@@ -64627,8 +64660,9 @@ var Criterion = function Criterion(props) {
|
|
|
64627
64660
|
}, React__default.createElement("span", null, props.label)), React__default.createElement(ConditionSelect, {
|
|
64628
64661
|
itemList: props.conditionList,
|
|
64629
64662
|
onSelect: onConditionClick,
|
|
64630
|
-
translateX: translate
|
|
64631
|
-
|
|
64663
|
+
translateX: translate,
|
|
64664
|
+
defaultValue: defaultCondition
|
|
64665
|
+
}), React__default.createElement(props.content.component, _extends({}, componentProps, {
|
|
64632
64666
|
className: styles$L['vitro-control'],
|
|
64633
64667
|
onBlur: onBlur,
|
|
64634
64668
|
onFocus: onFocus,
|
|
@@ -64639,7 +64673,7 @@ var Criterion = function Criterion(props) {
|
|
|
64639
64673
|
isRequired: false
|
|
64640
64674
|
}))), React__default.createElement("button", {
|
|
64641
64675
|
onClick: function onClick() {
|
|
64642
|
-
return props.onDelete(
|
|
64676
|
+
return props.onDelete(componentProps.id);
|
|
64643
64677
|
},
|
|
64644
64678
|
className: styles$L['vitro-button-cancel']
|
|
64645
64679
|
}));
|
|
@@ -64651,20 +64685,39 @@ var LOCALE$8;
|
|
|
64651
64685
|
LOCALE["EMPTY_PLACEHOLDER"] = "app.common.search.checkboxList.emptyPlaceholder";
|
|
64652
64686
|
})(LOCALE$8 || (LOCALE$8 = {}));
|
|
64653
64687
|
|
|
64654
|
-
var styles$M = {"vitro-control":"_input_vitro-control__btu7j_","vitro-active":"_input_vitro-active_jxhGdE8","vitro-focus":"_input_vitro-focus_3tuxmPs","vitro-search-value-list":"_input_vitro-search-value-list_2I_KVY5","vitro-button-cancel":"_input_vitro-button-cancel_YqNZPj-","vitro-button-settings":"_input_vitro-button-settings_1w9FwYt","vitro-search-value":"_input_vitro-search-value_1ZbcNTJ"};
|
|
64688
|
+
var styles$M = {"vitro-control":"_input_vitro-control__btu7j_","vitro-active":"_input_vitro-active_jxhGdE8","vitro-focus":"_input_vitro-focus_3tuxmPs","vitro-button-search":"_input_vitro-button-search_15PeWCS","vitro-search-value-list":"_input_vitro-search-value-list_2I_KVY5","vitro-button-cancel":"_input_vitro-button-cancel_YqNZPj-","vitro-button-settings":"_input_vitro-button-settings_1w9FwYt","vitro-search-value":"_input_vitro-search-value_1ZbcNTJ"};
|
|
64655
64689
|
|
|
64690
|
+
var NEW_LINE$1 = '\n';
|
|
64656
64691
|
var Input$1 = function Input(props) {
|
|
64657
|
-
var _useState = React.useState(
|
|
64658
|
-
|
|
64659
|
-
|
|
64660
|
-
var _useState2 = React.useState(
|
|
64661
|
-
|
|
64662
|
-
|
|
64663
|
-
var _useState3 = React.useState(
|
|
64664
|
-
|
|
64665
|
-
|
|
64692
|
+
var _useState = React.useState(false),
|
|
64693
|
+
isMobileView = _useState[0],
|
|
64694
|
+
setIsMobileView = _useState[1];
|
|
64695
|
+
var _useState2 = React.useState(Boolean(props.isSettingsActive)),
|
|
64696
|
+
isToggled = _useState2[0],
|
|
64697
|
+
setIsToggled = _useState2[1];
|
|
64698
|
+
var _useState3 = React.useState(false),
|
|
64699
|
+
isActive = _useState3[0],
|
|
64700
|
+
setIsActive = _useState3[1];
|
|
64701
|
+
var _useState4 = React.useState(CTRL.EMPTY),
|
|
64702
|
+
state = _useState4[0],
|
|
64703
|
+
setState = _useState4[1];
|
|
64666
64704
|
var localeService = inversifyReact.useInjection(SERVICE.LOCALE);
|
|
64667
64705
|
var inputRef = React.useRef(null);
|
|
64706
|
+
React.useEffect(function () {
|
|
64707
|
+
window.addEventListener(exports.EVENT.RESIZE, handleResize);
|
|
64708
|
+
handleResize();
|
|
64709
|
+
return function () {
|
|
64710
|
+
window.removeEventListener(exports.EVENT.RESIZE, handleResize);
|
|
64711
|
+
};
|
|
64712
|
+
}, []);
|
|
64713
|
+
React.useEffect(function () {
|
|
64714
|
+
handleResize();
|
|
64715
|
+
}, [window.innerWidth]);
|
|
64716
|
+
React.useEffect(function () {
|
|
64717
|
+
if (isMobileView && props.valueList && props.valueList.length) {
|
|
64718
|
+
setIsToggled(true);
|
|
64719
|
+
}
|
|
64720
|
+
}, [isMobileView, props.valueList]);
|
|
64668
64721
|
React.useEffect(function () {
|
|
64669
64722
|
var _props$valueList;
|
|
64670
64723
|
if (state || props.textValue || (_props$valueList = props.valueList) !== null && _props$valueList !== void 0 && _props$valueList.length) {
|
|
@@ -64674,6 +64727,9 @@ var Input$1 = function Input(props) {
|
|
|
64674
64727
|
React.useEffect(function () {
|
|
64675
64728
|
setIsToggled(Boolean(props.isSettingsActive));
|
|
64676
64729
|
}, [props.isSettingsActive]);
|
|
64730
|
+
var handleResize = function handleResize() {
|
|
64731
|
+
window.innerWidth < 800 ? setIsMobileView(true) : setIsMobileView(false);
|
|
64732
|
+
};
|
|
64677
64733
|
var onSettingsClick = function onSettingsClick() {
|
|
64678
64734
|
setIsToggled(!isToggled);
|
|
64679
64735
|
if (props.onSettingsClick) {
|
|
@@ -64681,10 +64737,15 @@ var Input$1 = function Input(props) {
|
|
|
64681
64737
|
}
|
|
64682
64738
|
};
|
|
64683
64739
|
var onKeyDown = function onKeyDown(e) {
|
|
64684
|
-
|
|
64685
|
-
if (e.keyCode === 13 && value) {
|
|
64740
|
+
if (e.keyCode === 13) {
|
|
64686
64741
|
e.preventDefault();
|
|
64687
|
-
|
|
64742
|
+
onSubmit();
|
|
64743
|
+
}
|
|
64744
|
+
};
|
|
64745
|
+
var onSubmit = function onSubmit() {
|
|
64746
|
+
var value = inputRef.current && inputRef.current.value;
|
|
64747
|
+
if (value) {
|
|
64748
|
+
props.onSubmit();
|
|
64688
64749
|
inputRef.current.value = CTRL.EMPTY;
|
|
64689
64750
|
}
|
|
64690
64751
|
};
|
|
@@ -64700,6 +64761,10 @@ var Input$1 = function Input(props) {
|
|
|
64700
64761
|
props.onChange(e.target.value);
|
|
64701
64762
|
}
|
|
64702
64763
|
};
|
|
64764
|
+
var onBlur = function onBlur() {
|
|
64765
|
+
setState(CTRL.EMPTY);
|
|
64766
|
+
onSubmit();
|
|
64767
|
+
};
|
|
64703
64768
|
var getClassName = function getClassName() {
|
|
64704
64769
|
var classList = [styles$M['vitro-control'], props.className || CTRL.EMPTY, state];
|
|
64705
64770
|
if (isActive) {
|
|
@@ -64707,8 +64772,8 @@ var Input$1 = function Input(props) {
|
|
|
64707
64772
|
}
|
|
64708
64773
|
return classList.join(CTRL.SPACE);
|
|
64709
64774
|
};
|
|
64710
|
-
var
|
|
64711
|
-
|
|
64775
|
+
var getTextValue = function getTextValue(value) {
|
|
64776
|
+
var valueArray = value.valueList.map(function (x) {
|
|
64712
64777
|
if (typeof x === 'object') {
|
|
64713
64778
|
if (x instanceof Date) {
|
|
64714
64779
|
return x.toLocaleString().split(CTRL.COMMA)[0];
|
|
@@ -64718,20 +64783,48 @@ var Input$1 = function Input(props) {
|
|
|
64718
64783
|
return x;
|
|
64719
64784
|
}
|
|
64720
64785
|
});
|
|
64786
|
+
var text = [value.name, valueArray.join(CTRL.COMMA + CTRL.SPACE)].join(CTRL.COLON + CTRL.SPACE);
|
|
64787
|
+
return text;
|
|
64788
|
+
};
|
|
64789
|
+
var getTextValueList = function getTextValueList(valueList) {
|
|
64790
|
+
var list = valueList.map(function (x) {
|
|
64791
|
+
return getTextValue(x);
|
|
64792
|
+
});
|
|
64793
|
+
list.shift();
|
|
64794
|
+
return list.join(NEW_LINE$1);
|
|
64721
64795
|
};
|
|
64722
64796
|
var getSelectedValueList = function getSelectedValueList(valueList) {
|
|
64723
64797
|
var firstValue = valueList[0];
|
|
64724
64798
|
return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
|
|
64725
64799
|
className: styles$M['vitro-search-value']
|
|
64726
|
-
},
|
|
64800
|
+
}, getTextValue(firstValue), React__default.createElement("button", {
|
|
64801
|
+
onClick: onCancel,
|
|
64802
|
+
className: styles$M['vitro-button-cancel']
|
|
64803
|
+
})), valueList.length && valueList.length > 1 ? React__default.createElement(Tooltip$1, {
|
|
64804
|
+
text: getTextValueList(valueList),
|
|
64805
|
+
placement: PLACEMENT$1.BOTTOM
|
|
64806
|
+
}, React__default.createElement("div", {
|
|
64727
64807
|
className: styles$M['vitro-search-value']
|
|
64728
64808
|
}, localeService.create(LOCALE$8.INPUT_MORE, {
|
|
64729
64809
|
count: valueList.length - 1
|
|
64730
|
-
})
|
|
64810
|
+
}), React__default.createElement("button", {
|
|
64811
|
+
onClick: onCancel,
|
|
64812
|
+
className: styles$M['vitro-button-cancel']
|
|
64813
|
+
}))) : null);
|
|
64814
|
+
};
|
|
64815
|
+
var onSearchClick = function onSearchClick() {
|
|
64816
|
+
if (isMobileView) {
|
|
64817
|
+
onSettingsClick();
|
|
64818
|
+
} else {
|
|
64819
|
+
onSubmit();
|
|
64820
|
+
}
|
|
64731
64821
|
};
|
|
64732
64822
|
return React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
|
|
64733
64823
|
className: getClassName()
|
|
64734
|
-
}, React__default.createElement("
|
|
64824
|
+
}, React__default.createElement("button", {
|
|
64825
|
+
className: styles$M['vitro-button-search'] + (isToggled ? CTRL.SPACE + styles$M['vitro-active'] : CTRL.EMPTY),
|
|
64826
|
+
onClick: onSearchClick
|
|
64827
|
+
}), !isMobileView && React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
|
|
64735
64828
|
className: styles$M['vitro-search-value-list']
|
|
64736
64829
|
}, props.valueList && props.valueList.length ? getSelectedValueList(props.valueList) : React__default.createElement("input", {
|
|
64737
64830
|
type: 'text',
|
|
@@ -64741,9 +64834,7 @@ var Input$1 = function Input(props) {
|
|
|
64741
64834
|
onFocus: function onFocus() {
|
|
64742
64835
|
return setState(styles$M['vitro-focus']);
|
|
64743
64836
|
},
|
|
64744
|
-
onBlur:
|
|
64745
|
-
return setState(CTRL.EMPTY);
|
|
64746
|
-
},
|
|
64837
|
+
onBlur: onBlur,
|
|
64747
64838
|
placeholder: !isActive ? props.placeholder : CTRL.EMPTY
|
|
64748
64839
|
})), isActive && React__default.createElement(React__default.Fragment, null, props.isShowSettings && React__default.createElement("button", {
|
|
64749
64840
|
onClick: onSettingsClick,
|
|
@@ -64751,7 +64842,7 @@ var Input$1 = function Input(props) {
|
|
|
64751
64842
|
}), React__default.createElement("button", {
|
|
64752
64843
|
onClick: onCancel,
|
|
64753
64844
|
className: styles$M['vitro-button-cancel']
|
|
64754
|
-
}))));
|
|
64845
|
+
})))));
|
|
64755
64846
|
};
|
|
64756
64847
|
|
|
64757
64848
|
var FieldIterator = React.forwardRef(function (props, ref) {
|
|
@@ -64843,7 +64934,7 @@ var FieldIterator = React.forwardRef(function (props, ref) {
|
|
|
64843
64934
|
var getFirstActiveControl = function getFirstActiveControl() {
|
|
64844
64935
|
if (controlList && controlList.length) {
|
|
64845
64936
|
return controlList.find(function (x) {
|
|
64846
|
-
return !x.isReadOnly && !x.isDisabled;
|
|
64937
|
+
return !x.isReadOnly && !x.isDisabled && !x.value;
|
|
64847
64938
|
});
|
|
64848
64939
|
}
|
|
64849
64940
|
return null;
|
|
@@ -64923,11 +65014,12 @@ var FieldIterator = React.forwardRef(function (props, ref) {
|
|
|
64923
65014
|
});
|
|
64924
65015
|
});
|
|
64925
65016
|
};
|
|
64926
|
-
return React__default.createElement(React__default.Fragment, null, React__default.createElement(ScrollBar, null, controlList.map(function (control) {
|
|
65017
|
+
return React__default.createElement(React__default.Fragment, null, React__default.createElement(ScrollBar, null, controlList.map(function (control, index) {
|
|
64927
65018
|
var component = props.componentMap.find(function (x) {
|
|
64928
65019
|
return x.name === control.code;
|
|
64929
65020
|
});
|
|
64930
65021
|
if (component) {
|
|
65022
|
+
control.index = index;
|
|
64931
65023
|
return React__default.createElement("div", {
|
|
64932
65024
|
className: control.isRow ? 'vitro-inline' : 'vitro-block'
|
|
64933
65025
|
}, React__default.createElement("div", null, React__default.createElement(component.value, control)));
|
|
@@ -64942,9 +65034,28 @@ var Filter = function Filter(props) {
|
|
|
64942
65034
|
var _useState = React.useState(null),
|
|
64943
65035
|
componentMap = _useState[0],
|
|
64944
65036
|
setComponentMap = _useState[1];
|
|
65037
|
+
var _useState2 = React.useState(null),
|
|
65038
|
+
fieldValueMap = _useState2[0],
|
|
65039
|
+
setFieldValueMap = _useState2[1];
|
|
65040
|
+
var _useState3 = React.useState(null),
|
|
65041
|
+
changedFieldValueMap = _useState3[0],
|
|
65042
|
+
setChangedFieldValueMap = _useState3[1];
|
|
64945
65043
|
React.useEffect(function () {
|
|
64946
65044
|
initComponentMap();
|
|
64947
65045
|
}, [props.componentMap]);
|
|
65046
|
+
React.useEffect(function () {
|
|
65047
|
+
if (changedFieldValueMap) {
|
|
65048
|
+
setFieldValueMap(Object.fromEntries(changedFieldValueMap));
|
|
65049
|
+
}
|
|
65050
|
+
}, [props.fieldList, changedFieldValueMap]);
|
|
65051
|
+
React.useEffect(function () {
|
|
65052
|
+
var valueMap = new Map();
|
|
65053
|
+
props.valueList.map(function (x) {
|
|
65054
|
+
valueMap.set(x.internalName, x);
|
|
65055
|
+
});
|
|
65056
|
+
setFieldValueMap(Object.fromEntries(valueMap));
|
|
65057
|
+
setChangedFieldValueMap(valueMap);
|
|
65058
|
+
}, [props.valueList]);
|
|
64948
65059
|
var initComponentMap = function initComponentMap() {
|
|
64949
65060
|
var map = props.componentMap.map(function (component) {
|
|
64950
65061
|
return {
|
|
@@ -64954,7 +65065,8 @@ var Filter = function Filter(props) {
|
|
|
64954
65065
|
label: componentProps.label,
|
|
64955
65066
|
onDelete: props.onDeleteField,
|
|
64956
65067
|
operatorList: props.operatorList,
|
|
64957
|
-
|
|
65068
|
+
defaultCondition: props.getDefaultCondition && props.getDefaultCondition(component.name),
|
|
65069
|
+
conditionList: props.getConditionList(component.name),
|
|
64958
65070
|
content: {
|
|
64959
65071
|
component: component.value,
|
|
64960
65072
|
props: _extends({}, componentProps, {
|
|
@@ -64962,20 +65074,25 @@ var Filter = function Filter(props) {
|
|
|
64962
65074
|
})
|
|
64963
65075
|
},
|
|
64964
65076
|
onChange: componentProps.onChange,
|
|
64965
|
-
isShowOperatorSelect: true
|
|
65077
|
+
isShowOperatorSelect: componentProps.index ? true : false
|
|
64966
65078
|
});
|
|
64967
65079
|
}
|
|
64968
65080
|
};
|
|
64969
65081
|
});
|
|
64970
65082
|
setComponentMap(map);
|
|
64971
65083
|
};
|
|
65084
|
+
var onChange = function onChange(changedFieldValueMap) {
|
|
65085
|
+
setChangedFieldValueMap(changedFieldValueMap);
|
|
65086
|
+
props.onChange(changedFieldValueMap);
|
|
65087
|
+
};
|
|
64972
65088
|
return React__default.createElement("div", {
|
|
64973
65089
|
className: styles$N['vitro-filter']
|
|
64974
65090
|
}, componentMap && React__default.createElement(FieldIterator, {
|
|
64975
65091
|
fieldList: props.fieldList,
|
|
65092
|
+
fieldValueMap: fieldValueMap,
|
|
65093
|
+
changedFieldValueMap: changedFieldValueMap,
|
|
64976
65094
|
componentMap: componentMap,
|
|
64977
|
-
onChange:
|
|
64978
|
-
isClearChangedFieldValueMap: true
|
|
65095
|
+
onChange: onChange
|
|
64979
65096
|
}));
|
|
64980
65097
|
};
|
|
64981
65098
|
|
|
@@ -65006,10 +65123,11 @@ var CheckboxList = function CheckboxList(props) {
|
|
|
65006
65123
|
}
|
|
65007
65124
|
};
|
|
65008
65125
|
var getSelectedItemList = function getSelectedItemList() {
|
|
65009
|
-
|
|
65010
|
-
|
|
65011
|
-
|
|
65012
|
-
|
|
65126
|
+
var selectedList = itemList.filter(function (item) {
|
|
65127
|
+
return item.value;
|
|
65128
|
+
});
|
|
65129
|
+
return selectedList.map(function (item) {
|
|
65130
|
+
return item.id;
|
|
65013
65131
|
});
|
|
65014
65132
|
};
|
|
65015
65133
|
var onSearchCancel = function onSearchCancel() {
|
|
@@ -65039,7 +65157,7 @@ var CheckboxList = function CheckboxList(props) {
|
|
|
65039
65157
|
}, React__default.createElement(Input$1, {
|
|
65040
65158
|
onCancel: onSearchCancel,
|
|
65041
65159
|
onChange: onInputChange,
|
|
65042
|
-
|
|
65160
|
+
onSubmit: onInputChange,
|
|
65043
65161
|
className: styles$O['vitro-control']
|
|
65044
65162
|
}), React__default.createElement(ScrollBar, null, isShowSearchResult ? searchItemList.length ? searchItemList.map(function (item) {
|
|
65045
65163
|
return getCheckbox(item);
|
|
@@ -65105,20 +65223,23 @@ var Search = function Search(props) {
|
|
|
65105
65223
|
setIsShowAddFieldDialog(!isShowAddFieldDialog);
|
|
65106
65224
|
};
|
|
65107
65225
|
var onFieldListChange = function onFieldListChange(selectedFieldIdList) {
|
|
65108
|
-
var newFieldList = [];
|
|
65109
65226
|
var _loop = function _loop() {
|
|
65110
65227
|
var id = _step.value;
|
|
65111
|
-
var field =
|
|
65112
|
-
return
|
|
65228
|
+
var field = filterFieldList.find(function (x) {
|
|
65229
|
+
return x.id === id;
|
|
65113
65230
|
});
|
|
65114
|
-
if (field) {
|
|
65115
|
-
|
|
65231
|
+
if (!field) {
|
|
65232
|
+
var newField = props.fieldList.find(function (x) {
|
|
65233
|
+
return x.id === id;
|
|
65234
|
+
});
|
|
65235
|
+
setFilterFieldList(function (prevState) {
|
|
65236
|
+
return [].concat(prevState, [newField]);
|
|
65237
|
+
});
|
|
65116
65238
|
}
|
|
65117
65239
|
};
|
|
65118
65240
|
for (var _iterator = _createForOfIteratorHelperLoose(selectedFieldIdList), _step; !(_step = _iterator()).done;) {
|
|
65119
65241
|
_loop();
|
|
65120
65242
|
}
|
|
65121
|
-
setFilterFieldList(newFieldList);
|
|
65122
65243
|
};
|
|
65123
65244
|
var closeSettings = function closeSettings() {
|
|
65124
65245
|
setIsShowAddFieldDialog(false);
|
|
@@ -65197,7 +65318,7 @@ var Search = function Search(props) {
|
|
|
65197
65318
|
valueList: selectedSearchCriterionList,
|
|
65198
65319
|
onSettingsClick: onSettingsClick,
|
|
65199
65320
|
onCancel: onCancel,
|
|
65200
|
-
|
|
65321
|
+
onSubmit: onSubmit,
|
|
65201
65322
|
onChange: onInputChange,
|
|
65202
65323
|
placeholder: props.inputPlaceholder,
|
|
65203
65324
|
isSettingsActive: isShowDialog,
|
|
@@ -65206,12 +65327,14 @@ var Search = function Search(props) {
|
|
|
65206
65327
|
className: styles$N['vitro-settings-dialog']
|
|
65207
65328
|
}, React__default.createElement(Filter, {
|
|
65208
65329
|
fieldList: filterFieldList,
|
|
65330
|
+
valueList: selectedSearchCriterionList,
|
|
65209
65331
|
onChange: onFilterChange,
|
|
65210
65332
|
componentMap: props.componentMap,
|
|
65211
65333
|
onDeleteField: onDeleteField,
|
|
65212
65334
|
operatorList: props.operatorList,
|
|
65213
|
-
|
|
65214
|
-
|
|
65335
|
+
getConditionList: props.getConditionList,
|
|
65336
|
+
getDefaultCondition: props.getDefaultCondition
|
|
65337
|
+
}), filterFieldList.length < props.maxFieldCount && React__default.createElement("div", {
|
|
65215
65338
|
className: styles$N['vitro-add-field']
|
|
65216
65339
|
}, React__default.createElement(Button$2, {
|
|
65217
65340
|
text: props.labelAddField,
|
|
@@ -65246,6 +65369,7 @@ exports.Alert = Alert$1;
|
|
|
65246
65369
|
exports.Avatar = Avatar;
|
|
65247
65370
|
exports.Breadcrumbs = Breadcrumbs;
|
|
65248
65371
|
exports.Button = Button$2;
|
|
65372
|
+
exports.CONTROL = CONTROL;
|
|
65249
65373
|
exports.Checkbox = Checkbox;
|
|
65250
65374
|
exports.CommandMenu = CommandMenu;
|
|
65251
65375
|
exports.CommandMenuButton = CommandMenuButton;
|