@anoki/fse-marche-ui/dist/index.es34.js

FSE UI components library

import { j as e } from "./index.es137.js";
import { clsx as s } from "./index.es139.js";
import './components/ui/VideoPlayer/VideoPlayer.css';/* empty css            */
import { ArrowDown as x } from "./index.es76.js";
import { useState as h } from "react";
import { Col as p } from "./index.es10.js";
const f = {
  small: {
    width: "311px"
  },
  medium: {
    width: "388px"
  },
  large: {
    width: "666px"
  }
}, g = {
  small: {
    heightImg: "170px"
  },
  medium: {
    heightImg: "183px"
  },
  large: {
    heightImg: "371px"
  }
}, I = ({
  btnText: o = "Trascrizione",
  sizeComp: i = "large",
  titleTag: c = "h3",
  image: r,
  asImage: a = "img"
}) => {
  const l = a, { width: n } = f[i], { heightImg: d } = g[i], [t, m] = h(!1);
  return /* @__PURE__ */ e.jsxs(
    p,
    {
      br: "x4",
      style: { width: n },
      className: s("shadow", t && "ui-expanded"),
      children: [
        /* @__PURE__ */ e.jsxs(
          "div",
          {
            style: { height: d },
            className: s("cardImgWrapper", "w-full"),
            children: [
              /* @__PURE__ */ e.jsx(
                l,
                {
                  src: r == null ? void 0 : r.src,
                  className: s("cardImg", "br-x4 h-full w-full"),
                  alt: "..."
                }
              ),
              /* @__PURE__ */ e.jsx("div", { className: s("cardImgMask") })
            ]
          }
        ),
        /* @__PURE__ */ e.jsx(
          "div",
          {
            className: s(
              "accordion",
              "base-row justify-content-between align-items-center px-x24 w-full flex-1"
            ),
            children: /* @__PURE__ */ e.jsxs(
              "button",
              {
                className: s(
                  "ui-btn-accordion",
                  "base-row justify-content-between align-items-center"
                ),
                type: "button",
                onClick: () => m(!t),
                children: [
                  /* @__PURE__ */ e.jsx(
                    c,
                    {
                      className: s(
                        "fw-semibold text-primary base-col justify-content-center"
                      ),
                      children: o
                    }
                  ),
                  /* @__PURE__ */ e.jsx(
                    x,
                    {
                      color: "primary",
                      className: s("ui-arrow", { expanded: t })
                    }
                  )
                ]
              }
            )
          }
        ),
        t && /* @__PURE__ */ e.jsx(
          "div",
          {
            className: s(
              "pt-x8 px-x24 pb-x40 fs-6 fw-regular text-grey-black"
            ),
            children: /* @__PURE__ */ e.jsxs("p", { children: [
              "Placeholder content for this accordion, which is intended to demonstrate the ",
              /* @__PURE__ */ e.jsx("code", { children: ".accordion-flush" }),
              " class. This is the first item's accordion body."
            ] })
          }
        )
      ]
    }
  );
};
export {
  I as VideoPlayer
};
//# sourceMappingURL=index.es34.js.map