diff --git a/apps/client/package.json b/apps/client/package.json index 485e81e28..e10a4b77a 100644 --- a/apps/client/package.json +++ b/apps/client/package.json @@ -40,6 +40,7 @@ "jquery-hotkeys": "0.2.2", "jquery.fancytree": "2.38.5", "jsplumb": "2.15.6", + "katex": "0.16.22", "knockout": "3.5.1", "leaflet": "1.9.4", "leaflet-gpx": "2.2.0", diff --git a/apps/client/src/services/content_renderer.ts b/apps/client/src/services/content_renderer.ts index 619d2d7a6..11156ae7a 100644 --- a/apps/client/src/services/content_renderer.ts +++ b/apps/client/src/services/content_renderer.ts @@ -1,7 +1,6 @@ import renderService from "./render.js"; import protectedSessionService from "./protected_session.js"; import protectedSessionHolder from "./protected_session_holder.js"; -import libraryLoader from "./library_loader.js"; import openService from "./open.js"; import froca from "./froca.js"; import utils from "./utils.js"; @@ -16,6 +15,7 @@ import { normalizeMimeTypeForCKEditor } from "./mime_type_definitions.js"; import renderDoc from "./doc_renderer.js"; import { t } from "../services/i18n.js"; import WheelZoom from 'vanilla-js-wheel-zoom'; +import { renderMathInElement } from "./math.js"; let idCounter = 1; @@ -94,8 +94,6 @@ async function renderText(note: FNote | FAttachment, $renderedContent: JQuery').html(blob.content)); if ($renderedContent.find("span.math-tex").length > 0) { - await libraryLoader.requireLibrary(libraryLoader.KATEX); - renderMathInElement($renderedContent[0], { trust: true }); } diff --git a/apps/client/src/services/library_loader.ts b/apps/client/src/services/library_loader.ts index a5ad0e3fc..548afe912 100644 --- a/apps/client/src/services/library_loader.ts +++ b/apps/client/src/services/library_loader.ts @@ -121,6 +121,5 @@ export default { requireCss, requireLibrary, loadHighlightingTheme, - KATEX, HIGHLIGHT_JS }; diff --git a/apps/client/src/services/math.ts b/apps/client/src/services/math.ts new file mode 100644 index 000000000..2a5fc45b2 --- /dev/null +++ b/apps/client/src/services/math.ts @@ -0,0 +1,5 @@ +import katex from "katex"; +import "katex/contrib/mhchem"; +import "katex/dist/katex.min.css"; +export { default as renderMathInElement } from "katex/contrib/auto-render"; +export default katex; diff --git a/apps/client/src/types-lib.d.ts b/apps/client/src/types-lib.d.ts index 57b810f76..a19bffa9d 100644 --- a/apps/client/src/types-lib.d.ts +++ b/apps/client/src/types-lib.d.ts @@ -24,3 +24,10 @@ declare module "draggabilly" { declare module "@mind-elixir/node-menu" { export default mindmap; } + +declare module "katex/contrib/auto-render" { + var renderMathInElement: (element: HTMLElement, options: { + trust: boolean; + }) => void; + export default renderMathInElement; +} diff --git a/apps/client/src/types.d.ts b/apps/client/src/types.d.ts index 70e51aede..5fd57c1f8 100644 --- a/apps/client/src/types.d.ts +++ b/apps/client/src/types.d.ts @@ -131,15 +131,6 @@ declare global { language: string }); }; - var renderMathInElement: (element: HTMLElement, options: { - trust: boolean; - }) => void; - - var katex: { - renderToString(text: string, opts: { - throwOnError: boolean - }); - } /* * Panzoom diff --git a/apps/client/src/widgets/dialogs/revisions.ts b/apps/client/src/widgets/dialogs/revisions.ts index c97864e22..8083dd935 100644 --- a/apps/client/src/widgets/dialogs/revisions.ts +++ b/apps/client/src/widgets/dialogs/revisions.ts @@ -3,7 +3,6 @@ import utils from "../../services/utils.js"; import server from "../../services/server.js"; import toastService from "../../services/toast.js"; import appContext from "../../components/app_context.js"; -import libraryLoader from "../../services/library_loader.js"; import openService from "../../services/open.js"; import protectedSessionHolder from "../../services/protected_session_holder.js"; import BasicWidget from "../basic_widget.js"; @@ -12,6 +11,7 @@ import options from "../../services/options.js"; import type FNote from "../../entities/fnote.js"; import type { NoteType } from "../../entities/fnote.js"; import { Dropdown, Modal } from "bootstrap"; +import { renderMathInElement } from "../../services/math.js"; const TPL = /*html*/`