koishi-plugin-chatluna-toolbox 0.0.11 → 0.0.13

package/client/ToolboxDetailsLoader.vue

@@ -0,0 +1,20 @@
+<!--
+  Toolbox 详情加载器
+  根据当前插件名称决定是否显示共享导航组件
+-->
+<template>
+  <SharedNav v-if="isOwn" :sections="navSections" />
+</template>
+
+<script setup lang="ts">
+import { ComputedRef, computed, inject } from "vue";
+import { SharedNav } from "shared-nav";
+import { NAV_SECTIONS, PLUGIN_CANDIDATE_NAMES } from "./constants";
+
+const pluginName = inject<ComputedRef<string>>("plugin:name");
+const navSections = NAV_SECTIONS;
+const isOwn = computed(() => {
+  const name = pluginName?.value || "";
+  return PLUGIN_CANDIDATE_NAMES.includes(name);
+});
+</script>

package/client/constants.ts

@@ -0,0 +1,19 @@
+/**
+ * 前端常量定义
+ * 包含导航分组和插件候选名称
+ */
+
+import type { SharedNavSection } from "shared-nav";
+
+export const NAV_SECTIONS: SharedNavSection[] = [
+  { title: "基础设置", key: "basic" },
+  { title: "原生工具", key: "nativeTools" },
+  { title: "XML 工具", key: "xmlTools" },
+  { title: "其他变量", key: "variables" },
+  { title: "其他设置", key: "other" },
+];
+
+export const PLUGIN_CANDIDATE_NAMES = [
+  "chatluna-toolbox",
+  "koishi-plugin-chatluna-toolbox",
+];

package/client/index.ts

@@ -0,0 +1,15 @@
+/**
+ * 前端入口
+ * 注册 Koishi 控制台插件详情扩展
+ */
+
+import { Context } from "@koishijs/client";
+import ToolboxDetailsLoader from "./ToolboxDetailsLoader.vue";
+
+export default (ctx: Context) => {
+  ctx.slot({
+    type: "plugin-details",
+    component: ToolboxDetailsLoader,
+    order: -999,
+  });
+};

package/dist/index.js

