@wulperstudio/editor-render 0.0.8-beta → 0.0.10-beta

package/dist/cjs/index.js

@@ -1373,7 +1373,7 @@ function requireReactJsxRuntime_development () {
 var RootContainer = material.styled('div', {
     name: 'RootContainer',
     label: 'root__container',
-    shouldForwardProp: function (prop) { return prop !== 'as' && prop !== 'stretched'; },
+    shouldForwardProp: function (prop) { return prop !== 'as' && prop !== 'stretched' && prop !== 'sx'; },
 })(function (_a) {
     var stretched = _a.stretched;
     return (tslib.__assign({ width: '100%', maxWidth: 700, height: 'auto', margin: '0 auto' }, (stretched && {
@@ -1381,7 +1381,10 @@ var RootContainer = material.styled('div', {
     })));
 });
 
-var Container = function (props) { return (jsxRuntime.exports.jsx(RootContainer, tslib.__assign({}, props))); };
+var Container = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return (jsxRuntime.exports.jsx(RootContainer, tslib.__assign({ sx: sx }, props)));
+};
 
 var RootParagraph = material.styled('p', {
     name: 'RootParagraph',
@@ -1391,7 +1394,10 @@ var RootParagraph = material.styled('p', {
     margin: 0,
 });
 
-var Paragraph = function (props) { return jsxRuntime.exports.jsx(RootParagraph, tslib.__assign({}, props)); };
+var Paragraph = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootParagraph, tslib.__assign({ sx: sx }, props));
+};
 
 var RootHeader = material.styled('h2', {
     name: 'RootHeader',
@@ -1410,8 +1416,8 @@ var HeaderLevel = {
     6: 'h6',
 };
 var Header = function (_a) {
-    var level = _a.level, props = tslib.__rest(_a, ["level"]);
-    return (jsxRuntime.exports.jsx(RootHeader, tslib.__assign({ as: HeaderLevel[level] }, props)));
+    var level = _a.level, sx = _a.sx, props = tslib.__rest(_a, ["level", "sx"]);
+    return (jsxRuntime.exports.jsx(RootHeader, tslib.__assign({ as: HeaderLevel[level], sx: sx }, props)));
 };
 
 var RootList = material.styled('div', {
@@ -1421,8 +1427,8 @@ var RootList = material.styled('div', {
 })({});
 
 var List = function (_a) {
-    var props = tslib.__rest(_a, []);
-    return jsxRuntime.exports.jsx(RootList, tslib.__assign({}, props));
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootList, tslib.__assign({ sx: sx }, props));
 };
 
 var RootListItem$1 = material.styled('div', {
@@ -1431,7 +1437,10 @@ var RootListItem$1 = material.styled('div', {
     shouldForwardProp: function (prop) { return prop !== 'as' && prop !== 'sx'; },
 })({});
 
-var ListItem = function (props) { return jsxRuntime.exports.jsx(RootListItem$1, tslib.__assign({}, props)); };
+var ListItem = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootListItem$1, tslib.__assign({ sx: sx }, props));
+};
 
 var RootInlineCode = material.styled('code', {
     name: 'RootInlineCode',
@@ -1439,7 +1448,10 @@ var RootInlineCode = material.styled('code', {
     shouldForwardProp: function (prop) { return prop !== 'as'; },
 })({});
 
-var InlineCode = function (props) { return jsxRuntime.exports.jsx(RootInlineCode, tslib.__assign({}, props)); };
+var InlineCode = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootInlineCode, tslib.__assign({ sx: sx }, props));
+};
 
 var RootBold = material.styled('b', {
     name: 'RootBold',
@@ -1447,7 +1459,10 @@ var RootBold = material.styled('b', {
     shouldForwardProp: function (prop) { return prop !== 'as' && prop !== 'sx'; },
 })({});
 
-var Bold = function (props) { return jsxRuntime.exports.jsx(RootBold, tslib.__assign({}, props)); };
+var Bold = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootBold, tslib.__assign({ sx: sx }, props));
+};
 
 var RootItalic = material.styled('i', {
     name: 'RootBold',
@@ -1455,7 +1470,10 @@ var RootItalic = material.styled('i', {
     shouldForwardProp: function (prop) { return prop !== 'as'; },
 })({});
 
-var Italic = function (props) { return jsxRuntime.exports.jsx(RootItalic, tslib.__assign({}, props)); };
+var Italic = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootItalic, tslib.__assign({ sx: sx }, props));
+};
 
 var RootMarker = material.styled('mark', {
     name: 'RootMarker',
@@ -1463,7 +1481,10 @@ var RootMarker = material.styled('mark', {
     shouldForwardProp: function (prop) { return prop !== 'as'; },
 })({});
 
-var Marker = function (props) { return jsxRuntime.exports.jsx(RootMarker, tslib.__assign({}, props)); };
+var Marker = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootMarker, tslib.__assign({ sx: sx }, props));
+};
 
 var RootAnchor = material.styled('a', {
     name: 'RootAnchor',
@@ -1471,7 +1492,10 @@ var RootAnchor = material.styled('a', {
     shouldForwardProp: function (prop) { return prop !== 'as' && prop !== 'sx'; },
 })({});
 
-var Anchor = function (props) { return jsxRuntime.exports.jsx(RootAnchor, tslib.__assign({}, props)); };
+var Anchor = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootAnchor, tslib.__assign({ sx: sx }, props));
+};
 
 var RootDelimiter = material.styled('div', {
     name: 'RootDelimiter',
@@ -1485,7 +1509,10 @@ var RootDelimiter = material.styled('div', {
     fontWeight: 700,
 });
 
-var Delimiter = function (props) { return (jsxRuntime.exports.jsx(RootDelimiter, tslib.__assign({}, props, { children: jsxRuntime.exports.jsx("span", { children: "\u2743 \u2743 \u2743" }) }))); };
+var Delimiter = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return (jsxRuntime.exports.jsx(RootDelimiter, tslib.__assign({ sx: sx }, props, { children: jsxRuntime.exports.jsx("span", { children: "\u2743 \u2743 \u2743" }) })));
+};
 
 var Root = material.styled('div', {
     name: 'Root',
@@ -1529,8 +1556,8 @@ var Caption = material.styled('span', {
 });
 
 var Image = function (_a) {
-    var caption = _a.caption, withBorder = _a.withBorder, withBackground = _a.withBackground, stretched = _a.stretched, props = tslib.__rest(_a, ["caption", "withBorder", "withBackground", "stretched"]);
-    return (jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx(Root, tslib.__assign({ withBorder: withBorder, stretched: stretched, withBackground: withBackground }, { children: jsxRuntime.exports.jsx(RootImage, tslib.__assign({}, props, { withBackground: withBackground })) })), caption && jsxRuntime.exports.jsx(Caption, { children: caption })] }));
+    var caption = _a.caption, withBorder = _a.withBorder, withBackground = _a.withBackground, stretched = _a.stretched, sx = _a.sx, props = tslib.__rest(_a, ["caption", "withBorder", "withBackground", "stretched", "sx"]);
+    return (jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [jsxRuntime.exports.jsx(Root, tslib.__assign({ withBorder: withBorder, stretched: stretched, withBackground: withBackground }, { children: jsxRuntime.exports.jsx(RootImage, tslib.__assign({ sx: sx }, props, { withBackground: withBackground })) })), caption && jsxRuntime.exports.jsx(Caption, { children: caption })] }));
 };
 
 var RootTable = material.styled('div', {
@@ -1551,7 +1578,10 @@ var RootTable = material.styled('div', {
     });
 });
 
-var Table = function (props) { return jsxRuntime.exports.jsx(RootTable, tslib.__assign({}, props)); };
+var Table = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootTable, tslib.__assign({ sx: sx }, props));
+};
 
 var RootTableRow = material.styled('div', {
     name: 'RootTableRow',
@@ -1568,7 +1598,10 @@ var RootTableRow = material.styled('div', {
     });
 });
 
-var TableRow = function (props) { return jsxRuntime.exports.jsx(RootTableRow, tslib.__assign({}, props)); };
+var TableRow = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootTableRow, tslib.__assign({ sx: sx }, props));
+};
 
 var RootTableCell = material.styled('div', {
     name: 'RootTableRow',
@@ -1594,7 +1627,10 @@ var RootTableCell = material.styled('div', {
     });
 });
 
