Update Mermaid and Katex, use ESM for daux theme

dauxio · May 11, 2023 · 64df699 · 64df699
1 parent a130273
commit 64df699
Show file tree

Hide file tree

Showing 115 changed files with 1,879 additions and 2,987 deletions.
diff --git a/build.sh b/build.sh
@@ -0,0 +1,19 @@
+#!/usr/bin/env bash
+
+echo "= Cleaning previous builds"
+rm -rf themes/daux/js
+rm -rf daux_libraries/fonts/*
+rm -rf daux_libraries/katex.min.css
+
+echo "= Linting"
+yarn lint:js
+
+echo "= Adding Katex"
+cp node_modules/katex/dist/katex.min.css daux_libraries/katex.min.css
+cp -r node_modules/katex/dist/fonts/* daux_libraries/fonts
+
+echo "= Building CSS"
+yarn crafty run
+
+echo "= Building Daux Theme JS"
+yarn webpack
diff --git a/crafty.config.js b/crafty.config.js
@@ -3,8 +3,7 @@ module.exports = {
     presets: [
         "@swissquote/crafty-preset-babel",
         "@swissquote/crafty-runner-rollup",
-        "@swissquote/crafty-preset-postcss",
-        "@swissquote/crafty-runner-gulp"
+        "@swissquote/crafty-preset-postcss"
     ],
     destination_css: ".",
     destination_js: ".",
@@ -35,12 +34,6 @@ module.exports = {
             format: "iife",
             source: "src/js/search/index.js",
             destination: "daux_libraries/search.min.js"
-        },
-        theme_daux: {
-            runner: "rollup",
-            format: "iife",
-            source: "src/js/theme_daux/index.js",
-            destination: "themes/daux/js/daux.min.js"
         }
     },
     css: {
@@ -73,29 +66,5 @@ module.exports = {
     postcss(crafty, config, bundle) {
         // Add postcss-page-break
         config.processor("postcss-page-break").before("autoprefixer");
-    },
-      /**
-   * Represents the extension point for rollup configuration
-   * @param {Crafty} crafty - The instance of Crafty.
-   * @param {Gulp} gulp - The instance of Gulp.
-   * @param {StreamHandler} StreamHandler - A wrapper to create your tasks.
-   */
-  gulp(crafty, gulp, StreamHandler) {
-    // Create tasks
-    gulp.task("katex", function() {
-      const stream = new StreamHandler("node_modules/katex/dist/*.min.*", "daux_libraries");
-      return stream.generate();
-    });
-
-    gulp.task("mermaid", function() {
-        const stream = new StreamHandler("node_modules/mermaid/dist/mermaid.min.{js,js.map}", "daux_libraries");
-        return stream.generate();
-      });
-
-    // Group tasks into other tasks
-    gulp.task("vendors", gulp.parallel("katex", "mermaid"));
-
-    // Register this task to run automatically
-    crafty.addDefaultTask("vendors");
-  }
+    }
 };
