@bigbinary/neeto-editor 1.46.1 → 1.47.1

package/dist/{chunk-C7yqzIpq.js → chunk-CeFnZWjP.js}

@@ -15699,8 +15699,8 @@ var emojiPickerApi = {
   fetch: fetch
 };
 
-function ownKeys$b(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$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$c(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$c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$c(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn$1(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var EmojiPickerMenu = /*#__PURE__*/function (_React$Component) {
@@ -15752,7 +15752,7 @@ var EmojiPickerMenu = /*#__PURE__*/function (_React$Component) {
   return _createClass$1(EmojiPickerMenu, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      new Picker(_objectSpread$b(_objectSpread$b({}, this.props), {}, {
+      new Picker(_objectSpread$c(_objectSpread$c({}, this.props), {}, {
         onEmojiSelect: this.handleSelect,
         style: {
           maxWidth: "100%"
@@ -15810,8 +15810,8 @@ var useEditorStore = create(withImmutableActions(function (set) {
   };
 }));
 
-function ownKeys$a(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$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$b(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$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var MenuButton = function MenuButton(_ref) {
   var icon = _ref.icon,
     command = _ref.command,
@@ -15830,7 +15830,7 @@ var MenuButton = function MenuButton(_ref) {
     isActive = _useEditorStore.isActive,
     _useEditorStore$disab = _useEditorStore.disabled,
     disabled = _useEditorStore$disab === void 0 ? isButtonDisabled : _useEditorStore$disab;
-  return /*#__PURE__*/jsx(Button$1, _objectSpread$a({
+  return /*#__PURE__*/jsx(Button$1, _objectSpread$b({
     disabled: disabled,
     icon: icon,
     className: "neeto-editor-fixed-menu__item",
@@ -15838,7 +15838,7 @@ var MenuButton = function MenuButton(_ref) {
     style: isActive ? "secondary" : "text",
     tabIndex: "-1",
     tooltipProps: {
-      content: label,
+      content: renderTooltipContent(label, optionName),
       position: "bottom"
     },
     onClick: command
@@ -15867,9 +15867,6 @@ var EmojiOption = function EmojiOption(_ref) {
   return /*#__PURE__*/jsx(Dropdown$1, {
     buttonStyle: "text",
     closeOnSelect: false,
-    dropdownProps: {
-      classNames: "neeto-editor-fixed-menu__emoji-dropdown"
-    },
     icon: Smiley,
     isOpen: isActive,
     position: isSecondaryMenu ? "left-start" : "bottom-start",
@@ -15887,6 +15884,12 @@ var EmojiOption = function EmojiOption(_ref) {
       label: label,
       icon: Smiley
     }),
+    dropdownProps: {
+      classNames: "neeto-editor-fixed-menu__emoji-dropdown",
+      onClick: function onClick(e) {
+        return isSecondaryMenu && e.stopPropagation();
+      }
+    },
     onClose: function onClose() {
       return setActive(false);
     },
@@ -16038,8 +16041,8 @@ var TableOption$2 = function TableOption(_ref) {
   });
 };
 
-function ownKeys$9(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$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$a(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$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var createMenuOptions$2 = function createMenuOptions(_ref) {
   var tooltips = _ref.tooltips,
     editor = _ref.editor,
@@ -16283,7 +16286,7 @@ var renderOptionButton = function renderOptionButton(_ref4) {
     active = _ref4.active,
     optionName = _ref4.optionName,
     highlight = _ref4.highlight;
-  return /*#__PURE__*/jsx(Button$1, _objectSpread$9({
+  return /*#__PURE__*/jsx(Button$1, _objectSpread$a({
     "data-cy": "neeto-editor-bubble-menu-".concat(optionName, "-option"),
     icon: Icon,
     size: "small",
@@ -18096,8 +18099,8 @@ var LinkAddPopOver = function LinkAddPopOver(_ref) {
 };
 
 var _excluded$3 = ["type"];
-function ownKeys$8(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$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$9(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$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Menu$3 = Dropdown$1.Menu,
   MenuItem$1 = Dropdown$1.MenuItem;
 var MoreMenu = function MoreMenu(_ref) {
@@ -18118,18 +18121,18 @@ var MoreMenu = function MoreMenu(_ref) {
           var Component = MENU_ELEMENTS[type];
           if (type === MENU_ELEMENT_TYPES.BUTTON) {
             var Icon = props.icon;
-            return /*#__PURE__*/jsxs(MenuItem$1.Button, _objectSpread$8(_objectSpread$8({
+            return /*#__PURE__*/jsxs(MenuItem$1.Button, _objectSpread$9(_objectSpread$9({
               "data-cy": "neeto-editor-fixed-menu-".concat(props.optionName, "-option"),
               isActive: editor.isActive(props.optionName),
               tabIndex: "-1",
               onClick: props.command
-            }, _objectSpread$8(_objectSpread$8(_objectSpread$8({}, generateFocusProps(props.highlight)), props), {}, {
+            }, _objectSpread$9(_objectSpread$9(_objectSpread$9({}, generateFocusProps(props.highlight)), props), {}, {
               editor: editor
             })), {}, {
               children: [/*#__PURE__*/jsx(Icon, {}), " ", props.label]
             }), props.optionName);
           }
-          return /*#__PURE__*/jsx(Component, _objectSpread$8(_objectSpread$8({}, _objectSpread$8(_objectSpread$8({}, props), {}, {
+          return /*#__PURE__*/jsx(Component, _objectSpread$9(_objectSpread$9({}, _objectSpread$9(_objectSpread$9({}, props), {}, {
             editor: editor
           }, generateFocusProps(props.highlight))), {}, {
             isSecondaryMenu: true
@@ -18142,8 +18145,8 @@ var MoreMenu = function MoreMenu(_ref) {
 
 var EDITOR_MARKS = [EDITOR_OPTIONS.UNDO, EDITOR_OPTIONS.REDO, "fontSizeOptions", EDITOR_OPTIONS.BOLD, EDITOR_OPTIONS.ITALIC, EDITOR_OPTIONS.UNDERLINE, EDITOR_OPTIONS.LINK, EDITOR_OPTIONS.STRIKETHROUGH, EDITOR_OPTIONS.HIGHLIGHT, "bulletList", "orderedList", "blockquote", EDITOR_OPTIONS.CODE, "codeBlock", EDITOR_OPTIONS.TABLE, EDITOR_OPTIONS.ATTACHMENTS, EDITOR_OPTIONS.IMAGE_UPLOAD, EDITOR_OPTIONS.VIDEO_UPLOAD, EDITOR_OPTIONS.VIDEO_EMBED, EDITOR_OPTIONS.TEXT_COLOR, EDITOR_OPTIONS.EMOJI, "mentions"];
 
-function ownKeys$7(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$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$8(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$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useEditorState = function useEditorState(_ref) {
   var editor = _ref.editor;
   var _useEditorStore = useEditorStore(function (store) {
@@ -18179,7 +18182,7 @@ var useEditorState = function useEditorState(_ref) {
     var redoOptionState = {
       disabled: !editor.can().redo()
     };
-    var updatedMarksState = _objectSpread$7(_objectSpread$7({}, marksState), {}, _defineProperty(_defineProperty({}, EDITOR_OPTIONS.UNDO, undoOptionState), EDITOR_OPTIONS.REDO, redoOptionState));
+    var updatedMarksState = _objectSpread$8(_objectSpread$8({}, marksState), {}, _defineProperty(_defineProperty({}, EDITOR_OPTIONS.UNDO, undoOptionState), EDITOR_OPTIONS.REDO, redoOptionState));
     setMarksState(updatedMarksState);
   }, [marksState, setMarksState]);
   useEffect(function () {
@@ -18199,8 +18202,8 @@ var useEditorState = function useEditorState(_ref) {
 };
 
 var _excluded$2 = ["type"];
-function ownKeys$6(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$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$7(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$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Fixed = function Fixed(_ref) {
   var editor = _ref.editor,
     options = _ref.options,
@@ -18299,7 +18302,8 @@ var Fixed = function Fixed(_ref) {
       mentions: mentions,
       addonCommands: addonCommands,
       setIsEmojiPickerActive: setIsEmojiPickerActive,
-      isEmojiPickerActive: isEmojiPickerActive
+      isEmojiPickerActive: isEmojiPickerActive,
+      editor: editor
     });
   }, [isEmojiPickerActive, mentions]);
   var handleResize = useCallback(function () {
@@ -18351,7 +18355,7 @@ var Fixed = function Fixed(_ref) {
             props = _objectWithoutProperties$1(_ref2, _excluded$2);
           var Component = MENU_ELEMENTS[type];
           if (!Component) return null;
-          return /*#__PURE__*/jsx(Component, _objectSpread$6({}, _objectSpread$6(_objectSpread$6({}, props), {}, {
+          return /*#__PURE__*/jsx(Component, _objectSpread$7({}, _objectSpread$7(_objectSpread$7({}, props), {}, {
             editor: editor,
             options: options
           })), props.optionName);
@@ -18400,8 +18404,8 @@ var Fixed = function Fixed(_ref) {
 };
 
 var _excluded$1 = ["icon", "onClick", "disabled", "className", "tooltipProps"];
-function ownKeys$5(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$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$6(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$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Button = function Button(_ref) {
   var _ref$icon = _ref.icon,
     icon = _ref$icon === void 0 ? null : _ref$icon,
@@ -18413,16 +18417,16 @@ var Button = function Button(_ref) {
     tooltipProps = _ref.tooltipProps,
     otherProps = _objectWithoutProperties$1(_ref, _excluded$1);
   var Icon = icon;
-  return /*#__PURE__*/jsx(Tooltip, _objectSpread$5(_objectSpread$5({
+  return /*#__PURE__*/jsx(Tooltip, _objectSpread$6(_objectSpread$6({
     disabled: !tooltipProps,
     onClick: function onClick() {
       return _onClick();
     }
   }, tooltipProps), {}, {
-    children: /*#__PURE__*/jsx("button", _objectSpread$5(_objectSpread$5({
+    children: /*#__PURE__*/jsx("button", _objectSpread$6(_objectSpread$6({
       className: classnames("ne-headless-btn", _defineProperty({}, className, className)),
       type: "button"
-    }, _objectSpread$5({
+    }, _objectSpread$6({
       disabled: disabled,
       onClick: _onClick
     }, otherProps)), {}, {
@@ -18435,8 +18439,8 @@ var Button = function Button(_ref) {
 };
 
 var _excluded = ["icon", "isOpen", "onClose", "children", "className", "onClick", "buttonProps"];
-function ownKeys$4(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$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$5(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$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var hideOnEsc = {
   name: "hideOnEsc",
   defaultValue: true,
@@ -18475,7 +18479,7 @@ var Dropdown = function Dropdown(_ref2) {
     _useState2 = _slicedToArray(_useState, 2),
     mounted = _useState2[0],
     setMounted = _useState2[1];
-  return /*#__PURE__*/jsx(Tippy, _objectSpread$4(_objectSpread$4({
+  return /*#__PURE__*/jsx(Tippy, _objectSpread$5(_objectSpread$5({
     onClose: onClose,
     hideOnEsc: true,
     interactive: true,
@@ -18507,7 +18511,7 @@ var Dropdown = function Dropdown(_ref2) {
     }
   }, otherProps), {}, {
     children: /*#__PURE__*/jsx("span", {
-      children: /*#__PURE__*/jsx(Button, _objectSpread$4({}, _objectSpread$4({
+      children: /*#__PURE__*/jsx(Button, _objectSpread$5({}, _objectSpread$5({
         icon: icon,
         onClick: onClick
       }, buttonProps)))
@@ -18580,8 +18584,8 @@ var Option = function Option(_ref) {
   });
 };
 
-function ownKeys$3(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$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$4(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$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var t = i18n.t;
 var createMenuOptions$1 = function createMenuOptions(_ref) {
   var editor = _ref.editor,
@@ -18740,7 +18744,7 @@ var buildOptionsFromAddonCommands$1 = function buildOptionsFromAddonCommands(_re
   var to = editor.state.selection.to;
   return commands.map(function (option) {
     var _option$active;
-    return _objectSpread$3(_objectSpread$3({}, option), {}, {
+    return _objectSpread$4(_objectSpread$4({}, option), {}, {
       active: (_option$active = option.active) === null || _option$active === void 0 ? void 0 : _option$active.call(option, {
         editor: editor
       }),
@@ -18782,8 +18786,8 @@ var buildMenuOptions$1 = function buildMenuOptions(_ref3) {
   }).filter(Boolean);
 };
 
-function ownKeys$2(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$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$3(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$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Headless = function Headless(_ref) {
   var editor = _ref.editor,
     options = _ref.options,
@@ -18821,7 +18825,7 @@ var Headless = function Headless(_ref) {
   return /*#__PURE__*/jsxs("div", {
     className: classnames("ne-headless", _defineProperty({}, className, className)),
     children: [allOptions.map(function (option) {
-      return /*#__PURE__*/createElement(Option, _objectSpread$2({
+      return /*#__PURE__*/createElement(Option, _objectSpread$3({
         editor: editor,
         key: option.optionName
       }, option));
@@ -18961,6 +18965,166 @@ var FontSizeOption = function FontSizeOption(_ref) {
 };
 var FontSizeOption$1 = /*#__PURE__*/memo(FontSizeOption);
 
+function ownKeys$2(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$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var ColorDot = function ColorDot(_ref) {
+  var colorVar = _ref.colorVar,
+    isSelected = _ref.isSelected,
+    onClick = _ref.onClick,
+    isTextColor = _ref.isTextColor;
+  var dotClass = classnames("neeto-editor-highlight-dropdown__color-dot", {
+    "neeto-editor-highlight-dropdown__color-dot--selected": isSelected,
+    "neeto-editor-highlight-dropdown__color-dot--background": !isTextColor
+  });
+  var dotStyle = _objectSpread$2({}, isTextColor ? {
+    color: "var(".concat(colorVar, ")")
+  } : {
+    backgroundColor: "var(".concat(colorVar, ")")
+  });
+  return /*#__PURE__*/jsx("div", {
+    onClick: onClick,
+    className: dotClass,
+    style: dotStyle,
+    children: isTextColor && /*#__PURE__*/jsx(Typography, {
+      className: "neeto-editor-highlight-dropdown__color-dot-text",
+      style: "body2",
+      weight: "semibold",
+      children: "A"
+    })
+  });
+};
+
+var ColorDotIcon = function ColorDotIcon(_ref) {
+  var textColor = _ref.textColor,
+    backgroundColor = _ref.backgroundColor;
+  var dotClass = classnames("neeto-editor-highlight-dropdown__color-dot", {});
+  var dotStyle = {
+    color: "var(".concat(textColor, ")"),
+    backgroundColor: "var(".concat(backgroundColor, ")")
+  };
+  return /*#__PURE__*/jsx("div", {
+    className: dotClass,
+    style: dotStyle,
+    children: /*#__PURE__*/jsx(Typography, {
+      className: "neeto-editor-highlight-dropdown__color-dot-text",
+      style: "body2",
+      weight: "semibold",
+      children: "A"
+    })
+  });
+};
+
+var COLORS = {
+  recent: ["--neeto-editor-highlight-bg-yellow-light"],
+  text: ["--neeto-editor-highlight-text-1", "--neeto-editor-highlight-text-2", "--neeto-editor-highlight-text-3", "--neeto-editor-highlight-text-4", "--neeto-editor-highlight-text-5", "--neeto-editor-highlight-text-6", "--neeto-editor-highlight-text-7", "--neeto-editor-highlight-text-8", "--neeto-editor-highlight-text-9", "--neeto-editor-highlight-text-10"],
+  background: ["--neeto-editor-highlight-bg-1", "--neeto-editor-highlight-bg-2", "--neeto-editor-highlight-bg-3", "--neeto-editor-highlight-bg-4", "--neeto-editor-highlight-bg-5", "--neeto-editor-highlight-bg-6", "--neeto-editor-highlight-bg-7", "--neeto-editor-highlight-bg-8", "--neeto-editor-highlight-bg-9", "--neeto-editor-highlight-bg-10"]
+};
+
+var colorSections = [{
+  title: "Text color",
+  colors: COLORS.text,
+  isTextColor: true
+}, {
+  title: "Background color",
+  colors: COLORS.background,
+  isTextColor: false
+}];
+var HighlightDropdown = function HighlightDropdown(_ref) {
+  var editor = _ref.editor,
+    label = _ref.label,
+    tooltipContent = _ref.tooltipContent,
+    runEditorCommand = _ref.runEditorCommand;
+  var dropdownRef = useRef(null);
+  var textColor = editor.getAttributes("textStyle").color;
+  var backgroundColor = editor.getAttributes("textStyle").backgroundColor;
+  var updateBackgroundColor = function updateBackgroundColor(value) {
+    runEditorCommand(function (editor) {
+      return editor.chain().focus().setMark("textStyle", {
+        backgroundColor: value
+      }).run();
+    })();
+  };
+  var handleBackgroundColorClick = function handleBackgroundColorClick(colorVar) {
+    if (backgroundColor === "var(".concat(colorVar, ")")) {
+      updateBackgroundColor(null);
+    } else {
+      updateBackgroundColor("var(".concat(colorVar, ")"));
+    }
+  };
+  var handleTextColorClick = function handleTextColorClick(colorVar) {
+    if (textColor === "var(".concat(colorVar, ")")) {
+      editor.chain().focus().unsetColor().run();
+    } else {
+      editor.chain().focus().setColor("var(".concat(colorVar, ")")).run();
+    }
+  };
+  var renderColorDots = function renderColorDots(colorList) {
+    var isTextColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    return colorList.map(function (colorVar, idx) {
+      return /*#__PURE__*/createElement(ColorDot, {
+        colorVar: colorVar,
+        isTextColor: isTextColor,
+        key: idx,
+        isSelected: isTextColor ? textColor === "var(".concat(colorVar, ")") : backgroundColor === "var(".concat(colorVar, ")"),
+        onClick: function onClick() {
+          return isTextColor ? handleTextColorClick(colorVar) : handleBackgroundColorClick(colorVar);
+        }
+      });
+    });
+  };
+  return /*#__PURE__*/jsx(Dropdown$1, {
+    autoWidth: true,
+    placement: "bottom-start",
+    strategy: "fixed",
+    buttonProps: {
+      icon: function icon() {
+        return /*#__PURE__*/jsx(ColorDotIcon, {
+          backgroundColor: backgroundColor,
+          textColor: textColor
+        });
+      },
+      iconPosition: "left",
+      iconSize: 20,
+      label: /*#__PURE__*/jsx(Down, {
+        size: 12
+      }),
+      ref: dropdownRef,
+      "data-cy": "neeto-editor-fixed-menu-highlight-option",
+      onKeyDown: function onKeyDown(event) {
+        var _dropdownRef$current;
+        return event.key === "ArrowDown" && ((_dropdownRef$current = dropdownRef.current) === null || _dropdownRef$current === void 0 ? void 0 : _dropdownRef$current.click());
+      },
+      tooltipProps: {
+        content: tooltipContent !== null && tooltipContent !== void 0 ? tooltipContent : label,
+        position: "bottom"
+      },
+      style: "text",
+      size: "small",
+      className: "neeto-editor-fixed-menu__item"
+    },
+    children: /*#__PURE__*/jsx(Dropdown$1.Menu, {
+      className: "neeto-editor-highlight-dropdown",
+      children: colorSections.map(function (_ref2) {
+        var title = _ref2.title,
+          colors = _ref2.colors,
+          isTextColor = _ref2.isTextColor;
+        return /*#__PURE__*/jsxs("div", {
+          className: "neeto-editor-highlight-dropdown__section",
+          children: [/*#__PURE__*/jsx(Typography, {
+            className: "neeto-editor-highlight-dropdown__section-title",
+            style: "body2",
+            weight: "normal",
+            children: title
+          }), /*#__PURE__*/jsx("div", {
+            className: "neeto-editor-highlight-dropdown__color-grid",
+            children: renderColorDots(colors, isTextColor)
+          })]
+        }, title);
+      })
+    })
+  });
+};
+
 var Menu$1 = Dropdown$1.Menu;
 var TableOption = function TableOption(_ref) {
   var editor = _ref.editor,
@@ -19057,21 +19221,57 @@ var TableOption = function TableOption(_ref) {
 };
 var TableOption$1 = /*#__PURE__*/memo(TableOption);
 
+var _SHORTCUTS;
 var MENU_ELEMENT_TYPES = {
   BUTTON: "button",
   FONT_SIZE: "fontSize",
   TABLE: "table",
   TEXT_COLOR: "textColor",
   EMOJI: "emoji",
-  MENTIONS: "mentions"
+  MENTIONS: "mentions",
+  HIGHLIGHT: "highlight"
 };
-var MENU_ELEMENTS = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, MENU_ELEMENT_TYPES.BUTTON, MenuButton$1), MENU_ELEMENT_TYPES.FONT_SIZE, FontSizeOption$1), MENU_ELEMENT_TYPES.TABLE, TableOption$1), MENU_ELEMENT_TYPES.TEXT_COLOR, TextColorOption), MENU_ELEMENT_TYPES.EMOJI, EmojiOption$1), MENU_ELEMENT_TYPES.MENTIONS, Mentions$1);
-var MENU_ELEMENT_WIDTHS = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, MENU_ELEMENT_TYPES.BUTTON, 36), MENU_ELEMENT_TYPES.FONT_SIZE, 103), MENU_ELEMENT_TYPES.TABLE, 36), MENU_ELEMENT_TYPES.TEXT_COLOR, 36), MENU_ELEMENT_TYPES.EMOJI, 36), MENU_ELEMENT_TYPES.MENTIONS, 36);
+var SHORTCUTS = (_SHORTCUTS = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_SHORTCUTS, EDITOR_OPTIONS.BOLD, {
+  mac: "⌘B",
+  win: "Ctrl+B"
+}), EDITOR_OPTIONS.ITALIC, {
+  mac: "⌘I",
+  win: "Ctrl+I"
+}), EDITOR_OPTIONS.UNDERLINE, {
+  mac: "⌘U",
+  win: "Ctrl+U"
+}), EDITOR_OPTIONS.STRIKETHROUGH, {
+  mac: "⌘⇧S or ⌘⇧X",
+  win: "Ctrl+Shift+S or Ctrl+Shift+X"
+}), EDITOR_OPTIONS.CODE, {
+  mac: "⌘E",
+  win: "Ctrl+E"
+}), EDITOR_OPTIONS.UNDO, {
+  mac: "⌘Z",
+  win: "Ctrl+Z"
+}), EDITOR_OPTIONS.REDO, {
+  mac: "⌘⇧Z",
+  win: "Ctrl+Shift+Z"
+}), EDITOR_OPTIONS.LINK, {
+  mac: "⌘K",
+  win: "Ctrl+K"
+}), EDITOR_OPTIONS.HIGHLIGHT, {
+  mac: "⌘⇧H",
+  win: "Ctrl+Shift+H"
+}), "bulletList", {
+  mac: "⌘⇧8",
+  win: "Ctrl+Shift+8"
+}), _defineProperty(_SHORTCUTS, "orderedList", {
+  mac: "⌘⇧7",
+  win: "Ctrl+Shift+7"
+}));
+var MENU_ELEMENTS = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, MENU_ELEMENT_TYPES.BUTTON, MenuButton$1), MENU_ELEMENT_TYPES.FONT_SIZE, FontSizeOption$1), MENU_ELEMENT_TYPES.TABLE, TableOption$1), MENU_ELEMENT_TYPES.TEXT_COLOR, TextColorOption), MENU_ELEMENT_TYPES.EMOJI, EmojiOption$1), MENU_ELEMENT_TYPES.MENTIONS, Mentions$1), MENU_ELEMENT_TYPES.HIGHLIGHT, HighlightDropdown);
+var MENU_ELEMENT_WIDTHS = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, MENU_ELEMENT_TYPES.BUTTON, 36), MENU_ELEMENT_TYPES.FONT_SIZE, 103), MENU_ELEMENT_TYPES.TABLE, 36), MENU_ELEMENT_TYPES.TEXT_COLOR, 36), MENU_ELEMENT_TYPES.EMOJI, 36), MENU_ELEMENT_TYPES.MENTIONS, 36), MENU_ELEMENT_TYPES.HIGHLIGHT, 103);
 
 function ownKeys$1(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$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var createMenuOptions = function createMenuOptions(_ref) {
-  var _tooltips$undo, _tooltips$redo, _tooltips$fontSize, _tooltips$bold, _tooltips$italic, _tooltips$underline, _tooltips$link, _tooltips$strike, _tooltips$highlight, _tooltips$bulletList, _tooltips$orderedList, _tooltips$blockQuote, _tooltips$code, _tooltips$codeBlock, _tooltips$table, _tooltips$attachments, _tooltips$imageUpload, _tooltips$videoUpload, _tooltips$videoEmbed, _tooltips$textColor, _tooltips$emoji, _tooltips$mention;
+  var _tooltips$undo, _tooltips$redo, _tooltips$fontSize, _tooltips$bold, _tooltips$italic, _tooltips$link, _tooltips$strike, _tooltips$highlight, _tooltips$highlight2, _tooltips$bulletList, _tooltips$orderedList, _tooltips$blockQuote, _tooltips$table, _tooltips$attachments, _tooltips$imageUpload, _tooltips$videoEmbed, _tooltips$textColor, _tooltips$emoji, _tooltips$mention, _tooltips$code, _tooltips$codeBlock, _tooltips$videoUpload, _tooltips$underline;
   var tooltips = _ref.tooltips,
     setMediaUploader = _ref.setMediaUploader,
     attachmentProps = _ref.attachmentProps,
@@ -19082,7 +19282,8 @@ var createMenuOptions = function createMenuOptions(_ref) {
     addonCommandOptions = _ref.addonCommandOptions,
     setIsEmojiPickerActive = _ref.setIsEmojiPickerActive,
     isEmojiPickerActive = _ref.isEmojiPickerActive,
-    runEditorCommand = _ref.runEditorCommand;
+    runEditorCommand = _ref.runEditorCommand,
+    editor = _ref.editor;
   var fontSizeOptions = options.filter(function (option) {
     return option.match(/^h[1-6]$/);
   });
@@ -19133,15 +19334,6 @@ var createMenuOptions = function createMenuOptions(_ref) {
     }),
     optionName: EDITOR_OPTIONS.ITALIC,
     label: (_tooltips$italic = tooltips.italic) !== null && _tooltips$italic !== void 0 ? _tooltips$italic : t$1("neetoEditor.menu.italic")
-  }, {
-    type: MENU_ELEMENT_TYPES.BUTTON,
-    icon: Underline,
-    isEnabled: options.includes(EDITOR_OPTIONS.UNDERLINE),
-    command: runEditorCommand(function (editor) {
-      return editor.chain().focus().toggleUnderline().run();
-    }),
-    optionName: EDITOR_OPTIONS.UNDERLINE,
-    label: (_tooltips$underline = tooltips.underline) !== null && _tooltips$underline !== void 0 ? _tooltips$underline : t$1("neetoEditor.menu.underline")
   }, {
     type: MENU_ELEMENT_TYPES.BUTTON,
     icon: Link,
@@ -19161,14 +19353,14 @@ var createMenuOptions = function createMenuOptions(_ref) {
     optionName: EDITOR_OPTIONS.STRIKETHROUGH,
     label: (_tooltips$strike = tooltips.strike) !== null && _tooltips$strike !== void 0 ? _tooltips$strike : t$1("neetoEditor.menu.strike")
   }, {
-    type: MENU_ELEMENT_TYPES.BUTTON,
+    type: MENU_ELEMENT_TYPES.HIGHLIGHT,
     icon: Highlight,
+    label: (_tooltips$highlight = tooltips.highlight) !== null && _tooltips$highlight !== void 0 ? _tooltips$highlight : t$1("neetoEditor.menu.highlight"),
     isEnabled: options.includes(EDITOR_OPTIONS.HIGHLIGHT),
-    command: runEditorCommand(function (editor) {
-      return editor.chain().focus().toggleHighlight().run();
-    }),
     optionName: EDITOR_OPTIONS.HIGHLIGHT,
-    label: (_tooltips$highlight = tooltips.highlight) !== null && _tooltips$highlight !== void 0 ? _tooltips$highlight : t$1("neetoEditor.menu.highlight")
+    editor: editor,
+    runEditorCommand: runEditorCommand,
+    tooltipContent: (_tooltips$highlight2 = tooltips.highlight) !== null && _tooltips$highlight2 !== void 0 ? _tooltips$highlight2 : t$1("neetoEditor.menu.highlight")
   }],
   // list
   [{
@@ -19203,24 +19395,6 @@ var createMenuOptions = function createMenuOptions(_ref) {
     optionName: "blockquote",
     highlight: true,
     label: (_tooltips$blockQuote = tooltips.blockQuote) !== null && _tooltips$blockQuote !== void 0 ? _tooltips$blockQuote : t$1("neetoEditor.menu.blockQuote")
-  }, {
-    type: MENU_ELEMENT_TYPES.BUTTON,
-    icon: Code,
-    command: runEditorCommand(function (editor) {
-      return editor.chain().focus().toggleCode().run();
-    }),
-    isEnabled: options.includes(EDITOR_OPTIONS.CODE),
-    optionName: EDITOR_OPTIONS.CODE,
-    label: (_tooltips$code = tooltips.code) !== null && _tooltips$code !== void 0 ? _tooltips$code : t$1("neetoEditor.menu.code")
-  }, {
-    type: MENU_ELEMENT_TYPES.BUTTON,
-    icon: CodeBlock,
-    command: runEditorCommand(function (editor) {
-      return editor.chain().focus().toggleCodeBlock().run();
-    }),
-    isEnabled: options.includes(EDITOR_OPTIONS.CODE_BLOCK),
-    optionName: "codeBlock",
-    label: (_tooltips$codeBlock = tooltips.codeBlock) !== null && _tooltips$codeBlock !== void 0 ? _tooltips$codeBlock : t$1("neetoEditor.menu.codeBlock")
   }],
   // misc
   [{
@@ -19247,15 +19421,6 @@ var createMenuOptions = function createMenuOptions(_ref) {
     isEnabled: options.includes(EDITOR_OPTIONS.IMAGE_UPLOAD),
     optionName: EDITOR_OPTIONS.IMAGE_UPLOAD,
     label: (_tooltips$imageUpload = tooltips.imageUpload) !== null && _tooltips$imageUpload !== void 0 ? _tooltips$imageUpload : t$1("neetoEditor.menu.imageUpload")
-  }, {
-    type: MENU_ELEMENT_TYPES.BUTTON,
-    icon: Video,
-    command: function command() {
-      return setMediaUploader(assoc("video", true));
-    },
-    isEnabled: options.includes(EDITOR_OPTIONS.VIDEO_UPLOAD),
-    optionName: EDITOR_OPTIONS.VIDEO_UPLOAD,
-    label: (_tooltips$videoUpload = tooltips.videoUpload) !== null && _tooltips$videoUpload !== void 0 ? _tooltips$videoUpload : t$1("neetoEditor.menu.videoUpload")
   }, {
     type: MENU_ELEMENT_TYPES.BUTTON,
     icon: MediaVideo,
@@ -19285,6 +19450,42 @@ var createMenuOptions = function createMenuOptions(_ref) {
     isEnabled: isNotEmpty(mentions),
     optionName: "mentions",
     mentions: mentions
+  }, {
+    type: MENU_ELEMENT_TYPES.BUTTON,
+    icon: Code,
+    command: runEditorCommand(function (editor) {
+      return editor.chain().focus().toggleCode().run();
+    }),
+    isEnabled: options.includes(EDITOR_OPTIONS.CODE),
+    optionName: EDITOR_OPTIONS.CODE,
+    label: (_tooltips$code = tooltips.code) !== null && _tooltips$code !== void 0 ? _tooltips$code : t$1("neetoEditor.menu.code")
+  }, {
+    type: MENU_ELEMENT_TYPES.BUTTON,
+    icon: CodeBlock,
+    command: runEditorCommand(function (editor) {
+      return editor.chain().focus().toggleCodeBlock().run();
+    }),
+    isEnabled: options.includes(EDITOR_OPTIONS.CODE_BLOCK),
+    optionName: "codeBlock",
+    label: (_tooltips$codeBlock = tooltips.codeBlock) !== null && _tooltips$codeBlock !== void 0 ? _tooltips$codeBlock : t$1("neetoEditor.menu.codeBlock")
+  }, {
+    type: MENU_ELEMENT_TYPES.BUTTON,
+    icon: Video,
+    command: function command() {
+      return setMediaUploader(assoc("video", true));
+    },
+    isEnabled: options.includes(EDITOR_OPTIONS.VIDEO_UPLOAD),
+    optionName: EDITOR_OPTIONS.VIDEO_UPLOAD,
+    label: (_tooltips$videoUpload = tooltips.videoUpload) !== null && _tooltips$videoUpload !== void 0 ? _tooltips$videoUpload : t$1("neetoEditor.menu.videoUpload")
+  }, {
+    type: MENU_ELEMENT_TYPES.BUTTON,
+    icon: Underline,
+    isEnabled: options.includes(EDITOR_OPTIONS.UNDERLINE),
+    command: runEditorCommand(function (editor) {
+      return editor.chain().focus().toggleUnderline().run();
+    }),
+    optionName: EDITOR_OPTIONS.UNDERLINE,
+    label: (_tooltips$underline = tooltips.underline) !== null && _tooltips$underline !== void 0 ? _tooltips$underline : t$1("neetoEditor.menu.underline")
   }], //addons
   _toConsumableArray(addonCommandOptions)];
 };
@@ -19319,7 +19520,8 @@ var buildMenuOptions = function buildMenuOptions(_ref3) {
     addonCommands = _ref3.addonCommands,
     setIsEmojiPickerActive = _ref3.setIsEmojiPickerActive,
     isEmojiPickerActive = _ref3.isEmojiPickerActive,
-    runEditorCommand = _ref3.runEditorCommand;
+    runEditorCommand = _ref3.runEditorCommand,
+    editor = _ref3.editor;
   var addonCommandOptions = buildOptionsFromAddonCommands({
     commands: addonCommands,
     runEditorCommand: runEditorCommand
@@ -19335,7 +19537,8 @@ var buildMenuOptions = function buildMenuOptions(_ref3) {
     addonCommandOptions: addonCommandOptions,
     setIsEmojiPickerActive: setIsEmojiPickerActive,
     isEmojiPickerActive: isEmojiPickerActive,
-    runEditorCommand: runEditorCommand
+    runEditorCommand: runEditorCommand,
+    editor: editor
   });
   return menuOptions.map(function (option) {
     return option.filter(prop("isEnabled"));
@@ -19413,6 +19616,15 @@ var getLinkPopoverPosition = function getLinkPopoverPosition(editor, popoverRef)
     popoverPosition: popoverPosition
   };
 };
+function renderTooltipContent(label, optionName) {
+  var shortcut = SHORTCUTS[optionName];
+  if (!shortcut) return label;
+  var isMac = function isMac() {
+    return typeof window !== "undefined" && /Mac|iPod|iPhone|iPad/.test(window.navigator.userAgent);
+  };
+  var key = isMac() ? shortcut.mac : shortcut.win;
+  return "".concat(label, " (").concat(key, ")");
+}
 
 var css = ".neeto-editor-fixed-menu{background-color:rgb(var(--neeto-ui-white));border:thin solid rgb(var(--neeto-ui-gray-400));border-bottom:none;border-radius:var(--neeto-ui-rounded) var(--neeto-ui-rounded) 0 0;display:flex;position:relative}.neeto-editor-fixed-menu--independant{border-bottom:thin solid rgb(var(--neeto-ui-gray-400));border-radius:0;border-radius:initial}.neeto-editor-fixed-menu--independant .neeto-editor-fixed-menu__wrapper{border-bottom:0!important}.neeto-editor-fixed-menu--independant .neeto-editor-fixed-menu__wrapper button.neeto-editor-fixed-menu__item .neeto-ui-btn__icon path{stroke-width:1.8px}.neeto-editor-fixed-menu__item{border-radius:0}.neeto-editor-fixed-menu button.neeto-editor-fixed-menu__item{--neeto-ui-btn-border-radius:0;--neeto-ui-btn-icon-size:22px;--neeto-ui-btn-padding-x:0;--neeto-ui-btn-padding-y:0;--neeto-ui-btn-focus-box-shadow:none;align-items:center;height:36px;justify-content:center;min-width:-moz-fit-content;min-width:fit-content;padding:0;width:36px}.neeto-editor-fixed-menu button.neeto-editor-fixed-menu__item .neeto-ui-btn__icon{color:rgb(var(--neeto-ui-black))}.neeto-editor-fixed-menu button.neeto-editor-fixed-menu__item .neeto-ui-btn__icon path{stroke-width:1.5px}.neeto-editor-fixed-menu button.neeto-editor-fixed-menu__item:hover{background-color:rgb(var(--neeto-ui-gray-100))}.neeto-editor-fixed-menu button.neeto-editor-fixed-menu__item.neeto-ui-btn--style-secondary{background-color:rgb(var(--neeto-ui-accent-100))}.neeto-editor-fixed-menu button.neeto-editor-fixed-menu__item.neeto-ui-btn--style-secondary .neeto-ui-btn__icon{color:rgb(var(--neeto-ui-accent-800))}.neeto-editor-fixed-menu__wrapper{align-items:center;border-bottom:thin solid rgb(var(--neeto-ui-gray-400));display:flex;flex-grow:1;justify-content:flex-start;padding:0 2px;width:100%}.neeto-editor-fixed-menu__wrapper__button-group{display:flex}.neeto-editor-fixed-menu__variables{bottom:-42px;position:absolute;right:8px;z-index:10}.neeto-editor-fixed-menu__variables .neeto-editor-menu__item{background-color:rgb(var(--neeto-ui-gray-700));border-radius:var(--neeto-ui-rounded-sm);padding:4px}.neeto-editor-fixed-menu__variables .neeto-editor-menu__item.active,.neeto-editor-fixed-menu__variables .neeto-editor-menu__item:hover{background-color:rgb(var(--neeto-ui-gray-600))}.neeto-editor-fixed-menu__right-options{display:flex}.neeto-editor-fixed-menu__emoji-dropdown{max-height:none!important}.neeto-editor-fixed-menu__separator{display:flex;height:28px;width:32px}.neeto-editor-fixed-menu__separator span{width:100%}.neeto-editor-fixed-menu__separator span:first-child{border-right:1px solid rgb(var(--neeto-ui-gray-200))}.neeto-editor-text-color-option__options-group{align-items:center;display:flex;gap:8px;margin:8px 4px}.neeto-editor-text-color-option__options-group__input{max-width:120px}.neeto-editor-text-color-option__options-group__reset-button{align-self:center}.react-colorful{width:100%!important}.neeto-editor-menu__item{align-items:center;border-radius:2px;cursor:pointer;display:flex;flex-direction:row;gap:4px;justify-content:center;padding:8px;transition:var(--neeto-ui-transition)}.neeto-editor-menu__item p{color:rgb(var(--neeto-ui-gray-600));font-size:var(--neeto-ui-text-xs);line-height:1;white-space:nowrap}.neeto-editor-menu__item.active,.neeto-editor-menu__item:hover{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-editor-menu__item:focus,.neeto-editor-menu__item:focus-visible{outline:rgb(var(--neeto-ui-gray-300)) auto 1px}.neeto-editor-menu__item input[type=color]{height:0;visibility:hidden;width:0}.neeto-editor-menu__item:disabled{background-color:rgb(var(--neeto-ui-gray-100));opacity:.5}.neeto-editor-link__item{align-items:flex-start;justify-content:flex-start}.neeto-editor-link__item,.neeto-editor-table__item{display:flex!important;flex-direction:row;gap:8px;padding:8px!important}.neeto-editor-table__item{min-width:210px}.neeto-editor-table__item input{max-width:60px!important}.neeto-editor-table__options-menu{display:flex;flex-direction:column;gap:8px;max-height:150px!important;overflow:scroll;padding:8px!important}.neeto-editor-font-size__wrapper{font-size:16px;font-weight:var(--neeto-ui-font-normal)!important;padding-left:4px!important;padding-right:4px!important}.neeto-editor-bubble-menu{align-items:center;background:rgb(var(--neeto-ui-gray-800));border-radius:var(--neeto-ui-rounded);display:flex;flex-direction:row;gap:1px;justify-content:flex-start;padding:0 4px;position:relative}.neeto-editor-bubble-menu button.neeto-ui-btn--style-text{color:rgb(var(--neeto-ui-gray-200));min-width:-moz-fit-content;min-width:fit-content}.neeto-editor-bubble-menu button.neeto-ui-btn--style-text.active,.neeto-editor-bubble-menu button.neeto-ui-btn--style-text:active,.neeto-editor-bubble-menu button.neeto-ui-btn--style-text:hover{background-color:rgb(var(--neeto-ui-gray-600))!important;color:rgb(var(--neeto-ui-gray-200))!important}.neeto-editor-bubble-menu button.neeto-ui-btn--style-secondary{background-color:rgb(var(--neeto-ui-gray-400));min-width:-moz-fit-content;min-width:fit-content}.neeto-editor-bubble-menu .neeto-ui-dropdown__popup{background-color:rgb(var(--neeto-ui-gray-700))}.neeto-editor-bubble-menu .neeto-ui-dropdown__popup-menu-item-btn{background-color:inherit!important;color:rgb(var(--neeto-ui-gray-200))!important}.neeto-editor-bubble-menu .neeto-ui-dropdown__popup-menu-item-btn.active,.neeto-editor-bubble-menu .neeto-ui-dropdown__popup-menu-item-btn:active,.neeto-editor-bubble-menu .neeto-ui-dropdown__popup-menu-item-btn:hover{background-color:rgb(var(--neeto-ui-gray-600))!important}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__link{align-items:center;display:flex;gap:8px;justify-content:space-between;padding:6px;width:256px}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__link .neeto-editor-bubble-menu-link__input{background-color:transparent;color:rgb(var(--neeto-ui-gray-200));line-height:20px;outline:none;width:100%}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__link .neeto-editor-bubble-menu-link__input::-moz-placeholder{color:rgba(.4);color:rgba(var(--neeto-ui-white,.4))}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__link .neeto-editor-bubble-menu-link__input::placeholder{color:rgba(.4);color:rgba(var(--neeto-ui-white,.4))}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__link .ne-btn--icon-only{min-height:0;opacity:.8;padding:0}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__link .ne-btn--icon-only:hover{opacity:1}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table{align-items:center;display:flex;gap:6px;justify-content:space-between;max-width:256px;padding:4px}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table input{background-color:rgba(var(--neeto-ui-gray-400),.2);height:24px;line-height:20px;outline:none;padding:3px 5px;width:60px}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table input::-moz-placeholder{color:rgba(.4);color:rgba(var(--neeto-ui-white,.4))}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table input::placeholder{color:rgba(.4);color:rgba(var(--neeto-ui-white,.4))}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table__menu-item{display:flex;flex-direction:column;gap:4px}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table__input-label{color:#fff}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table__buttons{align-self:flex-end;display:flex;gap:4px;justify-content:space-between}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__table__options{display:flex;flex-direction:column;gap:2px;max-height:190px;overflow:scroll}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__dropdown-target{align-items:center;display:flex;font-size:var(--neeto-ui-text-xs);gap:4px;line-height:var(--neeto-ui-leading-normal);white-space:nowrap}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__dropdown{align-items:flex-start;display:flex;flex-direction:column}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__dropdown .neeto-editor-bubble-menu__dropdown-item{font-size:var(--neeto-ui-text-xs);padding:8px 12px;text-align:left;width:100%}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__dropdown .neeto-editor-bubble-menu__dropdown-item:first-child{border-top-left-radius:var(--neeto-ui-rounded);border-top-right-radius:var(--neeto-ui-rounded)}.neeto-editor-bubble-menu .neeto-editor-bubble-menu__dropdown .neeto-editor-bubble-menu__dropdown-item:last-child{border-bottom-left-radius:var(--neeto-ui-rounded);border-bottom-right-radius:var(--neeto-ui-rounded)}.neeto-editor-bubble-menu-animate-shake{animation:shake 1s linear infinite alternate both}.neeto-editor-table-menu__button{align-items:flex-end;display:flex}.neeto-editor__image-menu .neeto-ui-dropdown__popup{display:flex;min-width:0;min-width:auto}.neeto-editor__image-menu .neeto-ui-dropdown__popup .neeto-ui-btn .neeto-ui-btn__icon{height:18px!important;width:18px!important}.neeto-editor__image-menu-btn{border-radius:100%;position:absolute!important;right:6px;top:6px;z-index:1}.neeto-editor-menu-font-size-options{padding:8px!important}.neeto-editor-menu-font-size-options .neeto-ui-dropdown__popup-menu-item{background-color:transparent!important}.neeto-editor-menu-font-size-options .neeto-editor-menu-font-size-options__item-btn{border-radius:var(--neeto-ui-btn-border-radius)!important;justify-content:center;min-height:34px;min-width:34px;overflow:hidden;padding-left:0!important;padding-right:0!important;text-align:center}.neeto-editor-menu-font-size-options .neeto-editor-menu-font-size-options__item-btn--selected{background-color:rgb(var(--neeto-ui-accent-100))!important;color:rgb(var(--neeto-ui-accent-800))!important}";
 n(css,{});
@@ -19482,4 +19694,4 @@ var Menu = function Menu(props) {
 };
 
 export { combineTransactionSteps as A, getChangedRanges as B, findChildrenInRange as C, DecorationSet as D, Extension as E, getMarksBetween as F, getAttributes as G, highlightFocussedNode as H, InputRule as I, resetFocussedNode as J, findParentNodeClosestToPos as K, BubbleMenu as L, Menu as M, Node as N, getLinkPopoverPosition as O, PasteRule as P, getMarkType as Q, ReactNodeViewRenderer as R, getMarkRange as S, useEditor as T, useEditorState$1 as U, EditorContent as V, MediaUploader as W, EmbedOption as X, EditorView as Y, Mark as a, markInputRule as b, markPasteRule as c, Decoration as d, isAtStartOfNode as e, isAtEndOfNode as f, getMarkAttributes as g, getNodeType$1 as h, isNodeActive as i, getNodeAtPosition as j, keydownHandler as k, callOrReturn as l, mergeAttributes as m, getExtensionField as n, isNodeSelection as o, nodeInputRule as p, findChildren as q, NodeViewWrapper as r, NodeViewContent as s, textblockTypeInputRule as t, escapeForRegEx as u, validateUrl as v, wrappingInputRule as w, ReactRenderer as x, EmojiPickerMenu as y, emojiPickerApi as z };
-//# sourceMappingURL=chunk-C7yqzIpq.js.map
+//# sourceMappingURL=chunk-CeFnZWjP.js.map