@zzish/math-rich-input 0.1.57 → 0.1.59

package/src/katexHelper.js

@@ -1,39 +1,21 @@
-// This function adds the katex css stylesheet to the document head
-export const setupKatex = () => {
-  let links = document.getElementsByTagName("link")
-  for (let i = 0; i < links.length; i++) {
-    if (links[i].id === "katex-css")
-      return
-  }
-  
-  let link = document.createElement("link")
-  link.id = "katex-css"
-  link.rel = "stylesheet"
-  link.href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" 
-  // link.integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq"
-  link.crossorigin="anonymous"
-  document.head.appendChild(link);
-  console.log("Added katex css to document head")
-
-  // The following two scripts are required to have pages auto-render embedded latex.
-  // We don't need to do this as we render everything programatically.
-  // These are inlcuded here only for reference in case of future need.
+import { KATEX_CSS } from "./katexStylesheet.generated.js";
 
-  // let script = document.createElement("script");
-  // script.id = "katex-js"
-  // script.defer = true;
-  // script.src = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js"
-  // // script.integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" 
-  // script.crossorigin="anonymous"
-  // document.head.appendChild(script);
-  // console.log("Added script")
-
-  // script = document.createElement("script");
-  // script.id = "katex-js-auto-render"
-  // script.defer = true;
-  // script.src = "https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js"
-  // // script.integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" 
-  // script.crossorigin="anonymous"
-  // document.head.appendChild(script);
-  // console.log("Added script")
-}
+/**
+ * Put KaTeX's stylesheet on the page, once, from inside the package.
+ *
+ * The field draws formulas with KaTeX and every host has looked the way `katex@0.11.1`'s stylesheet draws
+ * them, because up to 0.1.58 this appended that stylesheet from jsdelivr. It is the same stylesheet now,
+ * appended at the same moments under the same id, but carried in the bundle with its fonts inlined
+ * (`scripts/build-katex-stylesheet.js`): no request leaves the page, nothing waits on a third party, and
+ * there is no late arrival to resize a field that was already drawn.
+ *
+ * A host that already provides its own KaTeX stylesheet under the id `katex-css` keeps it: this adds
+ * nothing then, as before.
+ */
+export const setupKatex = () => {
+  if (typeof document === "undefined" || document.getElementById("katex-css")) return;
+  const style = document.createElement("style");
+  style.id = "katex-css";
+  style.textContent = KATEX_CSS;
+  document.head.appendChild(style);
+};