@opentiny/tiny-robot 0.2.0-alpha.1 → 0.2.0-alpha.3

package/dist/prompts/index.js

@@ -0,0 +1,83 @@
+import { defineComponent as u, createElementBlock as c, openBlock as e, normalizeClass as m, createElementVNode as n, createBlock as d, resolveDynamicComponent as f, createCommentVNode as h, toDisplayString as l, Fragment as y, createTextVNode as P, renderSlot as B, renderList as w, mergeProps as x, toRaw as S } from "vue";
+import { _ as v } from "../_plugin-vue_export-helper.js";
+const N = { class: "tr-prompt__icon" }, T = { class: "tr-prompt__content" }, V = { class: "tr-prompt__content-label" }, $ = {
+  key: 0,
+  class: "tr-prompt__content-description"
+}, D = /* @__PURE__ */ u({
+  __name: "prompt",
+  props: {
+    label: {},
+    id: {},
+    description: {},
+    icon: {},
+    disabled: { type: Boolean },
+    badge: {}
+  },
+  setup(o) {
+    const t = o;
+    return (s, _) => (e(), c("div", {
+      class: m(["tr-prompt", { disabled: t.disabled }])
+    }, [
+      n("div", N, [
+        (e(), d(f(t.icon)))
+      ]),
+      n("div", T, [
+        n("h6", V, l(t.label), 1),
+        t.description ? (e(), c("p", $, l(t.description), 1)) : h("", !0)
+      ]),
+      n("div", {
+        class: m(["tr-prompt__badge", { label: typeof t.badge == "string" }])
+      }, [
+        typeof t.badge == "string" ? (e(), c(y, { key: 0 }, [
+          P(l(t.badge), 1)
+        ], 64)) : (e(), d(f(t.badge), { key: 1 }))
+      ], 2)
+    ], 2));
+  }
+}), r = /* @__PURE__ */ v(D, [["__scopeId", "data-v-e04bfae3"]]), E = { class: "tr-prompts" }, I = /* @__PURE__ */ u({
+  __name: "prompts",
+  props: {
+    items: {},
+    itemStyle: {},
+    itemClass: {},
+    vertical: { type: Boolean },
+    wrap: { type: Boolean }
+  },
+  emits: ["item-click"],
+  setup(o, { emit: t }) {
+    const s = o, _ = t, k = (p, b) => {
+      _("item-click", p, S(b));
+    };
+    return (p, b) => (e(), c("div", E, [
+      n("div", {
+        class: m(["tr-prompts__list-container", { wrap: s.wrap, vertical: s.vertical }])
+      }, [
+        (e(!0), c(y, null, w(s.items, (i, g) => (e(), d(r, x({
+          key: i.id || g,
+          ref_for: !0
+        }, i, {
+          style: s.itemStyle,
+          class: s.itemClass,
+          onClick: (C) => k(C, i)
+        }), null, 16, ["style", "class", "onClick"]))), 128))
+      ], 2),
+      B(p.$slots, "footer", {}, void 0, !0)
+    ]));
+  }
+}), a = /* @__PURE__ */ v(I, [["__scopeId", "data-v-a3ceb6f3"]]);
+r.name = "TrPrompt";
+const z = function(o) {
+  o.component(r.name, r);
+};
+r.install = z;
+const j = r;
+a.name = "TrPrompts";
+const F = function(o) {
+  o.component(a.name, a);
+};
+a.install = F;
+const q = a;
+export {
+  j as Prompt,
+  q as Prompts
+};

package/dist/question/index.js

