import J, { useContext as z, Fragment as he, useState as B, useMemo as me, useEffect as X } from "react";
import { X as b, F as t, n4 as Z, n5 as fe, a6 as $, G as Q, n6 as ge, n7 as ue, n8 as xe, n9 as ye, na as be, _ as M, nb as $e, nc as ve, nd as we, hY as V, iE as ee, Y as I, i1 as De, dk as te, af as K, ne as x, jl as Ie, jm as Se, iM as Ce, nf as Le, jN as Ae, ng as Fe, fH as Re, gh as ke, jO as Pe, av as _, fA as ne, nh as Te, ni as Be, iB as Ne, mV as ze, i9 as qe, cD as Oe, nj as W, nk as Qe, nl as Ee, nm as He, nn as je, m6 as Ve, gd as Me, no as _e, np as We, nq as Y, nr as Ue, cm as Ge, mb as Ke, lO as Ye, ag as Je, ns as Xe, nt as oe, cC as Ze } from "./603b75d9.js";
import { M as et } from "./c320947b.js";
import { a as tt } from "./2effcf20.js";
import { B as nt } from "./ceeb4a22.js";
import "react-dom";
const E = J.createContext({
  toggleFold: () => {
  },
  foldedStatus: {}
}), ot = b.div`
  position: relative;
  width: 100%;
  height: ${(e) => e.$itemHeight ?? 30}px;
  /* border: 1px solid #d7d9e0; */
  border-radius: 4px;
  margin-bottom: ${(e) => e.$positionLineHeight ?? 4}px;
  display: flex;
  /* padding: 0 8px; */
  align-items: center;
  opacity: ${(e) => e.$dragging ? "0.5" : 1};

  &::before {
    content: "";
    display: ${(e) => (e.$showPositionLineDot ?? !1) && e.$isOver && e.$showPositionLine ? "block" : "none"};
    position: absolute;
    background-color: #315efb;
    height: ${(e) => e.$positionLineDotDiameter}px;
    width: ${(e) => e.$positionLineDotDiameter}px;
    left: 0;
    border-radius: 100%;
    bottom: ${(e) => -(e.$positionLineHeight ?? 4) - ((e.$positionLineDotDiameter ?? 8) - (e.$positionLineHeight ?? 4)) / 2}px;
    left: ${(e) => e.$positionLineIndent ?? (e.$dropInAsSub ? 15 : -1)}px;
    z-index: 1;
  }

  &::after {
    content: "";
    display: ${(e) => e.$isOver && e.$showPositionLine ? "block" : "none"};
    height: ${(e) => e.$positionLineHeight ?? 4}px;
    border-radius: 4px;
    position: absolute;
    left: ${(e) => e.$positionLineIndent ?? (e.$dropInAsSub ? 15 : -1)}px;
    right: 0;
    background-color: #315efb;
    bottom: ${(e) => -(e.$positionLineHeight ?? 4)}px;
  }
`;
function it(e, i) {
  var L;
  const {
    extra: r,
    dragging: c = !1,
    dropInAsSub: h = !0,
    isOver: a = !1,
    dragListeners: w,
    children: g,
    path: l,
    ...S
  } = e, o = z(E), d = (L = o.positionLineIndent) == null ? void 0 : L.call(o, l, h), u = (o.showDropInPositionLine ?? !0) || !h;
  return /* @__PURE__ */ t(ot, {
    $showPositionLine: u,
    $positionLineIndent: d,
    $positionLineDotDiameter: o.positionLineDotDiameter,
    $showPositionLineDot: o.showPositionLineDot,
    $positionLineHeight: o.positionLineHeight,
    $itemHeight: o.itemHeight,
    $isOver: a,
    $dragging: c,
    $dropInAsSub: h,
    ref: i,
    ...S,
    ...w,
    children: g
  });
}
const rt = J.forwardRef(it), st = b.div`
  pointer-events: none;
  position: absolute;
  width: 100%;
  top: -${(e) => e.$positionLineHeight ?? 4}px;
  height: ${(e) => (e.$itemHeight ?? 30) * 0.6}px;
  z-index: 10;
  /* background-color: rgba(0, 0, 0, 0.2); */
  .position-line {
    height: ${(e) => e.$positionLineHeight ?? 4}px;
    border-radius: 4px;
    background-color: ${(e) => e.$active ? "#315efb" : "transparent"};
    width: 100%;
    margin-left: ${(e) => e.$positionLineIndent ?? 0}px;
    position: relative;
    &::after {
      content: "";
      position: absolute;
      background-color: #315efb;
      display: ${(e) => (e.$showPositionLineDot ?? !1) && e.$active ? "block" : "none"};
      left: 0;
      height: ${(e) => e.$positionLineDotDiameter ?? 8}px;
      width: ${(e) => e.$positionLineDotDiameter ?? 8}px;
      top: ${(e) => -((e.$positionLineDotDiameter ?? 8) - (e.$positionLineHeight ?? 4)) / 2}px;
      border-radius: 100%;
    }
  }
`;
function ie(e) {
  var l;
  const {
    path: i,
    disabled: r,
    targetListSize: c
  } = e, h = {
    targetPath: i,
    targetListSize: c,
    dropInAsSub: !1
  }, {
    setNodeRef: a,
    isOver: w
  } = Z({
    id: `p_${i.join("_")}`,
    disabled: r,
    data: h
  }), g = z(E);
  return /* @__PURE__ */ t(st, {
    $itemHeight: g.itemHeight,
    $showPositionLineDot: g.showPositionLineDot,
    $positionLineDotDiameter: g.positionLineDotDiameter,
    $positionLineHeight: g.positionLineHeight,
    $positionLineIndent: (l = g.positionLineIndent) == null ? void 0 : l.call(g, i, !1),
    $active: w,
    ref: a,
    children: /* @__PURE__ */ t("div", {
      className: "position-line"
    })
  });
}
function O(e, i) {
  return e ? typeof e == "function" ? e(i) : e : !0;
}
const at = b.div`
  position: relative;
`;
function U(e) {
  const {
    item: i,
    path: r,
    activeNode: c,
    disabled: h,
    parentDragging: a,
    disableDropIn: w,
    forceFold: g = !1,
    dropInAsSub: l = !0,
    isOverlay: S = !1,
    // onAddSubMenu,
    onDelete: o,
    renderContent: d
  } = e, u = i.id ?? r.join("_"), L = i.items, y = z(E), F = (g || y.foldedStatus[u]) && !y.unfoldAll, v = {
    path: r,
    node: i
  }, {
    listeners: s,
    setNodeRef: f,
    isDragging: C
  } = fe({
    id: u,
    data: v,
    disabled: y.disable ?? !1
  }), A = O(i.canDropIn, c == null ? void 0 : c.data), D = O(i.canDropBefore, c == null ? void 0 : c.data), p = O(i.canDropAfter, c == null ? void 0 : c.data), n = {
    targetListSize: L.length,
    targetPath: l ? [...r, 0] : [...r.slice(0, -1), r[r.length - 1] + 1],
    dropInAsSub: l
  }, {
    setNodeRef: m,
    isOver: P
  } = Z({
    id: u,
    disabled: C || h || w || !l && p === !1,
    data: n
  });
  return /* @__PURE__ */ $(Q, {
    children: [/* @__PURE__ */ $(at, {
      children: [c && D && /* @__PURE__ */ t(ie, {
        path: r,
        targetListSize: L.length,
        disabled: C || h
      }), /* @__PURE__ */ t(rt, {
        path: r,
        id: u,
        dropInAsSub: l && A !== !1,
        isOver: P,
        ref: (k) => {
          f(k), m(k);
        },
        ...s,
        children: (d == null ? void 0 : d({
          node: i,
          isOver: P,
          path: r,
          isOverlay: S,
          hasChildren: L.length > 0,
          dragging: !!(C || a),
          isFolded: F,
          onDelete: () => o == null ? void 0 : o(r),
          onToggleFold: () => y.toggleFold(u)
        })) || null
      })]
    }), L.length > 0 && !F && /* @__PURE__ */ t("div", {
      className: "sub-menu-list",
      children: L.map((k, q) => /* @__PURE__ */ t(he, {
        children: /* @__PURE__ */ t(U, {
          path: [...r, q],
          activeNode: c,
          dropInAsSub: !1,
          item: k,
          renderContent: d,
          disabled: h || C || w,
          onDelete: o,
          parentDragging: C
        })
      }, q))
    })]
  });
}
const lt = b.div`
  .menu-title {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .menu-list {
    margin-top: 8px;
    position: relative;
  }
`;
function dt(e) {
  const {
    node: i,
    onAddItem: r,
    onDeleteItem: c,
    onMoveItem: h,
    onAddSubItem: a,
    renderItemContent: w
  } = e, g = z(E), [l, S] = B(null), o = l && l.node.items.length > 0;
  function d(v) {
    S(v.active.data.current);
  }
  function u(v) {
    var C;
    const s = v.active.data.current, f = (C = v.over) == null ? void 0 : C.data.current;
    if (f) {
      const A = s.path, D = f.targetPath;
      if (A.length === D.length && M.isEqual(A.slice(0, -1), D.slice(0, -1))) {
        const p = A[A.length - 1];
        let n = D[D.length - 1];
        p < n && (n -= 1), h(D, p, n);
      } else {
        let p = D[D.length - 1], n = D, m = 0;
        c(A), f.dropInAsSub ? (n = n.slice(0, -1), m = a(n, s.node.data)) : m = r(n, s.node.data), f.targetListSize !== -1 && h(D, m, p);
      }
    }
    S(null);
  }
  const L = ge(ue(xe, {
    activationConstraint: {
      distance: 8
    }
  })), y = i.items[i.items.length - 1], F = O(y == null ? void 0 : y.canDropAfter, l == null ? void 0 : l.node.data);
  return /* @__PURE__ */ t(lt, {
    children: /* @__PURE__ */ $(ye, {
      sensors: L,
      onDragStart: d,
      onDragEnd: u,
      children: [i.items.map((v, s) => {
        const f = O(v.canDropIn, l == null ? void 0 : l.node.data);
        return /* @__PURE__ */ t(U, {
          activeNode: l == null ? void 0 : l.node,
          dropInAsSub: !o && f !== !1,
          disableDropIn: !!o || f === !1,
          renderContent: w,
          onAddSubMenu: a,
          onDelete: c,
          path: [s],
          item: v
        }, s);
      }), F && /* @__PURE__ */ t("div", {
        style: {
          position: "relative"
        },
        children: l && /* @__PURE__ */ t(ie, {
          targetListSize: -1,
          path: [i.items.length]
        })
      }), /* @__PURE__ */ t(be, {
        dropAnimation: null,
        children: l && /* @__PURE__ */ t(U, {
          isOverlay: !0,
          forceFold: g.showSubInDragOverlay === !1,
          path: [],
          item: l.node,
          renderContent: w
        })
      })]
    })
  });
}
function ct(e) {
  const {
    node: i,
    renderItemContent: r,
    ...c
  } = e, [h, a] = B({}), w = (o, d) => (d || (d = i.items), o.length === 1 ? d[o[0]] : w(o.slice(1), d[o[0]].items)), g = (o, d) => (d || (d = e.node), o.length === 1 ? d : g(o.slice(1), d.items[o[0]])), l = (o) => {
    a((d) => {
      const u = {
        ...d
      };
      return u[o] = !u[o], u;
    });
  }, S = me(() => ({
    ...c,
    toggleFold: l,
    foldedStatus: h
  }), [h, c]);
  return /* @__PURE__ */ t(E.Provider, {
    value: S,
    children: /* @__PURE__ */ t(dt, {
      node: i,
      renderItemContent: r,
      onAddItem: (o, d) => {
        const u = g(o);
        return u.addItem(d), u.items.length;
      },
      onDeleteItem: (o) => {
        g(o).deleteItem(o[o.length - 1]);
      },
      onAddSubItem: (o, d) => {
        const u = w(o);
        return u.addSubItem(d), u.items.length;
      },
      onMoveItem: (o, d, u) => {
        g(o).moveItem(d, u);
      }
    })
  });
}
const pt = b.div`
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  background-color: #ffffff;
`, ht = b.div`
  flex-shrink: 0;
  height: 40px;
  width: 100%;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
`, mt = b.span`
  font-weight: 500;
  font-size: 13px;
  color: #222222;
  line-height: 20px;
  display: inline-block;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  user-select: none;
`, ft = b.div`
  display: flex;
  align-items: center;
`, gt = b.div`
  height: 28px;
  padding: 0 16px;
  margin-bottom: 4px;
  .ant-input-affix-wrapper {
    height: 28px;
  }
`, ut = b(Fe)`
  height: 16px;
  width: 16px;
  margin-right: 16px;
  color: #9195a3;
  cursor: pointer;
  &:hover {
    color: ${$e};
  }
`, G = b(Re)`
  height: 12px;
  width: 12px;
  margin-right: 2px;
`, xt = b(ke)`
  &&& {
    height: 24px;
    width: 64px;
    padding: 4px 12px;
    background-color: #fafbff;
    color: #4965f2;
    border-color: #c9d1fc;
    display: flex;
    align-items: center;
    box-shadow: none;
  
    &:hover {
      color: #315efb;
      background-color: #f5faff;
      border-color: #c2d6ff;
    }
  
    &:focus {
      color: #315efb;
      background-color: #f5faff;
      border-color: #c2d6ff;
    }
  
    &:hover ${G} g {
      stroke: #315efb;
    }
  
    &:disabled,
    &:disabled:hover {
      background: #f9fbff;
      border: 1px solid #dee9ff;
      border-radius: 4px;
  
      ${G} g {
        stroke: #4965f230;
      }
    }
  }
`;
function yt(e) {
  const {
    items: i,
    refTreeComp: r,
    onOpenCreatePanel: c,
    onSelect: h,
    onCopy: a,
    onDelete: w
  } = e, g = V(ee), [l, S] = B(!1), [o, d] = B(""), u = (s) => i.find((f) => f.id() === s), L = (s) => {
    var p;
    const f = u(s.children.value.getView()), C = f == null ? void 0 : f.type(), A = (p = s.children.items) == null ? void 0 : p.getView().map((n) => L(n)).filter((n) => !!n), D = {
      id: f == null ? void 0 : f.id(),
      canDropBefore: (n) => C === x.Folder ? (n == null ? void 0 : n.type()) === x.Folder : (n == null ? void 0 : n.type()) !== x.Folder,
      canDropAfter: (n) => !(C !== x.Folder && (n == null ? void 0 : n.type()) === x.Folder),
      canDropIn: (n) => C !== x.Folder ? !1 : n ? n.type() !== x.Folder : !0,
      items: A,
      data: f,
      addSubItem(n) {
        const m = s.children.items.pushAction({
          value: n.id()
        });
        s.children.items.dispatch(m);
      },
      deleteItem(n) {
        const m = s.children.items.deleteAction(n);
        s.children.items.dispatch(m);
      },
      addItem(n) {
        const m = s.children.items.pushAction({
          value: n.id()
        });
        s.children.items.dispatch(m);
      },
      moveItem(n, m) {
        const P = s.children.items.arrayMoveAction(n, m);
        s.children.items.dispatch(P);
      }
    };
    if (!(o && f && !f.name().toLowerCase().includes(o.toLowerCase()) && A.length === 0))
      return D;
  }, y = L(r), F = r.getAllValuesInTree(), v = i.filter((s) => !F.includes(s.id())).map((s) => s.id());
  return X(() => {
    v.length > 0 && v.forEach((s) => {
      const f = r.children.items.pushAction({
        value: s,
        items: []
      });
      r.children.items.dispatch(f);
    });
  }, [v, r.children.items]), /* @__PURE__ */ $(pt, {
    style: e.style,
    children: [/* @__PURE__ */ $(ht, {
      children: [/* @__PURE__ */ $(mt, {
        children: [I("bottomPanel.title"), " (", i.length, ")"]
      }), /* @__PURE__ */ $(ft, {
        children: [/* @__PURE__ */ t(ut, {
          onClick: () => {
            S(!l), d("");
          }
        }), /* @__PURE__ */ $(xt, {
          disabled: g,
          onClick: () => {
            c();
          },
          children: [/* @__PURE__ */ t(G, {}), I("newItem")]
        })]
      })]
    }), l && /* @__PURE__ */ t(gt, {
      children: /* @__PURE__ */ t(De, {
        autoFocus: !0,
        allowClear: !0,
        value: o,
        placeholder: "Search",
        onChange: (s) => d(s.target.value),
        style: {
          marginTop: 0,
          height: 28
        }
      })
    }), /* @__PURE__ */ t(te, {
      children: i.length > 0 && y ? /* @__PURE__ */ t("div", {
        style: {
          paddingTop: 4,
          paddingBottom: 100,
          overflow: "hidden"
        },
        children: /* @__PURE__ */ t(ct, {
          node: y,
          disable: !!o,
          unfoldAll: !!o,
          showSubInDragOverlay: !1,
          showDropInPositionLine: !1,
          showPositionLineDot: !0,
          positionLineDotDiameter: 4,
          positionLineHeight: 1,
          itemHeight: 25,
          positionLineIndent: (s, f) => {
            const C = 2 + (s.length - 1) * 30;
            return f ? C + 12 : C;
          },
          renderItemContent: (s) => {
            const {
              node: f,
              onToggleFold: C,
              onDelete: A,
              ...D
            } = s, p = f.data;
            if (!p)
              return null;
            const n = p.id(), m = p.type();
            return /* @__PURE__ */ t(Dt, {
              id: n,
              node: f,
              resComp: p,
              onToggleFold: C,
              onCopy: () => a(m, n),
              onSelect: () => h(m, n),
              onDelete: () => {
                w(m, n) && A();
              },
              ...D
            }, n);
          }
        })
      }) : !g && /* @__PURE__ */ t(St, {
        newColumn: c
      })
    })]
  });
}
const bt = b.div`
  max-width: 100%;
  flex: 1;
  display: flex;
  padding-left: ${(e) => e.$level * 20 + (e.$foldable ? 0 : 14)}px;
  border-radius: 4px;
  border: 1px solid ${(e) => e.$active ? ve : "transparent"};
  align-items: center;
  justify-content: center;
`, $t = b.div`
  width: 100%;
  height: 25px;
  display: flex;
  user-select: none;
  padding-left: 2px;
  padding-right: 15px;
  /* background-color: #ffffff; */
  /* margin: 2px 0; */
  background-color: ${(e) => e.$isOverlay ? "rgba(255, 255, 255, 0.11)" : ""};

  &&& {
    background-color: ${(e) => e.$color && !e.$isOverlay ? "#f2f7fc" : null};
  }

  &:hover {
    background-color: #f2f7fc80;
    cursor: pointer;
  }

  .taco-edit-text-wrapper {
    width: 100%;
    height: 21px;
    line-height: 21px;
    color: #222222;
    margin-left: 0;
    font-size: 13px;
    padding-left: 0;

    &:hover {
      background-color: transparent;
    }
  }

  .taco-edit-text-input {
    width: 100%;
    height: 21px;
    line-height: 21px;
    color: #222222;
    margin-left: 0;
    font-size: 13px;
    background-color: #fdfdfd;
    border: 1px solid #3377ff;
    border-radius: 2px;

    &:focus {
      border-color: #3377ff;
      box-shadow: 0 0 0 2px #d6e4ff;
    }
  }
`, vt = b(Pe)`
  width: 16px;
  height: 16px;
  cursor: pointer;
  flex-shrink: 0;
  color: ${we};

  &:hover {
    color: #315efb;
  }
`, wt = b.div`
  width: 12px;
  height: 12px;
  display: flex;
  margin-right: 2px;
`;
function Dt(e) {
  const {
    id: i,
    resComp: r,
    isOver: c,
    isOverlay: h,
    path: a,
    isFolded: w,
    onDelete: g,
    onCopy: l,
    onSelect: S,
    onToggleFold: o
  } = e, [d, u] = B(void 0), [L, y] = B(!1), F = z(K), v = V(ee), {
    selectedBottomResName: s,
    selectedBottomResType: f
  } = F, C = a.length - 1, A = r.type(), D = r.name(), p = r.icon(), n = A === f && i === s, m = A === x.Folder;
  return /* @__PURE__ */ t($t, {
    onClick: () => {
      m && o(), S();
    },
    $color: n,
    $isOverlay: h,
    children: /* @__PURE__ */ $(bt, {
      $active: c && m,
      $level: C,
      $foldable: m,
      children: [m && /* @__PURE__ */ t(wt, {
        children: w ? /* @__PURE__ */ t(Se, {}) : /* @__PURE__ */ t(Ie, {})
      }), p, /* @__PURE__ */ $("div", {
        style: {
          flexGrow: 1,
          marginRight: "8px",
          width: "calc(100% - 62px)"
        },
        children: [/* @__PURE__ */ t(Ce, {
          text: D,
          forceClickIcon: m,
          disabled: !n || v || h,
          onFinish: (T) => {
            let N = !1, H = D;
            r.rename ? (H = r.rename(T), N = !!H) : (H = D, N = F.rename(D, T)), N && (F.setSelectedBottomRes(H, A), u(void 0));
          },
          onChange: (T) => {
            let N = "";
            r.checkName ? N = r.checkName(T) : N = F.checkRename(D, T), u(N);
          },
          onEditStateChange: (T) => y(T)
        }), /* @__PURE__ */ t(Le, {
          editorFocus: !!d && L,
          title: d ? I("error") : "",
          content: d,
          hasError: !!d
        })]
      }), !v && !h && /* @__PURE__ */ t(Ae, {
        copy: m ? void 0 : l,
        del: g,
        children: /* @__PURE__ */ t(vt, {
          tabIndex: -1
        })
      })]
    })
  });
}
const It = b.div`
  margin: 16px 16px 0 16px;
  width: 100%;
  min-height: 68px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border: 1px dashed #d7d9e0;
  border-radius: 4px;
  overflow: auto;
  min-width: 140px;
`, St = (e) => /* @__PURE__ */ t("div", {
  style: {
    display: "flex"
  },
  children: /* @__PURE__ */ $(It, {
    children: [/* @__PURE__ */ t("div", {
      style: {
        color: "#b8b9bf"
      },
      children: I("query.noQueries")
    }), /* @__PURE__ */ t("span", {
      style: {
        color: "#4965f2",
        cursor: "pointer",
        margin: "0 4px"
      },
      onClick: e.newColumn,
      children: I("newItem")
    })]
  })
}), Ct = b.div`
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: white;

  ${(e) => e.$placement === "editor" ? _`
          top: 0;
        ` : _`
          padding: 36px 0 0 0;
        `}

  .section-title {
    font-size: 13px;
    line-height: 1;
    color: ${ne};
    margin-bottom: 8px;
  }

  .section {
    margin-bottom: 12px;

    &:last-child {
      margin-bottom: 0px;
    }
  }
`, Lt = b.div`
  height: 40px;
  display: flex;
  padding: 0 16px;
  justify-content: space-between;
  align-items: ${(e) => e.$placement === "editor" ? "center" : "flex-start"};

  ${(e) => e.$shadow ? `box-shadow: ${Te};` : ""}
  .title-text {
    font-size: ${(e) => e.$placement === "editor" ? 16 : 18}px;
    font-weight: 500;
  }

  .title-close-btn {
    cursor: pointer;
    display: flex;
    align-items: center;
    color: ${ne};

    &:hover {
      color: ${Be};
    }
  }
`, At = b.div`
  height: calc(100% - 40px);
`, Ft = b.div`
  padding: 8px 16px 24px;
`, j = b.div`
  display: flex;
  gap: ${(e) => e.$placement === "queryLibrary" ? 12 : 8}px;
  flex-wrap: wrap;
`, R = (e) => {
  let i = "", r = Ge.noop, c = /* @__PURE__ */ t(Ve, {
    size: "large",
    dataSourceType: typeof e.identifier == "object" ? e.identifier.type : e.identifier
  });
  const h = {
    [x.TempState]: {
      label: I("query.tempState"),
      type: x.TempState
    },
    [x.Transformer]: {
      label: I("query.transformer"),
      type: x.Transformer
    },
    [x.DateResponder]: {
      label: I("query.dataResponder"),
      type: x.DateResponder
    },
    [x.Folder]: {
      label: I("query.folder"),
      type: x.Folder,
      extra: () => ({
        id: Me()
      })
    },
    js: {
      label: I("query.executeJSCode"),
      type: x.Query,
      extra: {
        compType: "js"
      }
    },
    libraryQuery: {
      label: I("query.importFromQueryLibrary"),
      type: x.Query,
      extra: {
        compType: "libraryQuery"
      }
    },
    restApi: {
      label: I("query.quickRestAPI"),
      type: x.Query,
      extra: {
        compType: "restApi",
        dataSourceId: _e
      }
    },
    streamApi: {
      label: I("query.quickStreamAPI"),
      type: x.Query,
      extra: {
        compType: "streamApi"
      }
    },
    graphql: {
      label: I("query.quickGraphql"),
      type: x.Query,
      extra: {
        compType: "graphql",
        dataSourceId: We
      }
    },
    lowcoderApi: {
      icon: Y.icon,
      label: Y.name,
      type: x.Query,
      extra: {
        compType: "lowcoderApi",
        dataSourceId: Ue
      }
    }
  };
  if (typeof e.identifier == "object") {
    const a = e.identifier;
    i = a.name, r = () => {
      e.onSelect(x.Query, {
        compType: a.type,
        dataSourceId: a.id
      });
    };
  } else if (h[e.identifier]) {
    const a = h[e.identifier];
    c = a.icon ?? c, i = a.label, r = () => {
      const w = typeof a.extra == "function" ? a.extra() : a.extra;
      e.onSelect(a.type, w);
    };
  }
  return /* @__PURE__ */ $(W, {
    onClick: r,
    size: e.size,
    children: [c, i]
  });
};
function Rt(e) {
  const {
    onSelect: i,
    onClose: r,
    recentlyUsed: c,
    datasource: h,
    placement: a = "editor"
  } = e, [w, g] = B(!1), [l, S] = B(!1), o = V(Ne), {
    width: d,
    ref: u
  } = ze({
    handleHeight: !1
  }), L = d ? Math.floor((d + 8) / (184 + 8)) : 3, y = a !== "queryLibrary" ? "small" : "middle", F = M.throttle((v) => {
    const s = v.target.scrollTop;
    g(s > 0);
  }, 100);
  return /* @__PURE__ */ $(Ct, {
    $placement: a,
    children: [/* @__PURE__ */ $(Lt, {
      $shadow: w,
      $placement: a,
      children: [/* @__PURE__ */ t("div", {
        onScroll: F,
        className: "title-text",
        children: I("query.newQuery")
      }), /* @__PURE__ */ t("div", {
        className: "title-close-btn",
        children: /* @__PURE__ */ t(qe, {
          onClick: r
        })
      })]
    }), /* @__PURE__ */ t(At, {
      children: /* @__PURE__ */ t(te, {
        scrollableNodeProps: {
          onScroll: F
        },
        children: /* @__PURE__ */ $(Ft, {
          children: [/* @__PURE__ */ t("div", {
            className: "section-title",
            children: I("query.recentlyUsed")
          }), /* @__PURE__ */ t("div", {
            ref: u,
            className: "section",
            children: /* @__PURE__ */ t(j, {
              $placement: a,
              children: M.uniq(c).slice(0, L).map((v, s) => /* @__PURE__ */ t(R, {
                size: y,
                identifier: v,
                onSelect: i
              }, s))
            })
          }), a === "editor" && /* @__PURE__ */ $(Q, {
            children: [/* @__PURE__ */ t("div", {
              className: "section-title",
              children: I("code")
            }), /* @__PURE__ */ t("div", {
              className: "section",
              children: /* @__PURE__ */ $(j, {
                $placement: a,
                children: [/* @__PURE__ */ t(R, {
                  size: y,
                  identifier: x.TempState,
                  onSelect: i
                }), /* @__PURE__ */ t(R, {
                  size: y,
                  identifier: x.Transformer,
                  onSelect: i
                }), /* @__PURE__ */ t(R, {
                  size: y,
                  identifier: x.DateResponder,
                  onSelect: i
                }), /* @__PURE__ */ t(R, {
                  size: y,
                  identifier: "js",
                  onSelect: i
                }), /* @__PURE__ */ t(R, {
                  size: y,
                  identifier: "libraryQuery",
                  onSelect: i
                }), /* @__PURE__ */ t(R, {
                  size: y,
                  identifier: x.Folder,
                  onSelect: i
                })]
              })
            })]
          }), a === "queryLibrary" && e.onImport && /* @__PURE__ */ $(Q, {
            children: [/* @__PURE__ */ t("div", {
              className: "section-title",
              children: I("home.import")
            }), /* @__PURE__ */ t("div", {
              className: "section",
              children: /* @__PURE__ */ t(j, {
                $placement: a,
                children: /* @__PURE__ */ t(Oe, {
                  accept: ".json",
                  showUploadList: !1,
                  customRequest: (v) => {
                    e.onImport(v);
                  },
                  multiple: !1,
                  children: /* @__PURE__ */ $(W, {
                    size: y,
                    children: [/* @__PURE__ */ t(Qe, {
                      width: "20px",
                      height: "20px",
                      style: {
                        marginRight: "8px"
                      }
                    }), I("query.importFromFile")]
                  })
                })
              })
            })]
          }), /* @__PURE__ */ t("div", {
            className: "section-title",
            children: I("query.datasource")
          }), /* @__PURE__ */ t("div", {
            className: "section",
            children: /* @__PURE__ */ $(j, {
              $placement: a,
              children: [/* @__PURE__ */ t(R, {
                size: y,
                identifier: "restApi",
                onSelect: i
              }), /* @__PURE__ */ t(R, {
                size: y,
                identifier: "streamApi",
                onSelect: i
              }), /* @__PURE__ */ t(R, {
                size: y,
                identifier: "graphql",
                onSelect: i
              }), a === "editor" && /* @__PURE__ */ t(R, {
                size: y,
                identifier: "lowcoderApi",
                onSelect: i
              }), h.map((v) => /* @__PURE__ */ t(R, {
                size: y,
                identifier: v,
                onSelect: i
              }, v.id)), o.orgDev && /* @__PURE__ */ $(W, {
                size: y,
                onClick: () => S(!0),
                children: [/* @__PURE__ */ t(Ee, {
                  children: /* @__PURE__ */ t(He, {})
                }), I("query.newDatasource")]
              })]
            })
          })]
        })
      })
    }), /* @__PURE__ */ t(je, {
      open: l,
      onCancel: () => S(!1),
      onCreated: () => S(!1)
    })]
  });
}
const re = b.div`
  width: 100%;
  height: 100%;
  background: #ffffff;
  display: flex;
`, se = b.div`
  position: relative;
  width: calc(30% - 1px);
  min-width: 248px;
  max-width: 296px;
  height: 100%;
  float: left;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
`, ae = b.div`
  width: 1px;
  height: 100%;
  background-color: #e1e3eb;
  position: relative;
  flex-shrink: 0;
`, le = b.div`
  position: relative;
  min-width: 0;
  height: 100%;
  overflow-y: hidden;
  overflow-x: auto;
  flex-grow: 1;
`;
function Et() {
  return /* @__PURE__ */ $(re, {
    children: [/* @__PURE__ */ t(se, {}), /* @__PURE__ */ t(ae, {}), /* @__PURE__ */ t(le, {})]
  });
}
const Ht = () => {
  var A, D;
  const e = z(K), i = V(Ke), r = e.selectedBottomResComp(), [c, h] = B(!1), a = e.getQueriesComp().getView(), w = e.getTempStatesComp().getView(), g = e.getTransformersComp().getView(), l = e.getFoldersComp().getView(), S = e.getDataRespondersComp().getView(), o = e.selectedBottomResType === x.Folder, d = e.rootComp.children.refTree, u = [...a, ...w, ...g, ...l, ...S], L = u.reverse().map((p) => {
    var n;
    if (p.type() === x.Query) {
      const m = i.find((P) => {
        var k;
        return P.datasource.id === ((k = p.children.datasourceId) == null ? void 0 : k.getView());
      });
      return (m == null ? void 0 : m.datasource) || ((n = p.children.compType) == null ? void 0 : n.getView());
    }
    return p.type();
  }), y = (p, n) => {
    const P = e.getBottomResListComp(p).add(e, n);
    h(!1);
    const k = p === x.Folder, q = o && !k ? e.selectedBottomResName : "", T = k ? l.length : void 0;
    e.rootComp.children.refTree.appendRef(q, P, T);
  }, F = (p, n) => {
    e.getBottomResListComp(p).copy(e, n);
  }, v = (p, n) => {
    const m = e.getBottomResListComp(p);
    return p === x.Folder && d.hasChildren(n) ? (Ze.error(I("query.folderNotEmpty")), !1) : (m.delete(n), !0);
  }, s = (p, n) => {
    e.getBottomResListComp(p).select(e, n);
  };
  X(() => {
    e.selectedBottomResName && h(!1);
  }, [e.selectedBottomResName, h]);
  const f = ((A = e.selectedQueryComp()) == null ? void 0 : A.children.datasourceId.getView()) || "", C = Ye(f);
  return /* @__PURE__ */ $(re, {
    className: tt,
    children: [/* @__PURE__ */ t(se, {
      children: /* @__PURE__ */ t(kt, {
        items: u,
        onOpenCreatePanel: () => h(!0),
        onDelete: v,
        onCopy: F,
        onSelect: s
      })
    }), /* @__PURE__ */ t(ae, {}), /* @__PURE__ */ t(le, {
      children: /* @__PURE__ */ $("div", {
        style: {
          width: "100%",
          height: "100%",
          minWidth: "480px",
          display: "flex",
          flexDirection: "column"
        },
        children: [/* @__PURE__ */ t(et.Provider, {
          value: C,
          children: /* @__PURE__ */ t(Je.Provider, {
            value: ((D = e.selectedQueryComp()) == null ? void 0 : D.children.name.getView()) || "",
            children: r ? r.getPropertyView() : Tt
          })
        }), (c || o) && /* @__PURE__ */ t(Rt, {
          recentlyUsed: L,
          datasource: i.map((p) => p.datasource).filter((p) => p.creationSource !== 2),
          onSelect: y,
          onClose: () => h(!1)
        })]
      })
    })]
  });
};
function kt(e) {
  var S, o;
  const {
    items: i,
    onOpenCreatePanel: r,
    onCopy: c,
    onSelect: h,
    onDelete: a
  } = e, w = z(K), g = (S = w.selectedQueryComp()) == null ? void 0 : S.children.datasourceId.getView(), l = (o = w.selectedQueryComp()) == null ? void 0 : o.children.compType.getView();
  return /* @__PURE__ */ $(Q, {
    children: [/* @__PURE__ */ t(yt, {
      refTreeComp: w.rootComp.children.refTree,
      dataSourceId: g,
      items: i,
      onCopy: c,
      onDelete: a,
      onSelect: h,
      onOpenCreatePanel: r
    }), g && l && /* @__PURE__ */ t(nt, {
      dataSourceId: g,
      queryType: l
    })]
  });
}
const Pt = _`
  user-select: text;

  font-size: 13px;
  line-height: 13px;
  cursor: text;
`, de = b.div`
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  transform: translateY(-48px);
`, ce = b.span`
  ${Pt};
  display: block;
  margin-top: 10px;
  color: #b8b9bf;
  text-align: center;
`, pe = b.div`
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
`, Tt = /* @__PURE__ */ $(Q, {
  children: [Xe, /* @__PURE__ */ t(pe, {
    children: /* @__PURE__ */ $(de, {
      children: [/* @__PURE__ */ t(oe, {}), /* @__PURE__ */ t(ce, {
        children: I("bottomPanel.noSelectedQuery")
      })]
    })
  })]
}), jt = /* @__PURE__ */ t(pe, {
  children: /* @__PURE__ */ $(de, {
    children: [/* @__PURE__ */ t(oe, {}), /* @__PURE__ */ t(ce, {
      children: I("bottomPanel.noSelectedQuery")
    })]
  })
});
export {
  Ht as BottomContent,
  Et as BottomSkeleton,
  Tt as EmptyQuery,
  jt as EmptyQueryWithoutTab
};
