@open-formulieren/formio-builder/dist/components/formio/panel.js

An opinionated Formio webform builder for Open Forms

import { jsxs as t, jsx as a } from "react/jsx-runtime";
import { clsx as c } from "clsx";
import { useId as v, useState as x } from "react";
import { useIntl as g } from "react-intl";
/* empty css           */
import h from "./tooltip.js";
const q = ({
  title: n,
  tooltip: r = "",
  collapsible: l = !1,
  initialCollapsed: d = !1,
  headerEnd: s,
  children: m
}) => {
  const p = g(), o = v(), [e, i] = x(d);
  !l && e && i(!1);
  const u = l ? {
    onClick: () => i(!e),
    role: "button",
    "aria-expanded": e ? "false" : "true",
    "aria-controls": o
  } : {}, f = p.formatMessage({
    id: "iX0YPY",
    defaultMessage: [{
      type: 5,
      value: "collapsed",
      options: {
        true: {
          value: [{
            type: 0,
            value: "Expand panel"
          }]
        },
        other: {
          value: [{
            type: 0,
            value: "Collapse panel"
          }]
        }
      }
    }]
  }, {
    collapsed: e
  });
  return /* @__PURE__ */ t("div", { className: "mb-2 card border", children: [
    /* @__PURE__ */ t("div", { className: c("card-header", "bg-default", {
      "d-flex": !!s,
      "align-items-center": !!s
    }), children: [
      /* @__PURE__ */ a("div", { className: "offb-panel-header-collapse-trigger", ...u, children: /* @__PURE__ */ t("span", { className: "mb-0 card-title", children: [
        l ? /* @__PURE__ */ a("i", { className: c("formio-collapse-icon", "text-muted", "fa", "fa-regular", {
          "fa-plus-square": e,
          "fa-minus-square": !e
        }), title: f }) : null,
        n,
        r && " ",
        /* @__PURE__ */ a(h, { text: r })
      ] }) }),
      s
    ] }),
    e ? null : /* @__PURE__ */ a("div", { className: "card-body", id: o, children: m })
  ] });
};
export {
  q as default
};