@tinacms/mdx 0.0.0-20220718181631 → 0.60.3

package/dist/parse/remarkToPlate.js

@@ -0,0 +1,380 @@
+/**
+
+Copyright 2021 Forestry.io Holdings, Inc.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+*/
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from) {
+    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
+        to[j] = from[i];
+    return to;
+};
+import { flatten } from 'lodash-es';
+import { mdxJsxElement } from './mdx';
+export var remarkToSlate = function (root, field, imageCallback) {
+    var content = function (content) {
+        switch (content.type) {
+            case 'blockquote':
+                var children_1 = [];
+                content.children.map(function (child) {
+                    var inlineElements = unwrapBlockContent(child);
+                    inlineElements.forEach(function (child) {
+                        children_1.push(child);
+                    });
+                });
+                return {
+                    type: 'blockquote',
+                    children: children_1
+                };
+            case 'heading':
+                return heading(content);
+            case 'code':
+                return code(content);
+            case 'paragraph':
+                return paragraph(content);
+            case 'mdxJsxFlowElement':
+                return mdxJsxElement(content, field, imageCallback);
+            case 'thematicBreak':
+                return {
+                    type: 'hr',
+                    children: [{ type: 'text', text: '' }]
+                };
+            case 'listItem':
+                return {
+                    type: 'li',
+                    children: [
+                        {
+                            type: 'lic',
+                            children: flatten(content.children.map(function (child) { return unwrapBlockContent(child); }))
+                        },
+                    ]
+                };
+            case 'list':
+                return list(content);
+            case 'html':
+                return html(content);
+            // @ts-ignore
+            case 'mdxFlowExpression':
+            // @ts-ignore
+            case 'mdxjsEsm':
+                // @ts-ignore
+                throw new RichTextParseError(
+                // @ts-ignore
+                "Unexpected expression " + content.value + ".", 
+                // @ts-ignore
+                content.position);
+            default:
+                throw new RichTextParseError("Content: " + content.type + " is not yet supported", 
+                // @ts-ignore
+                content.position);
+        }
+    };
+    var html = function (content) {
+        return {
+            type: 'html',
+            value: content.value,
+            children: [{ type: 'text', text: '' }]
+        };
+    };
+    var html_inline = function (content) {
+        return {
+            type: 'html_inline',
+            value: content.value,
+            children: [{ type: 'text', text: '' }]
+        };
+    };
+    var list = function (content) {
+        return {
+            type: content.ordered ? 'ol' : 'ul',
+            children: content.children.map(function (child) { return listItem(child); })
+        };
+    };
+    var listItem = function (content) {
+        /**
+         * lic (list item content) maps 1-1 with a paragraph element
+         * but in plate we don't support other block-level elements from being list items
+         * In remark, a list item contains "FlowContent" https://github.com/syntax-tree/mdast#flowcontent
+         * Blockquote | Code | Heading | HTML | List | ThematicBreak | Content
+         *
+         * But we only support paragraph-like blocks ("LIC"), other and text nodes
+         *
+         * Another thing is that in remark nested lists are wrapped in their ul/li `List` parent
+         * but in Plate we don't have that, so we can't have a ol inside a ul in plate
+         */
+        return {
+            type: 'li',
+            children: content.children.map(function (child) {
+                switch (child.type) {
+                    case 'list':
+                        return list(child);
+                    case 'heading':
+                    case 'paragraph':
+                        return {
+                            type: 'lic',
+                            children: flatten(child.children.map(function (child) { return phrasingContent(child); }))
+                        };
+                    case 'blockquote': {
+                        return __assign(__assign({}, blockquote(child)), { type: 'lic' });
+                    }
+                    case 'mdxJsxFlowElement':
+                        return {
+                            type: 'lic',
+                            children: [
+                                // @ts-ignore casting a flow element to a paragraph
+                                mdxJsxElement(__assign(__assign({}, child), { type: 'mdxJsxTextElement' }), field, imageCallback),
+                            ]
+                        };
+                    case 'code':
+                    case 'thematicBreak':
+                    case 'table':
+                    case 'html':
+                        throw new Error(content.type + " inside list item is not supported");
+                    default:
+                        throw new Error("Unknown list item of type " + content.type);
+                }
+            })
+        };
+    };
+    var unwrapBlockContent = function (content) {
+        var flattenPhrasingContent = function (children) {
+            var children2 = children.map(function (child) { return phrasingContent(child); });
+            return flatten(Array.isArray(children2) ? children2 : [children2]);
+        };
+        switch (content.type) {
+            case 'heading':
+            case 'paragraph':
+                return flattenPhrasingContent(content.children);
+            default:
+                throw new Error("UnwrapBlock: Unknown block content of type " + content.type);
+        }
+    };
+    var code = function (content) {
+        var extra = {};
+        if (content.lang)
+            extra['lang'] = content.lang;
+        return __assign(__assign({ type: 'code_block' }, extra), { value: content.value, children: [{ type: 'text', text: '' }] });
+    };
+    var link = function (content) {
+        return {
+            type: 'a',
+            url: content.url,
+            title: content.title,
+            children: flatten(content.children.map(function (child) { return staticPhrasingContent(child); }))
+        };
+    };
+    var heading = function (content) {
+        return {
+            type: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'][content.depth - 1],
+            children: flatten(content.children.map(phrasingContent))
+        };
+    };
+    var staticPhrasingContent = function (content) {
+        switch (content.type) {
+            case 'mdxJsxTextElement':
+                return mdxJsxElement(content, field, imageCallback);
+            case 'text':
+                return text(content);
+            case 'inlineCode':
+            case 'emphasis':
+            case 'image':
+            case 'strong':
+                return phrashingMark(content);
+            default:
+                throw new Error("StaticPhrasingContent: " + content.type + " is not yet supported");
+        }
+    };
+    var phrasingContent = function (content) {
+        switch (content.type) {
+            case 'text':
+                return text(content);
+            case 'link':
+                return link(content);
+            case 'image':
+                return image(content);
+            case 'mdxJsxTextElement':
+                return mdxJsxElement(content, field, imageCallback);
+            case 'emphasis':
+                return phrashingMark(content);
+            case 'strong':
+                return phrashingMark(content);
+            case 'break':
+                return breakContent();
+            case 'inlineCode':
+                return phrashingMark(content);
+            case 'html':
+                return html_inline(content);
+            // @ts-ignore
+            case 'mdxTextExpression':
+                throw new RichTextParseError(
+                // @ts-ignore
+                "Unexpected expression " + content.value + ".", 
+                // @ts-ignore
+                content.position);
+            default:
+                throw new Error("PhrasingContent: " + content.type + " is not yet supported");
+        }
+    };
+    var breakContent = function () {
+        return {
+            type: 'break',
+            children: [
+                {
+                    type: 'text',
+                    text: ''
+                },
+            ]
+        };
+    };
+    var phrashingMark = function (node, marks) {
+        if (marks === void 0) { marks = []; }
+        var accum = [];
+        switch (node.type) {
+            case 'emphasis': {
+                var children = flatten(node.children.map(function (child) {
+                    return phrashingMark(child, __spreadArray(__spreadArray([], marks), ['italic']));
+                }));
+                children.forEach(function (child) {
+                    accum.push(child);
+                });
+                break;
+            }
+            case 'inlineCode': {
+                var markProps_1 = {};
+                marks.forEach(function (mark) { return (markProps_1[mark] = true); });
+                accum.push(__assign({ type: 'text', text: node.value, code: true }, markProps_1));
+                break;
+            }
+            case 'strong': {
+                var children = flatten(node.children.map(function (child) { return phrashingMark(child, __spreadArray(__spreadArray([], marks), ['bold'])); }));
+                children.forEach(function (child) {
+                    accum.push(child);
+                });
+                break;
+            }
+            case 'image': {
+                accum.push(image(node));
+                break;
+            }
+            case 'link': {
+                var children = flatten(node.children.map(function (child) { return phrashingMark(child, marks); }));
+                accum.push({ type: 'a', url: node.url, title: node.title, children: children });
+                break;
+            }
+            case 'text':
+                var markProps_2 = {};
+                marks.forEach(function (mark) { return (markProps_2[mark] = true); });
+                accum.push(__assign({ type: 'text', text: node.value }, markProps_2));
+                break;
+            default:
+                throw new Error("Unexpected inline element of type " + node.type);
+        }
+        return accum;
+    };
+    var image = function (content) {
+        return {
+            type: 'img',
+            url: imageCallback(content.url),
+            alt: content.alt,
+            caption: content.title,
+            children: [{ type: 'text', text: '' }]
+        };
+    };
+    var text = function (content) {
+        return {
+            type: 'text',
+            text: content.value
+        };
+    };
+    var blockquote = function (content) {
+        var children = [];
+        content.children.map(function (child) {
+            var inlineElements = unwrapBlockContent(child);
+            inlineElements.forEach(function (child) {
+                children.push(child);
+            });
+        });
+        return {
+            type: 'blockquote',
+            children: children
+        };
+    };
+    var paragraph = function (content) {
+        var children = flatten(content.children.map(phrasingContent));
+        // MDX treats <div>Hello</div> is inline even if it's isolated on one line
+        // If that's the case, swap it out with html
+        // TODO: probably need to do the same with JSX
+        if (children.length === 1) {
+            if (children[0]) {
+                if (children[0].type === 'html_inline') {
+                    return __assign(__assign({}, children[0]), { type: 'html' });
+                }
+            }
+        }
+        return {
+            type: 'p',
+            children: children
+        };
+    };
+    return {
+        type: 'root',
+        children: root.children.map(function (child) {
+            // @ts-ignore child from MDX elements aren't shared with MDAST types
+            return content(child);
+        })
+    };
+};
+var RichTextParseError = /** @class */ (function (_super) {
+    __extends(RichTextParseError, _super);
+    function RichTextParseError(message, position) {
+        var _this = 
+        // Pass remaining arguments (including vendor specific ones) to parent constructor
+        _super.call(this, message) || this;
+        // Maintains proper stack trace for where our error was thrown (only available on V8)
+        if (Error.captureStackTrace) {
+            Error.captureStackTrace(_this, RichTextParseError);
+        }
+        _this.name = 'RichTextParseError';
+        // Custom debugging information
+        _this.position = position;
+        return _this;
+    }
+    return RichTextParseError;
+}(Error));
+export { RichTextParseError };

