@number-flow/vue 0.2.5 → 0.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/index.mjs +29 -29
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),n=require("number-flow"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),n=require("number-flow"),v=require("esm-env"),c=Symbol(),g=e.defineComponent({__name:"NumberFlowGroup",setup(o){const l=new Set;let r=!1;const a=(i,s)=>{l.add(i),e.watch(s,async()=>{r||(r=!0,l.forEach(async t=>{var m;!t.value||!t.value.created||(t.value.willUpdate(),await e.nextTick(),(m=t.value)==null||m.didUpdate())}),await e.nextTick(),r=!1)}),e.onUnmounted(()=>{l.delete(i)})};return e.provide(c,a),(i,s)=>e.renderSlot(i.$slots,"default")}}),w=["aria-label","manual","trend","continuous","animated","transformTiming","spinTiming","opacityTiming","respectMotionPreference","data-will-change","innerHTML","data"],b=e.defineComponent({inheritAttrs:!1,__name:"index",props:{transformTiming:{default:()=>n.NumberFlowLite.defaultProps.transformTiming},spinTiming:{default:()=>n.NumberFlowLite.defaultProps.spinTiming},opacityTiming:{default:()=>n.NumberFlowLite.defaultProps.opacityTiming},animated:{type:Boolean,default:()=>n.NumberFlowLite.defaultProps.animated},respectMotionPreference:{type:Boolean,default:()=>n.NumberFlowLite.defaultProps.respectMotionPreference},trend:{type:[Boolean,String],default:()=>n.NumberFlowLite.defaultProps.trend},continuous:{type:Boolean,default:()=>n.NumberFlowLite.defaultProps.continuous},locales:{},format:{},value:{},prefix:{},suffix:{},willChange:{type:Boolean,default:!1}},emits:["animationsstart","animationsfinish"],setup(o,{expose:l,emit:r}){const a=e.ref();l({el:a});const i=r,s=e.computed(()=>new Intl.NumberFormat(o.locales,o.format)),t=e.computed(()=>n.formatToData(o.value,s.value,o.prefix,o.suffix)),m=v.BROWSER?void 0:n.renderInnerHTML(t.value),d=e.inject(c,void 0);return d==null||d(a,t),(u,f)=>(e.openBlock(),e.createElementBlock("number-flow-vue",e.mergeProps({ref_key:"el",ref:a,"aria-label":t.value.valueAsString},u.$attrs,{role:"img",manual:!!e.unref(d),trend:u.trend,continuous:u.continuous,animated:u.animated,transformTiming:u.transformTiming,spinTiming:u.spinTiming,opacityTiming:u.opacityTiming,respectMotionPreference:u.respectMotionPreference,"data-will-change":u.willChange?"":void 0,innerHTML:e.unref(m),"data-allow-mismatch":"",onAnimationsstart:f[0]||(f[0]=p=>i("animationsstart")),onAnimationsfinish:f[1]||(f[1]=p=>i("animationsfinish")),data:t.value}),null,16,w))}});n.define("number-flow-vue",n.NumberFlowLite);function T({respectMotionPreference:o=!0}={}){const l=e.ref(n.canAnimate),r=e.ref(!1);return e.onMounted(()=>{var a;l.value=n.canAnimate,r.value=((a=n.prefersReducedMotion)==null?void 0:a.matches)??!1}),e.watchEffect(a=>{var s;if(!e.toValue(o))return;const i=({matches:t})=>{r.value=t};(s=n.prefersReducedMotion)==null||s.addEventListener("change",i),a(()=>{var t;(t=n.prefersReducedMotion)==null||t.removeEventListener("change",i)})}),e.computed(()=>l.value&&(!e.toValue(o)||!r.value))}Object.defineProperty(exports,"NumberFlowElement",{enumerable:!0,get:()=>n.NumberFlowLite});exports.NumberFlowGroup=g;exports.default=b;exports.useCanAnimate=T;
|
package/dist/index.mjs
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { NumberFlowLite as l, formatToData as
|
|
3
|
-
import { NumberFlowLite as
|
|
4
|
-
import { BROWSER as
|
|
5
|
-
const
|
|
1
|
+
import { defineComponent as w, provide as b, renderSlot as M, watch as B, nextTick as g, onUnmounted as A, ref as c, computed as p, inject as E, openBlock as L, createElementBlock as F, mergeProps as N, unref as v, onMounted as S, watchEffect as $, toValue as T } from "vue";
|
|
2
|
+
import { NumberFlowLite as l, formatToData as k, renderInnerHTML as C, define as G, canAnimate as h, prefersReducedMotion as d } from "number-flow";
|
|
3
|
+
import { NumberFlowLite as q } from "number-flow";
|
|
4
|
+
import { BROWSER as H } from "esm-env";
|
|
5
|
+
const y = Symbol(), j = /* @__PURE__ */ w({
|
|
6
6
|
__name: "NumberFlowGroup",
|
|
7
7
|
setup(t) {
|
|
8
8
|
const r = /* @__PURE__ */ new Set();
|
|
9
9
|
let a = !1;
|
|
10
|
-
return
|
|
11
|
-
r.add(n),
|
|
10
|
+
return b(y, (n, s) => {
|
|
11
|
+
r.add(n), B(
|
|
12
12
|
s,
|
|
13
13
|
async () => {
|
|
14
14
|
a || (a = !0, r.forEach(async (e) => {
|
|
@@ -17,12 +17,12 @@ const w = Symbol(), I = /* @__PURE__ */ h({
|
|
|
17
17
|
}), await g(), a = !1);
|
|
18
18
|
}
|
|
19
19
|
// { flush: 'pre' } // default
|
|
20
|
-
),
|
|
20
|
+
), A(() => {
|
|
21
21
|
r.delete(n);
|
|
22
22
|
});
|
|
23
|
-
}), (n, s) =>
|
|
23
|
+
}), (n, s) => M(n.$slots, "default");
|
|
24
24
|
}
|
|
25
|
-
}),
|
|
25
|
+
}), R = ["aria-label", "manual", "trend", "continuous", "animated", "transformTiming", "spinTiming", "opacityTiming", "respectMotionPreference", "data-will-change", "innerHTML", "data"], x = /* @__PURE__ */ w({
|
|
26
26
|
inheritAttrs: !1,
|
|
27
27
|
__name: "index",
|
|
28
28
|
props: {
|
|
@@ -44,14 +44,14 @@ const w = Symbol(), I = /* @__PURE__ */ h({
|
|
|
44
44
|
setup(t, { expose: r, emit: a }) {
|
|
45
45
|
const i = c();
|
|
46
46
|
r({ el: i });
|
|
47
|
-
const n = a, s = p(() => new Intl.NumberFormat(t.locales, t.format)), e = p(() =>
|
|
48
|
-
return
|
|
47
|
+
const n = a, s = p(() => new Intl.NumberFormat(t.locales, t.format)), e = p(() => k(t.value, s.value, t.prefix, t.suffix)), u = H ? void 0 : C(e.value), m = E(y, void 0);
|
|
48
|
+
return m == null || m(i, e), (o, f) => (L(), F("number-flow-vue", N({
|
|
49
49
|
ref_key: "el",
|
|
50
50
|
ref: i,
|
|
51
51
|
"aria-label": e.value.valueAsString
|
|
52
52
|
}, o.$attrs, {
|
|
53
53
|
role: "img",
|
|
54
|
-
manual: !!
|
|
54
|
+
manual: !!v(m),
|
|
55
55
|
trend: o.trend,
|
|
56
56
|
continuous: o.continuous,
|
|
57
57
|
animated: o.animated,
|
|
@@ -60,25 +60,25 @@ const w = Symbol(), I = /* @__PURE__ */ h({
|
|
|
60
60
|
opacityTiming: o.opacityTiming,
|
|
61
61
|
respectMotionPreference: o.respectMotionPreference,
|
|
62
62
|
"data-will-change": o.willChange ? "" : void 0,
|
|
63
|
-
innerHTML:
|
|
63
|
+
innerHTML: v(u),
|
|
64
64
|
"data-allow-mismatch": "",
|
|
65
|
-
onAnimationsstart:
|
|
66
|
-
onAnimationsfinish:
|
|
65
|
+
onAnimationsstart: f[0] || (f[0] = (P) => n("animationsstart")),
|
|
66
|
+
onAnimationsfinish: f[1] || (f[1] = (P) => n("animationsfinish")),
|
|
67
67
|
data: e.value
|
|
68
|
-
}), null, 16,
|
|
68
|
+
}), null, 16, R));
|
|
69
69
|
}
|
|
70
70
|
});
|
|
71
|
-
|
|
72
|
-
function
|
|
71
|
+
G("number-flow-vue", l);
|
|
72
|
+
function D({
|
|
73
73
|
respectMotionPreference: t = !0
|
|
74
74
|
} = {}) {
|
|
75
|
-
const r = c(
|
|
76
|
-
return
|
|
75
|
+
const r = c(h), a = c(!1);
|
|
76
|
+
return S(() => {
|
|
77
77
|
var i;
|
|
78
|
-
r.value =
|
|
79
|
-
}),
|
|
78
|
+
r.value = h, a.value = ((i = d) == null ? void 0 : i.matches) ?? !1;
|
|
79
|
+
}), $((i) => {
|
|
80
80
|
var s;
|
|
81
|
-
if (!
|
|
81
|
+
if (!T(t)) return;
|
|
82
82
|
const n = ({ matches: e }) => {
|
|
83
83
|
a.value = e;
|
|
84
84
|
};
|
|
@@ -87,12 +87,12 @@ function x({
|
|
|
87
87
|
(e = d) == null || e.removeEventListener("change", n);
|
|
88
88
|
});
|
|
89
89
|
}), p(
|
|
90
|
-
() => r.value && (!
|
|
90
|
+
() => r.value && (!T(t) || !a.value)
|
|
91
91
|
);
|
|
92
92
|
}
|
|
93
93
|
export {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
94
|
+
q as NumberFlowElement,
|
|
95
|
+
j as NumberFlowGroup,
|
|
96
|
+
x as default,
|
|
97
|
+
D as useCanAnimate
|
|
98
98
|
};
|