diff --git a/daux_libraries/fonts/KaTeX_AMS-Regular.ttf b/daux_libraries/fonts/KaTeX_AMS-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_AMS-Regular.woff b/daux_libraries/fonts/KaTeX_AMS-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_AMS-Regular.woff2 b/daux_libraries/fonts/KaTeX_AMS-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Caligraphic-Bold.ttf b/daux_libraries/fonts/KaTeX_Caligraphic-Bold.ttf
diff --git a/daux_libraries/fonts/KaTeX_Caligraphic-Bold.woff b/daux_libraries/fonts/KaTeX_Caligraphic-Bold.woff
diff --git a/daux_libraries/fonts/KaTeX_Caligraphic-Bold.woff2 b/daux_libraries/fonts/KaTeX_Caligraphic-Bold.woff2
diff --git a/daux_libraries/fonts/KaTeX_Caligraphic-Regular.ttf b/daux_libraries/fonts/KaTeX_Caligraphic-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Caligraphic-Regular.woff b/daux_libraries/fonts/KaTeX_Caligraphic-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Caligraphic-Regular.woff2 b/daux_libraries/fonts/KaTeX_Caligraphic-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Fraktur-Bold.ttf b/daux_libraries/fonts/KaTeX_Fraktur-Bold.ttf
diff --git a/daux_libraries/fonts/KaTeX_Fraktur-Bold.woff b/daux_libraries/fonts/KaTeX_Fraktur-Bold.woff
diff --git a/daux_libraries/fonts/KaTeX_Fraktur-Bold.woff2 b/daux_libraries/fonts/KaTeX_Fraktur-Bold.woff2
diff --git a/daux_libraries/fonts/KaTeX_Fraktur-Regular.ttf b/daux_libraries/fonts/KaTeX_Fraktur-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Fraktur-Regular.woff b/daux_libraries/fonts/KaTeX_Fraktur-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Fraktur-Regular.woff2 b/daux_libraries/fonts/KaTeX_Fraktur-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Main-Bold.ttf b/daux_libraries/fonts/KaTeX_Main-Bold.ttf
diff --git a/daux_libraries/fonts/KaTeX_Main-Bold.woff b/daux_libraries/fonts/KaTeX_Main-Bold.woff
diff --git a/daux_libraries/fonts/KaTeX_Main-Bold.woff2 b/daux_libraries/fonts/KaTeX_Main-Bold.woff2
diff --git a/daux_libraries/fonts/KaTeX_Main-BoldItalic.ttf b/daux_libraries/fonts/KaTeX_Main-BoldItalic.ttf
diff --git a/daux_libraries/fonts/KaTeX_Main-BoldItalic.woff b/daux_libraries/fonts/KaTeX_Main-BoldItalic.woff
diff --git a/daux_libraries/fonts/KaTeX_Main-BoldItalic.woff2 b/daux_libraries/fonts/KaTeX_Main-BoldItalic.woff2
diff --git a/daux_libraries/fonts/KaTeX_Main-Italic.ttf b/daux_libraries/fonts/KaTeX_Main-Italic.ttf
diff --git a/daux_libraries/fonts/KaTeX_Main-Italic.woff b/daux_libraries/fonts/KaTeX_Main-Italic.woff
diff --git a/daux_libraries/fonts/KaTeX_Main-Italic.woff2 b/daux_libraries/fonts/KaTeX_Main-Italic.woff2
diff --git a/daux_libraries/fonts/KaTeX_Main-Regular.ttf b/daux_libraries/fonts/KaTeX_Main-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Main-Regular.woff b/daux_libraries/fonts/KaTeX_Main-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Main-Regular.woff2 b/daux_libraries/fonts/KaTeX_Main-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Math-BoldItalic.ttf b/daux_libraries/fonts/KaTeX_Math-BoldItalic.ttf
diff --git a/daux_libraries/fonts/KaTeX_Math-BoldItalic.woff b/daux_libraries/fonts/KaTeX_Math-BoldItalic.woff
diff --git a/daux_libraries/fonts/KaTeX_Math-BoldItalic.woff2 b/daux_libraries/fonts/KaTeX_Math-BoldItalic.woff2
diff --git a/daux_libraries/fonts/KaTeX_Math-Italic.ttf b/daux_libraries/fonts/KaTeX_Math-Italic.ttf
diff --git a/daux_libraries/fonts/KaTeX_Math-Italic.woff b/daux_libraries/fonts/KaTeX_Math-Italic.woff
diff --git a/daux_libraries/fonts/KaTeX_Math-Italic.woff2 b/daux_libraries/fonts/KaTeX_Math-Italic.woff2
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Bold.ttf b/daux_libraries/fonts/KaTeX_SansSerif-Bold.ttf
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Bold.woff b/daux_libraries/fonts/KaTeX_SansSerif-Bold.woff
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Bold.woff2 b/daux_libraries/fonts/KaTeX_SansSerif-Bold.woff2
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Italic.ttf b/daux_libraries/fonts/KaTeX_SansSerif-Italic.ttf
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Italic.woff b/daux_libraries/fonts/KaTeX_SansSerif-Italic.woff
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Italic.woff2 b/daux_libraries/fonts/KaTeX_SansSerif-Italic.woff2
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Regular.ttf b/daux_libraries/fonts/KaTeX_SansSerif-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Regular.woff b/daux_libraries/fonts/KaTeX_SansSerif-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_SansSerif-Regular.woff2 b/daux_libraries/fonts/KaTeX_SansSerif-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Script-Regular.ttf b/daux_libraries/fonts/KaTeX_Script-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Script-Regular.woff b/daux_libraries/fonts/KaTeX_Script-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Script-Regular.woff2 b/daux_libraries/fonts/KaTeX_Script-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Size1-Regular.ttf b/daux_libraries/fonts/KaTeX_Size1-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Size1-Regular.woff b/daux_libraries/fonts/KaTeX_Size1-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Size1-Regular.woff2 b/daux_libraries/fonts/KaTeX_Size1-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Size2-Regular.ttf b/daux_libraries/fonts/KaTeX_Size2-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Size2-Regular.woff b/daux_libraries/fonts/KaTeX_Size2-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Size2-Regular.woff2 b/daux_libraries/fonts/KaTeX_Size2-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Size3-Regular.ttf b/daux_libraries/fonts/KaTeX_Size3-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Size3-Regular.woff b/daux_libraries/fonts/KaTeX_Size3-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Size3-Regular.woff2 b/daux_libraries/fonts/KaTeX_Size3-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Size4-Regular.ttf b/daux_libraries/fonts/KaTeX_Size4-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Size4-Regular.woff b/daux_libraries/fonts/KaTeX_Size4-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Size4-Regular.woff2 b/daux_libraries/fonts/KaTeX_Size4-Regular.woff2
diff --git a/daux_libraries/fonts/KaTeX_Typewriter-Regular.ttf b/daux_libraries/fonts/KaTeX_Typewriter-Regular.ttf
diff --git a/daux_libraries/fonts/KaTeX_Typewriter-Regular.woff b/daux_libraries/fonts/KaTeX_Typewriter-Regular.woff
diff --git a/daux_libraries/fonts/KaTeX_Typewriter-Regular.woff2 b/daux_libraries/fonts/KaTeX_Typewriter-Regular.woff2
diff --git a/daux_libraries/katex.min.css b/daux_libraries/katex.min.css
diff --git a/daux_libraries/katex.min.js b/daux_libraries/katex.min.js
diff --git a/daux_libraries/mermaid.min.js b/daux_libraries/mermaid.min.js
diff --git a/daux_libraries/mermaid.min.js.LICENSE.txt b/daux_libraries/mermaid.min.js.LICENSE.txt
diff --git a/daux_libraries/mermaid.min.js.map b/daux_libraries/mermaid.min.js.map
diff --git a/daux_libraries/search.min.js b/daux_libraries/search.min.js
diff --git a/daux_libraries/search.min.js.map b/daux_libraries/search.min.js.map
diff --git a/libs/Format/Confluence/ContentTypes/Markdown/ContentType.php b/libs/Format/Confluence/ContentTypes/Markdown/ContentType.php
@@ -12,7 +12,7 @@ protected function addJS()
         return <<<'EOD'
             <ac:structured-macro ac:name="html">
               <ac:plain-text-body> <![CDATA[
-            <script>
+            <script type="module">
             function daux_ready(fn) {
                 if (document.readyState === "loading") {
                     document.addEventListener("DOMContentLoaded", fn);
@@ -21,16 +21,6 @@ function daux_ready(fn) {
                 }
             }
 
-            function daux_loadJS(url, callback) {
-                var head = document.getElementsByTagName("head")[0],
-                    script = document.createElement("script");
-                script.type = "text/javascript";
-                script.async = true;
-                script.src = url;
-                script.onload = callback;
-                head.appendChild(script);
-            }
-
             function daux_loadCSS(url) {
                 var head = document.getElementsByTagName("head")[0],
                     link = document.createElement("link");
@@ -42,9 +32,9 @@ function daux_loadCSS(url) {
             daux_ready(function() {
                 var codeBlocks = document.querySelectorAll("pre > code.katex");
                 if (codeBlocks.length) {
-                    daux_loadCSS(`https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.css`);
+                    daux_loadCSS(`https://cdn.jsdelivr.net/npm/katex@0.16.7/dist/katex.min.css`);
 
-                    daux_loadJS(`https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.js`, function() {
+                    import(`https://cdn.jsdelivr.net/npm/katex@0.16.7/dist/katex.mjs`).then(katex) {
                         [].forEach.call(codeBlocks, function(e) {
                             var content = e.innerHTML;
                             var p = document.createElement("p");
@@ -56,7 +46,7 @@ function daux_loadCSS(url) {
                             pre.parentElement.insertBefore(p, pre);
                             pre.parentElement.removeChild(pre);
 
-                            window.katex.render(content, span, {
+                            katex.default.render(content, span, {
                                 throwOnError: false
                             });
                         });
@@ -67,7 +57,7 @@ function daux_loadCSS(url) {
             daux_ready(function() {
                 var mermaidBlocks = document.querySelectorAll("pre.mermaid");
                 if (mermaidBlocks.length) {
-                    daux_loadJS(`https://cdn.jsdelivr.net/npm/mermaid@8.13.4/dist/mermaid.min.js`, function() {
+                    import("https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs").then(mermaid => {
                         [].forEach.call(mermaidBlocks, function(pre) {
                             var content = pre.innerHTML;
                             var div = document.createElement("div");
@@ -79,8 +69,8 @@ function daux_loadCSS(url) {
                             container.removeChild(pre);
                         });
 
-                        window.mermaid.initialize({ startOnLoad: true });
-                    });
+                        mermaid.default.initialize({ startOnLoad: true });
+                    })
                 }
             });
             </script>

diff --git a/package.json b/package.json
@@ -6,17 +6,18 @@
     "@swissquote/crafty": "1.22.3",
     "@swissquote/crafty-preset-babel": "1.22.3",
     "@swissquote/crafty-preset-postcss": "1.22.3",
-    "@swissquote/crafty-runner-gulp": "1.22.3",
     "@swissquote/crafty-runner-rollup": "1.22.3",
     "flexsearch": "^0.7.0",
     "katex": "^0.16.4",
     "mermaid": "^10.0.0",
     "postcss-page-break": "^2.0.0",
     "preact": "^10.0.5",
-    "testcafe": "^2.0.0"
+    "testcafe": "^2.0.0",
+    "webpack-cli": "^5.1.1",
+    "webpack": "^5.82.1"
   },
   "scripts": {
-    "build": "crafty run",
+    "build": "./build.sh",
     "watch": "crafty watch",
     "test": "./test.sh",
     "lint:js": "crafty jsLint --fix src/js/**/*.js",

diff --git a/src/js/theme_daux/highlight.js b/src/js/theme_daux/highlight.js
@@ -16,7 +16,7 @@ ready(() => {
     if (codeBlocks.length) {
         loadCSS(`${window.base_url}daux_libraries/katex.min.css`);
 
-        loadJS(`${window.base_url}daux_libraries/katex.min.js`, () => {
+        import(/* webpackChunkName: "katex" */ "katex").then(katex => {
             [].forEach.call(codeBlocks, (/** @type {HTMLElement} */ e) => {
                 const content = e.innerHTML;
                 const p = document.createElement("p");
@@ -28,7 +28,7 @@ ready(() => {
                 pre.parentElement.insertBefore(p, pre);
                 pre.parentElement.removeChild(pre);
 
-                window.katex.render(content, span, {
+                katex.default.render(content, span, {
                     throwOnError: false
                 });
             });
@@ -39,8 +39,8 @@ ready(() => {
 ready(() => {
     const mermaidBlocks = document.querySelectorAll("div.mermaid");
     if (mermaidBlocks.length) {
-        loadJS(`${window.base_url}daux_libraries/mermaid.min.js`, () => {
-            window.mermaid.initialize({ startOnLoad: true });
+        import(/* webpackChunkName: "mermaid" */ `mermaid`).then(mermaid => {
+            mermaid.default.initialize({ startOnLoad: true });
         });
     }
 });
diff --git a/themes/daux/config.json b/themes/daux/config.json
@@ -1,7 +1,7 @@
 {
     "favicon": "<theme_url>img/favicon.png",
     "js": [
-        "<theme_url>js/daux.min.js"
+        "<theme_url>js/main.mjs"
     ],
     "variants": {
         "blue": {

diff --git a/themes/daux/css/theme-blue.min.css b/themes/daux/css/theme-blue.min.css
diff --git a/themes/daux/css/theme-blue.min.css.map b/themes/daux/css/theme-blue.min.css.map
diff --git a/themes/daux/css/theme-green.min.css b/themes/daux/css/theme-green.min.css
diff --git a/themes/daux/css/theme-green.min.css.map b/themes/daux/css/theme-green.min.css.map
diff --git a/themes/daux/css/theme-navy.min.css b/themes/daux/css/theme-navy.min.css
diff --git a/themes/daux/css/theme-navy.min.css.map b/themes/daux/css/theme-navy.min.css.map
diff --git a/themes/daux/css/theme-red.min.css b/themes/daux/css/theme-red.min.css
diff --git a/themes/daux/css/theme-red.min.css.map b/themes/daux/css/theme-red.min.css.map
diff --git a/themes/daux/js/1.mjs b/themes/daux/js/1.mjs
diff --git a/themes/daux/js/185.mjs b/themes/daux/js/185.mjs
@@ -0,0 +1 @@
+export const id=185;export const ids=[185];export const modules={5185:(t,e,a)=>{a.d(e,{diagram:()=>y});var i=a(1341),n=a(4309),d=a(9451),r=a(5625),s=a(3110),o=a(1188);a(7856),a(7484),a(7967);const g={},p=(t,e,a)=>{const i=(0,s.g)().state.padding,n=2*(0,s.g)().state.padding,d=t.node().getBBox(),r=d.width,o=d.x,g=t.append("text").attr("x",0).attr("y",(0,s.g)().state.titleShift).attr("font-size",(0,s.g)().state.fontSize).attr("class","state-title").text(e.id),p=g.node().getBBox().width+n;let c,h=Math.max(p,r);h===r&&(h+=n);const l=t.node().getBBox();e.doc,c=o-i,p>r&&(c=(r-h)/2+i),Math.abs(o-l.x)<i&&p>r&&(c=o-(p-r)/2);const x=1-(0,s.g)().state.textHeight;return t.insert("rect",":first-child").attr("x",c).attr("y",x).attr("class",a?"alt-composit":"composit").attr("width",h).attr("height",l.height+(0,s.g)().state.textHeight+(0,s.g)().state.titleShift+1).attr("rx","0"),g.attr("x",c+i),p<=r&&g.attr("x",o+(h-n)/2-p/2+i),t.insert("rect",":first-child").attr("x",c).attr("y",(0,s.g)().state.titleShift-(0,s.g)().state.textHeight-(0,s.g)().state.padding).attr("width",h).attr("height",3*(0,s.g)().state.textHeight).attr("rx",(0,s.g)().state.radius),t.insert("rect",":first-child").attr("x",c).attr("y",(0,s.g)().state.titleShift-(0,s.g)().state.textHeight-(0,s.g)().state.padding).attr("width",h).attr("height",l.height+3+2*(0,s.g)().state.textHeight).attr("rx",(0,s.g)().state.radius),t},c=function(t,e){const a=e.id,i={id:a,label:e.id,width:0,height:0},n=t.append("g").attr("id",a).attr("class","stateGroup");"start"===e.type&&(t=>{t.append("circle").attr("class","start-state").attr("r",(0,s.g)().state.sizeUnit).attr("cx",(0,s.g)().state.padding+(0,s.g)().state.sizeUnit).attr("cy",(0,s.g)().state.padding+(0,s.g)().state.sizeUnit)})(n),"end"===e.type&&(t=>{t.append("circle").attr("class","end-state-outer").attr("r",(0,s.g)().state.sizeUnit+(0,s.g)().state.miniPadding).attr("cx",(0,s.g)().state.padding+(0,s.g)().state.sizeUnit+(0,s.g)().state.miniPadding).attr("cy",(0,s.g)().state.padding+(0,s.g)().state.sizeUnit+(0,s.g)().state.miniPadding),t.append("circle").attr("class","end-state-inner").attr("r",(0,s.g)().state.sizeUnit).attr("cx",(0,s.g)().state.padding+(0,s.g)().state.sizeUnit+2).attr("cy",(0,s.g)().state.padding+(0,s.g)().state.sizeUnit+2)})(n),"fork"!==e.type&&"join"!==e.type||((t,e)=>{let a=(0,s.g)().state.forkWidth,i=(0,s.g)().state.forkHeight;if(e.parentId){let t=a;a=i,i=t}t.append("rect").style("stroke","black").style("fill","black").attr("width",a).attr("height",i).attr("x",(0,s.g)().state.padding).attr("y",(0,s.g)().state.padding)})(n,e),"note"===e.type&&((t,e)=>{e.attr("class","state-note");const a=e.append("rect").attr("x",0).attr("y",(0,s.g)().state.padding),i=e.append("g"),{textWidth:n,textHeight:d}=((t,e,a,i)=>{let n=0;const d=i.append("text");d.style("text-anchor","start"),d.attr("class","noteText");let r=t.replace(/\r\n/g,"<br/>");r=r.replace(/\n/g,"<br/>");const o=r.split(s.e.lineBreakRegex);let g=1.25*(0,s.g)().state.noteMargin;for(const t of o){const e=t.trim();if(e.length>0){const t=d.append("tspan");t.text(e),0===g&&(g+=t.node().getBBox().height),n+=g,t.attr("x",0+(0,s.g)().state.noteMargin),t.attr("y",0+n+1.25*(0,s.g)().state.noteMargin)}}return{textWidth:d.node().getBBox().width,textHeight:n}})(t,0,0,i);a.attr("height",d+2*(0,s.g)().state.noteMargin),a.attr("width",n+2*(0,s.g)().state.noteMargin)})(e.note.text,n),"divider"===e.type&&(t=>{t.append("line").style("stroke","grey").style("stroke-dasharray","3").attr("x1",(0,s.g)().state.textHeight).attr("class","divider").attr("x2",2*(0,s.g)().state.textHeight).attr("y1",0).attr("y2",0)})(n),"default"===e.type&&0===e.descriptions.length&&((t,e)=>{const a=t.append("text").attr("x",2*(0,s.g)().state.padding).attr("y",(0,s.g)().state.textHeight+2*(0,s.g)().state.padding).attr("font-size",(0,s.g)().state.fontSize).attr("class","state-title").text(e.id).node().getBBox();t.insert("rect",":first-child").attr("x",(0,s.g)().state.padding).attr("y",(0,s.g)().state.padding).attr("width",a.width+2*(0,s.g)().state.padding).attr("height",a.height+2*(0,s.g)().state.padding).attr("rx",(0,s.g)().state.radius)})(n,e),"default"===e.type&&e.descriptions.length>0&&((t,e)=>{const a=t.append("text").attr("x",2*(0,s.g)().state.padding).attr("y",(0,s.g)().state.textHeight+1.3*(0,s.g)().state.padding).attr("font-size",(0,s.g)().state.fontSize).attr("class","state-title").text(e.descriptions[0]).node().getBBox(),i=a.height,n=t.append("text").attr("x",(0,s.g)().state.padding).attr("y",i+.4*(0,s.g)().state.padding+(0,s.g)().state.dividerMargin+(0,s.g)().state.textHeight).attr("class","state-description");let d=!0,r=!0;e.descriptions.forEach((function(t){d||(function(t,e,a){const i=t.append("tspan").attr("x",2*(0,s.g)().state.padding).text(e);a||i.attr("dy",(0,s.g)().state.textHeight)}(n,t,r),r=!1),d=!1}));const o=t.append("line").attr("x1",(0,s.g)().state.padding).attr("y1",(0,s.g)().state.padding+i+(0,s.g)().state.dividerMargin/2).attr("y2",(0,s.g)().state.padding+i+(0,s.g)().state.dividerMargin/2).attr("class","descr-divider"),g=n.node().getBBox(),p=Math.max(g.width,a.width);o.attr("x2",p+3*(0,s.g)().state.padding),t.insert("rect",":first-child").attr("x",(0,s.g)().state.padding).attr("y",(0,s.g)().state.padding).attr("width",p+2*(0,s.g)().state.padding).attr("height",g.height+i+2*(0,s.g)().state.padding).attr("rx",(0,s.g)().state.radius)})(n,e);const d=n.node().getBBox();return i.width=d.width+2*(0,s.g)().state.padding,i.height=d.height+2*(0,s.g)().state.padding,r=i,g[a]=r,i;var r};let h,l=0;const x={},u=(t,e,a,g,f,y,w)=>{const b=new r.k({compound:!0,multigraph:!0});let m,B=!0;for(m=0;m<t.length;m++)if("relation"===t[m].stmt){B=!1;break}a?b.setGraph({rankdir:"LR",multigraph:!0,compound:!0,ranker:"tight-tree",ranksep:B?1:h.edgeLengthFactor,nodeSep:B?1:50,isMultiGraph:!0}):b.setGraph({rankdir:"TB",multigraph:!0,compound:!0,ranksep:B?1:h.edgeLengthFactor,nodeSep:B?1:50,ranker:"tight-tree",isMultiGraph:!0}),b.setDefaultEdgeLabel((function(){return{}})),w.db.extract(t);const k=w.db.getStates(),N=w.db.getRelations(),E=Object.keys(k);for(const t of E){const i=k[t];let n;if(a&&(i.parentId=a),i.doc){let t=e.append("g").attr("id",i.id).attr("class","stateGroup");n=u(i.doc,t,i.id,!g,f,y,w);{t=p(t,i,g);let e=t.node().getBBox();n.width=e.width,n.height=e.height+h.padding/2,x[i.id]={y:h.compositTitleSize}}}else n=c(e,i);if(i.note){const t={descriptions:[],id:i.id+"-note",note:i.note,type:"note"},a=c(e,t);"left of"===i.note.position?(b.setNode(n.id+"-note",a),b.setNode(n.id,n)):(b.setNode(n.id,n),b.setNode(n.id+"-note",a)),b.setParent(n.id,n.id+"-group"),b.setParent(n.id+"-note",n.id+"-group")}else b.setNode(n.id,n)}s.l.debug("Count=",b.nodeCount(),b);let v=0;N.forEach((function(t){var e;v++,s.l.debug("Setting edge",t),b.setEdge(t.id1,t.id2,{relation:t,width:(e=t.title,e?e.length*h.fontSizeFactor:1),height:h.labelHeight*s.e.getRows(t.title).length,labelpos:"c"},"id"+v)})),(0,d.bK)(b),s.l.debug("Graph after layout",b.nodes());const M=e.node();b.nodes().forEach((function(t){void 0!==t&&void 0!==b.node(t)?(s.l.warn("Node "+t+": "+JSON.stringify(b.node(t))),f.select("#"+M.id+" #"+t).attr("transform","translate("+(b.node(t).x-b.node(t).width/2)+","+(b.node(t).y+(x[t]?x[t].y:0)-b.node(t).height/2)+" )"),f.select("#"+M.id+" #"+t).attr("data-x-shift",b.node(t).x-b.node(t).width/2),y.querySelectorAll("#"+M.id+" #"+t+" .divider").forEach((t=>{const e=t.parentElement;let a=0,i=0;e&&(e.parentElement&&(a=e.parentElement.getBBox().width),i=parseInt(e.getAttribute("data-x-shift"),10),Number.isNaN(i)&&(i=0)),t.setAttribute("x1",0-i+8),t.setAttribute("x2",a-i-8)}))):s.l.debug("No Node "+t+": "+JSON.stringify(b.node(t)))}));let S=M.getBBox();b.edges().forEach((function(t){void 0!==t&&void 0!==b.edge(t)&&(s.l.debug("Edge "+t.v+" -> "+t.w+": "+JSON.stringify(b.edge(t))),function(t,e,a){e.points=e.points.filter((t=>!Number.isNaN(t.y)));const d=e.points,r=(0,n.jvg)().x((function(t){return t.x})).y((function(t){return t.y})).curve(n.$0Z),g=t.append("path").attr("d",r(d)).attr("id","edge"+l).attr("class","transition");let p="";if((0,s.g)().state.arrowMarkerAbsolute&&(p=window.location.protocol+"//"+window.location.host+window.location.pathname+window.location.search,p=p.replace(/\(/g,"\\("),p=p.replace(/\)/g,"\\)")),g.attr("marker-end","url("+p+"#"+function(t){switch(t){case i.d.relationType.AGGREGATION:return"aggregation";case i.d.relationType.EXTENSION:return"extension";case i.d.relationType.COMPOSITION:return"composition";case i.d.relationType.DEPENDENCY:return"dependency"}}(i.d.relationType.DEPENDENCY)+"End)"),void 0!==a.title){const i=t.append("g").attr("class","stateLabel"),{x:n,y:d}=o.u.calcLabelPosition(e.points),r=s.e.getRows(a.title);let g=0;const p=[];let c=0,h=0;for(let t=0;t<=r.length;t++){const e=i.append("text").attr("text-anchor","middle").text(r[t]).attr("x",n).attr("y",d+g),a=e.node().getBBox();if(c=Math.max(c,a.width),h=Math.min(h,a.x),s.l.info(a.x,n,d+g),0===g){const t=e.node().getBBox();g=t.height,s.l.info("Title height",g,d)}p.push(e)}let l=g*r.length;if(r.length>1){const t=(r.length-1)*g*.5;p.forEach(((e,a)=>e.attr("y",d+a*g-t))),l=g*r.length}const x=i.node().getBBox();i.insert("rect",":first-child").attr("class","box").attr("x",n-c/2-(0,s.g)().state.padding/2).attr("y",d-l/2-(0,s.g)().state.padding/2-3.5).attr("width",c+(0,s.g)().state.padding).attr("height",l+(0,s.g)().state.padding),s.l.info(x)}l++}(e,b.edge(t),b.edge(t).relation))})),S=M.getBBox();const z={id:a||"root",label:a||"root",width:0,height:0};return z.width=S.width+2*h.padding,z.height=S.height+2*h.padding,s.l.debug("Doc rendered",z,b),z},f={setConf:function(){},draw:function(t,e,a,i){h=(0,s.g)().state;const d=(0,s.g)().securityLevel;let g;"sandbox"===d&&(g=(0,n.Ys)("#i"+e));const p="sandbox"===d?(0,n.Ys)(g.nodes()[0].contentDocument.body):(0,n.Ys)("body"),c="sandbox"===d?g.nodes()[0].contentDocument:document;s.l.debug("Rendering diagram "+t);const l=p.select(`[id='${e}']`);l.append("defs").append("marker").attr("id","dependencyEnd").attr("refX",19).attr("refY",7).attr("markerWidth",20).attr("markerHeight",28).attr("orient","auto").append("path").attr("d","M 19,7 L9,13 L14,7 L9,1 Z"),new r.k({multigraph:!0,compound:!0,rankdir:"RL"}).setDefaultEdgeLabel((function(){return{}}));const x=i.db.getRootDoc();u(x,l,void 0,!1,p,c,i);const f=h.padding,y=l.node().getBBox(),w=y.width+2*f,b=y.height+2*f,m=1.75*w;(0,o.k)(l,b,m,h.useMaxWidth),l.attr("viewBox",`${y.x-h.padding}  ${y.y-h.padding} `+w+" "+b)}},y={parser:i.p,db:i.d,renderer:f,styles:i.s,init:t=>{t.state||(t.state={}),t.state.arrowMarkerAbsolute=t.arrowMarkerAbsolute,i.d.clear()}}}};
diff --git a/themes/daux/js/211.mjs b/themes/daux/js/211.mjs
diff --git a/themes/daux/js/216.mjs b/themes/daux/js/216.mjs