Skip to content

Commit 35c8251

Browse files
Copilotthebuilder
andcommitted
docs: clarify style filtering approach
Co-authored-by: thebuilder <3764345+thebuilder@users.noreply.github.com>
1 parent dec9c03 commit 35c8251

1 file changed

Lines changed: 17 additions & 16 deletions

File tree

README.md

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -291,7 +291,7 @@ function RichText({ data }) {
291291
if (tag === "strong") return <strong {...attributes}>{children}</strong>;
292292
return undefined;
293293
},
294-
[],
294+
[], // no external deps; relies only on provided RenderNodeContext
295295
);
296296

297297
const htmlAttributes = useMemo(
@@ -329,31 +329,32 @@ rendering:
329329
`renderNode` to filter the `style` attribute:
330330

331331
```tsx
332+
import { createElement } from "react";
333+
332334
const ALLOWED_STYLES = ["font-weight", "font-style"];
333335

334336
function filterAllowedStyles(style: string) {
335-
const allowedRules = style
336-
.split(";")
337-
.map((rule) => rule.trim())
338-
.filter(Boolean)
339-
.map((rule) => {
340-
const [property, ...rest] = rule.split(":");
341-
const propName = property?.trim();
342-
const value = rest.join(":").trim();
343-
if (!propName || !value) return null;
344-
if (!ALLOWED_STYLES.includes(propName)) return null;
345-
return `${propName}: ${value}`;
346-
})
347-
.filter(Boolean) as string[];
337+
const allowedRules: string[] = [];
338+
for (const rule of style.split(";")) {
339+
const [property, ...rest] = rule.split(":");
340+
const propName = property?.trim();
341+
const value = rest.join(":").trim();
342+
if (!propName || !value) continue;
343+
if (!ALLOWED_STYLES.includes(propName)) continue;
344+
allowedRules.push(`${propName}: ${value}`);
345+
}
348346

349347
return allowedRules.length > 0 ? allowedRules.join("; ") : undefined;
350348
}
351349

352350
function renderNode({ tag, attributes, children }: RenderNodeContext) {
353351
if (typeof attributes.style === "string") {
354352
const filtered = filterAllowedStyles(attributes.style);
355-
if (filtered) attributes.style = filtered;
356-
else delete attributes.style;
353+
const nextAttributes = { ...attributes };
354+
if (filtered) nextAttributes.style = filtered;
355+
else delete nextAttributes.style;
356+
357+
return createElement(tag, nextAttributes, children);
357358
}
358359

359360
return undefined; // fall back to default rendering

0 commit comments

Comments
 (0)