@ember-eui/core 8.0.44 → 8.0.45

package/dist/components/eui-markdown-editor.js

@@ -21,7 +21,7 @@ import { argOrDefaultDecorator } from '../helpers/arg-or-default.js';
 import classNames from '../helpers/class-names.js';
 import ResizeObserver from '../modifiers/resize-observer.js';
 import validatableControl from '../modifiers/validatable-control.js';
-import MarkdownActions from '../utils/markdown/markdown-actions.js';
+import MarkdownActions, { insertText } from '../utils/markdown/markdown-actions.js';
 import { MODE_EDITING, MODE_VIEWING } from '../utils/markdown/markdown-modes.js';
 import { defaultParsingPlugins } from '../utils/markdown/plugins/markdown-default-plugins/parsing-plugins.js';
 import { defaultProcessingPlugins } from '../utils/markdown/plugins/markdown-default-plugins/processing-plugins.js';
@@ -32,8 +32,9 @@ import EuiMarkdownEditorDropZone from './eui-markdown-editor-drop-zone.js';
 import EuiMarkdownEditorTextArea from './eui-markdown-editor-text-area.js';
 import EuiMarkdownEditorToolbarComponent from './eui-markdown-editor-toolbar.js';
 import EuiMarkdownEditorToolbarComponent$1 from './eui-markdown-format.js';
+import EuiModal from './eui-modal.js';
 
