@bigbinary/neeto-editor-frontend 2.2.5 → 2.2.7

package/dist/v2/Editor.js

@@ -2,29 +2,32 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import React__default, { memo, useState, useRef, useCallback, useEffect, createElement, forwardRef, useImperativeHandle } from 'react';
-import { DropdownMenu, Input, Button, Spinner, Tooltip, Toastr, Avatar, Typography, Select, Dialog, Checkbox as Checkbox$1, Label } from '@bigbinary/neeto-atoms';
-import { a as useEditorState, E as Extension, N as NodeViewWrapper, b as NodeViewContent, c as Node, R as ReactNodeViewRenderer, m as mergeAttributes, D as DecorationSet, d as Decoration, f as ReactRenderer, e as emojiPickerApi, h as markInputRule, I as InputRule, r as resetFocussedNode, i as highlightFocussedNode, ap as isInTable, aq as selectedRect, ar as findTable, as as TableMap, at as addRow, P as PasteRule, B as BubbleMenu, j as getMarkType, k as getMarkRange, l as useEditor, n as EditorContent, o as EditorView } from '../chunk-B5LsYrmv.js';
+import React__default, { memo, useState, Suspense, lazy, useRef, useCallback, useEffect, createElement, forwardRef, useImperativeHandle } from 'react';
+import { a as useEditorState, N as NodeViewWrapper, c as Node, R as ReactNodeViewRenderer, E as Extension, b as NodeViewContent, m as mergeAttributes, D as DecorationSet, d as Decoration, f as ReactRenderer, e as emojiPickerApi, h as markInputRule, I as InputRule, r as resetFocussedNode, i as highlightFocussedNode, ap as isInTable, aq as selectedRect, ar as findTable, as as TableMap, at as addRow, P as PasteRule, B as BubbleMenu, j as getMarkType, k as getMarkRange, l as useEditor, n as EditorContent, o as EditorView } from '../chunk-B5LsYrmv.js';
 import classnames from 'classnames';
-import { isNotPresent, findBy, isNotEmpty, isPresent, noop, slugify } from '@bigbinary/neeto-cist';
+import { Spinner, Tooltip, Button, Toastr, DropdownMenu, Input, Avatar, Typography, Select, Dialog, Checkbox as Checkbox$1, Label } from '@bigbinary/neeto-atoms';
+import { isNotPresent, isPresent, noop, findBy, isNotEmpty, slugify } from '@bigbinary/neeto-cist';
 import { useOnClickOutside, withT, useFuncDebounce } from '@bigbinary/neeto-commons-frontend/v2/react-utils';
 import { createPortal } from 'react-dom';
-import { B as BulletList$1, s as src_default, a as src_default$1, R as Resizable, b as src_default$2, L as Link$1, c as scrollHandler, d as src_default$3, O as OrderedList$1, e as src_default$4, f as fuzzySearch, T as Table$2, g as TaskList, h as TaskItem, i as getVariableDisplay, j as getVideoDimension, C as CharacterCount, k as src_default$5, l as src_default$6, m as safeSplitBlock, n as safeListKeymap, o as TextStyle, p as src_default$7, F as Focus, q as src_default$8, r as TableRow, t as TableHeader, u as TableCell, v as Color, w as ListItem, x as src_default$9, y as src_default$a, z as useFetchKbArticles, K as useEditorWarnings, N as useDeletedArticles } from '../chunk-BozdxlzB.js';
-import { D as DIRECT_UPLOAD_ENDPOINT, E as EDITOR_OPTIONS, C as COMBINED_REGEX, a as EDITOR_SIZES } from '../chunk-UwzgbfZD.js';
+import { B as BulletList$1, s as src_default, a as src_default$1, R as Resizable, b as src_default$2, L as Link$1, c as scrollHandler, d as src_default$3, O as OrderedList$1, e as src_default$4, f as fuzzySearch, T as Table$2, g as TaskList, h as TaskItem, i as getVariableDisplay, j as getVideoDimension, C as CharacterCount, k as src_default$5, l as src_default$6, m as safeSplitBlock, n as safeListKeymap, o as TextStyle, p as src_default$7, F as Focus, q as src_default$8, r as TableRow, t as TableHeader, u as TableCell, v as Color, w as ListItem, x as src_default$9, y as src_default$a, z as useFetchKbArticles, K as useEditorWarnings, N as useDeletedArticles } from '../chunk-BE7om7ts.js';
+import { D as DIRECT_UPLOAD_ENDPOINT, E as EDITOR_OPTIONS, C as COMBINED_REGEX, a as EDITOR_SIZES } from '../chunk-71BzByG6.js';
 import { S as Slice, F as Fragment$1 } from '../chunk-C9H9LYpP.js';
-import '../chunk-CNIDH-FD.js';
-import { is, intersection, difference, union, isEmpty, isNil, mergeRight, assoc, equals } from 'ramda';
+import '../chunk-Dwn1Kihg.js';
+import { is, isEmpty, intersection, difference, union, isNil, mergeRight, assoc, equals } from 'ramda';
 import ReactDOM from 'react-dom/server';
 import { l as lowlight, d as decodeHtmlEntities, r as removeEmptyTags } from '../chunk-LtUevT4I.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { C as CALLOUT_TYPES, E as EmojiPickerMenu, g as getSuggestionAppendTo, v as validateUrl, b as buildLevelsFromOptions, c as getLinkPopoverPosition, L as LINK_VALIDATION_SCHEMA, d as validateAndFormatUrl, D as DEFAULT_EDITOR_OPTIONS, e as getEditorStyles, M as Menu$3, f as MenuDynamicVariables, h as MediaUploader, j as LinkAddPopOver, k as transformPastedHTML, l as handlePaste, m as clipboardTextParser, s as setInitialPosition } from '../chunk-CivYrffM.js';
