import { j as jsxRuntimeExports } from "./jsx-runtime.CXYVdt5g.js";
import { bP as manifest } from "./use-editor.CurXdZnZ.js";
import "@sinclair/typebox";
import "lodash-es";
import { a as tx } from "./twind.B1qQmF_s.js";
import { b as useBrickStyle } from "./use-section-style.D8_SY6rK.js";
import { a as InlineIcon } from "./iconify.DjLEvsi5.js";
import { B as BrickRoot } from "./BrickRoot.C4Jpjw20.js";
import { u as useBrickProps } from "./use-brick-props.BKk39X7D.js";
import { useState } from "react";
function Testimonials(props) {
  const { brick, editable } = props;
  const brickProps = useBrickProps(props);
  const { colorPreset, border, shadow, ...styles } = useBrickStyle(brick);
  const containerClasses = Object.values(styles);
  const [showImage, setShowImage] = useState(true);
  const testimonials = brickProps.testimonials ?? [];
  const onImageError = (event) => {
    setShowImage(false);
  };
  return /* @__PURE__ */ jsxRuntimeExports.jsx(
    BrickRoot,
    {
      brick,
      editable,
      manifest,
      className: tx("flex gap-6 @mobile:flex-col @desktop:flex-row", containerClasses),
      children: testimonials.map((testimonial, index) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
        "div",
        {
          className: tx(
            "flex flex-1 flex-col gap-6 p-6 rounded-lg @desktop:(min-w-[250px])",
            colorPreset,
            border,
            shadow
          ),
          children: [
            /* @__PURE__ */ jsxRuntimeExports.jsx(
              "blockquote",
              {
                className: tx(
                  "flex-1 whitespace-pre-wrap text-pretty font-normal italic relative leading-relaxed"
                ),
                children: testimonial.text
              }
            ),
            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-3 flex-nowrap", children: [
              showImage && testimonial.avatar?.src && /* @__PURE__ */ jsxRuntimeExports.jsx(
                "img",
                {
                  src: testimonial.avatar.src,
                  alt: testimonial.avatar.alt || testimonial.author,
                  className: "w-12 h-12 rounded-full object-cover",
                  onError: onImageError
                }
              ),
              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1 flex-nowrap leading-tight", children: [
                /* @__PURE__ */ jsxRuntimeExports.jsx("cite", { className: tx("font-semibold text-[90%] text-nowrap"), children: testimonial.author }),
                testimonial.company && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: tx("text-[85%]"), children: testimonial.company })
              ] }),
              testimonial.socialIcon && /* @__PURE__ */ jsxRuntimeExports.jsx(InlineIcon, { icon: testimonial.socialIcon, className: "h-5 w-5" })
            ] })
          ]
        },
        index
      ))
    }
  );
}
export {
  Testimonials as default
};
//# sourceMappingURL=testimonials.XUuFJAxQ.js.map
