@opentiny/tiny-robot 0.3.0-alpha.3 → 0.3.0-alpha.5

package/dist/container/index.js

@@ -1,5 +1,5 @@
-import { defineComponent as m, useCssVars as v, useModel as d, computed as _, createElementBlock as w, openBlock as g, createElementVNode as n, renderSlot as r, createVNode as c, unref as i } from "vue";
-import { r as h, a as $, f as C } from "../tiny-robot-svgs.js";
+import { defineComponent as m, useCssVars as v, useModel as d, computed as _, createElementBlock as $, openBlock as w, createElementVNode as n, renderSlot as r, createVNode as c, unref as a } from "vue";
+import { $ as g, i as h, t as C } from "../tiny-robot-svgs.js";
 import u from "../icon-button/index.js";
 import { _ as b } from "../_plugin-vue_export-helper.js";
 const z = { class: "tr-container" }, B = { class: "tr-container__header" }, k = { class: "tr-container__header-operations" }, y = { class: "tr-container__footer" }, E = /* @__PURE__ */ m({
@@ -18,8 +18,8 @@ const z = { class: "tr-container" }, B = { class: "tr-container__header" }, k =
       "234493b2": l.value ? "var(--tr-z-index-fixed)" : "-1",
       "0c2ba509": l.value ? "1" : "0"
     }));
-    const l = d(o, "show"), s = d(o, "fullscreen"), f = _(() => s.value ? h : $);
-    return (t, e) => (g(), w("div", z, [
+    const l = d(o, "show"), s = d(o, "fullscreen"), f = _(() => s.value ? g : h);
+    return (t, e) => (w(), $("div", z, [
       e[3] || (e[3] = n("div", { class: "tr-container__dragging-bar-wrapper" }, [
         n("div", { class: "tr-container__dragging-bar" })
       ], -1)),
@@ -29,16 +29,16 @@ const z = { class: "tr-container" }, B = { class: "tr-container__header" }, k =
         ]),
         n("div", k, [
           r(t.$slots, "operations"),
-          c(i(u), {
+          c(a(u), {
             size: "28",
             "svg-size": "20",
             icon: f.value,
             onClick: e[0] || (e[0] = (p) => t.$emit("update:fullscreen", !s.value))
           }, null, 8, ["icon"]),
-          c(i(u), {
+          c(a(u), {
             size: "28",
             "svg-size": "20",
-            icon: i(C),
+            icon: a(C),
             onClick: e[1] || (e[1] = (p) => t.$emit("update:show", !1))
           }, null, 8, ["icon"])
         ])
@@ -49,12 +49,12 @@ const z = { class: "tr-container" }, B = { class: "tr-container__header" }, k =
       ])
     ]));
   }
-}), a = /* @__PURE__ */ b(E, [["__scopeId", "data-v-6a9b9126"]]);
-a.name = "TrContainer";
+}), i = /* @__PURE__ */ b(E, [["__scopeId", "data-v-6a9b9126"]]);
+i.name = "TrContainer";
 const I = function(o) {
-  o.component(a.name, a);
+  o.component(i.name, i);
 };
-a.install = I;
+i.install = I;
 export {
-  a as default
+  i as default
 };

package/dist/dropdown-menu/index.js