+import { C as CALLOUT_TYPES, E as EmojiPickerMenu, g as getSuggestionAppendTo, v as validateUrl, b as buildLevelsFromOptions, c as getLinkPopoverPosition, L as LINK_VALIDATION_SCHEMA, d as validateAndFormatUrl, D as DEFAULT_EDITOR_OPTIONS, e as getEditorStyles, M as Menu$3, f as MenuDynamicVariables, h as MediaUploader, j as LinkAddPopOver, k as transformPastedHTML, l as handlePaste, m as clipboardTextParser, s as setInitialPosition } from '../chunk-PFB_80PR.js';
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import { P as Plugin, g as PluginKey, S as Selection, T as TextSelection } from '../chunk-DqSrbxqC.js';
+import { t } from 'i18next';
+import { D as DirectUpload, g as getRandomString } from '../chunk-Verd5n0p.js';
+import { c as checkPreviewAvailability, d as downloadFile, b as buildFileUploadConfig, A as Attachments } from '../chunk-BlvmXrHo.js';
+import { F as File$1, c as convertToFileSize, s as selectFiles, h as DEFAULT_ASPECT_RATIO } from '../chunk-EjoZ4e18.js';
+import { Eye, Download, ExternalLink, Trash2, ChevronDown, Highlighter, X, Ratio, Ellipsis, AlignLeft, AlignCenter, AlignRight, RectangleHorizontal, RectangleVertical, Square, SquareDashed, Minus as Minus$1, Plus, BookOpen, Pencil } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
 import Megaphone from '@bigbinary/neeto-icons/misc/Megaphone';
-import { g as PluginKey, P as Plugin, S as Selection, T as TextSelection } from '../chunk-DqSrbxqC.js';
-import { ChevronDown, Highlighter, X, Ratio, Ellipsis, AlignLeft, AlignCenter, AlignRight, RectangleHorizontal, RectangleVertical, Square, SquareDashed, Trash2, Minus as Minus$1, Plus, BookOpen, Pencil } from 'lucide-react';
 import CopyToClipboardButton from '@bigbinary/neeto-molecules/v2/CopyToClipboardButton';
-import { useTranslation } from 'react-i18next';
-import { t } from 'i18next';
-import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import '@babel/runtime/helpers/readOnlyError';
 import tippy from 'tippy.js';
 import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
@@ -34,7 +37,6 @@ import _getPrototypeOf from '@babel/runtime/helpers/getPrototypeOf';
 import _inherits from '@babel/runtime/helpers/inherits';
 import { init, SearchIndex } from 'emoji-mart';
 import { globalProps } from '@bigbinary/neeto-commons-frontend/v2/initializers';
-import { D as DirectUpload } from '../chunk-BHi0J28T.js';
 import Tippy from '@tippyjs/react';
 import TextP from '@bigbinary/neeto-icons/TextP';
 import TextH1 from '@bigbinary/neeto-icons/TextH1';
@@ -59,12 +61,10 @@ import Underline from '@bigbinary/neeto-icons/Underline';
 import Link$2 from '@bigbinary/neeto-icons/Link';
 import Attachment from '@bigbinary/neeto-icons/Attachment';
 import MessageSquare from '@bigbinary/neeto-icons/MessageSquare';
-import File from '@bigbinary/neeto-icons/File';
-import { h as DEFAULT_ASPECT_RATIO } from '../chunk-BIgc5m-h.js';
+import File$2 from '@bigbinary/neeto-icons/File';
 import _typeof from '@babel/runtime/helpers/typeof';
 import Search from '@bigbinary/neeto-molecules/v2/Search';
 import { Form, Input as Input$1 } from '@bigbinary/neeto-atoms/formik';
-import { A as Attachments } from '../chunk-DwQ7NJtm.js';
 import 'axios';
 import '@bigbinary/neeto-commons-frontend/react-utils';
 import 'zustand';
@@ -79,6 +79,7 @@ import 'react-colorful';
 import '@bigbinary/neeto-image-uploader-frontend/v2/ImageUploader';
 import 'zustand/shallow';
 import '@bigbinary/neeto-molecules/v2/DynamicVariables';
+import '@bigbinary/neeto-commons-frontend/v2/react-utils/useOnClickOutside';
 import '@bigbinary/neeto-icons/LeftAlign';
 import '@bigbinary/neeto-icons/CenterAlign';
 import '@bigbinary/neeto-icons/RightAlign';
@@ -91,7 +92,6 @@ import '@bigbinary/neeto-icons/AspectRatio169';
 import '@bigbinary/neeto-icons/AspectRatio916';
 import '@bigbinary/neeto-icons/AspectRatio43';
 import '@bigbinary/neeto-icons/AspectRatio32';
-import '@bigbinary/neeto-commons-frontend/v2/react-utils/useOnClickOutside';
 
 var ErrorWrapper = function ErrorWrapper(_ref) {
   var error = _ref.error,
@@ -148,6 +148,604 @@ var CharacterCountWrapper = function CharacterCountWrapper(_ref) {
   });
 };
 
