reactjs-tiptap-editor 0.4.2 → 1.0.0

package/lib/index.d.ts

@@ -1,249 +1,13 @@
-import { AnyExtension } from '@tiptap/core';
-import { default as default_2 } from 'react';
-import { Editor } from '@tiptap/react';
-import { Editor as Editor_2 } from '@tiptap/core';
-import { ForwardRefExoticComponent } from 'react';
-import { RefAttributes } from 'react';
-import { TooltipContentProps } from '@radix-ui/react-tooltip';
-import { UseEditorOptions } from '@tiptap/react';
+import { Editor } from '@tiptap/core';
+import { JSX } from 'react/jsx-runtime';
 
-declare interface ActionButtonProps {
-    icon?: string;
-    title?: string;
-    tooltip?: string;
-    disabled?: boolean;
-    shortcutKeys?: string[];
-    customClass?: string;
-    loading?: boolean;
-    tooltipOptions?: TooltipContentProps;
-    color?: string;
-    action?: ButtonViewReturnComponentProps['action'];
-    isActive?: ButtonViewReturnComponentProps['isActive'];
-    children?: default_2.ReactNode;
-    asChild?: boolean;
-    upload?: boolean;
-    initialDisplayedColor?: string;
-}
-
-/**
- * Represents the BubbleMenuProps.
- */
-declare interface BubbleMenuProps {
-    columnConfig?: {
-        /**
-         * @description Column menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    tableConfig?: TableMenuConfig;
-    floatingMenuConfig?: {
-        /**
-         * @description Floating menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    linkConfig?: {
-        /**
-         * @description Link menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    textConfig?: {
-        /**
-         * @description Text menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    imageConfig?: {
-        /**
-         * @description Image menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    imageGifConfig?: {
-        /**
-         * @description Image menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    videoConfig?: {
-        /**
-         * @description Video menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    katexConfig?: {
-        /**
-         * @description katex menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    excalidrawConfig?: {
-        /**
-         * @description excalidraw menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    iframeConfig?: {
-        /**
-         * @description iframe menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    mermaidConfig?: {
-        /**
-         * @description mermaid menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    twitterConfig?: {
-        /**
-         * @description twitter menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    drawerConfig?: {
-        /**
-         * @description twitter menu hidden
-         * @default false
-         */
-        hidden?: boolean;
-    };
-    render?: (props: BubbleMenuRenderProps, dom: React.ReactNode) => React.ReactNode;
-}
-
-/**
- * Represents the BubbleMenuRenderProps.
- */
-declare interface BubbleMenuRenderProps {
+declare interface IProviderRichTextProps {
     editor: Editor;
-    disabled: boolean;
-    bubbleMenu: BubbleMenuProps;
-    extensionsNames: string[];
-}
-
-/**
- * Represents the props for the ButtonView component.
- */
-declare interface ButtonViewReturnComponentProps {
-    /** Method triggered when action is performed */
-    action?: (value?: any) => void;
-    /** Whether it is in the active state */
-    isActive?: () => boolean;
-    /** Button icon */
-    icon?: any;
-    /** Text displayed on hover */
-    tooltip?: string;
-    [x: string]: any;
-}
-
-declare const _default: ForwardRefExoticComponent<RichTextEditorProps & RefAttributes<    {
-editor: Editor_2 | null;
-}>>;
-export default _default;
-
-/**
- * Interface for RichTextEditor component props
- */
-declare interface RichTextEditorProps {
-    /** Content of the editor */
-    content: string;
-    /** Extensions for the editor */
-    extensions: AnyExtension[];
-    /** Output format */
-    output: 'html' | 'json' | 'text';
-    /** Model value */
-    modelValue?: string | object;
-    /** Dark mode flag */
+    children: React.ReactNode;
     dark?: boolean;
-    /** Dense mode flag */
-    dense?: boolean;
-    /** Disabled flag */
-    disabled?: boolean;
-    /** Label for the editor */
-    label?: string;
-    /** Hide toolbar flag */
-    hideToolbar?: boolean;
-    /** Disable bubble menu flag */
-    disableBubble?: boolean;
-    /** Hide bubble menu flag */
-    hideBubble?: boolean;
-    /** Remove default wrapper flag */
-    removeDefaultWrapper?: boolean;
-    /** Maximum width */
-    maxWidth?: string | number;
-    /** Minimum height */
-    minHeight?: string | number;
-    /** Maximum height */
-    maxHeight?: string | number;
-    /** Content class */
-    contentClass?: string | string[] | Record<string, any>;
-    /** Content change callback */
-    onChangeContent?: (val: any) => void;
-    /** Bubble menu props */
-    bubbleMenu?: BubbleMenuProps;
-    /** Toolbar props */
-    toolbar?: ToolbarProps;
-    /** Use editor options */
-    useEditorOptions?: UseEditorOptions;
-    /** Use editor options */
-    resetCSS?: boolean;
-    /** This option gives us the control to enable the default behavior of rendering the editor immediately.*/
-    immediatelyRender?: boolean;
-    shouldRerenderOnTransaction?: boolean;
-}
-
-declare interface TableMenuConfig {
-    /**
-     * @description Column menu hidden
-     * @default false
-     */
-    hidden?: boolean;
-    /**
-     * custom menu actions
-     */
-    actions?: ActionButtonProps[];
-    /**
-     * hidden default actions, if any
-     */
-    hiddenActions?: string[];
-}
-
-/**
- * Represents the ToolbarItemProps.
- */
-declare interface ToolbarItemProps {
-    button: {
-        component: React.ComponentType<any>;
-        componentProps: Record<string, any>;
-    };
-    divider: boolean;
-    spacer: boolean;
-    type: string;
-    name: string;
-}
-
-declare interface ToolbarProps {
-    render?: (props: ToolbarRenderProps, toolbarItems: ToolbarItemProps[], dom: any[], containerDom: (innerContent: React.ReactNode) => React.ReactNode) => React.ReactNode;
-    tooltipSide?: 'top' | 'bottom';
 }
 
-declare interface ToolbarRenderProps {
-    editor: Editor;
-    disabled: boolean;
-}
+export declare function RichTextProvider({ editor, children, dark }: IProviderRichTextProps): JSX.Element;
 
 export { }
 
@@ -278,11 +42,22 @@ declare module '@tiptap/core' {
 }
 
 
+declare module '@tiptap/core' {
+    interface Storage {
+        color: ColorStorage;
+    }
+}
+
+
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        drawer: {
-            setDrawer: (options: any, replace?: any) => ReturnType;
-            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
+        columns: {
+            insertColumns: (attrs?: {
+                cols: number;
+            }) => ReturnType;
+            addColBefore: () => ReturnType;
+            addColAfter: () => ReturnType;
+            deleteCol: () => ReturnType;
         };
     }
 }
