import { il as e, im as t, io as n, ip as i, iq as a, ir as r, is as o, it as l, iu as s, iv as d, iw as g, ix as c, iy as p, iz as m, iA as u, iB as h, iC as y, iD as v, fR as f, cr as b, dV as x, fh as C, iE as k, g1 as I, fS as S, fU as j, fV as B, av as N, fW as w, f_ as K, f$ as E, g0 as R } from "./index-6d97e67f.js";
import { useState as T, useEffect as P, useContext as z, useRef as U, useCallback as V, useMemo as $ } from "react";
import { lR as A, lA as D, lS as L, nl as F } from "./ant-design-icons-a81e6d18.js";
import { _ as W, g as O } from "./lodash-226cb5b1.js";
import { d as H } from "./styled-components-b776227d.js";
import { D as q, C as M, N as X } from "./styledComponents-e4c67913.js";
import { z as Y, o as G, B as J, F as _, M as Q, E as Z, S as ee, I as te, G as ne, D as ie } from "./antd-eb0b81b8.js";
import "./axios-0ffd51b8.js";
import "./redux-devtools-36ca30b8.js";
import "./alasql-f59e855e.js";
import "./react-router-38313ddc.js";
import "./fontawesome-7bcd29b1.js";
import "react-dom";
import "./dnd-kit-e0a0bf75.js";
import "./moment-d731d247.js";
import "./crypto-js-8020edb5.js";
import "./dayjs-63343308.js";
import "./numbro-48e81844.js";
import "./papaparse-088c0adc.js";
import "./uuid-82f303b2.js";
import "./supabase-6aa220db.js";
import "./websockets-80729b50.js";
import "./fetch-03ca8116.js";
import "./react-draggable-1ced44e5.js";
import "./clsx-b06d39d3.js";
import "./remark-gfm-72b87c7d.js";
import "./buffer-f89d742d.js";
import "./rehype-raw-49057806.js";
import "./parse5-31d0cb5d.js";
import "./rehype-sanitize-38a120e4.js";
import "./simplebar-react-a37a9b2a.js";
import "./react-best-gradient-color-picker-2e7ff36d.js";
import "./ua-parser-js-1d18a3f8.js";
import "./loglevel-5e7e37fc.js";
import "./codemirror-8fe65581.js";
import "./really-relaxed-json-e5391d6a.js";
import "./immer-c0428a8d.js";
import "./redux-saga-3b3a9c7b.js";
import "./hotkeys-js-216206c9.js";
import "./cnchar-8c3eaa86.js";
import "./react-documents-a03b99c9.js";
import "./sql-formatter-69e8df59.js";
import "./rc-trigger-7d152aa4.js";
import "./react-json-view-364658b4.js";
import "./qrcode-react-417e3716.js";
import "./katex-05fb1c31.js";
import "./ecogis-maps-10e82de5.js";
import "./devextreme-be18bda8.js";
import "./exceljs-1678d36b.js";
import "./file-saver-es-c18fae8f.js";
function ae(f2) {
  const { themeSettingKey: b2, name: x2, desc: C2, color: k2, radius: I2, configChange: S2, showVarName: j2 = true, margin: B2, padding: N2, borderStyle: w2, borderWidth: K2, borderColor: E2, fontFamily: R2, showComponentLoadingIndicators: z2, showDataLoadingIndicators: U2, dataLoadingIndicator: V2, gridColumns: $2, gridRowHeight: L2, gridRowCount: F2, gridPaddingX: O2, gridPaddingY: H2, gridBgImage: q2, gridBgImageRepeat: M2, gridBgImageSize: X2, gridBgImagePosition: _2, gridBgImageOrigin: Q2 } = f2, Z2 = W.debounce(S2, 0), [ee2, te2] = T(k2), [ne2, ie2] = T(I2), [ae2, re2] = T(B2), [oe2, le2] = T(N2), [se2, de] = T(w2), [ge, ce] = T(K2), [pe, me] = T(E2), [ue, he] = T(R2), [ye, ve] = T(z2), [fe, be] = T(U2), [xe, Ce] = T(V2), [ke, Ie] = T($2), [Se, je] = T(L2), [Be, Ne] = T(F2), [we, Ke] = T(O2), [Ee, Re] = T(H2), [Te, Pe] = T(q2), [ze, Ue] = T(M2), [Ve, $e] = T(X2), [Ae, De] = T(_2), [Le, Fe] = T(Q2), We = `(${b2})`, Oe = () => {
    ee2 && e(ee2) && t(ee2) ? t(ee2) ? (te2(ee2), S2({ themeSettingKey: b2, color: ee2 })) : (te2(v(ee2)), S2({ themeSettingKey: b2, color: v(ee2) })) : te2(k2);
  }, He = (e2) => {
    let t2 = "";
    t2 = e2 && 0 !== Number(e2) ? /^[0-9]+$/.test(e2) ? Number(e2) + "px" : /^[0-9]+(px|%)$/.test(e2) ? e2 : "0" : "0", ie2(t2), S2({ themeSettingKey: b2, radius: t2 });
  }, qe = (e2) => {
    let t2 = "";
    t2 = e2 && 0 !== Number(e2) ? /^[0-9]+$/.test(e2) ? Number(e2) + "px" : /^[0-9]+(px|%)$/.test(e2) ? e2 : "3px" : "0", re2(t2), S2({ themeSettingKey: b2, margin: t2 });
  }, Me = (e2) => {
    let t2 = "";
    t2 = e2 && 0 !== Number(e2) ? /^[0-9]+$/.test(e2) ? Number(e2) + "px" : /^[0-9]+(px|%)$/.test(e2) ? e2 : "3px" : "0", le2(t2), S2({ themeSettingKey: b2, padding: t2 });
  }, Xe = (e2) => {
    let t2 = "";
    t2 = e2 || "solid", de(t2), S2({ themeSettingKey: b2, borderStyle: t2 });
  }, Ye = (e2) => {
    let t2 = "";
    t2 = e2 && 0 !== Number(e2) ? /^[0-9]+$/.test(e2) ? Number(e2) + "px" : /^[0-9]+(px|%)$/.test(e2) ? e2 : "1px" : "0", ce(e2), S2({ themeSettingKey: b2, borderWidth: t2 });
  }, Ge = (e2) => {
    let t2 = "";
    t2 = e2 || "Roboto, sans-serif", he(t2), S2({ themeSettingKey: b2, fontFamily: t2 });
  }, Je = (e2) => {
    let t2 = "";
    if (t2 = e2 || ("gridRowHeight" === b2 ? "8" : "24"), "gridRowHeight" === b2)
      return je(t2), void S2({ themeSettingKey: b2, gridRowHeight: t2 });
    Ie(t2), S2({ themeSettingKey: b2, gridColumns: t2 });
  }, _e = (e2) => {
    let t2 = 1 / 0;
    "" !== e2 && (t2 = Number(e2)), Ne(t2), S2({ themeSettingKey: b2, gridRowCount: t2 });
  }, Qe = (e2) => {
    let t2 = 20;
    return "" !== e2 && (t2 = Number(e2)), "gridPaddingX" === b2 ? (Ke(t2), void S2({ themeSettingKey: b2, gridPaddingX: t2 })) : "gridPaddingY" === b2 ? (Re(t2), void S2({ themeSettingKey: b2, gridPaddingY: t2 })) : void 0;
  }, Ze = (e2) => {
    switch (b2) {
      case "gridBgImage":
        Pe(e2), S2({ themeSettingKey: b2, gridBgImage: e2 });
        break;
      case "gridBgImageRepeat":
        Ue(e2 || "no-repeat"), S2({ themeSettingKey: b2, gridBgImageRepeat: e2 });
        break;
      case "gridBgImageSize":
        $e(e2 || "cover"), S2({ themeSettingKey: b2, gridBgImageSize: e2 });
        break;
      case "gridBgImagePosition":
        De(e2 || "center"), S2({ themeSettingKey: b2, gridBgImagePosition: e2 });
        break;
      case "gridBgImageOrigin":
        Fe(e2 || "padding-box"), S2({ themeSettingKey: b2, gridBgImageOrigin: e2 });
    }
  };
  return P(() => {
    ee2 && (e(ee2) || t(ee2)) && Z2({ themeSettingKey: b2, color: ee2 });
  }, [ee2]), P(() => {
    te2(k2);
  }, [k2]), P(() => {
    ie2(I2);
  }, [I2]), P(() => {
    re2(B2);
  }, [B2]), P(() => {
    le2(N2);
  }, [N2]), P(() => {
    Ie($2);
  }, [$2]), P(() => {
    Ne(F2);
  }, [F2]), P(() => {
    de(w2);
  }, [w2]), P(() => {
    ce(K2);
  }, [K2]), P(() => {
    me(E2);
  }, [E2]), P(() => {
    he(R2);
  }, [R2]), P(() => {
    ve(z2);
  }, [z2]), P(() => {
    be(U2);
  }, [U2]), P(() => {
    Ce(V2);
  }, [V2]), P(() => {
    Ke(O2);
  }, [O2]), P(() => {
    Re(H2);
  }, [H2]), A(n, { className: f2.className, children: ["showDataLoadingIndicators" !== b2 && "showComponentLoadingIndicators" !== b2 && A("div", { className: "text-desc", children: [A("div", { className: "name", children: [x2, " ", j2 && D("span", { children: We })] }), D("div", { className: "desc", children: C2 })] }), "radius" !== b2 && "margin" !== b2 && "padding" !== b2 && "borderStyle" !== b2 && "borderWidth" !== b2 && "fontFamily" !== b2 && "showComponentLoadingIndicators" !== b2 && "showDataLoadingIndicators" !== b2 && "dataLoadingIndicator" !== b2 && "gridColumns" !== b2 && "gridRowHeight" !== b2 && "gridRowCount" !== b2 && "gridPaddingX" !== b2 && "gridPaddingY" !== b2 && "gridBgImage" !== b2 && "gridBgImageRepeat" !== b2 && "gridBgImageSize" !== b2 && "gridBgImagePosition" !== b2 && "gridBgImageOrigin" !== b2 && A("div", { className: "config-input", children: [D(i, { changeColor: te2, color: ee2, trigger: "hover", allowGradient: "canvas" === b2 || "primarySurface" === b2 }), D(a, { value: ee2, onChange: (e2) => te2(e2.target.value), onBlur: Oe, onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Oe() })] }), "radius" === b2 && A("div", { className: "config-input", children: [D(r, { $radius: I2 || "0", children: D("div", { children: D(o, { style: { width: "16px", margin: "-2px 0 2px -2px", padding: "0px" } }) }) }), D(a, { value: ne2, onChange: (e2) => ie2(e2.target.value), onBlur: (e2) => He(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && He(e2.currentTarget.value) })] }), "borderStyle" === b2 && A("div", { className: "config-input", children: [D(l, { $borderStyle: w2 || "solid", children: D("div", { children: D(s, { style: { width: "16px", margin: "2px 0 0 2px", padding: "0px" } }) }) }), D(a, { value: se2, onChange: (e2) => de(e2.target.value), onBlur: (e2) => Xe(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Xe(e2.currentTarget.value) })] }), "borderWidth" === b2 && A("div", { className: "config-input", children: [D(d, { $borderWidth: K2 || "1px", children: D("div", { children: D(g, { style: { width: "16px", margin: "2px 0 0 2px", padding: "0px" } }) }) }), D(a, { value: ge, onChange: (e2) => ce(e2.target.value), onBlur: (e2) => Ye(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Ye(e2.currentTarget.value) })] }), "margin" === b2 && A("div", { className: "config-input", children: [D(c, { $margin: B2 || "4px", children: D("div", { children: D(p, { title: "" }) }) }), D(a, { value: ae2, onChange: (e2) => re2(e2.target.value), onBlur: (e2) => qe(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && qe(e2.currentTarget.value) })] }), "padding" === b2 && A("div", { className: "config-input", children: [D(m, { $padding: N2 || "4px", children: D("div", { children: D(u, { title: "" }) }) }), D(a, { value: oe2, onChange: (e2) => le2(e2.target.value), onBlur: (e2) => Me(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Me(e2.currentTarget.value) })] }), "fontFamily" === b2 && D("div", { className: "config-input", children: D(a, { value: ue, onChange: (e2) => he(e2.target.value), onBlur: (e2) => Ge(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Ge(e2.currentTarget.value) }) }), "showComponentLoadingIndicators" === b2 && A("div", { style: { display: "flex", gap: "6px", lineHeight: "normal" }, children: [D(Y, { size: "small", checked: ye, onChange: (e2) => {
    ve(e2), S2({ themeSettingKey: b2, showComponentLoadingIndicators: e2 });
  } }), D("span", { children: x2 })] }), "showDataLoadingIndicators" === b2 && A("div", { style: { display: "flex", gap: "6px", lineHeight: "normal" }, children: [D(Y, { size: "small", checked: fe, onChange: (e2) => {
    be(e2), S2({ themeSettingKey: b2, showDataLoadingIndicators: e2 });
  } }), D("span", { children: x2 })] }), "dataLoadingIndicator" === b2 && D("div", { style: { marginTop: "6px" }, children: D(G, { block: true, value: xe, options: [{ value: "spinner", label: "Spinner" }, { value: "skeleton", label: "Skeleton" }], onChange: (e2) => {
    Ce(e2), S2({ themeSettingKey: b2, dataLoadingIndicator: e2 });
  } }) }), "gridColumns" === b2 && A("div", { className: "config-input", children: [D(h, { $gridColumns: $2 || "24", children: D("div", { children: D(y, { title: "" }) }) }), D(J, { style: { width: "90%", margin: "8px 5% 0 5%" }, min: 8, max: 48, value: parseInt(ke || "24"), onChange: (e2) => Ie(e2.toString()), onChangeComplete: (e2) => Je(e2.toString()) })] }), "gridRowHeight" === b2 && A("div", { className: "config-input", children: [D(h, { $gridColumns: $2 || "24", children: D("div", { children: D(y, { title: "" }) }) }), D(J, { style: { width: "90%", margin: "8px 5% 0 5%" }, min: 4, max: 100, value: parseInt(Se || "8"), onChange: (e2) => je(e2.toString()), onChangeComplete: (e2) => Je(e2.toString()) })] }), "gridRowCount" === b2 && A("div", { className: "config-input", children: [D(h, { $gridColumns: $2 || "24", children: D("div", { children: D(y, { title: "" }) }) }), D(a, { type: "number", min: 0, value: Be, onChange: (e2) => {
    if ("" === e2.target.value)
      return Ne(1 / 0);
    Ne(Number(e2.target.value));
  }, onBlur: (e2) => _e(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && _e(e2.currentTarget.value) })] }), "gridPaddingX" === b2 && A("div", { className: "config-input", children: [D(m, { $padding: "3px", children: D("div", { children: D(u, { title: "" }) }) }), D(a, { type: "number", min: 0, value: we, onChange: (e2) => {
    if ("" === e2.target.value)
      return Ke(void 0);
    Ke(Number(e2.target.value));
  }, onBlur: (e2) => Qe(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Qe(e2.currentTarget.value) })] }), "gridPaddingY" === b2 && A("div", { className: "config-input", children: [D(m, { $padding: "3px", children: D("div", { children: D(u, { title: "" }) }) }), D(a, { type: "number", min: 0, value: Ee, onChange: (e2) => {
    if ("" === e2.target.value)
      return Re(void 0);
    Re(Number(e2.target.value));
  }, onBlur: (e2) => Qe(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Qe(e2.currentTarget.value) })] }), "gridBgImage" === b2 && D("div", { className: "config-input", children: D(a, { value: Te, onChange: (e2) => Pe(e2.target.value), onBlur: (e2) => Ze(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Ze(e2.currentTarget.value) }) }), "gridBgImageRepeat" === b2 && D("div", { className: "config-input", children: D(a, { value: ze, onChange: (e2) => Ue(e2.target.value), onBlur: (e2) => Ze(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Ze(e2.currentTarget.value) }) }), "gridBgImageSize" === b2 && D("div", { className: "config-input", children: D(a, { value: Ve, onChange: (e2) => $e(e2.target.value), onBlur: (e2) => Ze(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Ze(e2.currentTarget.value) }) }), "gridBgImagePosition" === b2 && D("div", { className: "config-input", children: D(a, { value: Ae, onChange: (e2) => De(e2.target.value), onBlur: (e2) => Ze(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Ze(e2.currentTarget.value) }) }), "gridBgImageOrigin" === b2 && D("div", { className: "config-input", children: D(a, { value: Le, onChange: (e2) => Fe(e2.target.value), onBlur: (e2) => Ze(e2.target.value), onKeyUp: (e2) => "Enter" === e2.nativeEvent.key && Ze(e2.currentTarget.value) }) })] });
}
const re = [{ label: "Hide Component", key: "hidden" }, { label: "Disable Component", key: "disable" }, { label: "Margin", key: "style.margin" }, { label: "Padding", key: "style.padding" }, { label: "Font Size", key: "style.textSize" }, { label: "Font Weight", key: "style.textWeight" }, { label: "Font Family", key: "style.fontFamily" }, { label: "Font Style", key: "style.fontStyle" }, { label: "Text Transform", key: "style.textTransform" }, { label: "Text Decoration", key: "style.textDecoration" }, { label: "Border Radius", key: "style.borderRadius" }, { label: "Border Width", key: "style.borderWidth" }, { label: "Border Style", key: "style.borderStyle" }, { label: "Background Image", key: "style.backgroundImage" }, { label: "Background Image Repeat", key: "style.backgroundImageRepeat" }, { label: "Background Image Size", key: "style.backgroundImageSize" }, { label: "Background Image Position", key: "style.backgroundImagePosition" }, { label: "Background Image Origin", key: "style.backgroundImageOrigin" }], oe = H.div`
  height: calc(100vh - ${f});
`, le = H(ie)`
  .ant-dropdown-menu-item-icon {
    width: 14px !important;
    height: 14px !important; 
    max-width: 14px !important;
  }
`, se = (e2) => {
  const t2 = z(b), [n2, i2] = T([]);
  x(), C();
  const [a2, r2] = T(t2.getCollisionStatus()), [o2, l2] = T([]), [s2, d2] = T(""), [g2, c2] = T(null), [p2, m2] = T(""), u2 = U(null);
  P(() => {
    k(a2);
  }, [a2]);
  const h2 = V((e3) => {
    c2(e3);
  }, []), y2 = (e3, t3, n3) => {
    const { items: i3, children: a3 } = e3;
    if (Object.keys(i3).length)
      for (const e4 in i3) {
        const a4 = { title: i3[e4].children.name.getView(), type: i3[e4].children.compType.getView(), key: e4, children: [] };
        if (n3) {
          const e5 = I(t3, n3);
          a4.disabled = true, e5 == null ? void 0 : e5.children.push(a4);
        } else
          t3.push(a4);
      }
    if (Object.keys(a3).length)
      for (const e4 in a3)
        y2(a3[e4], t3, e4);
    return t3;
  }, v2 = V((e3) => {
    t2.setSelectedCompNames(/* @__PURE__ */ new Set([e3]), "leftPanel");
  }, [t2]), [f2, H2] = T([]);
  P(() => {
    const e3 = G2();
    H2(e3);
  }, [t2]);
  const G2 = () => {
    const e3 = t2.getUIComp().getTree(), n3 = y2(e3, []), i3 = t2.rootComp.toJsonValue();
    return "module" === i3.ui.compType ? n3.forEach((e4) => {
      e4.pos = i3.ui.comp.container.layout[e4.key].pos;
    }) : n3.forEach((e4) => {
      e4.pos = i3.ui.layout[e4.key].pos;
    }), n3.sort((e4, t3) => {
      const n4 = (e4 == null ? void 0 : e4.pos) || 0, i4 = (t3 == null ? void 0 : t3.pos) || 0;
      return n4 < i4 ? -1 : n4 > i4 ? 1 : 0;
    }), n3;
  }, J2 = (e3) => {
    const { expandedKeys: t3 } = e3;
    t3.includes(e3.node.key) || i2(t3);
  }, ie2 = (e3, t3) => {
    const n3 = t3.split("-").map((e4) => Number(e4));
    let i3 = { children: e3 };
    for (let e4 = 0; e4 < n3.length; e4++)
      i3 = i3.children[n3[e4]];
    return i3;
  };
  V((e3) => {
    switch (e3) {
      case "hidden":
      case "disable":
        return "true | false";
      case "style.border":
        return "e.g., #ffffff";
      case "style.borderRadius":
      case "style.radius":
        return "e.g., 4px";
      case "style.borderWidth":
        return "e.g., 2px";
      case "style.borderStyle":
        return "solid | dashed | dotted";
      case "style.backgroundImage":
        return "URL as string";
      case "style.backgroundImageRepeat":
        return "repeat | repeat-x | repeat-y | no-repeat";
      case "style.backgroundImageSize":
        return "cover | contain | % | px";
      case "style.backgroundImagePosition":
        return "top | bottom | center | % | px";
      case "style.backgroundImageOrigin":
        return "padding-box | border-box | content-box";
      case "style.margin":
      case "style.padding":
        return "e.g., 4px 8px 16px 32px";
      case "style.textSize":
        return "e.g., 16px";
      case "style.textWeight":
        return "bold | 900 | normal | 400";
      case "style.fontFamily":
        return "Arial, sans-serif";
      case "style.fontStyle":
        return "normal | italic | oblique";
      case "style.textTransform":
        return "none | capitalize | uppercase | lowercase";
      case "style.textDecoration":
        return "none | underline | overline | line-through";
      default:
        return "Action Value";
    }
  }, []);
  const se2 = (e3, n3) => {
    var _a, _b, _c, _d, _e;
    for (let i3 of ge()) {
      const a3 = I(f2, i3), r3 = t2.getUICompByName(a3.title);
      if (r3) {
        const { children: t3 } = r3.children.comp, i4 = r3.children.compType.getView(), a4 = n3.split(".");
        1 === a4.length ? (_a = t3[a4[0]]) == null ? void 0 : _a.dispatchChangeValueAction(e3) : 2 === a4.length && (t3[a4[0]] ? t3[a4[0]].children[a4[1]] ? (_b = t3[a4[0]].children[a4[1]]) == null ? void 0 : _b.dispatchChangeValueAction(e3) : (_c = t3[a4[0]][a4[1]]) == null ? void 0 : _c.dispatchChangeValueAction(e3) : ((_d = t3[i4].children[a4[0]]) == null ? void 0 : _d.children[a4[1]]) && ((_e = t3[i4].children[a4[0]].children[a4[1]]) == null ? void 0 : _e.dispatchChangeValueAction(e3)));
      }
    }
  };
  P(() => {
    l2([]);
    const e3 = [], n3 = t2.getUIComp().getTree(), i3 = y2(n3, []);
    for (let n4 of t2.selectedCompNames)
      for (let t3 of i3)
        t3.title === n4 && e3.push(t3.key);
    l2(e3);
  }, [t2]);
  const de = (e3, n3) => {
    l2(e3);
    const i3 = /* @__PURE__ */ new Set();
    for (let e4 of n3.checkedNodes)
      i3.add(e4.title);
    t2.setSelectedCompNames(i3, "leftPanel");
  }, ge = () => o2, ce = () => s2, pe = V((e3) => {
    var _a, _b, _c, _d, _e;
    const n3 = ce();
    for (let i3 of ge()) {
      const a3 = I(f2, i3), r3 = t2.getUICompByName(a3.title);
      if (r3) {
        const { children: t3 } = r3.children.comp, i4 = r3.children.compType.getView(), a4 = e3.split(".");
        1 === a4.length ? (_a = t3[a4[0]]) == null ? void 0 : _a.dispatchChangeValueAction(n3) : 2 === a4.length && (t3[a4[0]] ? t3[a4[0]].children[a4[1]] ? (_b = t3[a4[0]].children[a4[1]]) == null ? void 0 : _b.dispatchChangeValueAction(n3) : (_c = t3[a4[0]][a4[1]]) == null ? void 0 : _c.dispatchChangeValueAction(n3) : ((_d = t3[i4].children[a4[0]]) == null ? void 0 : _d.children[a4[1]]) && ((_e = t3[i4].children[a4[0]].children[a4[1]]) == null ? void 0 : _e.dispatchChangeValueAction(n3)));
      }
    }
  }, [ce, ge]), me = () => {
    const e3 = W.sortBy(t2.uiCompInfoList(), [(e4) => e4.name]), l3 = t2.getCollisionStatus();
    return A(L, { children: [A("div", { style: { margin: "0px 16px" }, children: [A("div", { style: { marginBottom: "10px" }, children: [N("leftPanel.activatelayers"), D(Y, { style: { margin: "0px 10px" }, size: "small", defaultChecked: a2, disabled: false, onChange: (e4) => {
      var n3;
      n3 = e4, t2.rootComp.children.settings.children.disableCollision.dispatchChangeValueAction(n3), r2(n3);
    } })] }), D(q, { checkable: true, onCheck: de, selectable: false, checkedKeys: o2, draggable: l3, onDragEnter: J2, onDrop: (e4) => ((e5) => {
      const n3 = e5.node.pos.split("-"), i3 = e5.dragNode.pos.split("-");
      n3.length === i3.length && H2((a3) => {
        let r3 = O(a3);
        const o3 = Number(n3[n3.length - 1]), l4 = Number(i3[i3.length - 1]), s3 = n3.slice(0, -1).join("-"), d3 = "0" === s3 ? { children: r3 } : ie2(r3, s3);
        if (d3 && d3.children) {
          const t3 = d3.children.findIndex((t4) => t4.key === e5.dragNode.key);
          if (-1 !== t3) {
            const [e6] = d3.children.splice(t3, 1);
            d3.children.splice(o3 > l4 ? o3 - 1 : o3, 0, e6);
          }
        }
        const g3 = t2.rootComp.toJsonValue();
        let c3 = {};
        if ("module" === g3.ui.compType) {
          d3.children.forEach((e7, t3) => {
            c3[e7.key] = { ...g3.ui.comp.container.layout[e7.key], pos: t3 };
          });
          const e6 = t2.rootComp.children.ui.getModuleLayoutComp();
          e6 == null ? void 0 : e6.children.container.dispatchChangeValueAction({ ...g3.ui.comp.container, layout: c3 });
        } else
          d3.children.forEach((e6, t3) => {
            c3[e6.key] = { ...g3.ui.layout[e6.key], pos: t3 };
          }), t2.rootComp.children.ui.dispatchChangeValueAction({ ...g3.ui, layout: c3 });
        return r3;
      });
    })(e4), treeData: f2, icon: (e4) => e4.type && D("div", { style: { margin: "16px 5px 0 -3px" }, children: M[e4.type] || D(K, {}) }), switcherIcon: (e4) => e4.expanded ? D(E, {}) : D(R, {}), expandedKeys: n2, onExpand: (e4) => i2(e4), titleRender: (t3) => ((e4, t4) => (t4.find((t5) => t5.name === e4.title), D(X, { children: D("span", { children: D("span", { children: e4.title }) }) })))(t3, e3) }), D("div", { style: { margin: "10px 0px" }, children: A(_, { gap: "small", vertical: true, children: [D(le, { popupRender: () => D(Q, { items: re, onClick: ({ key: e4 }) => {
      h2(e4);
    } }), children: D(Z, { size: "small", children: A(ee, { children: ["Action ", D(F, {})] }) }) }), D(te, { ref: u2, value: s2, onChange: (e4) => d2(e4.target.value), placeholder: p2 }), D(Z, { type: "primary", disabled: !g2, onClick: () => g2 && pe(g2), children: "Apply Action" }), D("br", {}), D(ae, { themeSettingKey: "background", name: N("componentDoc.styleBackgroundColor"), color: "#ffffff", configChange: (e4) => se2(e4.color, "style.background") }), D(ae, { themeSettingKey: "border", name: N("componentDoc.styleBorderColor"), color: "#ffffff", configChange: (e4) => se2(e4.color, "style.border") }), D(ae, { themeSettingKey: "text", name: N("style.textColor"), color: "#ffffff", configChange: (e4) => se2(e4.color, "style.text") })] }) })] }), D(ne, {})] });
  }, ue = $(() => {
    if (!S(t2.getAppType()))
      return me();
  }, [t2, v2, n2, f2, s2]), he = D(j, { children: D("div", { style: { paddingBottom: 80 }, children: D(B, { name: N("leftPanel.layers"), width: 288, noMargin: true, children: D("div", { className: w, children: ue }) }) }) });
  return D(oe, { className: "cypress-left-content", children: he });
};
export {
  se as LeftLayersContent
};
