@lanaco/lnc-react-ui 2.1.36 → 2.1.39

package/lib/index.esm.js

@@ -33896,19 +33896,41 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
       value = props.value,
       onChange = props.onChange;
 
-  var _useState = useState(value ? value : ""),
+  var _useState = useState(""),
       _useState2 = _slicedToArray(_useState, 2),
-      val = _useState2[0],
-      setVal = _useState2[1];
+      text = _useState2[0],
+      setText = _useState2[1];
+
+  var _useState3 = useState(true),
+      _useState4 = _slicedToArray(_useState3, 2),
+      isFirst = _useState4[0],
+      setIsFirst = _useState4[1];
+
+  useEffect(function () {
+    if (text !== value) setText(value === null ? "" : value);
+  }, [value]);
+  useEffect(function () {
+    var timeOutId = setTimeout(function () {
+      return handleDelayedOnChange();
+    }, 350);
+    return function () {
+      return clearTimeout(timeOutId);
+    };
+  }, [text]);
+
+  var handleDelayedOnChange = function handleDelayedOnChange() {
+    if (!isFirst) onChange(id, text);
+    if (isFirst) setIsFirst(false);
+  };
 
   var handleOnChange = function handleOnChange(e) {
     if (preventDefault) e.preventDefault();
-    setVal(e.target.value);
+    setText(e.target.value);
   };
 
   var handleOnBlur = function handleOnBlur(e) {
     if (preventDefault) e.preventDefault();
-    onChange(id, val);
+    onChange(id, text);
   };
 
   return /*#__PURE__*/React__default.createElement(StyledTextInput$1, {
@@ -33918,7 +33940,7 @@ var TextArea = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
     onChange: handleOnChange,
     className: className,
     disabled: disabled,
-    value: val,
+    value: text,
     ref: ref,
     onFocus: function onFocus(e) {
       e.target.style.whiteSpace = "inherit";
@@ -41798,7 +41820,8 @@ function Modal$1(props) {
       clickOutsideToClose = props.clickOutsideToClose,
       showHeader = props.showHeader,
       width = props.width,
-      basic = props.basic;
+      basic = props.basic,
+      headerTitleComponent = props.headerTitleComponent;
   var themeProps = {
     theme: theme,
     size: size,
@@ -41835,7 +41858,7 @@ function Modal$1(props) {
     animate: "isOpen",
     exit: "exit",
     variants: containerVariant
-  }), showHeader && /*#__PURE__*/React__default.createElement(Header$1, themeProps, /*#__PURE__*/React__default.createElement(Title$1, themeProps, header), /*#__PURE__*/React__default.createElement(CloseButton$1, themeProps, /*#__PURE__*/React__default.createElement(Button$1, _extends$d({}, themeProps, {
+  }), showHeader && /*#__PURE__*/React__default.createElement(Header$1, themeProps, headerTitleComponent !== undefined && headerTitleComponent !== null && /*#__PURE__*/React__default.isValidElement(headerTitleComponent) ? headerTitleComponent : /*#__PURE__*/React__default.createElement(Title$1, themeProps, header), /*#__PURE__*/React__default.createElement(CloseButton$1, themeProps, /*#__PURE__*/React__default.createElement(Button$1, _extends$d({}, themeProps, {
     icon: "times",
     iconStyle: "solid",
     onClick: function onClick(e) {
@@ -41871,7 +41894,8 @@ Modal$1.propTypes = {
   clickOutsideToClose: PropTypes.bool,
   width: PropTypes.string,
   size: PropTypes.oneOf(["small", "medium", "large"]),
-  color: PropTypes.oneOf(["primary", "secondary", "success", "error", "warning", "gray", "background"])
+  color: PropTypes.oneOf(["primary", "secondary", "success", "error", "warning", "gray", "background"]),
+  headerTitleComponent: PropTypes.node
 };
 
 var Container$i = newStyled.div(function (props) {
@@ -42351,7 +42375,7 @@ var TableView = function TableView(props) {
     var tabIndex = rowIndex * Columns.length + cellIndex + 50;
 
     var onClick = function onClick() {
-      ChangeToFormView(dataItem, rowIndex);
+      props.disabled ? null : ChangeToFormView(dataItem, rowIndex);
     };
 
     if (!EnableFormView) onClick = function onClick() {};
@@ -42386,7 +42410,8 @@ var TableView = function TableView(props) {
             LookupTakeItem(dataItem);
           }
         },
-        icon: "arrow-right"
+        icon: "arrow-right",
+        disabled: props.disabled
       }));
     }
 
@@ -42399,7 +42424,8 @@ var TableView = function TableView(props) {
       onChange: function onChange(e, val) {
         return handleOnSelection(dataItem, val);
       },
-      id: rowIndex
+      id: rowIndex,
+      disabled: props.disabled
     }));
   };
 
@@ -42444,7 +42470,8 @@ var TableView = function TableView(props) {
     if (IsLookup) return /*#__PURE__*/React__default.createElement(TableHeadCell$1, {
       selectionCell: true,
       key: -1,
-      title: title
+      title: title,
+      disabled: props.disabled
     });
     if (!EnableSelection || ReadOnly || IsLookup && SelectionType === TableSelectionType.SINGLE) return /*#__PURE__*/React__default.createElement(React__default.Fragment, null);
     return /*#__PURE__*/React__default.createElement(TableHeadCell$1, {
@@ -42456,7 +42483,8 @@ var TableView = function TableView(props) {
       onChange: function onChange() {
         return handleSelectAll(!SelectedEntirePage);
       },
-      id: "SelectedEntirePage"
+      id: "SelectedEntirePage",
+      disabled: props.disabled
     }));
   };
 
@@ -43026,7 +43054,7 @@ var DataView = function DataView(props) {
       onClick: loading ? function () {} : function () {
         return setDeleteConfirmationBoxOpen(true);
       },
-      disabled: Table.SelectedData.length === 0,
+      disabled: props.disabled || Table.SelectedData.length === 0,
       tooltip: Localization.DeleteSelected,
       icon: "trash",
       inverted: true
@@ -43057,7 +43085,8 @@ var DataView = function DataView(props) {
       tooltip: Localization.Add,
       onClick: freezeLoading() ? function () {} : GoToAdd,
       icon: "plus",
-      inverted: true
+      inverted: true,
+      disabled: props.disabled
     }));
     return null;
   };
@@ -43128,7 +43157,8 @@ var DataView = function DataView(props) {
       Localization: Localization.TableView,
       Export: Export,
       Icons: Icons,
-      accentColor: props.accentColor
+      accentColor: props.accentColor,
+      disabled: props.disabled
     }));
   };
 

package/lib/index.js

@@ -33937,19 +33937,41 @@ var TextArea = /*#__PURE__*/React__default['default'].forwardRef(function (props
       value = props.value,
       onChange = props.onChange;
 
-  var _useState = React.useState(value ? value : ""),
+  var _useState = React.useState(""),
       _useState2 = _slicedToArray__default['default'](_useState, 2),
-      val = _useState2[0],
-      setVal = _useState2[1];
+      text = _useState2[0],
+      setText = _useState2[1];
+
+  var _useState3 = React.useState(true),
+      _useState4 = _slicedToArray__default['default'](_useState3, 2),
+      isFirst = _useState4[0],
+      setIsFirst = _useState4[1];
+
+  React.useEffect(function () {
+    if (text !== value) setText(value === null ? "" : value);
+  }, [value]);
+  React.useEffect(function () {
+    var timeOutId = setTimeout(function () {
+      return handleDelayedOnChange();
+    }, 350);
+    return function () {
+      return clearTimeout(timeOutId);
+    };
+  }, [text]);
+
+  var handleDelayedOnChange = function handleDelayedOnChange() {
+    if (!isFirst) onChange(id, text);
+    if (isFirst) setIsFirst(false);
+  };
 
   var handleOnChange = function handleOnChange(e) {
     if (preventDefault) e.preventDefault();
-    setVal(e.target.value);
+    setText(e.target.value);
   };
 
   var handleOnBlur = function handleOnBlur(e) {
     if (preventDefault) e.preventDefault();
-    onChange(id, val);
+    onChange(id, text);
   };
 
   return /*#__PURE__*/React__default['default'].createElement(StyledTextInput$1, {
@@ -33959,7 +33981,7 @@ var TextArea = /*#__PURE__*/React__default['default'].forwardRef(function (props
     onChange: handleOnChange,
     className: className,
     disabled: disabled,
-    value: val,
+    value: text,
     ref: ref,
     onFocus: function onFocus(e) {
       e.target.style.whiteSpace = "inherit";
@@ -41839,7 +41861,8 @@ function Modal$1(props) {
       clickOutsideToClose = props.clickOutsideToClose,
       showHeader = props.showHeader,
       width = props.width,
-      basic = props.basic;
+      basic = props.basic,
+      headerTitleComponent = props.headerTitleComponent;
   var themeProps = {
     theme: theme,
     size: size,
@@ -41876,7 +41899,7 @@ function Modal$1(props) {
     animate: "isOpen",
     exit: "exit",
     variants: containerVariant
-  }), showHeader && /*#__PURE__*/React__default['default'].createElement(Header$1, themeProps, /*#__PURE__*/React__default['default'].createElement(Title$1, themeProps, header), /*#__PURE__*/React__default['default'].createElement(CloseButton$1, themeProps, /*#__PURE__*/React__default['default'].createElement(Button$1, _extends__default['default']({}, themeProps, {
+  }), showHeader && /*#__PURE__*/React__default['default'].createElement(Header$1, themeProps, headerTitleComponent !== undefined && headerTitleComponent !== null && /*#__PURE__*/React__default['default'].isValidElement(headerTitleComponent) ? headerTitleComponent : /*#__PURE__*/React__default['default'].createElement(Title$1, themeProps, header), /*#__PURE__*/React__default['default'].createElement(CloseButton$1, themeProps, /*#__PURE__*/React__default['default'].createElement(Button$1, _extends__default['default']({}, themeProps, {
     icon: "times",
     iconStyle: "solid",
     onClick: function onClick(e) {
@@ -41912,7 +41935,8 @@ Modal$1.propTypes = {
   clickOutsideToClose: PropTypes__default['default'].bool,
   width: PropTypes__default['default'].string,
   size: PropTypes__default['default'].oneOf(["small", "medium", "large"]),
-  color: PropTypes__default['default'].oneOf(["primary", "secondary", "success", "error", "warning", "gray", "background"])
+  color: PropTypes__default['default'].oneOf(["primary", "secondary", "success", "error", "warning", "gray", "background"]),
+  headerTitleComponent: PropTypes__default['default'].node
 };
 
 var Container$i = newStyled.div(function (props) {
@@ -42392,7 +42416,7 @@ var TableView = function TableView(props) {
     var tabIndex = rowIndex * Columns.length + cellIndex + 50;
 
     var onClick = function onClick() {
-      ChangeToFormView(dataItem, rowIndex);
+      props.disabled ? null : ChangeToFormView(dataItem, rowIndex);
     };
 
     if (!EnableFormView) onClick = function onClick() {};
@@ -42427,7 +42451,8 @@ var TableView = function TableView(props) {
             LookupTakeItem(dataItem);
           }
         },
-        icon: "arrow-right"
+        icon: "arrow-right",
+        disabled: props.disabled
       }));
     }
 
@@ -42440,7 +42465,8 @@ var TableView = function TableView(props) {
       onChange: function onChange(e, val) {
         return handleOnSelection(dataItem, val);
       },
-      id: rowIndex
+      id: rowIndex,
+      disabled: props.disabled
     }));
   };
 
@@ -42485,7 +42511,8 @@ var TableView = function TableView(props) {
     if (IsLookup) return /*#__PURE__*/React__default['default'].createElement(TableHeadCell$1, {
       selectionCell: true,
       key: -1,
-      title: title
+      title: title,
+      disabled: props.disabled
     });
     if (!EnableSelection || ReadOnly || IsLookup && SelectionType === TableSelectionType.SINGLE) return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null);
     return /*#__PURE__*/React__default['default'].createElement(TableHeadCell$1, {
@@ -42497,7 +42524,8 @@ var TableView = function TableView(props) {
       onChange: function onChange() {
         return handleSelectAll(!SelectedEntirePage);
       },
-      id: "SelectedEntirePage"
+      id: "SelectedEntirePage",
+      disabled: props.disabled
     }));
   };
 
@@ -43067,7 +43095,7 @@ var DataView = function DataView(props) {
       onClick: loading ? function () {} : function () {
         return setDeleteConfirmationBoxOpen(true);
       },
-      disabled: Table.SelectedData.length === 0,
+      disabled: props.disabled || Table.SelectedData.length === 0,
       tooltip: Localization.DeleteSelected,
       icon: "trash",
       inverted: true
@@ -43098,7 +43126,8 @@ var DataView = function DataView(props) {
       tooltip: Localization.Add,
       onClick: freezeLoading() ? function () {} : GoToAdd,
       icon: "plus",
-      inverted: true
+      inverted: true,
+      disabled: props.disabled
     }));
     return null;
   };
@@ -43169,7 +43198,8 @@ var DataView = function DataView(props) {
       Localization: Localization.TableView,
       Export: Export,
       Icons: Icons,
-      accentColor: props.accentColor
+      accentColor: props.accentColor,
+      disabled: props.disabled
     }));
   };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lanaco/lnc-react-ui",
-  "version": "2.1.36",
+  "version": "2.1.39",
   "description": "component library",
   "main": "lib/index.js",
   "module": "lib/index.esm.js",