sag_components 1.0.609 → 1.0.611

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.
@@ -25,8 +25,8 @@ const checkedIcon = /*#__PURE__*/_react.default.createElement(_CheckBox.default,
25
25
  /**
26
26
  * SAG DropdownMulti
27
27
  */
28
- const DropdownMulti = props => {
29
- const {
28
+ const DropdownMulti = _ref => {
29
+ let {
30
30
  name,
31
31
  width = '100%',
32
32
  size,
@@ -47,7 +47,11 @@ const DropdownMulti = props => {
47
47
  disabled = false,
48
48
  dropdownListfontSize = '14px',
49
49
  placeHolderFontSize = '14px'
50
- } = props;
50
+ } = _ref;
51
+ /**
52
+ * SAG DropdownMulti
53
+ */
54
+
51
55
  const [currentInputValue, setCurrentInputValue] = (0, _react.useState)(null);
52
56
  const [selectedOptionsState, setSelectedOptionsState] = (0, _react.useState)([]);
53
57
  (0, _react.useEffect)(() => {
@@ -188,10 +192,10 @@ const DropdownMulti = props => {
188
192
  width: "0.5em",
189
193
  height: "0.5em"
190
194
  }) : null,
191
- renderOption: (props, option, _ref) => {
195
+ renderOption: (props, option, _ref2) => {
192
196
  let {
193
197
  selected
194
- } = _ref;
198
+ } = _ref2;
195
199
  return /*#__PURE__*/_react.default.createElement("li", props, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
196
200
  icon: icon,
197
201
  checkedIcon: checkedIcon,
@@ -253,7 +257,6 @@ const DropdownMulti = props => {
253
257
 
254
258
  // --------------------------------- MAIN -------------------------------------
255
259
  return /*#__PURE__*/_react.default.createElement(_DropdownMulti.DropdownContainer, {
256
- className: "DropdownContainer",
257
260
  width: width
258
261
  }, getAutocompleteMulti());
259
262
  };
@@ -8,4 +8,6 @@ exports.DropdownContainer = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
10
10
  var _templateObject;
11
- const DropdownContainer = exports.DropdownContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n text-align: left; \n position: relative; \n align-items: center;\n justify-content: center;\n font-family: Poppins; \n font-size: 14px;\n"])), props => props.width);
11
+ // import './font.css';
12
+
13
+ const DropdownContainer = exports.DropdownContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n text-align: left; \n position: relative; \n align-items: center;\n justify-content: center;\n font-family: Poppins; \n font-size: \"14px\";\n"])), props => props.width);
@@ -31,19 +31,18 @@ const FilterPanel = props => {
31
31
  } = props;
32
32
  const [FieldsDataState, setFieldsDataState] = (0, _react.useState)(fieldsData);
33
33
  const [Reset, setReset] = (0, _react.useState)(false);
34
+ const [PeriodPickerSelectedValue, setPeriodPickerSelectedValue] = (0, _react.useState)('');
34
35
  (0, _react.useEffect)(() => {
35
36
  setFieldsDataState(fieldsData);
36
37
  }, [fieldsData]);
37
38
  const onClickResetHandler = () => {
38
39
  const newFieldsDataState = FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => ({
39
40
  ...itemField,
40
- selectedValue: undefined,
41
- ...(itemField.periodPickerSelectedValue ? {
42
- periodPickerSelectedValue: undefined
43
- } : '')
41
+ selectedValue: undefined
44
42
  }));
45
43
  setFieldsDataState(newFieldsDataState);
46
44
  setReset(!Reset);
45
+ setPeriodPickerSelectedValue('');
47
46
  onResetClick({
48
47
  eventName: 'onResetClick',
49
48
  fieldsData: newFieldsDataState
@@ -63,7 +62,7 @@ const FilterPanel = props => {
63
62
  };
64
63
  const displayPeriodPickerContent = item => {
65
64
  let content;
66
- switch (item.periodPickerSelectedValue) {
65
+ switch (PeriodPickerSelectedValue) {
67
66
  case 'date':
68
67
  content = /*#__PURE__*/_react.default.createElement(_FilterPanel.DatePickerContainer, {
69
68
  className: "DatePickerContainer"
@@ -165,7 +164,6 @@ const FilterPanel = props => {
165
164
  className: "Dropdown",
166
165
  name: ''.concat(item.name, '_Year'),
167
166
  reset: Reset,
168
- showPopupIcon: true,
169
167
  allowedInput: "all",
170
168
  dropdownListfontSize: "14px",
171
169
  labelColor: borderColor,
@@ -203,30 +201,7 @@ const FilterPanel = props => {
203
201
  });
204
202
  break;
205
203
  default:
206
- content = /*#__PURE__*/_react.default.createElement(_FilterPanel.PeriodPickerContainer, {
207
- className: "PeriodPickerContainer"
208
- }, /*#__PURE__*/_react.default.createElement(_Dropdown.Dropdown, {
209
- className: "Dropdown",
210
- name: ''.concat(item.name, '_Default'),
211
- reset: Reset,
212
- showPopupIcon: false,
213
- allowedInput: "all",
214
- dropdownListfontSize: "14px",
215
- labelColor: borderColor,
216
- limitTagsOnMultiSelect: 2,
217
- onInputChange: () => {},
218
- shape: "round",
219
- size: "large",
220
- text: "Select Dates",
221
- value: undefined,
222
- required: false,
223
- disabled: true,
224
- placeHolder: "Select Dates",
225
- placeHolderFontSize: "14px",
226
- onChange: () => {},
227
- options: [],
228
- width: "100%"
229
- }));
204
+ content = '';
230
205
  }
231
206
  return content;
232
207
  };
@@ -238,7 +213,6 @@ const FilterPanel = props => {
238
213
  className: "Dropdown",
239
214
  name: item.name,
240
215
  reset: Reset,
241
- showPopupIcon: true,
242
216
  allowedInput: "all",
243
217
  dropdownListfontSize: "14px",
244
218
  labelColor: borderColor,
@@ -246,7 +220,7 @@ const FilterPanel = props => {
246
220
  onInputChange: () => {},
247
221
  shape: "round",
248
222
  size: "large",
249
- text: !item.selectedValue ? item.labelEmptyValue || item.label : item.label,
223
+ text: item.label,
250
224
  value: item.selectedValue || undefined,
251
225
  required: item.required,
252
226
  disabled: item.disabled,
@@ -278,7 +252,6 @@ const FilterPanel = props => {
278
252
  className: "DropdownMulti",
279
253
  name: item.name,
280
254
  reset: Reset,
281
- showPopupIcon: true,
282
255
  allowedInput: "all",
283
256
  dropdownListfontSize: "14px",
284
257
  labelColor: borderColor,
@@ -286,7 +259,7 @@ const FilterPanel = props => {
286
259
  onInputChange: () => {},
287
260
  shape: "round",
288
261
  size: "large",
289
- text: !item.selectedValue ? item.labelEmptyValue || item.label : item.label,
262
+ text: item.label,
290
263
  value: item.selectedValue || undefined,
291
264
  required: item.required,
292
265
  disabled: item.disabled,
@@ -320,7 +293,7 @@ const FilterPanel = props => {
320
293
  className: "RangePicker",
321
294
  borderColor: borderColor,
322
295
  borderRadius: "12px",
323
- label: !item.selectedValue ? item.labelEmptyValue || item.label : item.label,
296
+ label: item.label,
324
297
  onChange: eventDatePicker => {
325
298
  const selectedValue = eventDatePicker && typeof eventDatePicker === 'string' ? "".concat(eventDatePicker) : undefined;
326
299
  const newFieldsDataState = FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => itemField.name === item.name ? {
@@ -350,7 +323,6 @@ const FilterPanel = props => {
350
323
  className: "Dropdown",
351
324
  name: item.name,
352
325
  reset: Reset,
353
- showPopupIcon: true,
354
326
  allowedInput: "all",
355
327
  dropdownListfontSize: "14px",
356
328
  labelColor: borderColor,
@@ -358,7 +330,7 @@ const FilterPanel = props => {
358
330
  onInputChange: () => {},
359
331
  shape: "round",
360
332
  size: "large",
361
- text: !item.periodPickerSelectedValue ? item.labelEmptyValue || item.label : item.label,
333
+ text: item.label,
362
334
  value: item.selectedValue || undefined,
363
335
  required: item.required,
364
336
  disabled: item.disabled,
@@ -366,12 +338,8 @@ const FilterPanel = props => {
366
338
  placeHolderFontSize: "14px",
367
339
  onChange: eventDropdownPeriodPicker => {
368
340
  var _eventDropdownPeriodP, _eventDropdownPeriodP2;
369
- const newPeriodPickerSelectedValue = eventDropdownPeriodPicker !== null && eventDropdownPeriodPicker !== void 0 && (_eventDropdownPeriodP = eventDropdownPeriodPicker.newValue) !== null && _eventDropdownPeriodP !== void 0 && _eventDropdownPeriodP.value ? "".concat(eventDropdownPeriodPicker === null || eventDropdownPeriodPicker === void 0 ? void 0 : (_eventDropdownPeriodP2 = eventDropdownPeriodPicker.newValue) === null || _eventDropdownPeriodP2 === void 0 ? void 0 : _eventDropdownPeriodP2.value) : undefined;
370
- const newFieldsDataState = FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => itemField.name === item.name ? {
371
- ...itemField,
372
- periodPickerSelectedValue: newPeriodPickerSelectedValue ? "".concat(newPeriodPickerSelectedValue) : undefined
373
- } : itemField);
374
- setFieldsDataState(newFieldsDataState);
341
+ const selectedValue = eventDropdownPeriodPicker !== null && eventDropdownPeriodPicker !== void 0 && (_eventDropdownPeriodP = eventDropdownPeriodPicker.newValue) !== null && _eventDropdownPeriodP !== void 0 && _eventDropdownPeriodP.value ? "".concat(eventDropdownPeriodPicker === null || eventDropdownPeriodPicker === void 0 ? void 0 : (_eventDropdownPeriodP2 = eventDropdownPeriodPicker.newValue) === null || _eventDropdownPeriodP2 === void 0 ? void 0 : _eventDropdownPeriodP2.value) : undefined;
342
+ setPeriodPickerSelectedValue(selectedValue);
375
343
  },
376
344
  options: item.dropdownOptions && item.dropdownOptions.length > 0 ? item.dropdownOptions : [],
377
345
  width: "100%"
@@ -379,7 +347,6 @@ const FilterPanel = props => {
379
347
  break;
380
348
  default:
381
349
  content = '';
382
- break;
383
350
  }
384
351
  return content;
385
352
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.609",
3
+ "version": "1.0.611",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {