@vitrosoftware/common-ui-ts 1.1.175 → 1.1.177

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.
@@ -59,6 +59,10 @@ html, body {
59
59
  overscroll-behavior-x: none;
60
60
  }
61
61
 
62
+ p {
63
+ margin: unset;
64
+ }
65
+
62
66
  :global(#root) {
63
67
  position: absolute;
64
68
  top: 0;
@@ -0,0 +1,24 @@
1
+ .vitro-list {
2
+ background: #fff;
3
+ border-radius: 4px;
4
+ max-width: 252px;
5
+ }
6
+
7
+ .vitro-list :global(.ps) > div:first-child {
8
+ padding-left: 12px;
9
+ }
10
+
11
+ .vitro-item {
12
+ margin-bottom: 4px;
13
+ }
14
+
15
+ .vitro-item:last-child {
16
+ padding-bottom: 8px;
17
+ }
18
+
19
+ .vitro-item a {
20
+ cursor: pointer;
21
+ display: block;
22
+ line-height: 24px;
23
+ padding: 0 4px 0 4px;
24
+ }
@@ -53,6 +53,10 @@
53
53
  grid-gap: 28px 16px;
54
54
  }
55
55
 
56
+ .vitro-filter [class^="_criterion_vitro-control"] {
57
+ max-width: calc(100% - 87px);
58
+ }
59
+
56
60
  .vitro-add-field {
57
61
  margin: 18px 0 16px 66px;
58
62
  }
@@ -91,4 +91,23 @@
91
91
 
92
92
  :global(.vitro-mobile-layout) .vitro-table-view {
93
93
  height: calc(100% - 1px);
94
- }
94
+ }
95
+
96
+ .vitro-table-view :global(.TWMain) strong,
97
+ .vitro-table-view :global(.TWMain) b {
98
+ font-weight: bold;
99
+ }
100
+
101
+ .vitro-table-view em {
102
+ color: inherit;
103
+ font-style: italic;
104
+ }
105
+
106
+ .vitro-table-view :global(.TWMain) s {
107
+ color: inherit;
108
+ text-decoration: line-through;
109
+ }
110
+
111
+ .vitro-table-view :global(.TWMain) u {
112
+ color: inherit;
113
+ }
package/dist/index.css CHANGED
@@ -59,6 +59,10 @@ html, body {
59
59
  overscroll-behavior-x: none;
60
60
  }
61
61
 
62
+ p {
63
+ margin: unset;
64
+ }
65
+
62
66
  #root {
63
67
  position: absolute;
64
68
  top: 0;
@@ -775,8 +779,26 @@ html, body {
775
779
 
776
780
  .vitro-mobile-layout ._table-view_vitro-table-view_1tTs32D {
777
781
  height: calc(100% - 1px);
778
- }
782
+ }
779
783
 
784
+ ._table-view_vitro-table-view_1tTs32D .TWMain strong,
785
+ ._table-view_vitro-table-view_1tTs32D .TWMain b {
786
+ font-weight: bold;
787
+ }
788
+
789
+ ._table-view_vitro-table-view_1tTs32D em {
790
+ color: inherit;
791
+ font-style: italic;
792
+ }
793
+
794
+ ._table-view_vitro-table-view_1tTs32D .TWMain s {
795
+ color: inherit;
796
+ text-decoration: line-through;
797
+ }
798
+
799
+ ._table-view_vitro-table-view_1tTs32D .TWMain u {
800
+ color: inherit;
801
+ }
780
802
  ._progress-bar_vitro-progress-bar_u2VLQeW {
781
803
  width: 100%;
782
804
  height: 8px;
@@ -6920,27 +6942,31 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
6920
6942
  padding: 8px 12px;
6921
6943
  }
6922
6944
 
