import { j as e } from "../../../../../_virtual/jsx-runtime.js";
import { a as c, b as u } from "../../../../sdk/dist/shared/chunk-PSCN3VVA.js";
import "../../../../sdk/dist/shared/chunk-R6ATC4TC.js";
import "@sinclair/typebox";
import "../../../../sdk/dist/shared/chunk-CFF6Q7O7.js";
import "../../../../sdk/dist/shared/chunk-IKC3FK7L.js";
import "../../../../sdk/dist/shared/chunk-E6XEI7IK.js";
import "../../../../sdk/dist/shared/chunk-SQ5T4AT5.js";
import "../../../../sdk/dist/shared/chunk-G5CJU6RD.js";
import "../../../../sdk/dist/shared/chunk-PSTFJ5IJ.js";
import "../../../../sdk/dist/shared/chunk-NJGXC7D6.js";
import "../../../../sdk/dist/shared/chunk-SXHDQ64Z.js";
import "../../../../sdk/dist/shared/chunk-QX6OGRRT.js";
import "../../../../sdk/dist/shared/chunk-FLOMNC6J.js";
import "../../../../sdk/dist/shared/chunk-PLSV746R.js";
import "../../../../sdk/dist/shared/chunk-WBZW5LVH.js";
import "../../../../sdk/dist/shared/chunk-WYVJE6J5.js";
import "../../../../sdk/dist/shared/chunk-I3VL6SRH.js";
import "../../../../sdk/dist/shared/chunk-B3EATRFX.js";
import "../../../../sdk/dist/shared/chunk-IKHZD2JH.js";
import "../../../../sdk/dist/shared/chunk-PXI7AHWS.js";
import "../../../../sdk/dist/shared/chunk-SY6DZLTC.js";
import "../../../../sdk/dist/shared/chunk-7A2JNQX3.js";
import "../../../../sdk/dist/shared/chunk-3YVJ2ELD.js";
import "../../../../sdk/dist/shared/chunk-AFVJZPLS.js";
import "../../../../sdk/dist/shared/chunk-A3GF4PYW.js";
import "../../../../sdk/dist/shared/chunk-W33JMRRN.js";
import { useState as d, useMemo as f, useEffect as x } from "react";
import { useEditorHelpers as g } from "../../../../../use-editor.js";
import { tx as o } from "../../../../style-system/dist/twind.js";
import { PanelBlockTitle as b } from "./PanelBlockTitle.js";
import { IconRender as h } from "./IconRender.js";
import { nanoid as p } from "../../../../../node_modules/.pnpm/nanoid@5.1.5/node_modules/nanoid/index.browser.js";
import { l as y } from "../../../../sdk/dist/shared/chunk-GOMXZC4B.js";
import "lodash-es";
import { useSortable as j } from "../../../../../node_modules/.pnpm/@dnd-kit_react@0.1.21_react-dom@18.3.0-canary-3d9b20132-20240124_react@18.3.0-canary-3d_d5e73c0d556c94305a83c95cc0a8798b/node_modules/@dnd-kit/react/sortable.js";
const k = {
  basic: "Basic elements",
  widgets: "Widgets",
  media: "Media",
  container: "Containers & utilities"
  // layout: "Layout",
};
function se() {
  const { setMouseOverPanel: i } = g(), [t, l] = d(null);
  return /* @__PURE__ */ e.jsxs(
    "div",
    {
      onMouseEnter: () => i(!0),
      onMouseLeave: () => i(!1),
      className: "flex flex-col h-full",
      children: [
        /* @__PURE__ */ e.jsx(b, { children: "Library" }),
        /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-3 flex-1", children: Object.entries(k).map(([n, m]) => /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2", children: [
          /* @__PURE__ */ e.jsx("div", { className: "text-xs font-bold uppercase text-gray-600 bg-upstart-50 px-3 py-2", children: m }),
          /* @__PURE__ */ e.jsx(
            "div",
            {
              className: o("grid gap-1.5 mx-2"),
              style: {
                gridTemplateColumns: "repeat(auto-fill, minmax(66px, 1fr))"
              },
              children: Object.values(c).filter((r) => r.category === n && !r.hideInLibrary).filter((r) => !r.inlineDragDisabled).map((r, a) => /* @__PURE__ */ e.jsx(
                v,
                {
                  defaults: u[r.type],
                  index: a,
                  onMouseOver: (s) => {
                    l(r);
                  },
                  onMouseLeave: () => l(null)
                },
                r.type
              ))
            }
          )
        ] }, n)) }),
        /* @__PURE__ */ e.jsx(
          "div",
          {
            className: o(
              "mt-auto p-2 bg-upstart-50 font-normal text-upstart-700 text-xs rounded transition-opacity",
              t ? "opacity-100" : "opacity-0"
            ),
            children: t?.description
          }
        )
      ]
    }
  );
}
function v(i) {
  const {
    defaults: { manifest: t },
    index: l,
    ...n
  } = i, [m, r] = d(p()), a = f(() => y(t.type), [m]), s = j({
    // const draggable = useDraggable({
    id: a.id,
    type: "library",
    data: { manifest: t, brick: a, fromLibrary: !0 },
    feedback: "clone",
    index: 0
  });
  return x(() => {
    s.isDragging || r(p());
  }, [s.isDragging]), /* @__PURE__ */ e.jsx(
    "div",
    {
      "data-brick-template-type": a.type,
      "data-brick-min-w": t.minWidth?.desktop,
      "data-brick-min-h": t.minHeight?.desktop,
      "data-brick-default-w": t.defaultWidth?.desktop,
      "data-brick-default-h": t.defaultHeight?.desktop,
      ref: s.ref,
      ...n,
      className: o(
        `rounded border border-upstart-100 hover:border-upstart-600 hover:bg-upstart-50 bg-white dark:bg-dark-700 !cursor-grab
        active:!cursor-grabbing touch-none select-none pointer-events-auto draggable-brick group aspect-square
        z-[99999] flex flex-col items-center justify-center`,
        s.isDragging && "shadow-2xl border-upstart-600 scale-110"
      ),
      ...i,
      children: /* @__PURE__ */ e.jsxs(
        "div",
        {
          className: o(
            "flex-1 flex flex-col justify-center text-upstart-700 dark:text-upstart-400 items-center gap-1 rounded-[inherit]"
          ),
          children: [
            /* @__PURE__ */ e.jsx(h, { manifest: t }),
            /* @__PURE__ */ e.jsx("span", { className: o("text-center text-xs"), children: t.name })
          ]
        }
      )
    }
  );
}
export {
  se as default
};
//# sourceMappingURL=PanelLibrary.js.map
