import { jsxs as f, jsx as o } from "react/jsx-runtime";
import { J as y } from "./chunk-RXIM6GTA.C-ABNABt.js";
import "@sinclair/typebox";
import { _ as t } from "./twind.D_WBdNpx.js";
import { useState as d } from "react";
import { b as I } from "./index.DrgDWugK.js";
import { T as u } from "./TextContent.CXFlerU1.js";
import { b as j } from "./use-section-style.CgktT_qE.js";
import { u as A } from "./use-color-preset.CYlEPd2C.js";
import { B as k } from "./BrickRoot.LoA8SzjD.js";
function M({ brick: n, editable: s }) {
  const h = j(n), { props: l } = n, i = Array.isArray(l.items) ? l.items : [], { gradientDirection: x, rounding: O, ...b } = h, c = A(n), [w, N] = d(
    i.findIndex((r) => !!r.defaultOpen) || null
  ), [g, v] = d(() => i.map((r) => !!r.defaultOpen));
  return /* @__PURE__ */ f(
    k,
    {
      editable: s,
      manifest: y,
      className: t("flex flex-col overflow-hidden relative", Object.values(b)),
      children: [
        s && i.length === 0 && /* @__PURE__ */ o("div", { className: "absolute top-0 left-0 right-0 bottom-0 flex items-center justify-center text-center p-8", children: /* @__PURE__ */ o("div", { className: "text-base", children: "Add content to this accordion in the panel" }) }),
        i.map((r, e) => {
          const a = l.restrictOneOpen ? w === e : g[e] || r.defaultOpen;
          return /* @__PURE__ */ f(
            "div",
            {
              className: t("flex flex-col border", O, c.border, "overflow-hidden"),
              children: [
                /* @__PURE__ */ f(
                  "button",
                  {
                    type: "button",
                    "aria-expanded": a,
                    onClick: () => {
                      l.restrictOneOpen ? N((m) => m === e ? null : e) : v((m) => {
                        const p = [...m];
                        return p[e] = !p[e], p;
                      });
                    },
                    className: t(
                      "flex flex-grow shrink-0 items-center p-3 gap-1 justify-between w-full",
                      "font-semibold cursor-pointer select-none text-left text-[110%] ",
                      c.title,
                      x,
                      a && "rounded-b-none border-b",
                      c.border
                    ),
                    children: [
                      /* @__PURE__ */ o("div", { className: t("flex flex-grow shrink-0 flex-row items-center gap-1"), children: /* @__PURE__ */ o(
                        u,
                        {
                          propPath: `items.${e}.title`,
                          className: t("w-full", s && "cursor-text"),
                          brickId: n.id,
                          content: r.title,
                          editable: s,
                          inline: !0
                        }
                      ) }),
                      /* @__PURE__ */ o(I, { className: t("transition-transform", a && "rotate-90") })
                    ]
                  }
                ),
                /* @__PURE__ */ o("div", { className: t("transition-all duration-900 ease-in-out p-3 flex-1", !a && "hidden"), children: /* @__PURE__ */ o(
                  u,
                  {
                    propPath: `items.${e}.content`,
                    className: t("w-full", s && "cursor-text"),
                    brickId: n.id,
                    content: r.content,
                    editable: s
                  }
                ) })
              ]
            },
            e
          );
        })
      ]
    }
  );
}
export {
  M as default
};
//# sourceMappingURL=accordion.J4Sdb_cO.js.map
