@reblu/site-blocks 0.3.1 → 0.4.1

package/dist/index.d.cts

@@ -51,9 +51,13 @@ declare function buildShareUrls(url: string, title: string): ShareUrls;
  * `dangerouslySetInnerHTML` consumers listed above. `MarkdownRenderer` re-parses that
  * string through `html-react-parser` into a token-styled component map
  * (`markdown-renderer.tsx` `buildOptions`), and that map rebuilds most elements from
- * scratch — so on the blog-body path author attributes are dropped downstream of this
- * module regardless of what the schema allows. Widening the renderer's attribute
- * forwarding is a separate change; do not read these comments as a claim about it.
+ * scratch. It forwards only the subset of author attributes that carries MEANING
+ * (`id`, `lang`, `dir`, `title`, `hidden`, `role`, `aria-*`, `data-*`, and the list
+ * numbering attributes) — see `PRESERVED_GLOBAL_ATTRIBUTES` there for the line and
+ * why it sits where it does. `class` and `style` in particular are guaranteed by THIS
+ * module and still dropped by that one, because the map owns presentation (REB-666).
+ * Nothing the renderer forwards widens this schema: it can only pass through what
+ * `sanitizeHtml` already allowed.
  *
  * REB-606: this used to run on `isomorphic-dompurify`, which pulls `jsdom` into the
  * import graph. `jsdom`'s transitive `html-encoding-sniffer` → `@exodus/bytes` chain

package/dist/index.d.ts

@@ -51,9 +51,13 @@ declare function buildShareUrls(url: string, title: string): ShareUrls;
  * `dangerouslySetInnerHTML` consumers listed above. `MarkdownRenderer` re-parses that
  * string through `html-react-parser` into a token-styled component map
  * (`markdown-renderer.tsx` `buildOptions`), and that map rebuilds most elements from
- * scratch — so on the blog-body path author attributes are dropped downstream of this
- * module regardless of what the schema allows. Widening the renderer's attribute
- * forwarding is a separate change; do not read these comments as a claim about it.
+ * scratch. It forwards only the subset of author attributes that carries MEANING
+ * (`id`, `lang`, `dir`, `title`, `hidden`, `role`, `aria-*`, `data-*`, and the list
+ * numbering attributes) — see `PRESERVED_GLOBAL_ATTRIBUTES` there for the line and
+ * why it sits where it does. `class` and `style` in particular are guaranteed by THIS
+ * module and still dropped by that one, because the map owns presentation (REB-666).
+ * Nothing the renderer forwards widens this schema: it can only pass through what
+ * `sanitizeHtml` already allowed.
  *
  * REB-606: this used to run on `isomorphic-dompurify`, which pulls `jsdom` into the
  * import graph. `jsdom`'s transitive `html-encoding-sniffer` → `@exodus/bytes` chain

package/dist/index.js

@@ -13011,9 +13011,17 @@ function markdownToSafeHtml(markdown) {
 }
 
 // src/components/markdown-renderer.tsx
-import { cn } from "@reblu/site-ui";
-import parse3, { domToReact, Element } from "html-react-parser";
+import { cn } from "@reblu/site-ui/utils";
+import {
+  domToReact,
+  Element,
+  htmlToDOM
+} from "html-react-parser";
 import { Fragment, jsx } from "react/jsx-runtime";
