"use client";
import { jsx as r, jsxs as d } from "react/jsx-runtime";
import Z from "../../../components/base/add-new-section.js";
import { EditorRenderBlock as _ } from "../../../components/base/editor-render-block.js";
import { Popover as l } from "../../../components/shared/popover.js";
import { RenderIcon as $ } from "../../../components/shared/render-icon.js";
import { generateImageUrl as i } from "../../../utils/index.js";
import { useBreakpoint as t } from "../../../hooks/use-breakpoint.js";
const mo = ({
  id: H,
  settings: o,
  children: J,
  meta: c,
  isEditable: m
}) => {
  var p, b, u, e, n, w, N, h, x, O, k, v, B, C, I, S, j, R, T, U, y, z, A, D, E, L, P, q, F;
  const a = t(), K = (c == null ? void 0 : c.locale) || "en", M = (u = (b = (p = o == null ? void 0 : o.button) == null ? void 0 : p.text) == null ? void 0 : b.content) == null ? void 0 : u[K], f = (w = (n = (e = o == null ? void 0 : o.button) == null ? void 0 : e.image) == null ? void 0 : n.media) != null && w.path ? i((x = (h = (N = o == null ? void 0 : o.button) == null ? void 0 : N.image) == null ? void 0 : h.media) == null ? void 0 : x.path) : (v = (k = (O = o == null ? void 0 : o.button) == null ? void 0 : O.image) == null ? void 0 : k.media) == null ? void 0 : v.url, Q = ((C = (B = o == null ? void 0 : o.content) == null ? void 0 : B.side) == null ? void 0 : C[a]) ?? "bottom", V = ((S = (I = o == null ? void 0 : o.content) == null ? void 0 : I.sideOffset) == null ? void 0 : S[a]) ?? 0, W = ((R = (j = o == null ? void 0 : o.content) == null ? void 0 : j.align) == null ? void 0 : R[a]) ?? "start", X = ((U = (T = o == null ? void 0 : o.content) == null ? void 0 : T.alignOffset) == null ? void 0 : U[a]) ?? 0;
  return /* @__PURE__ */ r("div", { className: "dropdown", children: /* @__PURE__ */ d(l, { children: [
    /* @__PURE__ */ d(l.Trigger, { className: "reset dropdown-button flex items-center gap-1", children: [
      f && /* @__PURE__ */ r(
        "img",
        {
          className: "dropdown-button-image h-6 w-6",
          src: f,
          alt: ((A = (z = (y = o == null ? void 0 : o.button) == null ? void 0 : y.image) == null ? void 0 : z.media) == null ? void 0 : A.name) ?? "dropdown-image"
        }
      ),
      /* @__PURE__ */ r("span", { className: "dropdown-button-text", children: M }),
      /* @__PURE__ */ r(
        $,
        {
          className: "dropdown-button-icon",
          iconName: (E = (D = o == null ? void 0 : o.button) == null ? void 0 : D.icon) == null ? void 0 : E.iconName,
          iconSet: (P = (L = o == null ? void 0 : o.button) == null ? void 0 : L.icon) == null ? void 0 : P.iconSet
        }
      )
    ] }),
    /* @__PURE__ */ d(
      l.Content,
      {
        className: "dropdown-content z-[1000]",
        side: Q,
        sideOffset: Number(V),
        align: W,
        alignOffset: Number(X),
        avoidCollisions: ((F = (q = o == null ? void 0 : o.content) == null ? void 0 : q.avoidCollisions) == null ? void 0 : F[a]) ?? !1,
        children: [
          J.map((Y, G) => /* @__PURE__ */ r(
            _,
            {
              block: Y,
              index: G,
              meta: c,
              isEditable: m ?? !1
            },
            G
          )),
          m && /* @__PURE__ */ r(Z, { blockId: H, showBlockLibrary: !1 })
        ]
      }
    )
  ] }) });
};
export {
  mo as default
};
//# sourceMappingURL=dropdown.block.js.map