@@ -290,8 +65,9 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        excalidraw: {
-            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
+        drawer: {
+            setDrawer: (options: any, replace?: any) => ReturnType;
+            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
         };
     }
 }
@@ -309,7 +85,16 @@ declare module '@tiptap/core' {
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         exportWord: {
-            exportToWord: () => ReturnType;
+            exportToWord: (docState: any) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        excalidraw: {
+            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
         };
     }
 }
@@ -334,10 +119,8 @@ declare module '@tiptap/core' {
 
 
 declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        painter: {
-            setPainter: (marks: Mark[]) => ReturnType;
-        };
+    interface Storage {
+        highlight: HighlightStorage;
     }
 }
 
@@ -422,16 +205,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        lineHeight: {
-            setLineHeight: (lineHeight: string) => ReturnType;
-            unsetLineHeight: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         mermaid: {
@@ -442,20 +215,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        columns: {
-            insertColumns: (attrs?: {
-                cols: number;
-            }) => ReturnType;
-            addColBefore: () => ReturnType;
-            addColAfter: () => ReturnType;
-            deleteCol: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         search: {
@@ -479,16 +238,6 @@ declare module '@tiptap/core' {
 }
 
 
-declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        tableOfContents: {
-            setTableOfContents: () => ReturnType;
-            removeTableOfContents: () => ReturnType;
-        };
-    }
-}
-
-
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         twitter: {

package/lib/index.js

@@ -1,4 +1,245 @@
-import { R as f } from "./RichTextEditor-DGcKEUGr.js";
+import { jsx as c, Fragment as l } from "react/jsx-runtime";
+import { useId as N, useEffect as u } from "react";
+import { P as C, b as P, d as T } from "./index-BPfVXs5_.js";
+import { t as A } from "./theme-B7aAsK_T.js";
+import { c as M } from "./tooltip-CopwsU8q.js";
+const g = "data-rc-order", m = "data-rc-priority", R = "rc-util-key", f = /* @__PURE__ */ new Map();
+function L(e, r) {
+  if (!e)
+    return !1;
+  if (e.contains)
+    return e.contains(r);
+  let t = r;
+  for (; t; ) {
+    if (t === e)
+      return !0;
+    t = t.parentNode;
+  }
+  return !1;
+}
+function x({ mark: e } = {}) {
+  return e ? e.startsWith("data-") ? e : `data-${e}` : R;
+}
+function h(e) {
+  return e.attachTo ? e.attachTo : document.querySelector("head") || document.body;
+}
+function j(e) {
+  return e === "queue" ? "prependQueue" : e ? "prepend" : "append";
+}
+function v(e) {
+  return [...(f.get(e) || e).children].filter(
+    (r) => r.tagName === "STYLE"
+  );
+}
+function y(e, r = {}) {
+  const { csp: t, prepend: n, priority: i = 0 } = r, s = j(n), d = s === "prependQueue", o = document.createElement("style");
+  o.setAttribute(g, s), d && i && o.setAttribute(m, `${i}`), t != null && t.nonce && (o.nonce = t == null ? void 0 : t.nonce), o.innerHTML = e;
+  const a = h(r), { firstChild: w } = a;
+  if (n) {
+    if (d) {
+      const p = v(a).filter((b) => {
+        if (!["prepend", "prependQueue"].includes(b.getAttribute(g)))
+          return !1;
+        const E = Number(b.getAttribute(m) || 0);
+        return i >= E;
+      });
+      if (p.length > 0)
+        return a.insertBefore(o, p.at(-1).nextSibling), o;
+    }
+    w.before(o);
+  } else
+    a.append(o);
+  return o;
+}
+function S(e, r = {}) {
+  const t = h(r);
+  return v(t).find((n) => n.getAttribute(x(r)) === e);
+}
+function z(e, r = {}) {
+  const t = S(e, r);
+  t && t.remove();
+}
+function I(e, r) {
+  const t = f.get(e);
+  if (!t || !L(document, t)) {
+    const n = y("", r), { parentNode: i } = n;
+    f.set(e, i), n.remove();
+  }
+}
+function D(e, r, t = {}) {
+  var d, o, a;
+  const n = h(t);
+  I(n, t);
+  const i = S(r, t);
+  if (i)
+    return (d = t.csp) != null && d.nonce && i.nonce !== ((o = t.csp) == null ? void 0 : o.nonce) && (i.nonce = (a = t.csp) == null ? void 0 : a.nonce), i.innerHTML !== e && (i.innerHTML = e), i;
+  const s = y(e, t);
+  return s.setAttribute(x(t), r), s;
+}
+const H = `
+.reactjs-tiptap-editor,
+.richtext-dialog-content {
+  color: hsl(var(--richtext-foreground));
+
+  button,
+  input:where([type=button]),
+  input:where([type=reset]),
+  input:where([type=submit]) {
+    -webkit-appearance: button;
+    background-color: transparent;
+    background-image: none;
+  }
+
+  input,
+  optgroup,
+  select {
+    font-family: inherit;
+    font-feature-settings: inherit;
+    font-variation-settings: inherit;
+    font-size: 100%;
+    font-weight: inherit;
+    line-height: inherit;
+    letter-spacing: inherit;
+    color: inherit;
+  }
+
+  button {
+    font-family: inherit;
+    font-feature-settings: inherit;
+    font-variation-settings: inherit;
+    font-size: 100%;
+    font-weight: inherit;
+    line-height: inherit;
+    letter-spacing: inherit;
+    color: inherit;
+  }
+
+  *,
+  ::before,
+  ::after {
+    box-sizing: border-box;
+    border-width: 0;
+    border-style: solid;
+    border-color: hsl(var(--richtext-border));
+  }
+
+
+  hr {
+    height: 0;
+    color: inherit;
+    border-top-width: 1px;
+  }
+
+  a {
+    color: inherit;
+    text-decoration: inherit;
+  }
+
+  b,
+  strong {
+    font-weight: bolder;
+  }
+
+  code,
+  kbd,
+  samp,
+  pre {
+    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
+    font-feature-settings: normal;
+    font-variation-settings: normal;
+    font-size: 1em;
+  }
+
+  table {
+    text-indent: 0;
+    border-color: inherit;
+    border-collapse: collapse;
+  }
+
+  input {
+    border-width: 1px;
+  }
+
+
+  input::placeholder {
+    opacity: 1;
+    color: #9ca3af;
+  }
+
+  button, input {
+    cursor: pointer;
+    color: inherit;
+  }
+
+  img,
+  svg,
+  video,
+  canvas,
+  audio,
+  iframe,
+  embed,
+  object {
+    display: block;
+    vertical-align: middle;
+  }
+
+  img,
+  video {
+    max-width: 100%;
+    height: auto;
+  }
+}
+
+div[data-radix-popper-content-wrapper] {
+  color: hsl(var(--richtext-foreground));
+
+  *,
+  ::before,
+  ::after {
+    box-sizing: border-box;
+    border-width: 0;
+    border-style: solid;
+    border-color: hsl(var(--richtext-border));
+  }
+
+  button, input {
+    cursor: pointer;
+    color: inherit;
+  }
+}
+`;
+function O({ editor: e, children: r }) {
+  const [t, n] = T((i) => i.editor);
+  return u(() => {
+    n({
+      editor: e
+    });
+  }, [e]), t ? /* @__PURE__ */ c(l, { children: r }) : /* @__PURE__ */ c(l, {});
+}
+function F({ editor: e, children: r, dark: t }) {
+  const n = N();
+  return u(() => {
+    document.documentElement.classList.toggle("dark", t), A.setTheme(n, t ? "dark" : "light");
+  }, [t]), u(() => (D(H, "react-tiptap-reset"), () => {
+    z("react-tiptap-reset");
+  }), []), u(() => {
+    e && (e.id = n);
+  }, [n, e]), e ? /* @__PURE__ */ c("div", { className: "reactjs-tiptap-editor", children: /* @__PURE__ */ c(C, { children: /* @__PURE__ */ c(
+    P,
+    {
+      editor: e,
+      id: n,
+      children: /* @__PURE__ */ c(
+        M,
+        {
+          delayDuration: 0,
+          disableHoverableContent: !0,
+          children: /* @__PURE__ */ c(O, { editor: e, children: r })
+        }
+      )
+    }
+  ) }) }) : /* @__PURE__ */ c(l, {});
+}
 export {
-  f as default
+  F as RichTextProvider
 };

package/lib/input-_ECRfn3Y.cjs

@@ -0,0 +1 @@
+"use strict";const n=require("react/jsx-runtime"),o=require("react"),u=require("./index-DV5kbgRU.cjs");function a(t){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const i=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(r,e,i.get?i:{enumerable:!0,get:()=>t[e]})}}return r.default=t,Object.freeze(r)}const s=a(o),c=s.forwardRef(({className:t,type:r,...e},i)=>n.jsx("input",{type:r,className:u.cn("richtext-flex richtext-h-10 richtext-w-full richtext-rounded-md !richtext-border richtext-border-input richtext-bg-background richtext-px-3 richtext-py-2 richtext-text-sm richtext-ring-offset-background file:richtext-border-0 file:richtext-bg-transparent file:richtext-text-sm file:richtext-font-medium placeholder:richtext-text-muted-foreground focus-visible:richtext-outline-none  disabled:richtext-cursor-not-allowed disabled:richtext-opacity-50",t),ref:i,...e}));c.displayName="Input";exports.Input=c;

package/lib/input-wJ9PDEzZ.js

@@ -0,0 +1,21 @@
+import { jsx as c } from "react/jsx-runtime";
+import * as o from "react";
+import { c as x } from "./index-BPfVXs5_.js";
+const h = o.forwardRef(
+  ({ className: t, type: e, ...r }, i) => /* @__PURE__ */ c(
+    "input",
+    {
+      type: e,
+      className: x(
+        "richtext-flex richtext-h-10 richtext-w-full richtext-rounded-md !richtext-border richtext-border-input richtext-bg-background richtext-px-3 richtext-py-2 richtext-text-sm richtext-ring-offset-background file:richtext-border-0 file:richtext-bg-transparent file:richtext-text-sm file:richtext-font-medium placeholder:richtext-text-muted-foreground focus-visible:richtext-outline-none  disabled:richtext-cursor-not-allowed disabled:richtext-opacity-50",
+        t
+      ),
+      ref: i,
+      ...r
+    }
+  )
+);
+h.displayName = "Input";
+export {
+  h as I
+};

package/lib/isNumber-ClPupm7P.cjs

@@ -0,0 +1 @@
+"use strict";const n=require("./throttle-qX7Yjtsg.cjs");function d(i,t,f){return i===i&&(f!==void 0&&(i=i<=f?i:f),t!==void 0&&(i=i>=t?i:t)),i}function c(i,t,f){return f===void 0&&(f=t,t=void 0),f!==void 0&&(f=n.toNumber(f),f=f===f?f:0),t!==void 0&&(t=n.toNumber(t),t=t===t?t:0),d(n.toNumber(i),t,f)}var s="[object Number]";function a(i){return typeof i=="number"||n.isObjectLike(i)&&n.baseGetTag(i)==s}exports.clamp=c;exports.isNumber=a;

package/lib/isNumber-fpLGS0AZ.js

@@ -0,0 +1,15 @@
+import { t, i as d, b as a } from "./throttle-CdwDrFpn.js";
+function s(i, f, n) {
+  return i === i && (n !== void 0 && (i = i <= n ? i : n), f !== void 0 && (i = i >= f ? i : f)), i;
+}
+function b(i, f, n) {
+  return n === void 0 && (n = f, f = void 0), n !== void 0 && (n = t(n), n = n === n ? n : 0), f !== void 0 && (f = t(f), f = f === f ? f : 0), s(t(i), f, n);
+}
+var c = "[object Number]";
+function g(i) {
+  return typeof i == "number" || d(i) && a(i) == c;
+}
+export {
+  b as c,
+  g as i
+};

package/lib/label-BkgAe7IY.cjs

@@ -0,0 +1 @@
+"use strict";const o=require("react/jsx-runtime"),s=require("react"),l=require("@radix-ui/react-label"),u=require("./useButtonProps-C6Vpn190.cjs"),d=require("./index-DV5kbgRU.cjs");function c(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const m=c(s),i=c(l),b=u.cva("richtext-text-sm richtext-font-medium richtext-leading-none peer-disabled:richtext-cursor-not-allowed peer-disabled:richtext-opacity-70"),n=m.forwardRef(({className:e,...r},t)=>o.jsx(i.Root,{ref:t,className:d.cn(b(),e),...r}));n.displayName=i.Root.displayName;exports.Label=n;

package/lib/label-CGdLYWv7.js

@@ -0,0 +1,19 @@
+import { jsx as r } from "react/jsx-runtime";
+import * as i from "react";
+import * as t from "@radix-ui/react-label";
+import { c as m } from "./useButtonProps-BsEd4zYM.js";
+import { c as s } from "./index-BPfVXs5_.js";
+const c = m(
+  "richtext-text-sm richtext-font-medium richtext-leading-none peer-disabled:richtext-cursor-not-allowed peer-disabled:richtext-opacity-70"
+), l = i.forwardRef(({ className: e, ...a }, o) => /* @__PURE__ */ r(
+  t.Root,
+  {
+    ref: o,
+    className: s(c(), e),
+    ...a
+  }
+));
+l.displayName = t.Root.displayName;
+export {
+  l as L
+};

package/lib/locale-bundle.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-6D1J-A-o.cjs");exports.en=e.locale$1;exports.fi=e.locale$6;exports.hu_HU=e.locale$2;exports.locale=e.locale;exports.pt_BR=e.locale$5;exports.vi=e.locale$3;exports.zh_CN=e.locale$4;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-Dfmm6FTT.cjs");exports.atomLang=e.atomLang;exports.en=e.locale;exports.fi=e.locale$5;exports.hu_HU=e.locale$1;exports.localeActions=e.localeActions;exports.pt_BR=e.locale$4;exports.useLocale=e.useLocale;exports.vi=e.locale$2;exports.zh_CN=e.locale$3;