iguazio.dashboard-react-controls 2.2.20 → 2.2.21

package/dist/components/index.js

@@ -136,4 +136,4 @@ var _TextTooltipTemplate = _interopRequireDefault(require("./TooltipTemplate/Tex
 var _Tip = _interopRequireDefault(require("./Tip/Tip"));
 var _Tooltip = _interopRequireDefault(require("./Tooltip/Tooltip"));
 var _Wizard = _interopRequireDefault(require("./Wizard/Wizard"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/dist/elements/FormActionButton/FormActionButton.js

@@ -8,7 +8,7 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _plus = require("../../images/plus.svg");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2019 Iguazio Systems Ltd.
 
@@ -43,7 +43,7 @@ const FormActionButton = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
     children: [!hidden && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "form-table__row form-table__action-row no-hover",
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-        "data-testid": id ? id : "".concat(fieldsPath, "-add-btn"),
+        "data-testid": id ? id : `${fieldsPath}-add-btn`,
         onClick: event => onClick(event, fields, fieldsPath),
         disabled: disabled,
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_plus.ReactComponent, {}), label]

package/dist/elements/FormRowActions/FormRowActions.js

@@ -13,7 +13,7 @@ var _edit = require("../../images/edit.svg");
 var _delete = require("../../images/delete.svg");
 var _checkmark = require("../../images/checkmark2.svg");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2019 Iguazio Systems Ltd.
 
@@ -35,7 +35,6 @@ such restriction.
 */
 
 const FormRowActions = _ref => {
-  var _editingItem$ui, _editingItem$ui2, _editingItem$ui3, _editingItem$ui4;
   let {
     applyChanges,
     deleteButtonIsHidden = false,
@@ -51,7 +50,7 @@ const FormRowActions = _ref => {
     className: "form-table__cell form-table__actions-cell"
   }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "form-table__cell form-table__actions-cell",
-    children: [(editingItem === null || editingItem === void 0 || (_editingItem$ui = editingItem.ui) === null || _editingItem$ui === void 0 ? void 0 : _editingItem$ui.index) === index && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [editingItem?.ui?.index === index && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.RoundedIcon, {
         id: "apply-btn",
         onClick: event => applyChanges(event, index),
@@ -61,11 +60,11 @@ const FormRowActions = _ref => {
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.RoundedIcon, {
         id: "delete-discard-btn",
         onClick: event => discardOrDelete(event, fieldsPath, index),
-        tooltipText: (_editingItem$ui2 = editingItem.ui) !== null && _editingItem$ui2 !== void 0 && _editingItem$ui2.isNew ? 'Delete' : 'Discard changes',
+        tooltipText: editingItem.ui?.isNew ? 'Delete' : 'Discard changes',
         disabled: disabled,
-        children: (_editingItem$ui3 = editingItem.ui) !== null && _editingItem$ui3 !== void 0 && _editingItem$ui3.isNew ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_delete.ReactComponent, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_close.ReactComponent, {})
+        children: editingItem.ui?.isNew ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_delete.ReactComponent, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_close.ReactComponent, {})
       })]
-    }), (!editingItem || (editingItem === null || editingItem === void 0 || (_editingItem$ui4 = editingItem.ui) === null || _editingItem$ui4 === void 0 ? void 0 : _editingItem$ui4.index) !== index) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    }), (!editingItem || editingItem?.ui?.index !== index) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.RoundedIcon, {
         id: "edit-btn",
         onClick: event => {

package/dist/elements/OptionsMenu/OptionsMenu.js

@@ -10,7 +10,7 @@ var _reactTransitionGroup = require("react-transition-group");
 var _components = require("../../components");
 require("./optionsMenu.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with
@@ -52,7 +52,7 @@ const OptionsMenu = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
         autoHorizontalPosition: true
       },
       style: {
-        minWidth: "".concat(dropdownWidth, "px")
+        minWidth: `${dropdownWidth}px`
       },
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
         className: "options-menu__body",

package/dist/elements/SelectOption/SelectOption.js

@@ -12,7 +12,7 @@ var _types = require("../../types");
 var _checkmark = require("../../images/checkmark.svg");
 require("./selectOption.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with
@@ -31,7 +31,6 @@ such restriction.
 */
 
 const SelectOption = _ref => {
-  var _item$labelHtml;
   let {
     item,
     name,
@@ -51,7 +50,7 @@ const SelectOption = _ref => {
         label: item.label,
         disabled: item.disabled || false,
         children: item.status && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: "state-".concat(item.status, "-job status")
+          className: `state-${item.status}-job status`
         })
       })
     });
@@ -74,9 +73,9 @@ const SelectOption = _ref => {
             className: "select__item-icon",
             children: item.icon
           }), item.status && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            className: "state-".concat(item.status, "-job status")