-var TableCell = function (props) { return jsxRuntime.exports.jsx(RootTableCell, tslib.__assign({}, props)); };
+var TableCell = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootTableCell, tslib.__assign({ sx: sx }, props));
+};
 
 var RootEmbed = material.styled('iframe', {
     name: 'RootEmbed',
@@ -1606,7 +1642,10 @@ var RootEmbed = material.styled('iframe', {
     borderRadius: 8,
 });
 
-var Embed = function (props) { return jsxRuntime.exports.jsx(RootEmbed, tslib.__assign({}, props)); };
+var Embed = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootEmbed, tslib.__assign({ sx: sx }, props));
+};
 
 var RootRaw = material.styled('div', {
     name: 'RootRaw',
@@ -1627,7 +1666,10 @@ var RootRaw = material.styled('div', {
     resize: 'vertical',
 });
 
-var Raw = function (props) { return jsxRuntime.exports.jsx(RootRaw, tslib.__assign({}, props)); };
+var Raw = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootRaw, tslib.__assign({ sx: sx }, props));
+};
 
 var RootQuote = material.styled('blockquote', {
     name: 'RootQuote',
@@ -1635,7 +1677,10 @@ var RootQuote = material.styled('blockquote', {
     shouldForwardProp: function (prop) { return prop !== 'as'; },
 })({});
 
-var Quote = function (props) { return jsxRuntime.exports.jsx(RootQuote, tslib.__assign({}, props)); };
+var Quote = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootQuote, tslib.__assign({ sx: sx }, props));
+};
 
 var RootCode = material.styled('div', {
     name: 'RootCode',
@@ -1659,7 +1704,10 @@ var RootCode = material.styled('div', {
     whiteSpace: 'pre-wrap',
 });
 
-var Code = function (props) { return jsxRuntime.exports.jsx(RootCode, tslib.__assign({}, props)); };
+var Code = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootCode, tslib.__assign({ sx: sx }, props));
+};
 
 var RootLink = material.styled('a', {
     name: 'RootLink',
@@ -1728,8 +1776,8 @@ var SiteName = material.styled('span')(function (_a) {
 });
 
 var Link = function (_a) {
-    var id = _a.id, image = _a.image, title = _a.title, description = _a.description, siteName = _a.siteName, props = tslib.__rest(_a, ["id", "image", "title", "description", "siteName"]);
-    return (jsxRuntime.exports.jsxs(RootLink, tslib.__assign({ id: id, target: "_blank", rel: "nofollow noindex noreferrer" }, props, { children: [jsxRuntime.exports.jsx(ImageFloat, { image: image }), jsxRuntime.exports.jsx(Title, { children: title }), jsxRuntime.exports.jsx(Description, { children: description }), jsxRuntime.exports.jsx(SiteName, { children: siteName })] }), id));
+    var id = _a.id, image = _a.image, title = _a.title, description = _a.description, siteName = _a.siteName, sx = _a.sx, props = tslib.__rest(_a, ["id", "image", "title", "description", "siteName", "sx"]);
+    return (jsxRuntime.exports.jsxs(RootLink, tslib.__assign({ id: id, target: "_blank", rel: "nofollow noindex noreferrer", sx: sx }, props, { children: [jsxRuntime.exports.jsx(ImageFloat, { image: image }), jsxRuntime.exports.jsx(Title, { children: title }), jsxRuntime.exports.jsx(Description, { children: description }), jsxRuntime.exports.jsx(SiteName, { children: siteName })] }), id));
 };
 
 var RootCheckList = material.styled('div', {
@@ -1744,7 +1792,10 @@ var RootCheckList = material.styled('div', {
     height: 'auto',
 });
 
-var CheckList = function (props) { return jsxRuntime.exports.jsx(RootCheckList, tslib.__assign({}, props)); };
+var CheckList = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootCheckList, tslib.__assign({ sx: sx }, props));
+};
 
 var RootListItem = material.styled('div', {
     name: 'RootListItem',
@@ -1752,11 +1803,14 @@ var RootListItem = material.styled('div', {
     shouldForwardProp: function (prop) { return prop !== 'as' && prop !== 'sx'; },
 })({});
 
-var CheckListItem = function (props) { return jsxRuntime.exports.jsx(RootListItem, tslib.__assign({}, props)); };
+var CheckListItem = function (_a) {
+    var sx = _a.sx, props = tslib.__rest(_a, ["sx"]);
+    return jsxRuntime.exports.jsx(RootListItem, tslib.__assign({ sx: sx }, props));
+};
 
 var CheckBox = function (_a) {
-    var checked = _a.checked, props = tslib.__rest(_a, ["checked"]);
-    return (jsxRuntime.exports.jsx(material.Checkbox, tslib.__assign({ size: "small", checked: checked, icon: (jsxRuntime.exports.jsx(react.Icon, { icon: "akar-icons:circle-fill", color: "inherit", width: "24px", height: "24px" })), checkedIcon: (jsxRuntime.exports.jsx(react.Icon, { icon: "akar-icons:circle-check-fill", color: "inherit", width: "24px", height: "24px" })) }, props)));
+    var checked = _a.checked, sx = _a.sx, props = tslib.__rest(_a, ["checked", "sx"]);
+    return (jsxRuntime.exports.jsx(material.Checkbox, tslib.__assign({ sx: sx, size: "small", checked: checked, icon: (jsxRuntime.exports.jsx(react.Icon, { icon: "akar-icons:circle-fill", color: "inherit", width: "24px", height: "24px" })), checkedIcon: (jsxRuntime.exports.jsx(react.Icon, { icon: "akar-icons:circle-check-fill", color: "inherit", width: "24px", height: "24px" })) }, props)));
 };
 
 var PurifyHtml = function (html) {
@@ -1820,13 +1874,15 @@ var RecursiveNode = function (_a) {
 var ParagraphNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Paragraph$1 = _a.Paragraph;
     var text = data.text;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Paragraph, tslib.__assign({ id: ForkIdWithType(id, type) }, Paragraph$1, { children: jsxRuntime.exports.jsx(RecursiveNode, { html: text, id: id }) })) }), id));
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Paragraph, tslib.__assign({ id: ForkIdWithType(id, type) }, Paragraph$1, { children: jsxRuntime.exports.jsx(RecursiveNode, { html: text, id: id }) })) }), id));
 };
 
 var HeaderNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Header$1 = _a.Header;
     var text = data.text;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Header, tslib.__assign({ id: ForkIdWithType(id, type), level: data.level }, Header$1, { children: jsxRuntime.exports.jsx(RecursiveNode, { html: text, id: id }) })) }), id));
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Header, tslib.__assign({ id: ForkIdWithType(id, type), level: data.level }, Header$1, { children: jsxRuntime.exports.jsx(RecursiveNode, { html: text, id: id }) })) }), id));
 };
 
 // SizeTypes = 'one-column' | 'two-columns' | 'three-columns';
