@onereach/ui-components 19.3.0-beta.5046.0 → 19.3.0-beta.5083.0

package/dist/esm/components/or-rich-text-editor-v3/index.js

@@ -1,912 +0,0 @@
-import { Node, Editor, mergeAttributes } from '@tiptap/core';
-import Blockquote from '@tiptap/extension-blockquote';
-import BulletList from '@tiptap/extension-bullet-list';
-import Heading from '@tiptap/extension-heading';
-import Highlight from '@tiptap/extension-highlight';
-import Link from '@tiptap/extension-link';
-import OrderedList from '@tiptap/extension-ordered-list';
-import Paragraph from '@tiptap/extension-paragraph';
-import Placeholder from '@tiptap/extension-placeholder';
-import Underline from '@tiptap/extension-underline';
-import StarterKit from '@tiptap/starter-kit';
-import { useResizeObserver, useDebounceFn, onClickOutside } from '@vueuse/core';
-import { useFocusTrap } from '@vueuse/integrations/useFocusTrap';
-import { defineComponent, shallowRef, ref, onMounted, onBeforeUnmount, computed, watch, nextTick, resolveComponent, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, createElementVNode, Fragment, renderList, withDirectives, vShow, vModelText } from 'vue';
-import '../../dom-11141778.js';
-import { i as isArray } from '../../isArray-135d4ff2.js';
-import { OrButtonV3 as script$1 } from '../or-button-v3/index.js';
-import { OrErrorV3 as script$2 } from '../or-error-v3/index.js';
-import { OrHintV3 as script$3 } from '../or-hint-v3/index.js';
-import { OrIconButtonV3 as script$4 } from '../or-icon-button-v3/index.js';
-import { OrInputBoxV3 as script$6 } from '../or-input-box-v3/index.js';
-import { OrInputV3 as script$5 } from '../or-input-v3/index.js';
-import { OrLabelV3 as script$7 } from '../or-label-v3/index.js';
-import { OrMenuItemV3 as script$9 } from '../or-menu-item-v3/index.js';
-import { OrMenuV3 as script$8 } from '../or-menu-v3/index.js';
-import { OrModalV3 as script$a } from '../or-modal-v3/index.js';
-import { OrPopoverV3 as script$b } from '../or-popover-v3/index.js';
-import { CodeMirrorView } from './utils/codemirror/index.js';
-import { minimalSetup } from 'codemirror';
-import { javascript } from '@codemirror/lang-javascript';
-import { defaultMarkdownSerializer, MarkdownSerializer } from 'prosemirror-markdown';
-import { DOMParser as DOMParser$1 } from 'prosemirror-model';
-import { marked } from 'marked';
-import ListItem from '@tiptap/extension-list-item';
-import Strike from '@tiptap/extension-strike';
-import Italic from '@tiptap/extension-italic';
-import HardBreak from '@tiptap/extension-hard-break';
-import HorizontalRule from '@tiptap/extension-horizontal-rule';
-import Bold from '@tiptap/extension-bold';
-import CodeBlock from '@tiptap/extension-code-block';
-import { s as styleInject } from '../../style-inject.es-87955792.js';
-import 'lodash/get';
-import 'lodash/isElement';
-import '../../constants-57e8b5da.js';
-import '../or-loader-v3/index.js';
-import '../or-icon-v3/index.js';
-import '../or-tooltip-v3/index.js';
-import '../../types/index.js';
-import '../../usePopoverState-1375352d.js';
-import '@onereach/styles/screens.json';
-import '@onereach/styles/tailwind.config.json';
-import '@floating-ui/dom';
-import '../../useElevation-2bd909b2.js';
-import '../../isVisible-b09c9caa.js';
-import '../../hooks/useResponsive/index.js';
-import '../or-bottom-sheet-v3/index.js';
-import '../or-overlay-v3/index.js';
-import '../or-teleport-v3/index.js';
-import '../../useTheme-4aadb85e.js';
-import '../or-popover-v3/utils/index.js';
-import '../../isAncestor-905b8d1d.js';
-import '../../useIdAttribute-1a4eafac.js';
-import '../../useProxyModelValue-55ed539b.js';
-import '../../useValidationAttributes-6ba5deb5.js';
-import 'prosemirror-state';
-import 'prosemirror-commands';
-import '@codemirror/state';
-import '@codemirror/view';
-import '@codemirror/language';
-import '@lezer/highlight';
-
-var Formats;
-(function (Formats) {
-  Formats["Markdown"] = "markdown";
-  Formats["Markup"] = "markup";
-})(Formats || (Formats = {}));
-var RichTextEditorIcons;
-(function (RichTextEditorIcons) {
-  RichTextEditorIcons["bold"] = "format_bold";
-  RichTextEditorIcons["italic"] = "format_italic";
-  RichTextEditorIcons["underline"] = "format_underlined";
-  RichTextEditorIcons["strike"] = "format_strikethrough";
-  RichTextEditorIcons["bulletList"] = "format_list_bulleted";
-  RichTextEditorIcons["orderedList"] = "format_list_numbered";
-  RichTextEditorIcons["link"] = "link";
-  RichTextEditorIcons["highlight"] = "highlight";
-  RichTextEditorIcons["redo"] = "redo";
-  RichTextEditorIcons["undo"] = "undo";
-  RichTextEditorIcons["codeBlock"] = "code_blocks";
-  RichTextEditorIcons["blockquote"] = "format_quote";
-  RichTextEditorIcons["file"] = "attach_file";
-  RichTextEditorIcons["source"] = "source_notes";
-})(RichTextEditorIcons || (RichTextEditorIcons = {}));
-var RichTextEditorTooltips;
-(function (RichTextEditorTooltips) {
-  RichTextEditorTooltips["bold"] = "Bold";
-  RichTextEditorTooltips["italic"] = "Italic";
-  RichTextEditorTooltips["underline"] = "Underline";
-  RichTextEditorTooltips["strike"] = "Strike";
-  RichTextEditorTooltips["bulletList"] = "Bulleted List";
-  RichTextEditorTooltips["orderedList"] = "Numbered List";
-  RichTextEditorTooltips["link"] = "Link";
-  RichTextEditorTooltips["highlight"] = "Highlight";
-  RichTextEditorTooltips["redo"] = "Redo";
-  RichTextEditorTooltips["undo"] = "Undo";
-  RichTextEditorTooltips["codeBlock"] = "Code Block";
-  RichTextEditorTooltips["blockquote"] = "Quote";
-  RichTextEditorTooltips["file"] = "File";
-  RichTextEditorTooltips["source"] = "Source";
-})(RichTextEditorTooltips || (RichTextEditorTooltips = {}));
-
-const RichTextEditor = [
-// Layout
-'layout-column',
-// Spacing
-'gap-xs',
-// Box
-'max-h-full'];
-const RichTextEditorToolbar = [
-// Layout
-'layout-row',
-// Spacing
-'px-0', 'py-sm',
-// Theme
-'border-b-1', 'theme-border-outline', 'dark:theme-border-outline-dark'];
-const RichTextEditorToolbarGroup = [
-// Layout
-'layout-row',
-// Spacing
-'px-sm', 'py-0', 'gap-md',
-// Theme
-'theme-foreground-outline', 'dark:theme-foreground-outline-dark', 'border-e-1 last:border-e-0', 'theme-border-outline', 'dark:theme-border-outline-dark'];
-const RichTextEditorControl = [
-// Typography
-'typography-body-2-regular',
-// Size
-'h-full'];
-
-var codemirrorNode = Node.create({
-  name: 'codeBlock',
-  content: 'text*',
-  marks: '',
-  group: 'block',
-  code: true,
-  defining: true,
-  isolating: true,
-  parseHTML() {
-    return [{
-      tag: 'pre',
-      preserveWhitespace: 'full'
-    }];
-  },
-  renderHTML() {
-    return ['pre', ['code', 0]];
-  },
-  addNodeView() {
-    return ({
-      node,
-      editor,
-      getPos
-    }) => {
-      return new CodeMirrorView({
-        node,
-        view: editor.view,
-        getPos: getPos,
-        cmOptions: {
-          extensions: [minimalSetup, javascript()]
-        }
-      });
-    };
-  }
-});
-
-const mdSerializerNodes = {
-  ...defaultMarkdownSerializer.nodes,
-  [Paragraph.name]: defaultMarkdownSerializer.nodes.paragraph,
-  [BulletList.name]: defaultMarkdownSerializer.nodes.bullet_list,
-  [ListItem.name]: defaultMarkdownSerializer.nodes.list_item,
-  [OrderedList.name]: defaultMarkdownSerializer.nodes.ordered_list,
-  [HardBreak.name]: defaultMarkdownSerializer.nodes.hard_break,
-  [CodeBlock.name]: defaultMarkdownSerializer.nodes.code_block,
-  [Blockquote.name]: defaultMarkdownSerializer.nodes.blockquote,
-  [HorizontalRule.name]: defaultMarkdownSerializer.nodes.horizontal_rule
-};
-const mdSerializerMarks = {
-  ...defaultMarkdownSerializer.marks,
-  [Bold.name]: defaultMarkdownSerializer.marks.strong,
-  [Strike.name]: {
-    open: '~~',
-    close: '~~',
-    mixable: true,
-    expelEnclosingWhitespace: true
-  },
-  [Italic.name]: {
-    open: ' _',
-    close: '_ ',
-    mixable: true,
-    expelEnclosingWhitespace: true
-  },
-  [Highlight.name]: {
-    open: '==',
-    close: '==',
-    mixable: true,
-    expelEnclosingWhitespace: true
-  },
-  [Underline.name]: {
-    open: '',
-    close: '',
-    mixable: true,
-    expelEnclosingWhitespace: true
-  },
-  [Link.name]: {
-    open(state, mark, parent, index) {
-      return isPlainURL(mark, parent, index, 1) ? '<' : '[';
-    },
-    close(state, mark, parent, index) {
-      const href = mark.attrs.canonicalSrc || mark.attrs.href;
-      return isPlainURL(mark, parent, index, -1) ? '>' : `](${state.esc(href)}${mark.attrs.title ? ` ${state.quote(mark.attrs.title)}` : ''})`;
-    }
-  }
-};
-function isPlainURL(link, parent, index, side) {
-  if (link.attrs.title || !/^\w+:/.test(link.attrs.href)) return false;
-  const content = parent.child(index + (side < 0 ? -1 : 0));
-  if (!content.isText || content.text !== link.attrs.href || content.marks[content.marks.length - 1] !== link) return false;
-  if (index === (side < 0 ? 1 : parent.childCount - 1)) return true;
-  const next = parent.child(index + (side < 0 ? -2 : 1));
-  return !link.isInSet(next.marks);
-}
-function serialize(schema, content) {
-  const mdSerializer = new MarkdownSerializer(mdSerializerNodes, mdSerializerMarks);
-  const proseMirrorDocument = schema.nodeFromJSON(content);
-  return mdSerializer.serialize(proseMirrorDocument, {
-    tightLists: true
-  });
-}
-function deserialize(schema, content) {
-  if (!content) return null;
-  const html = marked.parse(content);
-  if (!html) return null;
-  const parser = new DOMParser();
-  const {
-    body
-  } = parser.parseFromString(html, 'text/html');
-  // append original source as a comment that nodes can access
-  body.append(document.createComment(content));
-  const state = DOMParser$1.fromSchema(schema).parse(body);
-  return state.toJSON();
-}
-
-var script = defineComponent({
-  name: 'OrRichTextEditor',
-  components: {
-    OrButton: script$1,
-    OrError: script$2,
-    OrHint: script$3,
-    OrIconButton: script$4,
-    OrInput: script$5,
-    OrInputBox: script$6,
-    OrLabel: script$7,
-    OrMenu: script$8,
-    OrMenuItem: script$9,
-    OrModal: script$a,
-    OrPopover: script$b
-  },
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-  },
-  props: {
-    modelValue: {
-      type: String,
-      default: undefined
-    },
-    toolbar: {
-      type: Array,
-      default: () => []
-    },
-    autofocus: {
-      type: Boolean,
-      default: false
-    },
-    format: {
-      type: String,
-      default: () => Formats.Markup
-    },
-    label: {
-      type: String,
-      default: undefined
-    },
-    placeholder: {
-      type: String,
-      default: undefined
-    },
-    hint: {
-      type: String,
-      default: undefined
-    },
-    error: {
-      type: [String, Boolean],
-      default: undefined
-    },
-    required: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ['update:modelValue', 'input', 'file-upload'],
-  expose: ['root', 'editor'],
-  setup(props, context) {
-    let editor = shallowRef();
-    const controlRef = ref();
-    const toolbarRef = ref();
-    // Refs & Styles
-    const root = ref();
-    const textareaRef = ref();
-    const containerRef = ref();
-    const moreButtonRef = ref();
-    const moreRef = ref();
-    const toolbarButtonRef = ref();
-    const menuRef = ref();
-    // isActive should be set with default values for all toolbar buttons, otherwise it will not work in vue2
-    const isActive = ref({
-      bold: false,
-      italic: false,
-      underline: false,
-      strike: false,
-      bulletList: false,
-      orderedList: false,
-      link: false,
-      highlight: false,
-      redo: false,
-      undo: false,
-      codeBlock: false,
-      blockquote: false,
-      file: false,
-      source: false
-    });
-    const isFocused = ref(props.autofocus);
-    const headingLevels = [1, 2, 3, 4];
-    const activeHeadingLevel = ref(0);
-    const markdownOutput = ref('');
-    const isOpenLinkModal = ref(false);
-    const disableMarkdown = ref(false);
-    const text = ref('');
-    const link = ref('');
-    const countOfNotVisibleTools = ref(0);
-    const sourceValue = ref('');
-    let trap = useFocusTrap(controlRef, {
-      fallbackFocus: '.container',
-      allowOutsideClick: true
-    });
-    useResizeObserver(root, useDebounceFn(entries => {
-      var _a, _b;
-      const entry = entries[0];
-      const {
-        width
-      } = entry.contentRect;
-      if (containerRef.value && toolbarRef.value && toolbarLength.value) {
-        let lengthOfItem = 0;
-        lengthOfItem = ((_b = (_a = toolbarRef.value.firstElementChild) === null || _a === void 0 ? void 0 : _a.firstElementChild) === null || _b === void 0 ? void 0 : _b.offsetWidth) + 16;
-        const count = width / lengthOfItem - 2;
-        countOfNotVisibleTools.value = Math.round(toolbarLength.value - count);
-      }
-    }, 10));
-    onMounted(() => {
-      editor.value = new Editor({
-        onUpdate: ({
-          editor
-        }) => {
-          isFocused.value = true;
-          setActiveFormats();
-          const html = editor.getHTML();
-          const text = editor.getText();
-          if (props.format === 'markdown') {
-            markdownOutput.value = serialize(editor.schema, editor.getJSON());
-            model.value = markdownOutput.value;
-          } else {
-            model.value = text === '' ? text : html;
-          }
-        },
-        onCreate: ({
-          editor
-        }) => {
-          if (props.format === 'markdown') {
-            editor.commands.setContent(deserialize(editor.schema, model.value));
-          } else {
-            editor.commands.setContent(model.value);
-          }
-        },
-        element: controlRef.value,
-        autofocus: props.autofocus,
-        enableInputRules: true,
-        enablePasteRules: true,
-        extensions: [codemirrorNode, StarterKit.configure({
-          heading: false,
-          codeBlock: false,
-          paragraph: false,
-          bulletList: false,
-          orderedList: false,
-          blockquote: false
-        }), Paragraph.configure({
-          HTMLAttributes: {
-            class: 'my-xs'
-          }
-        }), BulletList.configure({
-          HTMLAttributes: {
-            class: 'mx-lg my-xs list-disc'
-          }
-        }), OrderedList.configure({
-          HTMLAttributes: {
-            class: 'mx-lg my-xs list-decimal'
-          }
-        }), Blockquote.configure({
-          HTMLAttributes: {
-            class: 'my-sm mx-lg px-lg border-l-2 border-outline'
-          }
-        }), Heading.configure({
-          levels: headingLevels
-        }).extend({
-          levels: headingLevels,
-          renderHTML({
-            node,
-            HTMLAttributes
-          }) {
-            return ['h' + node.attrs.level, mergeAttributes(HTMLAttributes, {
-              class: `typography-headline-${node.attrs.level} my-xs`
-            }), 0];
-          }
-        }), Underline, Link.configure({
-          openOnClick: true,
-          linkOnPaste: true,
-          autolink: false,
-          protocols: ['ftp', 'mailto', 'http', 'https'],
-          validate: href => /^https?:\/\//.test(href),
-          HTMLAttributes: {
-            class: 'text-primary cursor-pointer'
-          }
-        }), Highlight, Placeholder.configure({
-          placeholder: props.placeholder,
-          emptyEditorClass: 'is-editor-empty text-outline'
-        })],
-        editorProps: {
-          attributes: {
-            class: 'flex flex-col focus:outline-none gap-xs h-full'
-          }
-        },
-        parseOptions: {
-          preserveWhitespace: true
-        }
-      });
-      setActiveFormats();
-      trap.activate();
-    });
-    onBeforeUnmount(() => {
-      var _a;
-      (_a = editor.value) === null || _a === void 0 ? void 0 : _a.destroy();
-    });
-    onClickOutside(root, () => {
-      isFocused.value = false;
-      trap.deactivate();
-    });
-    // Computed
-    const model = computed({
-      get: () => {
-        return props.modelValue;
-      },
-      set: value => {
-        context.emit('input', value);
-        context.emit('update:modelValue', value);
-      }
-    });
-    const getIndexOfHeading = computed(() => {
-      return props.toolbar.flat().indexOf('heading');
-    });
-    const getRichTextEditorIcon = computed(() => item => {
-      return RichTextEditorIcons[item];
-    });
-    const getRichTextEditorTooltipIcon = computed(() => item => {
-      return RichTextEditorTooltips[item];
-    });
-    const headingIcon = computed(() => {
-      if (activeHeadingLevel.value && isActive.value.heading) {
-        return `format_h${activeHeadingLevel.value}`;
-      }
-      return 'format_paragraph';
-    });
-    const toolbarLength = computed(() => {
-      return props.toolbar.flat().length;
-    });
-    const notVisibleTools = computed(() => {
-      const count = countOfNotVisibleTools.value;
-      const toolbar = props.toolbar.flat();
-      let notVisible = new Set(toolbar.slice(toolbar.length - count, toolbar.length));
-      props.toolbar.forEach(tools => {
-        if (tools.some(item => notVisible.has(item))) {
-          tools.forEach(item => notVisible.add(item));
-        }
-      });
-      return notVisible;
-    });
-    //Methods
-    const handleEditorClick = () => {
-      var _a, _b, _c;
-      setActiveFormats();
-      isFocused.value = true;
-      (_a = editor.value) === null || _a === void 0 ? void 0 : _a.commands.focus();
-      activeHeadingLevel.value = ((_c = (_b = editor.value) === null || _b === void 0 ? void 0 : _b.getAttributes('heading')) === null || _c === void 0 ? void 0 : _c.level) || 0;
-    };
-    const isVisible = value => {
-      if (isArray(value)) {
-        const isHaveNotVisibleTools = value.some(item => notVisibleTools.value.has(item));
-        return isHaveNotVisibleTools;
-      }
-      return !notVisibleTools.value.has(value);
-    };
-    const handleInput = event => {
-      var _a, _b, _c, _d;
-      const target = event.target;
-      const value = target.value;
-      (_a = editor.value) === null || _a === void 0 ? void 0 : _a.commands.setContent(deserialize((_b = editor.value) === null || _b === void 0 ? void 0 : _b.schema, value));
-      markdownOutput.value = serialize((_c = editor.value) === null || _c === void 0 ? void 0 : _c.schema, (_d = editor.value) === null || _d === void 0 ? void 0 : _d.getJSON());
-      model.value = markdownOutput.value;
-    };
-    const handleToolbarClick = (item, level) => {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
-      switch (item) {
-        case 'source':
-          disableMarkdown.value = !disableMarkdown.value;
-          sourceValue.value = serialize((_a = editor.value) === null || _a === void 0 ? void 0 : _a.schema, (_b = editor.value) === null || _b === void 0 ? void 0 : _b.getJSON());
-          (_c = textareaRef.value) === null || _c === void 0 ? void 0 : _c.style.setProperty('height', `${((_d = controlRef.value) === null || _d === void 0 ? void 0 : _d.offsetHeight) || 88}px`);
-          nextTick(() => {
-            var _a;
-            return (_a = textareaRef.value) === null || _a === void 0 ? void 0 : _a.focus();
-          });
-          break;
-        case 'bulletList':
-        case 'orderedList':
-          item === 'bulletList' ? (_e = editor.value) === null || _e === void 0 ? void 0 : _e.commands.toggleBulletList() : (_f = editor.value) === null || _f === void 0 ? void 0 : _f.commands.toggleOrderedList();
-          break;
-        case 'link':
-          if (editor.value) {
-            const cursorPosition = ((_g = editor.value) === null || _g === void 0 ? void 0 : _g.state.selection.$anchor.pos) || 0;
-            const {
-              from,
-              to,
-              empty
-            } = editor.value.state.selection;
-            const isLink = (_h = editor.value.view.state.doc.nodeAt(cursorPosition)) === null || _h === void 0 ? void 0 : _h.marks.filter(mark => mark.type.name === 'link');
-            const existedText = (isLink === null || isLink === void 0 ? void 0 : isLink.length) ? ((_j = editor.value.view.state.doc.nodeAt(cursorPosition)) === null || _j === void 0 ? void 0 : _j.text) || '' : '';
-            text.value = empty ? existedText : editor.value.state.doc.textBetween(from, to, ' ');
-            link.value = editor.value.getAttributes('link').href || '';
-          }
-          isOpenLinkModal.value = !isOpenLinkModal.value;
-          break;
-        case 'blockquote':
-          (_k = editor.value) === null || _k === void 0 ? void 0 : _k.chain().toggleBlockquote().run();
-          break;
-        case 'codeBlock':
-          if (!isActive.value['codeBlock']) {
-            (_l = editor.value) === null || _l === void 0 ? void 0 : _l.commands.setNode(item, {
-              language: 'javascript'
-            });
-          } else {
-            (_m = editor.value) === null || _m === void 0 ? void 0 : _m.commands.setNode('paragraph');
-          }
-          break;
-        case 'heading':
-          if (!level) {
-            (_o = editor.value) === null || _o === void 0 ? void 0 : _o.commands.setParagraph();
-            activeHeadingLevel.value = 0;
-          } else {
-            activeHeadingLevel.value = level;
-            (_p = editor.value) === null || _p === void 0 ? void 0 : _p.commands.toggleHeading({
-              level: level
-            });
-          }
-          break;
-        case 'undo':
-        case 'redo':
-          item === 'undo' ? (_q = editor.value) === null || _q === void 0 ? void 0 : _q.commands.undo() : (_r = editor.value) === null || _r === void 0 ? void 0 : _r.commands.redo();
-          break;
-        case 'file':
-          context.emit('file-upload');
-          break;
-        default:
-          (_s = editor.value) === null || _s === void 0 ? void 0 : _s.chain().toggleMark(item).run();
-          break;
-      }
-    };
-    const attachLink = async () => {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-      // empty
-      if (link.value === '') {
-        (_a = editor.value) === null || _a === void 0 ? void 0 : _a.chain().focus().extendMarkRange('link').unsetLink().run();
-      }
-      const isEmptySelection = (_b = editor.value) === null || _b === void 0 ? void 0 : _b.state.selection.empty;
-      const cursorPosition = ((_c = editor.value) === null || _c === void 0 ? void 0 : _c.state.selection.$anchor.pos) || 0;
-      const isLink = (_e = (_d = editor.value) === null || _d === void 0 ? void 0 : _d.view.state.doc.nodeAt(cursorPosition)) === null || _e === void 0 ? void 0 : _e.marks.filter(mark => mark.type.name === 'link');
-      const existedText = (isLink === null || isLink === void 0 ? void 0 : isLink.length) ? (_g = (_f = editor.value) === null || _f === void 0 ? void 0 : _f.view.state.doc.nodeAt(cursorPosition)) === null || _g === void 0 ? void 0 : _g.text : '';
-      if (link.value && isEmptySelection && !existedText) {
-        (_h = editor.value) === null || _h === void 0 ? void 0 : _h.chain().focus().setMark('link', {
-          href: link.value,
-          target: '__blank'
-        }).command(({
-          tr
-        }) => {
-          const preparedValue = text.value[text.value.length - 1] === ' ' ? text.value : `${text.value} `;
-          tr.insertText(preparedValue);
-          return true;
-        }).run();
-      }
-      if (link.value && existedText === text.value && isEmptySelection) {
-        (_j = editor.value) === null || _j === void 0 ? void 0 : _j.chain().extendMarkRange('link').updateAttributes('link', {
-          href: link.value
-        }).run();
-      }
-      if (link.value && !isEmptySelection) {
-        (_k = editor.value) === null || _k === void 0 ? void 0 : _k.chain().focus().setMark('link', {
-          href: link.value,
-          target: '__blank'
-        }).run();
-      }
-      text.value = '';
-      link.value = '';
-      isOpenLinkModal.value = false;
-    };
-    const discardLink = () => {
-      isOpenLinkModal.value = false;
-    };
-    const setActiveFormats = () => {
-      const toolbarList = props.toolbar.flat();
-      toolbarList.forEach(item => {
-        var _a;
-        if (item === 'source') {
-          isActive.value[item] = disableMarkdown.value;
-        } else {
-          isActive.value[item] = ((_a = editor.value) === null || _a === void 0 ? void 0 : _a.isActive(item)) || false;
-        }
-      });
-    };
-    // Effects
-    watch([editor, model, () => props.disabled], ([editor, model, disabled]) => {
-      if (model !== (editor === null || editor === void 0 ? void 0 : editor.getHTML()) && props.format !== 'markdown') {
-        editor === null || editor === void 0 ? void 0 : editor.commands.setContent(model);
-      }
-      if (model !== markdownOutput.value && props.format === 'markdown') {
-        editor === null || editor === void 0 ? void 0 : editor.commands.setContent(deserialize(editor === null || editor === void 0 ? void 0 : editor.schema, model));
-      }
-      editor === null || editor === void 0 ? void 0 : editor.setEditable(!disabled);
-    });
-    // Styles
-    const rootStyles = computed(() => ['or-rich-text-editor-v3', ...RichTextEditor]);
-    const toolbarStyles = computed(() => [...RichTextEditorToolbar]);
-    const toolbarGroupStyles = computed(() => [...RichTextEditorToolbarGroup]);
-    const controlStyles = computed(() => ['tiptap-editor-v3', ...RichTextEditorControl]);
-    return {
-      root,
-      rootStyles,
-      toolbarRef,
-      toolbarStyles,
-      toolbarGroupStyles,
-      controlRef,
-      controlStyles,
-      editor,
-      containerRef,
-      toolbarButtonRef,
-      moreButtonRef,
-      textareaRef,
-      moreRef,
-      menuRef,
-      handleToolbarClick,
-      handleEditorClick,
-      isActive,
-      getRichTextEditorIcon,
-      getRichTextEditorTooltipIcon,
-      getIndexOfHeading,
-      headingLevels,
-      headingIcon,
-      attachLink,
-      discardLink,
-      isOpenLinkModal,
-      text,
-      link,
-      isFocused,
-      isVisible,
-      countOfNotVisibleTools,
-      notVisibleTools,
-      handleInput,
-      model,
-      disableMarkdown,
-      sourceValue,
-      activeHeadingLevel
-    };
-  }
-});
-
-const _hoisted_1 = ["disabled"];
-const _hoisted_2 = ["disabled"];
-const _hoisted_3 = {
-  class: /*#__PURE__*/normalizeClass(['p-sm', 'overflow-auto', 'min-h-[88px]', 'h-full'])
-};
-const _hoisted_4 = ["activated"];
-const _hoisted_5 = {
-  class: "flex p-sm gap-md"
-};
-const _hoisted_6 = {
-  class: /*#__PURE__*/normalizeClass(['layout-column', 'gap-md'])
-};
-const _hoisted_7 = {
-  class: /*#__PURE__*/normalizeClass(['layout-row-reverse', 'gap-md'])
-};
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_OrLabel = resolveComponent("OrLabel");
-  const _component_OrIconButton = resolveComponent("OrIconButton");
-  const _component_OrInputBox = resolveComponent("OrInputBox");
-  const _component_OrHint = resolveComponent("OrHint");
-  const _component_OrError = resolveComponent("OrError");
-  const _component_OrPopover = resolveComponent("OrPopover");
-  const _component_OrMenuItem = resolveComponent("OrMenuItem");
-  const _component_OrMenu = resolveComponent("OrMenu");
-  const _component_OrInput = resolveComponent("OrInput");
-  const _component_OrButton = resolveComponent("OrButton");
-  const _component_OrModal = resolveComponent("OrModal");
-  return openBlock(), createElementBlock("div", {
-    ref: 'root',
-    class: normalizeClass(_ctx.rootStyles)
-  }, [_ctx.$slots.label || _ctx.$slots.addon || _ctx.label ? (openBlock(), createBlock(_component_OrLabel, {
-    key: 0,
-    variant: 'input',
-    required: _ctx.required,
-    disabled: _ctx.disabled
-  }, {
-    addon: withCtx(() => [renderSlot(_ctx.$slots, "addon")]),
-    default: withCtx(() => [renderSlot(_ctx.$slots, "label", {}, () => [createTextVNode(toDisplayString(_ctx.label), 1 /* TEXT */)])]),
-    _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["required", "disabled"])) : createCommentVNode("v-if", true), createVNode(_component_OrInputBox, {
-    ref: 'containerRef',
-    class: "grow",
-    direction: 'column',
-    invalid: !!_ctx.error,
-    disabled: _ctx.disabled,
-    onClick: _cache[4] || (_cache[4] = $event => _ctx.handleEditorClick())
-  }, {
-    default: withCtx(() => [createElementVNode("div", {
-      ref: 'toolbarRef',
-      class: normalizeClass(_ctx.toolbarStyles),
-      disabled: _ctx.disabled || !_ctx.isFocused
-    }, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.toolbar, (tools, index) => {
-      return openBlock(), createElementBlock("div", {
-        key: index,
-        class: normalizeClass([..._ctx.toolbarGroupStyles, {
-          'hidden': _ctx.isVisible(tools)
-        }]),
-        disabled: _ctx.disabled || !_ctx.isFocused
-      }, [(openBlock(true), createElementBlock(Fragment, null, renderList(tools, item => {
-        return openBlock(), createElementBlock("div", {
-          key: item,
-          class: normalizeClass(['flex gap-md', {
-            'hidden': !_ctx.isVisible(item)
-          }])
-        }, [item === 'heading' ? (openBlock(), createBlock(_component_OrIconButton, {
-          key: 0,
-          ref_for: true,
-          ref: 'toolbarButtonRef',
-          icon: {
-            icon: _ctx.headingIcon,
-            variant: 'inherit'
-          },
-          tooltip: {
-            content: item,
-            placement: 'top'
-          },
-          selected: _ctx.isActive[item],
-          disabled: _ctx.disabled || !_ctx.isFocused,
-          onClick: _cache[0] || (_cache[0] = $event => _ctx.menuRef && _ctx.menuRef.toggle())
-        }, null, 8 /* PROPS */, ["icon", "tooltip", "selected", "disabled"])) : _ctx.isVisible(item) ? (openBlock(), createBlock(_component_OrIconButton, {
-          key: 1,
-          icon: {
-            icon: _ctx.getRichTextEditorIcon(item),
-            variant: 'inherit'
-          },
-          tooltip: {
-            content: _ctx.getRichTextEditorTooltipIcon(item),
-            placement: 'top'
-          },
-          selected: _ctx.isActive[item],
-          disabled: _ctx.disabled || !_ctx.isFocused,
-          onClick: $event => _ctx.handleToolbarClick(item)
-        }, null, 8 /* PROPS */, ["icon", "tooltip", "selected", "disabled", "onClick"])) : createCommentVNode("v-if", true)], 2 /* CLASS */);
-      }), 128 /* KEYED_FRAGMENT */))], 10 /* CLASS, PROPS */, _hoisted_2);
-    }), 128 /* KEYED_FRAGMENT */)), _ctx.countOfNotVisibleTools > 0 ? (openBlock(), createBlock(_component_OrIconButton, {
-      key: 0,
-      ref: 'moreButtonRef',
-      class: normalizeClass(['px-sm']),
-      icon: {
-        icon: 'more_horiz',
-        variant: 'inherit'
-      },
-      disabled: _ctx.disabled || !_ctx.isFocused,
-      onClick: _cache[1] || (_cache[1] = $event => _ctx.moreRef && _ctx.moreRef.open())
-    }, null, 8 /* PROPS */, ["disabled"])) : createCommentVNode("v-if", true)], 10 /* CLASS, PROPS */, _hoisted_1), createElementVNode("div", _hoisted_3, [withDirectives(createElementVNode("textarea", {
-      ref: 'textareaRef',
-      "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => _ctx.sourceValue = $event),
-      activated: _ctx.disableMarkdown,
-      class: "block w-full h-full resize-none border-none outline-none bg-transparent typography-body-2-regular",
-      onInput: _cache[3] || (_cache[3] = (...args) => _ctx.handleInput && _ctx.handleInput(...args))
-    }, null, 40 /* PROPS, NEED_HYDRATION */, _hoisted_4), [[vShow, _ctx.disableMarkdown], [vModelText, _ctx.sourceValue]]), withDirectives(createElementVNode("div", {
-      ref: 'controlRef',
-      class: normalizeClass(_ctx.controlStyles)
-    }, null, 2 /* CLASS */), [[vShow, !_ctx.disableMarkdown]]), renderSlot(_ctx.$slots, "files")])]),
-    _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["invalid", "disabled"]), _ctx.$slots.hint || _ctx.hint ? withDirectives((openBlock(), createBlock(_component_OrHint, {
-    key: 1,
-    disabled: _ctx.disabled
-  }, {
-    default: withCtx(() => [renderSlot(_ctx.$slots, "hint", {}, () => [createTextVNode(toDisplayString(_ctx.hint), 1 /* TEXT */)])]),
-    _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["disabled"])), [[vShow, !_ctx.error]]) : createCommentVNode("v-if", true), withDirectives(createVNode(_component_OrError, {
-    disabled: _ctx.disabled
-  }, {
-    default: withCtx(() => [createTextVNode(toDisplayString(_ctx.error), 1 /* TEXT */)]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["disabled"]), [[vShow, typeof _ctx.error === 'string' && _ctx.error.length > 0]]), _ctx.moreButtonRef ? (openBlock(), createBlock(_component_OrPopover, {
-    key: 2,
-    ref: 'moreRef',
-    trigger: _ctx.moreButtonRef && _ctx.moreButtonRef.root,
-    placement: 'top-end'
-  }, {
-    default: withCtx(() => [createElementVNode("div", _hoisted_5, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.notVisibleTools, item => {
-      return openBlock(), createBlock(_component_OrIconButton, {
-        key: item,
-        icon: {
-          icon: _ctx.getRichTextEditorIcon(item),
-          variant: 'inherit'
-        },
-        tooltip: {
-          content: _ctx.getRichTextEditorTooltipIcon(item),
-          placement: 'top'
-        },
-        selected: _ctx.isActive[item],
-        onClick: $event => _ctx.handleToolbarClick(item)
-      }, null, 8 /* PROPS */, ["icon", "tooltip", "selected", "onClick"]);
-    }), 128 /* KEYED_FRAGMENT */))])]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["trigger"])) : createCommentVNode("v-if", true), _ctx.toolbarButtonRef ? (openBlock(), createBlock(_component_OrMenu, {
-    key: 3,
-    ref: 'menuRef',
-    trigger: _ctx.toolbarButtonRef[_ctx.getIndexOfHeading] && _ctx.toolbarButtonRef[_ctx.getIndexOfHeading].root,
-    placement: 'bottom-start'
-  }, {
-    default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.headingLevels, heading => {
-      return openBlock(), createBlock(_component_OrMenuItem, {
-        key: heading,
-        selected: _ctx.activeHeadingLevel === heading,
-        onClick: $event => _ctx.handleToolbarClick('heading', heading)
-      }, {
-        default: withCtx(() => [createTextVNode(" Heading " + toDisplayString(heading), 1 /* TEXT */)]),
-        _: 2 /* DYNAMIC */
-      }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["selected", "onClick"]);
-    }), 128 /* KEYED_FRAGMENT */)), createVNode(_component_OrMenuItem, {
-      selected: !_ctx.activeHeadingLevel,
-      onClick: _cache[5] || (_cache[5] = $event => _ctx.handleToolbarClick('heading'))
-    }, {
-      default: withCtx(() => [createTextVNode(" None ")]),
-      _: 1 /* STABLE */
-    }, 8 /* PROPS */, ["selected"])]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["trigger"])) : createCommentVNode("v-if", true), createVNode(_component_OrModal, {
-    "is-open": _ctx.isOpenLinkModal,
-    size: 's'
-  }, {
-    header: withCtx(() => [createTextVNode(" Add Link ")]),
-    footer: withCtx(() => [createElementVNode("div", _hoisted_7, [createVNode(_component_OrButton, {
-      variant: 'contained',
-      onClick: _cache[8] || (_cache[8] = $event => _ctx.attachLink())
-    }, {
-      default: withCtx(() => [createTextVNode(" Save ")]),
-      _: 1 /* STABLE */
-    }), createVNode(_component_OrButton, {
-      variant: 'outlined',
-      onClick: _cache[9] || (_cache[9] = $event => _ctx.discardLink())
-    }, {
-      default: withCtx(() => [createTextVNode(" Cancel ")]),
-      _: 1 /* STABLE */
-    })])]),
-    default: withCtx(() => [createElementVNode("div", _hoisted_6, [createVNode(_component_OrInput, {
-      modelValue: _ctx.text,
-      "onUpdate:modelValue": _cache[6] || (_cache[6] = $event => _ctx.text = $event),
-      label: 'Text',
-      placeholder: 'Enter text'
-    }, null, 8 /* PROPS */, ["modelValue"]), createVNode(_component_OrInput, {
-      modelValue: _ctx.link,
-      "onUpdate:modelValue": _cache[7] || (_cache[7] = $event => _ctx.link = $event),
-      label: 'Link',
-      placeholder: 'Enter link'
-    }, null, 8 /* PROPS */, ["modelValue"])])]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["is-open"])], 2 /* CLASS */);
-}
-
-var css_248z = ".tiptap-editor-v3 .is-editor-empty::before {\n  float: left;\n  height: 0;\n  pointer-events: none;\n  content: attr(data-placeholder);\n}";
-styleInject(css_248z);
-
-script.render = render;
-script.__file = "src/components/or-rich-text-editor-v3/OrRichTextEditor.vue";
-
-export { Formats, script as OrRichTextEditorV3, RichTextEditorIcons, RichTextEditorTooltips };