@lanaco/lnc-react-ui 2.1.13 → 2.1.14

package/lib/index.esm.js

@@ -49285,92 +49285,19 @@ var TableView = function TableView(props) {
       Localization = _props$Localization === void 0 ? {} : _props$Localization;
       props.Export;
       props.Icons;
- // const [headerHoverIndex, setHeaderHoverIndex] = useState(-1);
-  // const [rowHoverIndex, setRowHoverIndex] = useState(-1);
-  // const [rowSelectedIndices, setRowSelectedIndices] = useState([]);
-  //======== FUNCTIONS ========
+ //======== FUNCTIONS ========
 
   function isFunction(functionToCheck) {
     return functionToCheck && {}.toString.call(functionToCheck) === "[object Function]";
   }
 
   var handleOnSelection = function handleOnSelection(rowData, val) {
-    // if (e.target.checked && rowIndex >= 0) {
-    //   if (SelectionType === TableSelectionType.MULTIPLE) {
-    //     let tmpArray = [...rowSelectedIndices];
-    //     tmpArray.push(rowIndex);
-    //     // setRowSelectedIndices(tmpArray);
-    //   } else if (SelectionType === TableSelectionType.SINGLE) {
-    //     // setRowSelectedIndices([rowIndex]);
-    //   }
-    // } else if (!e.target.checked && rowIndex >= 0) {
-    //   if (SelectionType === TableSelectionType.MULTIPLE) {
-    //     let tmpArray = rowSelectedIndices.map((x) => x !== rowIndex);
-    //     // setRowSelectedIndices(tmpArray);
-    //   } else if (SelectionType === TableSelectionType.SINGLE) {
-    //     // setRowSelectedIndices([]);
-    //   }
-    // }
     OnSelection(rowData, val, SelectionType);
   };
 
   var handleSelectAll = function handleSelectAll(val) {
     OnSelectAll(val);
   }; //======== RENDER ========
-  // const renderSelectionHeader = () => {
-  //   if (!EnableSelection || ReadOnly) return null;
-  //   if (props.accentColor) {
-  //     const style = {
-  //       backgroundColor: props.accentColor,
-  //       color: props.color
-  //         ? props.color
-  //         : isColorDark(props.accentColor)
-  //         ? "white"
-  //         : "black",
-  //     };
-  //     const styleForHover = {
-  //       backgroundColor: getDarkerColor(props.accentColor, 0.2),
-  //       color: props.color
-  //         ? props.color
-  //         : isColorDark(props.accentColor)
-  //         ? "white"
-  //         : "black",
-  //     };
-  //     return (
-  //       <th
-  //         className={mergeCSS([styles.header, styles.selectColumn])}
-  //         style={headerHoverIndex === 0 ? styleForHover : style}
-  //         onMouseEnter={() => setHeaderHoverIndex(0)}
-  //         onMouseLeave={() => setHeaderHoverIndex(-1)}
-  //       >
-  //         {renderSelectAll()}
-  //       </th>
-  //     );
-  //   }
-  //   return (
-  //     <th className={mergeCSS([styles.header, styles.selectColumn])}>
-  //       {renderSelectAll()}
-  //     </th>
-  //   );
-  // };
-  // const renderSelectAll = () => {
-  //   if (SelectionType === TableSelectionType.MULTIPLE) {
-  //     return (
-  //       <input
-  //         title={
-  //           SelectedEntirePage
-  //             ? Localization.DeselectAll
-  //             : Localization.SelectAll
-  //         }
-  //         type="checkbox"
-  //         checked={SelectedEntirePage}
-  //         onChange={(e) => OnSelectAll(e.target.checked)}
-  //         className={styles.pointer}
-  //       ></input>
-  //     );
-  //   }
-  //   return null;
-  // };
 
 
   var isItemInArray = function isItemInArray(item, array, byProp) {
@@ -49378,33 +49305,7 @@ var TableView = function TableView(props) {
       return x[byProp] === item[byProp];
     }));
     return array.indexOf(item) > -1;
