@schemavaults/ui 0.32.0 → 0.33.0
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/components/ui/chip/chip.js +3 -3
- package/dist/components/ui/chip/chip.js.map +1 -1
- package/dist/components/ui/index.d.ts +2 -0
- package/dist/components/ui/index.js +1 -0
- package/dist/components/ui/index.js.map +1 -1
- package/dist/components/ui/number-ticker/index.d.ts +4 -0
- package/dist/components/ui/number-ticker/index.js +3 -0
- package/dist/components/ui/number-ticker/index.js.map +1 -0
- package/dist/components/ui/number-ticker/number-ticker-variants.d.ts +4 -0
- package/dist/components/ui/number-ticker/number-ticker-variants.js +17 -0
- package/dist/components/ui/number-ticker/number-ticker-variants.js.map +1 -0
- package/dist/components/ui/number-ticker/number-ticker.d.ts +37 -0
- package/dist/components/ui/number-ticker/number-ticker.js +118 -0
- package/dist/components/ui/number-ticker/number-ticker.js.map +1 -0
- package/dist/framer-motion.d.ts +1 -1
- package/dist/framer-motion.js +1 -1
- package/dist/framer-motion.js.map +1 -1
- package/package.json +1 -1
|
@@ -17,9 +17,9 @@ const chipVariants = cva("group/chip inline-flex items-center gap-1.5 rounded-fu
|
|
|
17
17
|
outline: "bg-transparent text-foreground border-input data-[interactive=true]:hover:bg-accent data-[interactive=true]:hover:text-accent-foreground data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[selected=true]:border-foreground/40",
|
|
18
18
|
},
|
|
19
19
|
size: {
|
|
20
|
-
sm: "h-6 px-2 text-xs [
|
|
21
|
-
default: "h-7 px-2.5 text-xs [
|
|
22
|
-
lg: "h-9 px-3 text-sm [
|
|
20
|
+
sm: "h-6 px-2 text-xs [&_[data-slot=chip-leading]>svg]:size-3",
|
|
21
|
+
default: "h-7 px-2.5 text-xs [&_[data-slot=chip-leading]>svg]:size-3",
|
|
22
|
+
lg: "h-9 px-3 text-sm [&_[data-slot=chip-leading]>svg]:size-3.5",
|
|
23
23
|
},
|
|
24
24
|
disabled: {
|
|
25
25
|
true: "opacity-50 pointer-events-none",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../../../src/components/ui/chip/chip.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AACjC,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EACL,UAAU,GAOX,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EACL,WAAW,EACX,cAAc,GAGf,MAAM,iBAAiB,CAAC;AAEzB,MAAM,YAAY,GAAG,GAAG,CACtB,qUAAqU,EACrU;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EACL,iLAAiL;YACnL,OAAO,EACL,oKAAoK;YACtK,SAAS,EACP,qKAAqK;YACvK,WAAW,EACT,uOAAuO;YACzO,OAAO,EACL,4OAA4O;YAC9O,OAAO,EACL,sNAAsN;YACxN,OAAO,EACL,+PAA+P;SAC5N;QACvC,IAAI,EAAE;YACJ,EAAE,EAAE,
|
|
1
|
+
{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../../../src/components/ui/chip/chip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AAGzB,cAAc,aAAa,CAAC;AAG5B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAGxB,cAAc,mBAAmB,CAAC;AAGlC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,UAAU,CAAC;AAGzB,cAAc,SAAS,CAAC;AAGxB,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,kCAAkC,CAAC;AAGjD,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAExB,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,aAAa,CAAC;AAG5B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,WAAW,CAAC;AAG1B,cAAc,mBAAmB,CAAC;AAGlC,cAAc,UAAU,CAAC;AAGzB,cAAc,WAAW,CAAC;AAG1B,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AAGxB,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,YAAY,CAAC;AAG3B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,YAAY,CAAC;AAG3B,cAAc,2BAA2B,CAAC;AAG1C,cAAc,kBAAkB,CAAC;AAGjC,cAAc,gBAAgB,CAAC;AAG/B,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AAGnC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,UAAU,CAAC;AAGzB,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,cAAc,CAAC;AAG7B,cAAc,cAAc,CAAC;AAG7B,cAAc,OAAO,CAAC;AAGtB,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,QAAQ,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AAGzB,cAAc,aAAa,CAAC;AAG5B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAGxB,cAAc,mBAAmB,CAAC;AAGlC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,UAAU,CAAC;AAGzB,cAAc,SAAS,CAAC;AAGxB,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,kCAAkC,CAAC;AAGjD,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAExB,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,aAAa,CAAC;AAG5B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,WAAW,CAAC;AAG1B,cAAc,mBAAmB,CAAC;AAGlC,cAAc,UAAU,CAAC;AAGzB,cAAc,WAAW,CAAC;AAG1B,cAAc,WAAW,CAAC;AAG1B,cAAc,SAAS,CAAC;AAGxB,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,YAAY,CAAC;AAG3B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,YAAY,CAAC;AAG3B,cAAc,2BAA2B,CAAC;AAG1C,cAAc,kBAAkB,CAAC;AAGjC,cAAc,gBAAgB,CAAC;AAG/B,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AAGnC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,UAAU,CAAC;AAGzB,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,cAAc,CAAC;AAG7B,cAAc,cAAc,CAAC;AAG7B,cAAc,OAAO,CAAC;AAGtB,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,QAAQ,CAAC;AAGvB,cAAc,iBAAiB,CAAC"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { NumberTicker, NumberTicker as default, numberTickerVariants, } from "./number-ticker";
|
|
2
|
+
export type { NumberTickerProps, NumberTickerEase, } from "./number-ticker";
|
|
3
|
+
export { numberTickerVariantIds, numberTickerSizeIds, } from "./number-ticker-variants";
|
|
4
|
+
export type { NumberTickerVariant, NumberTickerSize, } from "./number-ticker-variants";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/number-ticker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EACZ,YAAY,IAAI,OAAO,EACvB,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AAKzB,OAAO,EACL,sBAAsB,EACtB,mBAAmB,GACpB,MAAM,0BAA0B,CAAC"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const numberTickerVariantIds: readonly ["default", "primary", "muted", "destructive", "warning", "success"];
|
|
2
|
+
export type NumberTickerVariant = (typeof numberTickerVariantIds)[number];
|
|
3
|
+
export declare const numberTickerSizeIds: readonly ["sm", "default", "lg", "xl", "2xl", "3xl"];
|
|
4
|
+
export type NumberTickerSize = (typeof numberTickerSizeIds)[number];
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export const numberTickerVariantIds = [
|
|
2
|
+
"default",
|
|
3
|
+
"primary",
|
|
4
|
+
"muted",
|
|
5
|
+
"destructive",
|
|
6
|
+
"warning",
|
|
7
|
+
"success",
|
|
8
|
+
];
|
|
9
|
+
export const numberTickerSizeIds = [
|
|
10
|
+
"sm",
|
|
11
|
+
"default",
|
|
12
|
+
"lg",
|
|
13
|
+
"xl",
|
|
14
|
+
"2xl",
|
|
15
|
+
"3xl",
|
|
16
|
+
];
|
|
17
|
+
//# sourceMappingURL=number-ticker-variants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"number-ticker-variants.js","sourceRoot":"","sources":["../../../../src/components/ui/number-ticker/number-ticker-variants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACpC,SAAS;IACT,SAAS;IACT,OAAO;IACP,aAAa;IACb,SAAS;IACT,SAAS;CAC2B,CAAC;AAGvC,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,IAAI;IACJ,SAAS;IACT,IAAI;IACJ,IAAI;IACJ,KAAK;IACL,KAAK;CAC+B,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { type VariantProps } from "class-variance-authority";
|
|
2
|
+
import { type ComponentProps, type ReactElement, type Ref } from "react";
|
|
3
|
+
declare const numberTickerVariants: (props?: ({
|
|
4
|
+
variant?: "default" | "destructive" | "warning" | "primary" | "muted" | "success" | null | undefined;
|
|
5
|
+
size?: "sm" | "default" | "lg" | "xl" | "2xl" | "3xl" | null | undefined;
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
|
+
export type NumberTickerEase = "linear" | "easeIn" | "easeOut" | "easeInOut" | "circIn" | "circOut" | "circInOut" | "backIn" | "backOut" | "backInOut" | "anticipate";
|
|
8
|
+
export interface NumberTickerProps extends Omit<ComponentProps<"span">, "children">, VariantProps<typeof numberTickerVariants> {
|
|
9
|
+
/** The target number to animate to. */
|
|
10
|
+
value: number;
|
|
11
|
+
/** The starting number for the animation. Defaults to `0`. */
|
|
12
|
+
from?: number;
|
|
13
|
+
/** Animation duration in seconds. Defaults to `1.5`. */
|
|
14
|
+
duration?: number;
|
|
15
|
+
/** Delay before the animation begins, in seconds. Defaults to `0`. */
|
|
16
|
+
delay?: number;
|
|
17
|
+
/** Number of decimal places to display. Defaults to `0`. */
|
|
18
|
+
decimals?: number;
|
|
19
|
+
/** String prepended to the formatted number (e.g. `$`). */
|
|
20
|
+
prefix?: string;
|
|
21
|
+
/** String appended to the formatted number (e.g. `%`). */
|
|
22
|
+
suffix?: string;
|
|
23
|
+
/** BCP-47 locale tag(s) used for `Intl.NumberFormat`. Defaults to `"en-US"`. */
|
|
24
|
+
locale?: string | string[];
|
|
25
|
+
/** Whether to use grouping separators (e.g. thousands commas). Defaults to `true`. */
|
|
26
|
+
useGrouping?: boolean;
|
|
27
|
+
/** When `true`, animation only starts once the element scrolls into the viewport. Defaults to `true`. */
|
|
28
|
+
startOnInView?: boolean;
|
|
29
|
+
/** Easing curve. Defaults to `"easeOut"`. */
|
|
30
|
+
ease?: NumberTickerEase;
|
|
31
|
+
ref?: Ref<HTMLSpanElement>;
|
|
32
|
+
}
|
|
33
|
+
export declare function NumberTicker({ value, from, duration, delay, decimals, prefix, suffix, locale, useGrouping, startOnInView, ease, variant, size, className, ref, ...props }: NumberTickerProps): ReactElement;
|
|
34
|
+
export declare namespace NumberTicker {
|
|
35
|
+
var displayName: string;
|
|
36
|
+
}
|
|
37
|
+
export { numberTickerVariants };
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
import { useCallback, useEffect, useMemo, useRef, } from "react";
|
|
5
|
+
import { animate, useMotionValue, useReducedMotion, } from "../../../framer-motion";
|
|
6
|
+
import { cn } from "../../../lib/utils";
|
|
7
|
+
const numberTickerVariants = cva("inline-block tabular-nums font-semibold tracking-tight", {
|
|
8
|
+
variants: {
|
|
9
|
+
variant: {
|
|
10
|
+
default: "text-foreground",
|
|
11
|
+
primary: "text-primary",
|
|
12
|
+
muted: "text-muted-foreground",
|
|
13
|
+
destructive: "text-destructive",
|
|
14
|
+
warning: "text-warning",
|
|
15
|
+
success: "text-emerald-600 dark:text-emerald-400",
|
|
16
|
+
},
|
|
17
|
+
size: {
|
|
18
|
+
sm: "text-sm",
|
|
19
|
+
default: "text-base",
|
|
20
|
+
lg: "text-lg",
|
|
21
|
+
xl: "text-2xl",
|
|
22
|
+
"2xl": "text-4xl",
|
|
23
|
+
"3xl": "text-6xl",
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
defaultVariants: {
|
|
27
|
+
variant: "default",
|
|
28
|
+
size: "default",
|
|
29
|
+
},
|
|
30
|
+
});
|
|
31
|
+
export function NumberTicker({ value, from = 0, duration = 1.5, delay = 0, decimals = 0, prefix = "", suffix = "", locale = "en-US", useGrouping = true, startOnInView = true, ease = "easeOut", variant, size, className, ref, ...props }) {
|
|
32
|
+
const prefersReducedMotion = useReducedMotion();
|
|
33
|
+
const motionValue = useMotionValue(from);
|
|
34
|
+
const innerRef = useRef(null);
|
|
35
|
+
const startedRef = useRef(false);
|
|
36
|
+
const formatter = useMemo(() => new Intl.NumberFormat(locale, {
|
|
37
|
+
minimumFractionDigits: decimals,
|
|
38
|
+
maximumFractionDigits: decimals,
|
|
39
|
+
useGrouping,
|
|
40
|
+
}), [locale, decimals, useGrouping]);
|
|
41
|
+
const format = useCallback((n) => `${prefix}${formatter.format(n)}${suffix}`, [formatter, prefix, suffix]);
|
|
42
|
+
const setRefs = useCallback((node) => {
|
|
43
|
+
innerRef.current = node;
|
|
44
|
+
if (typeof ref === "function") {
|
|
45
|
+
ref(node);
|
|
46
|
+
}
|
|
47
|
+
else if (ref) {
|
|
48
|
+
ref.current = node;
|
|
49
|
+
}
|
|
50
|
+
}, [ref]);
|
|
51
|
+
// Subscribe to motion value updates and write the formatted text into the
|
|
52
|
+
// span imperatively. This avoids re-rendering the React tree on every frame.
|
|
53
|
+
useEffect(() => {
|
|
54
|
+
const node = innerRef.current;
|
|
55
|
+
if (node) {
|
|
56
|
+
node.textContent = format(motionValue.get());
|
|
57
|
+
}
|
|
58
|
+
return motionValue.on("change", (latest) => {
|
|
59
|
+
const el = innerRef.current;
|
|
60
|
+
if (el) {
|
|
61
|
+
el.textContent = format(latest);
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
}, [motionValue, format]);
|
|
65
|
+
useEffect(() => {
|
|
66
|
+
if (prefersReducedMotion) {
|
|
67
|
+
motionValue.set(value);
|
|
68
|
+
startedRef.current = true;
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
const runAnimation = () => {
|
|
72
|
+
const controls = animate(motionValue, value, {
|
|
73
|
+
type: "tween",
|
|
74
|
+
duration,
|
|
75
|
+
delay,
|
|
76
|
+
ease,
|
|
77
|
+
});
|
|
78
|
+
return controls.stop;
|
|
79
|
+
};
|
|
80
|
+
if (startedRef.current || !startOnInView) {
|
|
81
|
+
startedRef.current = true;
|
|
82
|
+
return runAnimation();
|
|
83
|
+
}
|
|
84
|
+
const el = innerRef.current;
|
|
85
|
+
if (!el) {
|
|
86
|
+
startedRef.current = true;
|
|
87
|
+
return runAnimation();
|
|
88
|
+
}
|
|
89
|
+
let stopAnimation;
|
|
90
|
+
const observer = new IntersectionObserver((entries) => {
|
|
91
|
+
for (const entry of entries) {
|
|
92
|
+
if (entry.isIntersecting) {
|
|
93
|
+
startedRef.current = true;
|
|
94
|
+
observer.disconnect();
|
|
95
|
+
stopAnimation = runAnimation();
|
|
96
|
+
break;
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
}, { threshold: 0.1 });
|
|
100
|
+
observer.observe(el);
|
|
101
|
+
return () => {
|
|
102
|
+
observer.disconnect();
|
|
103
|
+
stopAnimation?.();
|
|
104
|
+
};
|
|
105
|
+
}, [
|
|
106
|
+
value,
|
|
107
|
+
duration,
|
|
108
|
+
delay,
|
|
109
|
+
ease,
|
|
110
|
+
prefersReducedMotion,
|
|
111
|
+
startOnInView,
|
|
112
|
+
motionValue,
|
|
113
|
+
]);
|
|
114
|
+
return (_jsx("span", { ref: setRefs, "data-slot": "number-ticker", "aria-label": format(value), className: cn(numberTickerVariants({ variant, size }), className), ...props, children: format(from) }));
|
|
115
|
+
}
|
|
116
|
+
NumberTicker.displayName = "NumberTicker";
|
|
117
|
+
export { numberTickerVariants };
|
|
118
|
+
//# sourceMappingURL=number-ticker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"number-ticker.js","sourceRoot":"","sources":["../../../../src/components/ui/number-ticker/number-ticker.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EACL,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,GAIP,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,OAAO,EACP,cAAc,EACd,gBAAgB,GACjB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAMjC,MAAM,oBAAoB,GAAG,GAAG,CAC9B,wDAAwD,EACxD;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,iBAAiB;YAC1B,OAAO,EAAE,cAAc;YACvB,KAAK,EAAE,uBAAuB;YAC9B,WAAW,EAAE,kBAAkB;YAC/B,OAAO,EAAE,cAAc;YACvB,OAAO,EAAE,wCAAwC;SACJ;QAC/C,IAAI,EAAE;YACJ,EAAE,EAAE,SAAS;YACb,OAAO,EAAE,WAAW;YACpB,EAAE,EAAE,SAAS;YACb,EAAE,EAAE,UAAU;YACd,KAAK,EAAE,UAAU;YACjB,KAAK,EAAE,UAAU;SACyB;KAC7C;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC;AA2CF,MAAM,UAAU,YAAY,CAAC,EAC3B,KAAK,EACL,IAAI,GAAG,CAAC,EACR,QAAQ,GAAG,GAAG,EACd,KAAK,GAAG,CAAC,EACT,QAAQ,GAAG,CAAC,EACZ,MAAM,GAAG,EAAE,EACX,MAAM,GAAG,EAAE,EACX,MAAM,GAAG,OAAO,EAChB,WAAW,GAAG,IAAI,EAClB,aAAa,GAAG,IAAI,EACpB,IAAI,GAAG,SAAS,EAChB,OAAO,EACP,IAAI,EACJ,SAAS,EACT,GAAG,EACH,GAAG,KAAK,EACU;IAClB,MAAM,oBAAoB,GAAG,gBAAgB,EAAE,CAAC;IAChD,MAAM,WAAW,GAAG,cAAc,CAAS,IAAI,CAAC,CAAC;IACjD,MAAM,QAAQ,GAAG,MAAM,CAAyB,IAAI,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,MAAM,CAAU,KAAK,CAAC,CAAC;IAE1C,MAAM,SAAS,GAAG,OAAO,CACvB,GAAG,EAAE,CACH,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE;QAC5B,qBAAqB,EAAE,QAAQ;QAC/B,qBAAqB,EAAE,QAAQ;QAC/B,WAAW;KACZ,CAAC,EACJ,CAAC,MAAM,EAAE,QAAQ,EAAE,WAAW,CAAC,CAChC,CAAC;IAEF,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,CAAS,EAAU,EAAE,CAAC,GAAG,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,EACjE,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,CAAC,CAC5B,CAAC;IAEF,MAAM,OAAO,GAAG,WAAW,CACzB,CAAC,IAA4B,EAAQ,EAAE;QACrC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;QACxB,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;YAC9B,GAAG,CAAC,IAAI,CAAC,CAAC;QACZ,CAAC;aAAM,IAAI,GAAG,EAAE,CAAC;YACd,GAA2C,CAAC,OAAO,GAAG,IAAI,CAAC;QAC9D,CAAC;IACH,CAAC,EACD,CAAC,GAAG,CAAC,CACN,CAAC;IAEF,0EAA0E;IAC1E,6EAA6E;IAC7E,SAAS,CAAC,GAAiB,EAAE;QAC3B,MAAM,IAAI,GAAG,QAAQ,CAAC,OAAO,CAAC;QAC9B,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC,CAAC;QAC/C,CAAC;QACD,OAAO,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,MAAc,EAAQ,EAAE;YACvD,MAAM,EAAE,GAAG,QAAQ,CAAC,OAAO,CAAC;YAC5B,IAAI,EAAE,EAAE,CAAC;gBACP,EAAE,CAAC,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;YAClC,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;IAE1B,SAAS,CAAC,GAAwB,EAAE;QAClC,IAAI,oBAAoB,EAAE,CAAC;YACzB,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;YACvB,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;YAC1B,OAAO;QACT,CAAC;QAED,MAAM,YAAY,GAAG,GAAiB,EAAE;YACtC,MAAM,QAAQ,GAAG,OAAO,CAAC,WAAW,EAAE,KAAK,EAAE;gBAC3C,IAAI,EAAE,OAAO;gBACb,QAAQ;gBACR,KAAK;gBACL,IAAI;aACL,CAAC,CAAC;YACH,OAAO,QAAQ,CAAC,IAAI,CAAC;QACvB,CAAC,CAAC;QAEF,IAAI,UAAU,CAAC,OAAO,IAAI,CAAC,aAAa,EAAE,CAAC;YACzC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;YAC1B,OAAO,YAAY,EAAE,CAAC;QACxB,CAAC;QAED,MAAM,EAAE,GAAG,QAAQ,CAAC,OAAO,CAAC;QAC5B,IAAI,CAAC,EAAE,EAAE,CAAC;YACR,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;YAC1B,OAAO,YAAY,EAAE,CAAC;QACxB,CAAC;QAED,IAAI,aAAuC,CAAC;QAC5C,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,OAAO,EAAQ,EAAE;YAChB,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;gBAC5B,IAAI,KAAK,CAAC,cAAc,EAAE,CAAC;oBACzB,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;oBAC1B,QAAQ,CAAC,UAAU,EAAE,CAAC;oBACtB,aAAa,GAAG,YAAY,EAAE,CAAC;oBAC/B,MAAM;gBACR,CAAC;YACH,CAAC;QACH,CAAC,EACD,EAAE,SAAS,EAAE,GAAG,EAAE,CACnB,CAAC;QACF,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;QAErB,OAAO,GAAS,EAAE;YAChB,QAAQ,CAAC,UAAU,EAAE,CAAC;YACtB,aAAa,EAAE,EAAE,CAAC;QACpB,CAAC,CAAC;IACJ,CAAC,EAAE;QACD,KAAK;QACL,QAAQ;QACR,KAAK;QACL,IAAI;QACJ,oBAAoB;QACpB,aAAa;QACb,WAAW;KACZ,CAAC,CAAC;IAEH,OAAO,CACL,eACE,GAAG,EAAE,OAAO,eACF,eAAe,gBACb,MAAM,CAAC,KAAK,CAAC,EACzB,SAAS,EAAE,EAAE,CAAC,oBAAoB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,KAC7D,KAAK,YAER,MAAM,CAAC,IAAI,CAAC,GACR,CACR,CAAC;AACJ,CAAC;AACD,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;AAE1C,OAAO,EAAE,oBAAoB,EAAE,CAAC"}
|
package/dist/framer-motion.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { m, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
1
|
+
export { m, animate, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
2
2
|
export type { MotionValue, AnimationScope } from "framer-motion";
|
package/dist/framer-motion.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
export { m, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
2
|
+
export { m, animate, AnimatePresence, domAnimation, LazyMotion, useAnimate, useAnimationFrame, useTransform, useMotionValue, usePresence, useScroll, useMotionValueEvent, useReducedMotion, } from "framer-motion";
|
|
3
3
|
//# sourceMappingURL=framer-motion.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"framer-motion.js","sourceRoot":"","sources":["../src/framer-motion.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EACL,CAAC,EACD,eAAe,EACf,YAAY,EACZ,UAAU,EACV,UAAU,EACV,iBAAiB,EACjB,YAAY,EACZ,cAAc,EACd,WAAW,EACX,SAAS,EACT,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,eAAe,CAAC"}
|
|
1
|
+
{"version":3,"file":"framer-motion.js","sourceRoot":"","sources":["../src/framer-motion.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EACL,CAAC,EACD,OAAO,EACP,eAAe,EACf,YAAY,EACZ,UAAU,EACV,UAAU,EACV,iBAAiB,EACjB,YAAY,EACZ,cAAc,EACd,WAAW,EACX,SAAS,EACT,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,eAAe,CAAC"}
|