@@ -1,72 +1,87 @@
-import { defineComponent as B, useCssVars as E, unref as f, useAttrs as N, computed as _, ref as m, watch as O, createElementBlock as o, openBlock as s, Fragment as w, createElementVNode as h, createVNode as W, normalizeStyle as v, normalizeClass as z, renderSlot as I, Transition as A, withCtx as F, createCommentVNode as H, renderList as L, toDisplayString as P } from "vue";
-import { c as g, o as U } from "../index2.js";
-import { t as n } from "../utils.js";
-import { _ as b } from "../_plugin-vue_export-helper.js";
-const j = { class: "tr-dropdown-menu__list" }, q = ["onClick"], G = /* @__PURE__ */ B({
+import { defineComponent as C, ref as g, computed as n, watch as R, createBlock as E, openBlock as a, unref as x, withCtx as v, createElementVNode as B, createElementBlock as _, Fragment as T, renderList as D, toDisplayString as M, renderSlot as H } from "vue";
+import { o as L, c as k, d as P } from "../index2.js";
+import b from "../base-popper/index.js";
+import { _ as I } from "../_plugin-vue_export-helper.js";
+const S = { class: "tr-dropdown-menu__list" }, $ = ["onClick"], F = /* @__PURE__ */ C({
   __name: "index",
   props: {
+    appendTo: {},
     items: {},
-    minWidth: { default: 160 },
-    topOffset: { default: 0 }
+    show: { type: Boolean },
+    trigger: { default: "click" }
   },
-  emits: ["item-click"],
-  setup(l, { emit: k }) {
-    E((e) => ({
-      d82a8430: f(n)(a.minWidth)
-    }));
-    const a = l, p = N(), y = _(() => p.style), t = m(!1), C = k, i = m(null), d = m(null), { x, y: $, update: S } = g(i), { width: D, height: T } = g(d), M = _(() => ({
-      left: `min(${n(x.value)}, 100% - ${n(D.value)})`,
-      top: `max(${n($.value)} - ${n(T.value)} + ${n(a.topOffset)} - 8px, 0px)`
-    }));
-    U(d, (e) => {
-      var u;
-      (u = i.value) != null && u.contains(e.target) && e.stopPropagation(), t.value = !1;
-    }), O(t, (e) => {
-      e && S();
+  emits: ["item-click", "click-outside"],
+  setup(l, { emit: w }) {
+    const t = l, c = w, p = g(!1), r = n({
+      get: () => t.trigger === "manual" ? t.show : p.value,
+      set: (e) => {
+        t.trigger !== "manual" && (p.value = e);
+      }
+    }), i = g(null), u = n(() => {
+      var e;
+      return (e = i.value) == null ? void 0 : e.triggerRef;
+    }), d = n(() => {
+      var e;
+      return (e = i.value) == null ? void 0 : e.popperRef;
     });
-    const R = () => {
-      t.value = !t.value;
-    }, V = (e) => {
-      t.value = !1, C("item-click", e);
+    if (t.trigger === "click" || t.trigger === "manual")
+      L(
+        d,
+        (e) => {
+          c("click-outside", e), r.value = !1;
+        },
+        { ignore: [u] }
+      );
+    else if (t.trigger === "hover") {
+      const e = k(
+        n(() => P(u.value)),
+        { delayEnter: 100, delayLeave: 300 }
+      ), m = k(d, { delayEnter: 100, delayLeave: 300 });
+      R(
+        () => [e.value, m.value],
+        ([o, f]) => {
+          r.value = o || f;
+        }
+      );
+    }
+    const h = () => {
+      t.trigger === "click" && (r.value = !r.value);
+    }, y = (e) => {
+      r.value = !1, c("item-click", e);
     };
-    return (e, u) => (s(), o(w, null, [
-      h("div", {
-        class: z(["tr-dropdown-menu__wrapper", f(p).class]),
-        style: v(y.value),
-        ref_key: "dropDownTriggerRef",
-        ref: i,
-        onClick: R
-      }, [
-        I(e.$slots, "default", {}, void 0, !0)
-      ], 6),
-      W(A, { name: "tr-dropdown-menu" }, {
-        default: F(() => [
-          t.value ? (s(), o("div", {
-            key: 0,
-            class: "tr-dropdown-menu",
-            style: v(M.value),
-            ref_key: "dropdownMenuRef",
-            ref: d
-          }, [
-            h("ul", j, [
-              (s(!0), o(w, null, L(a.items, (c) => (s(), o("li", {
-                class: "tr-dropdown-menu__list-item",
-                key: c.id,
-                onClick: (K) => V(c)
-              }, P(c.text), 9, q))), 128))
-            ])
-          ], 4)) : H("", !0)
-        ]),
-        _: 1
-      })
-    ], 64));
+    return (e, m) => (a(), E(x(b), {
+      show: r.value,
+      class: "tr-dropdown-menu",
+      ref_key: "basePopperRef",
+      ref: i,
+      placement: "top-left",
+      "append-to": t.appendTo,
+      offset: 8,
+      "transition-props": { name: "tr-dropdown-menu" },
+      "prevent-overflow": !0,
+      "trigger-events": { onClick: h }
+    }, {
+      trigger: v(() => [
+        H(e.$slots, "trigger", {}, void 0, !0)
+      ]),
+      content: v(() => [
+        B("ul", S, [
+          (a(!0), _(T, null, D(t.items, (o) => (a(), _("li", {
+            class: "tr-dropdown-menu__list-item",
+            key: o.id,
+            onClick: (f) => y(o)
+          }, M(o.text), 9, $))), 128))
+        ])
+      ]),
+      _: 3
+    }, 8, ["show", "append-to", "trigger-events"]));
   }
-}), r = /* @__PURE__ */ b(G, [["__scopeId", "data-v-620f91f9"]]);
-r.name = "TrDropdownMenu";
-const J = function(l) {
-  l.component(r.name, r);
+}), s = /* @__PURE__ */ I(F, [["__scopeId", "data-v-ea33ed82"]]);
+s.name = "TrDropdownMenu";
+const N = function(l) {
+  l.component(s.name, s);
 };
-r.install = J;
+s.install = N;
 export {
-  r as default
+  s as default
 };

package/dist/feedback/index.js

@@ -1,8 +1,8 @@
-import { defineComponent as X, ref as E, computed as z, onMounted as D, watch as O, createElementBlock as a, openBlock as t, createCommentVNode as k, Fragment as I, renderList as S, toDisplayString as y, createVNode as b, unref as l, nextTick as q, createElementVNode as _, createBlock as p, withCtx as f, createTextVNode as j, resolveDynamicComponent as C } from "vue";
-import { l as T, n as N, c as H, h as J, y as K, d as Q } from "../tiny-robot-svgs.js";
+import { defineComponent as X, ref as E, computed as z, onMounted as D, watch as K, createElementBlock as a, openBlock as t, createCommentVNode as k, Fragment as I, renderList as S, toDisplayString as y, createVNode as h, unref as l, nextTick as O, createElementVNode as d, createBlock as _, withCtx as f, createTextVNode as U, resolveDynamicComponent as C } from "vue";
+import { K as T, U as N, d as q, s as j, p as H, e as J } from "../tiny-robot-svgs.js";
 import { B as R } from "../index3.js";
 import $, { ActionGroupItem as V } from "../action-group/index.js";
-import U from "../icon-button/index.js";
+import Q from "../icon-button/index.js";
 import { _ as P } from "../_plugin-vue_export-helper.js";
 const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__ */ X({
   __name: "SourceList",
@@ -10,9 +10,9 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
     sources: {},
     linesLimit: { default: Number.MAX_SAFE_INTEGER }
   },
-  setup(h) {
-    const m = h, e = E(!1), g = E([]), c = E(null), L = () => {
-      q(() => {
+  setup(b) {
+    const m = b, e = E(!1), g = E([]), c = E(null), L = () => {
+      O(() => {
         const u = g.value.slice(0, m.sources.length).map((o) => (o == null ? void 0 : o.offsetTop) || 0), n = Array.from(new Set(u));
         if (n.length > m.linesLimit) {
           const o = n[m.linesLimit - 1], s = u.lastIndexOf(o);
@@ -21,8 +21,8 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
           c.value = null;
       });
     }, A = z(() => m.sources.length - (c.value || 0));
-    D(L), O(() => m.sources, L);
-    const d = (u, n) => {
+    D(L), K(() => m.sources, L);
+    const p = (u, n) => {
       u && (g.value[n] = u);
     };
     return (u, n) => (t(), a("div", W, [
@@ -33,7 +33,7 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
           href: o.link,
           target: "_blank",
           ref_for: !0,
-          ref: (r) => d(r, s)
+          ref: (r) => p(r, s)
         }, y(o.label), 9, Y)) : k("", !0),
         c.value && !e.value && s === c.value ? (t(), a("span", {
           key: 1,
@@ -46,7 +46,7 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
         class: "pill collapse-pill",
         onClick: n[1] || (n[1] = (o) => e.value = !1)
       }, [
-        b(l(T))
+        h(l(T))
       ])) : k("", !0)
     ]));
   }
@@ -64,27 +64,27 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
     sourcesLinesLimit: { default: Number.MAX_SAFE_INTEGER }
   },
   emits: ["operation", "action"],
-  setup(h, { emit: m }) {
-    const e = h, g = {
-      copy: Q,
-      refresh: K,
-      like: J,
-      dislike: H
+  setup(b, { emit: m }) {
+    const e = b, g = {
+      copy: J,
+      refresh: H,
+      like: j,
+      dislike: q
     }, c = m, L = (n) => {
       var o, s, r;
       (r = (s = (o = e.operations) == null ? void 0 : o.find((v) => v.name === n)) == null ? void 0 : s.onClick) == null || r.call(s), c("operation", n);
     }, A = (n) => {
       var o, s, r;
       (r = (s = (o = e.actions) == null ? void 0 : o.find((v) => v.name === n)) == null ? void 0 : s.onClick) == null || r.call(s), c("action", n);
-    }, d = E(!1), u = () => {
-      d.value = !d.value;
+    }, p = E(!1), u = () => {
+      p.value = !p.value;
     };
     return (n, o) => {
       var s, r, v, w, B, F, M, G;
       return t(), a("div", te, [
-        _("div", se, [
-          _("div", oe, [
-            (s = e.operations) != null && s.length ? (t(), p(l($), {
+        d("div", se, [
+          d("div", oe, [
+            (s = e.operations) != null && s.length ? (t(), _(l($), {
               key: 0,
               "max-num": e.operationsLimit,
               "drop-down-show-label-only": !0,
@@ -92,34 +92,34 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
               class: "tr-feedback__operations-left-action-group"
             }, {
               moreBtn: f(() => [
-                b(l(R), {
+                h(l(R), {
                   round: "",
                   size: "mini",
                   "reset-time": 0,
                   class: "tr-feedback__operations-more-btn"
                 }, {
                   default: f(() => [
-                    o[0] || (o[0] = _("span", null, "更多", -1)),
-                    b(l(N))
+                    o[0] || (o[0] = d("span", null, "更多", -1)),
+                    h(l(N))
                   ]),
                   _: 1,
                   __: [0]
                 })
               ]),
               default: f(() => [
-                (t(!0), a(I, null, S(e.operations, (i) => (t(), p(l(V), {
+                (t(!0), a(I, null, S(e.operations, (i) => (t(), _(l(V), {
                   key: i.name,
                   name: i.name,
                   label: i.label
                 }, {
                   default: f(() => [
-                    b(l(R), {
+                    h(l(R), {
                       round: "",
                       "reset-time": 0,
                       size: "mini"
                     }, {
                       default: f(() => [
-                        j(y(i.label), 1)
+                        U(y(i.label), 1)
                       ]),
                       _: 2
                     }, 1024)
@@ -129,32 +129,32 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
               ]),
               _: 1
             }, 8, ["max-num"])) : (r = e.sources) != null && r.length ? (t(), a("div", ne, [
-              _("span", {
+              d("span", {
                 class: "tr-feedback__source",
                 onClick: u
               }, [
-                _("span", null, y((v = e.sources) == null ? void 0 : v.length) + "条来源", 1),
-                (t(), p(C(d.value ? l(T) : l(N))))
+                d("span", null, y((v = e.sources) == null ? void 0 : v.length) + "条来源", 1),
+                (t(), _(C(p.value ? l(T) : l(N))))
               ])
             ])) : k("", !0)
           ]),
-          _("div", le, [
-            b(l($), {
+          d("div", le, [
+            h(l($), {
               "max-num": e.actionsLimit,
               "show-tooltip": !0,
               onItemClick: A
             }, {
               default: f(() => [
-                (t(!0), a(I, null, S(e.actions, (i) => (t(), p(l(V), {
+                (t(!0), a(I, null, S(e.actions, (i) => (t(), _(l(V), {
                   key: i.name,
                   name: i.name,
                   label: i.label
                 }, {
                   default: f(() => [
-                    typeof i.icon == "string" ? (t(), p(l(U), {
+                    typeof i.icon == "string" ? (t(), _(l(Q), {
                       key: 0,
                       icon: g[i.icon]
-                    }, null, 8, ["icon"])) : (t(), p(C(i.icon), { key: 1 }))
+                    }, null, 8, ["icon"])) : (t(), _(C(i.icon), { key: 1 }))
                   ]),
                   _: 2
                 }, 1032, ["name", "label"]))), 128))
@@ -163,17 +163,17 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
             }, 8, ["max-num"])
           ])
         ]),
-        (w = e.operations) != null && w.length && ((B = e.sources) != null && B.length) || d.value && e.sources ? (t(), a("div", ae, [
+        (w = e.operations) != null && w.length && ((B = e.sources) != null && B.length) || p.value && e.sources ? (t(), a("div", ae, [
           (F = e.operations) != null && F.length && ((M = e.sources) != null && M.length) ? (t(), a("div", re, [
-            _("span", {
+            d("span", {
               class: "tr-feedback__source",
               onClick: u
             }, [
-              _("span", null, y((G = e.sources) == null ? void 0 : G.length) + "条来源", 1),
-              (t(), p(C(d.value ? l(T) : l(N))))
+              d("span", null, y((G = e.sources) == null ? void 0 : G.length) + "条来源", 1),
+              (t(), _(C(p.value ? l(T) : l(N))))
             ])
           ])) : k("", !0),
-          d.value && e.sources ? (t(), p(l(ee), {
+          p.value && e.sources ? (t(), _(l(ee), {
             key: 1,
             sources: e.sources,
             "lines-limit": e.sourcesLinesLimit
@@ -184,8 +184,8 @@ const W = { class: "tr-feedback__source-list" }, Y = ["href"], Z = /* @__PURE__
   }
 }), x = /* @__PURE__ */ P(ie, [["__scopeId", "data-v-cc6ef316"]]);
 x.name = "TrFeedback";
-const ce = function(h) {
-  h.component(x.name, x);
+const ce = function(b) {
+  b.component(x.name, x);
 };
 x.install = ce;
 export {

package/dist/flow-layout-buttons/index.js

@@ -1,17 +1,17 @@
-import { defineComponent as q, mergeModels as E, useModel as G, watch as g, ref as i, computed as $, createElementBlock as a, openBlock as l, createElementVNode as C, Fragment as I, renderList as S, createCommentVNode as _, normalizeClass as b, createBlock as x, resolveDynamicComponent as B, toDisplayString as D, nextTick as H } from "vue";
-import { n as X } from "../tiny-robot-svgs.js";
-import { b as j, o as J } from "../index2.js";
-import { _ as K } from "../_plugin-vue_export-helper.js";
-const P = ["onClick"], Q = {
+import { defineComponent as V, mergeModels as E, useModel as q, watch as g, ref as i, computed as $, createElementBlock as a, openBlock as l, createElementVNode as C, Fragment as I, renderList as S, createCommentVNode as _, normalizeClass as b, createBlock as x, resolveDynamicComponent as B, toDisplayString as D, nextTick as G } from "vue";
+import { U as H } from "../tiny-robot-svgs.js";
+import { b as X, o as j } from "../index2.js";
+import { _ as J } from "../_plugin-vue_export-helper.js";
+const K = ["onClick"], P = {
   key: 0,
   class: "tr-flow-layout__item-label"
-}, U = { class: "tr-flow-layout__dropdown-wrapper" }, Y = ["onClick"], Z = { class: "tr-flow-layout__item-label" }, ee = /* @__PURE__ */ q({
+}, Q = { class: "tr-flow-layout__dropdown-wrapper" }, Y = ["onClick"], Z = { class: "tr-flow-layout__item-label" }, ee = /* @__PURE__ */ V({
   __name: "index",
   props: /* @__PURE__ */ E({
     items: {},
     selected: {},
     linesLimit: { default: Number.MAX_SAFE_INTEGER },
-    moreIcon: { default: X },
+    moreIcon: { default: H },
     showMoreTrigger: { default: "click" }
   }, {
     selected: {},
@@ -19,7 +19,7 @@ const P = ["onClick"], Q = {
   }),
   emits: /* @__PURE__ */ E(["item-click"], ["update:selected"]),
   setup(d, { emit: F }) {
-    const n = d, u = G(d, "selected");
+    const n = d, u = q(d, "selected");
     g(
       () => n.items,
       (t) => {
@@ -30,7 +30,7 @@ const P = ["onClick"], Q = {
     const N = F, y = i(null), w = i(null), k = i(null), M = i([]), s = i(null), m = i(!1), c = i(!1), A = (t, o) => {
       t && (M.value[o] = t);
     }, L = () => {
-      s.value = null, m.value = !1, H(() => {
+      s.value = null, m.value = !1, G(() => {
         const t = y.value, o = w.value;
         if (!t || !o)
           return;
@@ -43,21 +43,24 @@ const P = ["onClick"], Q = {
       });
     };
     g(() => n.items, L);
-    const { width: W } = j(y);
+    const { width: W } = X(y);
     g(W, (t) => {
       t > 0 && L();
     });
     const z = $(() => s.value !== null ? n.items.slice(s.value) : []), O = $(() => s.value === null ? !1 : n.items.findIndex((o) => o.id === u.value) >= s.value), R = (t) => {
       u.value = t, c.value = !1, N("item-click", t);
-    }, V = () => {
+    }, U = () => {
       n.showMoreTrigger === "click" && (c.value = !c.value);
     }, v = (t) => {
       n.showMoreTrigger === "hover" && (c.value = t);
     };
-    return J(k, (t) => {
-      var o, e;
-      (o = k.value) != null && o.contains(t.target) || (e = w.value) != null && e.contains(t.target) || (c.value = !1);
-    }), (t, o) => (l(), a("div", {
+    return j(
+      k,
+      () => {
+        c.value = !1;
+      },
+      { ignore: [k, w] }
+    ), (t, o) => (l(), a("div", {
       class: "tr-flow-layout",
       ref_key: "containerRef",
       ref: y
@@ -73,16 +76,16 @@ const P = ["onClick"], Q = {
           onClick: (r) => R(e.id)
         }, [
           (l(), x(B(e.icon), { class: "tr-flow-layout__item-icon" })),
-          e.label ? (l(), a("span", Q, D(e.label), 1)) : _("", !0)
-        ], 10, P)) : _("", !0)
+          e.label ? (l(), a("span", P, D(e.label), 1)) : _("", !0)
+        ], 10, K)) : _("", !0)
       ], 64))), 128)),
-      C("div", U, [
+      C("div", Q, [
         m.value ? _("", !0) : (l(), a("button", {
           key: 0,
           class: b(["tr-flow-layout__item", "icon-only", { selected: O.value }]),
           ref_key: "moreButtonRef",
           ref: w,
-          onClick: V,
+          onClick: U,
           onMouseenter: o[0] || (o[0] = (e) => v(!0)),
           onMouseleave: o[1] || (o[1] = (e) => v(!1))
         }, [
@@ -112,7 +115,7 @@ const P = ["onClick"], Q = {
       ])
     ], 512));
   }
-}), p = /* @__PURE__ */ K(ee, [["__scopeId", "data-v-8d510691"]]);
+}), p = /* @__PURE__ */ J(ee, [["__scopeId", "data-v-f82cf3dc"]]);
 p.name = "TrFlowLayout";
 const te = function(d) {
   d.component(p.name, p);