fix(site-builder): HtmlBlock render stops applying style so editor matches published output
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -62,16 +62,21 @@ export function purifyHtml(input: string): string {
|
||||
}
|
||||
}
|
||||
|
||||
export const HtmlBlock: UserComponent<HtmlBlockProps> = ({ code = '', style = {} }) => {
|
||||
export const HtmlBlock: UserComponent<HtmlBlockProps> = ({ code = '' }) => {
|
||||
const { connectors: { connect, drag }, selected } = useNode((node) => ({ selected: node.events.selected }));
|
||||
const clean = useMemo(() => purifyHtml(code), [code]);
|
||||
const setRef = (ref: HTMLElement | null): void => { if (ref) connect(drag(ref)); };
|
||||
// The `style` prop is deliberately NOT applied. `toHtml()` emits only the
|
||||
// purified `code`, so anything styled here would show in the editor and
|
||||
// vanish on the live page -- the exact bug this block was reported for.
|
||||
// Wrapper styling belongs in the user's own markup (see the Edit HTML
|
||||
// toolbar's colour control). `style` stays on the props interface so
|
||||
// already-saved sites keep deserializing cleanly.
|
||||
return React.createElement('div', {
|
||||
ref: setRef,
|
||||
style: {
|
||||
minHeight: '40px',
|
||||
outline: selected ? '2px solid #3b82f6' : 'none',
|
||||
...style,
|
||||
},
|
||||
dangerouslySetInnerHTML: { __html: clean },
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user