@@ -1834,7 +1890,8 @@ var DEFAULT_GAP$1 = 20;
 var ListNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, tunes = _a.tunes, Container$1 = _a.Container, List$1 = _a.List, Item = _a.Item;
     var style = data.style;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(List, tslib.__assign({ id: ForkIdWithType(id, type) }, List$1, { sx: tslib.__assign({ display: 'flex', flexWrap: 'wrap', gap: "".concat(DEFAULT_GAP$1, "px") }, List$1 === null || List$1 === void 0 ? void 0 : List$1.sx) }, { children: data.items.map(function (item, idx) {
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(List, tslib.__assign({ id: ForkIdWithType(id, type) }, List$1, { sx: tslib.__assign({ display: 'flex', flexWrap: 'wrap', gap: "".concat(DEFAULT_GAP$1, "px") }, List$1 === null || List$1 === void 0 ? void 0 : List$1.sx) }, { children: data.items.map(function (item, idx) {
                 var _a, _b;
                 return (jsxRuntime.exports.jsxs(ListItem, tslib.__assign({}, Item, { sx: tslib.__assign(tslib.__assign(tslib.__assign(tslib.__assign(tslib.__assign({ padding: '20px', borderRadius: '25px', backgroundColor: function (_) { return _.palette.background.default; }, border: '1px solid #EFF3FE', display: 'flex', flexWrap: 'nowrap', alignItems: 'center', columnGap: '5px', flexGrow: 0 }, (style === 'ordered' && {
                         alignItems: 'center',
@@ -1851,14 +1908,16 @@ var ListNode = function (_a) {
 
 var ImageNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Image$1 = _a.Image;
-    var url = data.url, caption = data.caption, withBorder = data.withBorder, stretched = data.stretched, withBackground = data.withBackground;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ stretched: stretched }, Container$1, { children: jsxRuntime.exports.jsx(Image, tslib.__assign({ id: ForkIdWithType(id, type), src: url, alt: caption, caption: caption, withBorder: withBorder, stretched: stretched, withBackground: withBackground }, Image$1), ForkIdWithType(id, type)) }), id));
+    var file = data.file, caption = data.caption, withBorder = data.withBorder, stretched = data.stretched, withBackground = data.withBackground;
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ stretched: stretched, sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Image, tslib.__assign({ id: ForkIdWithType(id, type), src: file === null || file === void 0 ? void 0 : file.url, alt: caption, caption: caption, withBorder: withBorder, stretched: stretched, withBackground: withBackground }, Image$1), ForkIdWithType(id, type)) }), id));
 };
 
 var TableNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container;
     var content = data.content;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Table, tslib.__assign({ id: ForkIdWithType(id, type) }, { children: content.map(function (row, rowIdx) { return (
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Table, tslib.__assign({ id: ForkIdWithType(id, type) }, { children: content.map(function (row, rowIdx) { return (
             // eslint-disable-next-line react/no-array-index-key
             jsxRuntime.exports.jsx(TableRow, { children: row.map(function (cell, cellIdx) { return (
                 // eslint-disable-next-line react/no-array-index-key
@@ -1867,43 +1926,50 @@ var TableNode = function (_a) {
 
 var DelimiterNode = function (_a) {
     var type = _a.type, id = _a.id, Delimiter$1 = _a.Delimiter, Container$1 = _a.Container;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Delimiter, tslib.__assign({ id: ForkIdWithType(id, type) }, Delimiter$1)) }), id));
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Delimiter, tslib.__assign({ id: ForkIdWithType(id, type) }, Delimiter$1)) }), id));
 };
 
 var EmbedNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Embed$1 = _a.Embed;
     // eslint-disable-next-line no-unused-vars
     data.service; data.source; var embed = data.embed, width = data.width, height = data.height; data.caption;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Embed, tslib.__assign({ id: ForkIdWithType(id, type), src: embed, width: width, height: height }, Embed$1)) }), id));
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Embed, tslib.__assign({ id: ForkIdWithType(id, type), src: embed, width: width, height: height }, Embed$1)) }), id));
 };
 
 var RawNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Raw$1 = _a.Raw;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Raw, tslib.__assign({ id: ForkIdWithType(id, type) }, Raw$1, { children: data.html })) }), id));
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Raw, tslib.__assign({ id: ForkIdWithType(id, type) }, Raw$1, { children: data.html })) }), id));
 };
 
 var QuoteNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Quote$1 = _a.Quote;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Quote, tslib.__assign({ id: ForkIdWithType(id, type) }, Quote$1, { children: data.text })) }), id));
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Quote, tslib.__assign({ id: ForkIdWithType(id, type) }, Quote$1, { children: data.text })) }), id));
 };
 
 var CodeNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Code$1 = _a.Code;
     var code = data.code;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Code, tslib.__assign({ id: ForkIdWithType(id, type) }, Code$1, { children: code })) }), id));
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Code, tslib.__assign({ id: ForkIdWithType(id, type) }, Code$1, { children: code })) }), id));
 };
 
 var LinkNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, Container$1 = _a.Container, Link$1 = _a.Link;
     var _b = data.meta, image = _b.image, title = _b.title, description = _b.description, site_name = _b.site_name, link = data.link;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(Link, tslib.__assign({ id: ForkIdWithType(id, type), image: image.url, title: title, description: description, siteName: site_name, href: link }, Link$1)) }), id));
