fix 流程图预览调试

2025-09-06 12:18:09 +00:00 · 2023-03-15 18:01:33 +08:00
parent f528d9934e
commit ad65a10b04
8 changed files with 231 additions and 159 deletions
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
    "@zxcvbn-ts/core": "^2.0.1",
    "ant-design-vue": "^3.2.15",
    "axios": "^0.26.1",
-    "bpmn-js": "^7.5.0",
+    "bpmn-js": "^11.5.0",
    "codemirror": "^5.65.3",
    "cron-parser": "^4.6.0",
    "cropperjs": "^1.5.12",
--- a/src/components/Bpmn/ProcessViewer.vue
+++ b/src/components/Bpmn/ProcessViewer.vue
@@ -2,19 +2,19 @@
  <div class="flow-containers view-mode" style="height: 100%">
    <a-layout style="height: 100%">
      <a-layout style="align-items: stretch">
-        <div ref="canvas" class="canvas" :style="{ minHeight: height + 'px' }"></div>
-        <!--        <a-drawer :visible="drawerVisible" title="流程信息" :width="450" placement="right" :closable="true" @close="drawerVisible = false">-->
-        <!--          <a-timeline>-->
-        <!--            <a-timeline-item v-for="o in currentTaskList" :key="o.id">-->
-        <!--              <p>开始时间: {{ o.startTime }}</p>-->
-        <!--              <p>状态：{{ stateNameConvert(o.state) }}</p>-->
-        <!--              <p>处理结果：{{ dictConvert('BpmTaskResult', o.result) }}</p>-->
-        <!--              <p>处理人: {{ o.userName }}</p>-->
-        <!--              <p>结束时间: {{ o.endTime ? o.endTime : '' }}</p>-->
-        <!--              <p>审批意见：{{ o.reason ? o.reason : '' }}</p>-->
-        <!--            </a-timeline-item>-->
-        <!--          </a-timeline>-->
-        <!--        </a-drawer>-->
+        <div ref="canvas" id="canvas" class="canvas" :style="{ minHeight: height + 'px' }"></div>
+        <a-drawer :visible="drawerVisible" title="流程信息" :width="450" placement="right" :closable="true" @close="drawerVisible = false">
+          <a-timeline>
+            <a-timeline-item v-for="o in currentTaskList" :key="o.id">
+              <p>开始时间: {{ o.startTime }}</p>
+              <p>状态：{{ stateNameConvert(o.state) }}</p>
+              <p>处理结果：{{ dictConvert('BpmTaskResult', o.result) }}</p>
+              <p>处理人: {{ o.userName }}</p>
+              <p>结束时间: {{ o.endTime ? o.endTime : '' }}</p>
+              <p>审批意见：{{ o.reason ? o.reason : '' }}</p>
+            </a-timeline-item>
+          </a-timeline>
+        </a-drawer>
        <a-layout-sider
          class="sider"
          style="
@@ -32,6 +32,11 @@
 </template>

 <script lang="ts" setup>
+  import 'bpmn-js/dist/assets/diagram-js.css' // 左边工具栏以及编辑节点的样式
+  import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
+  import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
+  import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
+
  // 汉化
  import customTranslate from './common/customTranslate'
  import Modeler from 'bpmn-js/lib/Modeler'
@@ -41,7 +46,7 @@
  import { addArrow } from './processViewerUtils'
  import { useDict } from '/@/hooks/bootx/useDict'
  import { $ref } from 'vue/macros'