@@ -0,0 +1,264 @@
+import { openBlock as y, createElementBlock as _, createElementVNode as w, defineComponent as b, Fragment as E, renderList as N, normalizeClass as m, toDisplayString as z, reactive as I, computed as f, onUnmounted as L, ref as T, onMounted as B, normalizeStyle as A, unref as k, createVNode as x, withModifiers as D, inject as K, createBlock as X, createCommentVNode as O } from "vue";
+const M = (s, o) => {
+  const r = s.__vccOpts || s;
+  for (const [c, t] of o)
+    r[c] = t;
+  return r;
+}, V = {}, Y = {
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "20",
+  height: "20"
+};
+function q(s, o) {
+  return y(), _("svg", Y, [...o[0] || (o[0] = [
+    w("path", {
+      d: "M288 224c0-35.3 28.7-64 64-64s64 28.7 64 64-28.7 64-64 64-64-28.7-64-64zm320 0c0-35.3 28.7-64 64-64s64 28.7 64 64-28.7 64-64 64-64-28.7-64-64zM288 512c0-35.3 28.7-64 64-64s64 28.7 64 64-28.7 64-64 64-64-28.7-64-64zm320 0c0-35.3 28.7-64 64-64s64 28.7 64 64-28.7 64-64 64-64-28.7-64-64zM352 864c-35.3 0-64-28.7-64-64s28.7-64 64-64 64 28.7 64 64-28.7 64-64 64zm320 0c-35.3 0-64-28.7-64-64s28.7-64 64-64 64 28.7 64 64-28.7 64-64 64z",
+      fill: "currentColor"
+    }, null, -1)
+  ])]);
+}
+const P = /* @__PURE__ */ M(V, [["render", q]]), W = {}, j = {
+  viewBox: "0 0 1024 1024",
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "20",
+  height: "20"
+};
+function U(s, o) {
+  return y(), _("svg", j, [...o[0] || (o[0] = [
+    w("path", {
+      d: "M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z",
+      fill: "currentColor"
+    }, null, -1)
+  ])]);
+}
+const F = /* @__PURE__ */ M(W, [["render", U]]), G = ["onClick"], H = /* @__PURE__ */ b({
+  __name: "NavSection",
+  props: {
+    sections: {},
+    activeKey: {}
+  },
+  emits: ["select"],
+  setup(s) {
+    return (o, r) => (y(!0), _(E, null, N(s.sections, (c) => (y(), _("div", {
+      key: c.key,
+      class: m([o.$style.item, s.activeKey === c.key ? o.$style.active : ""]),
+      onClick: (t) => o.$emit("select", c)
+    }, z(c.title), 11, G))), 128));
+  }
+}), J = "_item_1m2kp_1", Q = "_active_1m2kp_16", Z = {
+  item: J,
+  active: Q
+}, tt = {
+  $style: Z
+}, et = /* @__PURE__ */ M(H, [["__cssModules", tt]]);
+function R(s) {
+  return s instanceof TouchEvent ? {
+    x: s.touches[0].clientX,
+    y: s.touches[0].clientY
+  } : {
+    x: s.clientX,
+    y: s.clientY
+  };
+}
+function ot(s = {}) {
+  const {
+    initialTop: o = 100,
+    initialRight: r = 20,
+    boundarySelector: c = ".plugin-view"
+  } = s, t = I({
+    isDragging: !1,
+    top: o,
+    right: r,
+    startTop: 0,
+    startRight: 0,
+    startX: 0,
+    startY: 0,
+    width: 0,
+    height: 0
+  }), g = f(() => ({
+    top: `${t.top}px`,
+    right: `${t.right}px`
+  })), i = (d) => {
+    var C;
+    if (!t.isDragging)
+      return;
+    const a = R(d), l = t.startTop + (a.y - t.startY), e = t.startRight - (a.x - t.startX), n = (C = document.querySelector(c)) == null ? void 0 : C.getBoundingClientRect();
+    let h = 0, v = window.innerHeight - t.height, S = 0, $ = window.innerWidth - t.width;
+    n && (h = n.top, v = n.bottom - t.height, S = window.innerWidth - n.right, $ = window.innerWidth - n.left - t.width), t.top = Math.max(h, Math.min(v, l)), t.right = Math.max(S, Math.min($, e));
+  }, p = (d, a) => {
+    const l = R(d), e = a == null ? void 0 : a.getBoundingClientRect();
+    e && (t.width = e.width, t.height = e.height), t.startTop = t.top, t.startRight = t.right, t.startX = l.x, t.startY = l.y, t.isDragging = !0;
+  }, u = () => {
+    t.isDragging = !1;
+  };
+  return window.addEventListener("mousemove", i), window.addEventListener("mouseup", u), window.addEventListener("touchmove", i), window.addEventListener("touchend", u), L(() => {
+    window.removeEventListener("mousemove", i), window.removeEventListener("mouseup", u), window.removeEventListener("touchmove", i), window.removeEventListener("touchend", u);
+  }), {
+    position: g,
+    startDrag: p
+  };
+}
+function nt(s) {
+  const {
+    titleToKeyMap: o,
+    headerSelector: r = ".k-schema-header",
+    rootMargin: c = "-20% 0px -60% 0px",
+    threshold: t = 0
+  } = s, g = T("");
+  let i = null;
+  const p = /* @__PURE__ */ new Map(), u = () => {
+    i == null || i.disconnect(), p.clear(), i = new IntersectionObserver(
+      (l) => {
+        for (const e of l) {
+          if (!e.isIntersecting)
+            continue;
+          const n = p.get(e.target);
+          n && (g.value = n);
+        }
+      },
+      {
+        root: null,
+        rootMargin: c,
+        threshold: t
+      }
+    ), document.querySelectorAll(r).forEach((l) => {
+      const e = l.textContent || "";
+      for (const [n, h] of Object.entries(o))
+        if (e.includes(n)) {
+          i == null || i.observe(l), p.set(l, h);
+          break;
+        }
+    });
+  }, d = () => {
+    setTimeout(u, 500);
+  };
+  return B(d), L(() => {
+    i == null || i.disconnect();
+  }), {
+    activeSection: g,
+    refresh: d
+  };
+}
+const st = /* @__PURE__ */ b({
+  __name: "SharedNav",
+  props: {
+    sections: {},
+    headerSelector: { default: ".k-schema-header" },
+    boundarySelector: { default: ".plugin-view" },
+    initialTop: { default: 100 },
+    initialRight: { default: 20 },
+    rootMargin: { default: "-20% 0px -60% 0px" },
+    threshold: { default: 0 }
+  },
+  setup(s) {
+    const o = s, r = T(!1), c = T(null), t = f(
+      () => o.sections.reduce(
+        (e, n) => (e[n.matchText ?? n.title] = n.key, e),
+        {}
+      )
+    ), g = f(
+      () => o.sections.reduce(
+        (e, n) => (e[n.key] = n.matchText ?? n.title, e),
+        {}
+      )
+    ), i = (e) => {
+      e.stopPropagation(), r.value = !r.value;
+    }, { position: p, startDrag: u } = ot({
+      initialTop: o.initialTop,
+      initialRight: o.initialRight,
+      boundarySelector: o.boundarySelector
+    }), d = (e) => {
+      u(e, c.value);
+    }, { activeSection: a } = nt({
+      titleToKeyMap: t.value,
+      headerSelector: o.headerSelector,
+      rootMargin: o.rootMargin,
+      threshold: o.threshold
+    }), l = (e) => {
+      a.value = e.key;
+      const n = document.querySelectorAll(o.headerSelector);
+      for (let h = 0; h < n.length; h += 1) {
+        const v = n[h];
+        if ((v.textContent || "").includes(g.value[e.key])) {
+          v.scrollIntoView({ behavior: "smooth", block: "start" });
+          return;
+        }
+      }
+    };
+    return (e, n) => (y(), _("div", {
+      ref_key: "containerRef",
+      ref: c,
+      class: m([e.$style.container, r.value ? e.$style.collapsed : ""]),
+      style: A(k(p))
+    }, [
+      w("div", {
+        class: m(e.$style.header),
+        onMousedown: d,
+        onTouchstart: d
+      }, [
+        x(P, {
+          class: m(e.$style.move)
+        }, null, 8, ["class"]),
+        w("div", {
+          class: m(e.$style.toggle),
+          onClick: i,
+          onMousedown: n[0] || (n[0] = D(() => {
+          }, ["stop"])),
+          onTouchstart: n[1] || (n[1] = D(() => {
+          }, ["stop"]))
+        }, [
+          x(F)
+        ], 34)
+      ], 34),
+      w("div", {
+        class: m(e.$style.body)
+      }, [
+        x(et, {
+          sections: s.sections,
+          "active-key": k(a),
+          onSelect: l
+        }, null, 8, ["sections", "active-key"])
+      ], 2)
+    ], 6));
+  }
+}), it = "_container_pbgsl_2", ct = "_header_pbgsl_21", rt = "_move_pbgsl_36", lt = "_toggle_pbgsl_45", at = "_body_pbgsl_56", dt = "_collapsed_pbgsl_67", ut = {
+  container: it,
+  header: ct,
+  move: rt,
+  toggle: lt,
+  body: at,
+  collapsed: dt
+}, ht = {
+  $style: ut
+}, gt = /* @__PURE__ */ M(st, [["__cssModules", ht]]), pt = [
+  { title: "基础设置", key: "basic" },
+  { title: "原生工具", key: "nativeTools" },
+  { title: "XML 工具", key: "xmlTools" },
+  { title: "其他变量", key: "variables" },
+  { title: "其他设置", key: "other" }
+], mt = [
+  "chatluna-toolbox",
+  "koishi-plugin-chatluna-toolbox"
+], yt = /* @__PURE__ */ b({
+  __name: "ToolboxDetailsLoader",
+  setup(s) {
+    const o = K("plugin:name"), r = pt, c = f(() => {
+      const t = (o == null ? void 0 : o.value) || "";
+      return mt.includes(t);
+    });
+    return (t, g) => c.value ? (y(), X(k(gt), {
+      key: 0,
+      sections: k(r)
+    }, null, 8, ["sections"])) : O("", !0);
+  }
+}), wt = (s) => {
+  s.slot({
+    type: "plugin-details",
+    component: yt,
+    order: -999
+  });
+};
+export {
+  wt as default
+};

