react-headless-mde 0.0.7 → 1.0.0

package/.github/workflows/npm-publish-next.yml

@@ -0,0 +1,26 @@
+# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
+# For more information see: https://docs.github.com/ru/actions/quickstart
+
+name: Publish with @next
+
+on:
+  push:
+    branches:
+      - 'develop'
+#  release:
+#    types: [created]
+
+jobs:
+  build-and-publish:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          registry-url: 'https://registry.npmjs.org'
+      - run: npm install
+      - run: npm run build
+      - run: npm publish --tag next
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/.github/workflows/npm-publish.yml

@@ -1,11 +1,14 @@
 # This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
-# For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
+# For more information see: https://docs.github.com/ru/actions/quickstart
 
-name: Publish to NPM
+name: Publish
 
 on:
-  release:
-    types: [created]
+  push:
+    branches:
+      - 'main'
+#  release:
+#    types: [created]
 
 jobs:
   build-and-publish:
@@ -14,11 +17,10 @@ jobs:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 18
           registry-url: 'https://registry.npmjs.org'
-      - run: yarn install
-      - run: yarn build
+      - run: npm install
+      - run: npm run build
       - run: npm publish
-#      - run: npm publish --tag next
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/{readme.md → README.md}

@@ -45,6 +45,9 @@ export const MarkdownEditor = () => {
 ```
 ## Todo
 
+### Add to awesome-react-headless-components on stable version
+https://github.com/jxom/awesome-react-headless-components
+
 ### Third party
 - https://github.com/grassator/insert-text-at-cursor by https://twitter.com/d_kubyshkin
 

package/dist/cjs/index.js

@@ -11,7 +11,7 @@ var react = require('react');
 function getSurroundingWord(text, position) {
     if (!text)
         throw Error("Argument 'text' should be truthy");
-    var isWordDelimiter = function (c) { return c === " " || c.charCodeAt(0) === 10; };
+    var isWordDelimiter = function (c) { return c === ' ' || c.charCodeAt(0) === 10; };
     // leftIndex is initialized to 0 because if selection is 0, it won't even enter the iteration
     var start = 0;
     // rightIndex is initialized to text.length because if selection is equal to text.length it won't even enter the interation
@@ -51,7 +51,7 @@ function selectWord(_a) {
  *  to make sure there's an empty line between 'startPosition' and the previous text
  */
 function getBreaksNeededForEmptyLineBefore(text, startPosition) {
-    if (text === void 0) { text = ""; }
+    if (text === void 0) { text = ''; }
     if (startPosition === 0)
         return 0;
     // rules:
@@ -79,7 +79,7 @@ function getBreaksNeededForEmptyLineBefore(text, startPosition) {
  *  to make sure there's an empty line between 'startPosition' and the next text
  */
 function getBreaksNeededForEmptyLineAfter(text, startPosition) {
-    if (text === void 0) { text = ""; }
+    if (text === void 0) { text = ''; }
     if (startPosition === text.length - 1)
         return 0;
     // rules:
@@ -120,18 +120,18 @@ function insertBeforeEachLine(selectedText, insertBefore) {
     var insertionLength = 0;
     var modifiedText = lines
         .map(function (item, index) {
-        if (typeof insertBefore === "string") {
+        if (typeof insertBefore === 'string') {
             insertionLength += insertBefore.length;
             return insertBefore + item;
         }
-        else if (typeof insertBefore === "function") {
+        else if (typeof insertBefore === 'function') {
             var insertionResult = insertBefore(item, index);
             insertionLength += insertionResult.length;
             return insertBefore(item, index) + item;
         }
-        throw Error("insertion is expected to be either a string or a function");
+        throw Error('insertion is expected to be either a string or a function');
     })
-        .join("\n");
+        .join('\n');
     return { modifiedText: modifiedText, insertionLength: insertionLength };
 }
 
@@ -151,7 +151,7 @@ function setHeader(initialState, api, prefix) {
     // Adjust the selection to encompass the whole word if the caret is inside one
     var newSelectionRange = selectWord({
         text: initialState.text,
-        selection: initialState.selection
+        selection: initialState.selection,
     });
     var state1 = api.setSelectionRange(newSelectionRange);
     // Add the prefix to the selection
@@ -159,7 +159,7 @@ function setHeader(initialState, api, prefix) {
     // Adjust the selection to not contain the prefix
     api.setSelectionRange({
         start: state2.selection.end - getSelectedText(state1).length,
-        end: state2.selection.end
+        end: state2.selection.end,
     });
 }
 
@@ -171,21 +171,21 @@ var headerHelpers = /*#__PURE__*/Object.freeze({
 var headingLevel1Command = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
-        setHeader(initialState, textApi, "# ");
-    }
+        setHeader(initialState, textApi, '# ');
+    },
 };
 
 var boldCommand = {
     shouldUndo: function (options) {
-        return (getCharactersBeforeSelection(options.initialState, 2) === "**" &&
-            getCharactersAfterSelection(options.initialState, 2) === "**");
+        return (getCharactersBeforeSelection(options.initialState, 2) === '**' &&
+            getCharactersAfterSelection(options.initialState, 2) === '**');
     },
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
         // Adjust the selection to encompass the whole word if the caret is inside one
         var newSelectionRange = selectWord({
             text: initialState.text,
-            selection: initialState.selection
+            selection: initialState.selection,
         });
         var state1 = textApi.setSelectionRange(newSelectionRange);
         // Replaces the current selection with the bold mark up
@@ -193,7 +193,7 @@ var boldCommand = {
         // Adjust the selection to not contain the **
         textApi.setSelectionRange({
             start: state2.selection.end - 2 - getSelectedText(state1).length,
-            end: state2.selection.end - 2
+            end: state2.selection.end - 2,
         });
     },
     undo: function (_a) {
@@ -201,27 +201,27 @@ var boldCommand = {
         var text = getSelectedText(initialState);
         textApi.setSelectionRange({
             start: initialState.selection.start - 2,
-            end: initialState.selection.end + 2
+            end: initialState.selection.end + 2,
         });
         textApi.replaceSelection(text);
         textApi.setSelectionRange({
             start: initialState.selection.start - 2,
-            end: initialState.selection.end - 2
+            end: initialState.selection.end - 2,
         });
-    }
+    },
 };
 
 var italicCommand = {
     shouldUndo: function (options) {
-        return (getCharactersBeforeSelection(options.initialState, 1) === "*" &&
-            getCharactersAfterSelection(options.initialState, 1) === "*");
+        return (getCharactersBeforeSelection(options.initialState, 1) === '*' &&
+            getCharactersAfterSelection(options.initialState, 1) === '*');
     },
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
         // Adjust the selection to encompass the whole word if the caret is inside one
         var newSelectionRange = selectWord({
             text: initialState.text,
-            selection: initialState.selection
+            selection: initialState.selection,
         });
         var state1 = textApi.setSelectionRange(newSelectionRange);
         // Replaces the current selection with the italic mark up
@@ -229,7 +229,7 @@ var italicCommand = {
         // Adjust the selection to not contain the *
         textApi.setSelectionRange({
             start: state2.selection.end - 1 - getSelectedText(state1).length,
-            end: state2.selection.end - 1
+            end: state2.selection.end - 1,
         });
     },
     undo: function (_a) {
@@ -237,14 +237,14 @@ var italicCommand = {
         var text = getSelectedText(initialState);
         textApi.setSelectionRange({
             start: initialState.selection.start - 1,
-            end: initialState.selection.end + 1
+            end: initialState.selection.end + 1,
         });
         textApi.replaceSelection(text);
         textApi.setSelectionRange({
             start: initialState.selection.start - 1,
-            end: initialState.selection.end - 1
+            end: initialState.selection.end - 1,
         });
-    }
+    },
 };
 
 var strikethroughCommand = {
@@ -253,7 +253,7 @@ var strikethroughCommand = {
         // Adjust the selection to encompass the whole word if the caret is inside one
         var newSelectionRange = selectWord({
             text: initialState.text,
-            selection: initialState.selection
+            selection: initialState.selection,
         });
         var state1 = textApi.setSelectionRange(newSelectionRange);
         // Replaces the current selection with the strikethrough mark up
@@ -261,9 +261,9 @@ var strikethroughCommand = {
         // Adjust the selection to not contain the ~~
         textApi.setSelectionRange({
             start: state2.selection.end - 2 - getSelectedText(state1).length,
-            end: state2.selection.end - 2
+            end: state2.selection.end - 2,
         });
-    }
+    },
 };
 
 var linkCommand = {
@@ -272,7 +272,7 @@ var linkCommand = {
         // Adjust the selection to encompass the whole word if the caret is inside one
         var newSelectionRange = selectWord({
             text: initialState.text,
-            selection: initialState.selection
+            selection: initialState.selection,
         });
         var state1 = textApi.setSelectionRange(newSelectionRange);
         // Replaces the current selection with the bold mark up
@@ -280,9 +280,9 @@ var linkCommand = {
         // Adjust the selection to not contain the **
         textApi.setSelectionRange({
             start: state2.selection.end - 6 - getSelectedText(state1).length,
-            end: state2.selection.end - 6
+            end: state2.selection.end - 6,
         });
-    }
+    },
 };
 
 var quoteCommand = {
@@ -291,22 +291,22 @@ var quoteCommand = {
         // Adjust the selection to encompass the whole word if the caret is inside one
         var newSelectionRange = selectWord({
             text: initialState.text,
-            selection: initialState.selection
+            selection: initialState.selection,
         });
         var state1 = textApi.setSelectionRange(newSelectionRange);
         var breaksBeforeCount = getBreaksNeededForEmptyLineBefore(state1.text, state1.selection.start);
-        var breaksBefore = Array(breaksBeforeCount + 1).join("\n");
+        var breaksBefore = Array(breaksBeforeCount + 1).join('\n');
         var breaksAfterCount = getBreaksNeededForEmptyLineAfter(state1.text, state1.selection.end);
-        var breaksAfter = Array(breaksAfterCount + 1).join("\n");
+        var breaksAfter = Array(breaksAfterCount + 1).join('\n');
         // Replaces the current selection with the quote mark up
         textApi.replaceSelection("".concat(breaksBefore, "> ").concat(getSelectedText(state1)).concat(breaksAfter));
         var selectionStart = state1.selection.start + breaksBeforeCount + 2;
         var selectionEnd = selectionStart + getSelectedText(state1).length;
         textApi.setSelectionRange({
             start: selectionStart,
-            end: selectionEnd
+            end: selectionEnd,
         });
-    }
+    },
 };
 
 var imageCommand = {
@@ -315,17 +315,17 @@ var imageCommand = {
         // Replaces the current selection with the whole word selected
         var state1 = textApi.setSelectionRange(selectWord({
             text: initialState.text,
-            selection: initialState.selection
+            selection: initialState.selection,
         }));
         // Replaces the current selection with the image
-        var imageTemplate = getSelectedText(state1) || "https://example.com/your-image.png";
+        var imageTemplate = getSelectedText(state1) || 'https://example.com/your-image.png';
         textApi.replaceSelection("![](".concat(imageTemplate, ")"));
         // Adjust the selection to not contain the **
         textApi.setSelectionRange({
             start: state1.selection.start + 4,
-            end: state1.selection.start + 4 + imageTemplate.length
+            end: state1.selection.start + 4 + imageTemplate.length,
         });
-    }
+    },
 };
 
 /******************************************************************************
@@ -359,7 +359,7 @@ function __generator(thisArg, body) {
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -383,9 +383,7 @@ function __generator(thisArg, body) {
 
 var CommandController = /** @class */ (function () {
     function CommandController(textController, commandMap) {
-        /**
-         * Indicates whether there is a command currently executing
-         */
+        // Indicates whether there is a command currently executing
         this.isExecuting = false;
         this.textController = textController;
         this.commandMap = commandMap;
@@ -399,8 +397,8 @@ var CommandController = /** @class */ (function () {
                     case 0:
                         if (this.isExecuting) {
                             // The simplest thing to do is to ignore commands while
-                            // there is already a command execu
-                            // ting. The alternative would be to queue commands
+                            // there is already a command executing.
+                            // The alternative would be to queue commands
                             // but there is no guarantee that the state after one command executes will still be compatible
                             // with the next one. In fact, it is likely not to be.
                             return [2 /*return*/];
@@ -411,7 +409,7 @@ var CommandController = /** @class */ (function () {
                         }
                         executeOptions = {
                             initialState: this.textController.getState(),
-                            textApi: this.textController
+                            textApi: this.textController,
                         };
                         if (!(((_a = command.shouldUndo) === null || _a === void 0 ? void 0 : _a.call(command, executeOptions)) && (command === null || command === void 0 ? void 0 : command.undo))) return [3 /*break*/, 1];
                         command.undo(executeOptions);
@@ -435,7 +433,7 @@ var TextAreaTextController = /** @class */ (function () {
     TextAreaTextController.prototype.replaceSelection = function (text) {
         var textArea = this.textAreaRef.current;
         if (!textArea) {
-            throw new Error("TextAreaRef is not set");
+            throw new Error('TextAreaRef is not set');
         }
         insertText(textArea, text);
         return getStateFromTextArea(textArea);
@@ -443,7 +441,7 @@ var TextAreaTextController = /** @class */ (function () {
     TextAreaTextController.prototype.setSelectionRange = function (selection) {
         var textArea = this.textAreaRef.current;
         if (!textArea) {
-            throw new Error("TextAreaRef is not set");
+            throw new Error('TextAreaRef is not set');
         }
         textArea.focus();
         textArea.selectionStart = selection.start;
@@ -453,7 +451,7 @@ var TextAreaTextController = /** @class */ (function () {
     TextAreaTextController.prototype.getState = function () {
         var textArea = this.textAreaRef.current;
         if (!textArea) {
-            throw new Error("TextAreaRef is not set");
+            throw new Error('TextAreaRef is not set');
         }
         return getStateFromTextArea(textArea);
     };
@@ -463,9 +461,9 @@ function getStateFromTextArea(textArea) {
     return {
         selection: {
             start: textArea.selectionStart,
-            end: textArea.selectionEnd
+            end: textArea.selectionEnd,
         },
-        text: textArea.value
+        text: textArea.value,
     };
 }
 /**
@@ -489,12 +487,12 @@ function insertText(input, text) {
         return;
     }
     // Webkit + Edge
-    var isSuccess = document.execCommand("insertText", false, text);
+    var isSuccess = document.execCommand('insertText', false, text);
     if (!isSuccess) {
         var start = input.selectionStart || 0;
         var end = input.selectionEnd || 0;
         // Firefox (non-standard method)
-        if (typeof input.setRangeText === "function") {
+        if (typeof input.setRangeText === 'function') {
             input.setRangeText(text);
         }
         else {
@@ -543,8 +541,8 @@ function insertText(input, text) {
         // Correct the cursor position to be at the end of the insertion
         input.setSelectionRange(start + text.length, start + text.length);
         // Notify any possible listeners of the change
-        var e = document.createEvent("UIEvent");
-        e.initEvent("input", true, false);
+        var e = document.createEvent('UIEvent');
+        e.initEvent('input', true, false);
         input.dispatchEvent(e);
     }
 }
@@ -554,13 +552,13 @@ function insertText(input, text) {
  *    Copied from https://github.com/grassator/insert-text-at-cursor
  */
 function canManipulateViaTextNodes(input) {
-    if (input.nodeName !== "TEXTAREA") {
+    if (input.nodeName !== 'TEXTAREA') {
         return false;
     }
     var browserSupportsTextareaTextNodes;
-    if (typeof browserSupportsTextareaTextNodes === "undefined") {
-        var textarea = document.createElement("textarea");
-        textarea.value = "1";
+    if (typeof browserSupportsTextareaTextNodes === 'undefined') {
+        var textarea = document.createElement('textarea');
+        textarea.value = '1';
         browserSupportsTextareaTextNodes = !!textarea.firstChild;
     }
     return browserSupportsTextareaTextNodes;
@@ -570,25 +568,23 @@ function makeList(state0, textController, insertBefore) {
     // Adjust the selection to encompass the whole word if the caret is inside one
     var newSelectionRange = selectWord({
         text: state0.text,
-        selection: state0.selection
+        selection: state0.selection,
     });
     var state1 = textController.setSelectionRange(newSelectionRange);
     var breaksBeforeCount = getBreaksNeededForEmptyLineBefore(state1.text, state1.selection.start);
-    var breaksBefore = Array(breaksBeforeCount + 1).join("\n");
+    var breaksBefore = Array(breaksBeforeCount + 1).join('\n');
     var breaksAfterCount = getBreaksNeededForEmptyLineAfter(state1.text, state1.selection.end);
-    var breaksAfter = Array(breaksAfterCount + 1).join("\n");
+    var breaksAfter = Array(breaksAfterCount + 1).join('\n');
     var modifiedText = insertBeforeEachLine(getSelectedText(state1), insertBefore);
     textController.replaceSelection("".concat(breaksBefore).concat(modifiedText.modifiedText).concat(breaksAfter));
     // Specifically when the text has only one line, we can exclude the "- ", for example, from the selection
-    var oneLinerOffset = getSelectedText(state1).indexOf("\n") === -1
-        ? modifiedText.insertionLength
-        : 0;
+    var oneLinerOffset = getSelectedText(state1).indexOf('\n') === -1 ? modifiedText.insertionLength : 0;
     var selectionStart = state1.selection.start + breaksBeforeCount + oneLinerOffset;
     var selectionEnd = selectionStart + modifiedText.modifiedText.length - oneLinerOffset;
     // Adjust the selection to not contain the **
     textController.setSelectionRange({
         start: selectionStart,
-        end: selectionEnd
+        end: selectionEnd,
     });
 }
 
@@ -599,15 +595,15 @@ var listHelpers = /*#__PURE__*/Object.freeze({
 
 var codeCommand = {
     shouldUndo: function (options) {
-        return (getCharactersBeforeSelection(options.initialState, 1) === "`" &&
-            getCharactersAfterSelection(options.initialState, 1) === "`");
+        return (getCharactersBeforeSelection(options.initialState, 1) === '`' &&
+            getCharactersAfterSelection(options.initialState, 1) === '`');
     },
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
         // Adjust the selection to encompass the whole word if the caret is inside one
         var newSelectionRange = selectWord({
             text: initialState.text,
-            selection: initialState.selection
+            selection: initialState.selection,
         });
         var state1 = textApi.setSelectionRange(newSelectionRange);
         // Replaces the current selection with the italic mark up