-  import { onMounted, watch } from 'vue'
+  import { nextTick, onMounted, watch, watchEffect } from 'vue'

  const { dictConvert } = useDict()
  const props = withDefaults(
@@ -74,45 +79,29 @@
  let drawerVisible = $ref(false)
  let currentTaskList = $ref([])

-  let elementOverlayIds = $ref<any>()
-  let overlays = $ref<any>()
+  // 流程相关变量, 不需要进行响应式
+  let elementOverlayIds
+  let overlays

-  watch(
-    () => props.xml,
-    (newVal, oldVal) => {
-      console.log(newVal)
-      createDiagram()
-    },
-  )
-  watch(
-    () => props.flowNodeList,
-    (newVal, oldVal) => {
-      console.log(props.xml)
-      createDiagram()
-    }
-  )
-  watch(
-    () => props.nodeTaskList,
-    (newVal, oldVal) => createDiagram(),
-  )
-
-  onMounted(() => {
+  watchEffect(() => {
    initModeler()
-    initEventBind()
  })

  /**
   * 生成实例
   */
  function initModeler() {
+    nextTick(async () => {
      modeler = new Modeler({
-      container: canvas,
+        container: '#canvas',
+        propertiesPanel: {},
        additionalModules: [
          {
            translate: ['value', customTranslate],
            paletteProvider: ['value', ''], // 禁用/清空左侧工具栏
            labelEditingProvider: ['value', ''], // 禁用节点编辑
            contextPadProvider: ['value', ''], // 禁用图形菜单
+            AppendContextPadProvider: ['value', ''],
            bendpoints: ['value', {}], // 禁用连线拖动
            // zoomScroll: ['value', ''], // 禁用滚动
            // moveCanvas: ['value', ''], // 禁用拖动整个流程图
@@ -123,21 +112,24 @@
          flowable: flowableModdle,
        },
      })
+      await createDiagram()
+      initEventBind()
+    })
  }

  /**
   * 创建流程图
   */
  async function createDiagram() {
-    console.log(123)
-    if (!props.xml) {
+    // modeler需要初始化完毕且已经有 xml 参数后才进行渲染
+    if (!props.xml || !modeler) {
      return
    }
    // 将字符串转换成图显示出来
    const data = props.xml.replace(/<!\[CDATA\[(.+?)]]>/g, function (match, str) {
      return str.replace(/</g, '&lt;')
    })
-    await modeler?.importXML(data)
+    await modeler.importXML(data)
    initSvg()
    fillColor()
    fitViewport()
@@ -184,6 +176,7 @@
    if (e.type === 'bpmn:UserTask') {
      const tasks = props.nodeTaskList[e.id]
      if (tasks) {
+        // 显示第一条任务信息
        const task = tasks[0]
        if (task) {
          html += `<span>执行人：${task.userName}</span>
@@ -192,6 +185,7 @@
                  <span>结束时间：${task.endTime ? task.endTime : ''}</span>
                  <span>审批意见：${task.reason ? task.reason : ''}</span>`
        }
+        // 多次处理会提示点击查看详情
        if (tasks[1]) {
          html += `</br>
            <span>点击查看更多...</span>`
@@ -216,7 +210,6 @@
   * 流程图的元素被 out
   */
  function elementOut(element) {
-    console.log(element)
    overlays.remove({ element })
    elementOverlayIds[element.id] = null
  }
@@ -305,23 +298,22 @@
 <style lang="less" scoped>
  // Font class
  @import './icon/iconfont.css';
-  /*左边工具栏以及编辑节点的样式*/
-  @import 'bpmn-js/dist/assets/diagram-js.css';
-  @import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css';
-  @import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css';
-  @import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';
-
  @import './css/ProcessViewerHighlight.less';
+
  .view-mode {
    .ant-layout-header,
    .ant-layout-sider,
-    /deep/.djs-palette,
-    /deep/.bjs-powered-by {
+    :deep(.djs-palette),
+    :deep(.bjs-powered-by) {
+      ///deep/.djs-palette,
+      ///deep/.bjs-powered-by {
      display: none;
    }
  }
  // 信息显示框
-  /deep/.element-overlays {
+  :deep(.element-overlays) {
+    ///deep/.element-overlays {
+    display: grid;
    box-sizing: border-box;
    padding: 8px;
    background: rgba(0, 0, 0, 0.6);
@@ -359,14 +351,17 @@
    }
  }

-  /deep/ .ant-layout-sider:hover {
+  :deep(.ant-layout-sider:hover) {
+    ///deep/.ant-layout-sider:hover {
    background: #0a97ce25 !important;
  }

-  /deep/ .ant-layout-sider {
+  :deep(.ant-layout-sider) {
+    ///deep/.ant-layout-sider {
    z-index: 2;
  }

+  //:deep(.djs-container) {
  /deep/ .djs-container {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHBhdHRlcm4gaWQ9ImEiIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgcGF0dGVyblVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHBhdGggZD0iTTAgMTBoNDBNMTAgMHY0ME0wIDIwaDQwTTIwIDB2NDBNMCAzMGg0ME0zMCAwdjQwIiBmaWxsPSJub25lIiBzdHJva2U9IiNlMGUwZTAiIG9wYWNpdHk9Ii4yIi8+PHBhdGggZD0iTTQwIDBIMHY0MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTBlMGUwIi8+PC9wYXR0ZXJuPjwvZGVmcz48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+)
      repeat !important;
--- a/src/components/Bpmn/common/customTranslate.js
+++ b/src/components/Bpmn/common/customTranslate.js
@@ -8,7 +8,7 @@ export default function customTranslate(template, replacements) {

  // Replace
  return template.replace(/{([^}]+)}/g, function (_, key) {
-    var str = replacements[key]
+    let str = replacements[key]
    if (translations[replacements[key]] !== null && translations[replacements[key]] !== 'undefined') {
      str = translations[replacements[key]]
    }
--- a/src/components/registerGlobComp.ts
+++ b/src/components/registerGlobComp.ts
@@ -1,3 +1,4 @@
+//  @ts-nocheck
 import type { App } from 'vue'
 import { Button } from './Button'
 import { Link } from './Link'
@@ -27,6 +28,7 @@ import {
  Col,
  Modal,
  Dropdown,
+  Timeline,
  Radio,
  Steps,
  Spin,
@@ -64,6 +66,7 @@ export function registerGlobComp(app: App) {
  app.use(Divider)
  app.use(DatePicker)
  app.use(TimePicker)
+  app.use(Timeline)
  app.use(Typography)
  app.use(Empty)
  app.use(Popconfirm)
--- a/src/main.ts
+++ b/src/main.ts
@@ -2,6 +2,11 @@ import 'virtual:windi-base.css'
 import 'virtual:windi-components.css'
 import '/@/design/index.less'
 import 'virtual:windi-utilities.css'
+// 工作流编辑器语句
+// import 'bpmn-js/dist/assets/diagram-js.css'
+// import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
+// import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
+// import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
 // Register icon sprite
 import 'virtual:svg-icons-register'
 import App from './App.vue'
--- a/src/views/modules/bpm/design/ProcessDesign.vue
+++ b/src/views/modules/bpm/design/ProcessDesign.vue
--- a/src/views/modules/bpm/model/BpmModeler.vue
+++ b/src/views/modules/bpm/model/BpmModeler.vue
@@ -8,6 +8,7 @@
      :flow-node-list="flowNodeList"
      :xml="bpmModel.modelEditorXml"
    />
+<!--    <process-design/>-->
  </basic-modal>
 </template>

--- a/yarn.lock
+++ b/yarn.lock
@@ -974,6 +974,14 @@
    "@babel/helper-validator-identifier" "^7.18.6"
    to-fast-properties "^2.0.0"

+"@bpmn-io/diagram-js-ui@^0.2.2":
+  version "0.2.2"
+  resolved "https://registry.npmmirror.com/@bpmn-io/diagram-js-ui/-/diagram-js-ui-0.2.2.tgz#f182476e820641901c10d0079dcfe7b5b022b9f6"
+  integrity sha512-IgOIxOwoqsFB2mMPdXtcbPVPjdYkZ3huW7ipowYLhg5jdRGHlBronQ+LER+lfWro6sPtzEsw7qX8D8Yq9M2S5g==
+  dependencies:
+    htm "^3.1.1"
+    preact "^10.11.2"
+
 "@commitlint/cli@^16.2.3":
  version "16.3.0"
  resolved "https://registry.npmmirror.com/@commitlint/cli/-/cli-16.3.0.tgz#5689f5c2abbb7880d5ff13329251e5648a784b16"
@@ -2792,30 +2800,29 @@ boolbase@^1.0.0:
  resolved "https://registry.npmmirror.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
  integrity sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==

-bpmn-js@^7.5.0:
-  version "7.5.0"
-  resolved "https://registry.npmmirror.com/bpmn-js/-/bpmn-js-7.5.0.tgz#0e4675acdbdff676db859f8cb7ec395d20e7bbd8"
-  integrity sha512-0ANaE6Bikg1GmkcvO7RK0MQPX+EKYKBc+q7OWk39/16NcCdNZ/4UiRcCr9n0u1VUCIDsSU/jJ79TIZFnV5CNjw==
+bpmn-js@^11.5.0:
+  version "11.5.0"
+  resolved "https://registry.npmmirror.com/bpmn-js/-/bpmn-js-11.5.0.tgz#0f8a896637a3335173c1734e52d40ed8b5abf651"
+  integrity sha512-Bdj53UvfiDtGE1wmiBmpgjl5RMLhCGV/C841dyC+t4kBHj7vApAeeHs2Qiycj390HO4B2U8UDROLT7yjdXEEUA==
  dependencies:
-    bpmn-moddle "^7.0.4"
-    css.escape "^1.5.1"
-    diagram-js "^6.8.2"
-    diagram-js-direct-editing "^1.6.1"
+    bpmn-moddle "^8.0.0"
+    diagram-js "^11.9.1"
+    diagram-js-direct-editing "^2.0.0"
    ids "^1.0.0"
-    inherits "^2.0.4"
-    min-dash "^3.5.2"
-    min-dom "^3.1.3"
+    inherits-browser "^0.1.0"
+    min-dash "^4.0.0"
+    min-dom "^4.0.3"
    object-refs "^0.3.0"
-    tiny-svg "^2.2.2"
+    tiny-svg "^3.0.0"

-bpmn-moddle@^7.0.4:
-  version "7.1.3"
-  resolved "https://registry.npmmirror.com/bpmn-moddle/-/bpmn-moddle-7.1.3.tgz#5b4592001e8f23dbdb18c557531e06489462bf42"
-  integrity sha512-ZcBfw0NSOdYTSXFKEn7MOXHItz7VfLZTrFYKO8cK6V8ZzGjCcdiLIOiw7Lctw1PJsihhLiZQS8Htj2xKf+NwCg==
+bpmn-moddle@^8.0.0:
+  version "8.0.1"
+  resolved "https://registry.npmmirror.com/bpmn-moddle/-/bpmn-moddle-8.0.1.tgz#ba8a009fbd354fb521a11a1dd1417655a9d2ec02"
+  integrity sha512-mwZcrWhi52+JH5Oq58WwKYcUxQ1ZMiDQuzt1bpqiqEEFFnQLqCgtLwEXQuDXFmAuQPdMAghyPzqdOZQqIQVesw==
  dependencies:
-    min-dash "^3.5.2"
-    moddle "^5.0.2"
-    moddle-xml "^9.0.6"
+    min-dash "^4.0.0"
+    moddle "^6.0.0"
+    moddle-xml "^10.0.0"

 brace-expansion@^1.1.7:
  version "1.1.11"
@@ -3196,6 +3203,11 @@ clone@^2.1.1:
  resolved "https://registry.npmmirror.com/clone/-/clone-2.1.2.tgz#1b7f4b9f591f1e8f83670401600345a02887435f"
  integrity sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==

+clsx@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.npmmirror.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12"
+  integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==
+
 codemirror@^5.65.3:
  version "5.65.6"
  resolved "https://registry.npmmirror.com/codemirror/-/codemirror-5.65.6.tgz#fc313797331cbeb3bcab0652d1ec9d0f40c23ab5"
@@ -3286,10 +3298,10 @@ component-emitter@^1.2.1:
  resolved "https://registry.npmmirror.com/component-emitter/-/component-emitter-1.3.0.tgz#16e4070fba8ae29b679f2215853ee181ab2eabc0"
  integrity sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==

-component-event@^0.1.4:
-  version "0.1.4"
-  resolved "https://registry.npmmirror.com/component-event/-/component-event-0.1.4.tgz#3de78fc28782381787e24bf2a7c536bf0142c9b4"
-  integrity sha512-GMwOG8MnUHP1l8DZx1ztFO0SJTFnIzZnBDkXAj8RM2ntV2A6ALlDxgbMY1Fvxlg6WPQ+5IM/a6vg4PEYbjg/Rw==
+component-event@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.npmmirror.com/component-event/-/component-event-0.2.1.tgz#8262d2be886c999ad4b85ed3e0dfb3b3e98ca9d3"
+  integrity sha512-wGA++isMqiDq1jPYeyv2as/Bt/u+3iLW0rEa+8NQ82jAv3TgqMiCM+B2SaBdn2DfLilLjjq736YcezihRYhfxw==

 compute-scroll-into-view@^1.0.17:
  version "1.0.17"
@@ -3688,11 +3700,6 @@ css-what@^6.0.1:
  resolved "https://registry.npmmirror.com/css-what/-/css-what-6.1.0.tgz#fb5effcf76f1ddea2c81bdfaa4de44e79bac70f4"
  integrity sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==

-css.escape@^1.5.1:
-  version "1.5.1"
-  resolved "https://registry.npmmirror.com/css.escape/-/css.escape-1.5.1.tgz#42e27d4fa04ae32f931a4b4d4191fa9cddee97cb"
-  integrity sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==
-
 cssesc@^3.0.0:
  version "3.0.0"
  resolved "https://registry.npmmirror.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
@@ -3915,33 +3922,34 @@ deprecation@^2.0.0, deprecation@^2.3.1:
  resolved "https://registry.npmmirror.com/deprecation/-/deprecation-2.3.1.tgz#6368cbdb40abf3373b525ac87e4a260c3a700919"
  integrity sha512-xmHIy4F3scKVwMsQ4WnVaS8bHOx0DmVwRywosKhaILI0ywMDWPtBSku2HNxRvF7jtwDRsoEwYQSfbxj8b7RlJQ==

-diagram-js-direct-editing@^1.6.1:
-  version "1.8.0"
-  resolved "https://registry.npmmirror.com/diagram-js-direct-editing/-/diagram-js-direct-editing-1.8.0.tgz#7a178cd9203f262842a3e0023f9644e04a157858"
-  integrity sha512-B4Xj+PJfgBjbPEzT3uZQEkZI5xHFB0Izc+7BhDFuHidzrEMzQKZrFGdA3PqfWhReHf3dp+iB6Tt11G9eGNjKMw==
+diagram-js-direct-editing@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmmirror.com/diagram-js-direct-editing/-/diagram-js-direct-editing-2.0.0.tgz#0c7ec8ba2e3bad79bb97384e6acc522a225c07b1"
+  integrity sha512-/12OWL0B0RMCfaT1w3723c729MD42r5fay4wtm2DvxNFNBMdPaEvOHCTA/khLKjFzOzMVKxSzbAp7IEwBGonVw==
  dependencies:
-    min-dash "^3.5.2"
-    min-dom "^3.1.3"
+    min-dash "^4.0.0"
+    min-dom "^4.0.2"

-diagram-js@^6.8.2:
-  version "6.8.2"
-  resolved "https://registry.npmmirror.com/diagram-js/-/diagram-js-6.8.2.tgz#d3c37915c62c0cc5d95bc533098c8a35b38e67be"
-  integrity sha512-5EKYHjW2mmGsn9/jSenSkm8cScK5sO9eETBRQNIIzgZjxBDJn6eX964L2d7/vrAW9SeuijGUsztL9+NUinSsNg==
+diagram-js@^11.9.1:
+  version "11.11.0"
+  resolved "https://registry.npmmirror.com/diagram-js/-/diagram-js-11.11.0.tgz#2c44aebc5197eca43df8394598b2faabcdff1692"
+  integrity sha512-+GJ6NPCihQBOqLKAjrXE+bQNYIhFjrCQgYHfPb22OcrYJ9k6vkTfJfG5PsyJ9P/AEIrXwTnrJAff/iKU1RgfAA==
  dependencies:
-    css.escape "^1.5.1"
-    didi "^4.0.0"
+    "@bpmn-io/diagram-js-ui" "^0.2.2"
+    clsx "^1.2.1"
+    didi "^9.0.2"
    hammerjs "^2.0.1"
-    inherits "^2.0.1"
-    min-dash "^3.5.0"
-    min-dom "^3.1.2"
+    inherits-browser "^0.1.0"
+    min-dash "^4.0.0"
+    min-dom "^4.0.2"
    object-refs "^0.3.0"
-    path-intersection "^2.2.0"
-    tiny-svg "^2.2.1"
+    path-intersection "^2.2.1"
+    tiny-svg "^3.0.0"

-didi@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.npmmirror.com/didi/-/didi-4.0.0.tgz#2b89d892a67fd3777f7642d3bf06697b69e9b622"
-  integrity sha512-AzMElh8mCHOPWPCWfGjoJRla31fMXUT6+287W5ef3IPmtuBcyG9+MkFS7uPP6v3t2Cl086KwWfRB9mESa0OsHQ==
+didi@^9.0.2:
+  version "9.0.2"
+  resolved "https://registry.npmmirror.com/didi/-/didi-9.0.2.tgz#e49a80aa281b5672e45519ba1980d7fba2e32cfb"
+  integrity sha512-q2+aj+lnJcUweV7A9pdUrwFr4LHVmRPwTmQLtHPFz4aT7IBoryN6Iy+jmFku+oIzr5ebBkvtBCOb87+dJhb7bg==

 diff-match-patch@^1.0.5:
  version "1.0.5"
@@ -4030,7 +4038,7 @@ domhandler@^4.2.0, domhandler@^4.2.2, domhandler@^4.3.1:
  dependencies:
    domelementtype "^2.2.0"

-domify@^1.3.1:
+domify@^1.4.1:
  version "1.4.1"
  resolved "https://registry.npmmirror.com/domify/-/domify-1.4.1.tgz#2e1e813019646715deeb8d3c5de4d3ef7bddd07e"
  integrity sha512-x18nuiDHMCZGXr4KJSRMf/TWYtiaRo6RX8KN9fEbW54mvbQ6pieUuerC2ahBg+kEp1wycFj8MPUI0WkIOw5E9w==
@@ -5640,6 +5648,11 @@ hosted-git-info@^4.0.0, hosted-git-info@^4.0.1:
  dependencies:
    lru-cache "^6.0.0"

+htm@^3.1.1:
+  version "3.1.1"
+  resolved "https://registry.npmmirror.com/htm/-/htm-3.1.1.tgz#49266582be0dc66ed2235d5ea892307cc0c24b78"
+  integrity sha512-983Vyg8NwUE7JkZ6NmOqpCZ+sh1bKv2iYTlUkzlWmA5JD2acKoxd4KVxbMmxX/85mtfdnDmTFoNKcg5DGAvxNQ==
+
 html-minifier-terser@^6.1.0:
  version "6.1.0"
  resolved "https://registry.npmmirror.com/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz#bfc818934cc07918f6b3669f5774ecdfd48f32ab"
@@ -5875,11 +5888,6 @@ indent-string@^4.0.0:
  resolved "https://registry.npmmirror.com/indent-string/-/indent-string-4.0.0.tgz#624f8f4497d619b2d9768531d58f4122854d7251"
  integrity sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==

-indexof@0.0.1:
-  version "0.0.1"
-  resolved "https://registry.npmmirror.com/indexof/-/indexof-0.0.1.tgz#82dc336d232b9062179d05ab3293a66059fd435d"
-  integrity sha512-i0G7hLJ1z0DE8dsqJa2rycj9dBmNKgXBvotXtZYXakU9oivfB9Uj2ZBC27qqef2U58/ZLwalxa1X/RDCdkHtVg==
-
 inflight@^1.0.4:
  version "1.0.6"
  resolved "https://registry.npmmirror.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9"
@@ -5888,6 +5896,11 @@ inflight@^1.0.4:
    once "^1.3.0"
    wrappy "1"

+inherits-browser@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.npmmirror.com/inherits-browser/-/inherits-browser-0.1.0.tgz#893a7c9cc78f2a1e18093aaa203bbb8cf5c30511"
+  integrity sha512-CJHHvW3jQ6q7lzsXPpapLdMx5hDpSF3FSh45pwsj6bKxJJ8Nl8v43i5yXnr3BdfOimGHKyniewQtnAIp3vyJJw==
+
 inherits@2, inherits@^2.0.1, inherits@^2.0.3, inherits@^2.0.4, inherits@~2.0.3:
  version "2.0.4"
  resolved "https://registry.npmmirror.com/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
@@ -6878,11 +6891,6 @@ map-visit@^1.0.0:
  dependencies:
    object-visit "^1.0.0"

-matches-selector@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.npmmirror.com/matches-selector/-/matches-selector-1.2.0.tgz#d1814e7e8f43e69d22ac33c9af727dc884ecf12a"
-  integrity sha512-c4vLwYWyl+Ji+U43eU/G5FwxWd4ZH0ePUsFs5y0uwD9HUEFBXUQ1zUUan+78IpRD+y4pUfG0nAzNM292K7ItvA==
-
 mathml-tag-names@^2.1.3:
  version "2.1.3"
  resolved "https://registry.npmmirror.com/mathml-tag-names/-/mathml-tag-names-2.1.3.tgz#4ddadd67308e780cf16a47685878ee27b736a0a3"
@@ -7020,21 +7028,19 @@ mimic-response@^1.0.0:
  resolved "https://registry.npmmirror.com/mimic-response/-/mimic-response-1.0.1.tgz#4923538878eef42063cb8a3e3b0798781487ab1b"
  integrity sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ==

-min-dash@^3.0.0, min-dash@^3.5.0, min-dash@^3.5.2, min-dash@^3.8.1:
-  version "3.8.1"
-  resolved "https://registry.npmmirror.com/min-dash/-/min-dash-3.8.1.tgz#09a8bd8a041d65eec4732042cde9cb24a6e84b0d"
-  integrity sha512-evumdlmIlg9mbRVPbC4F5FuRhNmcMS5pvuBUbqb1G9v09Ro0ImPEgz5n3khir83lFok1inKqVDjnKEg3GpDxQg==
+min-dash@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.npmmirror.com/min-dash/-/min-dash-4.0.0.tgz#4a1afec4c4d70f510b6e241d0550493d4ac0f161"
+  integrity sha512-piIvVJ/nxuA4+LpnYIzF6oCtRvdtDvQJteSC+H768H2UvPKFKIt5oiJnUVtr0ZdchneXTcvUZ91vIrvWVIN0AA==

-min-dom@^3.1.2, min-dom@^3.1.3:
-  version "3.2.1"
-  resolved "https://registry.npmmirror.com/min-dom/-/min-dom-3.2.1.tgz#c272a814397d8bfe97edd12670e7ac34123c043f"
-  integrity sha512-v6YCmnDzxk4rRJntWTUiwggLupPw/8ZSRqUq0PDaBwVZEO/wYzCH4SKVBV+KkEvf3u0XaWHly5JEosPtqRATZA==
+min-dom@^4.0.2, min-dom@^4.0.3:
+  version "4.1.0"
+  resolved "https://registry.npmmirror.com/min-dom/-/min-dom-4.1.0.tgz#ecbf9a2d0412ffe4ddc14253d65d15b47b6b4bf8"
+  integrity sha512-1lj1EyoSwY/UmTeT/hhPiZTsq+vK9D+8FAJ/53iK5jT1otkG9rJTixSKdjmTieEvdfES+sKbbTptzaQJhnacjA==
  dependencies:
-    component-event "^0.1.4"
-    domify "^1.3.1"
-    indexof "0.0.1"
-    matches-selector "^1.2.0"
-    min-dash "^3.8.1"
+    component-event "^0.2.1"
+    domify "^1.4.1"
+    min-dash "^4.0.0"

 min-indent@^1.0.0:
  version "1.0.1"
@@ -7084,21 +7090,21 @@ mockjs@^1.1.0:
  dependencies:
    commander "*"

-moddle-xml@^9.0.6:
-  version "9.0.6"
-  resolved "https://registry.npmmirror.com/moddle-xml/-/moddle-xml-9.0.6.tgz#282b2a2232065a82556ba3fbbe3010b374f95cbf"
-  integrity sha512-tl0reHpsY/aKlLGhXeFlQWlYAQHFxTkFqC8tq8jXRYpQSnLVw13T6swMaourLd7EXqHdWsc+5ggsB+fEep6xZQ==
+moddle-xml@^10.0.0:
+  version "10.1.0"
+  resolved "https://registry.npmmirror.com/moddle-xml/-/moddle-xml-10.1.0.tgz#8c2a1b73c73cc8915182d5374857c43ba482c7a5"
+  integrity sha512-erWckwLt+dYskewKXJso9u+aAZ5172lOiYxSOqKCPTy7L/xmqH1PoeoA7eVC7oJTt3PqF5TkZzUmbjGH6soQBg==
  dependencies:
-    min-dash "^3.5.2"
-    moddle "^5.0.2"
+    min-dash "^4.0.0"
+    moddle "^6.0.0"
    saxen "^8.1.2"

-moddle@^5.0.2:
-  version "5.0.4"
-  resolved "https://registry.npmmirror.com/moddle/-/moddle-5.0.4.tgz#1108c9ff210df552ef4589513e620d171e4468e6"
-  integrity sha512-Kjb+hjuzO+YlojNGxEUXvdhLYTHTtAABDlDcJTtTcn5MbJF9Zkv4I1Fyvp3Ypmfgg1EfHDZ3PsCQTuML9JD6wg==
+moddle@^6.0.0:
+  version "6.2.1"
+  resolved "https://registry.npmmirror.com/moddle/-/moddle-6.2.1.tgz#822163908b96b81f5f086441a558198feec735aa"
+  integrity sha512-rBT4P19k9wKOerFHNJQugw25CK6DK5m4lVZGac7godbWNPsbJgr1K4GJ+pqM1ErbRYxljXCTDgPhJLoDWE4wwQ==
  dependencies:
-    min-dash "^3.0.0"
+    min-dash "^4.0.0"

 modify-values@^1.0.0:
  version "1.0.1"
@@ -7659,7 +7665,7 @@ path-exists@^4.0.0:
  resolved "https://registry.npmmirror.com/path-exists/-/path-exists-4.0.0.tgz#513bdbe2d3b95d7762e8c1137efa195c6c61b5b3"
  integrity sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==

-path-intersection@^2.2.0:
+path-intersection@^2.2.1:
  version "2.2.1"
  resolved "https://registry.npmmirror.com/path-intersection/-/path-intersection-2.2.1.tgz#8476b75fefb7ac402f810d304e0eb0c080c11fe7"
  integrity sha512-9u8xvMcSfuOiStv9bPdnRJQhGQXLKurew94n4GPQCdH1nj9QKC9ObbNoIpiRq8skiOBxKkt277PgOoFgAt3/rA==
@@ -7917,6 +7923,11 @@ posthtml@^0.9.2:
    posthtml-parser "^0.2.0"
    posthtml-render "^1.0.5"

+preact@^10.11.2:
+  version "10.13.1"
+  resolved "https://registry.npmmirror.com/preact/-/preact-10.13.1.tgz#d220bd8771b8fa197680d4917f3cefc5eed88720"
+  integrity sha512-KyoXVDU5OqTpG9LXlB3+y639JAGzl8JSBXLn1J9HTSB3gbKcuInga7bZnXLlxmK94ntTs1EFeZp0lrja2AuBYQ==
+
 preact@^10.5.13:
  version "10.11.3"
  resolved "https://registry.npmmirror.com/preact/-/preact-10.11.3.tgz#8a7e4ba19d3992c488b0785afcc0f8aa13c78d19"
@@ -9340,10 +9351,10 @@ timed-out@^4.0.0, timed-out@^4.0.1:
  resolved "https://registry.npmmirror.com/timed-out/-/timed-out-4.0.1.tgz#f32eacac5a175bea25d7fab565ab3ed8741ef56f"
  integrity sha512-G7r3AhovYtr5YKOWQkta8RKAPb+J9IsO4uVmzjl8AZwfhs8UcUwTiD6gcJYSgOtzyjvQKrKYn41syHbUWMkafA==

-tiny-svg@^2.2.1, tiny-svg@^2.2.2:
-  version "2.2.4"
-  resolved "https://registry.npmmirror.com/tiny-svg/-/tiny-svg-2.2.4.tgz#8d4a16bd2c4644c8444fd3c2ece91db7631cfb35"
-  integrity sha512-NOi39lBknf4UdDEahNkbEAJnzhu1ZcN2j75IS2vLRmIhsfxdZpTChfLKBcN1ShplVmPIXJAIafk6YY5/Aa80lQ==
+tiny-svg@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.npmmirror.com/tiny-svg/-/tiny-svg-3.0.0.tgz#2a441d7f9cb27982e548e757f86a0a123a6f7e38"
+  integrity sha512-+u6VomQO7MbI7CQe5q1IwNePpbVKG/HVdUQBmaEpSCdP/QmeyjhrS6WKFsNetXlvf9LWu/f5woRqjMdxBMe/0w==

 tiny-warning@^1.0.3:
  version "1.0.3"