import { c_ as e, w as t, ds as o, a6 as n, a4 as r, dQ as a, ar as l, ep as i, eq as s, U as d, av as c, ah as p, aj as m, au as u, ao as w, ef as h, dt as g, cv as x, ej as y, ei as b, ek as v, el as E, em as f, eh as C, en as S, eo as V } from "./index-f50c05c4.js";
import { useRef as R, useMemo as k, useCallback as M, useState as I, useEffect as j } from "react";
import { b as F, r as D, s as P, t as L, u as $, v as B, w as A, x as T, y as U, z as O, A as N, I as z, J as K, K as H, M as W, N as q, O as G, Q as J, U as Q, V as Y, W as _ } from "./devextreme-2fa5bb9a.js";
import { e as X } from "./exceljs-84c5573a.js";
import { s as Z } from "./file-saver-es-c18fae8f.js";
import { d as ee } from "./styled-components-1e696d6b.js";
import { SummaryListComp as te } from "./summaryComp-9e93bb97.js";
import { ButtonActionListComp as oe } from "./buttonActionFile-316a76bb.js";
import { treeListColumnPropertyView as ne, TreeListColumnList as re } from "./treeListColumnList-f23f21f2.js";
import { lR as ae, lA as le, lS as ie } from "./ant-design-icons-b1480d8d.js";
import { r as se } from "./antd-04a23d13.js";
import "./axios-84bb1c75.js";
import "./redux-devtools-d38e5b33.js";
import "./alasql-0ff6dabf.js";
import "./react-router-a1807b5b.js";
import "./fontawesome-2445f580.js";
import "react-dom";
import "./lodash-f1e42446.js";
import "./dnd-kit-56a2f36f.js";
import "./dayjs-844325ae.js";
import "./numbro-c1edb412.js";
import "./papaparse-1bac8e5f.js";
import "./uuid-82f303b2.js";
import "./supabase-c27c62e3.js";
import "./fetch-a3c8ad94.js";
import "./react-draggable-60f59f09.js";
import "./remark-gfm-f2973785.js";
import "./buffer-d3713d77.js";
import "./rehype-raw-41b6145f.js";
import "./parse5-6476676e.js";
import "./rehype-sanitize-deb53e9a.js";
import "./simplebar-react-e1b123a3.js";
import "./react-best-gradient-color-picker-4dd60dac.js";
import "./ua-parser-js-094f59ba.js";
import "./clsx-469c2c43.js";
import "./loglevel-6fb66d22.js";
import "./crypto-js-d5eac8ba.js";
import "./codemirror-73d8c217.js";
import "./really-relaxed-json-49b6a70d.js";
import "./immer-c0428a8d.js";
import "./redux-saga-5514e228.js";
import "./hotkeys-js-0dddb21a.js";
import "./cnchar-5678e6bc.js";
import "./react-documents-eb6de859.js";
import "./sql-formatter-69e8df59.js";
import "./rc-trigger-5125aafe.js";
import "./react-json-view-9403d8a1.js";
import "./qrcode-react-cb73d2b6.js";
import "./katex-a34f0265.js";
import "./ecogis-maps-bb0d63f9.js";
const de = ee(_)`
  .dx-treelist-rowsview .dx-row-focused.dx-data-row {
    background-color: #d0e5fb;
    color: #242424 !important;
  }
`, ce = ee.span`
  margin: 0 4px;
  vertical-align: middle;
  color: ${(e2) => e2.$textColor || "#666666"};
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  &:hover {
    color: ${(e2) => e2.$hoverColor || "#1890ff"};
    background-color: ${(e2) => `${e2.$hoverColor || "#1890ff"}15`};
    transform: scale(1.1);
  }
`;
const pe = m(new d({ dataOptions: e(h, "manual"), dataManual: t(o(g), JSON.stringify([{ id: 1, parentId: null, name: "Parent 1", value: 100 }, { id: 2, parentId: 1, name: "Child 1-1", value: 50 }, { id: 3, parentId: 1, name: "Child 1-2", value: 30 }, { id: 4, parentId: null, name: "Parent 2", value: 200 }, { id: 5, parentId: 4, name: "Child 2-1", value: 80 }, { id: 6, parentId: 4, name: "Child 2-2", value: 120 }, { id: 7, parentId: null, name: "Parent 3", value: 300 }, { id: 8, parentId: 7, name: "Child 3-1", value: 150 }, { id: 9, parentId: 7, name: "Child 3-2", value: 150 }, { id: 10, parentId: null, name: "Parent 4", value: 400 }], null, 2)), dataApi: n, dataKeyExpr: t(n, "id"), parentIdExpr: t(n, "parentId"), columns: t(re, [{ label: "ID", dataField: "id", dataType: "number", editable: false, filterable: true, sortable: true, visible: true }, { label: "Parent ID", dataField: "parentId", dataType: "number", editable: true, filterable: true, sortable: true, visible: true }, { label: "Name", dataField: "name", dataType: "string", editable: true, filterable: true, sortable: true, visible: true }, { label: "Value", dataField: "value", dataType: "number", editable: true, filterable: true, sortable: true, visible: true }]), showPaging: t(r, true), pageSize: t(x, 5), pageIndex: t(x, 0), pagerMode: e(y, "full"), pagerShowPageSizeSelector: t(r, true), pagerShowInfo: t(r, true), pagerShowNavigationButtons: t(r, true), sortingMode: e(b, "multiple"), showFilterPanel: t(r, true), showFilterRow: r, showSearch: t(r, true), searchVisibleColumnsOnly: t(r, false), selectMode: e(v, "multiple"), selectAllMode: e(E, "page"), showCheckBoxesMode: e(f, "onClick"), editable: t(r, true), editMode: e(C, "row"), confirmDelete: t(r, true), editShowIcon: t(r, true), showBorders: t(r, true), showScrolling: t(r, true), showColumnLines: t(r, true), columnAutoWidth: r, columnHidingEnabled: r, alternatingRow: r, code: n, showRowLines: r, focusedRowEnabled: r, wordWrapEnabled: t(r, true), showColumnChooser: t(r, true), showColumnFixing: t(r, true), customButtonsHead: oe, customButtonRow: oe, summary: te, showGroupPanel: t(r, true), showGroupContextMenu: t(r, true), groupAutoExpand: r, showExport: r, exportMode: e(S, "xlsx"), loading: a, onEvent: l(V), selectionControl: i, paginationControl: s }, (e2) => {
  const t2 = R(null);
  se.useApp();
  const o2 = k(() => "api" !== e2.dataOptions ? null : new F({ key: e2.dataKeyExpr, async load(t3) {
    const o3 = ["skip", "take", "requireTotalCount", "requireGroupCount", "sort", "filter", "totalSummary", "group", "groupSummary"].filter((e3) => {
      return null != (o4 = t3[e3]) && "" !== o4;
      var o4;
    }).map((e3) => `${e3}=${JSON.stringify(t3[e3])}`).join("&");
    try {
      const t4 = await fetch(`${e2.dataApi}?${o3}`), n3 = await t4.json();
      return { data: n3.data, totalCount: n3.totalCount, summary: n3.summary, groupCount: n3.groupCount };
    } catch (e3) {
      throw new Error("Data Loading Error");
    }
  } }), [e2.dataApi, e2.dataKeyExpr, e2.dataOptions]), n2 = k(() => "manual" === e2.dataOptions ? { dataSource: e2.dataManual, keyExpr: e2.dataKeyExpr, parentIdExpr: e2.parentIdExpr } : { dataSource: o2, keyExpr: e2.dataKeyExpr, parentIdExpr: e2.parentIdExpr, remoteOperations: "api" === e2.dataOptions ? { filtering: true, sorting: true, grouping: true } : void 0 }, [e2.dataOptions, e2.dataManual, o2, e2.dataKeyExpr, e2.parentIdExpr]), r2 = M((e3, t3, o3) => {
    if (null == e3 || "" === e3)
      return e3;
    try {
      const o4 = Number(e3), n3 = new Date(e3);
      switch (t3) {
        case "currency":
          return new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }).format(o4);
        case "percent":
          return new Intl.NumberFormat("en-US", { style: "percent", minimumFractionDigits: 2 }).format(o4);
        case "decimal":
          return new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 }).format(o4);
        case "fixedPoint":
          return o4.toFixed(2);
        case "exponential":
          return o4.toExponential(2);
        case "thousands":
          return new Intl.NumberFormat("en-US").format(o4 / 1e3) + "K";
        case "millions":
          return new Intl.NumberFormat("en-US").format(o4 / 1e6) + "M";
        case "billions":
          return new Intl.NumberFormat("en-US").format(o4 / 1e9) + "B";
        case "trillions":
          return new Intl.NumberFormat("en-US").format(o4 / 1e12) + "T";
        case "largeNumber":
          return o4 >= 1e12 ? new Intl.NumberFormat("en-US").format(o4 / 1e12) + "T" : o4 >= 1e9 ? new Intl.NumberFormat("en-US").format(o4 / 1e9) + "B" : o4 >= 1e6 ? new Intl.NumberFormat("en-US").format(o4 / 1e6) + "M" : o4 >= 1e3 ? new Intl.NumberFormat("en-US").format(o4 / 1e3) + "K" : new Intl.NumberFormat("en-US").format(o4);
        case "shortDate":
          return n3.toLocaleDateString("en-US");
        case "longDate":
          return n3.toLocaleDateString("en-US", { year: "numeric", month: "long", day: "numeric" });
        case "shortTime":
          return n3.toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit" });
        case "longTime":
          return n3.toLocaleTimeString("en-US");
        case "longDateLongTime":
          return n3.toLocaleString("en-US", { year: "numeric", month: "long", day: "numeric", hour: "2-digit", minute: "2-digit", second: "2-digit" });
        case "shortDateShortTime":
          return n3.toLocaleString("en-US", { year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit" });
        case "day":
          return n3.getDate().toString();
        case "month":
          return n3.toLocaleDateString("en-US", { month: "long" });
        case "year":
          return n3.getFullYear().toString();
        case "monthAndDay":
          return n3.toLocaleDateString("en-US", { month: "short", day: "numeric" });
        case "monthAndYear":
          return n3.toLocaleDateString("en-US", { month: "long", year: "numeric" });
        case "quarter":
          return `Q${Math.floor(n3.getMonth() / 3) + 1}`;
        case "quarterAndYear":
          return `Q${Math.floor(n3.getMonth() / 3) + 1} ${n3.getFullYear()}`;
        case "dayOfWeek":
          return n3.toLocaleDateString("en-US", { weekday: "long" });
        case "hour":
          return n3.getHours().toString();
        case "minute":
          return n3.getMinutes().toString();
        case "second":
          return n3.getSeconds().toString();
        case "millisecond":
          return n3.getMilliseconds().toString();
        case "#,##0 ₫":
          return new Intl.NumberFormat("vi-VN", { style: "currency", currency: "VND" }).format(o4);
        case "dd/MM/yyyy":
          return n3.toLocaleDateString("vi-VN");
        default:
          return e3;
      }
    } catch (t4) {
      return e3;
    }
  }, []), a2 = k(() => (e2.columns || []).map((e3) => e3.getView()).map((t3, o3) => {
    const n3 = !e2.searchVisibleColumnsOnly || false !== t3.visible;
    return ae(D, { name: t3.dataField, dataField: t3.dataField, caption: t3.caption ?? t3.label, dataType: t3.dataType, format: t3.formatType, width: t3.width || void 0, visible: n3 && !t3.hidden, allowSorting: false !== t3.sortable && "none" !== e2.sortingMode, allowFiltering: false !== t3.filterable && e2.showFilterRow, allowHeaderFiltering: false !== t3.headFilterable && e2.showFilterPanel, allowSearch: false !== t3.searchable, allowEditing: false !== t3.editable, fixed: !!["left", "right", "sticky"].includes(t3.fixedPosition) || void 0, fixedPosition: ["left", "right", "sticky"].includes(t3.fixedPosition) ? t3.fixedPosition : void 0, alignment: t3.align, cellRender: t3.cellRender || (t3.formatType ? (e3) => {
      const o4 = r2(e3.value, t3.formatType, t3.dataType);
      return le("span", { children: o4 });
    } : void 0), calculateCellValue: (e3) => {
      const o4 = e3[t3.dataField];
      return null == o4 ? "" : o4;
    }, children: [t3.required && le(P, { message: t3.msgRequired }), t3.pattern && le(L, { pattern: t3.pattern, message: t3.msgPattern }), t3.rangeValidation && le($, { min: Number(t3.rangeValidationMin), max: Number(t3.rangeValidationMax), message: t3.msgRange }), t3.emailValidation && le(B, { message: t3.msgEmail }), t3.lookup && le(A, { allowClearing: true, dataSource: "" !== t3.lookupDataFilter ? (e3) => ((e4, t4, o4) => ({ store: t4, filter: e4.data ? [o4, "=", e4.data[o4]] : null }))(e3, t3.lookupData, t3.lookupDataFilter) : t3.lookupData, displayExpr: t3.displayExpr, valueExpr: t3.valueExpr })] }, t3.dataField || o3);
  }), [e2.columns, e2.sortingMode, e2.showFilterRow, e2.searchVisibleColumnsOnly]), l2 = R(false);
  R([]);
  const i2 = R(false);
  I(false);
  const [s2, d2] = I(false), p2 = k(() => {
    switch (e2.showCheckBoxesMode) {
      case "always":
      default:
        return true;
      case "none":
        return false;
      case "onClick":
      case "onLongTap":
        return s2;
    }
  }, [e2.showCheckBoxesMode, s2]);
  j(() => {
    var _a;
    const o3 = (_a = t2.current) == null ? void 0 : _a.instance().element();
    if (!o3)
      return;
    const n3 = `treelist-checkbox-${Date.now()}`;
    o3.classList.add(n3);
    const r3 = `treelist-checkbox-styles-${n3}`;
    let a3 = document.getElementById(r3);
    a3 || (a3 = document.createElement("style"), a3.id = r3, document.head.appendChild(a3));
    let l3 = "";
    return l3 = "none" === e2.showCheckBoxesMode ? `
        .${n3} .dx-treelist-headers .dx-checkbox,
        .${n3} .dx-treelist-rowsview .dx-checkbox {
          display: none !important;
        }
        .${n3} .dx-treelist-headers .dx-command-select,
        .${n3} .dx-treelist-rowsview .dx-command-select {
          display: none !important;
        }
      ` : p2 ? `
        .${n3} .dx-treelist-headers .dx-checkbox,
        .${n3} .dx-treelist-rowsview .dx-checkbox {
          display: block !important;
        }
        .${n3} .dx-treelist-headers .dx-command-select,
        .${n3} .dx-treelist-rowsview .dx-command-select {
          display: table-cell !important;
        }
      ` : `
        /* Default hide row checkboxes */
        .${n3} .dx-treelist-rowsview .dx-checkbox {
          display: none !important;
        }
        .${n3} .dx-treelist-rowsview .dx-command-select {
          display: none !important;
          width: 32px; /* prevent overlap */
        }
        /* Header checkbox always visible */
        .${n3} .dx-treelist-headers .dx-checkbox {
          display: block !important;
        }
        .${n3} .dx-treelist-headers .dx-command-select {
          display: table-cell !important;
          width: 32px;
        }
        /* Show checkbox when hovering or row is selected */
        .${n3} .dx-treelist-rowsview .dx-row:hover .dx-checkbox,
        .${n3} .dx-treelist-rowsview .dx-selection .dx-checkbox {
          display: block !important;
        }
        .${n3} .dx-treelist-rowsview .dx-row:hover .dx-command-select,
        .${n3} .dx-treelist-rowsview .dx-selection .dx-command-select {
          display: table-cell !important;
        }
        /* Adjust expand arrow position */
        .${n3} .dx-treelist-rowsview .dx-command-expand {
        }
        /* Ensure expand arrow stays visible */
        .${n3} .dx-treelist-rowsview .dx-command-expand {
          position: relative;
          z-index: 2;
        }
        .${n3} .dx-treelist-rowsview .dx-command-select .dx-checkbox {
          position: relative;
          z-index: 1;
        }
      `, a3.textContent = l3, () => {
      const e3 = document.getElementById(r3);
      e3 && e3.remove();
    };
  }, [p2, t2.current]);
  const m2 = M((o3) => {
    var _a, _b;
    if (!l2.current) {
      if ("selectedRowKeys" === o3.name && "page" === e2.selectAllMode) {
        const n3 = (_a = t2.current) == null ? void 0 : _a.instance();
        if (n3 && o3.value && Array.isArray(o3.value))
          try {
            const t3 = e2.pageSize || 10, r3 = e2.dataKeyExpr || "id", a3 = n3.getVisibleRows();
            let s3 = [];
            if (a3 && a3.length > 0) {
              const e3 = a3.map((e4) => e4.data).filter((e4) => e4);
              s3 = e3.map((e4) => e4[r3]).filter((e4) => void 0 !== e4);
            }
            const d3 = "manual" === e2.dataOptions ? (e2.dataManual || []).length : (((_b = n3.getDataSource()) == null ? void 0 : _b.items()) || []).length;
            if (i2.current && (o3.value.length > t3 || o3.value.length === d3))
              return l2.current = true, i2.current = false, void setTimeout(() => {
                try {
                  n3.clearSelection(), setTimeout(() => {
                    l2.current = false;
                  }, 50);
                } catch (e3) {
                  l2.current = false;
                }
              }, 10);
            if (o3.value.length > t3 || o3.value.length === d3)
              return l2.current = true, i2.current = true, void setTimeout(() => {
                if (n3 && s3.length > 0)
                  try {
                    n3.clearSelection(), n3.selectRows(s3, false), setTimeout(() => {
                      l2.current = false;
                    }, 50);
                  } catch (e3) {
                    l2.current = false;
                  }
              }, 10);
          } catch (e3) {
            l2.current = false;
          }
      }
      e2.onEvent("optionChanged");
    }
  }, [e2.selectAllMode, e2.pageSize, e2.pageIndex, e2.dataKeyExpr, e2.dataOptions, e2.dataManual, e2.onEvent]), u2 = M((t3) => {
    e2.selectionControl.updateSelection(t3), e2.onEvent("selectionChanged");
  }, [e2.onEvent, e2.selectionControl]), w2 = M((t3) => {
    e2.onEvent("rowClick");
  }, [e2.onEvent]), h2 = M((t3) => {
    e2.onEvent("rowDblClick");
  }, [e2.onEvent]);
  M((t3) => {
    e2.onEvent("cellClick");
  }, [e2.onEvent]), M((t3) => {
    e2.onEvent("cellDblClick");
  }, [e2.onEvent]);
  const g2 = M((t3) => {
    e2.onEvent("rowExpanding");
  }, [e2.onEvent]), x2 = M((t3) => {
    e2.onEvent("rowCollapsing");
  }, [e2.onEvent]), y2 = M((t3) => {
    e2.onEvent("rowExpanded");
  }, [e2.onEvent]), b2 = M((t3) => {
    e2.onEvent("rowCollapsed");
  }, [e2.onEvent]), v2 = M((t3) => {
    e2.onEvent("editorPreparing");
  }, [e2.onEvent]), E2 = M((t3) => {
    e2.onEvent("rowUpdating");
  }, [e2.onEvent]), f2 = M((t3) => {
    e2.onEvent("rowUpdated");
  }, [e2.onEvent]), C2 = M((t3) => {
    e2.onEvent("rowInserting");
  }, [e2.onEvent]), S2 = M((t3) => {
    e2.onEvent("rowInserted");
  }, [e2.onEvent]), V2 = M((t3) => {
    e2.onEvent("rowRemoving");
  }, [e2.onEvent]), _2 = M((t3) => {
    e2.onEvent("rowRemoved");
  }, [e2.onEvent]), ee2 = M((t3) => {
    if ("onLongTap" === e2.showCheckBoxesMode && t3.rowElement) {
      let e3;
      const o3 = () => {
        e3 = setTimeout(() => {
          s2 || d2(true);
        }, 500);
      }, n3 = () => {
        e3 && clearTimeout(e3);
      };
      t3.rowElement.addEventListener("touchstart", o3), t3.rowElement.addEventListener("touchend", n3), t3.rowElement.addEventListener("touchcancel", n3), t3.rowElement.addEventListener("mousedown", o3), t3.rowElement.addEventListener("mouseup", n3), t3.rowElement.addEventListener("mouseleave", n3);
    }
    e2.onEvent("rowPrepared");
  }, [e2.onEvent, e2.showCheckBoxesMode, s2]), te2 = M((t3) => {
    e2.onEvent("cellPrepared");
  }, [e2.onEvent]), oe2 = M((t3) => {
    e2.onEvent("contentReady");
  }, [e2.onEvent]), ne2 = M((t3) => {
    e2.onEvent("dataErrorOccurred");
  }, [e2.onEvent]), re2 = M((t3) => {
    e2.onEvent("initialized");
  }, [e2.onEvent]), ie2 = M((t3) => {
    e2.onEvent("focusedRowChanging");
  }, [e2.onEvent]), pe2 = M((t3) => {
    e2.onEvent("focusedRowChanged");
  }, [e2.onEvent]), me = M((t3) => {
    e2.onEvent("contextMenuPreparing");
  }, [e2.onEvent]), ue = M((t3) => {
    e2.onEvent("keyDown");
  }, [e2.onEvent]), we = k(() => e2.customButtonRow.map((e3) => ({ text: e3.children.label.getView(), icon: e3.children.icon.getView(), tooltip: e3.children.tooltip.getView(), textColor: e3.children.textColor.getView(), hoverColor: e3.children.hoverColor.getView(), onEvent: e3.children.onEvent.getView() })), [e2.customButtonRow]), he = k(() => e2.customButtonsHead.map((e3) => ({ text: e3.children.label.getView(), icon: e3.children.icon.getView(), tooltip: e3.children.tooltip.getView(), textColor: e3.children.textColor.getView(), hoverColor: e3.children.hoverColor.getView(), onEvent: e3.children.onEvent.getView() })), [e2.customButtonsHead]), ge = M((t3) => {
    var _a;
    const o3 = new X.Workbook(), n3 = o3.addWorksheet("TreeList"), r3 = "manual" === e2.dataOptions ? "string" == typeof e2.dataManual ? JSON.parse(e2.dataManual) : e2.dataManual : [], a3 = ((_a = e2.columns) == null ? void 0 : _a.map((e3) => {
      var _a2, _b, _c, _d, _e, _f;
      return { header: ((_b = (_a2 = e3.children) == null ? void 0 : _a2.caption) == null ? void 0 : _b.getView()) || ((_d = (_c = e3.children) == null ? void 0 : _c.label) == null ? void 0 : _d.getView()) || e3.caption || e3.label, key: ((_f = (_e = e3.children) == null ? void 0 : _e.dataField) == null ? void 0 : _f.getView()) || e3.dataField, width: 15 };
    })) || [];
    n3.columns = a3, Array.isArray(r3) && r3.forEach((e3) => {
      n3.addRow(e3);
    });
    const l3 = `TreeList.${e2.exportMode}`;
    o3.xlsx.writeBuffer().then((e3) => {
      Z(new Blob([e3], { type: "application/octet-stream" }), l3);
    }), e2.onEvent("exporting");
  }, [e2.onEvent, e2.dataOptions, e2.dataManual, e2.columns, e2.exportMode]), xe = M((o3) => {
    if (he.length > 0) {
      const e3 = he.map((e4) => ({ widget: "dxButton", options: { text: e4.text, hint: e4.tooltip, onClick: () => {
        e4.onEvent("onClick");
      }, template: (t3, o4) => {
        const n3 = document.createElement("div");
        n3.style.display = "flex", n3.style.alignItems = "center", n3.style.justifyContent = "center", n3.style.color = e4.textColor || "#616161", n3.style.padding = "6px 12px", n3.style.borderRadius = "4px", n3.style.transition = "all 0.2s ease-in-out", n3.style.cursor = "pointer", e4.tooltip && (n3.title = e4.tooltip), n3.addEventListener("mouseenter", () => {
          n3.style.color = e4.hoverColor || "#1890ff", n3.style.backgroundColor = `${e4.hoverColor || "#1890ff"}15`, n3.style.transform = "scale(1.05)";
        }), n3.addEventListener("mouseleave", () => {
          n3.style.color = e4.textColor || "#616161", n3.style.backgroundColor = "transparent", n3.style.transform = "scale(1)";
        });
        const r3 = document.createElement("span");
        if (n3.appendChild(r3), e4.icon) {
          const t4 = document.createElement("div");
          "string" == typeof e4.icon ? t4.innerHTML = e4.icon : t4.textContent = e4.text || "", n3.appendChild(t4);
        }
        o4.appendChild(n3);
      } }, location: "after" }));
      o3.toolbarOptions.items.unshift(...e3);
    }
    e2.showExport && o3.toolbarOptions.items.unshift({ location: "after", widget: "dxButton", options: { icon: "xlsx" === e2.exportMode ? "exportxlsx" : "exportpdf", hint: `Export to ${e2.exportMode.toUpperCase()}`, onClick: () => {
      if (t2.current) {
        const e3 = t2.current.instance();
        ge({ component: e3 });
      }
    } } }), e2.onEvent("toolbarPreparing");
  }, [e2.showExport, e2.exportMode, ge, he]);
  return ae(de, { width: "100%", ref: t2, ...n2, showBorders: e2.showBorders, showColumnLines: e2.showColumnLines, showRowLines: e2.showRowLines, rowAlternationEnabled: e2.alternatingRow, wordWrapEnabled: e2.wordWrapEnabled, focusedRowEnabled: e2.focusedRowEnabled, columnAutoWidth: e2.columnAutoWidth, columnHidingEnabled: e2.columnHidingEnabled, hoverStateEnabled: false, rootValue: null, autoExpandAll: false, onOptionChanged: m2, onSelectionChanged: u2, onRowClick: w2, onRowDblClick: h2, onRowExpanding: g2, onRowCollapsing: x2, onRowExpanded: y2, onRowCollapsed: b2, onEditorPreparing: v2, onRowUpdating: E2, onRowUpdated: f2, onRowInserting: C2, onRowInserted: S2, onRowRemoving: V2, onRowRemoved: _2, onRowPrepared: ee2, onCellPrepared: te2, onContentReady: oe2, onDataErrorOccurred: ne2, onInitialized: re2, onFocusedRowChanging: ie2, onFocusedRowChanged: pe2, onContextMenuPreparing: me, onKeyDown: ue, onToolbarPreparing: xe, height: "100%", columnResizingMode: "widget", loadPanel: { enabled: e2.loading, showIndicator: true, showPane: false }, children: [le(T, { enabled: e2.showColumnChooser, mode: "select" }), le(U, { enabled: e2.showColumnFixing }), le(O, { visible: e2.showFilterPanel }), le(N, { visible: e2.showFilterPanel }), le(z, { visible: e2.showFilterRow }), le(K, { visible: e2.showSearch, placeholder: "Search (TreeList: parent match shows all children, use FilterRow for number substring search)", highlightCaseSensitive: false, highlightSearchText: true, searchVisibleColumnsOnly: e2.searchVisibleColumnsOnly }), le(H, { mode: "standard", showScrollbar: e2.showScrolling ? "always" : "never", useNative: true }), le(W, { mode: e2.selectMode, allowSelectAll: "none" !== e2.selectAllMode, recursive: true }), le(q, { mode: e2.sortingMode }), le(G, { defaultPageSize: e2.pageSize, defaultPageIndex: e2.pageIndex }), le(J, { visible: e2.showPaging, allowedPageSizes: [5, 10, 20, 50, 100, "all"], showPageSizeSelector: e2.pagerShowPageSizeSelector, showNavigationButtons: true, showInfo: e2.pagerShowInfo, displayMode: "full" }), le(Q, { mode: e2.editMode, allowUpdating: e2.editable, allowDeleting: e2.editable, allowAdding: e2.editable, useIcons: e2.editShowIcon, confirmDelete: e2.confirmDelete }), (e2.editable || we.length > 0) && ae(D, { type: "buttons", children: [["cell", "row", "form", "popup"].includes(e2.editMode) && le(Y, { icon: "edit", name: "edit", text: c("treelist.edit") }), le(Y, { name: "delete", text: c("treelist.delete") }), we.map((e3, t3) => le(Y, { render: () => le(ce, { $textColor: e3.textColor, $hoverColor: e3.hoverColor, title: e3.tooltip || e3.text, children: e3.icon }), text: e3.text, onClick: (t4) => {
    e3.onEvent("onClick");
  } }, t3))] }), a2] }, `treelist-${e2.pageSize}`);
}).setPropertyViewFn((e2) => {
  var _a;
  return ae(ie, { children: [ae(p, { name: c("treelist.data"), children: [e2.dataOptions.propertyView({ label: c("treelist.mode"), radioButton: true }), "manual" === e2.dataOptions.getView() ? e2.dataManual.propertyView({ label: "Data (manual)" }) : e2.dataApi.propertyView({ label: "API URL" }), (_a = e2.dataKeyExpr) == null ? void 0 : _a.propertyView({ label: c("treelist.keyExpr") })] }), le(p, { name: c("treelist.columns"), children: [ne(e2.columns), e2.showColumnChooser.propertyView({ label: c("treelist.showChooser") }), e2.showColumnFixing.propertyView({ label: c("treelist.fixingColumns") })] }), le(p, { name: c("treelist.paging"), children: [e2.showPaging.propertyView({ label: c("treelist.showPaging") }), e2.pageSize.propertyView({ label: c("treelist.pageSize") }), e2.pageIndex.propertyView({ label: c("treelist.pageIndex") }), e2.pagerMode.propertyView({ label: c("treelist.mode") }), e2.pagerShowPageSizeSelector.propertyView({ label: c("treelist.showPageSizeSelector") }), e2.pagerShowInfo.propertyView({ label: c("treelist.showInfo") })] }), le(p, { name: c("treelist.sorting"), children: [e2.sortingMode.propertyView({ label: c("treelist.mode"), radioButton: true })] }), le(p, { name: c("treelist.selection"), children: [e2.selectMode.propertyView({ label: c("treelist.mode") }), e2.selectAllMode.propertyView({ label: c("treelist.selectAll"), radioButton: true }), e2.showCheckBoxesMode.propertyView({ label: c("treelist.showCheckBoxesMode") })] }), le(p, { name: c("treelist.editing"), children: [e2.editable.propertyView({ label: c("treelist.editable") }), e2.editMode.propertyView({ label: c("treelist.editMode") }), e2.editShowIcon.propertyView({ label: c("treelist.useIcons") }), e2.confirmDelete.propertyView({ label: c("treelist.confirmDelete") })] }), le(p, { name: c("treelist.filteringSearching"), children: [e2.showFilterPanel.propertyView({ label: c("treelist.showFilterPanel") }), e2.showFilterRow.propertyView({ label: c("treelist.showFilterRow") }), e2.showSearch.propertyView({ label: c("treelist.showSearch") }), ...e2.showSearch.getView() ? [e2.searchVisibleColumnsOnly.propertyView({ label: c("treelist.searchVisibleColumnsOnly") })] : []] }), le(p, { name: c("treelist.scrolling"), children: [e2.showScrolling.propertyView({ label: c("treelist.showScrollbar") })] }), le(p, { name: c("treelist.grouping"), children: [e2.showGroupPanel.propertyView({ label: c("treelist.showPanel") }), e2.showGroupContextMenu.propertyView({ label: c("treelist.showContextMenu") }), e2.groupAutoExpand.propertyView({ label: c("treelist.autoExpand") })] }), le(p, { name: c("treelist.interaction"), children: [e2.onEvent.getPropertyView(), e2.loading.propertyView({ label: c("treelist.loading") })] }), le(p, { name: c("treelist.customButtonsHead"), children: [e2.customButtonsHead && ne(e2.customButtonsHead)] }), le(p, { name: c("treelist.customButtonsRow"), children: [e2.customButtonRow && ne(e2.customButtonRow)] }), le(p, { name: c("treelist.summary"), children: [e2.summary && ne(e2.summary), e2.code.propertyView({ label: c("treelist.customCode") })] }), le(p, { name: c("treelist.export"), children: [e2.showExport.propertyView({ label: c("treelist.showExport") }), e2.showExport.getView && e2.showExport.getView() && e2.exportMode.propertyView({ label: c("treelist.fileType"), radioButton: true })] }), le(p, { name: c("treelist.gridStyles"), children: [e2.showBorders.propertyView({ label: c("treelist.showBorder") })] }), le(p, { name: c("treelist.columnStyle"), children: [e2.columnAutoWidth.propertyView({ label: c("treelist.autoWidth") }), e2.columnHidingEnabled.propertyView({ label: c("treelist.hidingEnabled") }), e2.showColumnLines.propertyView({ label: c("treelist.showColumnLines") })] }), le(p, { name: c("treelist.rowStyle"), children: [e2.alternatingRow.propertyView({ label: c("treelist.alternatingRow") }), e2.focusedRowEnabled.propertyView({ label: c("treelist.focusRow") }), e2.showRowLines.propertyView({ label: c("treelist.showRowLines") })] }), le(p, { name: c("treelist.cellStyle"), children: [e2.wordWrapEnabled.propertyView({ label: c("treelist.wordWrap") }), e2.showScrolling.propertyView({ label: c("treelist.showScrolling") })] })] });
}).build(), [new u("dataManual", "dataManualDesc"), new u("dataApi", "dataApiDesc"), new u("columns", "columnsDesc"), new w("selectedRows", (e2) => ({ selectedRowKeys: e2.children.selectionControl.children.selectedRowKeys.node(), selectedRowsData: e2.children.selectionControl.children.selectedRowsData.node() }), (e2) => ({ selectedRowsData: e2.selectedRowsData || [], selectedRowKeys: e2.selectedRowKeys || [] }), "Get selected rows data"), new w("pagination", (e2) => ({ pageIndex: e2.children.paginationControl.children.pageIndex.node(), pageSize: e2.children.paginationControl.children.pageSize.node() }), (e2) => ({ pageIndex: e2.pageIndex ? e2.pageIndex + 1 : 1, pageSize: e2.pageSize || 5 }), "Get pagination data")]);
export {
  pe as TreeListComp
};
