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