@opentiny/tiny-robot 0.3.0-alpha.2 → 0.3.0-alpha.21

package/dist/container/index.js

@@ -1,60 +1,64 @@
-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 a } from "vue";
-import { l as h, w as $, s as C } from "../tiny-robot-svgs.js";
-import u from "../icon-button/index.js";
+import { defineComponent as g, mergeModels as c, useModel as u, computed as w, withDirectives as C, createElementBlock as B, openBlock as S, normalizeClass as y, createElementVNode as e, renderSlot as l, toDisplayString as I, createVNode as d, unref as i, vShow as z } from "vue";
+import { IconCancelFullScreen as $, IconFullScreen as k, IconClose as M } from "@opentiny/tiny-robot-svgs";
+import f 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({
+const E = { class: "tr-container__header" }, F = { class: "tr-container__title" }, N = { class: "tr-container__header-operations" }, T = { class: "tr-container__footer" }, D = /* @__PURE__ */ g({
   __name: "index",
-  props: {
+  props: /* @__PURE__ */ c({
+    show: { type: Boolean },
+    fullscreen: { type: Boolean },
+    title: { default: "OpenTiny NEXT" }
+  }, {
     show: { type: Boolean, required: !0 },
     showModifiers: {},
     fullscreen: { type: Boolean },
     fullscreenModifiers: {}
-  },
-  emits: ["update:show", "update:fullscreen"],
-  setup(o) {
-    v((t) => ({
-      "1daf37f2": s.value ? "0" : "unset",
-      "0679141a": s.value ? "unset" : "var(--tr-container-width)",
-      "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, [
-      e[3] || (e[3] = n("div", { class: "tr-container__dragging-bar-wrapper" }, [
-        n("div", { class: "tr-container__dragging-bar" })
+  }),
+  emits: /* @__PURE__ */ c(["close"], ["update:show", "update:fullscreen"]),
+  setup(o, { emit: p }) {
+    const m = o, a = u(o, "show"), t = u(o, "fullscreen"), v = w(() => t.value ? $ : k), _ = p, h = () => {
+      a.value = !1, _("close");
+    };
+    return (n, s) => C((S(), B("div", {
+      class: y(["tr-container", { fullscreen: t.value }])
+    }, [
+      s[1] || (s[1] = e("div", { class: "tr-container__dragging-bar-wrapper" }, [
+        e("div", { class: "tr-container__dragging-bar" })
       ], -1)),
-      n("div", B, [
-        r(t.$slots, "title", {}, () => [
-          e[2] || (e[2] = n("h3", { class: "tr-container__title" }, "OpenTiny NEXT", -1))
-        ]),
-        n("div", k, [
-          r(t.$slots, "operations"),
-          c(a(u), {
+      e("div", E, [
+        l(n.$slots, "title", {}, () => [
+          e("h3", F, I(m.title), 1)
+        ], !0),
+        e("div", N, [
+          l(n.$slots, "operations", {}, void 0, !0),
+          d(i(f), {
             size: "28",
             "svg-size": "20",
-            icon: f.value,
-            onClick: e[0] || (e[0] = (p) => t.$emit("update:fullscreen", !s.value))
+            icon: v.value,
+            onClick: s[0] || (s[0] = (q) => t.value = !t.value)
           }, null, 8, ["icon"]),
-          c(a(u), {
+          d(i(f), {
             size: "28",
             "svg-size": "20",
-            icon: a(C),
-            onClick: e[1] || (e[1] = (p) => t.$emit("update:show", !1))
+            icon: i(M),
+            onClick: h
           }, null, 8, ["icon"])
         ])
       ]),
-      r(t.$slots, "default"),
-      n("div", y, [
-        r(t.$slots, "footer")
+      l(n.$slots, "default", {}, void 0, !0),
+      e("div", T, [
+        l(n.$slots, "footer", {}, void 0, !0)
       ])
-    ]));
+    ], 2)), [
+      [z, a.value]
+    ]);
   }
-}), i = /* @__PURE__ */ b(E, [["__scopeId", "data-v-6a9b9126"]]);
-i.name = "TrContainer";
-const I = function(o) {
-  o.component(i.name, i);
+}), r = /* @__PURE__ */ b(D, [["__scopeId", "data-v-1ebfc5e5"]]);
+r.name = "TrContainer";
+const V = function(o) {
+  o.component(r.name, r);
 };
-i.install = I;
+r.install = V;
 export {
-  i as default
+  r as default
 };

package/dist/drag-overlay/index.js

@@ -0,0 +1,57 @@
+import { defineComponent as v, computed as y, createBlock as u, openBlock as t, Transition as F, withCtx as m, createElementBlock as o, createCommentVNode as h, normalizeStyle as _, normalizeClass as w, renderSlot as x, createElementVNode as l, toDisplayString as s, Fragment as D, renderList as B } from "vue";
+import { a as M } from "../index2.js";
+import { _ as Z } from "../_plugin-vue_export-helper.js";
+const k = "data:image/svg+xml,%3csvg%20width='80.000000'%20height='80.000000'%20viewBox='0%200%2080%2080'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cdefs/%3e%3crect%20width='80.000000'%20height='80.000000'%20fill='%23FFFFFF'%20fill-opacity='0'/%3e%3cpath%20d='M10%2014L70%2014C72.2%2014%2074%2015.79%2074%2018L74%2063C74%2065.2%2072.2%2067%2070%2067L10%2067C7.79%2067%206%2065.2%206%2063L6%2018C6%2015.79%207.79%2014%2010%2014Z'%20fill='%23FFFFFF'%20fill-opacity='1.000000'%20fill-rule='evenodd'/%3e%3cpath%20d='M10%2014L70%2014C72.2%2014%2074%2015.79%2074%2018L74%2063C74%2065.2%2072.2%2067%2070%2067L10%2067C7.79%2067%206%2065.2%206%2063L6%2018C6%2015.79%207.79%2014%2010%2014ZM10%2015L70%2015C71%2015%2071.75%2015.25%2072.25%2015.75C72.75%2016.25%2073%2017%2073%2018L73%2063C73%2064%2072.75%2064.75%2072.25%2065.25C71.75%2065.75%2071%2066%2070%2066L10%2066C9%2066%208.25%2065.75%207.75%2065.25C7.25%2064.75%207%2064%207%2063L7%2018C7%2017%207.25%2016.25%207.75%2015.75C8.25%2015.25%209%2015%2010%2015Z'%20fill='%23808080'%20fill-opacity='1.000000'%20fill-rule='evenodd'/%3e%3cpath%20d='M6%2047.27L24.56%2029.06C25.73%2027.91%2027.6%2027.91%2028.77%2029.06L44.52%2044.51C45.69%2045.66%2047.56%2045.66%2048.72%2044.51L56.64%2036.75C57.8%2035.6%2059.67%2035.6%2060.84%2036.75L74%2049.67L74%2062C74%2064.76%2071.76%2067%2069%2067L11%2067C8.23%2067%206%2064.76%206%2062L6%2047.27Z'%20fill='%23F0F0F0'%20fill-opacity='1.000000'%20fill-rule='evenodd'/%3e%3cpath%20d=''%20fill='%23808080'%20fill-opacity='0'%20fill-rule='evenodd'/%3e%3cellipse%20cx='40.000000'%20cy='40.000000'%20rx='8.000001'%20ry='8.000002'%20fill='%231476FF'%20fill-opacity='1.000000'/%3e%3cpath%20d='M40%2035.5C40.27%2035.5%2040.5%2035.72%2040.5%2036L40.5%2039.49L44%2039.5C44.27%2039.5%2044.5%2039.72%2044.5%2040C44.5%2040.27%2044.27%2040.5%2044%2040.5L40.5%2040.5L40.5%2044C40.5%2044.27%2040.27%2044.5%2040%2044.5C39.72%2044.5%2039.5%2044.27%2039.5%2044L39.5%2040.5L36%2040.5C35.72%2040.5%2035.5%2040.27%2035.5%2040C35.5%2039.72%2035.72%2039.5%2036%2039.5L39.5%2039.5L39.5%2036C39.5%2035.72%2039.72%2035.5%2040%2035.5Z'%20fill='%23FFFFFF'%20fill-opacity='1.000000'%20fill-rule='evenodd'/%3e%3cpath%20d='M10%2014L70%2014C72.2%2014%2074%2015.79%2074%2018L74%2063C74%2065.2%2072.2%2067%2070%2067L10%2067C7.79%2067%206%2065.2%206%2063L6%2018C6%2015.79%207.79%2014%2010%2014Z'%20fill='%23FFFFFF'%20fill-opacity='0'%20fill-rule='evenodd'/%3e%3cpath%20d='M10%2014L70%2014C72.2%2014%2074%2015.79%2074%2018L74%2063C74%2065.2%2072.2%2067%2070%2067L10%2067C7.79%2067%206%2065.2%206%2063L6%2018C6%2015.79%207.79%2014%2010%2014ZM10%2015L70%2015C71%2015%2071.75%2015.25%2072.25%2015.75C72.75%2016.25%2073%2017%2073%2018L73%2063C73%2064%2072.75%2064.75%2072.25%2065.25C71.75%2065.75%2071%2066%2070%2066L10%2066C9%2066%208.25%2065.75%207.75%2065.25C7.25%2064.75%207%2064%207%2063L7%2018C7%2017%207.25%2016.25%207.75%2015.75C8.25%2015.25%209%2015%2010%2015Z'%20fill='%23808080'%20fill-opacity='1.000000'%20fill-rule='evenodd'/%3e%3ccircle%20cx='58.000000'%20cy='27.000000'%20r='5.000000'%20fill='%23DBDBDB'%20fill-opacity='1.000000'/%3e%3c/svg%3e", T = { class: "tr-drag-overlay__content" }, $ = { class: "tr-drag-overlay__text" }, S = { class: "tr-drag-overlay__title" }, E = { class: "tr-drag-overlay__description" }, z = /* @__PURE__ */ v({
+  __name: "index",
+  props: {
+    overlayTitle: {},
+    overlayDescription: {},
+    isDragging: { type: Boolean },
+    dragTarget: {},
+    fullscreen: { type: Boolean }
+  },
+  setup(r) {
+    const a = r, { top: c, left: d, width: p, height: C } = M(() => a.dragTarget), f = y(() => !a.isDragging || !a.dragTarget ? { display: "none" } : {
+      position: "fixed",
+      top: `${c.value}px`,
+      left: `${d.value}px`,
+      width: `${p.value}px`,
+      height: `${C.value}px`
+    });
+    return (e, n) => (t(), u(F, { name: "tr-fade" }, {
+      default: m(() => [
+        e.isDragging ? (t(), o("div", {
+          key: 0,
+          class: w(["tr-drag-overlay", { fullscreen: e.fullscreen }]),
+          style: _(f.value)
+        }, [
+          x(e.$slots, "overlay", { isDragging: e.isDragging }, () => [
+            l("div", T, [
+              n[0] || (n[0] = l("div", { class: "tr-drag-overlay__icon" }, [
+                l("img", {
+                  src: k,
+                  alt: "上传文件"
+                })
+              ], -1)),
+              l("div", $, [
+                l("div", S, s(e.overlayTitle), 1),
+                l("div", E, [
+                  (t(!0), o(D, null, B(e.overlayDescription, (g, L) => (t(), o("span", { key: L }, s(g), 1))), 128))
+                ])
+              ])
+            ])
+          ], !0)
+        ], 6)) : h("", !0)
+      ]),
+      _: 3
+    }));
+  }
+}), i = /* @__PURE__ */ Z(z, [["__scopeId", "data-v-93553cc8"]]);
+i.name = "TrDragOverlay";
+const N = function(r) {
+  r.component(i.name, i);
+};
+i.install = N;
+export {
+  i as default
+};

package/dist/dropdown-menu/index.js

@@ -1,72 +1,159 @@
-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 { ref as k, onUnmounted as T, watch as C, defineComponent as E, mergeModels as y, useModel as H, computed as p, createBlock as I, openBlock as w, unref as X, withCtx as _, createElementVNode as j, createElementBlock as b, Fragment as D, renderList as L, toDisplayString as Y, renderSlot as O } from "vue";
+import { w as S, b as M, o as $ } from "../index2.js";
+import { B as A } from "../index3.js";
+import { u as F } from "../utils.js";
+import { _ as G } from "../_plugin-vue_export-helper.js";
+const P = (o, t) => o.x >= t.left && o.x <= t.right && o.y >= t.top && o.y <= t.bottom, N = (o, t, g = !1) => {
+  if (t.length < 3) return !1;
+  const l = o.x, d = o.y;
+  let f = !1;
+  const r = (s, c, a, n, i, e) => {
+    const m = (i - a) * (c - n) - (e - n) * (s - a);
+    if (Math.abs(m) > 1e-10) return !1;
+    const u = Math.min(a, i), h = Math.max(a, i), x = Math.min(n, e), B = Math.max(n, e);
+    return s >= u && s <= h && c >= x && c <= B;
+  };
+  for (let s = 0, c = t.length - 1; s < t.length; c = s++) {
+    const a = t[s].x, n = t[s].y, i = t[c].x, e = t[c].y;
+    if (g && r(l, d, a, n, i, e))
+      return !0;
+    if (n > d && e <= d || e > d && n <= d) {
+      const u = (i - a) * (d - n) / (e - n) + a;
+      l < u && (f = !f);
+    }
+  }
+  return f;
+}, U = (o, t) => t.bottom < o.top ? [
+  { x: o.left, y: o.top },
+  { x: o.right, y: o.top },
+  { x: t.right, y: t.bottom },
+  { x: t.left, y: t.bottom }
+] : t.top > o.bottom ? [
+  { x: o.left, y: o.bottom },
+  { x: o.right, y: o.bottom },
+  { x: t.right, y: t.top },
+  { x: t.left, y: t.top }
+] : [], { x: V, y: q } = F(), z = (o, t, g) => {
+  const { delayEnter: l = 0, delayLeave: d = 0 } = g || {}, f = k(!1), r = k("outside");
+  let s = null;
+  const c = () => {
+    s && (clearTimeout(s), s = null);
+  };
+  T(() => {
+    c();
+  });
+  const a = (n) => {
+    const i = n ? l : d;
+    c(), i ? s = setTimeout(() => f.value = n, i) : f.value = n;
+  };
+  return C(
+    r,
+    (n) => {
+      ["trigger", "popper", "polygon"].includes(n) ? a(!0) : a(!1);
+    },
+    { immediate: !0 }
+  ), S(
+    [V, q],
+    ([n, i]) => {
+      const e = M(o), m = M(t), u = e == null ? void 0 : e.getBoundingClientRect(), h = m == null ? void 0 : m.getBoundingClientRect();
+      if (u && P({ x: n, y: i }, u)) {
+        r.value = "trigger";
+        return;
+      }
+      if (h && P({ x: n, y: i }, h)) {
+        r.value = "popper";
+        return;
+      }
+      if (!u || !h || u.width === 0 || u.height === 0 || h.width === 0 || h.height === 0) {
+        r.value = "outside";
+        return;
+      }
+      N({ x: n, y: i }, U(u, h), !0) ? r.value = "polygon" : r.value = "outside";
+    },
+    { throttle: 10 }
+  ), f;
+}, J = { class: "tr-dropdown-menu__list" }, K = ["onClick"], Q = /* @__PURE__ */ E({
   __name: "index",
-  props: {
+  props: /* @__PURE__ */ y({
+    appendTo: {},
     items: {},
-    minWidth: { default: 160 },
-    topOffset: { default: 0 }
-  },
-  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();
+    show: { type: Boolean },
+    trigger: { default: "click" }
+  }, {
+    show: { type: Boolean, default: !1 },
+    showModifiers: {}
+  }),
+  emits: /* @__PURE__ */ y(["item-click", "click-outside"], ["update:show"]),
+  setup(o, { expose: t, emit: g }) {
+    const l = o, d = g, f = H(o, "show"), r = p({
+      get: () => l.trigger === "manual" ? l.show : f.value,
+      set: (e) => {
+        l.trigger !== "manual" && (f.value = e);
+      }
+    }), s = k(null), c = p(() => {
+      var e;
+      return (e = s.value) == null ? void 0 : e.triggerRef;
+    }), a = p(() => {
+      var e;
+      return (e = s.value) == null ? void 0 : e.popperRef;
     });
-    const R = () => {
-      t.value = !t.value;
-    }, V = (e) => {
-      t.value = !1, C("item-click", e);
+    if (l.trigger === "click" || l.trigger === "manual")
+      $(
+        a,
+        (e) => {
+          d("click-outside", e), r.value = !1;
+        },
+        { ignore: [c] }
+      );
+    else if (l.trigger === "hover") {
+      const e = z(c, a, { delayEnter: 100, delayLeave: 100 });
+      C(e, (m) => {
+        r.value = m;
+      });
+    }
+    const n = () => {
+      l.trigger === "click" && (r.value = !r.value);
+    }, i = (e) => {
+      r.value = !1, d("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 t({
+      update: () => {
+        var e;
+        (e = s.value) == null || e.update();
+      }
+    }), (e, m) => (w(), I(X(A), {
+      show: r.value,
+      class: "tr-dropdown-menu",
+      ref_key: "basePopperRef",
+      ref: s,
+      placement: "top-left",
+      "append-to": l.appendTo,
+      offset: 8,
+      "transition-props": { name: "tr-dropdown-menu" },
+      "prevent-overflow": !0,
+      "trigger-events": { onClick: n }
+    }, {
+      trigger: _(() => [
+        O(e.$slots, "trigger", {}, void 0, !0)
+      ]),
+      content: _(() => [
+        j("ul", J, [
+          (w(!0), b(D, null, L(l.items, (u) => (w(), b("li", {
+            class: "tr-dropdown-menu__list-item",
+            key: u.id,
+            onClick: (h) => i(u)
+          }, Y(u.text), 9, K))), 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);
+}), v = /* @__PURE__ */ G(Q, [["__scopeId", "data-v-8d480727"]]);
+v.name = "TrDropdownMenu";
+const W = function(o) {
+  o.component(v.name, v);
 };
-r.install = J;
+v.install = W;
 export {
-  r as default
+  v as default
 };