@anoki/fse-ui/dist/index.es218.js

FSE UI components library

import { j as e } from "./index.es278.js";
import o, { useMemo as N } from "react";
import './sections/RichText/RichText.css';/* empty css            */
import { HTML as u } from "./index.es159.js";
import { clsx as d } from "./index.es280.js";
import { Section as c } from "./index.es229.js";
import { Col as R } from "./index.es82.js";
const _ = ({
  title: i,
  description: t,
  fontSize: f = "2",
  mdFontSize: h = "2",
  classNameTitle: g,
  classNameDescription: a,
  additionalClass: x,
  children: p,
  maxLines: r = void 0,
  useShowToggle: j = !0
}) => {
  const [s, v] = o.useState(
    typeof r == "number"
  ), [m, b] = o.useState(!1), l = o.useRef(null), w = () => {
    v(!s);
  };
  o.useLayoutEffect(() => {
    const n = () => {
      if (l.current) {
        const { scrollHeight: S, clientHeight: E } = l.current;
        b(S > E);
      }
    };
    return n(), window.addEventListener("resize", n), () => window.removeEventListener("resize", n);
  }, [t, r]);
  const y = N(() => t ? typeof t == "string" && o.isValidElement(t) || !r ? u(t.toString(), "div") : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
    /* @__PURE__ */ e.jsx(
      "div",
      {
        ref: l,
        className: d(
          "rich-text-body",
          s && "rich-text-body--clamped",
          a
        ),
        style: { "--max-lines": r },
        children: u(t.toString(), "div")
      }
    ),
    j && m && /* @__PURE__ */ e.jsxs(
      "a",
      {
        "aria-label": "Mostra altro",
        className: "toggle-clamped-btn",
        onClick: w,
        children: [
          "Mostra ",
          s ? "altro" : "meno"
        ]
      }
    )
  ] }) : null, [t, s, r, m]);
  return /* @__PURE__ */ e.jsxs(c, { className: d("base-col ui-rich-text-section", x), children: [
    /* @__PURE__ */ e.jsxs(R, { className: "ui-rich-text-content", children: [
      i && /* @__PURE__ */ e.jsx(
        c.Title,
        {
          fs: f,
          mdFs: h,
          className: g,
          children: i
        }
      ),
      /* @__PURE__ */ e.jsx(c.Description, { className: a, children: y })
    ] }),
    p
  ] });
};
export {
  _ as RichText
};
//# sourceMappingURL=index.es218.js.map