@contentful/field-editor-markdown 1.2.1 → 1.3.0

package/dist/cjs/components/MarkdownTextarea/CodeMirrorWrapper.js

@@ -0,0 +1,383 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "create", {
+    enumerable: true,
+    get: function() {
+        return create;
+    }
+});
+const _codemirror = _interop_require_default(require("codemirror"));
+require("codemirror/addon/edit/matchbrackets");
+const _throttle = _interop_require_default(require("lodash/throttle"));
+const _transform = _interop_require_default(require("lodash/transform"));
+const _userAgent = _interop_require_wildcard(require("../../utils/userAgent"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function stripUnit(value) {
+    if (typeof value !== 'string') return value;
+    const cssRegex = /^([+-]?(?:\d+|\d*\.\d+))([a-z]*|%)$/;
+    const matchedValue = value.match(cssRegex);
+    if (!matchedValue) {
+        throw new Error("Couldn't match unit in given string");
+    }
+    return parseFloat(value);
+}
+function create(host, options) {
+    const { direction , fixedHeight , height , readOnly  } = options || {};
+    let initializedWithValue = false;
+    const LF = '\n';
+    const EDITOR_SIZE = {
+        min: height ? stripUnit(height) : 300,
+        max: 500,
+        shift: 50
+    };
+    const cm = (0, _codemirror.default)(host, {
+        direction,
+        readOnly,
+        mode: 'markdown',
+        lineNumbers: false,
+        undoDepth: 200,
+        matchBrackets: true,
+        lineWrapping: true,
+        lineSeparator: null,
+        theme: 'elegant',
+        tabSize: 2,
+        indentWithTabs: false,
+        indentUnit: 2,
+        autoRefresh: true,
+        spellcheck: true,
+        inputStyle: 'contenteditable'
+    });
+    cm.setSize('100%', EDITOR_SIZE.min);
+    if (!fixedHeight) {
+        cm.on('change', (0, _throttle.default)(assureHeight, 150));
+    }
+    cm.setOption('extraKeys', {
+        Tab: function() {
+            replaceSelectedText(getIndentation());
+        },
+        Enter: 'newlineAndIndentContinueMarkdownList',
+        Esc: ()=>{
+            cm.getInputField().blur();
+        }
+    });
+    return {
+        destroy,
+        disable,
+        enable,
+        attachEvent,
+        addKeyShortcuts,
+        setValue,
+        cmd,
+        moveToLineBeginning,
+        moveIfNotEmpty,
+        restoreCursor,
+        moveToLineEnd,
+        usePrimarySelection,
+        focus,
+        select,
+        selectBackwards,
+        selectAll: ()=>cm.execCommand('selectAll'),
+        extendSelectionBy,
+        insertAtCursor,
+        insertAtLineBeginning,
+        wrapSelection,
+        removeFromLineBeginning,
+        removeSelectedText,
+        replaceSelectedText,
+        getCursor,
+        setCursor,
+        getSelection,
+        getLine,
+        isLineEmpty,
+        getSelectedText,
+        getSelectionLength,
+        getCurrentLine,
+        getCurrentLineNumber,
+        getCurrentCharacter,
+        getCurrentLineLength,
+        lineStartsWith,
+        getIndentation,
+        getNl,
+        getValue,
+        getLinesCount,
+        getHistorySize,
+        setReadOnly: (value)=>cm.setOption('readOnly', value),
+        getHistory: ()=>cm.getHistory(),
+        setHistory: (history)=>cm.setHistory(history),
+        setFullsize: ()=>{
+            cm.setSize('100%', '100%');
+            cm.refresh();
+        },
+        refresh: ()=>cm.refresh()
+    };
+    function destroy() {
+        cm.toTextArea();
+    }
+    function disable() {
+        cm.setOption('readOnly', 'nocursor');
+    }
+    function enable() {
+        cm.setOption('readOnly', false);
+    }
+    function assureHeight() {
+        const current = cm.heightAtLine(cm.lastLine(), 'local') + EDITOR_SIZE.shift;
+        let next = current;
+        if (current < EDITOR_SIZE.min) {
+            next = EDITOR_SIZE.min;
+        }
+        if (current > EDITOR_SIZE.max) {
+            next = EDITOR_SIZE.max;
+        }
+        cm.setSize('100%', next);
+    }
+    function attachEvent(name, fn, throttleInterval) {
+        if (throttleInterval) {
+            fn = (0, _throttle.default)(fn, throttleInterval);
+        }
+        cm.on(name, fn);
+    }
+    function addKeyShortcuts(map) {
+        const ctrlKey = _userAgent.getCtrlKey();
+        cm.addKeyMap((0, _transform.default)(map, (acc, value, key)=>{
+            acc[ctrlKey + '-' + key] = value;
+        }, {}));
+    }
+    function setValue(value) {
+        value = value || '';
+        if (getValue() === value) {
+            return;
+        }
+        const line = getCurrentLineNumber();
+        const ch = getCurrentCharacter();
+        cm.setValue(value);
+        restoreCursor(ch, line, true);
+        if (!initializedWithValue) {
+            cm.clearHistory();
+            initializedWithValue = true;
+        }
+    }
+    function cmd(name) {
+        cm.execCommand(name);
+        cm.focus();
+    }
+    function moveToLineBeginning(lineNumber) {
+        cm.setCursor({
+            line: defaultToCurrentLineNumber(lineNumber),
+            ch: 0
+        });
+        cm.focus();
+    }
+    function moveIfNotEmpty() {
+        if (getCurrentLineLength() < 1) {
+            return;
+        }
+        const next = getCurrentLineNumber() + 1;
+        if (cm.lastLine() < next) {
+            moveToLineEnd();
+            insertAtCursor(getNl());
+        }
+        moveToLineBeginning(next);
+    }
+    function restoreCursor(character, lineNumber, noFocus) {
+        cm.setCursor(defaultToCurrentLineNumber(lineNumber), character, {
+            scroll: !noFocus
+        });
+        if (!noFocus) {
+            cm.focus();
+        }
+    }
+    function moveToLineEnd(lineNumber) {
+        cm.setCursor({
+            line: defaultToCurrentLineNumber(lineNumber),
+            ch: getCurrentLineLength()
+        });
+        cm.focus();
+    }
+    function defaultToCurrentLineNumber(lineNumber) {
+        if (lineNumber === 0 || lineNumber !== undefined && lineNumber > 0) {
+            return lineNumber;
+        }
+        return getCurrentLineNumber();
+    }
+    function usePrimarySelection() {
+        cmd('singleSelection');
+    }
+    function focus() {
+        cm.focus();
+    }
+    function select(from, to) {
+        cm.setSelection(from, to);
+        cm.focus();
+    }
+    function selectBackwards(skip, len) {
+        select(getPos(-skip - len), getPos(-skip));
+        function getPos(modifier) {
+            return {
+                line: getCurrentLineNumber(),
+                ch: getCurrentCharacter() + modifier
+            };
+        }
+    }
+    function extendSelectionBy(modifier) {
+        select(getPos('anchor', 0), getPos('head', modifier));
+        function getPos(prop, modifier) {
+            const selection = getSelection();
+            if (!selection) {
+                return {
+                    line: 0,
+                    ch: 0
+                };
+            }
+            return {
+                line: selection[prop].line,
+                ch: selection[prop].ch + modifier
+            };
+        }
+    }
+    function insertAtCursor(text) {
+        cm.replaceRange(text, cm.getCursor());
+        cm.focus();
+    }
+    function insertAtLineBeginning(text) {
+        const initialCh = getCurrentCharacter();
+        moveToLineBeginning();
+        insertAtCursor(text);
+        restoreCursor(initialCh + text.length);
+        cm.focus();
+    }
+    function wrapSelection(wrapper) {
+        const replacement = wrapper + getSelectedText() + wrapper;
+        const selection = getSelection();
+        if (selection) {
+            cm.replaceRange(replacement, selection.anchor, selection?.head);
+            cm.focus();
+        }
+    }
+    function removeFromLineBeginning(charCount) {
+        const lineNumber = getCurrentLineNumber();
+        cm.replaceRange('', {
+            line: lineNumber,
+            ch: 0
+        }, {
+            line: lineNumber,
+            ch: charCount
+        });
+        cm.focus();
+    }
+    function removeSelectedText() {
+        cm.replaceSelection('');
+        cm.focus();
+    }
+    function replaceSelectedText(replacement, select) {
+        cm.replaceSelection(replacement, select);
+        cm.focus();
+    }
+    function getCursor() {
+        return cm.getCursor();
+    }
+    function setCursor(cursor) {
+        cm.setCursor(cursor);
+    }
+    function getSelection() {
+        const selections = cm.listSelections();
+        if (!cm.somethingSelected() || !selections || selections.length < 1) {
+            return null;
+        }
+        return selections[0];
+    }
+    function getLine(lineNumber) {
+        return cm.getLine(lineNumber) || '';
+    }
+    function isLineEmpty(lineNumber) {
+        const n = defaultToCurrentLineNumber(lineNumber);
+        return n > -1 && getLine(n).length < 1 && n < cm.lineCount();
+    }
+    function getLinesCount() {
+        return cm.lineCount();
+    }
+    function getSelectedText() {
+        return getSelection() ? cm.getSelection() : '';
+    }
+    function getSelectionLength() {
+        return getSelectedText().length;
+    }
+    function getCurrentLine() {
+        return getLine(getCurrentLineNumber());
+    }
+    function getCurrentLineNumber() {
+        return cm.getCursor().line;
+    }
+    function getCurrentCharacter() {
+        return cm.getCursor().ch;
+    }
+    function getCurrentLineLength() {
+        return getCurrentLine().length;
+    }
+    function lineStartsWith(text) {
+        return getCurrentLine().startsWith(text);
+    }
+    function getIndentation() {
+        return repeat(' ', cm.getOption('indentUnit') ?? 0);
+    }
+    function getNl(n = 1) {
+        if (n < 1) {
+            return '';
+        }
+        return repeat(LF, n);
+    }
+    function getValue() {
+        return cm.getValue() || '';
+    }
+    function getHistorySize(which) {
+        const history = cm.historySize();
+        return which ? history[which] : history;
+    }
+    function repeat(what, n) {
+        return new Array(n + 1).join(what);
+    }
+}

package/dist/cjs/components/MarkdownTextarea/MarkdownCommands.js

@@ -0,0 +1,233 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "create", {
+    enumerable: true,
+    get: function() {
+        return create;
+    }
+});
+const _max = _interop_require_default(require("lodash/max"));
+const _min = _interop_require_default(require("lodash/min"));
+const _range = _interop_require_default(require("lodash/range"));
+const _times = _interop_require_default(require("lodash/times"));
+const _repeat = _interop_require_default(require("lodash/repeat"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function createPrefixToggleFn(prefix) {
+    return (editor)=>{
+        if (editor.lineStartsWith(prefix)) {
+            editor.removeFromLineBeginning(prefix.length);
+        } else {
+            editor.insertAtLineBeginning(prefix);
+        }
+    };
+}
+function wrapSelection(editor, marker, emptyText) {
+    return ()=>{
+        editor.usePrimarySelection();
+        if (editor.getSelection()) {
+            const selectedText = editor.getSelectedText();
+            if (selectedText.startsWith(marker) && selectedText.endsWith(marker)) {
+                const markerLength = marker.length;
+                const textWithoutMarker = selectedText.slice(markerLength, selectedText.length - markerLength);
+                editor.replaceSelectedText(textWithoutMarker);
+            } else {
+                editor.wrapSelection(marker);
+            }
+        } else {
+            editor.insertAtCursor(marker + emptyText + marker);
+            editor.selectBackwards(marker.length, emptyText.length);
+        }
+    };
+}
+const HEADER_CHAR = '#';
+const quoteToggleFn = createPrefixToggleFn('> ');
+const codeToggleFn = createPrefixToggleFn('    ');
+function create(editor) {
+    return {
+        bold: wrapSelection(editor, '__', 'text in bold'),
+        italic: wrapSelection(editor, '*', 'text in italic'),
+        strike: wrapSelection(editor, '~~', 'striked out'),
+        quote: modifySelection(editor, quoteToggleFn),
+        code: modifySelection(editor, codeToggleFn),
+        link,
+        h1: toggleHeader(editor, 1),
+        h2: toggleHeader(editor, 2),
+        h3: toggleHeader(editor, 3),
+        ul: modifySelection(editor, ulToggleFn, true),
+        ol: modifySelection(editor, olToggleFn, true),
+        undo: function() {
+            editor.cmd('undo');
+        },
+        redo: function() {
+            editor.cmd('redo');
+        },
+        hr,
+        indent,
+        dedent,
+        table
+    };
+    function hr() {
+        editor.moveIfNotEmpty();
+        const nl = editor.getNl();
+        const markup = nl + '---' + nl + nl;
+        editor.insertAtCursor(markup);
+    }
+    function indent() {
+        editor.insertAtLineBeginning(editor.getIndentation());
+    }
+    function dedent() {
+        const indentation = editor.getIndentation();
+        if (editor.lineStartsWith(indentation)) {
+            editor.removeFromLineBeginning(indentation.length);
+        }
+    }
+    function table(config) {
+        const nl = editor.getNl();
+        editor.moveIfNotEmpty();
+        editor.insertAtCursor(nl);
+        const line = editor.getCurrentLineNumber();
+        editor.insertAtCursor(tableTemplate(config.rows, config.cols).join(nl));
+        editor.insertAtCursor(nl + nl);
+        editor.restoreCursor(2, line);
+    }
+    function link(url, text, title) {
+        editor.usePrimarySelection();
+        const linkTitle = title ? ' "' + title + '"' : '';
+        const link = text ? '[' + text + '](' + url + linkTitle + ')' : '<' + url + '>';
+        editor.replaceSelectedText(link, 'around');
+    }
+}
+function modifySelection(editor, toggleFn, isList) {
+    return ()=>{
+        editor.usePrimarySelection();
+        const selection = editor.getSelection();
+        if (selection) {
+            forLineIn(selection, (lineNumber, listNumber)=>{
+                editor.moveToLineBeginning(lineNumber);
+                toggleFn(editor, listNumber);
+            });
+            editor.moveToLineEnd();
+        } else {
+            if (isList && !getListNumber(editor) && !editor.lineStartsWith('- ')) {
+                prepareListWhitespace(editor);
+            }
+            toggleFn(editor);
+        }
+    };
+}
+function forLineIn(selection, cb) {
+    const lines = [
+        selection.anchor.line,
+        selection.head.line
+    ];
+    const maxNumber = (0, _max.default)(lines);
+    const minNumber = (0, _min.default)(lines);
+    const lineRange = (0, _range.default)(minNumber || 0, maxNumber !== undefined ? maxNumber + 1 : undefined);
+    lineRange.forEach((lineNumber, i)=>{
+        cb(lineNumber, i + 1);
+    });
+}
+function prepareListWhitespace(editor) {
+    const line = editor.getCurrentLineNumber();
+    const isCurrentLineEmpty = editor.isLineEmpty(line);
+    const isPrevLineEmpty = line > 0 ? editor.isLineEmpty(line - 1) : false;
+    const isNextLineEmpty = line < editor.getLinesCount() - 1 ? editor.isLineEmpty(line + 1) : true;
+    let linesToInsert = isCurrentLineEmpty ? 2 : 4;
+    if (isPrevLineEmpty) {
+        linesToInsert = linesToInsert - 1;
+    }
+    if (isNextLineEmpty) {
+        linesToInsert = linesToInsert - 1;
+    }
+    editor.moveToLineEnd();
+    editor.insertAtCursor(editor.getNl(linesToInsert));
+    editor.restoreCursor(0, isCurrentLineEmpty ? line : line + 2);
+}
+function getListNumber(editor) {
+    const result = editor.getCurrentLine().match(/^(\d+\. )/);
+    return result ? result[1] : null;
+}
+function ulToggleFn(editor) {
+    if (editor.lineStartsWith('- ')) {
+        editor.removeFromLineBeginning(2);
+    } else {
+        const listNumber = getListNumber(editor);
+        if (listNumber) {
+            editor.removeFromLineBeginning(listNumber.length);
+        }
+        editor.insertAtLineBeginning('- ');
+    }
+}
+function olToggleFn(editor, n) {
+    const listNumber = getListNumber(editor);
+    if (listNumber) {
+        editor.removeFromLineBeginning(listNumber.length);
+    } else {
+        if (editor.lineStartsWith('- ')) {
+            editor.removeFromLineBeginning(2);
+        }
+        editor.insertAtLineBeginning((n || 1) + '. ');
+    }
+}
+function tableTemplate(nrows, ncols) {
+    const cellWidth = new Array(11);
+    const cell = ' ' + cellWidth.join(' ') + ' |';
+    const separatorCell = ' ' + cellWidth.join('-') + ' |';
+    let baseRow = '|';
+    let separatorRow = '|';
+    (0, _times.default)(ncols, ()=>{
+        baseRow += cell;
+        separatorRow += separatorCell;
+    });
+    const bodyRows = (0, _range.default)(nrows).map(()=>baseRow.replace(/\| {5}/g, '| Cell'));
+    const headerRow = baseRow.replace(/\| {7}/g, '| Header');
+    return [
+        headerRow,
+        separatorRow
+    ].concat(bodyRows);
+}
+function toggleHeader(editor, level) {
+    return ()=>{
+        const initialCh = editor.getCurrentCharacter();
+        const currentHeader = selectHeader(editor);
+        const prefix = (0, _repeat.default)(HEADER_CHAR, level);
+        if (!currentHeader) {
+            editor.moveToLineBeginning();
+            editor.insertAtCursor(prefix + ' ');
+            editor.restoreCursor(initialCh + prefix.length + 1);
+            return;
+        }
+        if (editor.getSelectedText() === prefix) {
+            editor.extendSelectionBy(1);
+            const removedCh = editor.getSelectionLength();
+            editor.removeSelectedText();
+            editor.restoreCursor(initialCh - removedCh);
+            return;
+        }
+        const diff = prefix.length - editor.getSelectionLength();
+        editor.replaceSelectedText(prefix);
+        editor.restoreCursor(initialCh + diff);
+    };
+}
+function selectHeader(editor) {
+    const result = editor.getCurrentLine().match(/^( {0,3})(#{1,6}) /);
+    if (!result) {
+        return null;
+    }
+    const indentation = result[1];
+    const header = result[2];
+    editor.select(getPos(0), getPos(header.length));
+    return editor.getSelection();
+    function getPos(modifier) {
+        return {
+            line: editor.getCurrentLineNumber(),
+            ch: indentation.length + modifier
+        };
+    }
+}