geekin-devtoys 0.0.3 → 0.0.4

package/lib/Demo/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("vue"),a=(e,s)=>{const o=e.__vccOpts||e;for(const[c,r]of s)o[c]=r;return o},_={class:"demo"},i=Object.assign({name:"Demo"},{__name:"index",props:{msg:String},setup(e){return(s,o)=>(n.openBlock(),n.createElementBlock("div",_,n.toDisplayString(e.msg),1))}}),t=a(i,[["__scopeId","data-v-bd7af65f"]]);t.install=e=>{e.component(t.name,t)};exports.Demo=t;exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("vue"),n=require("../_plugin-vue_export-helper-BHFhmbuH.js"),s={class:"demo"},r=Object.assign({name:"Demo"},{__name:"index",props:{msg:String},setup(t){return(c,a)=>(o.openBlock(),o.createElementBlock("div",s,o.toDisplayString(t.msg),1))}}),e=n._export_sfc(r,[["__scopeId","data-v-bd7af65f"]]);e.install=t=>{t.component(e.name,e)};exports.Demo=e;exports.default=e;

package/lib/Demo/index.mjs

@@ -1,24 +1,20 @@
-import { createElementBlock as a, openBlock as r, toDisplayString as _ } from "vue";
-const m = (t, n) => {
-  const e = t.__vccOpts || t;
-  for (const [s, c] of n)
-    e[s] = c;
-  return e;
-}, p = { class: "demo" }, i = /* @__PURE__ */ Object.assign({
+import { createElementBlock as o, openBlock as s, toDisplayString as n } from "vue";
+import { _ as a } from "../_plugin-vue_export-helper-CHgC5LLL.mjs";
+const c = { class: "demo" }, m = /* @__PURE__ */ Object.assign({
   name: "Demo"
 }, {
   __name: "index",
   props: {
     msg: String
   },
-  setup(t) {
-    return (n, e) => (r(), a("div", p, _(t.msg), 1));
+  setup(e) {
+    return (r, _) => (s(), o("div", c, n(e.msg), 1));
   }
-}), o = /* @__PURE__ */ m(i, [["__scopeId", "data-v-bd7af65f"]]);
-o.install = (t) => {
-  t.component(o.name, o);
+}), t = /* @__PURE__ */ a(m, [["__scopeId", "data-v-bd7af65f"]]);
+t.install = (e) => {
+  e.component(t.name, t);
 };
 export {
-  o as Demo,
-  o as default
+  t as Demo,
+  t as default
 };

package/lib/GPercent/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),S=require("../_plugin-vue_export-helper-BHFhmbuH.js"),E="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3csvg%20version='1.1'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='11px'%20height='12px'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20transform='matrix(1%200%200%201%20-1755%20-466%20)'%3e%3cpath%20d='M%201755.77886671114%20477.5%20L%201760.5%20467.199345551568%20L%201765.22113328886%20477.5%20L%201755.77886671114%20477.5%20Z%20'%20fill-rule='nonzero'%20fill='%23fa3239'%20stroke='none'%20/%3e%3cpath%20d='M%201755%20478%20L%201760.5%20466%20L%201766%20478%20L%201755%20478%20Z%20M%201760.5%20468.398691103136%20L%201756.55773342227%20477%20L%201764.44226657773%20477%20L%201760.5%20468.398691103136%20Z%20'%20fill-rule='nonzero'%20fill='%23797979'%20stroke='none'%20/%3e%3c/g%3e%3c/svg%3e",V="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3csvg%20version='1.1'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='11px'%20height='12px'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20transform='matrix(1%200%200%201%20-1755%20-304%20)'%3e%3cpath%20d='M%201755.77886671114%20315.5%20L%201760.5%20305.199345551568%20L%201765.22113328886%20315.5%20L%201755.77886671114%20315.5%20Z%20'%20fill-rule='nonzero'%20fill='%232ce534'%20stroke='none'%20/%3e%3cpath%20d='M%201755%20316%20L%201760.5%20304%20L%201766%20316%20L%201755%20316%20Z%20M%201760.5%20306.398691103136%20L%201756.55773342227%20315%20L%201764.44226657773%20315%20L%201760.5%20306.398691103136%20Z%20'%20fill-rule='nonzero'%20fill='%23797979'%20stroke='none'%20/%3e%3c/g%3e%3c/svg%3e",N={class:"g-percent-symbol-updown"},P={src:E,alt:"down",style:{transform:"rotate(180deg)"},class:"g-percent-svg"},z={src:V,alt:"up",class:"g-percent-svg"},F=t.defineComponent({name:"GPercent",__name:"index",props:{to:{},from:{default:0},direction:{default:""},delay:{default:0},duration:{default:2},className:{default:""},startWhen:{type:Boolean,default:!0},decimalPlaces:{default:0},onStart:{},onEnd:{}},setup(d){const e=d,m=t.useTemplateRef("elementRef"),n=t.ref(e.direction==="down"?e.to:e.from),c=t.ref(!1),o=t.ref(null),u=t.ref(!1);let r=null;const g=t.computed(()=>20+40*(1/e.duration)),w=t.computed(()=>200*(1/e.duration));let a=0;const p=l=>{const s=e.direction==="down"?e.from:e.to,_=n.value,f=s-_,L=f*w.value,b=a*g.value,M=L-b;a+=M*.016,n.value+=a*.016,n.value=Math.max(0,Math.min(100,n.value));const y=Math.pow(10,-e.decimalPlaces)*.1,k=Math.pow(10,-e.decimalPlaces)*.1;Math.abs(f)>y||Math.abs(a)>k?o.value=requestAnimationFrame(p):(n.value=s,o.value=null,e.onEnd&&e.onEnd())},v=()=>{u.value||!c.value||!e.startWhen||(u.value=!0,e.onStart&&e.onStart(),setTimeout(()=>{a=0,o.value=requestAnimationFrame(p)},e.delay*1e3))},h=()=>{m.value&&(r=new IntersectionObserver(([l])=>{l.isIntersecting&&!c.value&&(c.value=!0,v())},{threshold:0,rootMargin:"0px"}),r.observe(m.value))},x=()=>{o.value&&(cancelAnimationFrame(o.value),o.value=null),r&&(r.disconnect(),r=null)};return t.watch([()=>e.from,()=>e.to,()=>e.direction],()=>{n.value=e.direction==="down"?e.to:e.from,u.value=!1},{immediate:!0}),t.watch(()=>e.startWhen,()=>{e.startWhen&&c.value&&!u.value&&v()}),t.onMounted(async()=>{await t.nextTick(),h()}),t.onUnmounted(()=>{x()}),(l,s)=>(t.openBlock(),t.createElementBlock("div",{ref_key:"elementRef",ref:m,class:t.normalizeClass([l.className,"g-percent-container"])},[t.createElementVNode("div",N,[t.withDirectives(t.createElementVNode("img",P,null,512),[[t.vShow,e.direction==="down"]]),t.withDirectives(t.createElementVNode("img",z,null,512),[[t.vShow,e.direction==="up"]])]),t.createElementVNode("span",{class:t.normalizeClass(["g-percent-number",{"g-percent-number-down":e.direction==="down","g-percent-number-up":e.direction==="up"}])},t.toDisplayString(n.value.toFixed(e.decimalPlaces)),3),t.createElementVNode("div",{class:t.normalizeClass(["g-percent-symbol",{"g-percent-number-down":e.direction==="down","g-percent-number-up":e.direction==="up"}])},[t.renderSlot(l.$slots,"symbol",{},()=>[s[0]||(s[0]=t.createTextVNode("%"))],!0)],2)],2))}}),i=S._export_sfc(F,[["__scopeId","data-v-33634690"]]);i.install=d=>{d.component(i.name,i)};exports.GPercent=i;exports.default=i;

package/lib/GPercent/index.mjs

@@ -0,0 +1,101 @@
+import { defineComponent as A, useTemplateRef as E, ref as u, computed as h, watch as x, onMounted as T, nextTick as N, onUnmounted as R, createElementBlock as V, openBlock as W, normalizeClass as p, createElementVNode as l, withDirectives as L, vShow as _, toDisplayString as B, renderSlot as O, createTextVNode as q } from "vue";
+import { _ as C } from "../_plugin-vue_export-helper-CHgC5LLL.mjs";
+const D = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3csvg%20version='1.1'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='11px'%20height='12px'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20transform='matrix(1%200%200%201%20-1755%20-466%20)'%3e%3cpath%20d='M%201755.77886671114%20477.5%20L%201760.5%20467.199345551568%20L%201765.22113328886%20477.5%20L%201755.77886671114%20477.5%20Z%20'%20fill-rule='nonzero'%20fill='%23fa3239'%20stroke='none'%20/%3e%3cpath%20d='M%201755%20478%20L%201760.5%20466%20L%201766%20478%20L%201755%20478%20Z%20M%201760.5%20468.398691103136%20L%201756.55773342227%20477%20L%201764.44226657773%20477%20L%201760.5%20468.398691103136%20Z%20'%20fill-rule='nonzero'%20fill='%23797979'%20stroke='none'%20/%3e%3c/g%3e%3c/svg%3e", G = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3csvg%20version='1.1'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='11px'%20height='12px'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20transform='matrix(1%200%200%201%20-1755%20-304%20)'%3e%3cpath%20d='M%201755.77886671114%20315.5%20L%201760.5%20305.199345551568%20L%201765.22113328886%20315.5%20L%201755.77886671114%20315.5%20Z%20'%20fill-rule='nonzero'%20fill='%232ce534'%20stroke='none'%20/%3e%3cpath%20d='M%201755%20316%20L%201760.5%20304%20L%201766%20316%20L%201755%20316%20Z%20M%201760.5%20306.398691103136%20L%201756.55773342227%20315%20L%201764.44226657773%20315%20L%201760.5%20306.398691103136%20Z%20'%20fill-rule='nonzero'%20fill='%23797979'%20stroke='none'%20/%3e%3c/g%3e%3c/svg%3e", U = { class: "g-percent-symbol-updown" }, $ = {
+  src: D,
+  alt: "down",
+  style: { transform: "rotate(180deg)" },
+  class: "g-percent-svg"
+}, j = {
+  src: G,
+  alt: "up",
+  class: "g-percent-svg"
+}, H = /* @__PURE__ */ A({
+  name: "GPercent",
+  __name: "index",
+  props: {
+    to: {},
+    from: { default: 0 },
+    direction: { default: "" },
+    delay: { default: 0 },
+    duration: { default: 2 },
+    className: { default: "" },
+    startWhen: { type: Boolean, default: !0 },
+    decimalPlaces: { default: 0 },
+    onStart: {},
+    onEnd: {}
+  },
+  setup(d) {
+    const e = d, m = E("elementRef"), t = u(e.direction === "down" ? e.to : e.from), i = u(!1), n = u(null), c = u(!1);
+    let o = null;
+    const b = h(() => 20 + 40 * (1 / e.duration)), M = h(() => 200 * (1 / e.duration));
+    let r = 0;
+    const v = (a) => {
+      const s = e.direction === "down" ? e.from : e.to, S = t.value, w = s - S, F = w * M.value, I = r * b.value, P = F - I;
+      r += P * 0.016, t.value += r * 0.016, t.value = Math.max(0, Math.min(100, t.value));
+      const Z = Math.pow(10, -e.decimalPlaces) * 0.1, z = Math.pow(10, -e.decimalPlaces) * 0.1;
+      Math.abs(w) > Z || Math.abs(r) > z ? n.value = requestAnimationFrame(v) : (t.value = s, n.value = null, e.onEnd && e.onEnd());
+    }, g = () => {
+      c.value || !i.value || !e.startWhen || (c.value = !0, e.onStart && e.onStart(), setTimeout(() => {
+        r = 0, n.value = requestAnimationFrame(v);
+      }, e.delay * 1e3));
+    }, k = () => {
+      m.value && (o = new IntersectionObserver(
+        ([a]) => {
+          a.isIntersecting && !i.value && (i.value = !0, g());
+        },
+        {
+          threshold: 0,
+          rootMargin: "0px"
+        }
+      ), o.observe(m.value));
+    }, y = () => {
+      n.value && (cancelAnimationFrame(n.value), n.value = null), o && (o.disconnect(), o = null);
+    };
+    return x(
+      [() => e.from, () => e.to, () => e.direction],
+      () => {
+        t.value = e.direction === "down" ? e.to : e.from, c.value = !1;
+      },
+      { immediate: !0 }
+    ), x(
+      () => e.startWhen,
+      () => {
+        e.startWhen && i.value && !c.value && g();
+      }
+    ), T(async () => {
+      await N(), k();
+    }), R(() => {
+      y();
+    }), (a, s) => (W(), V("div", {
+      ref_key: "elementRef",
+      ref: m,
+      class: p([a.className, "g-percent-container"])
+    }, [
+      l("div", U, [
+        L(l("img", $, null, 512), [
+          [_, e.direction === "down"]
+        ]),
+        L(l("img", j, null, 512), [
+          [_, e.direction === "up"]
+        ])
+      ]),
+      l("span", {
+        class: p(["g-percent-number", { "g-percent-number-down": e.direction === "down", "g-percent-number-up": e.direction === "up" }])
+      }, B(t.value.toFixed(e.decimalPlaces)), 3),
+      l("div", {
+        class: p(["g-percent-symbol", { "g-percent-number-down": e.direction === "down", "g-percent-number-up": e.direction === "up" }])
+      }, [
+        O(a.$slots, "symbol", {}, () => [
+          s[0] || (s[0] = q("%"))
+        ], !0)
+      ], 2)
+    ], 2));
+  }
+}), f = /* @__PURE__ */ C(H, [["__scopeId", "data-v-33634690"]]);
+f.install = (d) => {
+  d.component(f.name, f);
+};
+export {
+  f as GPercent,
+  f as default
+};

package/lib/GPercent/style.css

@@ -0,0 +1 @@
+.g-percent-container[data-v-33634690]{display:inline-flex;align-items:center;justify-content:center}.g-percent-number-down[data-v-33634690]{color:#ff4d4f}.g-percent-number-up[data-v-33634690]{color:#52c41a}.g-percent-svg[data-v-33634690]{width:8px;height:8px}

package/lib/_plugin-vue_export-helper-BHFhmbuH.js

@@ -0,0 +1 @@
+"use strict";const e=(t,o)=>{const c=t.__vccOpts||t;for(const[r,s]of o)c[r]=s;return c};exports._export_sfc=e;

package/lib/_plugin-vue_export-helper-CHgC5LLL.mjs

@@ -0,0 +1,9 @@
+const s = (t, r) => {
+  const o = t.__vccOpts || t;
+  for (const [c, e] of r)
+    o[c] = e;
+  return o;
+};
+export {
+  s as _
+};

package/lib/index/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("../Demo/index.js"),n=require("../GCount/index.js"),t={Demo:o.default,GCount:n.default},s=u=>{Object.keys(t).forEach(c=>{const e=t[c];u.component(e.name,e)})},l={install:s};exports.Demo=o.default;exports.GCount=n.default;exports.default=l;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("../Demo/index.js"),n=require("../GCount/index.js"),u=require("../GPercent/index.js"),t={Demo:o.default,GCount:n.default,GPercent:u.default},l=c=>{Object.keys(t).forEach(r=>{const e=t[r];c.component(e.name,e)})},s={install:l};exports.Demo=o.default;exports.GCount=n.default;exports.GPercent=u.default;exports.default=s;

package/lib/index/index.mjs

@@ -1,13 +1,15 @@
-import e from "../Demo/index.mjs";
-import m from "../GCount/index.mjs";
-const n = { Demo: e, GCount: m }, s = (t) => {
-  Object.keys(n).forEach((c) => {
-    const o = n[c];
+import m from "../Demo/index.mjs";
+import c from "../GCount/index.mjs";
+import s from "../GPercent/index.mjs";
+const n = { Demo: m, GCount: c, GPercent: s }, r = (t) => {
+  Object.keys(n).forEach((e) => {
+    const o = n[e];
     t.component(o.name, o);
   });
-}, r = { install: s };
+}, i = { install: r };
 export {
-  e as Demo,
-  m as GCount,
-  r as default
+  m as Demo,
+  c as GCount,
+  s as GPercent,
+  i as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "geekin-devtoys",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "author": "leon",
   "license": "MIT",
   "description": "geekin-devtoys组件库",
@@ -50,6 +50,14 @@
     "./GCount/style": {
       "import": "./lib/GCount/style.css",
       "require": "./lib/GCount/style.css"
+    },
+    "./GPercent": {
+      "import": "./lib/GPercent/index.mjs",
+      "require": "./lib/GPercent/index.js"
+    },
+    "./GPercent/style": {
+      "import": "./lib/GPercent/style.css",
+      "require": "./lib/GPercent/style.css"
     }
   }
 }