import { jsx as r, jsxs as g } from "react/jsx-runtime";
import { forwardRef as h } from "react";
import { b as m } from "./use-section-style.BAfgyRSq.js";
import { u as v, E as x } from "./use-device-info.C708K3qk.js";
import { B as D } from "./BrickWrapper.D6AtxE97.js";
import { _ as d } from "./twind.D7be0E5m.js";
import { C as b } from "./dnd.esm.ByOls-Fs.js";
import { J as y, r as B } from "./use-editor.BroT97uF.js";
const M = h(({ brick: e, editable: i }, s) => {
  var o;
  const a = m(e);
  return /* @__PURE__ */ r("div", { className: d("flex flex-1 min-h-fit", Object.values(a)), ref: s, children: i ? /* @__PURE__ */ r(j, { brick: e }) : (o = e.props.$children) == null ? void 0 : o.map((t) => /* @__PURE__ */ r(D, { brick: t }, t.id)) });
}), C = (e, i, s) => null;
function j({ brick: e }) {
  const i = e.props, s = m(e), a = Object.values(s), { isDesktop: o } = v(), t = y(), u = B();
  return /* @__PURE__ */ r(
    b,
    {
      droppableId: e.id,
      type: "brick",
      isDropDisabled: !o,
      direction: "vertical",
      mode: "virtual",
      renderClone: C,
      children: (p, c) => {
        var f;
        return /* @__PURE__ */ r(
          "div",
          {
            ...p.droppableProps,
            ref: p.innerRef,
            className: d(
              "flex-1 flex",
              c.isDraggingOver && "!outline !outline-2 !outline-orange-300",
              (c.isDraggingOver || t) && "!overflow-y-hidden",
              c.isDraggingOver && "[&>*]:(!transform-none)",
              ...a
            ),
            children: ((f = i.$children) == null ? void 0 : f.length) > 0 ? i.$children.filter((n) => {
              var l;
              return !((l = n.props.hidden) != null && l[u]);
            }).map((n, l) => /* @__PURE__ */ r(x, { brick: n, isContainerChild: !0, index: l }, `${n.id}`)) : /* @__PURE__ */ g(
              "div",
              {
                className: d(
                  "w-full h-full text-center p-4 rounded flex justify-center items-center text-base font-medium"
                ),
                children: [
                  "This is a box.",
                  /* @__PURE__ */ r("br", {}),
                  "Drag bricks here to stack them inside."
                ]
              }
            )
          }
        );
      }
    }
  );
}
export {
  M as default
};
//# sourceMappingURL=box.s-Z4h_nj.js.map
