import { BottomContent as z } from "./9f3e881b.js";
import { a3 as u, le as h, am as R, H as r, lf as H, ad as g, lg as B, lh as C, I as P, h$ as I, li as $, lj as E } from "./56c67d3b.js";
import { useContext as L, useRef as M, useState as c, useMemo as j } from "react";
import { u as O, H as U } from "./0f39f5bd.js";
import "./f2c5273f.js";
import "./c320947b.js";
import "./e6615772.js";
import "react-dom";
const W = u.div`
  right: calc(313px + 4px); // FIXME: don't rely on the width of the right panel
  bottom: ${(t) => t.$bottom ? t.$bottom + 4 + "px" : 285 + 4 + "px"};
  position: fixed;
  z-index: ${h.queryResultPanel};

  display: flex;
  flex-direction: column;
  width: 592px;
  height: fit-content;
  max-height: 250px;
  background: #ffffff;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  pointer-events: auto;
  padding-bottom: 16px;
`, k = (t) => {
  const {
    bottom: e
  } = t, i = L(R), o = i.showResultComp(), a = o == null ? void 0 : o.result(), l = M(null), [m, n] = c(!0), [f, x] = c({
    left: 0,
    top: 0,
    bottom: 0,
    right: 0
  }), {
    header: w,
    body: y
  } = O({
    ...a ?? {
      data: "",
      dataType: "default",
      success: !0
    },
    onClose: () => i.setShowResultCompName(void 0)
  });
  return a ? /* @__PURE__ */ r(H, {
    disabled: m,
    bounds: f,
    enableUserSelectHack: !1,
    onStart: (X, d) => {
      var p;
      const {
        clientWidth: v,
        clientHeight: S
      } = window.document.documentElement, s = (p = l.current) == null ? void 0 : p.getBoundingClientRect();
      s && x({
        left: -s.left + d.x,
        right: v - (s.right - d.x),
        top: -s.top + d.y,
        bottom: S - (s.bottom - d.y)
      });
    },
    children: /* @__PURE__ */ g(W, {
      $bottom: e,
      ref: l,
      children: [/* @__PURE__ */ r(U, {
        onMouseOver: () => n(!1),
        onMouseOut: () => n(!0),
        children: w
      }), y]
    })
  }) : null;
}, D = u(E)`
  position: relative;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  border-top: 1px solid #e1e3eb;
  z-index: ${h.bottomPanel};

  .react-resizable-handle {
    position: absolute;
    border-top: transparent solid 3px;
    width: 100%;
    padding: 0 3px 3px 0;
    top: 0;
    cursor: row-resize;
  }
`, b = (t) => {
  t.preventDefault();
}, F = () => {
  window.addEventListener("mousedown", b);
}, T = () => {
  window.removeEventListener("mousedown", b);
};
function q(t) {
  const e = j(() => C(), []), i = document.documentElement.clientHeight, o = (m, n) => {
    $({
      ...e,
      bottom: {
        h: n.size.height
      }
    }), l(n.size.height), T();
  }, [a, l] = c(e.bottom.h);
  return /* @__PURE__ */ g(P, {
    children: [/* @__PURE__ */ r(k, {
      bottom: a
    }), /* @__PURE__ */ r(D, {
      width: 1 / 0,
      height: e.bottom.h,
      resizeHandles: ["n"],
      minConstraints: [680, 285],
      maxConstraints: [1 / 0, i - 48 - 40],
      onResizeStart: F,
      onResizeStop: o,
      children: /* @__PURE__ */ r(z, {})
    })]
  });
}
const N = (t) => ({
  orgId: I(t).currentOrgId,
  datasourceInfos: t.entities.datasource.data
}), _ = B(N, null)(q);
export {
  _ as default
};