-  }; // const renderSelectionCheckbox = (rowData, rowIndex = -1) => {
-  //   if (EnableSelection && !ReadOnly) {
-  //     return (
-  //       <td
-  //         className={mergeCSS([styles.specialRenderCell, styles.selectColumn])}
-  //       >
-  //         <input
-  //           type="checkbox"
-  //           checked={isItemInArray(rowData, SelectedData, SelectionIndicator)}
-  //           onChange={(e) => handleOnSelection(rowData, e, rowIndex)}
-  //           className={styles.pointer}
-  //         ></input>
-  //       </td>
-  //     );
-  //   } else return <></>;
-  // };
-  // const renderHeader = () => {
-  //   return (
-  //     <tr>
-  //       {renderSelectionHeader()}
-  //       {Columns.filter((x) => x.hide !== true).map((def, i) =>
-  //         renderHeaderCell(def, i)
-  //       )}
-  //     </tr>
-  //   );
-  // };
-
+  };
 
   var renderBody = function renderBody() {
     return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, Data.map(function (dataItem, i) {
@@ -49425,41 +49326,14 @@ var TableView = function TableView(props) {
     }).map(function (col, j) {
       return renderBodyCell(dataItem, col, i, j);
     })));
-  }; // const renderCell = (rowData, def, key) => {
-  //   let onClick = !isFunction(def.specialRender)
-  //     ? () => {
-  //         ChangeToFormView(rowData);
-  //       }
-  //     : () => {};
-  //   if (!EnableFormView) onClick = () => {};
-  //   if (!EnableFormView && EnableSelection) {
-  //     var checked = isItemInArray(rowData, SelectedData, SelectionIndicator);
-  //     onClick = () =>
-  //       handleOnSelection(rowData, { target: { checked: !checked } });
-  //   }
-  //   let cellData =
-  //     def.isObject === true
-  //       ? rowData[def.accessor][def.objectAccessor]
-  //       : rowData[def.accessor];
-  //   return (
-  //     <td key={key} className={styles.cell} onClick={onClick}>
-  //       {isFunction(def.specialRender) ? def.specialRender(rowData) : cellData}
-  //     </td>
-  //   );
-  // };
-
+  };
 
   var renderBodyCell = function renderBodyCell(dataItem, def, rowIndex, cellIndex) {
     var tabIndex = rowIndex * Columns.length + cellIndex + 50;
     var onClick = !isFunction(def.specialRender) ? function () {
       ChangeToFormView(dataItem);
     } : function () {};
-    if (!EnableFormView) onClick = function onClick() {}; // if (!EnableFormView && EnableSelection) {
-    //   var checked = isItemInArray(dataItem, SelectedData, SelectionIndicator);
-    //   onClick = () =>
-    //     handleOnSelection(dataItem, { target: { checked: !checked } });
-    // }
-
+    if (!EnableFormView) onClick = function onClick() {};
     if (!EnableSelection || ReadOnly || IsLookup && SelectionType === TableSelectionType.SINGLE) onClick = function onClick() {};
     var cellData = def.isObject === true ? dataItem[def.accessor][def.objectAccessor] : dataItem[def.accessor];
     return /*#__PURE__*/React__default.createElement(TableBodyCell$1, {
@@ -49480,60 +49354,7 @@ var TableView = function TableView(props) {
       },
       id: rowIndex
     }));