+var NODE_NAME = "attachment";
+
+// Files larger than this are shown as a chip, never as an inline preview.
+var DEFAULT_INLINE_PREVIEW_MAX_SIZE = 20 * 1024 * 1024;
+var PDF_THUMBNAIL_WIDTH = 800;
+var PREVIEW_TYPES = {
+  IMAGE: "image",
+  VIDEO: "video",
+  PDF: "pdf"
+};
+var INLINE_PREVIEW_IMAGE_TYPES = ["image/jpeg", "image/jpg", "image/png", "image/gif", "image/webp"];
+var PDF_CONTENT_TYPE = "application/pdf";
+
+var _excluded$5 = ["data"];
+function _regenerator$4() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2$4(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = false, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = true, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), true), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2$4(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2$4(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2$4(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2$4(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2$4(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2$4(u), _regeneratorDefine2$4(u, o, "Generator"), _regeneratorDefine2$4(u, n, function () { return this; }), _regeneratorDefine2$4(u, "toString", function () { return "[object Generator]"; }), (_regenerator$4 = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2$4(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2$4 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2$4(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2$4(e, r, n, t); }
+
+// pdf.js normally runs in a web worker loaded from a separate file, which a
+// host app bundling this package can't be relied on to serve. Exposing the
+// worker module on `globalThis.pdfjsWorker` makes pdf.js run it in-page.
+var loadPdfjs = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator$4().m(function _callee() {
+    var _globalThis$pdfjsWork;
+    var _yield$Promise$all, _yield$Promise$all2, pdfjs, worker;
+    return _regenerator$4().w(function (_context) {
+      while (1) switch (_context.n) {
+        case 0:
+          _context.n = 1;
+          return Promise.all([import('../chunk-CXFFqMSB.js'), import('../chunk-BFj2DeQe.js')]);
+        case 1:
+          _yield$Promise$all = _context.v;
+          _yield$Promise$all2 = _slicedToArray(_yield$Promise$all, 2);
+          pdfjs = _yield$Promise$all2[0];
+          worker = _yield$Promise$all2[1];
+          (_globalThis$pdfjsWork = globalThis.pdfjsWorker) !== null && _globalThis$pdfjsWork !== void 0 ? _globalThis$pdfjsWork : globalThis.pdfjsWorker = worker;
+          return _context.a(2, pdfjs);
+      }
+    }, _callee);
+  }));
+  return function loadPdfjs() {
+    return _ref.apply(this, arguments);
+  };
+}();
+var canvasToBlob = function canvasToBlob(canvas) {
+  return new Promise(function (resolve) {
+    return canvas.toBlob(resolve, "image/png");
+  });
+};
+var getPreviewType = function getPreviewType(_ref2, maxSize) {
+  var contentType = _ref2.contentType,
+    size = _ref2.size,
+    thumbnailUrl = _ref2.thumbnailUrl;
+  if (!contentType || isPresent(size) && Number(size) > maxSize) return null;
+  if (INLINE_PREVIEW_IMAGE_TYPES.includes(contentType)) {
+    return PREVIEW_TYPES.IMAGE;
+  }
+  if (contentType.startsWith("video/")) return PREVIEW_TYPES.VIDEO;
+  if (contentType === PDF_CONTENT_TYPE && isPresent(thumbnailUrl)) {
+    return PREVIEW_TYPES.PDF;
+  }
+  return null;
+};
+var getPreviewSrc = function getPreviewSrc(_ref3, previewType) {
+  var url = _ref3.url,
+    thumbnailUrl = _ref3.thumbnailUrl;
+  return previewType === PREVIEW_TYPES.PDF ? thumbnailUrl : url;
+};
+var uploadFile = /*#__PURE__*/function () {
+  var _ref4 = _asyncToGenerator(/*#__PURE__*/_regenerator$4().m(function _callee2(file, endpoint) {
+    var _data$blob_url, _data$signed_id;
+    var _yield$DirectUpload$c, _yield$DirectUpload$c2, data, response;
+    return _regenerator$4().w(function (_context2) {
+      while (1) switch (_context2.n) {
+        case 0:
+          _context2.n = 1;
+          return new DirectUpload({
+            file: file,
+            url: endpoint
+          }).create();
+        case 1:
+          _yield$DirectUpload$c = _context2.v;
+          _yield$DirectUpload$c2 = _yield$DirectUpload$c.data;
+          data = _yield$DirectUpload$c2 === void 0 ? {} : _yield$DirectUpload$c2;
+          response = _objectWithoutProperties(_yield$DirectUpload$c, _excluded$5);
+          return _context2.a(2, {
+            url: (_data$blob_url = data.blob_url) !== null && _data$blob_url !== void 0 ? _data$blob_url : response.blob_url,
+            signedId: (_data$signed_id = data.signed_id) !== null && _data$signed_id !== void 0 ? _data$signed_id : response.signed_id
+          });
+      }
+    }, _callee2);
+  }));
+  return function uploadFile(_x, _x2) {
+    return _ref4.apply(this, arguments);
+  };
+}();
+var generatePdfThumbnail = /*#__PURE__*/function () {
+  var _ref5 = _asyncToGenerator(/*#__PURE__*/_regenerator$4().m(function _callee3(file) {
+    var pdfjs, pdf, page, _page$getViewport, width, viewport, canvas, blob, name, _t, _t2;
+    return _regenerator$4().w(function (_context3) {
+      while (1) switch (_context3.p = _context3.n) {
+        case 0:
+          _context3.n = 1;
+          return loadPdfjs();
+        case 1:
+          pdfjs = _context3.v;
+          _t = pdfjs;
+          _context3.n = 2;
+          return file.arrayBuffer();
+        case 2:
+          _t2 = _context3.v;
+          _context3.n = 3;
+          return _t.getDocument.call(_t, {
+            data: _t2
+          }).promise;
+        case 3:
+          pdf = _context3.v;
+          _context3.p = 4;
+          _context3.n = 5;
+          return pdf.getPage(1);
+        case 5:
+          page = _context3.v;
+          _page$getViewport = page.getViewport({
+            scale: 1
+          }), width = _page$getViewport.width;
+          viewport = page.getViewport({
+            scale: PDF_THUMBNAIL_WIDTH / width
+          });
+          canvas = document.createElement("canvas");
+          canvas.width = viewport.width;
+          canvas.height = viewport.height;
+          _context3.n = 6;
+          return page.render({
+            canvasContext: canvas.getContext("2d"),
+            viewport: viewport
+          }).promise;
+        case 6:
+          _context3.n = 7;
+          return canvasToBlob(canvas);
+        case 7:
+          blob = _context3.v;
+          if (blob) {
+            _context3.n = 8;
+            break;
+          }
+          return _context3.a(2, null);
+        case 8:
+          name = "".concat(file.name.replace(/\.pdf$/i, ""), "-preview.png");
+          return _context3.a(2, new File([blob], name, {
+            type: "image/png"
+          }));
+        case 9:
+          _context3.p = 9;
+          pdf.destroy();
+          return _context3.f(9);
+        case 10:
+          return _context3.a(2);
+      }
+    }, _callee3, null, [[4,, 9, 10]]);
+  }));
+  return function generatePdfThumbnail(_x3) {
+    return _ref5.apply(this, arguments);
+  };
+}();
+var findNodePosByUploadId = function findNodePosByUploadId(doc, uploadId) {
+  var foundPos = -1;
+  doc.descendants(function (node, pos) {
+    var _node$attrs;
+    if (foundPos !== -1) return false;
+    if (((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.uploadId) === uploadId) foundPos = pos;
+    return foundPos === -1;
+  });
+  return foundPos;
+};
+var countAttachmentNodes = function countAttachmentNodes(doc, nodeName) {
+  var count = 0;
+  doc.descendants(function (node) {
+    if (node.type.name === nodeName) count += 1;
+  });
+  return count;
+};
+
+var Preview = /*#__PURE__*/lazy(function () {
+  return import('../chunk-Bq_ijJy6.js');
+});
+var AttachmentComponent = function AttachmentComponent(_ref) {
+  var node = _ref.node,
+    extension = _ref.extension,
+    editor = _ref.editor,
+    deleteNode = _ref.deleteNode;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isPreviewOpen = _useState2[0],
+    setIsPreviewOpen = _useState2[1];
+  var _node$attrs = node.attrs,
+    url = _node$attrs.url,
+    filename = _node$attrs.filename,
+    contentType = _node$attrs.contentType,
+    size = _node$attrs.size,
+    signedId = _node$attrs.signedId,
+    uploadId = _node$attrs.uploadId;
+  var attachment = {
+    url: url,
+    filename: filename,
+    contentType: contentType,
+    size: size,
+    signedId: signedId
+  };
+  var previewType = getPreviewType(node.attrs, extension.options.previewMaxSize);
+  var previewSrc = getPreviewSrc(node.attrs, previewType);
+  var canView = checkPreviewAvailability(contentType);
+  var actions = [canView && {
+    key: "view",
+    icon: Eye,
+    label: t("neetoEditor.attachments.view"),
+    onClick: function onClick() {
+      return setIsPreviewOpen(true);
+    }
+  }, {
+    key: "download",
+    icon: Download,
+    label: t("neetoEditor.common.download"),
+    onClick: function onClick() {
+      return downloadFile(url, filename);
+    }
+  }, {
+    key: "open",
+    icon: ExternalLink,
+    label: t("neetoEditor.common.openInNewTab"),
+    onClick: function onClick() {
+      return window.open(url, "_blank", "noopener,noreferrer");
+    }
+  }, editor.isEditable && {
+    key: "delete",
+    icon: Trash2,
+    label: t("neetoEditor.menu.delete"),
+    onClick: deleteNode
+  }].filter(Boolean);
+  if (uploadId) {
+    return /*#__PURE__*/jsx(NodeViewWrapper, {
+      className: "neeto-editor__attachment neeto-editor__attachment--uploading",
+      "data-testid": "neeto-editor-attachment-uploading",
+      children: /*#__PURE__*/jsxs("div", {
+        className: "neeto-editor__attachment-file",
+        children: [/*#__PURE__*/jsx(Spinner, {}), /*#__PURE__*/jsx("span", {
+          className: "neeto-editor__attachment-name",
+          children: filename
+        }), /*#__PURE__*/jsx("span", {
+          className: "neeto-editor__attachment-size",
+          children: t("neetoEditor.attachments.uploading")
+        })]
+      })
+    });
+  }
+  return /*#__PURE__*/jsxs(NodeViewWrapper, {
+    "data-drag-handle": true,
+    className: "neeto-editor__attachment",
+    "data-testid": "neeto-editor-attachment",
+    children: [previewType && /*#__PURE__*/jsx("div", {
+      className: "neeto-editor__attachment-preview",
+      onClick: previewType === PREVIEW_TYPES.VIDEO ? noop : function () {
+        return setIsPreviewOpen(true);
+      },
+      children: previewType === PREVIEW_TYPES.VIDEO ? /*#__PURE__*/jsx("video", {
+        controls: true,
+        playsInline: true,
+        preload: "metadata",
+        src: previewSrc
+      }) : /*#__PURE__*/jsx("img", {
+        alt: filename,
+        draggable: false,
+        src: previewSrc
+      })
+    }), /*#__PURE__*/jsxs("div", {
+      className: "neeto-editor__attachment-file",
+      children: [/*#__PURE__*/jsx(File$1, {
+        className: "neeto-editor__attachment-icon",
+        fileName: filename
+      }), /*#__PURE__*/jsx("span", {
+        className: "neeto-editor__attachment-name",
+        children: filename
+      }), size && /*#__PURE__*/jsx("span", {
+        className: "neeto-editor__attachment-size",
+        children: convertToFileSize(Number(size))
+      }), /*#__PURE__*/jsx("div", {
+        className: "neeto-editor__attachment-actions",
+        children: actions.map(function (_ref2) {
+          var key = _ref2.key,
+            icon = _ref2.icon,
+            label = _ref2.label,
+            onClick = _ref2.onClick;
+          return /*#__PURE__*/jsx(Tooltip, {
+            content: label,
+            position: "top",
+            children: /*#__PURE__*/jsx(Button, {
+              icon: icon,
+              onClick: onClick,
+              "aria-label": label,
+              "data-testid": "neeto-editor-attachment-".concat(key, "-button"),
+              size: "sm",
+              variant: "ghost"
+            })
+          }, key);
+        })
+      })]
+    }), /*#__PURE__*/jsx(Suspense, {
+      fallback: /*#__PURE__*/jsx("span", {}),
+      children: isPreviewOpen && /*#__PURE__*/jsx(Preview, {
+        attachments: [attachment],
+        selectedAttachment: attachment,
+        setDidFetchPreviewBundle: noop,
+        setSelectedAttachment: noop,
+        onClose: function onClose() {
+          return setIsPreviewOpen(false);
+        }
+      })
+    })]
+  });
+};
+
+function ownKeys$j(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$j(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$j(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _regenerator$3() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2$3(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = false, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = true, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), true), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2$3(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2$3(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2$3(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2$3(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2$3(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2$3(u), _regeneratorDefine2$3(u, o, "Generator"), _regeneratorDefine2$3(u, n, function () { return this; }), _regeneratorDefine2$3(u, "toString", function () { return "[object Generator]"; }), (_regenerator$3 = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2$3(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2$3 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2$3(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2$3(e, r, n, t); }
+var dataAttribute = function dataAttribute(name, attribute) {
+  return {
+    "default": null,
+    parseHTML: function parseHTML(element) {
+      return element.getAttribute(attribute);
+    },
+    renderHTML: function renderHTML(attributes) {
+      return attributes[name] ? _defineProperty({}, attribute, attributes[name]) : {};
+    }
+  };
+};
+var uploadThumbnail = /*#__PURE__*/function () {
+  var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator$3().m(function _callee(file, endpoint) {
+    var thumbnail, _t, _t2;
+    return _regenerator$3().w(function (_context) {
+      while (1) switch (_context.p = _context.n) {
+        case 0:
+          _context.p = 0;
+          _context.n = 1;
+          return generatePdfThumbnail(file);
+        case 1:
+          thumbnail = _context.v;
+          if (!thumbnail) {
+            _context.n = 3;
+            break;
+          }
+          _context.n = 2;
+          return uploadFile(thumbnail, endpoint);
+        case 2:
+          _t = _context.v.url;
+          _context.n = 4;
+          break;
+        case 3:
+          _t = null;
+        case 4:
+          return _context.a(2, _t);
+        case 5:
+          _context.p = 5;
+          _t2 = _context.v;
+          // A missing thumbnail only means the PDF is shown as a chip.
+          // eslint-disable-next-line no-console
+          console.error("Failed to generate the PDF thumbnail", _t2);
+          return _context.a(2, null);
+      }
+    }, _callee, null, [[0, 5]]);
+  }));
+  return function uploadThumbnail(_x, _x2) {
+    return _ref2.apply(this, arguments);
+  };
+}();
+var AttachmentExtension = Node.create({
+  name: NODE_NAME,
+  group: "block",
+  atom: true,
+  draggable: true,
+  selectable: true,
+  addOptions: function addOptions() {
+    return {
+      config: {},
+      previewMaxSize: DEFAULT_INLINE_PREVIEW_MAX_SIZE,
+      getExternalAttachmentsCount: function getExternalAttachmentsCount() {
+        return 0;
+      },
+      setIsUploading: function setIsUploading() {}
+    };
+  },
+  addStorage: function addStorage() {
+    return {
+      pendingUploadsCount: 0
+    };
+  },
+  addAttributes: function addAttributes() {
+    return {
+      url: dataAttribute("url", "data-url"),
+      filename: dataAttribute("filename", "data-filename"),
+      contentType: dataAttribute("contentType", "data-content-type"),
+      size: dataAttribute("size", "data-size"),
+      signedId: dataAttribute("signedId", "data-signed-id"),
+      thumbnailUrl: dataAttribute("thumbnailUrl", "data-thumbnail-url"),
+      uploadId: {
+        "default": null,
+        rendered: false
+      }
+    };
+  },
+  parseHTML: function parseHTML() {
+    return [{
+      tag: "div[data-attachment]"
+    }];
+  },
+  renderHTML: function renderHTML(_ref3) {
+    var node = _ref3.node,
+      HTMLAttributes = _ref3.HTMLAttributes;
+    var _node$attrs = node.attrs,
+      url = _node$attrs.url,
+      filename = _node$attrs.filename,
+      size = _node$attrs.size;
+
+    // Still uploading: leave nothing behind in the saved HTML.
+    if (!url) return ["span"];
+    var previewType = getPreviewType(node.attrs, this.options.previewMaxSize);
+    var linkAttrs = {
+      href: url,
+      target: "_blank",
+      rel: "noopener noreferrer"
+    };
+    var previewSrc = getPreviewSrc(node.attrs, previewType);
+    var preview = previewType === PREVIEW_TYPES.VIDEO ? ["video", {
+      src: previewSrc,
+      controls: true,
+      playsinline: true,
+      preload: "metadata"
+    }] : ["a", linkAttrs, ["img", {
+      src: previewSrc,
+      alt: filename,
+      loading: "lazy"
+    }]];
+    var file = ["a", _objectSpread$j(_objectSpread$j({}, linkAttrs), {}, {
+      "class": "neeto-editor__attachment-file"
+    }), ["span", {
+      "class": "neeto-editor__attachment-name"
+    }, filename]].concat(_toConsumableArray(size ? [["span", {
+      "class": "neeto-editor__attachment-size"
+    }, convertToFileSize(Number(size))]] : []));
+    return ["div", _objectSpread$j(_objectSpread$j({}, HTMLAttributes), {}, {
+      "data-attachment": "",
+      "class": "neeto-editor__attachment"
+    })].concat(_toConsumableArray(previewType ? [["div", {
+      "class": "neeto-editor__attachment-preview"
+    }, preview]] : []), [file]);
+  },
+  addNodeView: function addNodeView() {
+    return ReactNodeViewRenderer(AttachmentComponent);
+  },
+  addCommands: function addCommands() {
+    var _this = this;
+    return {
+      uploadAttachments: function uploadAttachments(files, position) {
+        return function (_ref4) {
+          var editor = _ref4.editor;
+          _this.storage.uploadFiles(editor, Array.from(files), position);
+          return true;
+        };
+      }
+    };
+  },
+  onCreate: function onCreate() {
+    var options = this.options,
+      storage = this.storage;
+    var config = buildFileUploadConfig(options.config);
+    var endpoint = config.directUploadEndpoint;
+    var updateUploadingState = function updateUploadingState(delta) {
+      storage.pendingUploadsCount += delta;
+      options.setIsUploading(storage.pendingUploadsCount > 0);
+    };
+    var replacePlaceholder = function replacePlaceholder(editor, uploadId, attrs) {
+      if (editor.isDestroyed) return;
+      var state = editor.state,
+        view = editor.view;
+      var pos = findNodePosByUploadId(state.doc, uploadId);
+      if (pos === -1) return; // Removed by the user while uploading.
+
+      var node = state.doc.nodeAt(pos);
+      var tr = attrs ? state.tr.setNodeMarkup(pos, undefined, _objectSpread$j(_objectSpread$j({}, node.attrs), attrs)) : state.tr["delete"](pos, pos + node.nodeSize);
+      view.dispatch(tr.setMeta("addToHistory", false));
+    };
+    var uploadPlaceholder = /*#__PURE__*/function () {
+      var _ref6 = _asyncToGenerator(/*#__PURE__*/_regenerator$3().m(function _callee2(editor, _ref5) {
+        var file, uploadId, shouldGenerateThumbnail, _yield$Promise$all, _yield$Promise$all2, uploaded, thumbnailUrl, _t3;
+        return _regenerator$3().w(function (_context2) {
+          while (1) switch (_context2.p = _context2.n) {
+            case 0:
+              file = _ref5.file, uploadId = _ref5.uploadId;
+              _context2.p = 1;
+              shouldGenerateThumbnail = file.type === PDF_CONTENT_TYPE && file.size <= options.previewMaxSize;
+              _context2.n = 2;
+              return Promise.all([uploadFile(file, endpoint), shouldGenerateThumbnail ? uploadThumbnail(file, endpoint) : null]);
+            case 2:
+              _yield$Promise$all = _context2.v;
+              _yield$Promise$all2 = _slicedToArray(_yield$Promise$all, 2);
+              uploaded = _yield$Promise$all2[0];
+              thumbnailUrl = _yield$Promise$all2[1];
+              replacePlaceholder(editor, uploadId, _objectSpread$j(_objectSpread$j({}, uploaded), {}, {
+                thumbnailUrl: thumbnailUrl,
+                uploadId: null
+              }));
+              _context2.n = 4;
+              break;
+            case 3:
+              _context2.p = 3;
+              _t3 = _context2.v;
+              // eslint-disable-next-line no-console
+              console.error("Attachment upload failed", _t3);
+              replacePlaceholder(editor, uploadId, null);
+              Toastr.error(t("neetoEditor.error.uploadFileFailed"));
+            case 4:
+              _context2.p = 4;
+              updateUploadingState(-1);
+              return _context2.f(4);
+            case 5:
+              return _context2.a(2);
+          }
+        }, _callee2, null, [[1, 3, 4, 5]]);
+      }));
+      return function uploadPlaceholder(_x3, _x4) {
+        return _ref6.apply(this, arguments);
+      };
+    }();
+    storage.uploadFiles = function (editor, files, position) {
+      var selectedFiles = selectFiles({
+        previousAttachmentsCount: countAttachmentNodes(editor.state.doc, NODE_NAME) + options.getExternalAttachmentsCount(),
+        config: config,
+        files: files
+      });
+      if (isEmpty(selectedFiles)) return;
+      var placeholders = selectedFiles.map(function (file) {
+        return {
+          file: file,
+          uploadId: getRandomString()
+        };
+      });
+      var nodes = placeholders.map(function (_ref7) {
+        var file = _ref7.file,
+          uploadId = _ref7.uploadId;
+        return {
+          type: NODE_NAME,
+          attrs: {
+            uploadId: uploadId,
+            filename: file.name,
+            contentType: file.type,
+            size: file.size
+          }
+        };
+      });
+      editor.chain().focus().insertContentAt(position !== null && position !== void 0 ? position : editor.state.selection, nodes).run();
+      updateUploadingState(placeholders.length);
+      placeholders.forEach(function (placeholder) {
+        return uploadPlaceholder(editor, placeholder);
+      });
+    };
+  },
+  addProseMirrorPlugins: function addProseMirrorPlugins() {
+    var editor = this.editor,
+      storage = this.storage;
+    return [new Plugin({
+      props: {
+        handleDrop: function handleDrop(view, event, _slice, moved) {
+          var _event$dataTransfer$f, _event$dataTransfer;
+          var files = Array.from((_event$dataTransfer$f = (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.files) !== null && _event$dataTransfer$f !== void 0 ? _event$dataTransfer$f : []);
+          if (moved || isEmpty(files)) return false;
+          var coordinates = view.posAtCoords({
+            left: event.clientX,
+            top: event.clientY
+          });
+          event.preventDefault();
+          storage.uploadFiles(editor, files, coordinates === null || coordinates === void 0 ? void 0 : coordinates.pos);
+          return true;
+        },
+        // Pasted images are handled by the image extension.
+        handlePaste: function handlePaste(_view, event) {
+          var _event$clipboardData$, _event$clipboardData;
+          var files = Array.from((_event$clipboardData$ = (_event$clipboardData = event.clipboardData) === null || _event$clipboardData === void 0 ? void 0 : _event$clipboardData.files) !== null && _event$clipboardData$ !== void 0 ? _event$clipboardData$ : []).filter(function (file) {
+            return !/image/i.test(file.type);
+          });
+          if (isEmpty(files)) return false;
+          storage.uploadFiles(editor, files);
+          return true;
+        }
+      }
+    })];
+  }
+});
+
 var HighlightInternal = Extension.create({
   name: "HighlightInternal",
   addOptions: function addOptions() {
@@ -3061,7 +3659,7 @@ var MENU_ITEMS = [{
   optionName: EDITOR_OPTIONS.NEETO_KB_ARTICLE,
   title: t("neetoEditor.menu.linkToNeetoKbArticle"),
   description: t("neetoEditor.menu.linkToNeetoKbArticleDescription"),
-  Icon: File,
+  Icon: File$2,
   command: noop
 }, {
   optionName: EDITOR_OPTIONS.ATTACHMENTS,
@@ -4850,7 +5448,8 @@ var useCustomExtensions = function useCustomExtensions(_ref) {
     collaborationProvider = _ref.collaborationProvider,
     setIsNeetoKbArticleActive = _ref.setIsNeetoKbArticleActive,
     containerRef = _ref.containerRef,
-    appendSuggestionsToBody = _ref.appendSuggestionsToBody;
+    appendSuggestionsToBody = _ref.appendSuggestionsToBody,
+    inlineAttachmentsOptions = _ref.inlineAttachmentsOptions;
   var customExtensions = [EditorContainer.configure({
     containerRef: containerRef,
     appendSuggestionsToBody: appendSuggestionsToBody
@@ -4897,6 +5496,9 @@ var useCustomExtensions = function useCustomExtensions(_ref) {
   if (options.includes(EDITOR_OPTIONS.VIDEO_UPLOAD)) {
     customExtensions.push(UnifiedVideoExtension);
   }
+  if (options.includes(EDITOR_OPTIONS.INLINE_ATTACHMENTS)) {
+    customExtensions.push(AttachmentExtension.configure(inlineAttachmentsOptions));
+  }
   if (options.includes(EDITOR_OPTIONS.NEETO_KB_ARTICLE)) {
     customExtensions.push(DeletedArticleDecoration.configure({
       deletedArticleIds: new Set()
@@ -5991,7 +6593,7 @@ var _excluded = ["addonCommands", "addons", "attachments", "attachmentsConfig",
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Editor = function Editor(_ref, ref) {
-  var _wrapperRef$current;
+  var _attachmentsConfig$re, _attachmentsConfig$re2, _wrapperRef$current;
   var _ref$addonCommands = _ref.addonCommands,
     addonCommands = _ref$addonCommands === void 0 ? [] : _ref$addonCommands,
     _ref$addons = _ref.addons,
@@ -6080,6 +6682,10 @@ var Editor = function Editor(_ref, ref) {
   var wrapperRef = useRef(null);
   var isArticleOptActive = addons.includes(EDITOR_OPTIONS.NEETO_KB_ARTICLE);
   var isAttachmentsActive = addons.includes(EDITOR_OPTIONS.ATTACHMENTS);
+  var isInlineAttachmentsActive = addons.includes(EDITOR_OPTIONS.INLINE_ATTACHMENTS);
+
+  // Inline attachments reuse the attachments toolbar button and slash command.
+  var menuAddons = isInlineAttachmentsActive && !isAttachmentsActive ? [].concat(_toConsumableArray(addons), [EDITOR_OPTIONS.ATTACHMENTS]) : addons;
   var isMediaUploaderActive = addons.includes(EDITOR_OPTIONS.IMAGE_UPLOAD) || addons.includes(EDITOR_OPTIONS.VIDEO_UPLOAD);
   var isFixedMenuActive = menuType === "fixed";
   var isBubbleMenuActive = menuType === "bubble";
@@ -6106,13 +6712,23 @@ var Editor = function Editor(_ref, ref) {
     neetoKbArticleState = _useState8[0],
     setNeetoKbArticleState = _useState8[1];
   var addAttachmentsRef = useRef(null);
+  var inlineAttachmentInputRef = useRef(null);
+  var attachmentsCountRef = useRef(attachments.length);
+  attachmentsCountRef.current = attachments.length;
   var attachmentProps = {
     handleUploadAttachments: function handleUploadAttachments() {
-      var _addAttachmentsRef$cu;
-      return (_addAttachmentsRef$cu = addAttachmentsRef.current) === null || _addAttachmentsRef$cu === void 0 ? void 0 : _addAttachmentsRef$cu.handleUploadAttachments();
+      var _inlineAttachmentInpu, _addAttachmentsRef$cu;
+      return isInlineAttachmentsActive ? (_inlineAttachmentInpu = inlineAttachmentInputRef.current) === null || _inlineAttachmentInpu === void 0 ? void 0 : _inlineAttachmentInpu.click() : (_addAttachmentsRef$cu = addAttachmentsRef.current) === null || _addAttachmentsRef$cu === void 0 ? void 0 : _addAttachmentsRef$cu.handleUploadAttachments();
     },
     isDisabled: isAttachmentsUploading
   };
+  var inlineAttachmentsOptions = {
+    config: attachmentsConfig,
+    getExternalAttachmentsCount: function getExternalAttachmentsCount() {
+      return attachmentsCountRef.current;
+    },
+    setIsUploading: setIsAttachmentsUploading
+  };
   var debouncedOnChangeHandler = useFuncDebounce(function (_ref2) {
     var editor = _ref2.editor;
     if (!editor.isDestroyed) onChange(editor.getHTML());
@@ -6135,7 +6751,7 @@ var Editor = function Editor(_ref, ref) {
     mentions: mentions,
     variables: variables,
     isSlashCommandsActive: isSlashCommandsActive,
-    options: [].concat(_toConsumableArray(defaults), _toConsumableArray(addons)),
+    options: [].concat(_toConsumableArray(defaults), _toConsumableArray(menuAddons)),
     addonCommands: addonCommands,
     onSubmit: onSubmit,
     keyboardShortcuts: keyboardShortcuts,
@@ -6148,7 +6764,8 @@ var Editor = function Editor(_ref, ref) {
     collaborationProvider: collaborationProvider,
     setIsNeetoKbArticleActive: setNeetoKbArticleState,
     containerRef: wrapperRef,
-    appendSuggestionsToBody: appendSuggestionsToBody
+    appendSuggestionsToBody: appendSuggestionsToBody,
+    inlineAttachmentsOptions: inlineAttachmentsOptions
   });
   useEditorWarnings({
     initialValue: initialValue
@@ -6233,6 +6850,10 @@ var Editor = function Editor(_ref, ref) {
     if (!editor || !deletedArticlesHook.deletedArticleIds.size) return;
     editor.commands.updateDeletedArticles(deletedArticlesHook.deletedArticleIds);
   }, [editor, deletedArticlesHook.deletedArticleIds]);
+  var handleInlineAttachmentsChange = function handleInlineAttachmentsChange(event) {
+    editor === null || editor === void 0 || editor.commands.uploadAttachments(event.target.files);
+    event.target.value = null;
+  };
   EditorView.prototype.updateState = function updateState(state) {
     if (!this.docView) return;
     this.updateStateInner(state, this.state.plugins !== state.plugins);
@@ -6252,7 +6873,6 @@ var Editor = function Editor(_ref, ref) {
       children: /*#__PURE__*/jsxs(Fragment, {
         children: [menuType !== "none" && /*#__PURE__*/jsx(Menu$3, {
           addonCommands: addonCommands,
-          addons: addons,
           attachmentProps: attachmentProps,
           defaults: defaults,
           editor: editor,
@@ -6264,6 +6884,7 @@ var Editor = function Editor(_ref, ref) {
           showAssetLibrary: showAssetLibrary,
           tooltips: tooltips,
           variables: variables,
+          addons: menuAddons,
           className: menuClassName,
           containerRef: wrapperRef,
           isIndependant: isMenuIndependent,
@@ -6289,10 +6910,18 @@ var Editor = function Editor(_ref, ref) {
               video: false
             });
           }
-        }), isAttachmentsActive && /*#__PURE__*/jsx(Attachments, _objectSpread({
+        }), isInlineAttachmentsActive && /*#__PURE__*/jsx("input", {
+          hidden: true,
+          "data-testid": "neeto-editor-inline-attachments-input",
+          multiple: ((_attachmentsConfig$re = attachmentsConfig.restrictions) === null || _attachmentsConfig$re === void 0 ? void 0 : _attachmentsConfig$re.maxNumberOfFiles) !== 1,
+          ref: inlineAttachmentInputRef,
+          type: "file",
+          accept: (_attachmentsConfig$re2 = attachmentsConfig.restrictions) === null || _attachmentsConfig$re2 === void 0 || (_attachmentsConfig$re2 = _attachmentsConfig$re2.allowedFileTypes) === null || _attachmentsConfig$re2 === void 0 ? void 0 : _attachmentsConfig$re2.join(","),
+          onChange: handleInlineAttachmentsChange
+        }), isAttachmentsActive && (!isInlineAttachmentsActive || isNotEmpty(attachments)) && /*#__PURE__*/jsx(Attachments, _objectSpread({
           attachments: attachments,
           config: attachmentsConfig,
-          dragDropRef: wrapperRef,
+          dragDropRef: isInlineAttachmentsActive ? null : wrapperRef,
           isIndependent: false,
           ref: addAttachmentsRef,
           setIsUploading: setIsAttachmentsUploading,