import { j as e } from "../../../../../_virtual/jsx-runtime.js";
import { usePanel as m, usePreviewMode as p, useSelectedBrickId as u, useSelectedSection as b, useEditorHelpers as f } from "../../../../../use-editor.js";
import { RxCross2 as x } from "../../../../../node_modules/.pnpm/react-icons@5.3.0_react@18.3.0-canary-3d9b20132-20240124/node_modules/react-icons/rx/index.js";
import { LuPanelLeft as h, LuPanelRight as g } from "../../../../../node_modules/.pnpm/react-icons@5.3.0_react@18.3.0-canary-3d9b20132-20240124/node_modules/react-icons/lu/index.js";
import { tx as i } from "../../../../style-system/dist/twind.js";
import j from "./PanelAttributes.js";
import k from "./PanelTheme.js";
import w from "./PanelBrickInspector.js";
import P from "./PanelSectionInspector.js";
import y from "./PanelLibrary.js";
import "react";
import "../../../../../node_modules/.pnpm/@formkit_auto-animate@0.8.2/node_modules/@formkit/auto-animate/index.js";
import "../../../../../node_modules/.pnpm/react-hot-toast@2.5.2_react-dom@18.3.0-canary-3d9b20132-20240124_react@18.3.0-canary-3d_c02c1e17bf76c343fd22d1f22394ecf5/node_modules/react-hot-toast/dist/index.js";
import { useBrick as v } from "../../../../../use-page-data.js";
import { Tooltip as N } from "../../../../../node_modules/.pnpm/@radix-ui_themes@3.1.4_@types_react-dom@18.3.6_@types_react@18.3.3__@types_react@18.3.3_46b1dabc193c5ff5696ee783983c694e/node_modules/@radix-ui/themes/dist/esm/components/tooltip.js";
function G({ className: S, ...l }) {
  const { panel: t, panelPosition: r } = m(), n = p(), a = u(), s = b(), { togglePanelPosition: c, hidePanel: d } = f(), o = v(a);
  return !t || t === "inspector" && !o && !s ? null : /* @__PURE__ */ e.jsx(
    "aside",
    {
      id: "floating-panel",
      className: i(
        `z-[9999] fixed top-0 bottom-0 flex shadow-2xl overscroll-none         min-w-[360px] w-[360px] opacity-100
        bg-white dark:bg-dark-900 border-upstart-200 dark:border-dark-700 overflow-visible`,
        {
          // "transition-transform duration-150": !!panel,
          "transition-all duration-100": !t,
          "left-0 border-r": r === "left",
          "right-0 border-l": r === "right",
          "-translate-x-full opacity-0": !t && r === "left",
          "translate-x-full": !t && r === "right"
        }
      ),
      ...l,
      children: /* @__PURE__ */ e.jsxs("div", { className: "flex-grow relative flex-col", children: [
        n === "desktop" && t === "library" && /* @__PURE__ */ e.jsx(y, {}),
        t === "inspector" && o && /* @__PURE__ */ e.jsx(w, { brick: o }),
        t === "inspector" && !o && s && /* @__PURE__ */ e.jsx(P, { section: s }),
        t === "theme" && /* @__PURE__ */ e.jsx(k, {}),
        t === "settings" && /* @__PURE__ */ e.jsx(j, {}),
        t && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
          /* @__PURE__ */ e.jsx(N, { content: "Close panel", delayDuration: 500, children: /* @__PURE__ */ e.jsx(
            "button",
            {
              type: "button",
              className: i(
                "absolute z-[9999] aspect-square h-7 w-7 top-0 flex justify-center items-center bg-gradient-to-tr from-red-800 to-red-700 hover:(opacity-80 text-white) border border-t-0 border-red-900 text-white/90",
                r === "right" ? "-left-7 rounded-bl" : "-right-7 rounded-br"
              ),
              onClick: () => {
                d();
              },
              children: /* @__PURE__ */ e.jsx(x, { className: "h-4 w-4" })
            }
          ) }),
          /* @__PURE__ */ e.jsxs(
            "button",
            {
              type: "button",
              className: i(
                "absolute z-[9999] aspect-square h-8 w-8 bottom-0 flex justify-center items-center bg-gray-100 hover:(bg-upstart-100 text-upstart-800) backdrop-blur-md border border-b-0 border-upstart-200 text-black/50",
                r === "right" ? "-left-8 rounded-tl border-r-0" : "-right-8 rounded-tr border-l-0"
              ),
              onClick: () => {
                c();
              },
              children: [
                r === "right" && /* @__PURE__ */ e.jsx(h, { className: "h-5 w-5" }),
                r === "left" && /* @__PURE__ */ e.jsx(g, { className: "h-5 w-5" })
              ]
            }
          )
        ] })
      ] })
    }
  );
}
export {
  G as default
};
//# sourceMappingURL=Panel.js.map