package/dist/stringify/acorn.d.ts

@@ -1,12 +1,17 @@
 import type { RichTypeInner } from '@tinacms/schema-tools';
 import type { MdxJsxAttribute } from 'mdast-util-mdx-jsx';
-import type * as Plate from '../parse/plate';
+import * as Plate from '../parse/plate';
 import type * as Md from 'mdast';
 export declare const stringifyPropsInline: (element: Plate.MdxInlineElement, field: RichTypeInner, imageCallback: (url: string) => string) => {
     attributes: MdxJsxAttribute[];
     children: Md.PhrasingContent[];
 };
-export declare const stringifyProps: (element: Plate.MdxBlockElement, parentField: RichTypeInner, flatten: boolean, imageCallback: (url: string) => string) => {
+export declare function stringifyProps(element: Plate.MdxInlineElement, parentField: RichTypeInner, flatten: boolean, imageCallback: (url: string) => string): {
+    attributes: MdxJsxAttribute[];
+    children: Md.PhrasingContent[];
+};
+export declare function stringifyProps(element: Plate.MdxBlockElement, parentField: RichTypeInner, flatten: boolean, imageCallback: (url: string) => string): {
     attributes: MdxJsxAttribute[];
     children: Md.BlockContent[];
 };
+export declare function assertShape<T extends unknown>(value: unknown, callback: (item: any) => boolean, errorMessage?: string): asserts value is T;

package/dist/stringify/acorn.js

@@ -0,0 +1,241 @@
+/**
+
+Copyright 2021 Forestry.io Holdings, Inc.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+*/
+import { format } from 'prettier';
+import { rootElement, stringifyMDX } from '.';
+export var stringifyPropsInline = function (element, field, imageCallback) {
+    return stringifyProps(element, field, true, imageCallback);
+};
+export function stringifyProps(element, parentField, flatten, imageCallback) {
+    var _a;
+    var attributes = [];
+    var children = [];
+    var template = (_a = parentField.templates) === null || _a === void 0 ? void 0 : _a.find(function (template) {
+        if (typeof template === 'string') {
+            throw new Error('Global templates not supported');
+        }
+        return template.name === element.name;
+    });
+    if (!template || typeof template === 'string') {
+        throw new Error("Unable to find template for JSX element " + element.name);
+    }
+    Object.entries(element.props).forEach(function (_a) {
+        var name = _a[0], value = _a[1];
+        var field = template.fields.find(function (field) { return field.name === name; });
+        if (!field) {
+            if (name === 'children') {
+                return;
+            }
+            throw new Error("No field definition found for property " + name);
+        }
+        switch (field.type) {
+            case 'reference':
+                if (field.list) {
+                    if (Array.isArray(value)) {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: {
+                                type: 'mdxJsxAttributeValueExpression',
+                                value: "[" + value.map(function (item) { return "\"" + item + "\""; }).join(', ') + "]"
+                            }
+                        });
+                    }
+                }
+                else {
+                    if (typeof value === 'string') {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: value
+                        });
+                    }
+                }
+                break;
+            case 'datetime':
+            case 'string':
+                if (field.list) {
+                    if (Array.isArray(value)) {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: {
+                                type: 'mdxJsxAttributeValueExpression',
+                                value: "[" + value.map(function (item) { return "\"" + item + "\""; }).join(', ') + "]"
+                            }
+                        });
+                    }
+                }
+                else {
+                    if (typeof value === 'string') {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: value
+                        });
+                    }
+                    else {
+                        throw new Error("Expected string for attribute on field " + field.name);
+                    }
+                }
+                break;
+            case 'image':
+                if (field.list) {
+                    if (Array.isArray(value)) {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: {
+                                type: 'mdxJsxAttributeValueExpression',
+                                value: "[" + value
+                                    .map(function (item) { return "\"" + imageCallback(item) + "\""; })
+                                    .join(', ') + "]"
+                            }
+                        });
+                    }
+                }
+                else {
+                    attributes.push({
+                        type: 'mdxJsxAttribute',
+                        name: name,
+                        value: imageCallback(String(value))
+                    });
+                }
+                break;
+            case 'number':
+            case 'boolean':
+                if (field.list) {
+                    if (Array.isArray(value)) {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: {
+                                type: 'mdxJsxAttributeValueExpression',
+                                value: "[" + value.map(function (item) { return "" + item; }).join(', ') + "]"
+                            }
+                        });
+                    }
+                }
+                else {
+                    attributes.push({
+                        type: 'mdxJsxAttribute',
+                        name: name,
+                        value: {
+                            type: 'mdxJsxAttributeValueExpression',
+                            value: String(value)
+                        }
+                    });
+                }
+                break;
+            case 'object':
+                attributes.push({
+                    type: 'mdxJsxAttribute',
+                    name: name,
+                    value: {
+                        type: 'mdxJsxAttributeValueExpression',
+                        value: stringifyObj(value, flatten)
+                    }
+                });
+                break;
+            case 'rich-text':
+                if (typeof value === 'string') {
+                    throw new Error("Unexpected string for rich-text, ensure the value has been properly parsed");
+                }
+                if (field.list) {
+                    throw new Error("Rich-text list is not supported");
+                }
+                else {
+                    var joiner = flatten ? ' ' : '\n';
+                    var val = '';
+                    assertShape(value, function (value) { return value.type === 'root' && Array.isArray(value.children); }, "Nested rich-text element is not a valid shape for field " + field.name);
+                    if (field.name === 'children') {
+                        var root = rootElement(value, field, imageCallback);
+                        root.children.forEach(function (child) {
+                            children.push(child);
+                        });
+                        return;
+                    }
+                    else {
+                        var stringValue = stringifyMDX(value, field, imageCallback);
+                        val = stringValue
+                            .trim()
+                            .split('\n')
+                            .map(function (str) { return "  " + str.trim(); })
+                            .join(joiner);
+                    }
+                    if (flatten) {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: {
+                                type: 'mdxJsxAttributeValueExpression',
+                                value: "<>" + val.trim() + "</>"
+                            }
+                        });
+                    }
+                    else {
+                        attributes.push({
+                            type: 'mdxJsxAttribute',
+                            name: name,
+                            value: {
+                                type: 'mdxJsxAttributeValueExpression',
+                                value: "<>\n" + val + "\n</>"
+                            }
+                        });
+                    }
+                }
+                break;
+            default:
+                // @ts-expect-error error type is never
+                throw new Error("Stringify props: " + field.type + " not yet supported");
+        }
+    });
+    if (template.match) {
+        if (attributes[0] && typeof attributes[0].value === 'string') {
+            return {
+                attributes: [],
+                children: [{ type: 'inlineCode', value: attributes[0].value }]
+            };
+        }
+    }
+    return { attributes: attributes, children: children };
+}
+/**
+ * Use prettier to determine how to format potentially large objects as strings
+ */
+function stringifyObj(obj, flatten) {
+    if (typeof obj === 'object' && obj !== null) {
+        var dummyFunc = "const dummyFunc = ";
+        var res = format("" + dummyFunc + JSON.stringify(obj), {
+            parser: 'acorn',
+            trailingComma: 'none',
+            semi: false
+        })
+            .trim()
+            .replace(dummyFunc, '');
+        return flatten ? res.replaceAll('\n', '').replaceAll('  ', ' ') : res;
+    }
+    else {
+        console.log(obj);
+        throw new Error("stringifyObj must be passed an object or an array of objects, received " + typeof obj);
+    }
+}
+export function assertShape(value, callback, errorMessage) {
+    if (!callback(value)) {
+        throw new Error(errorMessage || "Failed to assert shape");
+    }
+}

