@edifice.io/react 2.0.5-develop-pedago.20250211181024 → 2.0.5-develop-pedago.20250212100405
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/editor.js +4 -3
- package/dist/modules/editor/components/EditorToolbar/EditorToolbar.js +1 -0
- package/dist/modules/editor/components/Renderer/AttachmentRenderer.js +1 -0
- package/dist/modules/editor/index.d.ts +3 -1
- package/package.json +6 -6
- package/dist/modules/editor/components/Editor/Editor.js +0 -82
- package/dist/modules/editor/components/MathsModal/MathsModal.js +0 -49
- package/dist/modules/editor/hooks/useMathsStyles.js +0 -20
package/dist/editor.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { EditorContent, useEditor } from "@tiptap/react";
|
|
2
|
-
import { default as default2 } from "
|
|
1
|
+
import { Editor, EditorContent, useEditor } from "@tiptap/react";
|
|
2
|
+
import { default as default2 } from "@tiptap/starter-kit";
|
|
3
3
|
import { default as default3 } from "./modules/editor/components/BubbleMenuEditImage/BubbleMenuEditImage.js";
|
|
4
4
|
import { default as default4 } from "./modules/editor/components/NodeView/AudioNodeView.js";
|
|
5
5
|
import { default as default5 } from "./modules/editor/components/NodeView/AttachmentNodeView.js";
|
|
@@ -31,7 +31,7 @@ export {
|
|
|
31
31
|
default4 as AudioNodeView,
|
|
32
32
|
default9 as AudioRenderer,
|
|
33
33
|
default3 as BubbleMenuEditImage,
|
|
34
|
-
|
|
34
|
+
Editor,
|
|
35
35
|
EditorContent,
|
|
36
36
|
EditorContext,
|
|
37
37
|
EditorToolbar,
|
|
@@ -40,6 +40,7 @@ export {
|
|
|
40
40
|
default7 as LinkerNodeView,
|
|
41
41
|
default11 as LinkerRenderer,
|
|
42
42
|
default12 as MediaRenderer,
|
|
43
|
+
default2 as StarterKit,
|
|
43
44
|
default13 as TableToolbar,
|
|
44
45
|
default8 as VideoNodeView,
|
|
45
46
|
useActionOptions,
|
|
@@ -2,6 +2,7 @@ import { jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { useMemo } from "react";
|
|
3
3
|
import { useTranslation } from "react-i18next";
|
|
4
4
|
import "@tiptap/react";
|
|
5
|
+
import "@tiptap/starter-kit";
|
|
5
6
|
import SvgIconAlignLeft from "../../../icons/components/IconAlignLeft.js";
|
|
6
7
|
import SvgIconBulletList from "../../../icons/components/IconBulletList.js";
|
|
7
8
|
import SvgIconLandscape from "../../../icons/components/IconLandscape.js";
|
|
@@ -2,6 +2,7 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
|
2
2
|
import { useState, useEffect } from "react";
|
|
3
3
|
import { NodeViewWrapper } from "@tiptap/react";
|
|
4
4
|
import { useTranslation } from "react-i18next";
|
|
5
|
+
import "@tiptap/starter-kit";
|
|
5
6
|
import SvgIconDelete from "../../../icons/components/IconDelete.js";
|
|
6
7
|
import SvgIconDownload from "../../../icons/components/IconDownload.js";
|
|
7
8
|
import Attachment from "../../../../components/Attachment/Attachment.js";
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import { default as StarterKit } from '@tiptap/starter-kit';
|
|
2
|
+
export { EditorContent, type Content, useEditor, Editor } from '@tiptap/react';
|
|
3
|
+
export { StarterKit };
|
|
2
4
|
export * from './components';
|
|
3
5
|
export * from './hooks';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@edifice.io/react",
|
|
3
|
-
"version": "2.0.5-develop-pedago.
|
|
3
|
+
"version": "2.0.5-develop-pedago.20250212100405",
|
|
4
4
|
"description": "Edifice React Library",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -118,9 +118,9 @@
|
|
|
118
118
|
"react-slugify": "^3.0.3",
|
|
119
119
|
"swiper": "^10.1.0",
|
|
120
120
|
"ua-parser-js": "^1.0.36",
|
|
121
|
-
"@edifice.io/bootstrap": "2.0.5-develop-pedago.
|
|
122
|
-
"@edifice.io/
|
|
123
|
-
"@edifice.io/
|
|
121
|
+
"@edifice.io/bootstrap": "2.0.5-develop-pedago.20250212100405",
|
|
122
|
+
"@edifice.io/utilities": "2.0.5-develop-pedago.20250212100405",
|
|
123
|
+
"@edifice.io/tiptap-extensions": "2.0.5-develop-pedago.20250212100405"
|
|
124
124
|
},
|
|
125
125
|
"devDependencies": {
|
|
126
126
|
"@babel/plugin-transform-react-pure-annotations": "^7.23.3",
|
|
@@ -148,8 +148,8 @@
|
|
|
148
148
|
"vite": "^5.4.11",
|
|
149
149
|
"vite-plugin-dts": "^4.1.0",
|
|
150
150
|
"vite-tsconfig-paths": "^5.0.1",
|
|
151
|
-
"@edifice.io/client": "2.0.5-develop-pedago.
|
|
152
|
-
"@edifice.io/config": "2.0.5-develop-pedago.
|
|
151
|
+
"@edifice.io/client": "2.0.5-develop-pedago.20250212100405",
|
|
152
|
+
"@edifice.io/config": "2.0.5-develop-pedago.20250212100405"
|
|
153
153
|
},
|
|
154
154
|
"peerDependencies": {
|
|
155
155
|
"@react-spring/web": "^9.7.5",
|
|
@@ -1,82 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
-
import { forwardRef, useId, useImperativeHandle, Suspense, lazy } from "react";
|
|
3
|
-
import { EditorContent } from "@tiptap/react";
|
|
4
|
-
import clsx from "clsx";
|
|
5
|
-
import { useEdificeClient } from "../../../../providers/EdificeClientProvider/EdificeClientProvider.hook.js";
|
|
6
|
-
import { useMathsStyles } from "../../hooks/useMathsStyles.js";
|
|
7
|
-
import { useTipTapEditor } from "../../hooks/useTipTapEditor.js";
|
|
8
|
-
import { useMediaLibraryEditor } from "../../hooks/useMediaLibraryEditor.js";
|
|
9
|
-
import { useMathsModal } from "../../hooks/useMathsModal.js";
|
|
10
|
-
import { useImageModal } from "../../hooks/useImageModal.js";
|
|
11
|
-
import { useLinkToolbar } from "../../hooks/useLinkToolbar.js";
|
|
12
|
-
import { useSpeechSynthetisis } from "../../hooks/useSpeechSynthetisis.js";
|
|
13
|
-
import { EditorContext } from "../../hooks/useEditorContext.js";
|
|
14
|
-
import { EditorToolbar } from "../EditorToolbar/EditorToolbar.js";
|
|
15
|
-
import LinkToolbar from "../Toolbar/LinkToolbar.js";
|
|
16
|
-
import TableToolbar from "../Toolbar/TableToolbar.js";
|
|
17
|
-
import BubbleMenuEditImage from "../BubbleMenuEditImage/BubbleMenuEditImage.js";
|
|
18
|
-
import MediaLibrary from "../../../multimedia/MediaLibrary/MediaLibrary.js";
|
|
19
|
-
import LoadingScreen from "../../../../components/LoadingScreen/LoadingScreen.js";
|
|
20
|
-
const MathsModal = /* @__PURE__ */ lazy(async () => await import("../MathsModal/MathsModal.js")), ImageEditor = /* @__PURE__ */ lazy(async () => await import("../../../multimedia/ImageEditor/components/ImageEditor.js")), Editor = /* @__PURE__ */ forwardRef(({
|
|
21
|
-
id,
|
|
22
|
-
content,
|
|
23
|
-
mode = "read",
|
|
24
|
-
toolbar = "full",
|
|
25
|
-
variant = "outline",
|
|
26
|
-
focus = "start",
|
|
27
|
-
placeholder = "",
|
|
28
|
-
visibility = "protected",
|
|
29
|
-
onContentChange
|
|
30
|
-
}, ref) => {
|
|
31
|
-
const editorId = useId(), {
|
|
32
|
-
appCode
|
|
33
|
-
} = useEdificeClient(), {
|
|
34
|
-
editor,
|
|
35
|
-
editable
|
|
36
|
-
} = useTipTapEditor(mode === "edit", content, focus, placeholder, onContentChange, visibility), {
|
|
37
|
-
ref: mediaLibraryModalRef,
|
|
38
|
-
...mediaLibraryModalHandlers
|
|
39
|
-
} = useMediaLibraryEditor(editor), {
|
|
40
|
-
toggle: toggleMathsModal,
|
|
41
|
-
...mathsModalHandlers
|
|
42
|
-
} = useMathsModal(editor), imageModal = useImageModal(editor, "media-library", visibility), linkToolbarHandlers = useLinkToolbar(editor, mediaLibraryModalRef), speechSynthetisis = useSpeechSynthetisis(editor);
|
|
43
|
-
if (useMathsStyles(), useImperativeHandle(ref, () => ({
|
|
44
|
-
getContent: (as) => {
|
|
45
|
-
switch (as) {
|
|
46
|
-
case "html":
|
|
47
|
-
return editor == null ? void 0 : editor.getHTML();
|
|
48
|
-
case "json":
|
|
49
|
-
return editor == null ? void 0 : editor.getJSON();
|
|
50
|
-
case "plain":
|
|
51
|
-
return editor == null ? void 0 : editor.getText();
|
|
52
|
-
default:
|
|
53
|
-
throw `[Editor] Unknown content format ${as}`;
|
|
54
|
-
}
|
|
55
|
-
},
|
|
56
|
-
toogleSpeechSynthetisis: speechSynthetisis.toggle,
|
|
57
|
-
isSpeeching: () => speechSynthetisis.isActivated
|
|
58
|
-
})), !editor) return null;
|
|
59
|
-
const borderClass = clsx(variant === "outline" && "border rounded-3"), contentClass = clsx(variant === "outline" && "py-12 px-16");
|
|
60
|
-
return /* @__PURE__ */ jsxs(EditorContext.Provider, { value: {
|
|
61
|
-
id: id ?? editorId,
|
|
62
|
-
appCode,
|
|
63
|
-
editor,
|
|
64
|
-
editable
|
|
65
|
-
}, children: [
|
|
66
|
-
/* @__PURE__ */ jsxs("div", { className: borderClass, children: [
|
|
67
|
-
toolbar !== "none" && editable && /* @__PURE__ */ jsx(EditorToolbar, { mediaLibraryRef: mediaLibraryModalRef, toggleMathsModal }),
|
|
68
|
-
/* @__PURE__ */ jsx(EditorContent, { id: id ?? editorId, editor, className: contentClass })
|
|
69
|
-
] }),
|
|
70
|
-
/* @__PURE__ */ jsx(LinkToolbar, { editor, ...linkToolbarHandlers }),
|
|
71
|
-
/* @__PURE__ */ jsx(TableToolbar, { editor }),
|
|
72
|
-
editor && /* @__PURE__ */ jsx(BubbleMenuEditImage, { editor, onEditImage: imageModal.handleEdit, openEditImage: imageModal.isOpen, editable }),
|
|
73
|
-
/* @__PURE__ */ jsxs(Suspense, { fallback: /* @__PURE__ */ jsx(LoadingScreen, {}), children: [
|
|
74
|
-
editable && /* @__PURE__ */ jsx(MediaLibrary, { appCode, visibility, multiple: !0, ref: mediaLibraryModalRef, ...mediaLibraryModalHandlers }),
|
|
75
|
-
editable && mathsModalHandlers.isOpen && /* @__PURE__ */ jsx(MathsModal, { ...mathsModalHandlers }),
|
|
76
|
-
editable && (imageModal == null ? void 0 : imageModal.isOpen) && (imageModal == null ? void 0 : imageModal.currentImage) && /* @__PURE__ */ jsx(ImageEditor, { altText: imageModal == null ? void 0 : imageModal.currentImage.alt, legend: imageModal == null ? void 0 : imageModal.currentImage.title, image: imageModal == null ? void 0 : imageModal.currentImage.src, isOpen: imageModal.isOpen, onCancel: imageModal.handleCancel, onSave: imageModal.handleSave, onError: console.error })
|
|
77
|
-
] })
|
|
78
|
-
] });
|
|
79
|
-
});
|
|
80
|
-
export {
|
|
81
|
-
Editor as default
|
|
82
|
-
};
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useState, useEffect } from "react";
|
|
3
|
-
import Mathematics from "@tiptap-pro/extension-mathematics";
|
|
4
|
-
import { useEditor, EditorContent } from "@tiptap/react";
|
|
5
|
-
import StarterKit from "@tiptap/starter-kit";
|
|
6
|
-
import { useTranslation } from "react-i18next";
|
|
7
|
-
import Modal from "../../../../components/Modal/Modal.js";
|
|
8
|
-
import Button from "../../../../components/Button/Button.js";
|
|
9
|
-
const MathsModal = ({
|
|
10
|
-
isOpen,
|
|
11
|
-
onSuccess,
|
|
12
|
-
onCancel
|
|
13
|
-
}) => {
|
|
14
|
-
const FORMULA_PLACEHOLDER = "\\frac{-b + \\sqrt{b^2 - 4ac}}{2a}", [formulaEditor, setFormulaEditor] = useState(`$${FORMULA_PLACEHOLDER}$`), {
|
|
15
|
-
t
|
|
16
|
-
} = useTranslation(), editor = useEditor({
|
|
17
|
-
extensions: [StarterKit, Mathematics],
|
|
18
|
-
content: "",
|
|
19
|
-
editable: !1
|
|
20
|
-
});
|
|
21
|
-
useEffect(() => {
|
|
22
|
-
editor == null || editor.commands.setContent(formulaEditor), editor == null || editor.commands.enter();
|
|
23
|
-
}, [editor, formulaEditor]);
|
|
24
|
-
const handleChange = (event) => {
|
|
25
|
-
const newFormulaEditor = event.target.value.replaceAll(`
|
|
26
|
-
`, "$<br/>$");
|
|
27
|
-
newFormulaEditor ? (editor == null || editor.commands.setContent(`$${newFormulaEditor}$`), setFormulaEditor(`$${newFormulaEditor}$`)) : (editor == null || editor.commands.setContent(""), setFormulaEditor("")), editor == null || editor.commands.enter();
|
|
28
|
-
}, handleOnCancel = () => {
|
|
29
|
-
onCancel == null || onCancel();
|
|
30
|
-
};
|
|
31
|
-
return /* @__PURE__ */ jsxs(Modal, { id: "MathsModal", isOpen, onModalClose: handleOnCancel, children: [
|
|
32
|
-
/* @__PURE__ */ jsx(Modal.Header, { onModalClose: handleOnCancel, children: t("tiptap.maths.title") }),
|
|
33
|
-
/* @__PURE__ */ jsxs(Modal.Subtitle, { children: [
|
|
34
|
-
t("tiptap.maths.subtitle.1"),
|
|
35
|
-
/* @__PURE__ */ jsx("a", { href: t("https://fr.wikibooks.org/wiki/LaTeX/%C3%89crire_des_math%C3%A9matiques"), target: "_blank", children: t("tiptap.maths.subtitle.2") })
|
|
36
|
-
] }),
|
|
37
|
-
/* @__PURE__ */ jsxs(Modal.Body, { children: [
|
|
38
|
-
/* @__PURE__ */ jsx("textarea", { id: "formulaTextArea", name: "formula", rows: 4, cols: 50, onChange: handleChange, placeholder: `Exemple : ${FORMULA_PLACEHOLDER}`, className: "border rounded-3 w-100 px-16 py-12" }),
|
|
39
|
-
/* @__PURE__ */ jsx(EditorContent, { editor, className: "pt-24 pb-0 text-center fs-1" })
|
|
40
|
-
] }),
|
|
41
|
-
/* @__PURE__ */ jsxs(Modal.Footer, { children: [
|
|
42
|
-
/* @__PURE__ */ jsx(Button, { color: "tertiary", onClick: onCancel, type: "button", variant: "ghost", children: t("tiptap.maths.cancel") }),
|
|
43
|
-
/* @__PURE__ */ jsx(Button, { color: "primary", onClick: () => onSuccess == null ? void 0 : onSuccess(formulaEditor), type: "button", variant: "filled", children: t("tiptap.maths.add") })
|
|
44
|
-
] })
|
|
45
|
-
] });
|
|
46
|
-
};
|
|
47
|
-
export {
|
|
48
|
-
MathsModal as default
|
|
49
|
-
};
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { useEffect } from "react";
|
|
2
|
-
const useMathsStyles = () => {
|
|
3
|
-
useEffect(() => {
|
|
4
|
-
const katexURL = "https://cdn.jsdelivr.net/npm/katex@0.16.10/dist/katex.min.css";
|
|
5
|
-
let hasKatexLink = !1;
|
|
6
|
-
const links = document.head.getElementsByTagName("link");
|
|
7
|
-
for (const link of links)
|
|
8
|
-
if (link.href === katexURL) {
|
|
9
|
-
hasKatexLink = !0;
|
|
10
|
-
return;
|
|
11
|
-
}
|
|
12
|
-
if (!hasKatexLink) {
|
|
13
|
-
const link = document.createElement("link");
|
|
14
|
-
link.href = katexURL, link.rel = "stylesheet", link.type = "text/css", document.head.appendChild(link);
|
|
15
|
-
}
|
|
16
|
-
}, []);
|
|
17
|
-
};
|
|
18
|
-
export {
|
|
19
|
-
useMathsStyles
|
|
20
|
-
};
|