-  }; // const renderRow = (rowData, key) => {
-  //   let evenOddClass = key % 2 === 0 ? styles.tableRowEven : styles.tableRowOdd;
-  //   let selectionClass = isItemInArray(
-  //     rowData,
-  //     SelectedData,
-  //     SelectionIndicator
-  //   )
-  //     ? styles.checkedRow
-  //     : "";
-  //   if (props.accentColor) {
-  //     const style = {
-  //       border: "0px",
-  //       backgroundColor: key % 2 === 0 ? "white" : "whitesmoke",
-  //       borderLeft: "1px solid transparent",
-  //       borderRight: "1px solid transparent",
-  //       borderTop: "1px solid transparent",
-  //     };
-  //     const styleForHover = {
-  //       border: "1px solid " + getLighterColor(props.accentColor, 0.75),
-  //       backgroundColor: key % 2 === 0 ? "white" : "whitesmoke",
-  //     };
-  //     const styleForSelect = {
-  //       backgroundColor: getLighterColor(props.accentColor, 0.75),
-  //     };
-  //     return (
-  //       <tr
-  //         key={key}
-  //         style={
-  //           rowSelectedIndices.includes(key)
-  //             ? styleForSelect
-  //             : rowHoverIndex === key
-  //             ? styleForHover
-  //             : style
-  //         }
-  //         onMouseEnter={() => setRowHoverIndex(key)}
-  //         onMouseLeave={() => setRowHoverIndex(-1)}
-  //       >
-  //         {renderSelectionCheckbox(rowData, key)}
-  //         {Columns.filter((x) => x.hide !== true).map((def, i) =>
-  //           renderCell(rowData, def, i)
-  //         )}
-  //       </tr>
-  //     );
-  //   }
-  //   return (
-  //     <tr key={key} className={evenOddClass + " " + selectionClass}>
-  //       {renderSelectionCheckbox(rowData)}
-  //       {Columns.filter((x) => x.hide !== true).map((def, i) =>
-  //         renderCell(rowData, def, i)
-  //       )}
-  //     </tr>
-  //   );
-  // };
-
+  };
 
   var renderHeaderCell = function renderHeaderCell(def, i) {
     var headerClick = function headerClick() {};
@@ -49590,17 +49411,7 @@ var TableView = function TableView(props) {
     return x.hide !== true;
   }).map(function (col, i) {
     return renderHeaderCell(col, i);
-  }))), /*#__PURE__*/React__default.createElement(TableBody$1, null, renderBody())))); // return (
-  //   <div>
-  //     <div className={styles.tableDiv}>
-  //       <table className={styles.table}>
-  //         <thead>{renderHeader()}</thead>
-  //         <tbody>{renderBody()}</tbody>
-  //       </table>
-  //     </div>
-  //     <div>{renderPagination()}</div>
-  //   </div>
-  // );
+  }))), /*#__PURE__*/React__default.createElement(TableBody$1, null, renderBody()))));
 };
 
 var _templateObject$e, _templateObject2$a;
@@ -49686,7 +49497,7 @@ var Container$c = newStyled.div(_templateObject$d || (_templateObject$d = _tagge
 });
 var TableContainer$1 = newStyled.div(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteral(["\n  font-family: var(--font-base-ubuntu);\n  display: flex;\n  justify-content: space-between;\n  flex-direction: column;\n"])));
 var PaginationContainer$1 = newStyled.div(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteral(["\n  border-top: 1px solid #80808025;\n"])));
-var FormContainer$2 = newStyled.div(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteral(["\n  height: 100%;\n  overflow-y: auto;\n  max-height: calc(100vh - 120px);\n  border-radius: 3px;\n\n  ", "\n"])), function (props) {
+var FormContainer$2 = newStyled.div(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteral(["\n  height: 100%;\n  // overflow-y: auto;\n  // max-height: calc(100vh - 120px);\n  border-radius: 3px;\n\n  ", "\n"])), function (props) {
   return getBorderSyle$1(props.borderStyle, props.read, props.theme, props.color);
 });
 var HeaderContainer$1 = newStyled.div(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: left;\n  align-items: center;\n  padding: 4px 0;\n  border-radius: 3px;\n  font-size: 12px;\n  font-family: \"Ubuntu\";\n"])));

package/lib/index.js