-var _dec, _dec2, _dec3, _dec4, _dec5, _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _descriptor10, _descriptor11, _descriptor12, _descriptor13, _descriptor14;
+var _dec, _dec2, _dec3, _dec4, _dec5, _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _descriptor10, _descriptor11, _descriptor12, _descriptor13, _descriptor14, _descriptor15;
 let cached = macroCondition(dependencySatisfies('ember-source', '>= 4.1.0-alpha.0')) ? importSync('@glimmer/tracking').cached : importSync('ember-cached-decorator-polyfill').cached;
 const getCursorNode = (textareaRef, parsed) => {
   const {
@@ -70,6 +71,23 @@ const getCursorNodeModifier = modifier(function getCursorNodeModifier(textarea,
     textarea.removeEventListener('mouseup', fn);
   };
 });
+function isNewLine(char) {
+  if (char == null) return true;
+  return !!char.match(/[\r\n]/);
+}
+function padWithNewlinesIfNeeded(textarea, text) {
+  const selectionStart = textarea.selectionStart;
+  const selectionEnd = textarea.selectionEnd;
+
+  // block parsing requires two leading new lines and none trailing, but we add an extra trailing line for readability
+  const isPrevNewLine = isNewLine(textarea.value[selectionStart - 1]);
+  const isPrevPrevNewLine = isNewLine(textarea.value[selectionStart - 2]);
+  const isNextNewLine = isNewLine(textarea.value[selectionEnd]);
+
+  // pad text with newlines as needed
+  text = `${isPrevNewLine ? '' : '\n'}${isPrevPrevNewLine ? '' : '\n'}${text}${isNextNewLine ? '' : '\n'}`;
+  return text;
+}
 let EuiMarkdownEditorComponent = setComponentTemplate(precompileTemplate(`
     <div
       class={{classNames
@@ -89,6 +107,7 @@ let EuiMarkdownEditorComponent = setComponentTemplate(precompileTemplate(`
         @selectedNode={{this.selectedNode}}
         @markdownActions={{this.markdownActions}}
         @onClickPreview={{this.setViewMode}}
+        @openPluginEditor={{this.openPluginEditor}}
         @viewMode={{this.viewMode}}
         @uiPlugins={{this.toolbarPlugins}}
         {{didInsert this.setEditorToolbarRef}}
@@ -133,6 +152,17 @@ let EuiMarkdownEditorComponent = setComponentTemplate(precompileTemplate(`
             ...attributes
           />
         </EuiMarkdownEditorDropZone>
+        {{#if this.pluginEditorPlugin.editor}}
+          <EuiModal @onClose={{set this "pluginEditorPlugin" undefined}}>
+            {{#let (component this.pluginEditorPlugin.editor) as |Editor|}}
+              <Editor
+                @node={{this.selectedNode}}
+                @onCancel={{set this "pluginEditorPlugin" undefined}}
+                @onSave={{this.onEditorPluginSave}}
+              />
+            {{/let}}
+          </EuiModal>
+        {{/if}}
       </div>
     </div>
   `, {
@@ -153,7 +183,8 @@ let EuiMarkdownEditorComponent = setComponentTemplate(precompileTemplate(`
     getCursorNodeModifier,
     on,
     pick,
-    validatableControl
+    validatableControl,
+    EuiModal
   })
 }), (_dec = argOrDefaultDecorator(defaultParsingPlugins), _dec2 = argOrDefaultDecorator(250), _dec3 = argOrDefaultDecorator(500), _dec4 = argOrDefaultDecorator(true), _dec5 = argOrDefaultDecorator(defaultProcessingPlugins), (_class = class EuiMarkdownEditorComponent extends Component {
   get toolbarPlugins() {
@@ -161,25 +192,58 @@ let EuiMarkdownEditorComponent = setComponentTemplate(precompileTemplate(`
   }
   constructor(owner, args) {
     super(owner, args);
+    _initializerDefineProperty(this, "pluginEditorPlugin", _descriptor, this);
     // Defaults
-    _initializerDefineProperty(this, "parsingPluginList", _descriptor, this);
-    _initializerDefineProperty(this, "height", _descriptor2, this);
-    _initializerDefineProperty(this, "maxHeight", _descriptor3, this);
-    _initializerDefineProperty(this, "autoExpandPreview", _descriptor4, this);
-    _initializerDefineProperty(this, "processingPluginList", _descriptor5, this);
-    _initializerDefineProperty(this, "selectedNode", _descriptor6, this);
-    _initializerDefineProperty(this, "editorId", _descriptor7, this);
-    _initializerDefineProperty(this, "viewMode", _descriptor8, this);
-    _initializerDefineProperty(this, "textareaRef", _descriptor9, this);
-    _initializerDefineProperty(this, "previewRef", _descriptor10, this);
-    _initializerDefineProperty(this, "editorToolbarRef", _descriptor11, this);
-    _initializerDefineProperty(this, "currentHeight", _descriptor12, this);
-    _initializerDefineProperty(this, "editorFooterHeight", _descriptor13, this);
-    _initializerDefineProperty(this, "editorToolbarHeight", _descriptor14, this);
+    _initializerDefineProperty(this, "parsingPluginList", _descriptor2, this);
+    _initializerDefineProperty(this, "height", _descriptor3, this);
+    _initializerDefineProperty(this, "maxHeight", _descriptor4, this);
+    _initializerDefineProperty(this, "autoExpandPreview", _descriptor5, this);
+    _initializerDefineProperty(this, "processingPluginList", _descriptor6, this);
+    _initializerDefineProperty(this, "selectedNode", _descriptor7, this);
+    _initializerDefineProperty(this, "editorId", _descriptor8, this);
+    _initializerDefineProperty(this, "viewMode", _descriptor9, this);
+    _initializerDefineProperty(this, "textareaRef", _descriptor10, this);
+    _initializerDefineProperty(this, "previewRef", _descriptor11, this);
+    _initializerDefineProperty(this, "editorToolbarRef", _descriptor12, this);
+    _initializerDefineProperty(this, "currentHeight", _descriptor13, this);
+    _initializerDefineProperty(this, "editorFooterHeight", _descriptor14, this);
+    _initializerDefineProperty(this, "editorToolbarHeight", _descriptor15, this);
     _defineProperty(this, "markdownActions", void 0);
-    this.markdownActions = new MarkdownActions(this.editorId,
-    // @ts-expect-error
-    this.toolbarPlugins);
+    _defineProperty(this, "getCursorNode", () => {});
+    _defineProperty(this, "openPluginEditor", plugin => {
+      this.pluginEditorPlugin = plugin;
+    });
+    _defineProperty(this, "onEditorPluginSave", (markdown, config) => {
+      let {
+        selectedNode,
+        textareaRef
+      } = this;
+      if (this.pluginEditorPlugin && selectedNode &&
+      // @ts-expect-error
+      selectedNode.type === this.pluginEditorPlugin.name &&
+      // @ts-expect-error
+      selectedNode.position) {
+        // modifying an existing node
+        textareaRef.setSelectionRange(
+        // @ts-expect-error
+        selectedNode.position.start.offset,
+        // @ts-expect-error
+        selectedNode.position.end.offset);
+      } else {
+        // creating a new node
+        if (config.block) {
+          // inject newlines if needed
+          markdown = padWithNewlinesIfNeeded(textareaRef, markdown);
+        }
+      }
+      insertText(textareaRef, {
+        text: markdown,
+        selectionStart: undefined,
+        selectionEnd: undefined
+      });
+      this.pluginEditorPlugin = undefined;
+    });
+    this.markdownActions = new MarkdownActions(this.editorId, this.toolbarPlugins);
     this.currentHeight = this.height;
   }
   get previewHeight() {
@@ -294,88 +358,93 @@ let EuiMarkdownEditorComponent = setComponentTemplate(precompileTemplate(`
   setSelectedNode(node) {
     this.selectedNode = node;
   }
-}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "parsingPluginList", [_dec], {
+}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "pluginEditorPlugin", [tracked], {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  initializer: null
+}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "parsingPluginList", [_dec], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: null
-}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "height", [_dec2], {
+}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "height", [_dec2], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: null
-}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "maxHeight", [_dec3], {
+}), _descriptor4 = _applyDecoratedDescriptor(_class.prototype, "maxHeight", [_dec3], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: null
-}), _descriptor4 = _applyDecoratedDescriptor(_class.prototype, "autoExpandPreview", [_dec4], {
+}), _descriptor5 = _applyDecoratedDescriptor(_class.prototype, "autoExpandPreview", [_dec4], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: null
-}), _descriptor5 = _applyDecoratedDescriptor(_class.prototype, "processingPluginList", [_dec5], {
+}), _descriptor6 = _applyDecoratedDescriptor(_class.prototype, "processingPluginList", [_dec5], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: null
-}), _descriptor6 = _applyDecoratedDescriptor(_class.prototype, "selectedNode", [tracked], {
+}), _descriptor7 = _applyDecoratedDescriptor(_class.prototype, "selectedNode", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return null;
   }
-}), _descriptor7 = _applyDecoratedDescriptor(_class.prototype, "editorId", [tracked], {
+}), _descriptor8 = _applyDecoratedDescriptor(_class.prototype, "editorId", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return this.args.editorId ?? guidFor({});
   }
-}), _descriptor8 = _applyDecoratedDescriptor(_class.prototype, "viewMode", [tracked], {
+}), _descriptor9 = _applyDecoratedDescriptor(_class.prototype, "viewMode", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return this.args.initialViewMode || MODE_EDITING;
   }
-}), _descriptor9 = _applyDecoratedDescriptor(_class.prototype, "textareaRef", [tracked], {
+}), _descriptor10 = _applyDecoratedDescriptor(_class.prototype, "textareaRef", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return null;
   }
-}), _descriptor10 = _applyDecoratedDescriptor(_class.prototype, "previewRef", [tracked], {
+}), _descriptor11 = _applyDecoratedDescriptor(_class.prototype, "previewRef", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return null;
   }
-}), _descriptor11 = _applyDecoratedDescriptor(_class.prototype, "editorToolbarRef", [tracked], {
+}), _descriptor12 = _applyDecoratedDescriptor(_class.prototype, "editorToolbarRef", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return null;
   }
-}), _descriptor12 = _applyDecoratedDescriptor(_class.prototype, "currentHeight", [tracked], {
+}), _descriptor13 = _applyDecoratedDescriptor(_class.prototype, "currentHeight", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return 250;
   }
-}), _descriptor13 = _applyDecoratedDescriptor(_class.prototype, "editorFooterHeight", [tracked], {
+}), _descriptor14 = _applyDecoratedDescriptor(_class.prototype, "editorFooterHeight", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function () {
     return 0;
   }
-}), _descriptor14 = _applyDecoratedDescriptor(_class.prototype, "editorToolbarHeight", [tracked], {
+}), _descriptor15 = _applyDecoratedDescriptor(_class.prototype, "editorToolbarHeight", [tracked], {
   configurable: true,
   enumerable: true,
   writable: true,