@@ -0,0 +1,375 @@
+import { ref as v, computed as D, watch as T, defineComponent as R, onMounted as F, onBeforeUnmount as U, createElementBlock as u, openBlock as l, normalizeClass as V, createCommentVNode as S, Fragment as M, renderList as W, createElementVNode as n, createTextVNode as A, createVNode as $, unref as h, toDisplayString as Q, nextTick as H, withModifiers as j, normalizeStyle as G, renderSlot as E, withCtx as O, createBlock as N } from "vue";
+import { Y, Q as I, I as P, D as J, x as K } from "../tiny-robot-svgs.js";
+import { i as X } from "../close.js";
+import { B as Z } from "../index3.js";
+function ee(c = v([])) {
+  const k = v(""), p = v(!1), i = v(!1), d = v("light"), r = D(() => {
+    if (!k.value && c.value.length > 0)
+      return c.value[0].questions;
+    const e = c.value.find((s) => s.id === k.value);
+    return e ? e.questions : [];
+  }), g = (e) => {
+    k.value = e;
+  }, f = () => {
+    i.value = !0;
+  }, y = () => {
+    i.value = !1;
+  }, w = () => {
+    p.value = !p.value;
+  }, C = (e) => {
+    const s = document.body;
+    if (e) {
+      const m = window.scrollY || document.documentElement.scrollTop;
+      s.style.position = "fixed", s.style.width = "100%", s.style.top = `-${m}px`, s.style.overflowY = "scroll", s.classList.add("tr-modal-open");
+    } else
+      s.style.position = "", s.style.width = "", s.style.top = "", s.style.overflowY = "", s.classList.remove("tr-modal-open");
+  };
+  return T(i, (e) => {
+    C(e);
+  }), {
+    activeCategory: k,
+    isFloatingExpanded: p,
+    modalVisible: i,
+    currentTheme: d,
+    activeQuestions: r,
+    setActiveCategory: g,
+    openModal: f,
+    closeModal: y,
+    toggleFloating: w,
+    toggleTheme: () => {
+      d.value = d.value === "light" ? "dark" : "light", document.documentElement.setAttribute("data-theme", d.value);
+    },
+    setTheme: (e) => {
+      d.value = e, document.documentElement.setAttribute("data-theme", e);
+    },
+    refreshData: async () => Promise.resolve(),
+    toggleBodyScroll: C
+  };
+}
+const te = ["onClick"], se = { style: { display: "flex", "align-items": "center" } }, oe = { key: 0 }, ne = ["onClick"], le = /* @__PURE__ */ R({
+  __name: "CommonQuestions",
+  props: {
+    questions: {
+      type: Array,
+      required: !0
+    },
+    isExpanded: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["question-click", "show-expand-button"],
+  setup(c, { emit: k }) {
+    const p = c, i = k, d = v(null), r = v(!1), g = v(!1), f = v([]), y = v([]);
+    T(
+      () => p.isExpanded,
+      (t) => {
+        g.value = t;
+      }
+    );
+    const w = async () => {
+      if (await H(), d.value) {
+        const t = d.value, a = t.clientWidth;
+        if (f.value = [], y.value = [], p.questions.length === 0) {
+          r.value = !1;
+          return;
+        }
+        let e = 0;
+        const s = 8, m = document.createElement("div");
+        m.className = "tr-common-questions_item", m.style.visibility = "hidden", m.style.position = "absolute", t.appendChild(m);
+        for (let B = 0; B < p.questions.length; B++) {
+          const _ = p.questions[B];
+          m.textContent = _.text;
+          const o = m.offsetWidth + s;
+          e + o <= a ? (e += o, f.value.push(_)) : y.value.push(_);
+        }
+        t.removeChild(m), r.value = y.value.length > 0, g.value = !1, i("show-expand-button", r.value);
+      }
+    }, C = (t) => {
+      i("question-click", t);
+    };
+    T(
+      () => p.questions,
+      () => {
+        w();
+      },
+      { deep: !0 }
+    );
+    const q = () => {
+      w();
+    };
+    return F(() => {
+      w(), window.addEventListener("resize", q);
+    }), U(() => {
+      window.removeEventListener("resize", q);
+    }), (t, a) => (l(), u("div", {
+      class: V(["tr-common-questions", { expanded: g.value }]),
+      ref_key: "commonQuestionsRef",
+      ref: d
+    }, [
+      (l(!0), u(M, null, W(f.value, (e, s) => (l(), u("div", {
+        key: `visible-${e.id}-${s}`,
+        class: "tr-common-questions_item",
+        onClick: (m) => C(e)
+      }, [
+        n("div", se, [
+          $(h(Y))
+        ]),
+        A(" " + Q(e.text), 1)
+      ], 8, te))), 128)),
+      g.value ? (l(), u("div", oe, [
+        (l(!0), u(M, null, W(y.value, (e, s) => (l(), u("div", {
+          key: `hidden-${e.id}-${s}`,
+          class: "tr-common-questions_item",
+          onClick: (m) => C(e)
+        }, [
+          $(h(Y)),
+          A(" " + Q(e.text), 1)
+        ], 8, ne))), 128))
+      ])) : S("", !0)
+    ], 2));
+  }
+}), ie = { class: "tr-question-header" }, ae = { style: { display: "flex", "align-items": "center", gap: "12px", "font-size": "36px" } }, de = {
+  key: 0,
+  class: "tr-question-categories"
+}, ue = ["onClick"], ce = { class: "category-icon" }, re = { class: "tr-question-content" }, me = {
+  key: 0,
+  class: "tr-question-loading"
+}, ve = { key: 1 }, pe = ["onClick"], fe = {
+  key: 2,
+  class: "tr-question-empty"
+}, he = /* @__PURE__ */ R({
+  __name: "HotQuestions",
+  props: {
+    visible: {
+      type: Boolean,
+      default: !1
+    },
+    categories: {
+      type: Array,
+      default: () => []
+    },
+    modalWidth: {
+      type: String,
+      default: "640px"
+    },
+    loading: {
+      type: Boolean,
+      default: !1
+    },
+    closeOnClickOutside: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  emits: ["update:visible", "close", "select-category", "question-click"],
+  setup(c, { emit: k }) {
+    const p = X(), i = c, d = k, r = v(""), g = D(() => {
+      if (!r.value && i.categories.length > 0)
+        return i.categories[0].questions || [];
+      const t = i.categories.find((a) => a.id === r.value);
+      return t ? t.questions : [];
+    });
+    T(
+      () => i.categories,
+      (t) => {
+        t.length > 0 && !r.value && (r.value = t[0].id);
+      },
+      { immediate: !0 }
+    );
+    const f = () => {
+      d("update:visible", !1), d("close");
+    }, y = (t) => {
+      r.value = t, d(
+        "select-category",
+        i.categories.find((a) => a.id === t)
+      );
+    }, w = (t) => {
+      d("question-click", t);
+    }, C = (t) => {
+      i.closeOnClickOutside && !t.composedPath().includes(q.value) && f();
+    }, q = v(null);
+    return (t, a) => c.visible ? (l(), u("div", {
+      key: 0,
+      class: "tr-question-modal-backdrop",
+      onMousedown: C
+    }, [
+      n("div", {
+        ref_key: "modalRef",
+        ref: q,
+        class: "tr-question-panel",
+        style: G({ width: c.modalWidth }),
+        onMousedown: a[0] || (a[0] = j(() => {
+        }, ["stop"]))
+      }, [
+        n("div", ie, [
+          n("div", ae, [
+            n("div", null, [
+              $(h(I))
+            ]),
+            a[1] || (a[1] = n("div", { class: "tr-question-header-title" }, "热门问题", -1))
+          ]),
+          n("span", {
+            class: "tr-question-close-btn",
+            onClick: f
+          }, [
+            $(h(Z), {
+              icon: h(p),
+              type: "text"
+            }, null, 8, ["icon"])
+          ])
+        ]),
+        c.categories.length > 0 ? (l(), u("div", de, [
+          (l(!0), u(M, null, W(c.categories, (e) => (l(), u("div", {
+            key: e.id,
+            class: V(["tr-question-categories-item", { active: r.value === e.id }]),
+            onClick: (s) => y(e.id)
+          }, [
+            E(t.$slots, "category-label", { category: e }, () => [
+              n("div", ce, [
+                $(h(P))
+              ]),
+              n("span", null, Q(e.label), 1)
+            ])
+          ], 10, ue))), 128))
+        ])) : S("", !0),
+        n("div", re, [
+          c.loading ? (l(), u("div", me, [
+            E(t.$slots, "loading-indicator", {}, () => [
+              a[2] || (a[2] = n("div", { class: "tr-question-loading-spinner" }, null, -1))
+            ])
+          ])) : g.value.length > 0 ? (l(), u("ul", ve, [
+            (l(!0), u(M, null, W(g.value, (e, s) => (l(), u("li", {
+              key: e.id,
+              class: "tr-question-list-item",
+              onClick: (m) => w(e)
+            }, [
+              E(t.$slots, "question-item", {
+                question: e,
+                index: s
+              }, () => [
+                n("span", null, Q(s + 1) + ".", 1),
+                A(" " + Q(e.text), 1)
+              ])
+            ], 8, pe))), 128))
+          ])) : (l(), u("div", fe, [
+            E(t.$slots, "empty-state", {}, () => [
+              a[3] || (a[3] = n("p", null, "暂无相关问题", -1))
+            ])
+          ]))
+        ])
+      ], 36)
+    ], 32)) : S("", !0);
+  }
+}), ge = ["data-theme"], ye = { class: "category-icon" }, z = /* @__PURE__ */ R({
+  __name: "index",
+  props: {
+    categories: { default: () => [] },
+    commonQuestions: { default: () => [] },
+    initialExpanded: { type: Boolean, default: !1 },
+    modalWidth: { default: "640px" },
+    theme: { default: "light" },
+    closeOnClickOutside: { type: Boolean, default: !0 },
+    loading: { type: Boolean, default: !1 }
+  },
+  emits: ["question-click", "select-category"],
+  setup(c, { expose: k, emit: p }) {
+    const i = c, d = () => {
+      f.value = !f.value;
+    }, r = p, g = D(() => i.categories), f = v(i.initialExpanded), { modalVisible: y, currentTheme: w, setActiveCategory: C, openModal: q, closeModal: t, setTheme: a, refreshData: e } = ee(g);
+    T(
+      () => i.theme,
+      (o) => {
+        a(o);
+      }
+    );
+    const s = (o) => {
+      t(), r("question-click", o);
+    }, m = (o) => {
+      o && (C(o.id), r("select-category", o));
+    }, B = v(!1), _ = (o) => {
+      B.value = o;
+    };
+    return F(() => {
+      document.documentElement.setAttribute("data-theme", w.value);
+    }), k({
+      openModal: q,
+      closeModal: t,
+      toggleFloating: d,
+      setActiveCategory: C,
+      refreshData: e
+    }), (o, x) => (l(), u("div", {
+      class: V(["tr-question-container", [`theme-${o.theme}`]]),
+      "data-theme": o.theme
+    }, [
+      n("div", {
+        class: "tr-question-trigger",
+        onClick: x[0] || (x[0] = //@ts-ignore
+        (...b) => h(q) && h(q)(...b))
+      }, [
+        $(h(I))
+      ]),
+      $(he, {
+        visible: h(y),
+        categories: g.value,
+        "modal-width": o.modalWidth,
+        loading: o.loading,
+        "close-on-click-outside": o.closeOnClickOutside,
+        "onUpdate:visible": x[1] || (x[1] = (b) => y.value = b),
+        onClose: x[2] || (x[2] = (b) => y.value = !1),
+        onQuestionClick: s,
+        onSelectCategory: m
+      }, {
+        "category-label": O(({ category: b }) => [
+          E(o.$slots, "category-label", { category: b }, () => [
+            n("div", ye, [
+              $(h(P))
+            ]),
+            n("span", null, Q(b.label), 1)
+          ])
+        ]),
+        "question-item": O(({ question: b, index: L }) => [
+          E(o.$slots, "question-item", {
+            question: b,
+            index: L
+          }, () => [
+            n("span", null, Q(L + 1) + ".", 1),
+            A(" " + Q(b.text), 1)
+          ])
+        ]),
+        "loading-indicator": O(() => [
+          E(o.$slots, "loading-indicator", {}, () => [
+            x[3] || (x[3] = n("div", { class: "tr-question-loading-spinner" }, null, -1))
+          ])
+        ]),
+        "empty-state": O(() => [
+          E(o.$slots, "empty-state", {}, () => [
+            x[4] || (x[4] = n("p", null, "暂无相关问题", -1))
+          ])
+        ]),
+        _: 3
+      }, 8, ["visible", "categories", "modal-width", "loading", "close-on-click-outside"]),
+      $(le, {
+        isExpanded: f.value,
+        questions: o.commonQuestions,
+        onShowExpandButton: _,
+        onQuestionClick: s
+      }, null, 8, ["isExpanded", "questions"]),
+      B.value ? (l(), u("div", {
+        key: 0,
+        class: "tr-question-wrap-trigger",
+        onClick: d
+      }, [
+        f.value ? (l(), N(h(K), { key: 1 })) : (l(), N(h(J), { key: 0 }))
+      ])) : S("", !0)
+    ], 10, ge));
+  }
+});
+z.name = "TrQuestion";
+const ke = function(c) {
+  c.component(z.name, z);
+};
+z.install = ke;
+export {
+  z as default
+};