@@ -49326,92 +49326,19 @@ var TableView = function TableView(props) {
       Localization = _props$Localization === void 0 ? {} : _props$Localization;
       props.Export;
       props.Icons;
- // const [headerHoverIndex, setHeaderHoverIndex] = useState(-1);
-  // const [rowHoverIndex, setRowHoverIndex] = useState(-1);
-  // const [rowSelectedIndices, setRowSelectedIndices] = useState([]);
-  //======== FUNCTIONS ========
+ //======== FUNCTIONS ========
 
   function isFunction(functionToCheck) {
     return functionToCheck && {}.toString.call(functionToCheck) === "[object Function]";
   }
 
   var handleOnSelection = function handleOnSelection(rowData, val) {
-    // if (e.target.checked && rowIndex >= 0) {
-    //   if (SelectionType === TableSelectionType.MULTIPLE) {
-    //     let tmpArray = [...rowSelectedIndices];
-    //     tmpArray.push(rowIndex);
-    //     // setRowSelectedIndices(tmpArray);
-    //   } else if (SelectionType === TableSelectionType.SINGLE) {
-    //     // setRowSelectedIndices([rowIndex]);
-    //   }
-    // } else if (!e.target.checked && rowIndex >= 0) {
-    //   if (SelectionType === TableSelectionType.MULTIPLE) {
-    //     let tmpArray = rowSelectedIndices.map((x) => x !== rowIndex);
-    //     // setRowSelectedIndices(tmpArray);
-    //   } else if (SelectionType === TableSelectionType.SINGLE) {
-    //     // setRowSelectedIndices([]);
-    //   }
-    // }
     OnSelection(rowData, val, SelectionType);
   };
 
   var handleSelectAll = function handleSelectAll(val) {
     OnSelectAll(val);
   }; //======== RENDER ========
-  // const renderSelectionHeader = () => {
-  //   if (!EnableSelection || ReadOnly) return null;
-  //   if (props.accentColor) {
-  //     const style = {
-  //       backgroundColor: props.accentColor,
-  //       color: props.color
-  //         ? props.color
-  //         : isColorDark(props.accentColor)
-  //         ? "white"
-  //         : "black",
-  //     };
-  //     const styleForHover = {
-  //       backgroundColor: getDarkerColor(props.accentColor, 0.2),
-  //       color: props.color
-  //         ? props.color
-  //         : isColorDark(props.accentColor)
-  //         ? "white"
-  //         : "black",
-  //     };
-  //     return (
-  //       <th
-  //         className={mergeCSS([styles.header, styles.selectColumn])}
-  //         style={headerHoverIndex === 0 ? styleForHover : style}
-  //         onMouseEnter={() => setHeaderHoverIndex(0)}
-  //         onMouseLeave={() => setHeaderHoverIndex(-1)}
-  //       >
-  //         {renderSelectAll()}
-  //       </th>
-  //     );
-  //   }
-  //   return (
-  //     <th className={mergeCSS([styles.header, styles.selectColumn])}>
-  //       {renderSelectAll()}
-  //     </th>
-  //   );
-  // };
-  // const renderSelectAll = () => {
-  //   if (SelectionType === TableSelectionType.MULTIPLE) {
-  //     return (
-  //       <input
-  //         title={
-  //           SelectedEntirePage
-  //             ? Localization.DeselectAll
-  //             : Localization.SelectAll
-  //         }
-  //         type="checkbox"
-  //         checked={SelectedEntirePage}
-  //         onChange={(e) => OnSelectAll(e.target.checked)}
-  //         className={styles.pointer}
-  //       ></input>
-  //     );
-  //   }
-  //   return null;
-  // };
 
 
   var isItemInArray = function isItemInArray(item, array, byProp) {
@@ -49419,33 +49346,7 @@ var TableView = function TableView(props) {
       return x[byProp] === item[byProp];
     }));
     return array.indexOf(item) > -1;
