Add static security advisory to HTML block style panel

Custom HTML block renders arbitrary markup on the published site.
Scripts and event handlers are stripped, but forms, iframes, and
images survive and can send data elsewhere. Add a plain, always-shown
advisory (no content detection) alongside the existing wrapper-styling
note.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-08-10 08:37:42 -07:00
co-authored by Claude Opus 5
parent 98f2ebf118
commit 071f3447fd
2 changed files with 13 additions and 0 deletions
@@ -35,4 +35,10 @@ describe('HtmlStylePanel', () => {
expect(container.textContent).not.toContain('Padding'); expect(container.textContent).not.toContain('Padding');
expect(container.textContent).not.toContain('Border Radius'); expect(container.textContent).not.toContain('Border Radius');
}); });
test('renders the security advisory', () => {
render(<HtmlStylePanel selectedId="n1" nodeProps={{ code: '<p>x</p>', style: {} }} />);
expect(container.textContent).toContain('Use this block with care.');
expect(container.textContent).toContain('Scripts and event handlers are stripped');
});
}); });
@@ -25,6 +25,13 @@ export const HtmlStylePanel: React.FC<{ selectedId: string; nodeProps: Record<st
Style this block inside your own markup a wrapper set here would show Style this block inside your own markup a wrapper set here would show
in the editor but not on the published page. in the editor but not on the published page.
</p> </p>
<p style={{ fontSize: 10, color: 'var(--color-text-dim)', lineHeight: 1.4, padding: '0 2px' }}>
<strong>Use this block with care.</strong> It renders your markup as-is
on the published site. Scripts and event handlers are stripped
automatically, but anything that survives forms, iframes, images
can still send data to wherever it points. Only paste code you
understand or trust.
</p>
</> </>
); );
}; };