+var HTML_TO_DOM_OPTIONS = { lowerCaseAttributeNames: false };
+function parse3(html5, options) {
+  return domToReact(htmlToDOM(html5, HTML_TO_DOM_OPTIONS), options);
+}
 var HEADING_CLASSES = {
   1: "text-3xl font-bold mt-8 mb-4 first:mt-0",
   2: "text-2xl font-bold mt-7 mb-3 first:mt-0",
@@ -13025,6 +13033,41 @@ var HEADING_CLASSES = {
 function hasClass(el, name) {
   return typeof el.attribs.class === "string" && el.attribs.class.split(/\s+/).includes(name);
 }
+var PRESERVED_GLOBAL_ATTRIBUTES = [
+  // Anchor targets. In-document links ("see clause 4" → `#clause-4`) resolve to
+  // nothing without them.
+  "id",
+  // Language and direction of a passage — a bilingual legal page is the normal case
+  // here, and screen readers switch voice on it.
+  "lang",
+  "dir",
+  // Advisory text the author wrote; it is content, not styling.
+  "title",
+  // Explicit "do not publish this". Without it a block authored as `<p hidden>`
+  // becomes VISIBLE — publishing what the author marked as not-for-publication.
+  "hidden",
+  // Accessible semantics. `../lib/markdown` restores these through the sanitiser
+  // precisely so they are not lost (REB-286's axe gate); dropping them one layer
+  // later would undo that.
+  "role"
+];
+var PRESERVED_ATTRIBUTE_PREFIXES = ["aria-", "data-"];
+var PRESERVED_TAG_ATTRIBUTES = {
+  ol: ["start", "type"],
+  li: ["value", "type"]
+};
+var BOOLEAN_ATTRIBUTES = /* @__PURE__ */ new Set(["hidden"]);
+function authorAttributes(el) {
+  const tagSpecific = PRESERVED_TAG_ATTRIBUTES[el.name] ?? [];
+  const preserved = {};
+  for (const [rawName, value] of Object.entries(el.attribs)) {
+    const name = rawName.toLowerCase();
+    const keep = PRESERVED_GLOBAL_ATTRIBUTES.includes(name) || tagSpecific.includes(name) || PRESERVED_ATTRIBUTE_PREFIXES.some((prefix) => name.startsWith(prefix));
+    if (!keep) continue;
+    preserved[name] = BOOLEAN_ATTRIBUTES.has(name) ? true : value;
+  }
+  return preserved;
+}
 function isExternalHref(href) {
   return !!href && /^(https?:)?\/\//.test(href);
 }
@@ -13034,29 +13077,46 @@ function buildOptions(headingOffset) {
       if (!(node instanceof Element)) return void 0;
       const children2 = () => domToReact(node.children, options);
       const { name, attribs } = node;
+      const author = authorAttributes(node);
       const headingMatch = /^h([1-6])$/.exec(name);
       if (headingMatch) {
         const rendered = Math.min(6, Number(headingMatch[1]) + headingOffset);
         const Tag = `h${rendered}`;
-        return /* @__PURE__ */ jsx(Tag, { className: HEADING_CLASSES[rendered], children: children2() });
+        return /* @__PURE__ */ jsx(Tag, { ...author, className: HEADING_CLASSES[rendered], children: children2() });
       }
       switch (name) {
         case "p":
-          return /* @__PURE__ */ jsx("p", { className: "my-4 leading-relaxed text-foreground/90", children: children2() });
+          return /* @__PURE__ */ jsx("p", { ...author, className: "my-4 leading-relaxed text-foreground/90", children: children2() });
         case "ul":
-          return /* @__PURE__ */ jsx("ul", { className: hasClass(node, "contains-task-list") ? "list-none pl-0 my-4 space-y-1" : "list-disc ml-6 my-4", children: children2() });
+          return /* @__PURE__ */ jsx("ul", { ...author, className: hasClass(node, "contains-task-list") ? "list-none pl-0 my-4 space-y-1" : "list-disc ml-6 my-4", children: children2() });
         case "ol":
-          return /* @__PURE__ */ jsx("ol", { className: "list-decimal ml-6 my-4", children: children2() });
+          return /* @__PURE__ */ jsx("ol", { ...author, className: "list-decimal ml-6 my-4", children: children2() });
         case "li":
-          return /* @__PURE__ */ jsx("li", { className: hasClass(node, "task-list-item") ? "flex items-start gap-2 my-1" : "my-1", children: children2() });
+          return /* @__PURE__ */ jsx("li", { ...author, className: hasClass(node, "task-list-item") ? "flex items-start gap-2 my-1" : "my-1", children: children2() });
         case "blockquote":
-          return /* @__PURE__ */ jsx("blockquote", { className: "border-l-4 border-primary/50 pl-6 italic my-6 text-muted-foreground", children: children2() });
+          return /* @__PURE__ */ jsx(
+            "blockquote",
+            {
+              ...author,
+              className: "border-l-4 border-primary/50 pl-6 italic my-6 text-muted-foreground",
+              children: children2()
+            }
+          );
         case "pre":
-          return /* @__PURE__ */ jsx("pre", { className: "rounded-lg border border-input bg-muted p-4 my-6 overflow-x-auto font-mono text-sm", children: children2() });
+          return /* @__PURE__ */ jsx(
+            "pre",
+            {
+              ...author,
+              className: "rounded-lg border border-input bg-muted p-4 my-6 overflow-x-auto font-mono text-sm",
+              children: children2()
+            }
+          );
         case "code": {
           const isBlock = node.parent instanceof Element && node.parent.name === "pre";
-          if (isBlock) return /* @__PURE__ */ jsx("code", { className: "block", children: children2() });
-          return /* @__PURE__ */ jsx("code", { className: "rounded bg-muted px-1.5 py-0.5 font-mono text-sm", children: children2() });
+          if (isBlock) {
+            return /* @__PURE__ */ jsx("code", { ...author, className: "block", children: children2() });
+          }
+          return /* @__PURE__ */ jsx("code", { ...author, className: "rounded bg-muted px-1.5 py-0.5 font-mono text-sm", children: children2() });
         }
         case "a": {
           const href = attribs.href;
@@ -13064,6 +13124,7 @@ function buildOptions(headingOffset) {
           return /* @__PURE__ */ jsx(
             "a",
             {
+              ...author,
               href,
               className: "text-primary underline underline-offset-4 hover:text-primary/80",
               ...external ? { target: "_blank", rel: "noopener noreferrer" } : {},
@@ -13080,6 +13141,7 @@ function buildOptions(headingOffset) {
             /* @__PURE__ */ jsx(
               "img",
               {
+                ...author,
                 src: attribs.src,
                 alt: attribs.alt ?? "",
                 loading: "lazy",
@@ -13091,6 +13153,7 @@ function buildOptions(headingOffset) {
           return /* @__PURE__ */ jsx("div", { className: "relative my-6 aspect-video w-full overflow-hidden rounded-lg", children: /* @__PURE__ */ jsx(
             "iframe",
             {
+              ...author,
               src: attribs.src,
               title: attribs.title ?? "Embedded video",
               allow: attribs.allow ?? "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
@@ -13099,13 +13162,13 @@ function buildOptions(headingOffset) {
             }
           ) });
         case "hr":
-          return /* @__PURE__ */ jsx("hr", { className: "my-8 border-muted-foreground/30" });
+          return /* @__PURE__ */ jsx("hr", { ...author, className: "my-8 border-muted-foreground/30" });
         case "strong":
-          return /* @__PURE__ */ jsx("strong", { className: "font-bold text-foreground", children: children2() });
+          return /* @__PURE__ */ jsx("strong", { ...author, className: "font-bold text-foreground", children: children2() });
         case "em":
-          return /* @__PURE__ */ jsx("em", { className: "italic", children: children2() });
+          return /* @__PURE__ */ jsx("em", { ...author, className: "italic", children: children2() });
         case "del":
-          return /* @__PURE__ */ jsx("del", { className: "line-through", children: children2() });
+          return /* @__PURE__ */ jsx("del", { ...author, className: "line-through", children: children2() });
         default:
           return void 0;
       }
@@ -13124,10 +13187,11 @@ function SafeHtml({ html: html5, className, headingOffset = 0 }) {
 }
 
 // src/components/treatment.tsx
-import { cn as cn3 } from "@reblu/site-ui";
+import { cn as cn3 } from "@reblu/site-ui/utils";
 
 // src/components/_page-parts.tsx
-import { Button, cn as cn2 } from "@reblu/site-ui";
+import { cn as cn2 } from "@reblu/site-ui/utils";
+import { buttonVariants } from "@reblu/site-ui/button-variants";
 import { Fragment as Fragment2, jsx as jsx2, jsxs } from "react/jsx-runtime";
 var KNOWN_BUTTON_VARIANTS = /* @__PURE__ */ new Set([
   "default",
@@ -13158,14 +13222,19 @@ function PageHero({ page }) {
 }
 function SectionCta({ section }) {
   if (!section.ctaLabel || !section.ctaUrl) return null;
-  return /* @__PURE__ */ jsx2("div", { className: "pt-2", children: /* @__PURE__ */ jsx2(Button, { asChild: true, variant: toButtonVariant(section.ctaVariant), children: /* @__PURE__ */ jsx2(
+  const variant = toButtonVariant(section.ctaVariant);
+  return /* @__PURE__ */ jsx2("div", { className: "pt-2", children: /* @__PURE__ */ jsx2(
     "a",
     {
       href: section.ctaUrl,
+      "data-slot": "button",
+      "data-variant": variant,
+      "data-size": "default",
+      className: cn2(buttonVariants({ variant, size: "default" })),
       ...section.ctaIsExternal ? { target: "_blank", rel: "noopener noreferrer" } : {},
       children: section.ctaLabel
     }
-  ) }) });
+  ) });
 }
 function SectionImages({ section }) {
   if (section.images.length === 0) return null;
@@ -13213,7 +13282,7 @@ function Treatment({ page, className }) {
 }
 
 // src/components/specialty.tsx
-import { cn as cn4 } from "@reblu/site-ui";
+import { cn as cn4 } from "@reblu/site-ui/utils";
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function Specialty({
   page,
@@ -13254,7 +13323,7 @@ function Specialty({
 }
 
 // src/components/profile-card.tsx
-import { cn as cn5 } from "@reblu/site-ui";
+import { cn as cn5 } from "@reblu/site-ui/utils";
 import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 function initials(name) {
   return name.split(/\s+/).filter(Boolean).slice(0, 2).map((part) => part[0]?.toUpperCase() ?? "").join("");
@@ -13296,7 +13365,7 @@ function ProfileCard({ name, role, imageUrl, specialties = [], bio, href, classN
 }
 
 // src/components/product-card.tsx
-import { cn as cn6 } from "@reblu/site-ui";
+import { cn as cn6 } from "@reblu/site-ui/utils";
 import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 function ProductCard({ product, href, currencyCode = "EUR", locale, className }) {
   const image = product.images.find((i) => i.isPrimary) ?? product.images[0];