package/dist/style.css

@@ -0,0 +1 @@
+@charset "UTF-8";._item_1m2kp_1{padding:8px 16px;font-size:13px;color:var(--k-text-normal);cursor:pointer;transition:all .2s ease;white-space:nowrap;border-radius:9999px;margin:4px 0;background:transparent}._item_1m2kp_1:hover{background:#0000000f;color:var(--k-text-active)}._item_1m2kp_1._active_1m2kp_16{color:#fff;background:var(--k-color-primary);font-weight:500}._container_pbgsl_2{position:absolute;z-index:1000;width:140px;max-width:90vw;max-height:70vh;background:transparent;display:flex;flex-direction:column;font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Arial,sans-serif;-webkit-user-select:none;user-select:none;overflow:visible}@media(max-width:768px){._container_pbgsl_2{width:120px;max-height:50vh}}._container_pbgsl_2 ._header_pbgsl_21{padding:6px 10px;display:flex;justify-content:space-between;align-items:center;cursor:move;background:#ffffffd9;border-radius:20px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);margin-bottom:8px;box-shadow:0 2px 8px #00000014}._container_pbgsl_2 ._header_pbgsl_21:hover{background:#fffffff2}._container_pbgsl_2 ._header_pbgsl_21 ._move_pbgsl_36{color:var(--k-text-light);cursor:grab;transition:color .2s}._container_pbgsl_2 ._header_pbgsl_21 ._move_pbgsl_36:active{cursor:grabbing;color:var(--k-color-primary)}._container_pbgsl_2 ._header_pbgsl_21 ._toggle_pbgsl_45{cursor:pointer;color:var(--k-text-light);transition:transform .3s ease,color .2s;display:flex;align-items:center;padding:2px}._container_pbgsl_2 ._header_pbgsl_21 ._toggle_pbgsl_45:hover{color:var(--k-color-primary)}._container_pbgsl_2 ._body_pbgsl_56{overflow-y:auto;padding:4px 0;transition:max-height .3s ease,opacity .3s ease;opacity:1;scrollbar-width:none;-ms-overflow-style:none}._container_pbgsl_2 ._body_pbgsl_56::-webkit-scrollbar{display:none}._container_pbgsl_2._collapsed_pbgsl_67{max-height:40px!important}._container_pbgsl_2._collapsed_pbgsl_67 ._body_pbgsl_56{max-height:0;padding:0;opacity:0;overflow:hidden}._container_pbgsl_2._collapsed_pbgsl_67 ._toggle_pbgsl_45{transform:rotate(180deg)}