import { cB as e, f_ as t, e1 as n, f$ as i, g0 as a, av as s, g1 as r, g2 as o, cr as l, g3 as c, g4 as p, g5 as d, g6 as m, g7 as h, g8 as g, g9 as f, ga as y, gb as j, gc as u, gd as k, ge as x, gf as b, gg as w } from "./index-f50c05c4.js";
import v, { useContext as C, useState as T, useCallback as A, useMemo as O } from "react";
import { lA as P, lR as S, lS as B } from "./ant-design-icons-b1480d8d.js";
import { _ as I } from "./lodash-f1e42446.js";
import { d as N } from "./styled-components-1e696d6b.js";
import { D as L, C as R, N as D } from "./styledComponents-d8f6d0ac.js";
import { x as E } 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 "./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";
import "./devextreme-2fa5bb9a.js";
const M = N.div`
  display: flex;
  width: fit-content;
  max-width: calc(100% - 8px);
`, $ = N.div`
  padding: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;

  &:hover .copy-icon {
    visibility: visible;
  }
`;
function q(e2) {
  return "number" == typeof e2 ? (e2 + "").toString().length : "string" == typeof e2 || "boolean" == typeof e2 ? e2.toString().length : 0;
}
function H(e2, t2 = 2) {
  const n2 = /* @__PURE__ */ new Set();
  return JSON.stringify(e2, (e3, t3) => {
    if ("object" == typeof t3 && null !== t3) {
      if (n2.has(t3))
        return "[Circular]";
      n2.add(t3);
    }
    return t3;
  }, t2);
}
function K(i2, a2, s2, r2) {
  const o2 = "function" == typeof i2 ? "Function" : H(i2), l2 = {}, c2 = true === r2 ? q(o2) > 42 ? o2.slice(0, 42) + "..." : o2 : q(o2) > 20 ? o2.slice(0, 20) + "..." : o2;
  if (l2[a2] = s2, Array.isArray(i2)) {
    const e2 = {};
    return i2.forEach((t2, n2) => {
      e2[n2] = t2;
    }), P(F, { name: a2, desc: l2, data: e2, isArray: true, modal: r2 }, a2);
  }
  return I.isPlainObject(i2) ? P(F, { name: a2, desc: l2, data: i2, modal: r2 }, a2) : S($, { style: { marginLeft: "20px", borderBottom: "1px solid #f0f0f0", height: "32px", display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [S(e, { title: s2, placement: "right", children: [P(t, { label: a2 }), " ​"] }), S("div", { style: { display: "flex", wordBreak: "break-all", textAlign: "right" }, children: [P("span", { style: { marginRight: "10px" }, children: c2 }), q(o2) > 0 && P(n, { text: i2, style: { color: "#ccc", marginRight: "0px", marginTop: "4px" } })] })] }, a2);
}
function X(e2) {
  let t2 = [], n2 = [];
  return e2.forEach((i2, a2) => {
    a2 < 15 && t2.push(i2), a2 >= e2.length - 5 && a2 < e2.length && n2.push(i2);
  }), { preArr: t2, afterArr: n2 };
}
function z(e2) {
  const t2 = Object.keys(e2.data), n2 = X;
  return P("div", { children: t2.length < 30 ? t2.map((t3) => {
    var _a;
    return K(e2.data[t3], t3, (_a = e2.desc) == null ? void 0 : _a[t3], e2.modal);
  }) : S(B, { children: [n2(t2).preArr.map((t3) => {
    var _a;
    return K(e2.data[t3], t3, (_a = e2.desc) == null ? void 0 : _a[t3], e2.modal);
  }), P(f, { num: t2.length - 6 }), n2(t2).afterArr.map((t3) => {
    var _a;
    return K(e2.data[t3], t3, (_a = e2.desc) == null ? void 0 : _a[t3], e2.modal);
  })] }) });
}
N(n)`
  visibility: hidden;
  margin-left: 8px;
  color: #1890ff;
  cursor: pointer;
`;
const F = v.memo((t2) => {
  var _a;
  const { data: r2 = {} } = t2, o2 = 1 === Object.keys(r2).length;
  return P(i, { isSelected: t2.isSelected, isOpen: t2.isOpen, config: [{ key: t2.name, title: S("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [P(e, { title: (_a = t2.desc) == null ? void 0 : _a[t2.name], placement: "right", children: S(M, { onClick: () => t2.onClick && t2.onClick(t2.name), children: [P(a, { style: { whiteSpace: "nowrap", textOverflow: "ellipsis", overflow: "hidden" }, label: t2.name, hasChild: Object.keys(r2).length > 0 }), P(a, { style: { flexShrink: 0 }, color: "#8B8FA3", label: `${t2.isArray ? "[]" : "{}"} ${s(t2.isArray ? o2 ? "leftPanel.propTipArr" : "leftPanel.propTipsArr" : o2 ? "leftPanel.propTip" : "leftPanel.propTips", { num: Object.keys(r2).length })}` })] }) }), Object.keys(r2).length > 0 && P(n, { text: H(r2), style: { color: "#aaa", marginRight: "8px" } })] }), data: z({ data: r2, desc: t2.desc, modal: t2.modal }) }] });
}), V = N(w)`
  .ant-tabs-nav {
    background-color: ${r};
    height: 40px;
    padding: 0 16px;
    margin: 0;

    .ant-tabs-tab {
      padding: 0;
      font-weight: 500;
    }
  }

  .ant-tabs-tabpane {
    height: calc(100vh - ${o} - 40px);
  }
`, J = N.div`
  height: calc(100vh - ${o});
`, U = (t2) => {
  const { uiComp: n2 } = t2, i2 = C(l), [a2, r2] = T([]), [o2, f2] = T([]), w2 = (e2, t3, n3) => {
    const { items: i3, children: a3 } = e2;
    if (Object.keys(i3).length) {
      for (const e3 in i3) {
        const a4 = { title: i3[e3].children.name.getView(), type: i3[e3].children.compType.getView(), key: e3, children: [] };
        if (n3) {
          const e4 = x(t3, n3);
          e4 == null ? void 0 : e4.children.push(a4);
        } else
          t3.push(a4);
      }
      t3 = I.sortBy(t3, [(e3) => e3.title]);
    }
    if (Object.keys(a3).length)
      for (const e3 in a3)
        w2(a3[e3], t3, e3);
    return t3;
  }, v2 = A((e2) => {
    i2.setSelectedCompNames(/* @__PURE__ */ new Set([e2]), "leftPanel");
  }, [i2]), N2 = A((e2, t3) => {
    i2.setSelectedBottomRes(t3, e2);
  }, [i2]), M2 = (t3) => {
    const n3 = I.sortBy(i2.uiCompInfoList(), [(e2) => e2.name]), l2 = "components" === t3 ? i2.getUIComp().getTree() : i2.getHooksComp().getUITree(), c2 = w2(l2, []);
    let p2 = [];
    if (1 === i2.selectedCompNames.size) {
      const e2 = Object.keys(i2.selectedComps())[0], t4 = y(c2, e2);
      if (t4 && t4.length) {
        let e3 = false;
        t4.forEach((t5) => {
          a2.includes(t5) || (e3 = true);
        }), e3 && r2(I.union(a2, t4));
      }
      p2.push(e2);
    }
    return P(L, { treeData: c2, checkable: false, selectable: false, icon: (e2) => e2.type && P("div", { style: { margin: "16px 4px 0 -4px" }, children: R[e2.type] || P(j, {}) }), switcherIcon: (e2) => e2.expanded ? P(u, {}) : P(k, {}), expandedKeys: a2, onExpand: (e2) => r2(e2), onClick: (e2, t4) => ((e3, t5, n4) => {
      var _a, _b, _c;
      v2(t5.title + "");
      const i3 = n4.find((e4) => e4.name === t5.title);
      if (!((_a = t5.children) == null ? void 0 : _a.length) && i3 && ((_b = Object.keys(i3.data)) == null ? void 0 : _b.length) && t5.selected) {
        const n5 = o2.findIndex((e4) => e4.key === t5.key);
        let i4 = [], a3 = ((_c = e3.currentTarget) == null ? void 0 : _c.offsetLeft) + 20;
        i4 = n5 > -1 ? o2.map((e4) => e4.key === t5.key ? { key: e4.key, show: !e4.show, clientX: a3 } : e4) : [...o2, { key: t5.key + "", show: true, clientX: a3 }], f2(i4);
      }
    })(e2, t4, n3), selectedKeys: p2, titleRender: (t4) => ((t5, n4) => {
      var _a;
      const i3 = o2.find((e2) => e2.key === t5.key), a3 = n4.find((e2) => e2.name === t5.title);
      return S(D, { children: [S("span", { children: [S("span", { children: [t5.title, " "] }), a3 && !!((_a = Object.keys(a3.data)) == null ? void 0 : _a.length) && P(e, (i3 == null ? void 0 : i3.show) ? { placement: "right", title: s("leftPanel.collapseTip", { component: t5.title }), children: P("div", { title: "", className: "show-data", onClick: (e2) => {
        e2.stopPropagation();
        const n5 = o2.map((e3) => e3.key === t5.key ? { key: e3.key, show: false, clientX: void 0 } : e3);
        f2(n5);
      } }) } : { placement: "right", title: s("leftPanel.expandTip", { component: t5.title }), children: P("div", { title: "", className: "no-data", onClick: (e2) => {
        var _a2;
        e2.stopPropagation();
        const n5 = o2.findIndex((e3) => e3.key === t5.key);
        let i4 = [];
        const a4 = { key: t5.key, show: true, clientX: (_a2 = e2.currentTarget.parentElement) == null ? void 0 : _a2.offsetLeft };
        i4 = n5 > -1 ? o2.map((e3) => e3.key === t5.key ? a4 : e3) : [...o2, a4], f2(i4);
      }, children: P(b, {}) }) })] }), (i3 == null ? void 0 : i3.show) && a3 && P(E, { title: S("div", { children: [P("div", { children: a3.name }), S("div", { style: { fontSize: "12px", color: "#666", fontWeight: "normal", marginTop: "4px" }, children: [P("strong", { children: "Type:" }), " ", a3.type] })] }), open: i3.show, onOk: () => f2([]), cancelButtonProps: { style: { display: "none" } }, closable: false, destroyOnHidden: true, maskClosable: false, okText: s("modalComp.close"), children: P("div", { style: { whiteSpace: "nowrap", wordWrap: "normal", maxHeight: "calc(100vh - 400px)", overflow: "scroll" }, onClick: (e2) => e2.stopPropagation(), children: (r3 = a3.data, l3 = a3.dataDesc, P("div", { children: Object.keys(r3).map((e2) => K(r3[e2], e2, l3 == null ? void 0 : l3[e2], true)) })) }) })] }, t5.key);
      var r3, l3;
    })(t4, n3) });
  }, $2 = O(() => {
    if (!c(i2.getAppType()))
      return M2("components");
  }, [i2, v2, a2, o2]), q2 = O(() => {
    if (!c(i2.getAppType()))
      return M2("modals");
  }, [i2, v2, a2, o2]), H2 = O(() => i2.bottomResComInfoList().map((e2) => P(F, { name: e2.name, desc: e2.dataDesc, data: e2.data, isSelected: i2.selectedBottomResName === e2.name, onClick: () => N2(e2.type, e2.name) }, e2.name)), [i2, N2]), X2 = O(() => I.sortBy(i2.hooksCompInfoList().filter((e2) => "hook" === p(e2.type)), [(e2) => e2.name]).map((e2) => P(F, { name: e2.name, desc: e2.dataDesc, data: e2.data, isSelected: false, onClick: I.noop }, e2.name)), [i2]), z2 = n2.getModuleLayoutComp(), U2 = P(d, { children: S("div", { style: { paddingBottom: 80 }, children: [P(m, { name: s("leftPanel.components"), width: 288, noMargin: true, children: P("span", { className: h, children: $2 }) }), P(m, { name: s("leftPanel.modals"), width: 288, noMargin: true, children: P("span", { children: q2 }) }), P(m, { name: s("leftPanel.queries"), width: 288, noMargin: true, children: P("span", { children: H2 }) }), P(m, { name: s("leftPanel.globals"), width: 288, noMargin: true, children: P("span", { children: X2 }) })] }) });
  if (!z2)
    return P(J, { className: "cypress-left-content", children: U2 });
  const W = [{ key: "state", label: P(g, { text: s("leftPanel.stateTab") }), children: P(B, { children: U2 }) }, { key: "module-setting", label: P(g, { text: s("leftPanel.settingsTab") }), children: P(d, { children: P("div", { style: { paddingBottom: 80, paddingTop: 16 }, children: P(m, { width: 288, noMargin: true, children: P("span", { children: z2.getConfigView() }) }) }) }) }];
  return P(J, { className: "cypress-left-content", children: P(V, { defaultActiveKey: "module-setting", items: W }) });
};
export {
  U as LeftContent,
  K as default
};