-  }; // const renderSelectionCheckbox = (rowData, rowIndex = -1) => {
-  //   if (EnableSelection && !ReadOnly) {
-  //     return (
-  //       <td
-  //         className={mergeCSS([styles.specialRenderCell, styles.selectColumn])}
-  //       >
-  //         <input
-  //           type="checkbox"
-  //           checked={isItemInArray(rowData, SelectedData, SelectionIndicator)}
-  //           onChange={(e) => handleOnSelection(rowData, e, rowIndex)}
-  //           className={styles.pointer}
-  //         ></input>
-  //       </td>
-  //     );
-  //   } else return <></>;
-  // };
-  // const renderHeader = () => {
-  //   return (
-  //     <tr>
-  //       {renderSelectionHeader()}
-  //       {Columns.filter((x) => x.hide !== true).map((def, i) =>
-  //         renderHeaderCell(def, i)
-  //       )}
-  //     </tr>
-  //   );
-  // };
-
+  };
 
   var renderBody = function renderBody() {
     return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, Data.map(function (dataItem, i) {
@@ -49466,41 +49367,14 @@ var TableView = function TableView(props) {
     }).map(function (col, j) {
       return renderBodyCell(dataItem, col, i, j);
     })));
-  }; // const renderCell = (rowData, def, key) => {
-  //   let onClick = !isFunction(def.specialRender)
-  //     ? () => {
-  //         ChangeToFormView(rowData);
-  //       }
-  //     : () => {};
-  //   if (!EnableFormView) onClick = () => {};
-  //   if (!EnableFormView && EnableSelection) {
-  //     var checked = isItemInArray(rowData, SelectedData, SelectionIndicator);
-  //     onClick = () =>
-  //       handleOnSelection(rowData, { target: { checked: !checked } });
-  //   }
-  //   let cellData =
-  //     def.isObject === true
-  //       ? rowData[def.accessor][def.objectAccessor]
-  //       : rowData[def.accessor];
-  //   return (
-  //     <td key={key} className={styles.cell} onClick={onClick}>
-  //       {isFunction(def.specialRender) ? def.specialRender(rowData) : cellData}
-  //     </td>
-  //   );
-  // };
-
+  };
 
   var renderBodyCell = function renderBodyCell(dataItem, def, rowIndex, cellIndex) {
     var tabIndex = rowIndex * Columns.length + cellIndex + 50;
     var onClick = !isFunction(def.specialRender) ? function () {
       ChangeToFormView(dataItem);
     } : function () {};
-    if (!EnableFormView) onClick = function onClick() {}; // if (!EnableFormView && EnableSelection) {
-    //   var checked = isItemInArray(dataItem, SelectedData, SelectionIndicator);
-    //   onClick = () =>
-    //     handleOnSelection(dataItem, { target: { checked: !checked } });
-    // }
-
+    if (!EnableFormView) onClick = function onClick() {};
     if (!EnableSelection || ReadOnly || IsLookup && SelectionType === TableSelectionType.SINGLE) onClick = function onClick() {};
     var cellData = def.isObject === true ? dataItem[def.accessor][def.objectAccessor] : dataItem[def.accessor];
     return /*#__PURE__*/React__default['default'].createElement(TableBodyCell$1, {
@@ -49521,60 +49395,7 @@ var TableView = function TableView(props) {
       },
       id: rowIndex
     }));
