linear-react-components-ui 2.0.1-beta.0 → 2.0.1-beta.2

package/lib/treetable/Row.js

@@ -12,7 +12,7 @@ import { TreeTableContext, searchChildrensPerRow } from "./helpers.js";
 import v1 from "../node_modules/uuid/dist/v1.js";
 import ToolBarGroup from "../toolbar/ToolBarGroup.js";
 const TreeRow = (props) => {
-  const $ = compilerRuntimeExports.c(103);
+  const $ = compilerRuntimeExports.c(113);
   const {
     data,
     dataColumns,
@@ -26,64 +26,79 @@ const TreeRow = (props) => {
     rightToolbarElements,
     styleForRightToolbar,
     toolbarElementsValidations,
-    openNodeId
+    openNodeIds,
+    startNodesOpened: t0
   } = useContext(TreeTableContext);
+  const startNodesOpened = t0 === void 0 ? false : t0;
   const {
     rowId,
     dataRow,
     rowLevel
   } = props;
-  const [open, setOpen] = useState(false);
+  let t1;
+  if ($[0] !== dataRow.id || $[1] !== openNodeIds || $[2] !== startNodesOpened) {
+    t1 = startNodesOpened || openNodeIds?.includes(Number(dataRow.id));
+    $[0] = dataRow.id;
+    $[1] = openNodeIds;
+    $[2] = startNodesOpened;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  const [open, setOpen] = useState(t1);
   const [childrens, setChildrens] = useState();
   const [isLoadingChildrens, setIsLoadingChildrens] = useState(false);
   const [showToolbarElements, setShowToolbarElements] = useState(false);
   const [firstRenderingOfChildrens, setFirstRenderingOfChildrens] = useState(false);
   const divContainerRef = useRef(null);
-  let t0;
-  if ($[0] !== data || $[1] !== parentPropName || $[2] !== rowId || $[3] !== rowLevel) {
-    t0 = () => {
+  let t2;
+  if ($[4] !== data || $[5] !== parentPropName || $[6] !== rowId || $[7] !== rowLevel) {
+    t2 = () => {
       const dataChildrens = searchChildrensPerRow(data, parentPropName, rowId, rowLevel);
       setChildrens(dataChildrens);
       setIsLoadingChildrens(false);
     };
-    $[0] = data;
-    $[1] = parentPropName;
-    $[2] = rowId;
-    $[3] = rowLevel;
-    $[4] = t0;
+    $[4] = data;
+    $[5] = parentPropName;
+    $[6] = rowId;
+    $[7] = rowLevel;
+    $[8] = t2;
   } else {
-    t0 = $[4];
+    t2 = $[8];
   }
-  const searchChildrensAndInsertState = t0;
-  let t1;
-  if ($[5] !== firstRenderingOfChildrens || $[6] !== onClickGetChildrens || $[7] !== open || $[8] !== rowId || $[9] !== searchChildrensAndInsertState) {
-    t1 = () => {
+  const searchChildrensAndInsertState = t2;
+  let t3;
+  if ($[9] !== firstRenderingOfChildrens || $[10] !== onClickGetChildrens || $[11] !== open || $[12] !== rowId || $[13] !== searchChildrensAndInsertState || $[14] !== startNodesOpened) {
+    t3 = () => {
       if (!firstRenderingOfChildrens && !open) {
         setOpen(true);
         setIsLoadingChildrens(true);
-        if (onClickGetChildrens?.(rowId) && typeof onClickGetChildrens(rowId).finally === "function") {
+        if (!startNodesOpened && onClickGetChildrens?.(rowId) && typeof onClickGetChildrens(rowId).finally === "function") {
           onClickGetChildrens(rowId).then(_temp).catch(_temp2).finally(() => {
             searchChildrensAndInsertState();
           });
+        } else {
+          searchChildrensAndInsertState();
         }
         setFirstRenderingOfChildrens(true);
       } else {
         setOpen(_temp3);
       }
     };
-    $[5] = firstRenderingOfChildrens;
-    $[6] = onClickGetChildrens;
-    $[7] = open;
-    $[8] = rowId;
-    $[9] = searchChildrensAndInsertState;
-    $[10] = t1;
+    $[9] = firstRenderingOfChildrens;
+    $[10] = onClickGetChildrens;
+    $[11] = open;
+    $[12] = rowId;
+    $[13] = searchChildrensAndInsertState;
+    $[14] = startNodesOpened;
+    $[15] = t3;
   } else {
-    t1 = $[10];
+    t3 = $[15];
   }
-  const handlerShowChildrens = t1;
-  let t2;
-  if ($[11] !== dataRow || $[12] !== toolbarElementsValidations) {
-    t2 = (validationKey) => {
+  const handlerShowChildrens = t3;
+  let t4;
+  if ($[16] !== dataRow || $[17] !== toolbarElementsValidations) {
+    t4 = (validationKey) => {
       const validations = toolbarElementsValidations && toolbarElementsValidations[validationKey];
       const options = {
         disabled: {
@@ -107,16 +122,16 @@ const TreeRow = (props) => {
       }
       return elementBehavior;
     };
-    $[11] = dataRow;
-    $[12] = toolbarElementsValidations;
-    $[13] = t2;
+    $[16] = dataRow;
+    $[17] = toolbarElementsValidations;
+    $[18] = t4;
   } else {
-    t2 = $[13];
+    t4 = $[18];
   }
-  const validateRowElement = t2;
-  let t3;
-  if ($[14] !== dataRow || $[15] !== toolbarElementsValidations || $[16] !== validateRowElement) {
-    t3 = (elements) => {
+  const validateRowElement = t4;
+  let t5;
+  if ($[19] !== dataRow || $[20] !== toolbarElementsValidations || $[21] !== validateRowElement) {
+    t5 = (elements) => {
       let newElementsWithNewProps = [];
       if (elements) {
         newElementsWithNewProps = Children.map(elements, (element) => {
@@ -153,78 +168,78 @@ const TreeRow = (props) => {
       }
       return newElementsWithNewProps;
     };
-    $[14] = dataRow;
-    $[15] = toolbarElementsValidations;
-    $[16] = validateRowElement;
-    $[17] = t3;
+    $[19] = dataRow;
+    $[20] = toolbarElementsValidations;
+    $[21] = validateRowElement;
+    $[22] = t5;
   } else {
-    t3 = $[17];
+    t5 = $[22];
   }
-  const buildToolbarElements = t3;
-  let t4;
-  if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
-    t4 = () => {
+  const buildToolbarElements = t5;
+  let t6;
+  if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+    t6 = () => {
       setShowToolbarElements(true);
     };
-    $[18] = t4;
+    $[23] = t6;
   } else {
-    t4 = $[18];
+    t6 = $[23];
   }
-  const handleOnMouseEnter = t4;
-  let t5;
-  if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
-    t5 = (event) => {
+  const handleOnMouseEnter = t6;
+  let t7;
+  if ($[24] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = (event) => {
       const elementoAtual = document.elementFromPoint(event.clientX, event.clientY);
       if (divContainerRef.current && !divContainerRef.current.contains(elementoAtual)) {
         setShowToolbarElements(false);
       }
     };
-    $[19] = t5;
+    $[24] = t7;
   } else {
-    t5 = $[19];
+    t7 = $[24];
   }
-  const handlerMouseInsideDivContainer = t5;
-  let t6;
-  if ($[20] !== searchChildrensAndInsertState) {
-    t6 = () => {
+  const handlerMouseInsideDivContainer = t7;
+  let t8;
+  if ($[25] !== searchChildrensAndInsertState) {
+    t8 = () => {
       searchChildrensAndInsertState();
     };
-    $[20] = searchChildrensAndInsertState;
-    $[21] = t6;
+    $[25] = searchChildrensAndInsertState;
+    $[26] = t8;
   } else {
-    t6 = $[21];
+    t8 = $[26];
   }
-  let t7;
-  if ($[22] !== data) {
-    t7 = [data];
-    $[22] = data;
-    $[23] = t7;
+  let t9;
+  if ($[27] !== data) {
+    t9 = [data];
+    $[27] = data;
+    $[28] = t9;
   } else {
-    t7 = $[23];
+    t9 = $[28];
   }
-  useEffect(t6, t7);
-  let t8;
-  if ($[24] === Symbol.for("react.memo_cache_sentinel")) {
-    t8 = () => {
+  useEffect(t8, t9);
+  let t10;
+  if ($[29] === Symbol.for("react.memo_cache_sentinel")) {
+    t10 = () => {
       setIsLoadingChildrens(false);
     };
-    $[24] = t8;
+    $[29] = t10;
   } else {
-    t8 = $[24];
+    t10 = $[29];
   }
-  let t9;
-  if ($[25] !== childrens) {
-    t9 = [childrens];
-    $[25] = childrens;
-    $[26] = t9;
+  let t11;
+  if ($[30] !== childrens) {
+    t11 = [childrens];
+    $[30] = childrens;
+    $[31] = t11;
   } else {
-    t9 = $[26];
+    t11 = $[31];
   }
-  useEffect(t8, t9);
-  let t10;
-  let t11;
-  if ($[27] !== showToolbarElements) {
-    t10 = () => {
+  useEffect(t10, t11);
+  let t12;
+  let t13;
+  if ($[32] !== showToolbarElements) {
+    t12 = () => {
       if (showToolbarElements) {
         window.addEventListener("mousemove", handlerMouseInsideDivContainer);
       } else {
@@ -234,280 +249,290 @@ const TreeRow = (props) => {
         window.removeEventListener("mousemove", handlerMouseInsideDivContainer);
       };
     };
-    t11 = [showToolbarElements];
-    $[27] = showToolbarElements;
-    $[28] = t10;
-    $[29] = t11;
+    t13 = [showToolbarElements];
+    $[32] = showToolbarElements;
+    $[33] = t12;
+    $[34] = t13;
   } else {
-    t10 = $[28];
-    t11 = $[29];
+    t12 = $[33];
+    t13 = $[34];
   }
-  useEffect(t10, t11);
-  let t12;
-  if ($[30] !== dataRow.id || $[31] !== openNodeId) {
-    t12 = () => {
-      if (openNodeId === Number(dataRow.id)) {
+  useEffect(t12, t13);
+  let t14;
+  if ($[35] !== dataRow.id || $[36] !== openNodeIds || $[37] !== searchChildrensAndInsertState || $[38] !== startNodesOpened) {
+    t14 = () => {
+      const shouldOpen = startNodesOpened || openNodeIds?.includes(Number(dataRow.id));
+      if (shouldOpen) {
         setOpen(true);
+        searchChildrensAndInsertState();
+        setFirstRenderingOfChildrens(true);
+      } else {
+        setOpen(false);
       }
     };
-    $[30] = dataRow.id;
-    $[31] = openNodeId;
-    $[32] = t12;
-  } else {
-    t12 = $[32];
-  }
-  let t13;
-  if ($[33] !== openNodeId) {
-    t13 = [openNodeId];
-    $[33] = openNodeId;
-    $[34] = t13;
+    $[35] = dataRow.id;
+    $[36] = openNodeIds;
+    $[37] = searchChildrensAndInsertState;
+    $[38] = startNodesOpened;
+    $[39] = t14;
   } else {
-    t13 = $[34];
+    t14 = $[39];
   }
-  useEffect(t12, t13);
-  const t14 = dataColumns[0].name;
   let t15;
-  if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
-    t15 = v1();
-    $[35] = t15;
-  } else {
-    t15 = $[35];
-  }
-  const t16 = `td-${t14}-${t15}`;
-  const t17 = dataColumns[0].style;
-  const t18 = `column-more-childrens ${rowLevel && "line-path-decoration"}`;
-  const t19 = `${rowLevel}rem`;
-  let t20;
-  if ($[36] !== t19) {
-    t20 = {
-      marginLeft: t19
+  if ($[40] !== data || $[41] !== dataRow.id || $[42] !== openNodeIds || $[43] !== startNodesOpened) {
+    t15 = [startNodesOpened, openNodeIds, data, dataRow.id];
+    $[40] = data;
+    $[41] = dataRow.id;
+    $[42] = openNodeIds;
+    $[43] = startNodesOpened;
+    $[44] = t15;
+  } else {
+    t15 = $[44];
+  }
+  useEffect(t14, t15);
+  const t16 = dataColumns[0].name;
+  let t17;
+  if ($[45] === Symbol.for("react.memo_cache_sentinel")) {
+    t17 = v1();
+    $[45] = t17;
+  } else {
+    t17 = $[45];
+  }
+  const t18 = `td-${t16}-${t17}`;
+  const t19 = dataColumns[0].style;
+  const t20 = `column-more-childrens ${rowLevel && "line-path-decoration"}`;
+  const t21 = `${rowLevel}rem`;
+  let t22;
+  if ($[46] !== t21) {
+    t22 = {
+      marginLeft: t21
     };
-    $[36] = t19;
-    $[37] = t20;
-  } else {
-    t20 = $[37];
-  }
-  let t21;
-  if ($[38] !== handlerShowChildrens) {
-    t21 = () => handlerShowChildrens();
-    $[38] = handlerShowChildrens;
-    $[39] = t21;
+    $[46] = t21;
+    $[47] = t22;
   } else {
-    t21 = $[39];
+    t22 = $[47];
   }
-  const t22 = open ? "down" : "arrow_right";
   let t23;
-  if ($[40] !== t22) {
-    t23 = /* @__PURE__ */ jsx(Icon, { name: t22, size: 10 });
-    $[40] = t22;
-    $[41] = t23;
+  if ($[48] !== handlerShowChildrens) {
+    t23 = () => handlerShowChildrens();
+    $[48] = handlerShowChildrens;
+    $[49] = t23;
   } else {
-    t23 = $[41];
-  }
-  let t24;
-  if ($[42] !== t21 || $[43] !== t23) {
-    t24 = /* @__PURE__ */ jsx("button", { tabIndex: -1, className: "open-close-children", onClick: t21, children: t23 });
-    $[42] = t21;
-    $[43] = t23;
-    $[44] = t24;
-  } else {
-    t24 = $[44];
+    t23 = $[49];
   }
+  const t24 = open ? "down" : "arrow_right";
   let t25;
-  if ($[45] !== onClickFirstColumn || $[46] !== rowId) {
-    t25 = () => onClickFirstColumn ? onClickFirstColumn(rowId) : {};
-    $[45] = onClickFirstColumn;
-    $[46] = rowId;
-    $[47] = t25;
+  if ($[50] !== t24) {
+    t25 = /* @__PURE__ */ jsx(Icon, { name: t24, size: 10 });
+    $[50] = t24;
+    $[51] = t25;
   } else {
-    t25 = $[47];
+    t25 = $[51];
   }
-  const t26 = dataRow[dataColumns[0].name];
-  let t27;
-  if ($[48] !== t25 || $[49] !== t26) {
-    t27 = /* @__PURE__ */ jsx("span", { tabIndex: -1, role: "button", className: "value-button", onClick: t25, children: t26 });
-    $[48] = t25;
-    $[49] = t26;
-    $[50] = t27;
+  let t26;
+  if ($[52] !== t23 || $[53] !== t25) {
+    t26 = /* @__PURE__ */ jsx("button", { tabIndex: -1, className: "open-close-children", onClick: t23, children: t25 });
+    $[52] = t23;
+    $[53] = t25;
+    $[54] = t26;
   } else {
-    t27 = $[50];
+    t26 = $[54];
   }
-  let t28;
-  if ($[51] === Symbol.for("react.memo_cache_sentinel")) {
-    t28 = v1();
-    $[51] = t28;
+  let t27;
+  if ($[55] !== onClickFirstColumn || $[56] !== rowId) {
+    t27 = () => onClickFirstColumn ? onClickFirstColumn(rowId) : {};
+    $[55] = onClickFirstColumn;
+    $[56] = rowId;
+    $[57] = t27;
   } else {
-    t28 = $[51];
+    t27 = $[57];
   }
+  const t28 = dataRow[dataColumns[0].name];
   let t29;
-  if ($[52] !== styleForLeftToolbar) {
-    t29 = {
-      float: "left",
-      height: "fit-content",
-      ...styleForLeftToolbar
-    };
-    $[52] = styleForLeftToolbar;
-    $[53] = t29;
+  if ($[58] !== t27 || $[59] !== t28) {
+    t29 = /* @__PURE__ */ jsx("span", { tabIndex: -1, role: "button", className: "value-button", onClick: t27, children: t28 });
+    $[58] = t27;
+    $[59] = t28;
+    $[60] = t29;
   } else {
-    t29 = $[53];
+    t29 = $[60];
   }
   let t30;
-  if ($[54] !== buildToolbarElements || $[55] !== leftToolbarElements || $[56] !== showToolbarElements) {
-    t30 = showToolbarElements && leftToolbarElements && buildToolbarElements(leftToolbarElements);
-    $[54] = buildToolbarElements;
-    $[55] = leftToolbarElements;
-    $[56] = showToolbarElements;
-    $[57] = t30;
+  if ($[61] === Symbol.for("react.memo_cache_sentinel")) {
+    t30 = v1();
+    $[61] = t30;
   } else {
-    t30 = $[57];
+    t30 = $[61];
   }
   let t31;
-  if ($[58] !== t29 || $[59] !== t30) {
-    t31 = /* @__PURE__ */ jsx("span", { className: "container-toolbar-buttons", children: /* @__PURE__ */ jsx(ToolBar, { size: "small", customClass: "row-toolbar", children: /* @__PURE__ */ jsx(ToolBarGroup, { style: t29, children: t30 }, `left-toolbar-${t28}`) }) });
-    $[58] = t29;
-    $[59] = t30;
-    $[60] = t31;
+  if ($[62] !== styleForLeftToolbar) {
+    t31 = {
+      float: "left",
+      height: "fit-content",
+      ...styleForLeftToolbar
+    };
+    $[62] = styleForLeftToolbar;
+    $[63] = t31;
   } else {
-    t31 = $[60];
+    t31 = $[63];
   }
   let t32;
-  if ($[61] !== t18 || $[62] !== t20 || $[63] !== t24 || $[64] !== t27 || $[65] !== t31) {
-    t32 = /* @__PURE__ */ jsxs("span", { className: t18, style: t20, children: [
-      t24,
-      t27,
-      t31
-    ] });
-    $[61] = t18;
-    $[62] = t20;
-    $[63] = t24;
-    $[64] = t27;
-    $[65] = t31;
-    $[66] = t32;
+  if ($[64] !== buildToolbarElements || $[65] !== leftToolbarElements || $[66] !== showToolbarElements) {
+    t32 = showToolbarElements && leftToolbarElements && buildToolbarElements(leftToolbarElements);
+    $[64] = buildToolbarElements;
+    $[65] = leftToolbarElements;
+    $[66] = showToolbarElements;
+    $[67] = t32;
   } else {
-    t32 = $[66];
+    t32 = $[67];
   }
   let t33;
-  if ($[67] === Symbol.for("react.memo_cache_sentinel")) {
-    t33 = v1();
-    $[67] = t33;
+  if ($[68] !== t31 || $[69] !== t32) {
+    t33 = /* @__PURE__ */ jsx("span", { className: "container-toolbar-buttons", children: /* @__PURE__ */ jsx(ToolBar, { size: "small", customClass: "row-toolbar", children: /* @__PURE__ */ jsx(ToolBarGroup, { style: t31, children: t32 }, `left-toolbar-${t30}`) }) });
+    $[68] = t31;
+    $[69] = t32;
+    $[70] = t33;
   } else {
-    t33 = $[67];
+    t33 = $[70];
   }
   let t34;
-  if ($[68] !== styleForRightToolbar) {
-    t34 = {
-      float: "right",
-      height: "fit-content",
-      gap: "4px",
-      ...styleForRightToolbar
-    };
-    $[68] = styleForRightToolbar;
-    $[69] = t34;
+  if ($[71] !== t20 || $[72] !== t22 || $[73] !== t26 || $[74] !== t29 || $[75] !== t33) {
+    t34 = /* @__PURE__ */ jsxs("span", { className: t20, style: t22, children: [
+      t26,
+      t29,
+      t33
+    ] });
+    $[71] = t20;
+    $[72] = t22;
+    $[73] = t26;
+    $[74] = t29;
+    $[75] = t33;
+    $[76] = t34;
   } else {
-    t34 = $[69];
+    t34 = $[76];
   }
   let t35;
-  if ($[70] !== buildToolbarElements || $[71] !== rightToolbarElements) {
-    t35 = rightToolbarElements && buildToolbarElements(rightToolbarElements);
-    $[70] = buildToolbarElements;
-    $[71] = rightToolbarElements;
-    $[72] = t35;
+  if ($[77] === Symbol.for("react.memo_cache_sentinel")) {
+    t35 = v1();
+    $[77] = t35;
   } else {
-    t35 = $[72];
+    t35 = $[77];
   }
   let t36;
-  if ($[73] !== t34 || $[74] !== t35) {
-    t36 = /* @__PURE__ */ jsx("span", { className: "container-toolbar-info", children: /* @__PURE__ */ jsx(ToolBar, { size: "small", customClass: "row-toolbar", children: /* @__PURE__ */ jsx(ToolBarGroup, { style: t34, children: t35 }, `right-toolbar-${t33}`) }) });
-    $[73] = t34;
-    $[74] = t35;
-    $[75] = t36;
+  if ($[78] !== styleForRightToolbar) {
+    t36 = {
+      float: "right",
+      height: "fit-content",
+      gap: "4px",
+      ...styleForRightToolbar
+    };
+    $[78] = styleForRightToolbar;
+    $[79] = t36;
   } else {
-    t36 = $[75];
+    t36 = $[79];
   }
   let t37;
-  if ($[76] !== t32 || $[77] !== t36) {
-    t37 = /* @__PURE__ */ jsxs("div", { ref: divContainerRef, className: "column-container", onMouseEnter: handleOnMouseEnter, children: [
-      t32,
-      t36
-    ] });
-    $[76] = t32;
-    $[77] = t36;
-    $[78] = t37;
+  if ($[80] !== buildToolbarElements || $[81] !== rightToolbarElements) {
+    t37 = rightToolbarElements && buildToolbarElements(rightToolbarElements);
+    $[80] = buildToolbarElements;
+    $[81] = rightToolbarElements;
+    $[82] = t37;
   } else {
-    t37 = $[78];
+    t37 = $[82];
   }
   let t38;
-  if ($[79] !== dataColumns[0].style || $[80] !== t16 || $[81] !== t37) {
-    t38 = /* @__PURE__ */ jsx(RowColumn, { ignoreTableColClick: true, style: t17, children: t37 }, t16);
-    $[79] = dataColumns[0].style;
-    $[80] = t16;
-    $[81] = t37;
-    $[82] = t38;
+  if ($[83] !== t36 || $[84] !== t37) {
+    t38 = /* @__PURE__ */ jsx("span", { className: "container-toolbar-info", children: /* @__PURE__ */ jsx(ToolBar, { size: "small", customClass: "row-toolbar", children: /* @__PURE__ */ jsx(ToolBarGroup, { style: t36, children: t37 }, `right-toolbar-${t35}`) }) });
+    $[83] = t36;
+    $[84] = t37;
+    $[85] = t38;
   } else {
-    t38 = $[82];
+    t38 = $[85];
   }
   let t39;
-  if ($[83] !== dataColumns || $[84] !== dataRow) {
-    let t402;
-    if ($[86] !== dataRow) {
-      t402 = (column) => /* @__PURE__ */ jsx(RowColumn, { style: {
-        ...column.style
-      }, ignoreTableColClick: true, children: dataRow[column.name] }, `key-${column.name}-${v1()}`);
-      $[86] = dataRow;
-      $[87] = t402;
-    } else {
-      t402 = $[87];
-    }
-    t39 = dataColumns.slice(1).map(t402);
-    $[83] = dataColumns;
-    $[84] = dataRow;
-    $[85] = t39;
+  if ($[86] !== t34 || $[87] !== t38) {
+    t39 = /* @__PURE__ */ jsxs("div", { ref: divContainerRef, className: "column-container", onMouseEnter: handleOnMouseEnter, children: [
+      t34,
+      t38
+    ] });
+    $[86] = t34;
+    $[87] = t38;
+    $[88] = t39;
   } else {
-    t39 = $[85];
+    t39 = $[88];
   }
   let t40;
-  if ($[88] !== props || $[89] !== rowId || $[90] !== t38 || $[91] !== t39) {
-    t40 = /* @__PURE__ */ jsxs(Row, { ...props, dataId: rowId, customClass: "tree-row-element", children: [
-      t38,
-      t39
-    ] });
-    $[88] = props;
-    $[89] = rowId;
-    $[90] = t38;
+  if ($[89] !== dataColumns[0].style || $[90] !== t18 || $[91] !== t39) {
+    t40 = /* @__PURE__ */ jsx(RowColumn, { ignoreTableColClick: true, style: t19, children: t39 }, t18);
+    $[89] = dataColumns[0].style;
+    $[90] = t18;
     $[91] = t39;
     $[92] = t40;
   } else {
     t40 = $[92];
   }
   let t41;
-  if ($[93] !== childrens || $[94] !== dataColumns.length || $[95] !== isLoadingChildrens || $[96] !== open || $[97] !== rootPropName || $[98] !== stylesForRow) {
-    t41 = open && /* @__PURE__ */ jsx(Fragment, { children: childrens && childrens.length === 0 && isLoadingChildrens ? /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx("td", { colSpan: dataColumns.length, className: "td-loading-childrens", children: /* @__PURE__ */ jsx("div", { className: "td-loading-childrens-container", children: /* @__PURE__ */ jsx(SpinnerLoading, { size: "48px" }, "loading-childrens") }) }) }, "tr-loading-childrens") : /* @__PURE__ */ jsxs(Fragment, { children: [
-      childrens && childrens.map((item) => /* @__PURE__ */ jsx(TreeRow, { dataRow: item, rowLevel: item.rowLevel ? item.rowLevel + 1 : 1, rowId: `${item[rootPropName]}`, style: stylesForRow }, item[rootPropName])),
-      childrens && childrens.length !== 0 && isLoadingChildrens && /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx("td", { colSpan: dataColumns.length, className: "td-loading-childrens", children: /* @__PURE__ */ jsx("div", { className: "td-loading-childrens-container", children: /* @__PURE__ */ jsx(SpinnerLoading, { size: "48px" }, "loading-childrens") }) }) }, "tr-loading-childrens")
-    ] }) });
-    $[93] = childrens;
-    $[94] = dataColumns.length;
-    $[95] = isLoadingChildrens;
-    $[96] = open;
-    $[97] = rootPropName;
-    $[98] = stylesForRow;
-    $[99] = t41;
+  if ($[93] !== dataColumns || $[94] !== dataRow) {
+    let t422;
+    if ($[96] !== dataRow) {
+      t422 = (column) => /* @__PURE__ */ jsx(RowColumn, { style: {
+        ...column.style
+      }, ignoreTableColClick: true, children: dataRow[column.name] }, `key-${column.name}-${v1()}`);
+      $[96] = dataRow;
+      $[97] = t422;
+    } else {
+      t422 = $[97];
+    }
+    t41 = dataColumns.slice(1).map(t422);
+    $[93] = dataColumns;
+    $[94] = dataRow;
+    $[95] = t41;
   } else {
-    t41 = $[99];
+    t41 = $[95];
   }
   let t42;
-  if ($[100] !== t40 || $[101] !== t41) {
-    t42 = /* @__PURE__ */ jsxs(Fragment, { children: [
+  if ($[98] !== props || $[99] !== rowId || $[100] !== t40 || $[101] !== t41) {
+    t42 = /* @__PURE__ */ jsxs(Row, { ...props, dataId: rowId, customClass: "tree-row-element", children: [
       t40,
       t41
     ] });
+    $[98] = props;
+    $[99] = rowId;
     $[100] = t40;
     $[101] = t41;
     $[102] = t42;
   } else {
     t42 = $[102];
   }
-  return t42;
+  let t43;
+  if ($[103] !== childrens || $[104] !== dataColumns.length || $[105] !== isLoadingChildrens || $[106] !== open || $[107] !== rootPropName || $[108] !== stylesForRow) {
+    t43 = open && /* @__PURE__ */ jsx(Fragment, { children: childrens && childrens.length === 0 && isLoadingChildrens ? /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx("td", { colSpan: dataColumns.length, className: "td-loading-childrens", children: /* @__PURE__ */ jsx("div", { className: "td-loading-childrens-container", children: /* @__PURE__ */ jsx(SpinnerLoading, { size: "48px" }, "loading-childrens") }) }) }, "tr-loading-childrens") : /* @__PURE__ */ jsxs(Fragment, { children: [
+      childrens && childrens.map((item) => /* @__PURE__ */ jsx(TreeRow, { dataRow: item, rowLevel: item.rowLevel ? item.rowLevel + 1 : 1, rowId: `${item[rootPropName]}`, style: stylesForRow }, item[rootPropName])),
+      childrens && childrens.length !== 0 && isLoadingChildrens && /* @__PURE__ */ jsx(Row, { children: /* @__PURE__ */ jsx("td", { colSpan: dataColumns.length, className: "td-loading-childrens", children: /* @__PURE__ */ jsx("div", { className: "td-loading-childrens-container", children: /* @__PURE__ */ jsx(SpinnerLoading, { size: "48px" }, "loading-childrens") }) }) }, "tr-loading-childrens")
+    ] }) });
+    $[103] = childrens;
+    $[104] = dataColumns.length;
+    $[105] = isLoadingChildrens;
+    $[106] = open;
+    $[107] = rootPropName;
+    $[108] = stylesForRow;
+    $[109] = t43;
+  } else {
+    t43 = $[109];
+  }
+  let t44;
+  if ($[110] !== t42 || $[111] !== t43) {
+    t44 = /* @__PURE__ */ jsxs(Fragment, { children: [
+      t42,
+      t43
+    ] });
+    $[110] = t42;
+    $[111] = t43;
+    $[112] = t44;
+  } else {
+    t44 = $[112];
+  }
+  return t44;
 };
 function _temp() {
 }