@@ -615,7 +611,7 @@ var codeCommand = {
         // Adjust the selection to not contain the *
         textApi.setSelectionRange({
             start: state2.selection.end - 1 - getSelectedText(state1).length,
-            end: state2.selection.end - 1
+            end: state2.selection.end - 1,
         });
     },
     undo: function (_a) {
@@ -623,14 +619,14 @@ var codeCommand = {
         var text = getSelectedText(initialState);
         textApi.setSelectionRange({
             start: initialState.selection.start - 1,
-            end: initialState.selection.end + 1
+            end: initialState.selection.end + 1,
         });
         textApi.replaceSelection(text);
         textApi.setSelectionRange({
             start: initialState.selection.start - 1,
-            end: initialState.selection.end - 1
+            end: initialState.selection.end - 1,
         });
-    }
+    },
 };
 
 function useTextAreaMarkdownEditor(options) {
@@ -642,7 +638,7 @@ function useTextAreaMarkdownEditor(options) {
     return {
         textController: textController,
         commandController: commandController,
-        ref: textAreaRef
+        ref: textAreaRef,
     };
 }
 
@@ -654,91 +650,91 @@ var codeBlockCommand = {
             return __generator(this, function (_b) {
                 newSelectionRange = selectWord({
                     text: initialState.text,
-                    selection: initialState.selection
+                    selection: initialState.selection,
                 });
                 state1 = textApi.setSelectionRange(newSelectionRange);
                 // when there's no breaking line
-                if (getSelectedText(state1).indexOf("\n") === -1) {
+                if (getSelectedText(state1).indexOf('\n') === -1) {
                     textApi.replaceSelection("`".concat(getSelectedText(state1), "`"));
                     selectionStart_1 = state1.selection.start + 1;
                     selectionEnd_1 = selectionStart_1 + getSelectedText(state1).length;
                     textApi.setSelectionRange({
                         start: selectionStart_1,
-                        end: selectionEnd_1
+                        end: selectionEnd_1,
                     });
                     return [2 /*return*/];
                 }
                 breaksBeforeCount = getBreaksNeededForEmptyLineBefore(state1.text, state1.selection.start);
-                breaksBefore = Array(breaksBeforeCount + 1).join("\n");
+                breaksBefore = Array(breaksBeforeCount + 1).join('\n');
                 breaksAfterCount = getBreaksNeededForEmptyLineAfter(state1.text, state1.selection.end);
-                breaksAfter = Array(breaksAfterCount + 1).join("\n");
+                breaksAfter = Array(breaksAfterCount + 1).join('\n');
                 textApi.replaceSelection("".concat(breaksBefore, "```\n").concat(getSelectedText(state1), "\n```").concat(breaksAfter));
                 selectionStart = state1.selection.start + breaksBeforeCount + 4;
                 selectionEnd = selectionStart + getSelectedText(state1).length;
                 textApi.setSelectionRange({
                     start: selectionStart,
-                    end: selectionEnd
+                    end: selectionEnd,
                 });
                 return [2 /*return*/];
             });
         });
-    }
+    },
 };
 
 var checkedListCommand = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
         makeList(initialState, textApi, function () { return "- [ ] "; });