-  }; // const renderRow = (rowData, key) => {
-  //   let evenOddClass = key % 2 === 0 ? styles.tableRowEven : styles.tableRowOdd;
-  //   let selectionClass = isItemInArray(
-  //     rowData,
-  //     SelectedData,
-  //     SelectionIndicator
-  //   )
-  //     ? styles.checkedRow
-  //     : "";
-  //   if (props.accentColor) {
-  //     const style = {
-  //       border: "0px",
-  //       backgroundColor: key % 2 === 0 ? "white" : "whitesmoke",
-  //       borderLeft: "1px solid transparent",
-  //       borderRight: "1px solid transparent",
-  //       borderTop: "1px solid transparent",
-  //     };
-  //     const styleForHover = {
-  //       border: "1px solid " + getLighterColor(props.accentColor, 0.75),
-  //       backgroundColor: key % 2 === 0 ? "white" : "whitesmoke",
-  //     };
-  //     const styleForSelect = {
-  //       backgroundColor: getLighterColor(props.accentColor, 0.75),
-  //     };
-  //     return (
-  //       <tr
-  //         key={key}
-  //         style={
-  //           rowSelectedIndices.includes(key)
-  //             ? styleForSelect
-  //             : rowHoverIndex === key
-  //             ? styleForHover
-  //             : style
-  //         }
-  //         onMouseEnter={() => setRowHoverIndex(key)}
-  //         onMouseLeave={() => setRowHoverIndex(-1)}
-  //       >
-  //         {renderSelectionCheckbox(rowData, key)}
-  //         {Columns.filter((x) => x.hide !== true).map((def, i) =>
-  //           renderCell(rowData, def, i)
-  //         )}
-  //       </tr>
-  //     );
-  //   }
-  //   return (
-  //     <tr key={key} className={evenOddClass + " " + selectionClass}>
-  //       {renderSelectionCheckbox(rowData)}
-  //       {Columns.filter((x) => x.hide !== true).map((def, i) =>
-  //         renderCell(rowData, def, i)
-  //       )}
-  //     </tr>
-  //   );
-  // };
-
+  };
 
   var renderHeaderCell = function renderHeaderCell(def, i) {
     var headerClick = function headerClick() {};
@@ -49631,17 +49452,7 @@ var TableView = function TableView(props) {
     return x.hide !== true;
   }).map(function (col, i) {
     return renderHeaderCell(col, i);
-  }))), /*#__PURE__*/React__default['default'].createElement(TableBody$1, null, renderBody())))); // return (
-  //   <div>
-  //     <div className={styles.tableDiv}>
-  //       <table className={styles.table}>
-  //         <thead>{renderHeader()}</thead>
-  //         <tbody>{renderBody()}</tbody>
-  //       </table>
-  //     </div>
-  //     <div>{renderPagination()}</div>
-  //   </div>
-  // );
+  }))), /*#__PURE__*/React__default['default'].createElement(TableBody$1, null, renderBody()))));
 };
 
 var _templateObject$e, _templateObject2$a;
@@ -49727,7 +49538,7 @@ var Container$c = newStyled.div(_templateObject$d || (_templateObject$d = _tagge
 });
 var TableContainer$1 = newStyled.div(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteral__default['default'](["\n  font-family: var(--font-base-ubuntu);\n  display: flex;\n  justify-content: space-between;\n  flex-direction: column;\n"])));
 var PaginationContainer$1 = newStyled.div(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteral__default['default'](["\n  border-top: 1px solid #80808025;\n"])));
-var FormContainer$2 = newStyled.div(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteral__default['default'](["\n  height: 100%;\n  overflow-y: auto;\n  max-height: calc(100vh - 120px);\n  border-radius: 3px;\n\n  ", "\n"])), function (props) {
+var FormContainer$2 = newStyled.div(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteral__default['default'](["\n  height: 100%;\n  // overflow-y: auto;\n  // max-height: calc(100vh - 120px);\n  border-radius: 3px;\n\n  ", "\n"])), function (props) {
   return getBorderSyle$1(props.borderStyle, props.read, props.theme, props.color);
 });
 var HeaderContainer$1 = newStyled.div(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteral__default['default'](["\n  display: flex;\n  flex-direction: row;\n  justify-content: left;\n  align-items: center;\n  padding: 4px 0;\n  border-radius: 3px;\n  font-size: 12px;\n  font-family: \"Ubuntu\";\n"])));

package/package.json

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