@edifice.io/react 2.0.0-develop-rc.4 → 2.0.0-develop-rc.10

package/dist/modules/editor/hooks/useCommentEditor.js

@@ -1,37 +1,38 @@
-import { useState, useEffect } from "react";
-import { Hyperlink } from "@edifice.io/tiptap-extensions";
-import CharacterCount from "@tiptap/extension-character-count";
-import { useEditor } from "@tiptap/react";
-import StarterKit from "@tiptap/starter-kit";
-const useCommentEditor = (editable, content, maxLength = 800) => {
-  const [commentLength, setCommentLength] = useState(0), editor = useEditor({
-    editable,
-    extensions: [StarterKit, Hyperlink, CharacterCount.configure({
-      limit: maxLength
+import { useState as a, useEffect as e } from "react";
+import { Hyperlink as C } from "@edifice.io/tiptap-extensions";
+import f from "@tiptap/extension-character-count";
+import { useEditor as p } from "@tiptap/react";
+import g from "@tiptap/starter-kit";
+const k = (n, m, r = 800) => {
+  const [c, o] = a(0), t = p({
+    editable: n,
+    extensions: [g, C, f.configure({
+      limit: r
     })],
-    content
+    content: m
   });
-  return useEffect(() => {
-    editor == null || editor.commands.setContent(content);
-  }, [content, editor]), useEffect(() => {
-    editor == null || editor.setEditable(editable);
-  }, [editable, editor]), useEffect(() => {
-    function setCounter() {
-      const length = (editor == null ? void 0 : editor.storage.characterCount.characters()) ?? 0;
-      setCommentLength(length);
+  return e(() => {
+    t == null || t.commands.setContent(m);
+  }, [m, t]), e(() => {
+    t == null || t.setEditable(n);
+  }, [n, t]), e(() => {
+    function s() {
+      const u = (t == null ? void 0 : t.storage.characterCount.characters()) ?? 0;
+      o(u);
     }
-    return editor == null || editor.on("update", setCounter), () => {
-      editor == null || editor.off("update", setCounter);
+    return t == null || t.on("update", s), () => {
+      t == null || t.off("update", s);
     };
-  }, [editor]), {
-    editor,
-    commentLength,
-    getComment: () => editor == null ? void 0 : editor.getHTML(),
+  }, [t]), {
+    editor: t,
+    commentLength: c,
+    getComment: () => t == null ? void 0 : t.getHTML(),
     resetComment: () => {
-      setCommentLength(0), editor == null || editor.commands.setContent(content);
+      o(0), t == null || t.commands.setContent(m);
     }
   };
 };
 export {
-  useCommentEditor
+  k as useCommentEditor
 };
+//# sourceMappingURL=useCommentEditor.js.map

package/dist/modules/editor/hooks/useCommentEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCommentEditor.js","sources":["../../../../src/modules/editor/hooks/useCommentEditor.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { Hyperlink } from '@edifice.io/tiptap-extensions';\nimport CharacterCount from '@tiptap/extension-character-count';\nimport { Content, HTMLContent, useEditor } from '@tiptap/react';\nimport StarterKit from '@tiptap/starter-kit';\n\n/**\n * Hook that creates a tiptap editor instance with plugins for editing comments.\n *\n * @param editable truthy if the editor content should be editable\n * @param content default rich content\n */\nexport const useCommentEditor = (\n  editable: boolean,\n  content: Content,\n  maxLength = 800,\n) => {\n  const [commentLength, setCommentLength] = useState(0);\n\n  const editor = useEditor({\n    editable,\n    extensions: [\n      StarterKit,\n      Hyperlink,\n      CharacterCount.configure({ limit: maxLength }),\n    ],\n    content,\n  });\n\n  // When content is updated through props, render it.\n  useEffect(() => {\n    editor?.commands.setContent(content);\n  }, [content, editor]);\n\n  // When editable flag is changing, so does the corresponding editor's property.\n  useEffect(() => {\n    editor?.setEditable(editable);\n  }, [editable, editor]);\n\n  // When content is updated manually, update the characters counter.\n  useEffect(() => {\n    function setCounter() {\n      const length = editor?.storage.characterCount.characters() ?? 0;\n      setCommentLength(length);\n    }\n\n    editor?.on('update', setCounter);\n\n    return () => {\n      editor?.off('update', setCounter);\n    };\n  }, [editor]);\n\n  const getComment = () => editor?.getHTML() as HTMLContent;\n  const resetComment = () => {\n    setCommentLength(0);\n    editor?.commands.setContent(content);\n  };\n\n  return { editor, commentLength, getComment, resetComment };\n};\n"],"names":["useCommentEditor","editable","content","maxLength","commentLength","setCommentLength","useState","editor","useEditor","extensions","StarterKit","Hyperlink","CharacterCount","configure","limit","useEffect","commands","setContent","setEditable","setCounter","length","storage","characterCount","characters","on","off","getComment","getHTML","resetComment"],"mappings":";;;;;AAaO,MAAMA,IAAmBA,CAC9BC,GACAC,GACAC,IAAY,QACT;AACH,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAS,CAAC,GAE9CC,IAASC,EAAU;AAAA,IACvBP,UAAAA;AAAAA,IACAQ,YAAY,CACVC,GACAC,GACAC,EAAeC,UAAU;AAAA,MAAEC,OAAOX;AAAAA,IAAAA,CAAW,CAAC;AAAA,IAEhDD,SAAAA;AAAAA,EAAAA,CACD;AAGDa,SAAAA,EAAU,MAAM;AACNC,IAAAA,KAAAA,QAAAA,EAAAA,SAASC,WAAWf;AAAAA,EAAO,GAClC,CAACA,GAASK,CAAM,CAAC,GAGpBQ,EAAU,MAAM;AACdR,IAAAA,KAAAA,QAAAA,EAAQW,YAAYjB;AAAAA,EAAQ,GAC3B,CAACA,GAAUM,CAAM,CAAC,GAGrBQ,EAAU,MAAM;AACd,aAASI,IAAa;AACpB,YAAMC,KAASb,KAAAA,gBAAAA,EAAQc,QAAQC,eAAeC,iBAAgB;AAC9DlB,MAAAA,EAAiBe,CAAM;AAAA,IACzB;AAEQI,WAAAA,KAAAA,QAAAA,EAAAA,GAAG,UAAUL,IAEd,MAAM;AACHM,MAAAA,KAAAA,QAAAA,EAAAA,IAAI,UAAUN;AAAAA,IAAU;AAAA,EAClC,GACC,CAACZ,CAAM,CAAC,GAQJ;AAAA,IAAEA,QAAAA;AAAAA,IAAQH,eAAAA;AAAAA,IAAesB,YANbA,MAAMnB,KAAAA,gBAAAA,EAAQoB;AAAAA,IAMWC,cALvBA,MAAM;AACzBvB,MAAAA,EAAiB,CAAC,GACVW,KAAAA,QAAAA,EAAAA,SAASC,WAAWf;AAAAA,IAAO;AAAA,EAGO0B;AAC9C;"}

package/dist/modules/editor/hooks/useEditorContext.js

@@ -1,12 +1,13 @@
-import { createContext, useContext } from "react";
-const EditorContext = /* @__PURE__ */ createContext(null);
-function useEditorContext() {
-  const context = useContext(EditorContext);
-  if (!context)
+import { createContext as o, useContext as e } from "react";
+const n = /* @__PURE__ */ o(null);
+function c() {
+  const t = e(n);
+  if (!t)
     throw new Error("Editor compound components cannot be rendered outside the Editor component");
-  return context;
+  return t;
 }
 export {
-  EditorContext,
-  useEditorContext
+  n as EditorContext,
+  c as useEditorContext
 };
+//# sourceMappingURL=useEditorContext.js.map

package/dist/modules/editor/hooks/useEditorContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEditorContext.js","sources":["../../../../src/modules/editor/hooks/useEditorContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nimport { Editor } from '@tiptap/react';\n\nexport const EditorContext = createContext<{\n  /**\n   * Application code (example: \"blog\")\n   */\n  appCode: string;\n\n  /**\n   * TipTap editor instance\n   */\n  editor: Editor | null;\n  /**\n   * To know if TipTap editor is editable\n   */\n  editable: boolean;\n  /**\n   * Id of the editor's HTMLElement\n   */\n  id: string;\n}>(null!);\n\nexport function useEditorContext() {\n  const context = useContext(EditorContext);\n  if (!context) {\n    throw new Error(\n      `Editor compound components cannot be rendered outside the Editor component`,\n    );\n  }\n  return context;\n}\n"],"names":["EditorContext","useEditorContext","context","useContext","Error"],"mappings":";AAIaA,MAAAA,sBAkBV,IAAK;AAED,SAASC,IAAmB;AAC3BC,QAAAA,IAAUC,EAAWH,CAAa;AACxC,MAAI,CAACE;AACG,UAAA,IAAIE,MACR,4EACF;AAEKF,SAAAA;AACT;"}

package/dist/modules/editor/hooks/useImageModal.d.ts

@@ -1,5 +1,5 @@
+import { WorkspaceVisibility } from '@edifice.io/ts-client';
 import { Editor } from '@tiptap/react';
-import { WorkspaceVisibility } from 'edifice-ts-client';
 type EditedImage = {
     src: string;
     alt?: string;

package/dist/modules/editor/hooks/useImageModal.js

@@ -1,46 +1,47 @@
-import { useState } from "react";
-import { useImageSelection } from "./useImageSelection.js";
-import useToggle from "../../../hooks/useToggle/useToggle.js";
-import useWorkspaceFile from "../../../core/useWorkspaceFile/useWorkspaceFile.js";
-const useImageModal = (editor, application, visibility) => {
-  const [currentImage, setCurrentImage] = useState(void 0), [isOpen, toggle] = useToggle(!1), {
-    createOrUpdate
-  } = useWorkspaceFile(), {
-    setAttributes,
-    getSelection
-  } = useImageSelection(editor);
+import { useState as f } from "react";
+import { useImageSelection as g } from "./useImageSelection.js";
+import h from "../../../hooks/useToggle/useToggle.js";
+import S from "../../../core/useWorkspaceFile/useWorkspaceFile.js";
+const O = (c, r, i) => {
+  const [e, l] = f(void 0), [d, t] = h(!1), {
+    createOrUpdate: m
+  } = S(), {
+    setAttributes: p,
+    getSelection: u
+  } = g(c);
   return {
-    isOpen,
-    currentImage,
-    toggle,
+    isOpen: d,
+    currentImage: e,
+    toggle: t,
     handleCancel: () => {
-      toggle();
+      t();
     },
     handleEdit: () => {
-      const selected = getSelection()[0];
-      selected && (setCurrentImage(selected), toggle());
+      const o = u()[0];
+      o && (l(o), t());
     },
     handleSave: async ({
-      blob,
-      legend,
-      altText: alt
+      blob: o,
+      legend: s,
+      altText: n
     }) => {
-      const res = await createOrUpdate({
-        blob,
-        legend,
-        alt,
-        uri: currentImage == null ? void 0 : currentImage.src,
-        visibility,
-        application
+      const a = await m({
+        blob: o,
+        legend: s,
+        alt: n,
+        uri: e == null ? void 0 : e.src,
+        visibility: i,
+        application: r
       });
-      toggle(), typeof res == "object" && setAttributes({
-        url: res.src,
-        alt,
-        title: legend
+      t(), typeof a == "object" && p({
+        url: a.src,
+        alt: n,
+        title: s
       });
     }
   };
 };
 export {
-  useImageModal
+  O as useImageModal
 };
+//# sourceMappingURL=useImageModal.js.map

package/dist/modules/editor/hooks/useImageModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useImageModal.js","sources":["../../../../src/modules/editor/hooks/useImageModal.ts"],"sourcesContent":["import { useState } from 'react';\n\nimport { WorkspaceVisibility } from '@edifice.io/ts-client';\nimport { Editor } from '@tiptap/react';\n\nimport { useWorkspaceFile } from '../../../core';\nimport { useToggle } from '../../../hooks';\nimport { useImageSelection } from './useImageSelection';\n\ntype EditedImage = { src: string; alt?: string; title?: string } | undefined;\n\n/**\n * Custom hook to manage ImageModal success and cancelation in the current editor context.\n * @returns {\n * `isOpen`: truthy boolean when the modal should be visible,\n * `currentImage`: the image being edited,\n * `toggle`: an imperative function to toggle the `isOpen` value,\n * `handleCancel`: Cancel event handler,\n * `handleEdit`: Edit event handler,\n * `handleSave`: Success event handler,\n * }\n */\nexport const useImageModal = (\n  editor: Editor | null,\n  application?: string,\n  visibility?: WorkspaceVisibility,\n) => {\n  const [currentImage, setCurrentImage] = useState<EditedImage | undefined>(\n    undefined,\n  );\n\n  const [isOpen, toggle] = useToggle(false);\n\n  // Use hook to createOrUpdate image\n  const { createOrUpdate } = useWorkspaceFile();\n  // Use hook to get selected images\n  const { setAttributes, getSelection } = useImageSelection(editor);\n\n  const handleCancel = () => {\n    toggle();\n  };\n\n  const handleEdit = () => {\n    const selected = getSelection()[0];\n    if (selected) {\n      setCurrentImage(selected);\n      toggle();\n    }\n  };\n\n  // Callback when image has been edited\n  const handleSave = async ({\n    blob,\n    legend,\n    altText: alt,\n  }: {\n    blob: Blob;\n    legend: string;\n    altText: string;\n  }) => {\n    const res = await createOrUpdate({\n      blob,\n      legend,\n      alt,\n      uri: currentImage?.src,\n      visibility,\n      application,\n    });\n    toggle();\n    /**\n     * WB-3053: res is of type object because\n     * @returns {\n     * updated file\n     * src path\n     * }\n     */\n    if (typeof res === 'object') {\n      setAttributes({\n        url: res.src,\n        alt,\n        title: legend,\n      });\n    }\n  };\n\n  return {\n    isOpen,\n    currentImage,\n    toggle,\n    handleCancel,\n    handleEdit,\n    handleSave,\n  };\n};\n"],"names":["useImageModal","editor","application","visibility","currentImage","setCurrentImage","useState","undefined","isOpen","toggle","useToggle","createOrUpdate","useWorkspaceFile","setAttributes","getSelection","useImageSelection","handleCancel","handleEdit","selected","handleSave","blob","legend","altText","alt","res","uri","src","url","title"],"mappings":";;;;AAsBO,MAAMA,IAAgBA,CAC3BC,GACAC,GACAC,MACG;AACH,QAAM,CAACC,GAAcC,CAAe,IAAIC,EACtCC,MACF,GAEM,CAACC,GAAQC,CAAM,IAAIC,EAAU,EAAK,GAGlC;AAAA,IAAEC,gBAAAA;AAAAA,MAAmBC,EAAiB,GAEtC;AAAA,IAAEC,eAAAA;AAAAA,IAAeC,cAAAA;AAAAA,EAAAA,IAAiBC,EAAkBd,CAAM;AAiDzD,SAAA;AAAA,IACLO,QAAAA;AAAAA,IACAJ,cAAAA;AAAAA,IACAK,QAAAA;AAAAA,IACAO,cAnDmBA,MAAM;AAClB,MAAAP;IAAA;AAAA,IAmDPQ,YAhDiBA,MAAM;AACjBC,YAAAA,IAAWJ,IAAe,CAAC;AACjC,MAAII,MACFb,EAAgBa,CAAQ,GACjBT;IACT;AAAA,IA4CAU,YAxCiB,OAAO;AAAA,MACxBC,MAAAA;AAAAA,MACAC,QAAAA;AAAAA,MACAC,SAASC;AAAAA,IAAAA,MAKL;AACEC,YAAAA,IAAM,MAAMb,EAAe;AAAA,QAC/BS,MAAAA;AAAAA,QACAC,QAAAA;AAAAA,QACAE,KAAAA;AAAAA,QACAE,KAAKrB,KAAAA,gBAAAA,EAAcsB;AAAAA,QACnBvB,YAAAA;AAAAA,QACAD,aAAAA;AAAAA,MAAAA,CACD;AACM,MAAAO,KAQH,OAAOe,KAAQ,YACHX,EAAA;AAAA,QACZc,KAAKH,EAAIE;AAAAA,QACTH,KAAAA;AAAAA,QACAK,OAAOP;AAAAA,MAAAA,CACR;AAAA,IACH;AAAA,EASAF;AAEJ;"}

package/dist/modules/editor/hooks/useImageSelection.js

@@ -1,46 +1,47 @@
-import { addTimestampToImageUrl } from "../../../utils/addTimestampToUrl.js";
-function useImageSelection(editor) {
+import { addTimestampToImageUrl as c } from "../../../utils/addTimestampToUrl.js";
+function r(t) {
   return {
     setAttributes: ({
-      url,
-      alt,
-      title
+      url: s,
+      alt: a,
+      title: n
     }) => {
-      (editor == null ? void 0 : editor.chain().updateAttributes("custom-image", {
-        src: addTimestampToImageUrl(url),
-        alt,
-        title
-      }).run()) || editor == null || editor.chain().updateAttributes("image", {
-        src: addTimestampToImageUrl(url),
-        alt,
-        title
+      (t == null ? void 0 : t.chain().updateAttributes("custom-image", {
+        src: c(s),
+        alt: a,
+        title: n
+      }).run()) || t == null || t.chain().updateAttributes("image", {
+        src: c(s),
+        alt: a,
+        title: n
       }).run();
     },
     getSelection: () => {
-      const datas = [];
-      if (!editor)
-        return datas;
+      const s = [];
+      if (!t)
+        return s;
       const {
-        $from,
-        $to
-      } = editor.state.selection;
-      return editor.state.doc.nodesBetween($from.pos, $to.pos, (node) => {
-        if (node.isAtom && (node.type.name === "image" || node.type.name === "custom-image")) {
+        $from: a,
+        $to: n
+      } = t.state.selection;
+      return t.state.doc.nodesBetween(a.pos, n.pos, (e) => {
+        if (e.isAtom && (e.type.name === "image" || e.type.name === "custom-image")) {
           const {
-            src,
-            title,
-            alt
-          } = node.attrs;
-          datas.push({
-            src,
-            title,
-            alt
+            src: m,
+            title: u,
+            alt: p
+          } = e.attrs;
+          s.push({
+            src: m,
+            title: u,
+            alt: p
           });
         }
-      }), datas;
+      }), s;
     }
   };
 }
 export {
-  useImageSelection
+  r as useImageSelection
 };
+//# sourceMappingURL=useImageSelection.js.map

package/dist/modules/editor/hooks/useImageSelection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useImageSelection.js","sources":["../../../../src/modules/editor/hooks/useImageSelection.ts"],"sourcesContent":["import { Editor } from '@tiptap/react';\nimport { addTimestampToImageUrl } from '../../../utils/addTimestampToUrl';\n/**\n * This hooks lets manipulate selected image node by\n * - setting attributes\n * - getting their attributes\n *\n * @param editor\n * @returns\n */\nexport function useImageSelection(editor?: Editor | null | undefined) {\n  const getSelection = () => {\n    const datas: Array<{ src: string; title: string; alt: string }> = [];\n    if (!editor) {\n      return datas;\n    }\n    const { $from, $to } = editor.state.selection;\n    editor.state.doc.nodesBetween($from.pos, $to.pos, (node) => {\n      if (\n        node.isAtom &&\n        (node.type.name === 'image' || node.type.name === 'custom-image')\n      ) {\n        const { src, title, alt } = node.attrs;\n        datas.push({\n          src,\n          title,\n          alt,\n        });\n      }\n    });\n    return datas;\n  };\n  const setAttributes = ({\n    url,\n    alt,\n    title,\n  }: {\n    url: string;\n    alt?: string;\n    title?: string;\n  }) => {\n    // Update our custom image node\n    const hasUpdate = editor\n      ?.chain()\n      .updateAttributes('custom-image', {\n        src: addTimestampToImageUrl(url),\n        alt,\n        title,\n      })\n      .run();\n    // If run failed => try update native image node\n    if (!hasUpdate) {\n      editor\n        ?.chain()\n        .updateAttributes('image', {\n          src: addTimestampToImageUrl(url),\n          alt,\n          title,\n        })\n        .run();\n    }\n  };\n  return { setAttributes, getSelection };\n}\n"],"names":["useImageSelection","editor","setAttributes","url","alt","title","chain","updateAttributes","src","addTimestampToImageUrl","run","getSelection","datas","$from","$to","state","selection","doc","nodesBetween","pos","node","isAtom","type","name","attrs","push"],"mappings":";AAUO,SAASA,EAAkBC,GAAoC;AAoD7D,SAAA;AAAA,IAAEC,eA9BaA,CAAC;AAAA,MACrBC,KAAAA;AAAAA,MACAC,KAAAA;AAAAA,MACAC,OAAAA;AAAAA,IAAAA,MAKI;AAWJ,OATkBJ,KAAAA,gBAAAA,EACdK,QACDC,iBAAiB,gBAAgB;AAAA,QAChCC,KAAKC,EAAuBN,CAAG;AAAA,QAC/BC,KAAAA;AAAAA,QACAC,OAAAA;AAAAA,MAAAA,GAEDK,UAIGJ,KAAAA,QAAAA,EAAAA,QACDC,iBAAiB,SAAS;AAAA,QACzBC,KAAKC,EAAuBN,CAAG;AAAA,QAC/BC,KAAAA;AAAAA,QACAC,OAAAA;AAAAA,MAAAA,GAEDK;AAAAA,IACL;AAAA,IAEsBC,cAnDHA,MAAM;AACzB,YAAMC,IAA4D,CAAA;AAClE,UAAI,CAACX;AACIW,eAAAA;AAEH,YAAA;AAAA,QAAEC,OAAAA;AAAAA,QAAOC,KAAAA;AAAAA,MAAAA,IAAQb,EAAOc,MAAMC;AACpCf,aAAAA,EAAOc,MAAME,IAAIC,aAAaL,EAAMM,KAAKL,EAAIK,KAAMC,CAASA,MAAA;AAExDA,YAAAA,EAAKC,WACJD,EAAKE,KAAKC,SAAS,WAAWH,EAAKE,KAAKC,SAAS,iBAClD;AACM,gBAAA;AAAA,YAAEf,KAAAA;AAAAA,YAAKH,OAAAA;AAAAA,YAAOD,KAAAA;AAAAA,UAAAA,IAAQgB,EAAKI;AACjCZ,UAAAA,EAAMa,KAAK;AAAA,YACTjB,KAAAA;AAAAA,YACAH,OAAAA;AAAAA,YACAD,KAAAA;AAAAA,UAAAA,CACD;AAAA,QACH;AAAA,MAAA,CACD,GACMQ;AAAAA,IAAAA;AAAAA,EAgCeD;AAC1B;"}

package/dist/modules/editor/hooks/useLinkToolbar.js

@@ -1,37 +1,38 @@
-import { useCallback } from "react";
-const useLinkToolbar = (editor, mediaLibraryRef) => ({
-  onEdit: useCallback((attrs) => {
-    var _a, _b;
-    editor != null && editor.isActive("hyperlink") && editor.commands.extendMarkRange("hyperlink");
-    const attrsLinker = attrs;
-    if (attrsLinker["data-id"] || attrsLinker["data-app-prefix"])
-      (_a = mediaLibraryRef.current) == null || _a.showLink({
-        target: attrs.target,
-        resourceId: attrsLinker["data-id"],
-        appPrefix: attrsLinker["data-app-prefix"]
+import { useCallback as e } from "react";
+const f = (n, p) => ({
+  onEdit: e((a) => {
+    var c, t;
+    n != null && n.isActive("hyperlink") && n.commands.extendMarkRange("hyperlink");
+    const s = a;
+    if (s["data-id"] || s["data-app-prefix"])
+      (c = p.current) == null || c.showLink({
+        target: a.target,
+        resourceId: s["data-id"],
+        appPrefix: s["data-app-prefix"]
       });
     else {
       const {
-        href,
-        target
-      } = attrs;
-      (_b = mediaLibraryRef.current) == null || _b.showLink({
+        href: k,
+        target: l
+      } = a;
+      (t = p.current) == null || t.showLink({
         link: {
-          url: href || "",
-          target: target || void 0,
-          text: editor != null && editor.state.selection.empty ? "" : editor == null ? void 0 : editor.state.selection.content().content.child(0).textContent
+          url: k || "",
+          target: l || void 0,
+          text: n != null && n.state.selection.empty ? "" : n == null ? void 0 : n.state.selection.content().content.child(0).textContent
         }
       });
     }
-  }, [editor, mediaLibraryRef]),
-  onOpen: (attrs) => {
-    window.open(attrs.href || "about:blank", "_blank");
+  }, [n, p]),
+  onOpen: (a) => {
+    window.open(a.href || "about:blank", "_blank");
   },
   onUnlink: () => {
-    var _a, _b, _c, _d;
-    (_b = editor == null ? void 0 : (_a = editor.commands).unsetLinker) == null || _b.call(_a), (_d = editor == null ? void 0 : (_c = editor.commands).unsetLink) == null || _d.call(_c);
+    var a, s, c, t;
+    (s = n == null ? void 0 : (a = n.commands).unsetLinker) == null || s.call(a), (t = n == null ? void 0 : (c = n.commands).unsetLink) == null || t.call(c);
   }
 });
 export {
-  useLinkToolbar
+  f as useLinkToolbar
 };
+//# sourceMappingURL=useLinkToolbar.js.map

package/dist/modules/editor/hooks/useLinkToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLinkToolbar.js","sources":["../../../../src/modules/editor/hooks/useLinkToolbar.ts"],"sourcesContent":["import { RefObject, useCallback } from 'react';\n\nimport {\n  HyperlinkAttributes,\n  LinkerAttributes,\n} from '@edifice.io/tiptap-extensions';\nimport { Editor } from '@tiptap/react';\nimport { MediaLibraryRef } from '../../multimedia';\n\n/**\n * Custom hook to handle LinkToolbar events.\n * @returns {\n * `onOpen`: Opens a link ,\n * `onEdit`: Edit a link,\n * `onUnlink`: Removes a link,\n * }\n */\nexport const useLinkToolbar = (\n  editor: Editor | null,\n  mediaLibraryRef: RefObject<MediaLibraryRef>,\n) => {\n  const onEdit = useCallback(\n    (attrs: LinkerAttributes | HyperlinkAttributes) => {\n      // If a link is active, select it.\n      // see https://github.com/ProseMirror/prosemirror-state/blob/88e2a24104481098f0f660e74240c0f846e7fd6e/src/selection.ts#L320\n      // Edit: 2024-01-08 when this function is called, the linker node is already selected !\n      // => Nothing to do, since the linkToolbar only appears when linker node is selected.\n      // if (editor?.isActive(\"linker\"))\n      //   editor?.commands.setNodeSelection(editor?.state.selection.$from.pos);\n      if (editor?.isActive('hyperlink'))\n        editor.commands.extendMarkRange('hyperlink');\n\n      const attrsLinker = attrs as LinkerAttributes;\n      if (attrsLinker['data-id'] || attrsLinker['data-app-prefix']) {\n        mediaLibraryRef.current?.showLink({\n          target: attrs.target,\n          resourceId: attrsLinker['data-id'],\n          appPrefix: attrsLinker['data-app-prefix'],\n        });\n      } else {\n        const { href, target } = attrs as HyperlinkAttributes;\n        mediaLibraryRef.current?.showLink({\n          link: {\n            url: href || '',\n            target: target || undefined,\n            text: editor?.state.selection.empty\n              ? ''\n              : editor?.state.selection.content().content.child(0).textContent,\n          },\n        });\n      }\n    },\n    [editor, mediaLibraryRef],\n  );\n\n  const onOpen = (attrs: LinkerAttributes) => {\n    window.open(attrs.href || 'about:blank', '_blank');\n  };\n\n  const onUnlink = (/*attrs: LinkerAttributes*/) => {\n    editor?.commands.unsetLinker?.();\n    editor?.commands.unsetLink?.();\n  };\n\n  return {\n    onEdit,\n    onOpen,\n    onUnlink,\n  };\n};\n"],"names":["useLinkToolbar","editor","mediaLibraryRef","onEdit","useCallback","attrs","isActive","commands","extendMarkRange","attrsLinker","current","showLink","target","resourceId","appPrefix","href","link","url","undefined","text","state","selection","empty","content","child","textContent","onOpen","window","open","onUnlink","unsetLinker","unsetLink"],"mappings":";AAiBaA,MAAAA,IAAiBA,CAC5BC,GACAC,OA6CO;AAAA,EACLC,QA5CaC,EACb,CAACC,MAAkD;;AAOjD,IAAIJ,KAAAA,QAAAA,EAAQK,SAAS,gBACZC,EAAAA,SAASC,gBAAgB,WAAW;AAE7C,UAAMC,IAAcJ;AACpB,QAAII,EAAY,SAAS,KAAKA,EAAY,iBAAiB;AACzDP,OAAAA,IAAAA,EAAgBQ,YAAhBR,QAAAA,EAAyBS,SAAS;AAAA,QAChCC,QAAQP,EAAMO;AAAAA,QACdC,YAAYJ,EAAY,SAAS;AAAA,QACjCK,WAAWL,EAAY,iBAAiB;AAAA,MAAA;AAAA,SAErC;AACC,YAAA;AAAA,QAAEM,MAAAA;AAAAA,QAAMH,QAAAA;AAAAA,MAAWP,IAAAA;AACzBH,OAAAA,IAAAA,EAAgBQ,YAAhBR,QAAAA,EAAyBS,SAAS;AAAA,QAChCK,MAAM;AAAA,UACJC,KAAKF,KAAQ;AAAA,UACbH,QAAQA,KAAUM;AAAAA,UAClBC,MAAMlB,KAAAA,QAAAA,EAAQmB,MAAMC,UAAUC,QAC1B,KACArB,KAAAA,gBAAAA,EAAQmB,MAAMC,UAAUE,UAAUA,QAAQC,MAAM,GAAGC;AAAAA,QACzD;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA,GAEF,CAACxB,GAAQC,CAAe,CAC1B;AAAA,EAaEwB,QAXaA,CAACrB,MAA4B;AAC1CsB,WAAOC,KAAKvB,EAAMU,QAAQ,eAAe,QAAQ;AAAA,EAAA;AAAA,EAWjDc,UAReA,MAAiC;;AAChD5B,KAAAA,IAAAA,KAAAA,iBAAAA,IAAAA,EAAQM,UAASuB,gBAAjB7B,QAAAA,EAAAA,KAAAA,KACAA,IAAAA,KAAAA,iBAAAA,IAAAA,EAAQM,UAASwB,cAAjB9B,QAAAA,EAAAA,KAAAA;AAAAA,EAA6B;AAM7B4B;"}

package/dist/modules/editor/hooks/useMathsModal.js

@@ -1,17 +1,18 @@
-import useToggle from "../../../hooks/useToggle/useToggle.js";
-const useMathsModal = (editor) => {
-  const [isOpen, toggle] = useToggle(!1);
+import a from "../../../hooks/useToggle/useToggle.js";
+const m = (n) => {
+  const [c, s] = a(!1);
   return {
-    isOpen,
-    toggle,
+    isOpen: c,
+    toggle: s,
     onCancel: () => {
-      toggle();
+      s();
     },
-    onSuccess: (formulaEditor) => {
-      editor == null || editor.commands.insertContentAt(editor.view.state.selection, formulaEditor), editor == null || editor.commands.enter(), toggle();
+    onSuccess: (e) => {
+      n == null || n.commands.insertContentAt(n.view.state.selection, e), n == null || n.commands.enter(), s();
     }
   };
 };
 export {
-  useMathsModal
+  m as useMathsModal
 };
+//# sourceMappingURL=useMathsModal.js.map

package/dist/modules/editor/hooks/useMathsModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMathsModal.js","sources":["../../../../src/modules/editor/hooks/useMathsModal.ts"],"sourcesContent":["import { Editor } from '@tiptap/react';\nimport { useToggle } from '../../../hooks';\n\n/**\n * Custom hook to manage MathsModal events in an editor.\n * @param editor an instance\n * @returns {\n * `isOpen`: truthy boolean when MathsModal sholud be visible,\n * `toggle`: an imperative function to toggle the `isOpen` value,\n * `onCancel`: Cancel event handler,\n * `onSuccess`: Success event handler (adds a formula to the editor content),\n * }\n */\nexport const useMathsModal = (editor: Editor | null) => {\n  const [isOpen, toggle] = useToggle(false);\n\n  const onCancel = () => {\n    toggle();\n  };\n\n  const onSuccess = (formulaEditor: string) => {\n    editor?.commands.insertContentAt(\n      editor.view.state.selection,\n      formulaEditor,\n    );\n    editor?.commands.enter();\n    toggle();\n  };\n\n  return {\n    isOpen,\n    toggle,\n    onCancel,\n    onSuccess,\n  };\n};\n"],"names":["useMathsModal","editor","isOpen","toggle","useToggle","onCancel","onSuccess","formulaEditor","commands","insertContentAt","view","state","selection","enter"],"mappings":";AAaaA,MAAAA,IAAgBA,CAACC,MAA0B;AACtD,QAAM,CAACC,GAAQC,CAAM,IAAIC,EAAU,EAAK;AAejC,SAAA;AAAA,IACLF,QAAAA;AAAAA,IACAC,QAAAA;AAAAA,IACAE,UAhBeA,MAAM;AACd,MAAAF;IAAA;AAAA,IAgBPG,WAbgBA,CAACC,MAA0B;AAC3CN,MAAAA,KAAAA,QAAAA,EAAQO,SAASC,gBACfR,EAAOS,KAAKC,MAAMC,WAClBL,IAEFN,KAAAA,QAAAA,EAAQO,SAASK,SACVV;IAAA;AAAA,EAOPG;AAEJ;"}

package/dist/modules/editor/hooks/useMathsStyles.js

@@ -1,20 +1,21 @@
-import { useEffect } from "react";
-const useMathsStyles = () => {
-  useEffect(() => {
-    const katexURL = "https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.css";
-    let hasKatexLink = !1;
-    const links = document.head.getElementsByTagName("link");
-    for (const link of links)
-      if (link.href === katexURL) {
-        hasKatexLink = !0;
+import { useEffect as l } from "react";
+const c = () => {
+  l(() => {
+    const t = "https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.css";
+    let n = !1;
+    const s = document.head.getElementsByTagName("link");
+    for (const e of s)
+      if (e.href === t) {
+        n = !0;
         return;
       }
-    if (!hasKatexLink) {
-      const link = document.createElement("link");
-      link.href = katexURL, link.rel = "stylesheet", link.type = "text/css", document.head.appendChild(link);
+    if (!n) {
+      const e = document.createElement("link");
+      e.href = t, e.rel = "stylesheet", e.type = "text/css", document.head.appendChild(e);
     }
   }, []);
 };
 export {
-  useMathsStyles
+  c as useMathsStyles
 };
+//# sourceMappingURL=useMathsStyles.js.map

package/dist/modules/editor/hooks/useMathsStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMathsStyles.js","sources":["../../../../src/modules/editor/hooks/useMathsStyles.ts"],"sourcesContent":["import { useEffect } from 'react';\n\n// Import Katex CSS without bundling it.\nexport const useMathsStyles = () => {\n  useEffect(() => {\n    const katexURL =\n      'https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.css';\n    let hasKatexLink = false;\n    const links = document.head.getElementsByTagName('link');\n\n    for (const link of links) {\n      if (link.href === katexURL) {\n        hasKatexLink = true;\n        return;\n      }\n    }\n\n    if (!hasKatexLink) {\n      const link = document.createElement('link');\n      link.href = katexURL;\n      link.rel = 'stylesheet';\n      link.type = 'text/css';\n\n      document.head.appendChild(link);\n    }\n  }, []);\n};\n"],"names":["useMathsStyles","useEffect","katexURL","hasKatexLink","links","document","head","getElementsByTagName","link","href","createElement","rel","type","appendChild"],"mappings":";AAGO,MAAMA,IAAiBA,MAAM;AAClCC,EAAAA,EAAU,MAAM;AACd,UAAMC,IACJ;AACF,QAAIC,IAAe;AACnB,UAAMC,IAAQC,SAASC,KAAKC,qBAAqB,MAAM;AAEvD,eAAWC,KAAQJ;AACbI,UAAAA,EAAKC,SAASP,GAAU;AACX,QAAAC,IAAA;AACf;AAAA,MACF;AAGF,QAAI,CAACA,GAAc;AACXK,YAAAA,IAAOH,SAASK,cAAc,MAAM;AAC1CF,MAAAA,EAAKC,OAAOP,GACZM,EAAKG,MAAM,cACXH,EAAKI,OAAO,YAEHN,SAAAA,KAAKO,YAAYL,CAAI;AAAA,IAChC;AAAA,EACF,GAAG,CAAE,CAAA;AACP;"}

package/dist/modules/editor/hooks/useMediaLibraryEditor.d.ts

@@ -1,5 +1,5 @@
+import { WorkspaceElement } from '@edifice.io/ts-client';
 import { Editor } from '@tiptap/react';
-import { WorkspaceElement } from 'edifice-ts-client';
 import { TabsItemProps } from '../../..';
 import { MediaLibraryRef, MediaLibraryResult } from '../../multimedia';
 /**