@vonaffenfels/slate-editor 1.1.71 → 1.2.0

package/src/Nodes/Leaf.js

@@ -1,55 +1,55 @@
-import React from "react";
-import {
-    Bold, Italic, Text, Underlined, Strikethrough, Small, SuperscriptUp,
-} from "./Text";
-
-export const Leaf = ({
-    attributes,
-    children,
-    leaf,
-    isRenderer,
-    typeProps,
-    ...props
-}) => {
-    if (leaf.bold) {
-        children = <Bold typeProps={typeProps} attributes={attributes}><Text
-            attributes={attributes}
-            typeProps={typeProps}
-            isRenderer={isRenderer}>{children}</Text></Bold>;
-    }
-
-    if (leaf.italic) {
-        children =
-            <Italic typeProps={typeProps} attributes={attributes}><Text attributes={attributes} typeProps={typeProps} isRenderer={isRenderer}>{children}</Text></Italic>;
-    }
-
-    if (leaf.underlined) {
-        children = <Underlined typeProps={typeProps} attributes={attributes}><Text
-            attributes={attributes}
-            typeProps={typeProps}
-            isRenderer={isRenderer}>{children}</Text></Underlined>;
-    }
-
-    if (leaf.strikethrough) {
-        children = <Strikethrough typeProps={typeProps} attributes={attributes}><Text
-            attributes={attributes}
-            typeProps={typeProps}
-            isRenderer={isRenderer}>{children}</Text></Strikethrough>;
-    }
-
-    if (leaf.small) {
-        children = <Small typeProps={typeProps} attributes={attributes}><Text
-            attributes={attributes}
-            typeProps={typeProps}
-            isRenderer={isRenderer}>{children}</Text></Small>;
-    }
-
-    if (leaf.superscriptUp) {
-        children = <SuperscriptUp typeProps={typeProps} attributes={attributes}><Text
-            attributes={attributes}
-            typeProps={typeProps}
-            isRenderer={isRenderer}>{children}</Text></SuperscriptUp>;
-    }
-
-    return <Text attributes={attributes} typeProps={typeProps} isRenderer={isRenderer}>{children}</Text>;
+import React from "react";
+import {
+    Bold, Italic, Text, Underlined, Strikethrough, Small, SuperscriptUp,
+} from "./Text";
+
+export const Leaf = ({
+    attributes,
+    children,
+    leaf,
+    isRenderer,
+    typeProps,
+    ...props
+}) => {
+    if (leaf.bold) {
+        children = <Bold typeProps={typeProps} attributes={attributes}><Text
+            attributes={attributes}
+            typeProps={typeProps}
+            isRenderer={isRenderer}>{children}</Text></Bold>;
+    }
+
+    if (leaf.italic) {
+        children =
+            <Italic typeProps={typeProps} attributes={attributes}><Text attributes={attributes} typeProps={typeProps} isRenderer={isRenderer}>{children}</Text></Italic>;
+    }
+
+    if (leaf.underlined) {
+        children = <Underlined typeProps={typeProps} attributes={attributes}><Text
+            attributes={attributes}
+            typeProps={typeProps}
+            isRenderer={isRenderer}>{children}</Text></Underlined>;
+    }
+
+    if (leaf.strikethrough) {
+        children = <Strikethrough typeProps={typeProps} attributes={attributes}><Text
+            attributes={attributes}
+            typeProps={typeProps}
+            isRenderer={isRenderer}>{children}</Text></Strikethrough>;
+    }
+
+    if (leaf.small) {
+        children = <Small typeProps={typeProps} attributes={attributes}><Text
+            attributes={attributes}
+            typeProps={typeProps}
+            isRenderer={isRenderer}>{children}</Text></Small>;
+    }
+
+    if (leaf.superscriptUp) {
+        children = <SuperscriptUp typeProps={typeProps} attributes={attributes}><Text
+            attributes={attributes}
+            typeProps={typeProps}
+            isRenderer={isRenderer}>{children}</Text></SuperscriptUp>;
+    }
+
+    return <Text attributes={attributes} typeProps={typeProps} isRenderer={isRenderer}>{children}</Text>;
 };

package/src/Nodes/Text.js

@@ -1,98 +1,98 @@
-import React, {Fragment} from "react";
-
-const EmptyWrapper = ({children}) => <>{children}</>;
-
-export const Text = ({
-    isRenderer,
-    attributes,
-    children,
-    typeProps,
-}) => {
-    if (isRenderer) {
-        if (!children) {
-            return null;
-        }
-
-        if (typeof children === "string") {
-            const breakParts = children.split("\n");
-
-            return <Fragment>
-                {breakParts.length > 1 ? breakParts.map((v, i) => {
-                    return <Fragment key={i}>
-                        {renderTextLine(v, typeProps)}{i !== breakParts.length - 1 ? <br/> : null}
-                    </Fragment>;
-                }) : renderTextLine(children, typeProps)}
-            </Fragment>;
-        } else {
-            return <Fragment>
-                {children}
-            </Fragment>;
-        }
-    }
-
-    return <span {...attributes}>{children}</span>;
-};
-
-function renderTextLine(text, typeProps) {
-    if (!typeProps || !text || typeof text !== "string") {
-        return text;
-    }
-
-    if (typeProps.line_transform) {
-        for (let startsWithStr in typeProps.line_transform) {
-            if (text.startsWith(startsWithStr)) {
-                const WrapperComponent = typeProps.line_transform[startsWithStr];
-                return <WrapperComponent>{text.substr(startsWithStr.length).trim()}</WrapperComponent>;
-            }
-        }
-    }
-
-    return text;
-}
-
-export const Bold = ({
-    attributes,
-    children,
-}) => {
-    return <strong {...attributes}>{children}</strong>;
-};
-
-export const Italic = ({
-    attributes,
-    children,
-}) => {
-    return <i {...attributes}>{children}</i>;
-};
-
-export const Underlined = ({
-    attributes,
-    children,
-}) => {
-    return <u {...attributes}>{children}</u>;
-};
-
-export const Strikethrough = ({
-    attributes,
-    children,
-}) => {
-    return <del {...attributes}>{children}</del>;
-};
-
-export const Small = ({
-    attributes,
-    children,
-}) => {
-    return <small {...attributes}>{children}</small>;
-};
-
-export const SuperscriptUp = ({
-    attributes,
-    children,
-}) => {
-    return <span
-        style={{
-            fontSize: "60%",
-            verticalAlign: "top",
-        }}
-        {...attributes}>{children}</span>;
+import React, {Fragment} from "react";
+
+const EmptyWrapper = ({children}) => <>{children}</>;
+
+export const Text = ({
+    isRenderer,
+    attributes,
+    children,
+    typeProps,
+}) => {
+    if (isRenderer) {
+        if (!children) {
+            return null;
+        }
+
+        if (typeof children === "string") {
+            const breakParts = children.split("\n");
+
+            return <Fragment>
+                {breakParts.length > 1 ? breakParts.map((v, i) => {
+                    return <Fragment key={i}>
+                        {renderTextLine(v, typeProps)}{i !== breakParts.length - 1 ? <br/> : null}
+                    </Fragment>;
+                }) : renderTextLine(children, typeProps)}
+            </Fragment>;
+        } else {
+            return <Fragment>
+                {children}
+            </Fragment>;
+        }
+    }
+
+    return <span {...attributes}>{children}</span>;
+};
+
+function renderTextLine(text, typeProps) {
+    if (!typeProps || !text || typeof text !== "string") {
+        return text;
+    }
+
+    if (typeProps.line_transform) {
+        for (let startsWithStr in typeProps.line_transform) {
+            if (text.startsWith(startsWithStr)) {
+                const WrapperComponent = typeProps.line_transform[startsWithStr];
+                return <WrapperComponent>{text.substr(startsWithStr.length).trim()}</WrapperComponent>;
+            }
+        }
+    }
+
+    return text;
+}
+
+export const Bold = ({
+    attributes,
+    children,
+}) => {
+    return <strong {...attributes}>{children}</strong>;
+};
+
+export const Italic = ({
+    attributes,
+    children,
+}) => {
+    return <i {...attributes}>{children}</i>;
+};
+
+export const Underlined = ({
+    attributes,
+    children,
+}) => {
+    return <u {...attributes}>{children}</u>;
+};
+
+export const Strikethrough = ({
+    attributes,
+    children,
+}) => {
+    return <del {...attributes}>{children}</del>;
+};
+
+export const Small = ({
+    attributes,
+    children,
+}) => {
+    return <small {...attributes}>{children}</small>;
+};
+
+export const SuperscriptUp = ({
+    attributes,
+    children,
+}) => {
+    return <span
+        style={{
+            fontSize: "60%",
+            verticalAlign: "top",
+        }}
+        {...attributes}>{children}</span>;
 };

package/src/ObjectId.js

@@ -1,4 +1,4 @@
-export const ObjectId = (
-    m = Math, d = Date, h = 16, s = s => m.floor(s).toString(h),
-) =>
+export const ObjectId = (
+    m = Math, d = Date, h = 16, s = s => m.floor(s).toString(h),
+) =>
     s(d.now() / 1000) + ' '.repeat(h).replace(/./g, () => s(m.random() * h));

package/src/Renderer.js

@@ -1,74 +1,74 @@
-import React, {memo} from 'react';
-import {StorybookContext} from "./Context/StorybookContext";
-import {Serializer} from "./Serializer";
-
-const Renderer = memo(function RendererInner({
-    value,
-    modifyElementFunc,
-    specialClassMap,
-    elementPropsMap,
-    transformAttributes,
-    storybookComponentLoader,
-    storybookComponentDataLoader,
-    filterContent,
-    fixedPositions,
-    fixedPositionTypes,
-    adDefinitionDesktop,
-    adDefinitionMobile,
-    defaultComponentReplacement,
-    onStorybookElementClick,
-}) {
-    return <Serializer
-        elementPropsMap={elementPropsMap}
-        specialClassMap={specialClassMap}
-        defaultComponentReplacement={defaultComponentReplacement}
-        transformAttributes={transformAttributes}
-        value={value}
-        filterContent={filterContent}
-        modifyElementFunc={modifyElementFunc}
-        storybookComponentLoader={storybookComponentLoader}
-        storybookComponentDataLoader={storybookComponentDataLoader}
-        fixedPositions={fixedPositions}
-        fixedPositionTypes={fixedPositionTypes}
-        adDefinitionDesktop={adDefinitionDesktop}
-        adDefinitionMobile={adDefinitionMobile}
-        isRenderer={true}
-        onStorybookElementClick={onStorybookElementClick}/>
-}, (prevProps, nextProps) => {
-    let allKeys = Array.from(new Set([...Object.keys(nextProps), ...Object.keys(prevProps)]));
-
-    for (let i = 0; i < allKeys.length; i++) {
-        const key = allKeys[i];
-        const oldValue = prevProps[key];
-        const newValue = nextProps[key];
-
-        if (oldValue === newValue) {
-            continue;
-        }
-
-        if (!oldValue && !newValue) {
-            console.warn(`Renderer :: ${key} :: Both empty but type changed?`, {oldValue, newValue});
-            continue;
-        }
-
-        if (typeof oldValue === "object" && typeof newValue === "object" && oldValue && newValue) {
-            try {
-                if (JSON.stringify(oldValue) === JSON.stringify(newValue)) {
-                    continue;
-                }
-            } catch (e) {
-                return false;
-            }
-        }
-
-        return false;
-    }
-
-    return true;
-})
-
-const RendererMemo = memo(Renderer);
-
-export default RendererMemo;
-
+import React, {memo} from 'react';
+import {StorybookContext} from "./Context/StorybookContext";
+import {Serializer} from "./Serializer";
+
+const Renderer = memo(function RendererInner({
+    value,
+    modifyElementFunc,
+    specialClassMap,
+    elementPropsMap,
+    transformAttributes,
+    storybookComponentLoader,
+    storybookComponentDataLoader,
+    filterContent,
+    fixedPositions,
+    fixedPositionTypes,
+    adDefinitionDesktop,
+    adDefinitionMobile,
+    defaultComponentReplacement,
+    onStorybookElementClick,
+}) {
+    return <Serializer
+        elementPropsMap={elementPropsMap}
+        specialClassMap={specialClassMap}
+        defaultComponentReplacement={defaultComponentReplacement}
+        transformAttributes={transformAttributes}
+        value={value}
+        filterContent={filterContent}
+        modifyElementFunc={modifyElementFunc}
+        storybookComponentLoader={storybookComponentLoader}
+        storybookComponentDataLoader={storybookComponentDataLoader}
+        fixedPositions={fixedPositions}
+        fixedPositionTypes={fixedPositionTypes}
+        adDefinitionDesktop={adDefinitionDesktop}
+        adDefinitionMobile={adDefinitionMobile}
+        isRenderer={true}
+        onStorybookElementClick={onStorybookElementClick}/>
+}, (prevProps, nextProps) => {
+    let allKeys = Array.from(new Set([...Object.keys(nextProps), ...Object.keys(prevProps)]));
+
+    for (let i = 0; i < allKeys.length; i++) {
+        const key = allKeys[i];
+        const oldValue = prevProps[key];
+        const newValue = nextProps[key];
+
+        if (oldValue === newValue) {
+            continue;
+        }
+
+        if (!oldValue && !newValue) {
+            console.warn(`Renderer :: ${key} :: Both empty but type changed?`, {oldValue, newValue});
+            continue;
+        }
+
+        if (typeof oldValue === "object" && typeof newValue === "object" && oldValue && newValue) {
+            try {
+                if (JSON.stringify(oldValue) === JSON.stringify(newValue)) {
+                    continue;
+                }
+            } catch (e) {
+                return false;
+            }
+        }
+
+        return false;
+    }
+
+    return true;
+})
+
+const RendererMemo = memo(Renderer);
+
+export default RendererMemo;
+
 export {StorybookContext};

package/src/Serializer/Html.js

@@ -1,43 +1,43 @@
-import escapeHtml from 'escape-html';
-import {Text} from 'slate';
-
-export const HtmlSerializer = (slateValue) => {
-    if (!Array.isArray(slateValue)) {
-        return "";
-    }
-
-    const html = slateValue.map(serializeNode).join('');
-
-    return html;
-};
-
-export const serializeNode = (node) => {
-    if (Text.isText(node)) {
-        return escapeHtml(node.text);
-    }
-
-    const children = (node.children || []).map(n => serializeNode(n)).join('');
-
-    switch (node.type) {
-        case 'blockquote':
-            return `<blockquote>${children}</blockquote>`;
-        case 'heading':
-            return `<h3>${children}</h3>`;
-        case 'paragraph':
-            return `<p>${children}</p>`;
-        case 'unordered-list':
-            return `<ul>${children}</ul>`;
-        case 'ordered-list':
-            return `<ol>${children}</ol>`;
-        case 'arrow-list':
-            return `<ul>${children}</ul>`;
-        case 'list-item':
-            return `<li>${children}</li>`;
-        case 'link':
-            return `<a href="${escapeHtml(node?.attributes?.href)}" target="${node?.attributes?.target || ''}">${children}</a>`;
-        case 'storybook':
-            return ``;
-        default:
-            return children;
-    }
+import escapeHtml from 'escape-html';
+import {Text} from 'slate';
+
+export const HtmlSerializer = (slateValue) => {
+    if (!Array.isArray(slateValue)) {
+        return "";
+    }
+
+    const html = slateValue.map(serializeNode).join('');
+
+    return html;
+};
+
+export const serializeNode = (node) => {
+    if (Text.isText(node)) {
+        return escapeHtml(node.text);
+    }
+
+    const children = (node.children || []).map(n => serializeNode(n)).join('');
+
+    switch (node.type) {
+        case 'blockquote':
+            return `<blockquote>${children}</blockquote>`;
+        case 'heading':
+            return `<h3>${children}</h3>`;
+        case 'paragraph':
+            return `<p>${children}</p>`;
+        case 'unordered-list':
+            return `<ul>${children}</ul>`;
+        case 'ordered-list':
+            return `<ol>${children}</ol>`;
+        case 'arrow-list':
+            return `<ul>${children}</ul>`;
+        case 'list-item':
+            return `<li>${children}</li>`;
+        case 'link':
+            return `<a href="${escapeHtml(node?.attributes?.href)}" target="${node?.attributes?.target || ''}">${children}</a>`;
+        case 'storybook':
+            return ``;
+        default:
+            return children;
+    }
 };