6923
- ._checkbox-list_vitro-checkbox-list_1iZSkkv {
6924
- border-radius: 4px;
6945
+ ._list_vitro-list_1I2JJ6w {
6925
6946
  background: #fff;
6947
+ border-radius: 4px;
6926
6948
  max-width: 252px;
6927
6949
  }
6928
6950
 
6929
- ._checkbox-list_vitro-search-value-list_2i58fRK > div:first-child {
6930
- padding: 12px 12px 8px 12px;
6931
- }
6932
-
6933
- ._checkbox-list_vitro-checkbox-list_1iZSkkv .ps > div:first-child {
6951
+ ._list_vitro-list_1I2JJ6w .ps > div:first-child {
6934
6952
  padding-left: 12px;
6935
6953
  }
6936
6954
 
6937
- ._checkbox-list_vitro-checkbox-list_1iZSkkv ._checkbox-list_vitro-checkbox_1EqsnoQ {
6955
+ ._list_vitro-item_2XsFSic {
6938
6956
  margin-bottom: 4px;
6939
6957
  }
6940
6958
 
6941
- ._checkbox-list_vitro-checkbox_1EqsnoQ:last-child {
6959
+ ._list_vitro-item_2XsFSic:last-child {
6942
6960
  padding-bottom: 8px;
6943
- }
6961
+ }
6962
+
6963
+ ._list_vitro-item_2XsFSic a {
6964
+ cursor: pointer;
6965
+ display: block;
6966
+ line-height: 24px;
6967
+ padding: 0 4px 0 4px;
6968
+ }
6969
+
6944
6970
  ._search_vitro-search_QkJksC_ {
6945
6971
  position: relative;
6946
6972
  align-self: baseline;
@@ -6996,6 +7022,10 @@ li:first-child ._command-menu-item_vitro-item_2pVhk23:hover {
6996
7022
  grid-gap: 28px 16px;
6997
7023
  }
6998
7024
 
7025
+ ._search_vitro-filter_2n-Y-mS [class^="_criterion_vitro-control"] {
7026
+ max-width: calc(100% - 87px);
7027
+ }
7028
+
6999
7029
  ._search_vitro-add-field_2hHt1Z2 {
7000
7030
  margin: 18px 0 16px 66px;
7001
7031
  }
package/dist/index.js CHANGED
@@ -63545,7 +63545,7 @@ var Viewer = function Viewer(props) {
63545
63545
  };
63546
63546
 
63547
63547
  var name = "@vitrosoftware/common-ui-ts";
63548
- var version$1 = "1.1.175";
63548
+ var version$1 = "1.1.177";
63549
63549
  var description = "vitro software common ui ts";
63550
63550
  var author = "";
63551
63551
  var license = "MIT";
@@ -65334,6 +65334,22 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
65334
65334
  var isShowImage = (_props$itemList = props.itemList) !== null && _props$itemList !== void 0 && _props$itemList.find(function (item) {
65335
65335
  return item.imageUrl;
65336
65336
  }) ? true : false;
65337
+ var contentRef = React.useRef(null);
65338
+ React.useEffect(function () {
65339
+ var observer = new IntersectionObserver(function (_ref) {
65340
+ var entry = _ref[0];
65341
+ if (contentRef.current && contentRef.current.parentElement && entry.isIntersecting) {
65342
+ contentRef.current.parentElement.scrollTop = 1;
65343
+ contentRef.current.parentElement.scrollTop = 0;
65344
+ }
65345
+ });
65346
+ if (contentRef.current) {
65347
+ observer.observe(contentRef.current);
65348
+ }
65349
+ return function () {
65350
+ observer.disconnect();
65351
+ };
65352
+ }, [contentRef]);
65337
65353
  var onClick = function onClick(e) {
65338
65354
  if (props.onClick) {
65339
65355
  props.onClick(e);
@@ -65359,7 +65375,8 @@ var CommandMenuDropdownButton = function CommandMenuDropdownButton(props) {
65359
65375
  setIsRight: setIsRight
65360
65376
  }))), React__default.createElement(reactstrap.DropdownMenu, null, React__default.createElement(ScrollBar, {
65361
65377
  className: styles$W['vitro-scrollbar'],
65362
- isHideScrollX: true
65378
+ isHideScrollX: true,
65379
+ contentRef: contentRef
65363
65380
  }, props.itemList && props.itemList.map(function (i) {
65364
65381
  return React__default.createElement(CommandMenuSubItem, Object.assign({
65365
65382
  toggle: props.toggle,
@@ -66934,7 +66951,9 @@ var ConditionSelect = React.forwardRef(function (props, ref) {
66934
66951
  });
66935
66952
 
66936
66953
  var Criterion = function Criterion(props) {
66937
- var _useState = React.useState(props.operatorList ? props.operatorList[0] : null),
66954
+ var _useState = React.useState(props.operatorList ? props.defaultOperator ? props.operatorList.find(function (x) {
66955
+ return x.type === props.defaultOperator;
66956
+ }) || props.operatorList[0] : props.operatorList[0] : null),
66938
66957
  operator = _useState[0],
66939
66958
  setOperator = _useState[1];
66940
66959
  var _useState2 = React.useState(false),
@@ -66944,11 +66963,6 @@ var Criterion = function Criterion(props) {
66944
66963
  state = _useState3[0],
66945
66964
  setState = _useState3[1];
66946
66965
  var componentProps = props.content.props;
66947
- var defaultOperator = props.operatorList ? (componentProps.value ? props.operatorList.find(function (x) {
66948
- return x.type === componentProps.value.operator;
66949
- }) : props.operatorList.find(function (x) {
66950
- return x.type === props.defaultOperator;
66951
- })) || props.operatorList[0] : null;
66952
66966
  var defaultCondition = (componentProps.value ? props.conditionList.find(function (x) {
66953
66967
  return x.type === componentProps.value.condition;
66954
66968
  }) : props.conditionList.find(function (x) {
@@ -66957,7 +66971,7 @@ var Criterion = function Criterion(props) {
66957
66971
  var value = React.useMemo(function () {
66958
66972
  return {
66959
66973
  internalName: componentProps.name,
66960
- operator: defaultOperator ? defaultOperator.type : 0,
66974
+ operator: props.defaultOperator || 0,
66961
66975
  valueList: componentProps.value ? componentProps.value.valueList : [],
66962
66976
  condition: defaultCondition.type
66963
66977
  };
@@ -66967,7 +66981,6 @@ var Criterion = function Criterion(props) {
66967
66981
  var conditionSelectRef = React.useRef(null);
66968
66982
  React.useEffect(function () {
66969
66983
  window.addEventListener(exports.EVENT.CLICK, onBlurSelect);
66970
- setOperator(defaultOperator);
66971
66984
  return function () {
66972
66985
  window.removeEventListener(exports.EVENT.CLICK, onBlurSelect);
66973
66986
  };
@@ -66977,6 +66990,18 @@ var Criterion = function Criterion(props) {
66977
66990
  conditionSelectRef.current.style.left = labelRef.current.offsetWidth + 8 + UNIT.PX;
66978
66991
  }
66979
66992
  }, [labelRef]);
66993
+ React.useEffect(function () {
66994
+ if (props.content.props && props.content.props.value && props.operatorList) {
66995
+ var _operator = props.operatorList.find(function (x) {
66996
+ return x.type === componentProps.value.operator;
66997
+ });
66998
+ if (_operator) {
66999
+ setOperator(_operator);
67000
+ value.operator = _operator.type;
67001
+ }
67002
+ value.valueList = componentProps.value ? componentProps.value.valueList : [];
67003
+ }
67004
+ }, [props.content]);
66980
67005
  var onOperatorClick = function onOperatorClick(operator) {
66981
67006
  setOperator(operator);
66982
67007
  value.operator = operator.type;
@@ -67059,7 +67084,7 @@ var Criterion = function Criterion(props) {
67059
67084
  isRequired: false
67060
67085
  }))), React__default.createElement(ImageButton, {
67061
67086
  onClick: function onClick() {
67062
- return props.onDelete(componentProps.id);
67087
+ return props.onDelete(componentProps.controlKey);
67063
67088
  },
67064
67089
  className: styles$1d['vitro-button-cancel']
67065
67090
  }));
@@ -67190,7 +67215,7 @@ var FieldIterator = React.forwardRef(function (props, ref) {
67190
67215
  value = _Object$entries$_i[1];
67191
67216
  setControlList(function (prevState) {
67192
67217
  return prevState.map(function (control) {
67193
- return control.name === key && control.value !== value ? _extends({}, control, {
67218
+ return control.controlKey === key && control.value !== value ? _extends({}, control, {
67194
67219
  value: value
67195
67220
  }) : control;
67196
67221
  });
@@ -67217,11 +67242,13 @@ var FieldIterator = React.forwardRef(function (props, ref) {
67217
67242
  };
67218
67243
  var createBaseControl = function createBaseControl(field) {
67219
67244
  var _field$fieldValueMap;
67245
+ var controlKey = field.key ? field.key : field.internalName;
67220
67246
  var control = {
67221
67247
  id: field.id,
67222
67248
  label: field.name,
67223
67249
  name: field.internalName,
67224
- key: field.internalName,
67250
+ key: controlKey,
67251
+ controlKey: controlKey,
67225
67252
  code: field.component ? field.component : field.fieldType.reactComponent,
67226
67253
  isRequired: field.isRequired,
67227
67254
  isReadOnly: props.isReadOnly || field.isReadOnly,
@@ -67230,8 +67257,8 @@ var FieldIterator = React.forwardRef(function (props, ref) {
67230
67257
  errorMessage: null,
67231
67258
  isAutoComplete: false,
67232
67259
  multiline: (_field$fieldValueMap = field.fieldValueMap) === null || _field$fieldValueMap === void 0 ? void 0 : _field$fieldValueMap.multiline,
67233
- onChange: function onChange(value, name) {
67234
- return onChangeControl(value, name);
67260
+ onChange: function onChange(value) {
67261
+ return onChangeControl(value, controlKey);
67235
67262
  },
67236
67263
  isRow: isControlRow(field.internalName),
67237
67264
  field: field,
@@ -67240,16 +67267,16 @@ var FieldIterator = React.forwardRef(function (props, ref) {
67240
67267
  };
67241
67268
  return control;
67242
67269
  };
67243
- var onChangeControl = function onChangeControl(value, fieldName) {
67270
+ var onChangeControl = function onChangeControl(value, controlKey) {
67244
67271
  setControlList(function (prevState) {
67245
- return setControlValue(prevState, value, fieldName);
67272
+ return setControlValue(prevState, value, controlKey);
67246
67273
  });
67247
- changedFieldValueMap.set(fieldName, value);
67274
+ changedFieldValueMap.set(controlKey, value);
67248
67275
  props.onChange(changedFieldValueMap, saveStatus);
67249
67276
  };
67250
- var setControlValue = function setControlValue(controlList, val, fieldName) {
67277
+ var setControlValue = function setControlValue(controlList, val, controlKey) {
67251
67278
  return controlList.map(function (field) {
67252
- if (field.name === fieldName) {
67279
+ if (field.controlKey === controlKey) {
67253
67280
  return _extends({}, field, {
67254
67281
  value: val
67255
67282
  });
@@ -67494,7 +67521,7 @@ var CriterionFieldIterator = function CriterionFieldIterator(props) {
67494
67521
  if (props.valueList) {
67495
67522
  var valueMap = new Map();
67496
67523
  props.valueList.map(function (x) {
67497
- valueMap.set(x.internalName, x);
67524
+ valueMap.set(x.key, x);
67498
67525
  });
67499
67526
  setFieldValueMap(Object.fromEntries(valueMap));
67500
67527
  setChangedFieldValueMap(valueMap);
@@ -67636,7 +67663,7 @@ var SearchInput = function SearchInput(props) {
67636
67663
  var _loop = function _loop() {
67637
67664
  var value = _step.value;
67638
67665
  newList = newList.filter(function (x) {
67639
- return x.internalName !== value.internalName;
67666
+ return x.key !== value.key;
67640
67667
  });
67641
67668
  };
67642
67669
  for (var _iterator = _createForOfIteratorHelperLoose(valueList), _step; !(_step = _iterator()).done;) {
@@ -67741,60 +67768,39 @@ var SearchValueList = function SearchValueList(props) {
67741
67768
  onChange: onInputChange,
67742
67769
  className: props.inputClassName,
67743
67770
  isMobileView: Boolean(props.isMobileView)
67744
- })), React__default.createElement(ScrollBar, null, props.children, itemList.length ? itemList.map(function (item) {
67771
+ })), React__default.createElement(ScrollBar, null, props.children, itemList && itemList.length ? itemList.map(function (item) {
67745
67772
  return props.valueTemplate(item);
67746
67773
  }) : React__default.createElement("span", {
67747
67774
  className: styles$1k['vitro-empty-placeholder']
67748
67775
  }, props.emptyPlaceHolder || localeService.create(LOCALE$a.EMPTY_PLACEHOLDER))));
67749
67776
  };
67750
67777
 
67751
- var styles$1l = {"vitro-checkbox-list":"_checkbox-list_vitro-checkbox-list_1iZSkkv","vitro-search-value-list":"_checkbox-list_vitro-search-value-list_2i58fRK","vitro-checkbox":"_checkbox-list_vitro-checkbox_1EqsnoQ"};
67778
+ var styles$1l = {"vitro-list":"_list_vitro-list_1I2JJ6w","vitro-item":"_list_vitro-item_2XsFSic"};
67752
67779
 
67753
- var CheckboxList = React.forwardRef(function (props, ref) {
67754
- var _useState = React.useState(props.itemList),
67755
- itemList = _useState[0],
67756
- setItemList = _useState[1];
67757
- var _onChange = function onChange(value, id) {
67758
- setItemList(function (prevState) {
67759
- return prevState.map(function (item) {
67760
- if (item.id === id) {
67761
- item.value = value;
67762
- }
67763
- return item;
67764
- });
67765
- });
67766
- if (props.onChange) {
67767
- props.onChange(getSelectedItemList());
67780
+ var List$1 = React.forwardRef(function (props, ref) {
67781
+ var _onClick = function onClick(id) {
67782
+ if (props.onClick) {
67783
+ props.onClick(id);
67768
67784
  }
67769
67785
  };
67770
- var getSelectedItemList = function getSelectedItemList() {
67771
- var selectedList = itemList.filter(function (item) {
67772
- return item.value;
67773
- });
67774
- return selectedList.map(function (item) {
67775
- return item.id;
67776
- });
67777
- };
67778
- var getCheckbox = function getCheckbox(item) {
67779
- return React__default.createElement(Checkbox, {
67780
- label: item.name,
67781
- name: item.name,
67782
- value: props.isAllSelected ? true : item.value,
67783
- onChange: function onChange(value, name) {
67784
- return _onChange(value, item.id);
67785
- },
67786
- className: styles$1l['vitro-checkbox']
67787
- });
67786
+ var getItemTemplate = function getItemTemplate(item) {
67787
+ return React__default.createElement("div", {
67788
+ className: styles$1l['vitro-item']
67789
+ }, React__default.createElement("a", {
67790
+ onClick: function onClick() {
67791
+ return _onClick(item.id);
67792
+ }
67793
+ }, item.name));
67788
67794
  };
67789
67795
  var filterValueTemplate = function filterValueTemplate(item) {
67790
67796
  return item.name;
67791
67797
  };
67792
67798
  return React__default.createElement("div", {
67793
- className: styles$1l['vitro-checkbox-list'],
67799
+ className: styles$1l['vitro-list'],
67794
67800
  ref: ref
67795
67801
  }, React__default.createElement(SearchValueList, {
67796
67802
  itemList: props.itemList,
67797
- valueTemplate: getCheckbox,
67803
+ valueTemplate: getItemTemplate,
67798
67804
  filterValueTemplate: filterValueTemplate,
67799
67805
  className: styles$1l['vitro-search-value-list']
67800
67806
  }));
@@ -67827,6 +67833,9 @@ var AddFieldButton = React.forwardRef(function (props, ref) {
67827
67833
  }
67828
67834
  }
67829
67835
  };
67836
+ var onFieldListChange = function onFieldListChange(id) {
67837
+ props.onFieldListChange(id);
67838
+ };
67830
67839
  return React__default.createElement("div", {
67831
67840
  className: styles$1m['vitro-add-field']
67832
67841
  }, React__default.createElement(Button$2, {
@@ -67844,11 +67853,10 @@ var AddFieldButton = React.forwardRef(function (props, ref) {
67844
67853
  container: (_props$filterContaine = props.filterContainerRef) !== null && _props$filterContaine !== void 0 && _props$filterContaine.current ? props.filterContainerRef.current : undefined,
67845
67854
  placement: props.isMobileView ? exports.PLACEMENT.BOTTOM + CTRL.DASH + exports.PLACEMENT.START : exports.PLACEMENT.RIGHT + CTRL.DASH + exports.PLACEMENT.START,
67846
67855
  className: styles$1m['vitro-add-field-dialog']
67847
- }, React__default.createElement(CheckboxList, {
67856
+ }, React__default.createElement(List$1, {
67848
67857
  ref: addFieldListRef,
67849
- itemList: props.checkboxFieldList,
67850
- onChange: props.onFieldListChange,
67851
- isAllSelected: props.isAllFieldsVisible
67858
+ itemList: props.fieldList,
67859
+ onClick: onFieldListChange
67852
67860
  })));
67853
67861
  });
67854
67862
 
@@ -67888,12 +67896,18 @@ var Search = function Search(props) {
67888
67896
  };
67889
67897
  }, []);
67890
67898
  React.useEffect(function () {
67891
- var checkboxList = props.fieldList;
67892
67899
  if (props.visibleFieldList) {
67893
- setFilterFieldList(props.visibleFieldList);
67894
- checkboxList = getCheckboxFieldList(props.visibleFieldList);
67900
+ var visibleFieldList = [];
67901
+ props.visibleFieldList.forEach(function (visibleField) {
67902
+ var field = _extends({}, visibleField);
67903
+ if (!visibleField.key) {
67904
+ field.key = getUUID();
67905
+ }
67906
+ visibleFieldList.push(field);
67907
+ });
67908
+ setFilterFieldList(visibleFieldList);
67895
67909
  }
67896
- setCheckboxFieldList(checkboxList);
67910
+ setCheckboxFieldList(props.fieldList);
67897
67911
  }, [props.visibleFieldList]);
67898
67912
  React.useEffect(function () {
67899
67913
  if (props.maxFieldCount) {
@@ -67912,21 +67926,32 @@ var Search = function Search(props) {
67912
67926
  }, [selectedSearchCriterionList]);
67913
67927
  React.useEffect(function () {
67914
67928
  if (props.searchCriterionList && props.searchCriterionList.length) {
67915
- var list = getSelectedCriterionList(props.searchCriterionList);
67929
+ var list = getSelectedCriterionList(getSeacrhCriterionWithKey(props.searchCriterionList));
67916
67930
  setSelectedSearchCriterionList(list);
67917
67931
  var selectedFieldList = getSelectedFieldList(list);
67918
67932
  setFilterFieldList(selectedFieldList);
67919
- setCheckboxFieldList(getCheckboxFieldList(selectedFieldList));
67933
+ setCheckboxFieldList(props.fieldList);
67920
67934
  } else {
67921
67935
  reset();
67922
67936
  }
67923
67937
  }, [props.searchCriterionList]);
67938
+ var getSeacrhCriterionWithKey = function getSeacrhCriterionWithKey(searchCriterionList) {
67939
+ var criterionList = [];
67940
+ for (var _iterator = _createForOfIteratorHelperLoose(searchCriterionList), _step; !(_step = _iterator()).done;) {
67941
+ var criterionItem = _step.value;
67942
+ var criterion = _extends({}, criterionItem, {
67943
+ key: getUUID()
67944
+ });
67945
+ criterionList.push(criterion);
67946
+ }
67947
+ return criterionList;
67948
+ };
67924
67949
  var reset = function reset() {
67925
67950
  setSearchCriterionList([]);
67926
67951
  setSelectedSearchCriterionList([]);
67927
67952
  var selectedFieldList = getSelectedFieldList([]);
67928
67953
  setFilterFieldList(selectedFieldList);
67929
- setCheckboxFieldList(selectedFieldList);
67954
+ setCheckboxFieldList(props.fieldList);
67930
67955
  setIsShowAddFieldDialog(false);
67931
67956
  setIsShowDialog(false);
67932
67957
  setState(CTRL.EMPTY);
@@ -67937,19 +67962,16 @@ var Search = function Search(props) {
67937
67962
  var onAddField = function onAddField() {
67938
67963
  setIsShowAddFieldDialog(!isShowAddFieldDialog);
67939
67964
  };
67940
- var onFieldListChange = function onFieldListChange(selectedFieldIdList) {
67941
- var fieldList = [];
67942
- var _loop = function _loop() {
67943
- var id = _step.value;
67944
- var field = props.fieldList.find(function (x) {
67945
- return x.id === id;
67965
+ var onFieldListChange = function onFieldListChange(selectedFieldId) {
67966
+ var fieldList = [].concat(filterFieldList);
67967
+ var field = props.fieldList.find(function (x) {
67968
+ return x.id === selectedFieldId;
67969
+ });
67970
+ if (field) {
67971
+ var fieldWithKey = _extends({}, field, {
67972
+ key: getUUID()
67946
67973
  });
67947
- if (field) {
67948
- fieldList.push(field);
67949
- }
67950
- };
67951
- for (var _iterator = _createForOfIteratorHelperLoose(selectedFieldIdList), _step; !(_step = _iterator()).done;) {
67952
- _loop();
67974
+ fieldList.push(fieldWithKey);
67953
67975
  }
67954
67976
  setFilterFieldList(fieldList);
67955
67977
  };
@@ -67960,37 +67982,22 @@ var Search = function Search(props) {
67960
67982
  setState(CTRL.EMPTY);
67961
67983
  }
67962
67984
  };
67963
- var onDeleteField = function onDeleteField(id) {
67985
+ var onDeleteField = function onDeleteField(key) {
67964
67986
  setFilterFieldList(function (prevState) {
67965
67987
  return prevState.filter(function (field) {
67966
- return field.id !== id;
67988
+ return field.key !== key;
67967
67989
  });
67968
67990
  });
67969
- setCheckboxFieldList(function (prevState) {
67970
- return prevState.map(function (field) {
67971
- if (field.id === id) {
67972
- return _extends({}, field, {
67973
- value: false
67974
- });
67975
- } else {
67976
- return field;
67977
- }
67991
+ setSearchCriterionList(function (prevState) {
67992
+ return prevState.filter(function (criterion) {
67993
+ return criterion.key !== key;
67978
67994
  });
67979
67995
  });
67980
- var field = props.fieldList.find(function (field) {
67981
- return field.id === id;
67982
- });
67983
- if (field) {
67984
- setSearchCriterionList(function (prevState) {
67985
- return prevState.filter(function (criterion) {
67986
- return criterion.internalName !== field.internalName;
67987
- });
67988
- });
67989
- }
67990
67996
  };
67991
67997
  var onFilterChange = function onFilterChange(changedFieldValueMap, saveStatus) {
67992
67998
  var criterionList = [];
67993
67999
  changedFieldValueMap.forEach(function (value, key) {
68000
+ value.key = key;
67994
68001
  criterionList.push(value);
67995
68002
  });
67996
68003
  setSearchCriterionList(criterionList);
@@ -68000,10 +68007,23 @@ var Search = function Search(props) {
68000
68007
  };
68001
68008
  var onSearch = function onSearch(value, criterionList) {
68002
68009
  var list = criterionList ? criterionList : searchCriterionList;
68003
- props.onSearch(list);
68010
+ props.onSearch(getSearchCriterionListWithoutKey(list));
68004
68011
  setSelectedSearchCriterionList(getSelectedCriterionList(list));
68005
68012
  closeSettings();
68006
68013
  };
68014
+ var getSearchCriterionListWithoutKey = function getSearchCriterionListWithoutKey(criterionList) {
68015
+ var list = [];
68016
+ criterionList === null || criterionList === void 0 ? void 0 : criterionList.forEach(function (item) {
68017
+ var criterion = {
68018
+ internalName: item.internalName,
68019
+ operator: item.operator,
68020
+ condition: item.condition,
68021
+ valueList: item.valueList
68022
+ };
68023
+ list.push(criterion);
68024
+ });
68025
+ return list;
68026
+ };
68007
68027
  var getSelectedCriterionList = function getSelectedCriterionList(criterionList) {
68008
68028
  var list = criterionList.map(function (x) {
68009
68029
  var fieldName = props.fieldList.find(function (field) {
@@ -68021,24 +68041,13 @@ var Search = function Search(props) {
68021
68041
  var field = props.fieldList.find(function (field) {
68022
68042
  return field.internalName === x.internalName;
68023
68043
  });
68024
- fieldList.push(field);
68044
+ var fieldWithKey = _extends({}, field, {
68045
+ key: x.key
68046
+ });
68047
+ fieldList.push(fieldWithKey);
68025
68048
  });
68026
68049
  return fieldList;
68027
68050
  };
68028
- var getCheckboxFieldList = function getCheckboxFieldList(visibleFieldList) {
68029
- var checkboxList = props.fieldList.map(function (field) {
68030
- if (visibleFieldList.find(function (f) {
68031
- return f.id === field.id;
68032
- })) {
68033
- return _extends({}, field, {
68034
- value: true
68035
- });
68036
- } else {
68037
- return field;
68038
- }
68039
- });
68040
- return checkboxList;
68041
- };
68042
68051
  var onCancelSearch = function onCancelSearch() {
68043
68052
  setSearchCriterionList([]);
68044
68053
  setSelectedSearchCriterionList([]);
@@ -68047,11 +68056,17 @@ var Search = function Search(props) {
68047
68056
  props.onCancel();
68048
68057
  };
68049
68058
  var onInputChange = function onInputChange(value) {
68059
+ var _props$visibleFieldLi, _defaultSearchField$;
68060
+ var defaultSearchField = (_props$visibleFieldLi = props.visibleFieldList) === null || _props$visibleFieldLi === void 0 ? void 0 : _props$visibleFieldLi.filter(function (field) {
68061
+ return field.internalName === props.defaultSearchFieldName;
68062
+ });
68063
+ var key = defaultSearchField && defaultSearchField.length && (_defaultSearchField$ = defaultSearchField[0]) !== null && _defaultSearchField$ !== void 0 && _defaultSearchField$.key ? defaultSearchField[0].key : getUUID();
68050
68064
  var criterion = {
68051
68065
  condition: CONDITION_CONTAINS,
68052
68066
  operator: 0,
68053
68067
  internalName: props.defaultSearchFieldName,
68054
- valueList: [value]
68068
+ valueList: [value],
68069
+ key: key
68055
68070
  };
68056
68071
  setSearchCriterionList([criterion]);
68057
68072
  };
@@ -68073,6 +68088,13 @@ var Search = function Search(props) {
68073
68088
  var onCancel = function onCancel() {
68074
68089
  closeSettings();
68075
68090
  };
68091
+ var getUUID = function getUUID() {
68092
+ return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
68093
+ var r = Math.random() * 16 | 0,
68094
+ v = c == 'x' ? r : r & 0x3 | 0x8;
68095
+ return v.toString(16);
68096
+ });
68097
+ };
68076
68098
  var content = React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
68077
68099
  className: styles$1m['vitro-filter-container'],
68078
68100
  ref: filterContainerRef
@@ -68093,7 +68115,7 @@ var Search = function Search(props) {
68093
68115
  onAddField: onAddField,
68094
68116
  isShowAddFieldDialog: isShowAddFieldDialog,
68095
68117
  isMobileView: props.isMobileView,
68096
- checkboxFieldList: checkboxFieldList,
68118
+ fieldList: checkboxFieldList,
68097
68119
  onFieldListChange: onFieldListChange,
68098
68120
  isAllFieldsVisible: props.isAllFieldsVisible,
68099
68121
  filterContainerRef: filterContainerRef,