import { jsx, jsxs } from "react/jsx-runtime";
import { registerRenderer } from "@wabbit/tome-blocks-core/render";
import styles from "./RelatedItems.module.css";
const RelatedItems = ({ block, className }) => {
  const items = block.selectedItems;
  return /* @__PURE__ */ jsx("section", { className: [styles.relatedItems, className].filter(Boolean).join(" "), children: /* @__PURE__ */ jsxs("div", { className: styles.inner, children: [
    /* @__PURE__ */ jsxs("div", { className: styles.header, children: [
      block.title && /* @__PURE__ */ jsx("h3", { className: styles.title, children: block.title }),
      block.description && /* @__PURE__ */ jsx("p", { className: styles.description, children: block.description })
    ] }),
    /* @__PURE__ */ jsx("div", { className: styles.grid, children: items && items.length > 0 ? items.map((item) => /* @__PURE__ */ jsx("article", { className: styles.card, children: item.title && /* @__PURE__ */ jsx("h4", { className: styles.cardTitle, children: item.slug ? /* @__PURE__ */ jsx("a", { href: `/${item.slug}`, children: item.title }) : item.title }) }, item.id)) : /* @__PURE__ */ jsxs("p", { className: styles.placeholder, children: [
      "Showing related ",
      block.relationTo || "items",
      " (limit: ",
      block.limit ?? 3,