@makeswift/runtime 0.6.0 → 0.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Form.cjs.js +71 -66
- package/dist/Form.cjs.js.map +1 -1
- package/dist/Form.es.js +71 -66
- package/dist/Form.es.js.map +1 -1
- package/dist/ReadOnlyText.cjs.js +4 -1
- package/dist/ReadOnlyText.cjs.js.map +1 -1
- package/dist/ReadOnlyText.es.js +4 -1
- package/dist/ReadOnlyText.es.js.map +1 -1
- package/dist/index.cjs.js +5 -2
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +5 -2
- package/dist/index.es.js.map +1 -1
- package/dist/types/src/components/builtin/Box/register.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Form/components/Field/components/RadioButton/index.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReadOnlyText.cjs.js","sources":["../src/components/builtin/Text/ReadOnlyText.tsx"],"sourcesContent":["import { cx } from '@emotion/css'\nimport { ForwardedRef, forwardRef, ReactNode } from 'react'\nimport type { BlockJSON, DocumentJSON, InlineJSON, MarkJSON, NodeJSON, TextJSON } from 'slate'\nimport type {\n ElementIDValue,\n LinkValue,\n RichTextValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { Link } from '../../shared/Link'\nimport DeviceOverrideBlock from './components/RichTextEditor/components/Block'\nimport DeviceOverrideMark from './components/RichTextEditor/components/Mark'\n\ntype Props = {\n id?: ElementIDValue\n text?: RichTextValue\n width?: string\n margin?: string\n}\n\nconst ReadOnlyText = forwardRef(function ReadOnlyText(\n { id, text, width, margin }: Props,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const plaintext = text?.document == null ? '' : getNodeText(text.document)\n\n return (\n <div ref={ref} id={id} className={cx(width, margin)}>\n {plaintext === '' ? <Placeholder /> : <Node {...text?.document} />}\n </div>\n )\n})\n\nexport default ReadOnlyText\n\nfunction Placeholder({ text = 'Write some text...' }: { text?: string }) {\n return (\n <span\n className={useStyle({\n display: 'inline-block',\n width: 0,\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n opacity: 0.333,\n verticalAlign: 'text-top',\n })}\n >\n {text}\n </span>\n )\n}\n\nfunction Node(props: NodeJSON) {\n switch (props.object) {\n case 'document':\n return <Document {...props} />\n\n case 'block':\n return <Block {...props} />\n\n case 'inline':\n return <Inline {...props} />\n\n case 'text':\n return <Text {...props} />\n\n default:\n return null\n }\n}\n\nfunction Document({ nodes }: DocumentJSON) {\n return (\n <>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </>\n )\n}\n\nfunction Block({ type, data, nodes }: BlockJSON) {\n const component = {\n paragraph: 'p',\n 'heading-one': 'h1',\n 'heading-two': 'h2',\n 'heading-three': 'h3',\n 'heading-four': 'h4',\n 'heading-five': 'h5',\n 'heading-six': 'h6',\n blockquote: 'blockquote',\n }[type]\n\n return (\n <DeviceOverrideBlock as={component} textAlign={data?.textAlign}>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </DeviceOverrideBlock>\n )\n}\n\nfunction Inline({ type, nodes, data }: InlineJSON) {\n const children = nodes?.map((node, idx) => <Node key={idx.toString()} {...node} />)\n const linkClassName = useStyle({ textDecoration: 'none' })\n\n switch (type) {\n case 'code':\n return <code>{children}</code>\n\n case 'superscript':\n return <sup>{children}</sup>\n\n case 'subscript':\n return <sub>{children}</sub>\n\n case 'link':\n return (\n <Link className={linkClassName} link={data as LinkValue | undefined}>\n {children}\n </Link>\n )\n\n default:\n return <>{children}</>\n }\n}\n\nfunction Text({ marks, text = '' }: TextJSON) {\n return (\n <>\n {(marks ?? []).reduce(\n (element, mark) => (\n <Mark {...mark}>{element}</Mark>\n ),\n <>{text === '' ? '\\uFEFF' : text}</>,\n )}\n </>\n )\n}\n\nconst TYPOGRAPHY_MARK_TYPE = 'typography'\n\nfunction Mark({ type, children, data }: MarkJSON & { children: ReactNode }) {\n if (type !== TYPOGRAPHY_MARK_TYPE) return <>{children}</>\n\n return <DeviceOverrideMark value={data?.value}>{children}</DeviceOverrideMark>\n}\n\nfunction getNodeText(node: NodeJSON): string {\n switch (node.object) {\n case 'document':\n return node?.nodes?.map(node => getNodeText(node)).join('\\n') ?? ''\n\n case 'block':\n return (\n node?.nodes\n ?.map(node => getNodeText(node))\n .join(node.nodes.every(node => node.object === 'block') ? '\\n' : '') ?? ''\n )\n\n case 'inline':\n return node?.nodes?.map(node => getNodeText(node)).join('') ?? ''\n\n case 'text':\n return node.text ?? ''\n\n default:\n return ''\n }\n}\n"],"names":["ReadOnlyText","forwardRef","id","text","width","margin","ref","plaintext","document","getNodeText","cx","_jsx","useStyle","display","maxWidth","whiteSpace","opacity","verticalAlign","props","object","nodes","_Fragment","map","node","idx","toString","type","data","component","paragraph","blockquote","DeviceOverrideBlock","textAlign","children","linkClassName","textDecoration","Link","marks","reduce","element","mark","TYPOGRAPHY_MARK_TYPE","DeviceOverrideMark","value","join","every"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBMA,MAAAA,eAAeC,MAAAA,WAAW,uBAC9B;AAAA,EAAEC;AAAAA,EAAIC;AAAAA,EAAMC;AAAAA,EAAOC;AAAAA,GACnBC,KACA;AACA,QAAMC,YAAYJ,8BAAMK,aAAY,OAAO,KAAKC,YAAYN,KAAKK,QAAN;AAGzD,wCAAA,OAAA;AAAA,IAAK;AAAA,IAAU;AAAA,IAAQ,WAAWE,IAAAA,GAAGN,OAAOC,MAAR;AAAA,IAApC,UACGE,cAAc,KAAKI,2BAAA,IAAC,aAApB,EAAA,IAAqCA,2BAAA,IAAC,MAASR,mBAAAA,6BAAMK,SAAhB;AAAA,EAAA,CAF1C;AAKD,CAX8B;AAe/B,qBAAqB;AAAA,EAAEL,OAAO;AAAA,GAA2C;AAErE,wCAAA,QAAA;AAAA,IACE,WAAWS,KAAAA,SAAS;AAAA,MAClBC,SAAS;AAAA,MACTT,OAAO;AAAA,MACPU,UAAU;AAAA,MACVC,YAAY;AAAA,MACZC,SAAS;AAAA,MACTC,eAAe;AAAA,IAAA,CANE;AAAA,IASlBd,UAAAA;AAAAA,EAAAA,CAXL;AAcD;AAED,cAAce,OAAiB;AACrBA,UAAAA,MAAMC;AAAAA,SACP;AACI,4CAAC,UAAaD,mBAAAA,MAArB;AAAA,SAEG;AACI,4CAAC,OAAUA,mBAAAA,MAAlB;AAAA,SAEG;AACI,4CAAC,QAAWA,mBAAAA,MAAnB;AAAA,SAEG;AACI,4CAAC,MAASA,mBAAAA,MAAjB;AAAA;AAGO,aAAA;AAAA;AAEZ;AAED,kBAAkB;AAAA,EAAEE;AAAAA,GAAuB;AAEvC,wCAAAC,WAAAA,UAAA;AAAA,IACGD,UAAAA,+BAAOE,IAAI,CAACC,MAAMC,uCAChB,MAA8BD,mBAAAA,OAApBC,IAAIC,SAAJ,CAAX;AAAA,EADD,CAFL;AAOD;AAED,eAAe;AAAA,EAAEC;AAAAA,EAAMC;AAAAA,EAAMP;AAAAA,GAAoB;AAC/C,QAAMQ,YAAY;AAAA,IAChBC,WAAW;AAAA,IACX,eAAe;AAAA,IACf,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACfC,YAAY;AAAA,
|
|
1
|
+
{"version":3,"file":"ReadOnlyText.cjs.js","sources":["../src/components/builtin/Text/ReadOnlyText.tsx"],"sourcesContent":["import { cx } from '@emotion/css'\nimport { ForwardedRef, forwardRef, ReactNode } from 'react'\nimport type { BlockJSON, DocumentJSON, InlineJSON, MarkJSON, NodeJSON, TextJSON } from 'slate'\nimport type {\n ElementIDValue,\n LinkValue,\n RichTextValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { Link } from '../../shared/Link'\nimport DeviceOverrideBlock from './components/RichTextEditor/components/Block'\nimport DeviceOverrideMark from './components/RichTextEditor/components/Mark'\n\ntype Props = {\n id?: ElementIDValue\n text?: RichTextValue\n width?: string\n margin?: string\n}\n\nconst ReadOnlyText = forwardRef(function ReadOnlyText(\n { id, text, width, margin }: Props,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const plaintext = text?.document == null ? '' : getNodeText(text.document)\n\n return (\n <div ref={ref} id={id} className={cx(width, margin)}>\n {plaintext === '' ? <Placeholder /> : <Node {...text?.document} />}\n </div>\n )\n})\n\nexport default ReadOnlyText\n\nfunction Placeholder({ text = 'Write some text...' }: { text?: string }) {\n return (\n <span\n className={useStyle({\n display: 'inline-block',\n width: 0,\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n opacity: 0.333,\n verticalAlign: 'text-top',\n })}\n >\n {text}\n </span>\n )\n}\n\nfunction Node(props: NodeJSON) {\n switch (props.object) {\n case 'document':\n return <Document {...props} />\n\n case 'block':\n return <Block {...props} />\n\n case 'inline':\n return <Inline {...props} />\n\n case 'text':\n return <Text {...props} />\n\n default:\n return null\n }\n}\n\nfunction Document({ nodes }: DocumentJSON) {\n return (\n <>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </>\n )\n}\n\nfunction Block({ type, data, nodes }: BlockJSON) {\n const component = {\n paragraph: 'p',\n 'heading-one': 'h1',\n 'heading-two': 'h2',\n 'heading-three': 'h3',\n 'heading-four': 'h4',\n 'heading-five': 'h5',\n 'heading-six': 'h6',\n blockquote: 'blockquote',\n 'ordered-list': 'ol',\n 'unordered-list': 'ul',\n 'list-item': 'li',\n }[type]\n\n return (\n <DeviceOverrideBlock as={component} textAlign={data?.textAlign}>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </DeviceOverrideBlock>\n )\n}\n\nfunction Inline({ type, nodes, data }: InlineJSON) {\n const children = nodes?.map((node, idx) => <Node key={idx.toString()} {...node} />)\n const linkClassName = useStyle({ textDecoration: 'none' })\n\n switch (type) {\n case 'code':\n return <code>{children}</code>\n\n case 'superscript':\n return <sup>{children}</sup>\n\n case 'subscript':\n return <sub>{children}</sub>\n\n case 'link':\n return (\n <Link className={linkClassName} link={data as LinkValue | undefined}>\n {children}\n </Link>\n )\n\n default:\n return <>{children}</>\n }\n}\n\nfunction Text({ marks, text = '' }: TextJSON) {\n return (\n <>\n {(marks ?? []).reduce(\n (element, mark) => (\n <Mark {...mark}>{element}</Mark>\n ),\n <>{text === '' ? '\\uFEFF' : text}</>,\n )}\n </>\n )\n}\n\nconst TYPOGRAPHY_MARK_TYPE = 'typography'\n\nfunction Mark({ type, children, data }: MarkJSON & { children: ReactNode }) {\n if (type !== TYPOGRAPHY_MARK_TYPE) return <>{children}</>\n\n return <DeviceOverrideMark value={data?.value}>{children}</DeviceOverrideMark>\n}\n\nfunction getNodeText(node: NodeJSON): string {\n switch (node.object) {\n case 'document':\n return node?.nodes?.map(node => getNodeText(node)).join('\\n') ?? ''\n\n case 'block':\n return (\n node?.nodes\n ?.map(node => getNodeText(node))\n .join(node.nodes.every(node => node.object === 'block') ? '\\n' : '') ?? ''\n )\n\n case 'inline':\n return node?.nodes?.map(node => getNodeText(node)).join('') ?? ''\n\n case 'text':\n return node.text ?? ''\n\n default:\n return ''\n }\n}\n"],"names":["ReadOnlyText","forwardRef","id","text","width","margin","ref","plaintext","document","getNodeText","cx","_jsx","useStyle","display","maxWidth","whiteSpace","opacity","verticalAlign","props","object","nodes","_Fragment","map","node","idx","toString","type","data","component","paragraph","blockquote","DeviceOverrideBlock","textAlign","children","linkClassName","textDecoration","Link","marks","reduce","element","mark","TYPOGRAPHY_MARK_TYPE","DeviceOverrideMark","value","join","every"],"mappings":"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"}
|
package/dist/ReadOnlyText.es.js
CHANGED
|
@@ -116,7 +116,10 @@ function Block({
|
|
|
116
116
|
"heading-four": "h4",
|
|
117
117
|
"heading-five": "h5",
|
|
118
118
|
"heading-six": "h6",
|
|
119
|
-
blockquote: "blockquote"
|
|
119
|
+
blockquote: "blockquote",
|
|
120
|
+
"ordered-list": "ol",
|
|
121
|
+
"unordered-list": "ul",
|
|
122
|
+
"list-item": "li"
|
|
120
123
|
}[type];
|
|
121
124
|
return /* @__PURE__ */ jsx(DeviceOverrideBlock, {
|
|
122
125
|
as: component,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReadOnlyText.es.js","sources":["../src/components/builtin/Text/ReadOnlyText.tsx"],"sourcesContent":["import { cx } from '@emotion/css'\nimport { ForwardedRef, forwardRef, ReactNode } from 'react'\nimport type { BlockJSON, DocumentJSON, InlineJSON, MarkJSON, NodeJSON, TextJSON } from 'slate'\nimport type {\n ElementIDValue,\n LinkValue,\n RichTextValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { Link } from '../../shared/Link'\nimport DeviceOverrideBlock from './components/RichTextEditor/components/Block'\nimport DeviceOverrideMark from './components/RichTextEditor/components/Mark'\n\ntype Props = {\n id?: ElementIDValue\n text?: RichTextValue\n width?: string\n margin?: string\n}\n\nconst ReadOnlyText = forwardRef(function ReadOnlyText(\n { id, text, width, margin }: Props,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const plaintext = text?.document == null ? '' : getNodeText(text.document)\n\n return (\n <div ref={ref} id={id} className={cx(width, margin)}>\n {plaintext === '' ? <Placeholder /> : <Node {...text?.document} />}\n </div>\n )\n})\n\nexport default ReadOnlyText\n\nfunction Placeholder({ text = 'Write some text...' }: { text?: string }) {\n return (\n <span\n className={useStyle({\n display: 'inline-block',\n width: 0,\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n opacity: 0.333,\n verticalAlign: 'text-top',\n })}\n >\n {text}\n </span>\n )\n}\n\nfunction Node(props: NodeJSON) {\n switch (props.object) {\n case 'document':\n return <Document {...props} />\n\n case 'block':\n return <Block {...props} />\n\n case 'inline':\n return <Inline {...props} />\n\n case 'text':\n return <Text {...props} />\n\n default:\n return null\n }\n}\n\nfunction Document({ nodes }: DocumentJSON) {\n return (\n <>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </>\n )\n}\n\nfunction Block({ type, data, nodes }: BlockJSON) {\n const component = {\n paragraph: 'p',\n 'heading-one': 'h1',\n 'heading-two': 'h2',\n 'heading-three': 'h3',\n 'heading-four': 'h4',\n 'heading-five': 'h5',\n 'heading-six': 'h6',\n blockquote: 'blockquote',\n }[type]\n\n return (\n <DeviceOverrideBlock as={component} textAlign={data?.textAlign}>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </DeviceOverrideBlock>\n )\n}\n\nfunction Inline({ type, nodes, data }: InlineJSON) {\n const children = nodes?.map((node, idx) => <Node key={idx.toString()} {...node} />)\n const linkClassName = useStyle({ textDecoration: 'none' })\n\n switch (type) {\n case 'code':\n return <code>{children}</code>\n\n case 'superscript':\n return <sup>{children}</sup>\n\n case 'subscript':\n return <sub>{children}</sub>\n\n case 'link':\n return (\n <Link className={linkClassName} link={data as LinkValue | undefined}>\n {children}\n </Link>\n )\n\n default:\n return <>{children}</>\n }\n}\n\nfunction Text({ marks, text = '' }: TextJSON) {\n return (\n <>\n {(marks ?? []).reduce(\n (element, mark) => (\n <Mark {...mark}>{element}</Mark>\n ),\n <>{text === '' ? '\\uFEFF' : text}</>,\n )}\n </>\n )\n}\n\nconst TYPOGRAPHY_MARK_TYPE = 'typography'\n\nfunction Mark({ type, children, data }: MarkJSON & { children: ReactNode }) {\n if (type !== TYPOGRAPHY_MARK_TYPE) return <>{children}</>\n\n return <DeviceOverrideMark value={data?.value}>{children}</DeviceOverrideMark>\n}\n\nfunction getNodeText(node: NodeJSON): string {\n switch (node.object) {\n case 'document':\n return node?.nodes?.map(node => getNodeText(node)).join('\\n') ?? ''\n\n case 'block':\n return (\n node?.nodes\n ?.map(node => getNodeText(node))\n .join(node.nodes.every(node => node.object === 'block') ? '\\n' : '') ?? ''\n )\n\n case 'inline':\n return node?.nodes?.map(node => getNodeText(node)).join('') ?? ''\n\n case 'text':\n return node.text ?? ''\n\n default:\n return ''\n }\n}\n"],"names":["ReadOnlyText","forwardRef","id","text","width","margin","ref","plaintext","document","getNodeText","cx","_jsx","useStyle","display","maxWidth","whiteSpace","opacity","verticalAlign","props","object","nodes","_Fragment","map","node","idx","toString","type","data","component","paragraph","blockquote","textAlign","children","linkClassName","textDecoration","marks","reduce","element","mark","TYPOGRAPHY_MARK_TYPE","DeviceOverrideMark","value","join","every"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBMA,MAAAA,eAAeC,WAAW,uBAC9B;AAAA,EAAEC;AAAAA,EAAIC;AAAAA,EAAMC;AAAAA,EAAOC;AAAAA,GACnBC,KACA;AACA,QAAMC,YAAYJ,8BAAMK,aAAY,OAAO,KAAKC,YAAYN,KAAKK,QAAN;AAGzD,6BAAA,OAAA;AAAA,IAAK;AAAA,IAAU;AAAA,IAAQ,WAAWE,GAAGN,OAAOC,MAAR;AAAA,IAApC,UACGE,cAAc,KAAKI,oBAAC,aAApB,EAAA,IAAqCA,oBAAC,MAASR,mBAAAA,6BAAMK,SAAhB;AAAA,EAAA,CAF1C;AAKD,CAX8B;AAe/B,qBAAqB;AAAA,EAAEL,OAAO;AAAA,GAA2C;AAErE,6BAAA,QAAA;AAAA,IACE,WAAWS,SAAS;AAAA,MAClBC,SAAS;AAAA,MACTT,OAAO;AAAA,MACPU,UAAU;AAAA,MACVC,YAAY;AAAA,MACZC,SAAS;AAAA,MACTC,eAAe;AAAA,IAAA,CANE;AAAA,IASlBd,UAAAA;AAAAA,EAAAA,CAXL;AAcD;AAED,cAAce,OAAiB;AACrBA,UAAAA,MAAMC;AAAAA,SACP;AACI,iCAAC,UAAaD,mBAAAA,MAArB;AAAA,SAEG;AACI,iCAAC,OAAUA,mBAAAA,MAAlB;AAAA,SAEG;AACI,iCAAC,QAAWA,mBAAAA,MAAnB;AAAA,SAEG;AACI,iCAAC,MAASA,mBAAAA,MAAjB;AAAA;AAGO,aAAA;AAAA;AAEZ;AAED,kBAAkB;AAAA,EAAEE;AAAAA,GAAuB;AAEvC,6BAAAC,UAAA;AAAA,IACGD,UAAAA,+BAAOE,IAAI,CAACC,MAAMC,4BAChB,MAA8BD,mBAAAA,OAApBC,IAAIC,SAAJ,CAAX;AAAA,EADD,CAFL;AAOD;AAED,eAAe;AAAA,EAAEC;AAAAA,EAAMC;AAAAA,EAAMP;AAAAA,GAAoB;AAC/C,QAAMQ,YAAY;AAAA,IAChBC,WAAW;AAAA,IACX,eAAe;AAAA,IACf,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACfC,YAAY;AAAA,
|
|
1
|
+
{"version":3,"file":"ReadOnlyText.es.js","sources":["../src/components/builtin/Text/ReadOnlyText.tsx"],"sourcesContent":["import { cx } from '@emotion/css'\nimport { ForwardedRef, forwardRef, ReactNode } from 'react'\nimport type { BlockJSON, DocumentJSON, InlineJSON, MarkJSON, NodeJSON, TextJSON } from 'slate'\nimport type {\n ElementIDValue,\n LinkValue,\n RichTextValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { Link } from '../../shared/Link'\nimport DeviceOverrideBlock from './components/RichTextEditor/components/Block'\nimport DeviceOverrideMark from './components/RichTextEditor/components/Mark'\n\ntype Props = {\n id?: ElementIDValue\n text?: RichTextValue\n width?: string\n margin?: string\n}\n\nconst ReadOnlyText = forwardRef(function ReadOnlyText(\n { id, text, width, margin }: Props,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const plaintext = text?.document == null ? '' : getNodeText(text.document)\n\n return (\n <div ref={ref} id={id} className={cx(width, margin)}>\n {plaintext === '' ? <Placeholder /> : <Node {...text?.document} />}\n </div>\n )\n})\n\nexport default ReadOnlyText\n\nfunction Placeholder({ text = 'Write some text...' }: { text?: string }) {\n return (\n <span\n className={useStyle({\n display: 'inline-block',\n width: 0,\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n opacity: 0.333,\n verticalAlign: 'text-top',\n })}\n >\n {text}\n </span>\n )\n}\n\nfunction Node(props: NodeJSON) {\n switch (props.object) {\n case 'document':\n return <Document {...props} />\n\n case 'block':\n return <Block {...props} />\n\n case 'inline':\n return <Inline {...props} />\n\n case 'text':\n return <Text {...props} />\n\n default:\n return null\n }\n}\n\nfunction Document({ nodes }: DocumentJSON) {\n return (\n <>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </>\n )\n}\n\nfunction Block({ type, data, nodes }: BlockJSON) {\n const component = {\n paragraph: 'p',\n 'heading-one': 'h1',\n 'heading-two': 'h2',\n 'heading-three': 'h3',\n 'heading-four': 'h4',\n 'heading-five': 'h5',\n 'heading-six': 'h6',\n blockquote: 'blockquote',\n 'ordered-list': 'ol',\n 'unordered-list': 'ul',\n 'list-item': 'li',\n }[type]\n\n return (\n <DeviceOverrideBlock as={component} textAlign={data?.textAlign}>\n {nodes?.map((node, idx) => (\n <Node key={idx.toString()} {...node} />\n ))}\n </DeviceOverrideBlock>\n )\n}\n\nfunction Inline({ type, nodes, data }: InlineJSON) {\n const children = nodes?.map((node, idx) => <Node key={idx.toString()} {...node} />)\n const linkClassName = useStyle({ textDecoration: 'none' })\n\n switch (type) {\n case 'code':\n return <code>{children}</code>\n\n case 'superscript':\n return <sup>{children}</sup>\n\n case 'subscript':\n return <sub>{children}</sub>\n\n case 'link':\n return (\n <Link className={linkClassName} link={data as LinkValue | undefined}>\n {children}\n </Link>\n )\n\n default:\n return <>{children}</>\n }\n}\n\nfunction Text({ marks, text = '' }: TextJSON) {\n return (\n <>\n {(marks ?? []).reduce(\n (element, mark) => (\n <Mark {...mark}>{element}</Mark>\n ),\n <>{text === '' ? '\\uFEFF' : text}</>,\n )}\n </>\n )\n}\n\nconst TYPOGRAPHY_MARK_TYPE = 'typography'\n\nfunction Mark({ type, children, data }: MarkJSON & { children: ReactNode }) {\n if (type !== TYPOGRAPHY_MARK_TYPE) return <>{children}</>\n\n return <DeviceOverrideMark value={data?.value}>{children}</DeviceOverrideMark>\n}\n\nfunction getNodeText(node: NodeJSON): string {\n switch (node.object) {\n case 'document':\n return node?.nodes?.map(node => getNodeText(node)).join('\\n') ?? ''\n\n case 'block':\n return (\n node?.nodes\n ?.map(node => getNodeText(node))\n .join(node.nodes.every(node => node.object === 'block') ? '\\n' : '') ?? ''\n )\n\n case 'inline':\n return node?.nodes?.map(node => getNodeText(node)).join('') ?? ''\n\n case 'text':\n return node.text ?? ''\n\n default:\n return ''\n }\n}\n"],"names":["ReadOnlyText","forwardRef","id","text","width","margin","ref","plaintext","document","getNodeText","cx","_jsx","useStyle","display","maxWidth","whiteSpace","opacity","verticalAlign","props","object","nodes","_Fragment","map","node","idx","toString","type","data","component","paragraph","blockquote","textAlign","children","linkClassName","textDecoration","marks","reduce","element","mark","TYPOGRAPHY_MARK_TYPE","DeviceOverrideMark","value","join","every"],"mappings":"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"}
|
package/dist/index.cjs.js
CHANGED
|
@@ -1083,7 +1083,7 @@ class Document$1 extends NextDocument__default["default"] {
|
|
|
1083
1083
|
});
|
|
1084
1084
|
}
|
|
1085
1085
|
}
|
|
1086
|
-
const version = "0.6.
|
|
1086
|
+
const version = "0.6.2";
|
|
1087
1087
|
function isErrorWithMessage(error) {
|
|
1088
1088
|
return typeof error === "object" && error !== null && "message" in error && typeof error.message === "string";
|
|
1089
1089
|
}
|
|
@@ -1416,7 +1416,10 @@ function registerComponent$c(runtime) {
|
|
|
1416
1416
|
props: {
|
|
1417
1417
|
id: slot.ElementID(),
|
|
1418
1418
|
backgrounds: slot.Backgrounds(),
|
|
1419
|
-
width: slot.Width({
|
|
1419
|
+
width: slot.Width({
|
|
1420
|
+
format: slot.Width.Format.ClassName,
|
|
1421
|
+
defaultValue: { value: 100, unit: "%" }
|
|
1422
|
+
}),
|
|
1420
1423
|
height: slot.ResponsiveIconRadioGroup({
|
|
1421
1424
|
label: "Height",
|
|
1422
1425
|
options: [
|