-    }
+    },
 };
 
 var orderedListCommand = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
         makeList(initialState, textApi, function (item, index) { return "".concat(index + 1, ". "); });
-    }
+    },
 };
 
 var unorderedListCommand = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
-        makeList(initialState, textApi, "- ");
-    }
+        makeList(initialState, textApi, '- ');
+    },
 };
 
 var headingLevel2Command = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
-        setHeader(initialState, textApi, "## ");
-    }
+        setHeader(initialState, textApi, '## ');
+    },
 };
 
 var headingLevel3Command = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
-        setHeader(initialState, textApi, "### ");
-    }
+        setHeader(initialState, textApi, '### ');
+    },
 };
 
 var headingLevel4Command = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
-        setHeader(initialState, textApi, "#### ");
-    }
+        setHeader(initialState, textApi, '#### ');
+    },
 };
 
 var headingLevel5Command = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
-        setHeader(initialState, textApi, "##### ");
-    }
+        setHeader(initialState, textApi, '##### ');
+    },
 };
 
 var headingLevel6Command = {
     execute: function (_a) {
         var initialState = _a.initialState, textApi = _a.textApi;
-        setHeader(initialState, textApi, "###### ");
-    }
+        setHeader(initialState, textApi, '###### ');
+    },
 };
 
 exports.CommandController = CommandController;