package/dist/stringify/index.d.ts

@@ -15,9 +15,24 @@ See the License for the specific language governing permissions and
 limitations under the License.
 
 */
+import { MdxJsxTextElement, MdxJsxFlowElement } from 'mdast-util-mdx-jsx';
 import type { RichTypeInner } from '@tinacms/schema-tools';
 import type * as Md from 'mdast';
 import type * as Plate from '../parse/plate';
+declare module 'mdast' {
+    interface StaticPhrasingContentMap {
+        mdxJsxTextElement: MdxJsxTextElement;
+    }
+    interface PhrasingContentMap {
+        mdxJsxTextElement: MdxJsxTextElement;
+    }
+    interface BlockContentMap {
+        mdxJsxFlowElement: MdxJsxFlowElement;
+    }
+    interface ContentMap {
+        mdxJsxFlowElement: MdxJsxFlowElement;
+    }
+}
 export declare const stringifyMDX: (value: Plate.RootElement, field: RichTypeInner, imageCallback: (url: string) => string) => string;
 export declare const rootElement: (content: Plate.RootElement, field: RichTypeInner, imageCallback: (url: string) => string) => Md.Root;
 export declare const blockElement: (content: Plate.BlockElement, field: RichTypeInner, imageCallback: (url: string) => string) => Md.Content | null;