+            className: `state-${item.status}-job status`
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Tooltip, {
-            renderChildAsHtml: ((_item$labelHtml = item.labelHtml) === null || _item$labelHtml === void 0 ? void 0 : _item$labelHtml.length) > 0,
+            renderChildAsHtml: item.labelHtml?.length > 0,
             template: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.TextTooltipTemplate, {
               text: item.label
             }),

package/dist/elements/SelectOption/SelectOption.test.js

@@ -4,7 +4,7 @@ var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@testing-library/react");
 var _SelectOption = _interopRequireDefault(require("./SelectOption"));
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with
@@ -22,7 +22,7 @@ under the Apache 2.0 license is conditioned upon your compliance with
 such restriction.
 */
 
-const renderComponent = props => (0, _react2.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
+const renderComponent = props => (0, _react2.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
   ...props
 }));
 jest.mock('../../images/checkbox-unchecked.svg', () => ({
@@ -52,7 +52,7 @@ describe('SelectOption component', () => {
     expect(wrapper.queryByTestId('select-option')).not.toBeNull();
   });
   it('should display checkbox inside option if props selectType is "checkbox"', () => {
-    wrapper.rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
+    wrapper.rerender(/*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
       item: {
         label: 'Test1',
         id: 'test1'
@@ -67,7 +67,7 @@ describe('SelectOption component', () => {
   });
   it('should won\'t call onClick callback if props disable set to "true"', () => {
     const mockCLick = jest.fn();
-    wrapper.rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
+    wrapper.rerender(/*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
       item: {
         label: 'Test1',
         id: 'test1'
@@ -84,7 +84,7 @@ describe('SelectOption component', () => {
     expect(wrapper.queryByTestId('tooltip-wrapper')).not.toBeNull();
   });
   it('should add class "disabled" to SelectOption if props disabled set to "true"', () => {
-    wrapper.rerender( /*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
+    wrapper.rerender(/*#__PURE__*/(0, _jsxRuntime.jsx)(_SelectOption.default, {
       item: {
         label: 'Test1',
         id: 'test1'

package/dist/elements/ValidationTemplate/ValidationTemplate.js

@@ -11,7 +11,7 @@ var _success_done = require("../../images/success_done.svg");
 var _close = require("../../images/close.svg");
 require("./ValidationTemplate.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with

package/dist/elements/index.js

@@ -38,4 +38,4 @@ var _FormRowActions = _interopRequireDefault(require("./FormRowActions/FormRowAc
 var _OptionsMenu = _interopRequireDefault(require("./OptionsMenu/OptionsMenu"));
 var _SelectOption = _interopRequireDefault(require("./SelectOption/SelectOption"));
 var _ValidationTemplate = _interopRequireDefault(require("./ValidationTemplate/ValidationTemplate"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/dist/hooks/useChipCell.hook.js

@@ -39,16 +39,14 @@ const useChipCell = (isEditMode, visibleChipsMaxLength) => {
   const hiddenChipsCounterRef = (0, _react.useRef)();
   const hiddenChipsPopUpRef = (0, _react.useRef)();
   const handleShowElements = (0, _react.useCallback)(event => {
-    var _hiddenChipsCounterRe2;
     if (!isEditMode || isEditMode && visibleChipsMaxLength) {
-      var _hiddenChipsCounterRe;
-      if ((_hiddenChipsCounterRe = hiddenChipsCounterRef.current) !== null && _hiddenChipsCounterRe !== void 0 && _hiddenChipsCounterRe.contains(event.target) && !showHiddenChips) {
+      if (hiddenChipsCounterRef.current?.contains(event.target) && !showHiddenChips) {
         setShowHiddenChips(true);
       } else {
         setShowHiddenChips(false);
       }
     }
-    event && ((_hiddenChipsCounterRe2 = hiddenChipsCounterRef.current) === null || _hiddenChipsCounterRe2 === void 0 ? void 0 : _hiddenChipsCounterRe2.contains(event.target)) && event.stopPropagation();
+    event && hiddenChipsCounterRef.current?.contains(event.target) && event.stopPropagation();
   }, [isEditMode, showHiddenChips, visibleChipsMaxLength]);
   (0, _react.useEffect)(() => {
     if (showHiddenChips) {
@@ -57,7 +55,7 @@ const useChipCell = (isEditMode, visibleChipsMaxLength) => {
     return () => window.removeEventListener('click', handleShowElements, true);
   }, [showHiddenChips, handleShowElements]);
   const handleScroll = (0, _react.useCallback)(event => {
-    if (event.target.parentElement !== (hiddenChipsPopUpRef === null || hiddenChipsPopUpRef === void 0 ? void 0 : hiddenChipsPopUpRef.current)) {
+    if (event.target.parentElement !== hiddenChipsPopUpRef?.current) {
       setShowHiddenChips(false);
     }
   }, [hiddenChipsPopUpRef]);
@@ -68,11 +66,10 @@ const useChipCell = (isEditMode, visibleChipsMaxLength) => {
     return () => window.removeEventListener('scroll', handleScroll, true);
   }, [handleScroll, showHiddenChips]);
   const resizeChipCell = (0, _react.useCallback)(() => {
-    if (hiddenChipsPopUpRef !== null && hiddenChipsPopUpRef !== void 0 && hiddenChipsPopUpRef.current) {
-      var _hiddenChipsCounterRe3;
+    if (hiddenChipsPopUpRef?.current) {
       const scrollableParent = (0, _getFirstScrollableParent.getFirstScrollableParent)(hiddenChipsCounterRef.current.offsetParent);
       const scrollableParentRect = scrollableParent.getBoundingClientRect();
-      const hiddenChipsCounterRect = (_hiddenChipsCounterRe3 = hiddenChipsCounterRef.current) === null || _hiddenChipsCounterRe3 === void 0 ? void 0 : _hiddenChipsCounterRe3.getBoundingClientRect();
+      const hiddenChipsCounterRect = hiddenChipsCounterRef.current?.getBoundingClientRect();
 
       // Check if the hiddenChipsCounterRect is outside the boundaries of the scrollableParentRect or the window
       if (hiddenChipsCounterRect.left < scrollableParentRect.left || hiddenChipsCounterRect.top < scrollableParentRect.top || hiddenChipsCounterRect.right > scrollableParentRect.right || hiddenChipsCounterRect.bottom > scrollableParentRect.bottom || hiddenChipsCounterRect.right > window.innerWidth || hiddenChipsCounterRect.bottom > window.innerHeight) {
@@ -80,8 +77,7 @@ const useChipCell = (isEditMode, visibleChipsMaxLength) => {
       }
     }
     if (!isEditMode && !(0, _common.isEveryObjectValueEmpty)(chipsSizes)) {
-      var _chipsCellRef$current;
-      const parentSize = (_chipsCellRef$current = chipsCellRef.current) === null || _chipsCellRef$current === void 0 ? void 0 : _chipsCellRef$current.getBoundingClientRect().width;
+      const parentSize = chipsCellRef.current?.getBoundingClientRect().width;
       let maxLength = 0;
       let chipIndex = 0;
       const padding = 65;

package/dist/hooks/useFormTable.hook.js

@@ -52,9 +52,9 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
   const bottomScrollRef = (0, _react.useRef)(null);
   const onExitEditModeCallbackRef = (0, _react.useRef)(onExitEditModeCallback);
   (0, _react.useLayoutEffect)(() => {
-    const tableErrors = (0, _lodash.get)(formState === null || formState === void 0 ? void 0 : formState.errors, editingItem === null || editingItem === void 0 ? void 0 : editingItem.ui.fieldsPath, []);
-    editingItemErrorsRef.current = (0, _lodash.get)(tableErrors, editingItem === null || editingItem === void 0 ? void 0 : editingItem.ui.index, null);
-  }, [editingItem === null || editingItem === void 0 ? void 0 : editingItem.ui.fieldsPath, editingItem === null || editingItem === void 0 ? void 0 : editingItem.ui.index, formState === null || formState === void 0 ? void 0 : formState.errors]);
+    const tableErrors = (0, _lodash.get)(formState?.errors, editingItem?.ui.fieldsPath, []);
+    editingItemErrorsRef.current = (0, _lodash.get)(tableErrors, editingItem?.ui.index, null);
+  }, [editingItem?.ui.fieldsPath, editingItem?.ui.index, formState?.errors]);
   (0, _react.useLayoutEffect)(() => {
     formStateRef.current = formState;
   }, [formState]);
@@ -62,41 +62,33 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
     onExitEditModeCallbackRef.current = onExitEditModeCallback;
   }, [onExitEditModeCallback]);
   const exitEditMode = () => {
-    var _editingItemRef$curre;
-    if ((_editingItemRef$curre = editingItemRef.current) !== null && _editingItemRef$curre !== void 0 && _editingItemRef$curre.data) {
-      var _editingItemRef$curre2;
-      Object.entries((_editingItemRef$curre2 = editingItemRef.current) === null || _editingItemRef$curre2 === void 0 ? void 0 : _editingItemRef$curre2.data).forEach(_ref => {
-        var _formStateRef$current, _editingItemRef$curre3, _editingItemRef$curre4;
+    if (editingItemRef.current?.data) {
+      Object.entries(editingItemRef.current?.data).forEach(_ref => {
         let [fieldName] = _ref;
-        (_formStateRef$current = formStateRef.current) === null || _formStateRef$current === void 0 || _formStateRef$current.form.mutators.setFieldState("".concat((_editingItemRef$curre3 = editingItemRef.current) === null || _editingItemRef$curre3 === void 0 ? void 0 : _editingItemRef$curre3.ui.fieldsPath, "[").concat((_editingItemRef$curre4 = editingItemRef.current) === null || _editingItemRef$curre4 === void 0 ? void 0 : _editingItemRef$curre4.ui.index, "].data.").concat(fieldName), {
+        formStateRef.current?.form.mutators.setFieldState(`${editingItemRef.current?.ui.fieldsPath}[${editingItemRef.current?.ui.index}].data.${fieldName}`, {
           modified: false
         });
       });
     }
     editingItemRef.current = null;
     setEditingItem(null);
-    (onExitEditModeCallbackRef === null || onExitEditModeCallbackRef === void 0 ? void 0 : onExitEditModeCallbackRef.current) && onExitEditModeCallbackRef.current();
+    onExitEditModeCallbackRef?.current && onExitEditModeCallbackRef.current();
   };
   (0, _react.useEffect)(() => {
     const applyOrDiscardOrDeleteInEffect = () => {
-      if (editingItemRef !== null && editingItemRef !== void 0 && editingItemRef.current) {
+      if (editingItemRef?.current) {
         if (!editingItemErrorsRef.current) {
           exitEditMode();
         } else {
-          var _editingItemRef$curre5;
-          if ((_editingItemRef$curre5 = editingItemRef.current) !== null && _editingItemRef$curre5 !== void 0 && (_editingItemRef$curre5 = _editingItemRef$curre5.ui) !== null && _editingItemRef$curre5 !== void 0 && _editingItemRef$curre5.isNew) {
-            var _editingItemRef$curre6;
-            const values = (0, _lodash.get)(formStateRef.current.values, (_editingItemRef$curre6 = editingItemRef.current) === null || _editingItemRef$curre6 === void 0 ? void 0 : _editingItemRef$curre6.ui.fieldsPath);
-            if ((values === null || values === void 0 ? void 0 : values.length) > 1) {
-              var _editingItemRef$curre7, _editingItemRef$curre8;
-              formStateRef.current.form.mutators.remove((_editingItemRef$curre7 = editingItemRef.current) === null || _editingItemRef$curre7 === void 0 ? void 0 : _editingItemRef$curre7.ui.fieldsPath, (_editingItemRef$curre8 = editingItemRef.current) === null || _editingItemRef$curre8 === void 0 ? void 0 : _editingItemRef$curre8.ui.index);
+          if (editingItemRef.current?.ui?.isNew) {
+            const values = (0, _lodash.get)(formStateRef.current.values, editingItemRef.current?.ui.fieldsPath);
+            if (values?.length > 1) {
+              formStateRef.current.form.mutators.remove(editingItemRef.current?.ui.fieldsPath, editingItemRef.current?.ui.index);
             } else {
-              var _editingItemRef$curre9;
-              formStateRef.current.form.change((_editingItemRef$curre9 = editingItemRef.current) === null || _editingItemRef$curre9 === void 0 ? void 0 : _editingItemRef$curre9.ui.fieldsPath, []);
+              formStateRef.current.form.change(editingItemRef.current?.ui.fieldsPath, []);
             }
           } else {
-            var _editingItemRef$curre10, _editingItemRef$curre11;
-            formStateRef.current.form.mutators.update((_editingItemRef$curre10 = editingItemRef.current) === null || _editingItemRef$curre10 === void 0 ? void 0 : _editingItemRef$curre10.ui.fieldsPath, (_editingItemRef$curre11 = editingItemRef.current) === null || _editingItemRef$curre11 === void 0 ? void 0 : _editingItemRef$curre11.ui.index, (0, _lodash.omit)(editingItemRef.current, ['ui']));
+            formStateRef.current.form.mutators.update(editingItemRef.current?.ui.fieldsPath, editingItemRef.current?.ui.index, (0, _lodash.omit)(editingItemRef.current, ['ui']));
           }
           exitEditMode();
         }
@@ -110,13 +102,12 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
     applyOrDiscardOrDelete(event);
     formStateRef.current.form.mutators.push(fieldsPath, newItem);
     setEditingItem(() => {
-      var _fields$value;
       const newEditingItem = {
         ...newItem,
         ui: {
           isNew: true,
           fieldsPath,
-          index: ((_fields$value = fields.value) === null || _fields$value === void 0 ? void 0 : _fields$value.length) || 0
+          index: fields.value?.length || 0
         }
       };
       editingItemRef.current = newEditingItem;
@@ -127,18 +118,15 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
   const applyChanges = (event, index) => {
     if (editingItemRef.current) {
       if (!editingItemErrorsRef.current) {
-        var _editingItemRef$curre12;
-        if ((_editingItemRef$curre12 = editingItemRef.current) !== null && _editingItemRef$curre12 !== void 0 && _editingItemRef$curre12.ui.isNew) {
+        if (editingItemRef.current?.ui.isNew) {
           scrollIntoView();
         }
         exitEditMode();
       } else {
-        var _editingItemErrorsRef;
         // Mark all empty fields as `modified` in order to highlight the error if the field is invalid
-        Object.entries((_editingItemErrorsRef = editingItemErrorsRef.current) === null || _editingItemErrorsRef === void 0 ? void 0 : _editingItemErrorsRef.data).forEach(_ref2 => {
-          var _formStateRef$current2, _editingItemRef$curre13;
+        Object.entries(editingItemErrorsRef.current?.data).forEach(_ref2 => {
           let [fieldName] = _ref2;
-          (_formStateRef$current2 = formStateRef.current) === null || _formStateRef$current2 === void 0 || _formStateRef$current2.form.mutators.setFieldState("".concat((_editingItemRef$curre13 = editingItemRef.current) === null || _editingItemRef$curre13 === void 0 ? void 0 : _editingItemRef$curre13.ui.fieldsPath, "[").concat(index, "].data.").concat(fieldName), {
+          formStateRef.current?.form.mutators.setFieldState(`${editingItemRef.current?.ui.fieldsPath}[${index}].data.${fieldName}`, {
             modified: true
           });
         });
@@ -150,7 +138,7 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
       applyOrDiscardOrDelete(event);
     }
     const values = (0, _lodash.get)(formStateRef.current.values, fieldsPath);
-    if ((values === null || values === void 0 ? void 0 : values.length) > 1) {
+    if (values?.length > 1) {
       formStateRef.current.form.mutators.remove(fieldsPath, index);
     } else {
       formStateRef.current.form.change(fieldsPath, []);
@@ -164,8 +152,7 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
     event && event.stopPropagation();
   };
   const discardOrDelete = (event, fieldsPath, index) => {
-    var _editingItemRef$curre14;
-    if (!editingItemRef.current || (_editingItemRef$curre14 = editingItemRef.current) !== null && _editingItemRef$curre14 !== void 0 && (_editingItemRef$curre14 = _editingItemRef$curre14.ui) !== null && _editingItemRef$curre14 !== void 0 && _editingItemRef$curre14.isNew) {
+    if (!editingItemRef.current || editingItemRef.current?.ui?.isNew) {
       deleteRow(event, fieldsPath, index);
     } else {
       discardChanges(event, fieldsPath, index);
@@ -173,13 +160,11 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
   };
   const applyOrDiscardOrDelete = function () {
     let event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-    if (editingItemRef !== null && editingItemRef !== void 0 && editingItemRef.current) {
+    if (editingItemRef?.current) {
       if (!editingItemErrorsRef.current) {
-        var _editingItemRef$curre15;
-        applyChanges(event, (_editingItemRef$curre15 = editingItemRef.current) === null || _editingItemRef$curre15 === void 0 ? void 0 : _editingItemRef$curre15.ui.index);
+        applyChanges(event, editingItemRef.current?.ui.index);
       } else {
-        var _editingItemRef$curre16, _editingItemRef$curre17;
-        discardOrDelete(event, (_editingItemRef$curre16 = editingItemRef.current) === null || _editingItemRef$curre16 === void 0 ? void 0 : _editingItemRef$curre16.ui.fieldsPath, (_editingItemRef$curre17 = editingItemRef.current) === null || _editingItemRef$curre17 === void 0 ? void 0 : _editingItemRef$curre17.ui.index);
+        discardOrDelete(event, editingItemRef.current?.ui.fieldsPath, editingItemRef.current?.ui.index);
       }
     }
   };
@@ -211,11 +196,11 @@ const useFormTable = (formState, exitEditModeTriggerItem, onExitEditModeCallback
     }
   };
   const isCurrentRowEditing = rowPath => {
-    return (editingItemRef === null || editingItemRef === void 0 ? void 0 : editingItemRef.current) && "".concat(editingItemRef.current.ui.fieldsPath, "[").concat(editingItemRef.current.ui.index, "]") === rowPath;
+    return editingItemRef?.current && `${editingItemRef.current.ui.fieldsPath}[${editingItemRef.current.ui.index}]` === rowPath;
   };
   const getTableArrayErrors = fieldsPath => {
     if (formState.submitFailed && formState.invalid) {
-      return (0, _lodash.get)(formState, "errors.".concat(fieldsPath, ".").concat(_finalForm.ARRAY_ERROR), []);
+      return (0, _lodash.get)(formState, `errors.${fieldsPath}.${_finalForm.ARRAY_ERROR}`, []);
     } else {
       return [];
     }

package/dist/hooks/useHiddenChipsBlock.hook.js

@@ -7,7 +7,7 @@ exports.useHiddenChipsBlock = void 0;
 var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _common = require("../utils/common.util");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2019 Iguazio Systems Ltd.
 
@@ -35,7 +35,7 @@ const useHiddenChipsBlock = (hiddenChipsCounterRef, hiddenChipsPopUpRef) => {
   const transitionEndEventName = (0, _react.useMemo)(() => (0, _common.getTransitionEndEventName)(), []);
   const hiddenChipsBlockClassNames = (0, _classnames.default)('chip-block-hidden', isTop ? 'chip-block-hidden_top' : 'chip-block-hidden_bottom', isLeft ? 'chip-block-hidden_left' : 'chip-block-hidden_right', isVisible && 'chip-block-hidden_visible');
   const resizePopUp = (0, _react.useCallback)(() => {
-    if (hiddenChipsPopUpRef !== null && hiddenChipsPopUpRef !== void 0 && hiddenChipsPopUpRef.current && hiddenChipsCounterRef !== null && hiddenChipsCounterRef !== void 0 && hiddenChipsCounterRef.current) {
+    if (hiddenChipsPopUpRef?.current && hiddenChipsCounterRef?.current) {
       const offset = 10;
       const offsetMargin = 20;
       const elementRect = hiddenChipsCounterRef.current.getBoundingClientRect();
@@ -59,10 +59,10 @@ const useHiddenChipsBlock = (hiddenChipsCounterRef, hiddenChipsPopUpRef) => {
         // Compare elementRect.left and elementRectRight to choose the larger value as the max width
         isLeftPosition = elementRect.left > elementRectRight;
         const popUpMaxWidth = Math.max(elementRect.left, elementRectRight);
-        hiddenChipsPopUpRef.current.style.maxWidth = "".concat(popUpMaxWidth, "px");
+        hiddenChipsPopUpRef.current.style.maxWidth = `${popUpMaxWidth}px`;
       }
-      hiddenChipsPopUpRef.current.style.right = isLeftPosition ? "".concat(elementRectRight, "px") : 'unset';
-      hiddenChipsPopUpRef.current.style.left = isLeftPosition ? 'unset' : "".concat(elementRect.left, "px");
+      hiddenChipsPopUpRef.current.style.right = isLeftPosition ? `${elementRectRight}px` : 'unset';
+      hiddenChipsPopUpRef.current.style.left = isLeftPosition ? 'unset' : `${elementRect.left}px`;
 
       // Determine if the top position is preferred based on the element's position and available height
       if (elementRect.top > hiddenChipsPopUpRef.current.clientHeight + offset + offsetMargin) {
@@ -73,17 +73,17 @@ const useHiddenChipsBlock = (hiddenChipsCounterRef, hiddenChipsPopUpRef) => {
         // Compare elementRect.top and elementRectBottom to choose the larger value as the max height
         isTopPosition = elementRect.top > elementRectBottom + offset;
         const popUpMaxHeight = Math.max(elementRect.top, elementRectBottom) - offset - offsetMargin;
-        hiddenChipsPopUpRef.current.style.maxHeight = "".concat(popUpMaxHeight, "px");
+        hiddenChipsPopUpRef.current.style.maxHeight = `${popUpMaxHeight}px`;
       }
-      hiddenChipsPopUpRef.current.style.bottom = isTopPosition ? "".concat(elementRectBottom + elementRect.height + offset, "px") : 'unset';
-      hiddenChipsPopUpRef.current.style.top = isTopPosition ? 'unset' : "".concat(elementRect.bottom + offset, "px");
+      hiddenChipsPopUpRef.current.style.bottom = isTopPosition ? `${elementRectBottom + elementRect.height + offset}px` : 'unset';
+      hiddenChipsPopUpRef.current.style.top = isTopPosition ? 'unset' : `${elementRect.bottom + offset}px`;
       setIsTop(isTopPosition);
       setIsLeft(isLeftPosition);
       setIsVisible(true);
     }
   }, [hiddenChipsCounterRef, hiddenChipsPopUpRef]);
   (0, _react.useEffect)(() => {
-    if (hiddenChipsPopUpRef !== null && hiddenChipsPopUpRef !== void 0 && hiddenChipsPopUpRef.current && hiddenChipsCounterRef !== null && hiddenChipsCounterRef !== void 0 && hiddenChipsCounterRef.current) {
+    if (hiddenChipsPopUpRef?.current && hiddenChipsCounterRef?.current) {
       window.addEventListener('resize', resizePopUp);
       window.addEventListener(transitionEndEventName, resizePopUp);
       return () => {

package/dist/types.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.WIZARD_STEPS_CONFIG = exports.SORT_PROPS = exports.SELECT_OPTIONS = exports.SELECT_OPTION = exports.POP_UP_CUSTOM_POSITION = exports.MODAL_SIZES = exports.INPUT_VALIDATION_RULES = exports.INPUT_LINK = exports.FORM_TABLE_EDITING_ITEM = exports.EXCLUDE_SORT_BY = exports.DEFAULT_SORT_BY = exports.CONFIRM_DIALOG_SUBMIT_BUTTON = exports.CONFIRM_DIALOG_MESSAGE = exports.CONFIRM_DIALOG_CANCEL_BUTTON = exports.COMBOBOX_VALIDATION_RULES = exports.COMBOBOX_SUGGESTION_LIST = exports.COMBOBOX_SELECT_OPTIONS = exports.CHIP_OPTIONS = exports.CHIP_INPUT_LIST = exports.CHIPS = exports.CHIP = exports.BUTTON_VARIANTS = exports.ALLOW_SORT_BY = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _constants = require("./constants");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*
 Copyright 2022 Iguazio Systems Ltd.
 Licensed under the Apache License, Version 2.0 (the "License") with

package/dist/utils/generateChipsList.util.js

@@ -22,7 +22,7 @@ such restriction.
 */
 const generateChipsList = (chips, maxLength) => {
   if (chips.length > maxLength) {
-    let hiddenChipsNumber = "+ ".concat(chips.length - maxLength);
+    let hiddenChipsNumber = `+ ${chips.length - maxLength}`;
     const hiddenChips = chips.slice(maxLength);
     const visibleChips = chips.slice(0, maxLength);
     return {

package/dist/utils/validation.util.js

@@ -179,7 +179,7 @@ const generateRule = {
   noConsecutiveCharacters: chars => {
     const convertedPattern = chars.split(' ').map(charPair => {
       const charsPairArray = charPair.split('');
-      return "(?!.*\\".concat(charsPairArray[0], "\\").concat(charsPairArray[1], ")");
+      return `(?!.*\\${charsPairArray[0]}\\${charsPairArray[1]})`;
     }).join('');
     return {
       name: _constants.validation.NO_CONSECUTIVE_CHARACTER.NAME,
@@ -197,7 +197,7 @@ const generateRule = {
   maxLengthBetweenDelimiters: (delimiter, maxLength, delimiterDescription) => {
     return {
       name: 'labelsLength',
-      label: "Max length between two ".concat(_lodash.default.defaultTo(delimiterDescription, delimiter), ": ").concat(maxLength),
+      label: `Max length between two ${_lodash.default.defaultTo(delimiterDescription, delimiter)}: ${maxLength}`,
       pattern: value => {
         return value.split(delimiter).every(item => {
           return item.length >= 1 && item.length <= maxLength;
@@ -239,11 +239,11 @@ const generateRule = {
 const commonRules = {
   prefixedQualifiedName: [{
     name: 'nameValidCharacters',
-    label: "[Name] ".concat(_constants.validation.VALID_CHARACTERS.LABEL, " : a\u2013z, A\u2013Z, 0\u20139, \u2013, _, ."),
+    label: `[Name] ${_constants.validation.VALID_CHARACTERS.LABEL} : a–z, A–Z, 0–9, –, _, .`,
     pattern: /^([^/]+\/)?[\w.-]+$/
   }, {
     name: 'nameBeginEnd',
-    label: "[Name] ".concat(_constants.validation.BEGIN_END_WITH.LABEL, ": a\u2013z, A\u2013Z, 0\u20139"),
+    label: `[Name] ${_constants.validation.BEGIN_END_WITH.LABEL}: a–z, A–Z, 0–9`,
     pattern: /^([^/]+\/)?([A-Za-z0-9][^/]*)?[A-Za-z0-9]$/
   }, {
     name: 'nameMaxLength',
@@ -251,11 +251,11 @@ const commonRules = {
     pattern: /^([^/]+\/)?[^/]{1,63}$/
   }, {
     name: 'prefixValidCharacters',
-    label: "[Prefix] ".concat(_constants.validation.VALID_CHARACTERS.LABEL, ": a\u2013z, 0\u20139, \u2013, ."),
+    label: `[Prefix] ${_constants.validation.VALID_CHARACTERS.LABEL}: a–z, 0–9, –, .`,
     pattern: /^([a-z0-9.-]+\/)?[^/]+$/
   }, {
     name: 'prefixBeginEnd',
-    label: "[Prefix] ".concat(_constants.validation.BEGIN_END_WITH.LABEL, ": a\u2013z, 0\u20139"),
+    label: `[Prefix] ${_constants.validation.BEGIN_END_WITH.LABEL}: a–z, 0–9`,
     pattern: /^([a-z0-9]([^/]*[a-z0-9])?\/)?[^/]+$/
   }, {
     name: 'prefixMaxLength',

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "iguazio.dashboard-react-controls",
-    "version": "2.2.20",
+    "version": "2.2.21",
     "description": "Collection of resources (such as CSS styles, fonts and images) and ReactJS 17.x components to share among different Iguazio React repos.",
     "main": "dist/index.js",
     "module": "dist/index.js",