@dialpad/dialtone-vue/dist/node_modules/@tiptap/vue-2.js

Vue component library for Dialpad's design system Dialtone

import { BubbleMenuPlugin as J } from "@tiptap/extension-bubble-menu";
import { Editor as Q, NodeView as X } from "@tiptap/core";
export * from "@tiptap/core";
import { FloatingMenuPlugin as Y } from "@tiptap/extension-floating-menu";
import v from "vue";
var L = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {}, l = {}, h = {}, o = {}, p = {}, m = {};
Object.defineProperty(m, "__esModule", { value: !0 });
m.isInstanceOf = void 0;
const Z = (e) => (t) => {
  if (!(t instanceof e))
    return `value should be an instance of ${e.name}`;
};
m.isInstanceOf = Z;
var g = {};
Object.defineProperty(g, "__esModule", { value: !0 });
g.isInteger = void 0;
const x = (e) => {
  if (typeof e != "number" || !Number.isInteger(e))
    return "value should be an integer";
};
g.isInteger = x;
var _ = {};
Object.defineProperty(_, "__esModule", { value: !0 });
_.isOneOf = void 0;
const ee = (e) => (t) => {
  if (!e.includes(t))
    return `value should be one of "${e.join('", "')}"`;
};
_.isOneOf = ee;
var j = {};
Object.defineProperty(j, "__esModule", { value: !0 });
j.isSymbol = void 0;
const te = (e) => {
  if (typeof e != "symbol")
    return "value should be a symbol";
};
j.isSymbol = te;
(function(e) {
  var t = L && L.__importDefault || function(u) {
    return u && u.__esModule ? u : { default: u };
  };
  Object.defineProperty(e, "__esModule", { value: !0 }), e.isSymbol = e.isOneOf = e.isInteger = e.isInstanceOf = e.vuePropValidator = void 0;
  const n = t(v);
  function r(u, ...P) {
    const y = u ? [...P, u] : P;
    if (y.length !== 0)
      return (c) => {
        for (const U of y) {
          const f = U(c);
          if (f)
            return typeof n.default == "object" && "util" in n.default ? n.default.util.warn(`${f} (received: '${String(c)}')`) : console.warn(`${f} (received: '${String(c)}')`), !1;
        }
        return !0;
      };
  }
  e.vuePropValidator = r;
  var i = m;
  Object.defineProperty(e, "isInstanceOf", { enumerable: !0, get: function() {
    return i.isInstanceOf;
  } });
  var s = g;
  Object.defineProperty(e, "isInteger", { enumerable: !0, get: function() {
    return s.isInteger;
  } });
  var a = _;
  Object.defineProperty(e, "isOneOf", { enumerable: !0, get: function() {
    return a.isOneOf;
  } });
  var d = j;
  Object.defineProperty(e, "isSymbol", { enumerable: !0, get: function() {
    return d.isSymbol;
  } });
})(p);
Object.defineProperty(o, "__esModule", { value: !0 });
o.propOptionsGenerator = void 0;
const O = p, ne = (e, t, ...n) => ({
  optional: {
    type: e,
    required: !1,
    default: void 0,
    validator: (0, O.vuePropValidator)(t, ...n)
  },
  nullable: {
    type: e,
    required: !1,
    default: null,
    validator: (0, O.vuePropValidator)(t, ...n)
  },
  withDefault: (r) => ({
    type: e,
    required: !1,
    default: r,
    validator: (0, O.vuePropValidator)(t, ...n)
  }),
  required: {
    type: e,
    required: !0,
    validator: (0, O.vuePropValidator)(t, ...n)
  }
});
o.propOptionsGenerator = ne;
Object.defineProperty(h, "__esModule", { value: !0 });
h.stringProp = void 0;
const re = o, oe = (e) => (0, re.propOptionsGenerator)(String, e);
h.stringProp = oe;
var N = {};
Object.defineProperty(N, "__esModule", { value: !0 });
N.booleanProp = void 0;
const ie = o, se = (e) => (0, ie.propOptionsGenerator)(Boolean, e);
N.booleanProp = se;
var $ = {};
Object.defineProperty($, "__esModule", { value: !0 });
$.numberProp = void 0;
const ue = o, ae = (e) => (0, ue.propOptionsGenerator)(Number, e);
$.numberProp = ae;
var w = {};
Object.defineProperty(w, "__esModule", { value: !0 });
w.integerProp = void 0;
const de = o, le = p, pe = (e) => (0, de.propOptionsGenerator)(Number, e, le.isInteger);
w.integerProp = pe;
var M = {};
Object.defineProperty(M, "__esModule", { value: !0 });
M.symbolProp = void 0;
const ce = o, fe = p, ve = (e) => (0, ce.propOptionsGenerator)(void 0, e, fe.isSymbol);
M.symbolProp = ve;
var S = {};
Object.defineProperty(S, "__esModule", { value: !0 });
S.vueComponentProp = void 0;
const be = o, Pe = (e) => (0, be.propOptionsGenerator)([Object, String], e);
S.vueComponentProp = Pe;
var C = {};
Object.defineProperty(C, "__esModule", { value: !0 });
C.anyProp = void 0;
const ye = o, Oe = (e) => (0, ye.propOptionsGenerator)(void 0, e);
C.anyProp = Oe;
var D = {};
Object.defineProperty(D, "__esModule", { value: !0 });
D.arrayProp = void 0;
const he = o, me = (e) => (0, he.propOptionsGenerator)(Array, e);
D.arrayProp = me;
var q = {};
Object.defineProperty(q, "__esModule", { value: !0 });
q.objectProp = void 0;
const ge = o, _e = (e) => (0, ge.propOptionsGenerator)(Object, e);
q.objectProp = _e;
var I = {};
Object.defineProperty(I, "__esModule", { value: !0 });
I.functionProp = void 0;
const k = p, je = (e) => ({
  optional: {
    type: Function,
    required: !1,
    default: void 0,
    validator: (0, k.vuePropValidator)(e)
  },
  nullable: {
    type: Function,
    required: !1,
    default: null,
    validator: (0, k.vuePropValidator)(e)
  },
  required: {
    type: Function,
    required: !0,
    validator: (0, k.vuePropValidator)(e)
  }
});
I.functionProp = je;
var b = {};
Object.defineProperty(b, "__esModule", { value: !0 });
b.oneOfProp = void 0;
const Ne = o, $e = p, we = (e) => {
  const t = [
    ...new Set(e.flatMap((n) => {
      var r;
      return n == null ? [] : (
        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
        (r = n.constructor) !== null && r !== void 0 ? r : []
      );
    }))
  ];
  if (t.length !== 0)
    return t.length === 1 ? t[0] : t;
}, Me = (e, t) => (0, Ne.propOptionsGenerator)(we(e), t, (0, $e.isOneOf)(e));
b.oneOfProp = Me;
var T = {};
Object.defineProperty(T, "__esModule", { value: !0 });
T.oneOfObjectKeysProp = void 0;
const Se = b, Ce = (e, t) => (0, Se.oneOfProp)(Object.keys(e), t);
T.oneOfObjectKeysProp = Ce;
var G = {};
Object.defineProperty(G, "__esModule", { value: !0 });
G.oneOfTypesProp = void 0;
const De = o, qe = (e, t) => (0, De.propOptionsGenerator)(e, t);
G.oneOfTypesProp = qe;
var K = {};
Object.defineProperty(K, "__esModule", { value: !0 });
K.instanceOfProp = void 0;
const Ie = o, Te = p, Ge = (e, t) => (0, Ie.propOptionsGenerator)(e, t, (0, Te.isInstanceOf)(e));
K.instanceOfProp = Ge;
var V = {};
Object.defineProperty(V, "__esModule", { value: !0 });
V.isNegative = void 0;
const Ke = (e) => {
  if (typeof e != "number" || e >= 0 || Number.isNaN(e))
    return "value should be a negative number";
};
V.isNegative = Ke;
var E = {};
Object.defineProperty(E, "__esModule", { value: !0 });
E.isPositive = void 0;
const Ve = (e) => {
  if (typeof e != "number" || e <= 0 || Number.isNaN(e))
    return "value should be a positive number";
};
E.isPositive = Ve;
var F = {};
Object.defineProperty(F, "__esModule", { value: !0 });
F.isNonNegative = void 0;
const Ee = (e) => {
  if (typeof e != "number" || e < 0 || Number.isNaN(e))
    return "value should be a non-negative number";
};
F.isNonNegative = Ee;
var A = {};
Object.defineProperty(A, "__esModule", { value: !0 });
A.isNonPositive = void 0;
const Fe = (e) => {
  if (typeof e != "number" || e > 0 || Number.isNaN(e))
    return "value should be a non-positive number";
};
A.isNonPositive = Fe;
(function(e) {
  Object.defineProperty(e, "__esModule", { value: !0 }), e.isNonPositive = e.isNonNegative = e.isPositive = e.isNegative = e.instanceOfProp = e.oneOfTypesProp = e.oneOfObjectKeysProp = e.oneOfProp = e.functionProp = e.objectProp = e.arrayProp = e.anyProp = e.vueComponentProp = e.symbolProp = e.integerProp = e.numberProp = e.booleanProp = e.stringProp = void 0;
  var t = h;
  Object.defineProperty(e, "stringProp", { enumerable: !0, get: function() {
    return t.stringProp;
  } });
  var n = N;
  Object.defineProperty(e, "booleanProp", { enumerable: !0, get: function() {
    return n.booleanProp;
  } });
  var r = $;
  Object.defineProperty(e, "numberProp", { enumerable: !0, get: function() {
    return r.numberProp;
  } });
  var i = w;
  Object.defineProperty(e, "integerProp", { enumerable: !0, get: function() {
    return i.integerProp;
  } });
  var s = M;
  Object.defineProperty(e, "symbolProp", { enumerable: !0, get: function() {
    return s.symbolProp;
  } });
  var a = S;
  Object.defineProperty(e, "vueComponentProp", { enumerable: !0, get: function() {
    return a.vueComponentProp;
  } });
  var d = C;
  Object.defineProperty(e, "anyProp", { enumerable: !0, get: function() {
    return d.anyProp;
  } });
  var u = D;
  Object.defineProperty(e, "arrayProp", { enumerable: !0, get: function() {
    return u.arrayProp;
  } });
  var P = q;
  Object.defineProperty(e, "objectProp", { enumerable: !0, get: function() {
    return P.objectProp;
  } });
  var y = I;
  Object.defineProperty(e, "functionProp", { enumerable: !0, get: function() {
    return y.functionProp;
  } });
  var c = b;
  Object.defineProperty(e, "oneOfProp", { enumerable: !0, get: function() {
    return c.oneOfProp;
  } });
  var U = T;
  Object.defineProperty(e, "oneOfObjectKeysProp", { enumerable: !0, get: function() {
    return U.oneOfObjectKeysProp;
  } });
  var f = G;
  Object.defineProperty(e, "oneOfTypesProp", { enumerable: !0, get: function() {
    return f.oneOfTypesProp;
  } });
  var B = K;
  Object.defineProperty(e, "instanceOfProp", { enumerable: !0, get: function() {
    return B.instanceOfProp;
  } });
  var H = V;
  Object.defineProperty(e, "isNegative", { enumerable: !0, get: function() {
    return H.isNegative;
  } });
  var R = E;
  Object.defineProperty(e, "isPositive", { enumerable: !0, get: function() {
    return R.isPositive;
  } });
  var W = F;
  Object.defineProperty(e, "isNonNegative", { enumerable: !0, get: function() {
    return W.isNonNegative;
  } });
  var z = A;
  Object.defineProperty(e, "isNonPositive", { enumerable: !0, get: function() {
    return z.isNonPositive;
  } });
})(l);
const Re = {
  name: "BubbleMenu",
  props: {
    pluginKey: {
      type: [String, Object],
      default: "bubbleMenu"
    },
    editor: {
      type: Object,
      required: !0
    },
    updateDelay: {
      type: Number
    },
    tippyOptions: {
      type: Object,
      default: () => ({})
    },
    shouldShow: {
      type: Function,
      default: null
    }
  },
  watch: {
    editor: {
      immediate: !0,
      handler(e) {
        e && this.$nextTick(() => {
          e.registerPlugin(J({
            updateDelay: this.updateDelay,
            editor: e,
            element: this.$el,
            pluginKey: this.pluginKey,
            shouldShow: this.shouldShow,
            tippyOptions: this.tippyOptions
          }));
        });
      }
    }
  },
  render(e) {
    return e("div", { style: { visibility: "hidden" } }, this.$slots.default);
  },
  beforeDestroy() {
    this.editor.unregisterPlugin(this.pluginKey);
  }
};
class We extends Q {
  constructor() {
    super(...arguments), this.contentComponent = null;
  }
}
const ze = {
  name: "EditorContent",
  props: {
    editor: {
      default: null,
      type: Object
    }
  },
  watch: {
    editor: {
      immediate: !0,
      handler(e) {
        e && e.options.element && this.$nextTick(() => {
          const t = this.$el;
          !t || !e.options.element.firstChild || (t.append(...e.options.element.childNodes), e.contentComponent = this, e.setOptions({
            element: t
          }), e.createNodeViews());
        });
      }
    }
  },
  render(e) {
    return e("div");
  },
  beforeDestroy() {
    const { editor: e } = this;
    if (!e || (e.isDestroyed || e.view.setProps({
      nodeViews: {}
    }), e.contentComponent = null, !e.options.element.firstChild))
      return;
    const t = document.createElement("div");
    t.append(...e.options.element.childNodes), e.setOptions({
      element: t
    });
  }
}, Je = {
  name: "FloatingMenu",
  props: {
    pluginKey: {
      type: [String, Object],
      default: "floatingMenu"
    },
    editor: {
      type: Object,
      required: !0
    },
    tippyOptions: {
      type: Object,
      default: () => ({})
    },
    shouldShow: {
      type: Function,
      default: null
    }
  },
  watch: {
    editor: {
      immediate: !0,
      handler(e) {
        e && this.$nextTick(() => {
          e.registerPlugin(Y({
            pluginKey: this.pluginKey,
            editor: e,
            element: this.$el,
            tippyOptions: this.tippyOptions,
            shouldShow: this.shouldShow
          }));
        });
      }
    }
  },
  render(e) {
    return e("div", { style: { visibility: "hidden" } }, this.$slots.default);
  },
  beforeDestroy() {
    this.editor.unregisterPlugin(this.pluginKey);
  }
}, Qe = {
  props: {
    as: {
      type: String,
      default: "div"
    }
  },
  render(e) {
    return e(this.as, {
      style: {
        whiteSpace: "pre-wrap"
      },
      attrs: {
        "data-node-view-content": ""
      }
    });
  }
}, Xe = {
  props: {
    as: {
      type: String,
      default: "div"
    }
  },
  inject: ["onDragStart", "decorationClasses"],
  render(e) {
    return e(this.as, {
      class: this.decorationClasses.value,
      style: {
        whiteSpace: "normal"
      },
      attrs: {
        "data-node-view-wrapper": ""
      },
      on: {
        dragstart: this.onDragStart
      }
    }, this.$slots.default);
  }
};
class Ae {
  constructor(t, n) {
    const r = typeof t == "function" ? t : v.extend(t);
    this.ref = new r(n).$mount();
  }
  get element() {
    return this.ref.$el;
  }
  updateProps(t = {}) {
    var n, r, i;
    if (!this.ref.$props)
      return;
    const s = (i = (r = (n = this.ref.$props.editor) === null || n === void 0 ? void 0 : n.contentComponent) === null || r === void 0 ? void 0 : r.$options._base) !== null && i !== void 0 ? i : v, a = s.config.silent;
    s.config.silent = !0, Object.entries(t).forEach(([d, u]) => {
      this.ref.$props[d] = u;
    }), s.config.silent = a;
  }
  destroy() {
    this.ref.$destroy();
  }
}
const Ye = {
  editor: l.objectProp().required,
  node: l.objectProp().required,
  decorations: l.objectProp().required,
  selected: l.booleanProp().required,
  extension: l.objectProp().required,
  getPos: l.functionProp().required,
  updateAttributes: l.functionProp().required,
  deleteNode: l.functionProp().required
};
class Ue extends X {
  mount() {
    var t, n;
    const r = {
      editor: this.editor,
      node: this.node,
      decorations: this.decorations,
      innerDecorations: this.innerDecorations,
      view: this.view,
      selected: !1,
      extension: this.extension,
      HTMLAttributes: this.HTMLAttributes,
      getPos: () => this.getPos(),
      updateAttributes: (d = {}) => this.updateAttributes(d),
      deleteNode: () => this.deleteNode()
    }, i = this.onDragStart.bind(this);
    this.decorationClasses = v.observable({
      value: this.getDecorationClasses()
    });
    const a = ((n = (t = this.editor.contentComponent) === null || t === void 0 ? void 0 : t.$options._base) !== null && n !== void 0 ? n : v).extend(this.component).extend({
      props: Object.keys(r),
      provide: () => ({
        onDragStart: i,
        decorationClasses: this.decorationClasses
      })
    });
    this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this), this.editor.on("selectionUpdate", this.handleSelectionUpdate), this.renderer = new Ae(a, {
      parent: this.editor.contentComponent,
      propsData: r
    });
  }
  /**
   * Return the DOM element.
   * This is the element that will be used to display the node view.
   */
  get dom() {
    if (!this.renderer.element.hasAttribute("data-node-view-wrapper"))
      throw Error("Please use the NodeViewWrapper component for your node view.");
    return this.renderer.element;
  }
  /**
   * Return the content DOM element.
   * This is the element that will be used to display the rich-text content of the node.
   */
  get contentDOM() {
    return this.node.isLeaf ? null : this.dom.querySelector("[data-node-view-content]") || this.dom;
  }
  /**
   * On editor selection update, check if the node is selected.
   * If it is, call `selectNode`, otherwise call `deselectNode`.
   */
  handleSelectionUpdate() {
    const { from: t, to: n } = this.editor.state.selection, r = this.getPos();
    if (typeof r == "number")
      if (t <= r && n >= r + this.node.nodeSize) {
        if (this.renderer.ref.$props.selected)
          return;
        this.selectNode();
      } else {
        if (!this.renderer.ref.$props.selected)
          return;
        this.deselectNode();
      }
  }
  /**
   * On update, update the React component.
   * To prevent unnecessary updates, the `update` option can be used.
   */
  update(t, n, r) {
    const i = (s) => {
      this.decorationClasses.value = this.getDecorationClasses(), this.renderer.updateProps(s);
    };
    if (typeof this.options.update == "function") {
      const s = this.node, a = this.decorations, d = this.innerDecorations;
      return this.node = t, this.decorations = n, this.innerDecorations = r, this.options.update({
        oldNode: s,
        oldDecorations: a,
        newNode: t,
        newDecorations: n,
        oldInnerDecorations: d,
        innerDecorations: r,
        updateProps: () => i({ node: t, decorations: n, innerDecorations: r })
      });
    }
    return t.type !== this.node.type ? !1 : (t === this.node && this.decorations === n && this.innerDecorations === r || (this.node = t, this.decorations = n, this.innerDecorations = r, i({ node: t, decorations: n, innerDecorations: r })), !0);
  }
  /**
   * Select the node.
   * Add the `selected` prop and the `ProseMirror-selectednode` class.
   */
  selectNode() {
    this.renderer.updateProps({
      selected: !0
    }), this.renderer.element.classList.add("ProseMirror-selectednode");
  }
  /**
   * Deselect the node.
   * Remove the `selected` prop and the `ProseMirror-selectednode` class.
   */
  deselectNode() {
    this.renderer.updateProps({
      selected: !1
    }), this.renderer.element.classList.remove("ProseMirror-selectednode");
  }
  getDecorationClasses() {
    return this.decorations.map((t) => t.type.attrs.class).flat().join(" ");
  }
  destroy() {
    this.renderer.destroy(), this.editor.off("selectionUpdate", this.handleSelectionUpdate);
  }
}
function Ze(e, t) {
  return (n) => n.editor.contentComponent ? new Ue(e, n, t) : {};
}
export {
  Re as BubbleMenu,
  We as Editor,
  ze as EditorContent,
  Je as FloatingMenu,
  Qe as NodeViewContent,
  Xe as NodeViewWrapper,
  Ze as VueNodeViewRenderer,
  Ae as VueRenderer,
  Ye as nodeViewProps
};
//# sourceMappingURL=vue-2.js.map