@opentiny/tiny-robot 0.2.0-alpha.6 → 0.2.0-alpha.7

package/dist/suggestion-pills/index.js

@@ -1,120 +1,177 @@
-import { defineComponent as T, useSlots as N, computed as d, createElementBlock as a, openBlock as n, normalizeClass as R, renderSlot as v, createBlock as c, resolveDynamicComponent as V, createCommentVNode as z, toDisplayString as E, useCssVars as F, ref as L, Fragment as $, renderList as b, unref as i, mergeProps as x, createSlots as M, withCtx as C, createVNode as D } from "vue";
-import { d as j } from "../index3.js";
-import q from "../dropdown-menu/index.js";
-import A from "../suggestion-popover/index.js";
-import { _ as w } from "../_plugin-vue_export-helper.js";
-const H = { key: 0 }, J = /* @__PURE__ */ T({
+import { defineComponent as b, useSlots as R, computed as k, createElementBlock as f, openBlock as n, normalizeClass as U, renderSlot as B, createBlock as u, resolveDynamicComponent as G, createCommentVNode as S, toDisplayString as F, unref as _, mergeProps as D, createSlots as H, withCtx as y, createVNode as $, renderList as P, mergeModels as V, useCssVars as j, ref as E, useModel as q, watch as J, createElementVNode as N, Fragment as W, Transition as O, nextTick as Q } from "vue";
+import { K as X, U as Y } from "../tiny-robot-svgs.js";
+import { a as Z, d as x, w as ee } from "../index3.js";
+import te from "../dropdown-menu/index.js";
+import ne from "../suggestion-popover/index.js";
+import { _ as K } from "../_plugin-vue_export-helper.js";
+const oe = { key: 0 }, ie = /* @__PURE__ */ b({
   __name: "PillButton",
   props: {
     item: {}
   },
-  setup(s) {
-    const u = s, p = N(), r = d(() => {
-      var e;
-      return !!(p.icon || (e = u.item) != null && e.icon);
-    }), m = d(() => {
-      var e;
-      return !!(p.default || (e = u.item) != null && e.text);
-    }), k = d(() => r.value && !m.value);
-    return (e, g) => (n(), a("button", {
-      class: R(["tr-suggestion-pills__item", { "only-icon": k.value }])
+  setup(a) {
+    const v = a, s = R(), e = k(() => {
+      var t;
+      return !!(s.icon || (t = v.item) != null && t.icon);
+    }), o = k(() => {
+      var t;
+      return !!(s.default || (t = v.item) != null && t.text);
+    }), g = k(() => e.value && !o.value);
+    return (t, c) => (n(), f("button", {
+      class: U(["tr-suggestion-pills__item", { "only-icon": g.value }])
     }, [
-      v(e.$slots, "icon", {}, () => {
-        var l;
+      B(t.$slots, "icon", {}, () => {
+        var i;
         return [
-          (n(), c(V((l = e.item) == null ? void 0 : l.icon), { class: "tr-suggestion-pills__item_icon" }))
+          (n(), u(G((i = t.item) == null ? void 0 : i.icon), { class: "tr-suggestion-pills__item_icon" }))
         ];
       }, !0),
-      v(e.$slots, "default", {}, () => {
-        var l;
+      B(t.$slots, "default", {}, () => {
+        var i;
         return [
-          (l = e.item) != null && l.text ? (n(), a("span", H, E(e.item.text), 1)) : z("", !0)
+          (i = t.item) != null && i.text ? (n(), f("span", oe, F(t.item.text), 1)) : S("", !0)
         ];
       }, !0)
     ], 2));
   }
-}), o = /* @__PURE__ */ w(J, [["__scopeId", "data-v-8df2df8c"]]), K = /* @__PURE__ */ T({
-  __name: "index",
+}), p = /* @__PURE__ */ K(ie, [["__scopeId", "data-v-bb357728"]]), z = /* @__PURE__ */ b({
+  __name: "PillButtonWrapper",
   props: {
-    items: {}
+    item: {}
   },
-  emits: ["item-click"],
-  setup(s, { emit: u }) {
-    F((g) => ({
-      31203585: e.value
+  emits: ["click"],
+  setup(a, { emit: v }) {
+    const s = v;
+    return (e, o) => {
+      var g, t, c, i, m, C;
+      return ((g = e.item.action) == null ? void 0 : g.type) === "popover" ? (n(), u(_(ne), D({ key: 0 }, e.item.action.props, {
+        onItemClick: (t = e.item.action.events) == null ? void 0 : t.itemClick,
+        onGroupClick: (c = e.item.action.events) == null ? void 0 : c.groupClick,
+        onClose: (i = e.item.action.events) == null ? void 0 : i.close
+      }), H({
+        default: y(() => [
+          $(p, {
+            item: e.item,
+            onClick: o[0] || (o[0] = (d) => s("click", e.item))
+          }, null, 8, ["item"])
+        ]),
+        _: 2
+      }, [
+        P(e.item.action.slots, (d, I) => ({
+          name: I,
+          fn: y(() => [
+            (n(), u(G(d)))
+          ])
+        }))
+      ]), 1040, ["onItemClick", "onGroupClick", "onClose"])) : ((m = e.item.action) == null ? void 0 : m.type) === "menu" ? (n(), u(_(te), D({ key: 1 }, e.item.action.props, {
+        onItemClick: (C = e.item.action.events) == null ? void 0 : C.itemClick
+      }), {
+        default: y(() => [
+          $(p, {
+            item: e.item,
+            onClick: o[1] || (o[1] = (d) => s("click", e.item))
+          }, null, 8, ["item"])
+        ]),
+        _: 1
+      }, 16, ["onItemClick"])) : (n(), u(p, {
+        key: 2,
+        item: e.item,
+        onClick: o[2] || (o[2] = (d) => s("click", e.item))
+      }, null, 8, ["item"]));
+    };
+  }
+}), se = { class: "tr-suggestion-pills__wrapper" }, le = { class: "tr-suggestion-pills__more-wrapper" }, re = {
+  key: 0,
+  class: "tr-suggestion-pills__more"
+}, ae = /* @__PURE__ */ b({
+  __name: "index",
+  props: /* @__PURE__ */ V({
+    items: {},
+    showAll: { type: Boolean }
+  }, {
+    showAll: { type: Boolean, default: !1 },
+    showAllModifiers: {}
+  }),
+  emits: /* @__PURE__ */ V(["item-click"], ["update:showAll"]),
+  setup(a, { emit: v }) {
+    j((l) => ({
+      "2bdfa5e6": I.value
     }));
-    const p = s, r = u, m = L(null), { arrivedState: k } = j(m), e = d(() => k.left ? "linear-gradient(to right, black 95%, transparent)" : k.right ? "linear-gradient(to left, black 95%, transparent)" : "linear-gradient(to right, transparent, black 5%, black 95%, transparent)");
-    return (g, l) => (n(), a("div", {
-      class: "tr-suggestion-pills__container",
-      ref_key: "containerRef",
-      ref: m
-    }, [
-      v(g.$slots, "default", {}, () => [
-        (n(!0), a($, null, b(p.items, (t) => {
-          var y, h, S, B, I, P;
-          return n(), a($, {
-            key: t.id
-          }, [
-            ((y = t.action) == null ? void 0 : y.type) === "popover" ? (n(), c(i(A), x({
-              key: 0,
-              class: "shrink",
-              ref_for: !0
-            }, t.action.props, {
-              onItemClick: (h = t.action.events) == null ? void 0 : h.itemClick,
-              onGroupClick: (S = t.action.events) == null ? void 0 : S.groupClick,
-              onClose: (B = t.action.events) == null ? void 0 : B.close
-            }), M({
-              default: C(() => [
-                D(i(o), {
-                  item: t,
-                  onClick: (f) => r("item-click", t)
-                }, null, 8, ["item", "onClick"])
-              ]),
-              _: 2
-            }, [
-              b(t.action.slots, (f, G) => ({
-                name: G,
-                fn: C(() => [
-                  (n(), c(V(f)))
-                ])
-              }))
-            ]), 1040, ["onItemClick", "onGroupClick", "onClose"])) : ((I = t.action) == null ? void 0 : I.type) === "menu" ? (n(), c(i(q), x({
-              key: 1,
-              class: "shrink",
-              ref_for: !0
-            }, t.action.props, {
-              onItemClick: (P = t.action.events) == null ? void 0 : P.itemClick
-            }), {
-              default: C(() => [
-                D(i(o), {
-                  item: t,
-                  onClick: (f) => r("item-click", t)
-                }, null, 8, ["item", "onClick"])
-              ]),
-              _: 2
-            }, 1040, ["onItemClick"])) : (n(), c(i(o), {
-              key: 2,
-              item: t,
-              onClick: (f) => r("item-click", t)
-            }, null, 8, ["item", "onClick"]))
-          ], 64);
-        }), 128))
-      ], !0)
-    ], 512));
+    const s = a, e = v, o = E(null), { width: g } = Z(o), { arrivedState: t } = x(o), c = E(-1), i = k(() => c.value !== -1), m = q(a, "showAll"), C = k(() => !i.value || !m.value ? s.items || [] : (s.items || []).slice(0, c.value)), d = k(() => !i.value || !m.value ? [] : (s.items || []).slice(c.value)), I = k(() => t.left ? "linear-gradient(to right, black 90%, transparent)" : "unset"), A = () => {
+      Q(() => {
+        const l = o.value;
+        if (!l)
+          return;
+        const h = Array.from(l.children);
+        c.value = h.findIndex((r) => r.offsetLeft + r.offsetWidth > l.clientWidth);
+      });
+    };
+    J(() => s.items, A), ee(
+      g,
+      (l) => {
+        l > 0 && A();
+      },
+      { debounce: 100 }
+    );
+    const L = (l, h) => {
+      if (i.value && h >= c.value) {
+        M();
+        return;
+      }
+      e("item-click", l);
+    }, M = () => {
+      m.value = !m.value;
+    };
+    return (l, h) => (n(), f("div", se, [
+      N("div", {
+        class: "tr-suggestion-pills__container",
+        ref_key: "containerRef",
+        ref: o
+      }, [
+        B(l.$slots, "default", {}, () => [
+          (n(!0), f(W, null, P(C.value, (r, T) => (n(), u(_(z), {
+            key: r.id,
+            item: r,
+            onClick: (me) => L(r, T)
+          }, null, 8, ["item", "onClick"]))), 128))
+        ], !0)
+      ], 512),
+      N("div", le, [
+        $(O, { name: "tr-suggestion-pills__more" }, {
+          default: y(() => [
+            d.value.length ? (n(), f("div", re, [
+              (n(!0), f(W, null, P(d.value, (r) => (n(), u(_(z), {
+                key: r.id,
+                item: r,
+                onClick: (T) => e("item-click", r)
+              }, null, 8, ["item", "onClick"]))), 128))
+            ])) : S("", !0)
+          ]),
+          _: 1
+        })
+      ]),
+      i.value ? (n(), f("button", {
+        key: 0,
+        class: "tr-suggestion-pills__expand",
+        onClick: M
+      }, [
+        m.value ? (n(), u(_(Y), { key: 1 })) : (n(), u(_(X), { key: 0 }))
+      ])) : S("", !0)
+    ]));
   }
-}), _ = /* @__PURE__ */ w(K, [["__scopeId", "data-v-9c74797b"]]);
-_.name = "TrSuggestionPills";
-const O = function(s) {
-  s.component(_.name, _);
+}), w = /* @__PURE__ */ K(ae, [["__scopeId", "data-v-74f54ee4"]]);
+w.name = "TrSuggestionPills";
+const ce = function(a) {
+  a.component(w.name, w);
 };
-_.install = O;
-o.name = "TrSuggestionPillButton";
-const Q = function(s) {
-  s.component(o.name, o);
+w.install = ce;
+p.name = "TrSuggestionPillButton";
+const ue = function(a) {
+  a.component(p.name, p);
 };
-o.install = Q;
-const tt = o;
+p.install = ue;
+const _e = p;
 export {
-  tt as SuggestionPillButton,
-  _ as default
+  _e as SuggestionPillButton,
+  w as default
 };

package/dist/suggestion-popover/index.js

@@ -1,4 +1,4 @@
-import { defineComponent as b, mergeModels as J, useCssVars as z, unref as B, ref as E, computed as C, useModel as V, watch as W, createElementBlock as Q, openBlock as D, renderSlot as k, createBlock as n, createCommentVNode as c, createVNode as I, Teleport as a, createElementVNode as o, Transition as x, withCtx as M, normalizeStyle as S, resolveDynamicComponent as L, toDisplayString as s, Fragment as u, renderList as Z, createTextVNode as K } from "vue";
+import { defineComponent as b, mergeModels as a, useCssVars as z, unref as B, ref as k, computed as C, useModel as V, watch as W, createElementBlock as Q, openBlock as D, renderSlot as c, createBlock as n, createCommentVNode as I, createVNode as s, Teleport as J, createElementVNode as o, Transition as x, withCtx as M, normalizeStyle as S, resolveDynamicComponent as L, toDisplayString as d, Fragment as u, renderList as Z, createTextVNode as K } from "vue";
 import { a as N, t as _ } from "../tiny-robot-svgs.js";
 import { c as $, u as AA, o as gA } from "../index3.js";
 import fA from "../flow-layout-buttons/index.js";
@@ -16,7 +16,7 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
   class: "tr-question__no-data-wrapper"
 }, CA = { class: "tr-question__list" }, vA = ["onClick"], FA = { class: "tr-question__list-item-text" }, nA = /* @__PURE__ */ b({
   __name: "index",
-  props: /* @__PURE__ */ J({
+  props: /* @__PURE__ */ a({
     data: {},
     title: { default: "热门问题" },
     icon: {},
@@ -32,20 +32,20 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
     selectedGroup: {},
     selectedGroupModifiers: {}
   }),
-  emits: /* @__PURE__ */ J(["item-click", "group-click", "open", "close"], ["update:selectedGroup"]),
+  emits: /* @__PURE__ */ a(["item-click", "group-click", "open", "close"], ["update:selectedGroup"]),
   setup(v, { emit: p }) {
     z((A) => ({
-      "5ffc1db4": B(t)(g.popoverHeight),
-      "5d7bdfb4": B(w) ? "0" : "24px",
-      "0d99f7f9": B(w) ? "unset" : "0",
-      "1b27425e": B(w) ? "translateY(100%)" : "unset",
-      "0d99f818": B(w) ? "unset" : "1",
-      "35fb302d": B(w) ? "translateY(0)" : "unset"
+      "6e5ea44c": B(t)(g.popoverHeight),
+      "69dc9068": B(w) ? "0" : "24px",
+      e5614476: B(w) ? "unset" : "0",
+      "8245b0f6": B(w) ? "translateY(100%)" : "unset",
+      e5614438: B(w) ? "unset" : "1",
+      dfab780e: B(w) ? "translateY(0)" : "unset"
     }));
-    const g = v, d = E(!1), P = C({
-      get: () => g.trigger === "manual" ? g.show : d.value,
+    const g = v, r = k(!1), P = C({
+      get: () => g.trigger === "manual" ? g.show : r.value,
       set: (A) => {
-        g.trigger !== "manual" && (d.value = A);
+        g.trigger !== "manual" && (r.value = A);
       }
     }), F = p, l = V(v, "selectedGroup"), H = C(() => {
       var A;
@@ -55,10 +55,10 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
     const O = C(() => {
       var A;
       return H.value ? ((A = g.data.find((f) => f.group === l.value)) == null ? void 0 : A.items) || [] : g.data;
-    }), r = C(() => H.value ? g.data.map((A) => ({
+    }), U = C(() => H.value ? g.data.map((A) => ({
       ...A,
       id: A.group
-    })) : []), U = E(null), h = E(null), { x: G, y: X, update: R } = AA(U), w = $("(max-width: 767px)"), q = C(() => w.value ? {
+    })) : []), E = k(null), h = k(null), { x: G, y: X, update: R } = AA(E), w = $("(max-width: 767px)"), q = C(() => w.value ? {
       left: 0,
       right: 0,
       bottom: 0
@@ -68,7 +68,8 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
       width: t(g.popoverWidth)
     });
     g.trigger === "click" && gA(h, (A) => {
-      A.stopPropagation(), P.value = !1;
+      var f;
+      (f = E.value) != null && f.contains(A.target) && A.stopPropagation(), P.value = !1;
     }), W(P, (A) => {
       A && R();
     });
@@ -85,19 +86,19 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
     return (A, f) => (D(), Q("div", {
       class: "tr-question-popover__wrapper",
       ref_key: "popoverTriggerRef",
-      ref: U,
+      ref: E,
       onClick: j
     }, [
-      k(A.$slots, "default", {}, void 0, !0),
-      P.value && B(w) ? (D(), n(a, {
+      c(A.$slots, "default", {}, void 0, !0),
+      P.value && B(w) ? (D(), n(J, {
         key: 0,
         to: "body"
       }, [
         f[1] || (f[1] = o("div", { class: "tr-question-popover__backdrop" }, null, -1))
-      ])) : c("", !0),
-      I(x, { name: "tr-question-popover" }, {
+      ])) : I("", !0),
+      s(x, { name: "tr-question-popover" }, {
         default: M(() => [
-          P.value ? (D(), n(a, {
+          P.value ? (D(), n(J, {
             key: 0,
             to: "body"
           }, [
@@ -109,10 +110,10 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
             }, [
               o("div", wA, [
                 g.icon ? (D(), n(L(g.icon), { key: 0 })) : (D(), Q("span", eA, [
-                  I(B(N), { style: { color: "#1476ff" } })
+                  s(B(N), { style: { color: "#1476ff" } })
                 ])),
-                o("h3", QA, s(g.title), 1),
-                I(B(BA), {
+                o("h3", QA, d(g.title), 1),
+                s(B(BA), {
                   class: "tr-question-popover__close",
                   icon: B(_),
                   size: "24",
@@ -121,7 +122,7 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
                 }, null, 8, ["icon"])
               ]),
               g.loading ? (D(), Q("div", tA, [
-                k(A.$slots, "loading", {}, () => [
+                c(A.$slots, "loading", {}, () => [
                   f[2] || (f[2] = o("img", {
                     class: "tr-question__loading",
                     src: oA
@@ -129,7 +130,7 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
                   f[3] || (f[3] = o("span", { class: "tr-question__loading-text" }, "正在加载", -1))
                 ], !0)
               ])) : g.data.length === 0 ? (D(), Q("div", lA, [
-                k(A.$slots, "empty", {}, () => [
+                c(A.$slots, "empty", {}, () => [
                   f[4] || (f[4] = o("img", {
                     class: "tr-question__no-data",
                     src: PA
@@ -137,16 +138,16 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
                   f[5] || (f[5] = o("span", { class: "tr-question__no-data-text" }, "暂时没有内容", -1))
                 ], !0)
               ])) : (D(), Q(u, { key: 2 }, [
-                r.value.length > 0 ? (D(), n(B(fA), {
+                U.value.length > 0 ? (D(), n(B(fA), {
                   key: 0,
                   class: "tr-question__group",
-                  items: r.value,
+                  items: U.value,
                   selected: l.value,
                   "onUpdate:selected": f[0] || (f[0] = (e) => l.value = e),
                   "lines-limit": 2,
                   "show-more-trigger": g.groupShowMoreTrigger,
                   onItemClick: y
-                }, null, 8, ["items", "selected", "show-more-trigger"])) : c("", !0),
+                }, null, 8, ["items", "selected", "show-more-trigger"])) : I("", !0),
                 o("ul", CA, [
                   (D(!0), Q(u, null, Z(O.value, (e, m) => (D(), Q("li", {
                     class: "tr-question__list-item",
@@ -154,20 +155,20 @@ const oA = "data:image/webp;base64,UklGRhYaAQBXRUJQVlA4WAoAAAASAAAAPwAAPwAAQU5JT
                     onClick: (HA) => T(e)
                   }, [
                     o("span", FA, [
-                      o("span", null, s(m + 1) + ". ", 1),
-                      K(s(e.text), 1)
+                      o("span", null, d(m + 1) + ". ", 1),
+                      K(d(e.text), 1)
                     ])
                   ], 8, vA))), 128))
                 ])
               ], 64))
             ], 4)
-          ])) : c("", !0)
+          ])) : I("", !0)
         ]),
         _: 3
       })
     ], 512));
   }
-}), i = /* @__PURE__ */ DA(nA, [["__scopeId", "data-v-500fd392"]]);
+}), i = /* @__PURE__ */ DA(nA, [["__scopeId", "data-v-f8e2a4fa"]]);
 i.name = "TrSuggestionPopover";
 const iA = function(v) {
   v.component(i.name, i);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/tiny-robot",
-  "version": "0.2.0-alpha.6",
+  "version": "0.2.0-alpha.7",
   "publishConfig": {
     "access": "public"
   },
@@ -20,7 +20,7 @@
     "vue": "^3.3.11"
   },
   "dependencies": {
-    "@opentiny/tiny-robot-svgs": "0.2.0-alpha.6",
+    "@opentiny/tiny-robot-svgs": "0.2.0-alpha.7",
     "@opentiny/vue": "^3.21.0",
     "@opentiny/vue-button": "^3.21.0",
     "@opentiny/vue-icon": "^3.22.0",
@@ -44,5 +44,5 @@
     "vue": "^3.3.11",
     "vue-tsc": "^2.2.8"
   },
-  "gitHead": "3068fcc667cb81a7669a3eab2de99d9f4ae736ed"
+  "gitHead": "85e914dd3979e17d4c64018a02091fafd0d5d185"
 }