@cnc_cbz/usefultools-plugin-official 1.0.9 → 1.1.1

package/dist/text-diff.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, openBlock, createElementBlock, createCommentVNode, createElementVNode, createTextVNode, toDisplayString, normalizeClass, withDirectives, vModelText, Fragment, renderList } from "vue";
+import { defineComponent, ref, computed, openBlock, createElementBlock, createCommentVNode, createElementVNode, normalizeClass, createTextVNode, toDisplayString, Fragment, withDirectives, vModelText, renderList } from "vue";
 class Diff {
   diff(oldStr, newStr, options = {}) {
     let callback;
@@ -247,37 +247,43 @@ function tokenize(value, options) {
 }
 const _hoisted_1 = { class: "flex flex-col h-full gap-3" };
 const _hoisted_2 = { class: "flex flex-wrap items-center gap-3" };
-const _hoisted_3 = { class: "ml-auto flex items-center gap-3" };
-const _hoisted_4 = {
+const _hoisted_3 = { class: "flex border-2 border-white/20 rounded overflow-hidden" };
+const _hoisted_4 = { class: "ml-auto flex items-center gap-3" };
+const _hoisted_5 = {
   key: 0,
   class: "flex items-center gap-3 text-sm font-bold"
 };
-const _hoisted_5 = { class: "text-neon-green" };
-const _hoisted_6 = { class: "text-coral-red" };
-const _hoisted_7 = {
+const _hoisted_6 = { class: "text-neon-green" };
+const _hoisted_7 = { class: "text-coral-red" };
+const _hoisted_8 = {
   key: 1,
   class: "flex border-2 border-white/20 rounded overflow-hidden"
 };
-const _hoisted_8 = {
+const _hoisted_9 = { class: "flex-1 grid grid-cols-2 gap-3 min-h-0" };
+const _hoisted_10 = { class: "flex flex-col min-h-0" };
+const _hoisted_11 = { class: "flex items-center gap-2 mb-1.5" };
+const _hoisted_12 = { class: "text-sm font-bold text-gray-400 tracking-wider" };
+const _hoisted_13 = ["placeholder"];
+const _hoisted_14 = { class: "flex flex-col min-h-0" };
+const _hoisted_15 = { class: "flex items-center gap-2 mb-1.5" };
+const _hoisted_16 = { class: "text-sm font-bold text-gray-400 tracking-wider" };
+const _hoisted_17 = ["placeholder"];
+const _hoisted_18 = {
   key: 0,
-  class: "flex-1 grid grid-cols-2 gap-3 min-h-0"
+  class: "px-4 py-3 bg-deep-charcoal border-4 border-black rounded-xl shadow-hard text-sm text-gray-400 leading-6"
 };
-const _hoisted_9 = { class: "flex flex-col min-h-0" };
-const _hoisted_10 = { class: "flex items-center gap-2 mb-1.5" };
-const _hoisted_11 = { class: "flex flex-col min-h-0" };
-const _hoisted_12 = { class: "flex items-center gap-2 mb-1.5" };
-const _hoisted_13 = {
+const _hoisted_19 = {
   key: 1,
   class: "flex-1 flex flex-col min-h-0"
 };
-const _hoisted_14 = { class: "flex-1 bg-deep-charcoal border-4 border-black rounded-xl overflow-auto shadow-hard" };
-const _hoisted_15 = { class: "w-full font-mono text-sm border-collapse" };
-const _hoisted_16 = {
+const _hoisted_20 = { class: "flex-1 bg-deep-charcoal border-4 border-black rounded-xl overflow-auto shadow-hard" };
+const _hoisted_21 = { class: "w-full font-mono text-sm border-collapse" };
+const _hoisted_22 = {
   key: 2,
   class: "flex-1 grid grid-cols-2 gap-3 min-h-0"
 };
-const _hoisted_17 = { class: "w-full font-mono text-sm border-collapse" };
-const _hoisted_18 = { class: "w-full font-mono text-sm border-collapse" };
+const _hoisted_23 = { class: "w-full font-mono text-sm border-collapse" };
+const _hoisted_24 = { class: "w-full font-mono text-sm border-collapse" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   setup(__props) {
@@ -285,6 +291,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const newText = ref("");
     const hasCompared = ref(false);
     const viewMode = ref("unified");
+    const compareMode = ref("text");
     const unifiedLines = ref([]);
     const leftLines = ref([]);
     const rightLines = ref([]);
@@ -296,6 +303,43 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (lines[lines.length - 1] === "") lines.pop();
       return lines;
     }
+    function tryDecode(value) {
+      try {
+        return decodeURIComponent(value);
+      } catch {
+        return value;
+      }
+    }
+    function stringifyUrlForDiff(raw) {
+      const input = raw.trim();
+      if (!input) return "";
+      try {
+        const url = new URL(input);
+        const lines = [
+          `protocol: ${url.protocol.replace(/:$/, "")}`,
+          `host: ${url.host}`,
+          `pathname: ${url.pathname || "/"}`
+        ];
+        if (url.hash) {
+          lines.push(`hash: ${tryDecode(url.hash.slice(1))}`);
+        }
+        const entries = Array.from(url.searchParams.entries()).sort(([keyA], [keyB]) => keyA.localeCompare(keyB));
+        if (entries.length === 0) {
+          lines.push("query: <empty>");
+        } else {
+          lines.push("query:");
+          for (const [key, value] of entries) {
+            lines.push(`  ${key} = ${tryDecode(value)}`);
+          }
+        }
+        return lines.join("\n");
+      } catch {
+        return input;
+      }
+    }
+    function getComparableText(raw) {
+      return compareMode.value === "url" ? stringifyUrlForDiff(raw) : raw;
+    }
     function alignChunk(oldArr, newArr) {
       const m = oldArr.length, n = newArr.length;
       const dp = Array.from({ length: m + 1 }, () => new Array(n + 1).fill(0));
@@ -325,7 +369,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     }
     function handleCompare() {
       var _a;
-      const changes = diffLines(oldText.value, newText.value);
+      const changes = diffLines(getComparableText(oldText.value), getComparableText(newText.value));
       const unified = [];
       const left = [];
       const right = [];
@@ -419,7 +463,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       });
     }
     function loadSample() {
-      oldText.value = `html,
+      if (compareMode.value === "url") {
+        oldText.value = "http://localhost:8102/usersys/FormSetPage?Name=WholeInventoryPage&FormName=Observed&RequestViewName=TalentReviewListForManagement&AppConfigID=2&FormApplicationID=428&FormID=4226&MenuName=UserWholeInventory&AskForm_Where=ReviewStage%3D4&checkStart=true";
+        newText.value = "http://localhost:8102/usersys/FormSetPage?Name=WholeInventoryPageForPosition&RequestViewName=TalentReviewListForPosition&FormName=Observed&MenuStep=undefined&AskForm_Where=undefined&MeetingEntryID=undefined&AppConfigID=2&FormApplicationID=428&FormID=4226&MenuName=UserWholeInventoryForPosition";
+      } else {
+        oldText.value = `html,
 body {
   width: 100%;
   height: 100%;
@@ -443,7 +491,7 @@ body {
   background-color: #000000;
   opacity: 1;
 }`;
-      newText.value = `html,
+        newText.value = `html,
 body {
   width: 100%;
   height: 100%;
@@ -467,6 +515,7 @@ body {
   background-color: #031607;
   opacity: 1;
 }`;
+      }
       handleCompare();
     }
     const stats = computed(() => {
@@ -494,11 +543,65 @@ body {
       return openBlock(), createElementBlock("div", _hoisted_1, [
         createCommentVNode(" Toolbar "),
         createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode(
+              "button",
+              {
+                class: normalizeClass(["h-9 px-3 text-sm font-bold flex items-center gap-1.5 transition-all", compareMode.value === "text" ? "bg-primary text-black" : "bg-deep-charcoal text-gray-400 hover:text-white"]),
+                onClick: _cache[0] || (_cache[0] = ($event) => {
+                  compareMode.value = "text";
+                  handleEdit();
+                })
+              },
+              [..._cache[10] || (_cache[10] = [
+                createElementVNode(
+                  "span",
+                  { class: "material-icons text-lg" },
+                  "article",
+                  -1
+                  /* CACHED */
+                ),
+                createTextVNode(
+                  "文本对比 ",
+                  -1
+                  /* CACHED */
+                )
+              ])],
+              2
+              /* CLASS */
+            ),
+            createElementVNode(
+              "button",
+              {
+                class: normalizeClass(["h-9 px-3 text-sm font-bold flex items-center gap-1.5 transition-all border-l border-white/20", compareMode.value === "url" ? "bg-primary text-black" : "bg-deep-charcoal text-gray-400 hover:text-white"]),
+                onClick: _cache[1] || (_cache[1] = ($event) => {
+                  compareMode.value = "url";
+                  handleEdit();
+                })
+              },
+              [..._cache[11] || (_cache[11] = [
+                createElementVNode(
+                  "span",
+                  { class: "material-icons text-lg" },
+                  "link",
+                  -1
+                  /* CACHED */
+                ),
+                createTextVNode(
+                  "URL 对比 ",
+                  -1
+                  /* CACHED */
+                )
+              ])],
+              2
+              /* CLASS */
+            )
+          ]),
           !hasCompared.value ? (openBlock(), createElementBlock("button", {
             key: 0,
             class: "h-9 px-4 bg-primary text-black font-bold border-2 border-black rounded shadow-hard-sm hover:shadow-none hover:translate-x-0.5 hover:translate-y-0.5 transition-all flex items-center gap-1.5 text-sm",
             onClick: handleCompare
-          }, [..._cache[8] || (_cache[8] = [
+          }, [..._cache[12] || (_cache[12] = [
             createElementVNode(
               "span",
               { class: "material-icons text-lg" },
@@ -516,7 +619,7 @@ body {
             key: 1,
             class: "h-9 px-4 bg-primary text-black font-bold border-2 border-black rounded shadow-hard-sm hover:shadow-none hover:translate-x-0.5 hover:translate-y-0.5 transition-all flex items-center gap-1.5 text-sm",
             onClick: handleEdit
-          }, [..._cache[9] || (_cache[9] = [
+          }, [..._cache[13] || (_cache[13] = [
             createElementVNode(
               "span",
               { class: "material-icons text-lg" },
@@ -533,7 +636,7 @@ body {
           createElementVNode("button", {
             class: "h-9 px-4 bg-white text-black font-bold border-2 border-black rounded shadow-hard-sm hover:shadow-none hover:translate-x-0.5 hover:translate-y-0.5 transition-all flex items-center gap-1.5 text-sm",
             onClick: handleSwap
-          }, [..._cache[10] || (_cache[10] = [
+          }, [..._cache[14] || (_cache[14] = [
             createElementVNode(
               "span",
               { class: "material-icons text-lg" },
@@ -550,7 +653,7 @@ body {
           createElementVNode("button", {
             class: "h-9 px-4 bg-coral-red text-white font-bold border-2 border-black rounded shadow-hard-sm hover:shadow-none hover:translate-x-0.5 hover:translate-y-0.5 transition-all flex items-center gap-1.5 text-sm",
             onClick: handleClear
-          }, [..._cache[11] || (_cache[11] = [
+          }, [..._cache[15] || (_cache[15] = [
             createElementVNode(
               "span",
               { class: "material-icons text-lg" },
@@ -564,32 +667,32 @@ body {
               /* CACHED */
             )
           ])]),
-          createElementVNode("div", _hoisted_3, [
-            hasCompared.value ? (openBlock(), createElementBlock("div", _hoisted_4, [
+          createElementVNode("div", _hoisted_4, [
+            hasCompared.value ? (openBlock(), createElementBlock("div", _hoisted_5, [
               createElementVNode(
                 "span",
-                _hoisted_5,
+                _hoisted_6,
                 "+" + toDisplayString(stats.value.added),
                 1
                 /* TEXT */
               ),
               createElementVNode(
                 "span",
-                _hoisted_6,
+                _hoisted_7,
                 "-" + toDisplayString(stats.value.removed),
                 1
                 /* TEXT */
               )
             ])) : createCommentVNode("v-if", true),
             createCommentVNode(" 视图切换 "),
-            hasCompared.value ? (openBlock(), createElementBlock("div", _hoisted_7, [
+            hasCompared.value ? (openBlock(), createElementBlock("div", _hoisted_8, [
               createElementVNode(
                 "button",
                 {
                   class: normalizeClass(["h-7 px-2.5 text-xs font-bold flex items-center gap-1 transition-all", viewMode.value === "unified" ? "bg-primary text-black" : "bg-deep-charcoal text-gray-400 hover:text-white"]),
-                  onClick: _cache[0] || (_cache[0] = ($event) => viewMode.value = "unified")
+                  onClick: _cache[2] || (_cache[2] = ($event) => viewMode.value = "unified")
                 },
-                [..._cache[12] || (_cache[12] = [
+                [..._cache[16] || (_cache[16] = [
                   createElementVNode(
                     "span",
                     { class: "material-icons text-sm" },
@@ -610,9 +713,9 @@ body {
                 "button",
                 {
                   class: normalizeClass(["h-7 px-2.5 text-xs font-bold flex items-center gap-1 transition-all border-l border-white/20", viewMode.value === "split" ? "bg-primary text-black" : "bg-deep-charcoal text-gray-400 hover:text-white"]),
-                  onClick: _cache[1] || (_cache[1] = ($event) => viewMode.value = "split")
+                  onClick: _cache[3] || (_cache[3] = ($event) => viewMode.value = "split")
                 },
-                [..._cache[13] || (_cache[13] = [
+                [..._cache[17] || (_cache[17] = [
                   createElementVNode(
                     "span",
                     { class: "material-icons text-sm" },
@@ -633,7 +736,7 @@ body {
             createElementVNode("button", {
               class: "h-9 px-3 bg-deep-charcoal text-gray-300 font-bold border-2 border-white/20 rounded hover:border-primary hover:text-primary transition-all text-sm flex items-center gap-1.5",
               onClick: loadSample
-            }, [..._cache[14] || (_cache[14] = [
+            }, [..._cache[18] || (_cache[18] = [
               createElementVNode(
                 "span",
                 { class: "material-icons text-lg" },
@@ -650,96 +753,93 @@ body {
           ])
         ]),
         createCommentVNode(" 编辑模式：并排输入 "),
-        !hasCompared.value ? (openBlock(), createElementBlock("div", _hoisted_8, [
-          createElementVNode("div", _hoisted_9, [
-            createElementVNode("div", _hoisted_10, [
-              _cache[16] || (_cache[16] = createElementVNode(
-                "span",
-                { class: "text-sm font-bold text-gray-400 tracking-wider" },
-                "A 原始文本",
-                -1
-                /* CACHED */
-              )),
-              createElementVNode("button", {
-                class: "ml-auto text-xs text-gray-500 hover:text-primary transition-colors flex items-center gap-1",
-                onClick: _cache[2] || (_cache[2] = ($event) => handlePaste("old"))
-              }, [..._cache[15] || (_cache[15] = [
-                createElementVNode(
-                  "span",
-                  { class: "material-icons text-sm" },
-                  "content_paste",
-                  -1
-                  /* CACHED */
-                ),
-                createTextVNode(
-                  "粘贴 ",
-                  -1
-                  /* CACHED */
-                )
-              ])])
-            ]),
-            withDirectives(createElementVNode(
-              "textarea",
-              {
-                "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => oldText.value = $event),
-                placeholder: "在此输入原始文本...",
-                spellcheck: "false",
-                class: "flex-1 w-full bg-deep-charcoal text-gray-100 border-4 border-black rounded-xl p-4 font-mono text-sm leading-relaxed resize-none shadow-hard focus:border-primary focus:shadow-none focus:translate-x-1 focus:translate-y-1 transition-all outline-none placeholder-gray-600"
-              },
-              null,
-              512
-              /* NEED_PATCH */
-            ), [
-              [vModelText, oldText.value]
-            ])
-          ]),
-          createElementVNode("div", _hoisted_11, [
-            createElementVNode("div", _hoisted_12, [
-              _cache[18] || (_cache[18] = createElementVNode(
-                "span",
-                { class: "text-sm font-bold text-gray-400 tracking-wider" },
-                "B 新文本",
-                -1
-                /* CACHED */
-              )),
-              createElementVNode("button", {
-                class: "ml-auto text-xs text-gray-500 hover:text-primary transition-colors flex items-center gap-1",
-                onClick: _cache[4] || (_cache[4] = ($event) => handlePaste("new"))
-              }, [..._cache[17] || (_cache[17] = [
-                createElementVNode(
-                  "span",
-                  { class: "material-icons text-sm" },
-                  "content_paste",
-                  -1
-                  /* CACHED */
-                ),
-                createTextVNode(
-                  "粘贴 ",
-                  -1
-                  /* CACHED */
-                )
-              ])])
+        !hasCompared.value ? (openBlock(), createElementBlock(
+          Fragment,
+          { key: 0 },
+          [
+            createElementVNode("div", _hoisted_9, [
+              createElementVNode("div", _hoisted_10, [
+                createElementVNode("div", _hoisted_11, [
+                  createElementVNode(
+                    "span",
+                    _hoisted_12,
+                    "A " + toDisplayString(compareMode.value === "url" ? "原始 URL" : "原始文本"),
+                    1
+                    /* TEXT */
+                  ),
+                  createElementVNode("button", {
+                    class: "ml-auto text-xs text-gray-500 hover:text-primary transition-colors flex items-center gap-1",
+                    onClick: _cache[4] || (_cache[4] = ($event) => handlePaste("old"))
+                  }, [..._cache[19] || (_cache[19] = [
+                    createElementVNode(
+                      "span",
+                      { class: "material-icons text-sm" },
+                      "content_paste",
+                      -1
+                      /* CACHED */
+                    ),
+                    createTextVNode(
+                      "粘贴 ",
+                      -1
+                      /* CACHED */
+                    )
+                  ])])
+                ]),
+                withDirectives(createElementVNode("textarea", {
+                  "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => oldText.value = $event),
+                  placeholder: compareMode.value === "url" ? "在此输入原始 URL..." : "在此输入原始文本...",
+                  spellcheck: "false",
+                  class: "flex-1 w-full bg-deep-charcoal text-gray-100 border-4 border-black rounded-xl p-4 font-mono text-sm leading-relaxed resize-none shadow-hard focus:border-primary focus:shadow-none focus:translate-x-1 focus:translate-y-1 transition-all outline-none placeholder-gray-600"
+                }, null, 8, _hoisted_13), [
+                  [vModelText, oldText.value]
+                ])
+              ]),
+              createElementVNode("div", _hoisted_14, [
+                createElementVNode("div", _hoisted_15, [
+                  createElementVNode(
+                    "span",
+                    _hoisted_16,
+                    "B " + toDisplayString(compareMode.value === "url" ? "新 URL" : "新文本"),
+                    1
+                    /* TEXT */
+                  ),
+                  createElementVNode("button", {
+                    class: "ml-auto text-xs text-gray-500 hover:text-primary transition-colors flex items-center gap-1",
+                    onClick: _cache[6] || (_cache[6] = ($event) => handlePaste("new"))
+                  }, [..._cache[20] || (_cache[20] = [
+                    createElementVNode(
+                      "span",
+                      { class: "material-icons text-sm" },
+                      "content_paste",
+                      -1
+                      /* CACHED */
+                    ),
+                    createTextVNode(
+                      "粘贴 ",
+                      -1
+                      /* CACHED */
+                    )
+                  ])])
+                ]),
+                withDirectives(createElementVNode("textarea", {
+                  "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => newText.value = $event),
+                  placeholder: compareMode.value === "url" ? "在此输入新 URL..." : "在此输入新文本...",
+                  spellcheck: "false",
+                  class: "flex-1 w-full bg-deep-charcoal text-gray-100 border-4 border-black rounded-xl p-4 font-mono text-sm leading-relaxed resize-none shadow-hard focus:border-primary focus:shadow-none focus:translate-x-1 focus:translate-y-1 transition-all outline-none placeholder-gray-600"
+                }, null, 8, _hoisted_17), [
+                  [vModelText, newText.value]
+                ])
+              ])
             ]),
-            withDirectives(createElementVNode(
-              "textarea",
-              {
-                "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => newText.value = $event),
-                placeholder: "在此输入新文本...",
-                spellcheck: "false",
-                class: "flex-1 w-full bg-deep-charcoal text-gray-100 border-4 border-black rounded-xl p-4 font-mono text-sm leading-relaxed resize-none shadow-hard focus:border-primary focus:shadow-none focus:translate-x-1 focus:translate-y-1 transition-all outline-none placeholder-gray-600"
-              },
-              null,
-              512
-              /* NEED_PATCH */
-            ), [
-              [vModelText, newText.value]
-            ])
-          ])
-        ])) : createCommentVNode("v-if", true),
+            compareMode.value === "url" ? (openBlock(), createElementBlock("div", _hoisted_18, " URL 对比会先解析协议、主机、路径和查询参数，再按参数名排序后进行逐行差异对比，便于快速定位参数增删和取值变化。 ")) : createCommentVNode("v-if", true)
+          ],
+          64
+          /* STABLE_FRAGMENT */
+        )) : createCommentVNode("v-if", true),
         createCommentVNode(" 对比结果：统一视图 "),
-        hasCompared.value && viewMode.value === "unified" ? (openBlock(), createElementBlock("div", _hoisted_13, [
-          createElementVNode("div", _hoisted_14, [
-            createElementVNode("table", _hoisted_15, [
+        hasCompared.value && viewMode.value === "unified" ? (openBlock(), createElementBlock("div", _hoisted_19, [
+          createElementVNode("div", _hoisted_20, [
+            createElementVNode("table", _hoisted_21, [
               (openBlock(true), createElementBlock(
                 Fragment,
                 null,
@@ -802,17 +902,17 @@ body {
           ])
         ])) : createCommentVNode("v-if", true),
         createCommentVNode(" 对比结果：并排视图 "),
-        hasCompared.value && viewMode.value === "split" ? (openBlock(), createElementBlock("div", _hoisted_16, [
+        hasCompared.value && viewMode.value === "split" ? (openBlock(), createElementBlock("div", _hoisted_22, [
           createElementVNode(
             "div",
             {
               ref_key: "leftPanel",
               ref: leftPanel,
-              onScroll: _cache[6] || (_cache[6] = ($event) => syncScroll("left")),
+              onScroll: _cache[8] || (_cache[8] = ($event) => syncScroll("left")),
               class: "bg-deep-charcoal border-4 border-black rounded-xl overflow-auto shadow-hard"
             },
             [
-              createElementVNode("table", _hoisted_17, [
+              createElementVNode("table", _hoisted_23, [
                 (openBlock(true), createElementBlock(
                   Fragment,
                   null,
@@ -863,11 +963,11 @@ body {
             {
               ref_key: "rightPanel",
               ref: rightPanel,
-              onScroll: _cache[7] || (_cache[7] = ($event) => syncScroll("right")),
+              onScroll: _cache[9] || (_cache[9] = ($event) => syncScroll("right")),
               class: "bg-deep-charcoal border-4 border-black rounded-xl overflow-auto shadow-hard"
             },
             [
-              createElementVNode("table", _hoisted_18, [
+              createElementVNode("table", _hoisted_24, [
                 (openBlock(true), createElementBlock(
                   Fragment,
                   null,
@@ -925,7 +1025,7 @@ const _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-90752a2e"]]);
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0a7b0920"]]);
 export {
   index as default
 };
@@ -1069,6 +1169,10 @@ export {
     position: relative;
   }
 
+  .sticky {
+    position: sticky;
+  }
+
   .inset-0 {
     inset: calc(var(--spacing) * 0);
   }
@@ -1081,6 +1185,10 @@ export {
     inset-inline-end: var(--spacing);
   }
 
+  .top-0 {
+    top: calc(var(--spacing) * 0);
+  }
+
   .top-1\\/2 {
     top: 50%;
   }
@@ -1093,6 +1201,10 @@ export {
     left: calc(var(--spacing) * 2);
   }
 
+  .z-10 {
+    z-index: 10;
+  }
+
   .z-50 {
     z-index: 50;
   }
@@ -1125,6 +1237,10 @@ export {
     margin-top: calc(var(--spacing) * 3);
   }
 
+  .mt-4 {
+    margin-top: calc(var(--spacing) * 4);
+  }
+
   .mr-1 {
     margin-right: calc(var(--spacing) * 1);
   }
@@ -1241,6 +1357,10 @@ export {
     height: calc(var(--spacing) * 10);
   }
 
+  .h-11 {
+    height: calc(var(--spacing) * 11);
+  }
+
   .h-12 {
     height: calc(var(--spacing) * 12);
   }
@@ -1257,6 +1377,10 @@ export {
     height: 100%;
   }
 
+  .max-h-28 {
+    max-height: calc(var(--spacing) * 28);
+  }
+
   .max-h-36 {
     max-height: calc(var(--spacing) * 36);
   }
@@ -1277,6 +1401,10 @@ export {
     max-height: 200px;
   }
 
+  .max-h-\\[420px\\] {
+    max-height: 420px;
+  }
+
   .max-h-full {
     max-height: 100%;
   }
@@ -1297,6 +1425,22 @@ export {
     min-height: 200px;
   }
 
+  .min-h-\\[260px\\] {
+    min-height: 260px;
+  }
+
+  .min-h-\\[320px\\] {
+    min-height: 320px;
+  }
+
+  .min-h-full {
+    min-height: 100%;
+  }
+
+  .w-1 {
+    width: calc(var(--spacing) * 1);
+  }
+
   .w-1\\.5 {
     width: calc(var(--spacing) * 1.5);
   }
@@ -1361,6 +1505,10 @@ export {
     width: calc(var(--spacing) * 32);
   }
 
+  .w-56 {
+    width: calc(var(--spacing) * 56);
+  }
+
   .w-72 {
     width: calc(var(--spacing) * 72);
   }
@@ -1401,6 +1549,10 @@ export {
     flex-shrink: 0;
   }
 
+  .table-fixed {
+    table-layout: fixed;
+  }
+
   .border-collapse {
     border-collapse: collapse;
   }
@@ -1420,6 +1572,10 @@ export {
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
 
+  .scale-\\[0\\.98\\] {
+    scale: .98;
+  }
+
   .transform {
     transform: var(--tw-rotate-x,  ) var(--tw-rotate-y,  ) var(--tw-rotate-z,  ) var(--tw-skew-x,  ) var(--tw-skew-y,  );
   }
@@ -1440,6 +1596,10 @@ export {
     cursor: pointer;
   }
 
+  .touch-none {
+    touch-action: none;
+  }
+
   .resize {
     resize: both;
   }
@@ -1448,6 +1608,10 @@ export {
     resize: none;
   }
 
+  .resize-y {
+    resize: vertical;
+  }
+
   .appearance-none {
     appearance: none;
   }
@@ -1488,6 +1652,10 @@ export {
     align-items: center;
   }
 
+  .items-stretch {
+    align-items: stretch;
+  }
+
   .justify-between {
     justify-content: space-between;
   }
@@ -1552,6 +1720,12 @@ export {
     margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
   }
 
+  :where(.space-y-4 > :not(:last-child)) {
+    --tw-space-y-reverse: 0;
+    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
+    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
+  }
+
   .gap-x-6 {
     column-gap: calc(var(--spacing) * 6);
   }
@@ -1574,6 +1748,10 @@ export {
     overflow: hidden;
   }
 
+  .overflow-x-auto {
+    overflow-x: auto;
+  }
+
   .overflow-y-auto {
     overflow-y: auto;
   }
@@ -1613,6 +1791,11 @@ export {
     border-width: 4px;
   }
 
+  .border-t-2 {
+    border-top-style: var(--tw-border-style);
+    border-top-width: 2px;
+  }
+
   .border-r {
     border-right-style: var(--tw-border-style);
     border-right-width: 1px;
@@ -1642,6 +1825,16 @@ export {
     border-color: var(--color-black);
   }
 
+  .border-black\\/30 {
+    border-color: #0000004d;
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .border-black\\/30 {
+      border-color: color-mix(in oklab, var(--color-black) 30%, transparent);
+    }
+  }
+
   .border-coral-red {
     border-color: var(--color-coral-red);
   }
@@ -1884,6 +2077,16 @@ export {
     }
   }
 
+  .bg-primary\\/30 {
+    background-color: #f9b11f4d;
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .bg-primary\\/30 {
+      background-color: color-mix(in oklab, var(--color-primary) 30%, transparent);
+    }
+  }
+
   .bg-transparent {
     background-color: #0000;
   }
@@ -2032,6 +2235,10 @@ export {
     padding-block: calc(var(--spacing) * 3);
   }
 
+  .py-4 {
+    padding-block: calc(var(--spacing) * 4);
+  }
+
   .py-6 {
     padding-block: calc(var(--spacing) * 6);
   }
@@ -2040,6 +2247,10 @@ export {
     padding-block: calc(var(--spacing) * 8);
   }
 
+  .pt-3 {
+    padding-top: calc(var(--spacing) * 3);
+  }
+
   .pr-1 {
     padding-right: calc(var(--spacing) * 1);
   }
@@ -2064,6 +2275,14 @@ export {
     padding-right: calc(var(--spacing) * 11);
   }
 
+  .pb-1 {
+    padding-bottom: calc(var(--spacing) * 1);
+  }
+
+  .pb-2 {
+    padding-bottom: calc(var(--spacing) * 2);
+  }
+
   .pl-1\\.5 {
     padding-left: calc(var(--spacing) * 1.5);
   }
@@ -2104,6 +2323,10 @@ export {
     vertical-align: middle;
   }
 
+  .align-top {
+    vertical-align: top;
+  }
+
   .font-mono {
     font-family: var(--font-mono);
   }
@@ -2165,6 +2388,11 @@ export {
     line-height: calc(var(--spacing) * 6);
   }
 
+  .leading-7 {
+    --tw-leading: calc(var(--spacing) * 7);
+    line-height: calc(var(--spacing) * 7);
+  }
+
   .leading-none {
     --tw-leading: 1;
     line-height: 1;
@@ -2195,6 +2423,10 @@ export {
     letter-spacing: var(--tracking-widest);
   }
 
+  .\\[overflow-wrap\\:anywhere\\] {
+    overflow-wrap: anywhere;
+  }
+
   .break-all {
     word-break: break-all;
   }
@@ -2391,6 +2623,10 @@ export {
     opacity: .7;
   }
 
+  .opacity-100 {
+    opacity: 1;
+  }
+
   .shadow-hard {
     --tw-shadow: 4px 4px 0 0 var(--tw-shadow-color, #000);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -2634,6 +2870,11 @@ export {
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
 
+  .focus\\:translate-x-\\[2px\\]:focus {
+    --tw-translate-x: 2px;
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
+
   .focus\\:translate-x-\\[4px\\]:focus {
     --tw-translate-x: 4px;
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -2644,6 +2885,11 @@ export {
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
 
+  .focus\\:translate-y-\\[2px\\]:focus {
+    --tw-translate-y: 2px;
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
+
   .focus\\:translate-y-\\[4px\\]:focus {
     --tw-translate-y: 4px;
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -2720,6 +2966,10 @@ export {
     .xl\\:grid-cols-3 {
       grid-template-columns: repeat(3, minmax(0, 1fr));
     }
+
+    .xl\\:grid-cols-\\[minmax\\(0\\,1fr\\)_minmax\\(0\\,1fr\\)_320px\\] {
+      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 320px;
+    }
   }
 }
 
@@ -2979,10 +3229,10 @@ export {
   }
 }
 
-table tr td[data-v-90752a2e] {
+table tr td[data-v-0a7b0920] {
   line-height: 1.75;
 }
-.diff-num[data-v-90752a2e] {
+.diff-num[data-v-0a7b0920] {
   min-width: 3ch;
 }
 `;})();