+    var _c = Container$1 || {}, sx = _c.sx, containerProps = tslib.__rest(_c, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(Link, tslib.__assign({ id: ForkIdWithType(id, type), image: image.url, title: title, description: description, siteName: site_name, href: link }, Link$1)) }), id));
 };
 
 var DEFAULT_GAP = 10;
 var CheckListNode = function (_a) {
     var type = _a.type, data = _a.data, id = _a.id, tunes = _a.tunes, Container$1 = _a.Container, CheckList$1 = _a.CheckList, Item = _a.Item;
     var items = data.items;
-    return (jsxRuntime.exports.jsx(Container, tslib.__assign({}, Container$1, { children: jsxRuntime.exports.jsx(CheckList, tslib.__assign({ id: ForkIdWithType(id, type) }, CheckList$1, { sx: tslib.__assign({ display: 'flex', flexWrap: 'wrap', gap: "".concat(DEFAULT_GAP, "px"), borderRadius: '25px', padding: '20px', backgroundColor: function (_) { return _.palette.background.default; }, border: '1px solid #EFF3FE' }, CheckList$1 === null || CheckList$1 === void 0 ? void 0 : CheckList$1.sx) }, { children: items.map(function (_a, idx) {
+    var _b = Container$1 || {}, sx = _b.sx, containerProps = tslib.__rest(_b, ["sx"]);
+    return (jsxRuntime.exports.jsx(Container, tslib.__assign({ sx: sx }, containerProps, { children: jsxRuntime.exports.jsx(CheckList, tslib.__assign({ id: ForkIdWithType(id, type) }, CheckList$1, { sx: tslib.__assign({ display: 'flex', flexWrap: 'wrap', gap: "".concat(DEFAULT_GAP, "px"), borderRadius: '25px', padding: '20px', backgroundColor: function (_) { return _.palette.background.default; }, border: '1px solid #EFF3FE' }, CheckList$1 === null || CheckList$1 === void 0 ? void 0 : CheckList$1.sx) }, { children: items.map(function (_a, idx) {
                 var _b, _c;
                 var checked = _a.checked, text = _a.text;
                 return (jsxRuntime.exports.jsxs(CheckListItem, tslib.__assign({}, Item, { sx: tslib.__assign(tslib.__assign(tslib.__assign({ display: 'flex', alignItems: 'center', flexWrap: 'nowrap', flexGrow: 0, columnGap: '5px', flexBasis: getFlexBasis(1, DEFAULT_GAP) }, (((_b = tunes === null || tunes === void 0 ? void 0 : tunes.columnTune) === null || _b === void 0 ? void 0 : _b.size) === 'two-columns' && {