@dailyautomations/ui 1.0.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/BRAND.md +543 -0
- package/README.md +136 -0
- package/dist/components/alert.d.ts +12 -0
- package/dist/components/alert.d.ts.map +1 -0
- package/dist/components/alert.js +27 -0
- package/dist/components/alert.js.map +1 -0
- package/dist/components/badge.d.ts +11 -0
- package/dist/components/badge.d.ts.map +1 -0
- package/dist/components/badge.js +25 -0
- package/dist/components/badge.js.map +1 -0
- package/dist/components/button.d.ts +13 -0
- package/dist/components/button.d.ts.map +1 -0
- package/dist/components/button.js +32 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/card.d.ts +9 -0
- package/dist/components/card.d.ts.map +1 -0
- package/dist/components/card.js +22 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/common/badge.d.ts +11 -0
- package/dist/components/common/badge.d.ts.map +1 -0
- package/dist/components/common/badge.js +25 -0
- package/dist/components/common/badge.js.map +1 -0
- package/dist/components/common/button.d.ts +13 -0
- package/dist/components/common/button.d.ts.map +1 -0
- package/dist/components/common/button.js +32 -0
- package/dist/components/common/button.js.map +1 -0
- package/dist/components/common/card.d.ts +9 -0
- package/dist/components/common/card.d.ts.map +1 -0
- package/dist/components/common/card.js +22 -0
- package/dist/components/common/card.js.map +1 -0
- package/dist/components/common/checkbox.d.ts +7 -0
- package/dist/components/common/checkbox.d.ts.map +1 -0
- package/dist/components/common/checkbox.js +9 -0
- package/dist/components/common/checkbox.js.map +1 -0
- package/dist/components/common/input.d.ts +6 -0
- package/dist/components/common/input.d.ts.map +1 -0
- package/dist/components/common/input.js +7 -0
- package/dist/components/common/input.js.map +1 -0
- package/dist/components/common/label.d.ts +9 -0
- package/dist/components/common/label.d.ts.map +1 -0
- package/dist/components/common/label.js +11 -0
- package/dist/components/common/label.js.map +1 -0
- package/dist/components/common/textarea.d.ts +6 -0
- package/dist/components/common/textarea.d.ts.map +1 -0
- package/dist/components/common/textarea.js +7 -0
- package/dist/components/common/textarea.js.map +1 -0
- package/dist/components/dialog.d.ts +16 -0
- package/dist/components/dialog.d.ts.map +1 -0
- package/dist/components/dialog.js +36 -0
- package/dist/components/dialog.js.map +1 -0
- package/dist/components/input.d.ts +6 -0
- package/dist/components/input.d.ts.map +1 -0
- package/dist/components/input.js +7 -0
- package/dist/components/input.js.map +1 -0
- package/dist/components/skeleton.d.ts +6 -0
- package/dist/components/skeleton.d.ts.map +1 -0
- package/dist/components/skeleton.js +7 -0
- package/dist/components/skeleton.js.map +1 -0
- package/dist/components/ui/alert.d.ts +12 -0
- package/dist/components/ui/alert.d.ts.map +1 -0
- package/dist/components/ui/alert.js +27 -0
- package/dist/components/ui/alert.js.map +1 -0
- package/dist/components/ui/animated.d.ts +47 -0
- package/dist/components/ui/animated.d.ts.map +1 -0
- package/dist/components/ui/animated.js +96 -0
- package/dist/components/ui/animated.js.map +1 -0
- package/dist/components/ui/dialog.d.ts +16 -0
- package/dist/components/ui/dialog.d.ts.map +1 -0
- package/dist/components/ui/dialog.js +36 -0
- package/dist/components/ui/dialog.js.map +1 -0
- package/dist/components/ui/select.d.ts +14 -0
- package/dist/components/ui/select.d.ts.map +1 -0
- package/dist/components/ui/select.js +38 -0
- package/dist/components/ui/select.js.map +1 -0
- package/dist/components/ui/skeleton.d.ts +6 -0
- package/dist/components/ui/skeleton.d.ts.map +1 -0
- package/dist/components/ui/skeleton.js +7 -0
- package/dist/components/ui/skeleton.js.map +1 -0
- package/dist/components/ui/tabs.d.ts +8 -0
- package/dist/components/ui/tabs.d.ts.map +1 -0
- package/dist/components/ui/tabs.js +18 -0
- package/dist/components/ui/tabs.js.map +1 -0
- package/dist/components/ui/toast.d.ts +19 -0
- package/dist/components/ui/toast.d.ts.map +1 -0
- package/dist/components/ui/toast.js +37 -0
- package/dist/components/ui/toast.js.map +1 -0
- package/dist/components/ui/toaster.d.ts +2 -0
- package/dist/components/ui/toaster.d.ts.map +1 -0
- package/dist/components/ui/toaster.js +11 -0
- package/dist/components/ui/toaster.js.map +1 -0
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.d.ts.map +1 -0
- package/dist/hooks/index.js +2 -0
- package/dist/hooks/index.js.map +1 -0
- package/dist/hooks/use-toast.d.ts +46 -0
- package/dist/hooks/use-toast.d.ts.map +1 -0
- package/dist/hooks/use-toast.js +125 -0
- package/dist/hooks/use-toast.js.map +1 -0
- package/dist/index.d.ts +31 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +21 -0
- package/dist/index.js.map +1 -0
- package/dist/lib/animations.d.ts +33 -0
- package/dist/lib/animations.d.ts.map +1 -0
- package/dist/lib/animations.example.d.ts +19 -0
- package/dist/lib/animations.example.d.ts.map +1 -0
- package/dist/lib/animations.example.js +80 -0
- package/dist/lib/animations.example.js.map +1 -0
- package/dist/lib/animations.js +232 -0
- package/dist/lib/animations.js.map +1 -0
- package/dist/lib/use-animation.d.ts +39 -0
- package/dist/lib/use-animation.d.ts.map +1 -0
- package/dist/lib/use-animation.js +148 -0
- package/dist/lib/use-animation.js.map +1 -0
- package/dist/lib/utils.d.ts +3 -0
- package/dist/lib/utils.d.ts.map +1 -0
- package/dist/lib/utils.js +6 -0
- package/dist/lib/utils.js.map +1 -0
- package/dist/tokens/tailwind.preset.d.ts +4 -0
- package/dist/tokens/tailwind.preset.d.ts.map +1 -0
- package/dist/tokens/tailwind.preset.js +193 -0
- package/dist/tokens/tailwind.preset.js.map +1 -0
- package/dist/utils/cn.d.ts +3 -0
- package/dist/utils/cn.d.ts.map +1 -0
- package/dist/utils/cn.js +6 -0
- package/dist/utils/cn.js.map +1 -0
- package/package.json +112 -0
- package/src/styles/globals.css +19 -0
- package/src/styles/variables.css +117 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-toast.d.ts","sourceRoot":"","sources":["../../src/hooks/use-toast.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAK5E,KAAK,YAAY,GAAG,UAAU,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,QAAA,MAAM,WAAW;;;;;CAKP,CAAA;AASV,KAAK,UAAU,GAAG,OAAO,WAAW,CAAA;AAEpC,KAAK,MAAM,GACP;IACE,IAAI,EAAE,UAAU,CAAC,WAAW,CAAC,CAAA;IAC7B,KAAK,EAAE,YAAY,CAAA;CACpB,GACD;IACE,IAAI,EAAE,UAAU,CAAC,cAAc,CAAC,CAAA;IAChC,KAAK,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;CAC7B,GACD;IACE,IAAI,EAAE,UAAU,CAAC,eAAe,CAAC,CAAA;IACjC,OAAO,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAA;CAC7B,GACD;IACE,IAAI,EAAE,UAAU,CAAC,cAAc,CAAC,CAAA;IAChC,OAAO,CAAC,EAAE,YAAY,CAAC,IAAI,CAAC,CAAA;CAC7B,CAAA;AAEL,UAAU,KAAK;IACb,MAAM,EAAE,YAAY,EAAE,CAAA;CACvB;AAoBD,eAAO,MAAM,OAAO,GAAI,OAAO,KAAK,EAAE,QAAQ,MAAM,KAAG,KAmDtD,CAAA;AAaD,KAAK,KAAK,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,CAAA;AAErC,iBAAS,KAAK,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK;;;oBAGT,YAAY;EAwBpC;AAED,iBAAS,QAAQ;;wBAgBO,MAAM;YApIpB,YAAY,EAAE;EAsIvB;AAED,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAA"}
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
const TOAST_LIMIT = 5;
|
|
3
|
+
const TOAST_REMOVE_DELAY = 1000000;
|
|
4
|
+
const actionTypes = {
|
|
5
|
+
ADD_TOAST: "ADD_TOAST",
|
|
6
|
+
UPDATE_TOAST: "UPDATE_TOAST",
|
|
7
|
+
DISMISS_TOAST: "DISMISS_TOAST",
|
|
8
|
+
REMOVE_TOAST: "REMOVE_TOAST",
|
|
9
|
+
};
|
|
10
|
+
let count = 0;
|
|
11
|
+
function genId() {
|
|
12
|
+
count = (count + 1) % Number.MAX_SAFE_INTEGER;
|
|
13
|
+
return count.toString();
|
|
14
|
+
}
|
|
15
|
+
const toastTimeouts = new Map();
|
|
16
|
+
const addToRemoveQueue = (toastId) => {
|
|
17
|
+
if (toastTimeouts.has(toastId)) {
|
|
18
|
+
return;
|
|
19
|
+
}
|
|
20
|
+
const timeout = setTimeout(() => {
|
|
21
|
+
toastTimeouts.delete(toastId);
|
|
22
|
+
dispatch({
|
|
23
|
+
type: "REMOVE_TOAST",
|
|
24
|
+
toastId: toastId,
|
|
25
|
+
});
|
|
26
|
+
}, TOAST_REMOVE_DELAY);
|
|
27
|
+
toastTimeouts.set(toastId, timeout);
|
|
28
|
+
};
|
|
29
|
+
export const reducer = (state, action) => {
|
|
30
|
+
switch (action.type) {
|
|
31
|
+
case "ADD_TOAST":
|
|
32
|
+
return {
|
|
33
|
+
...state,
|
|
34
|
+
toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
|
|
35
|
+
};
|
|
36
|
+
case "UPDATE_TOAST":
|
|
37
|
+
return {
|
|
38
|
+
...state,
|
|
39
|
+
toasts: state.toasts.map((t) => t.id === action.toast.id ? { ...t, ...action.toast } : t),
|
|
40
|
+
};
|
|
41
|
+
case "DISMISS_TOAST": {
|
|
42
|
+
const { toastId } = action;
|
|
43
|
+
if (toastId) {
|
|
44
|
+
addToRemoveQueue(toastId);
|
|
45
|
+
}
|
|
46
|
+
else {
|
|
47
|
+
state.toasts.forEach((toast) => {
|
|
48
|
+
addToRemoveQueue(toast.id);
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
return {
|
|
52
|
+
...state,
|
|
53
|
+
toasts: state.toasts.map((t) => t.id === toastId || toastId === undefined
|
|
54
|
+
? {
|
|
55
|
+
...t,
|
|
56
|
+
open: false,
|
|
57
|
+
}
|
|
58
|
+
: t),
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
case "REMOVE_TOAST":
|
|
62
|
+
if (action.toastId === undefined) {
|
|
63
|
+
return {
|
|
64
|
+
...state,
|
|
65
|
+
toasts: [],
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
return {
|
|
69
|
+
...state,
|
|
70
|
+
toasts: state.toasts.filter((t) => t.id !== action.toastId),
|
|
71
|
+
};
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
const listeners = [];
|
|
75
|
+
let memoryState = { toasts: [] };
|
|
76
|
+
function dispatch(action) {
|
|
77
|
+
memoryState = reducer(memoryState, action);
|
|
78
|
+
listeners.forEach((listener) => {
|
|
79
|
+
listener(memoryState);
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
function toast({ ...props }) {
|
|
83
|
+
const id = genId();
|
|
84
|
+
const update = (props) => dispatch({
|
|
85
|
+
type: "UPDATE_TOAST",
|
|
86
|
+
toast: { ...props, id },
|
|
87
|
+
});
|
|
88
|
+
const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
|
|
89
|
+
dispatch({
|
|
90
|
+
type: "ADD_TOAST",
|
|
91
|
+
toast: {
|
|
92
|
+
...props,
|
|
93
|
+
id,
|
|
94
|
+
open: true,
|
|
95
|
+
onOpenChange: (open) => {
|
|
96
|
+
if (!open)
|
|
97
|
+
dismiss();
|
|
98
|
+
},
|
|
99
|
+
},
|
|
100
|
+
});
|
|
101
|
+
return {
|
|
102
|
+
id: id,
|
|
103
|
+
dismiss,
|
|
104
|
+
update,
|
|
105
|
+
};
|
|
106
|
+
}
|
|
107
|
+
function useToast() {
|
|
108
|
+
const [state, setState] = React.useState(memoryState);
|
|
109
|
+
React.useEffect(() => {
|
|
110
|
+
listeners.push(setState);
|
|
111
|
+
return () => {
|
|
112
|
+
const index = listeners.indexOf(setState);
|
|
113
|
+
if (index > -1) {
|
|
114
|
+
listeners.splice(index, 1);
|
|
115
|
+
}
|
|
116
|
+
};
|
|
117
|
+
}, [state]);
|
|
118
|
+
return {
|
|
119
|
+
...state,
|
|
120
|
+
toast,
|
|
121
|
+
dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId }),
|
|
122
|
+
};
|
|
123
|
+
}
|
|
124
|
+
export { useToast, toast };
|
|
125
|
+
//# sourceMappingURL=use-toast.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-toast.js","sourceRoot":"","sources":["../../src/hooks/use-toast.ts"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
export { cn } from "./utils/cn.js";
|
|
2
|
+
export * from "./lib/animations.js";
|
|
3
|
+
export * from "./lib/use-animation.js";
|
|
4
|
+
export { default as dailyPreset } from "./tokens/tailwind.preset.js";
|
|
5
|
+
export { Button, buttonVariants } from "./components/common/button.js";
|
|
6
|
+
export type { ButtonProps } from "./components/common/button.js";
|
|
7
|
+
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent, } from "./components/common/card.js";
|
|
8
|
+
export { Input } from "./components/common/input.js";
|
|
9
|
+
export type { InputProps } from "./components/common/input.js";
|
|
10
|
+
export { Badge, badgeVariants } from "./components/common/badge.js";
|
|
11
|
+
export type { BadgeProps } from "./components/common/badge.js";
|
|
12
|
+
export { Label, labelVariants } from "./components/common/label.js";
|
|
13
|
+
export type { LabelProps } from "./components/common/label.js";
|
|
14
|
+
export { Textarea } from "./components/common/textarea.js";
|
|
15
|
+
export type { TextareaProps } from "./components/common/textarea.js";
|
|
16
|
+
export { Checkbox } from "./components/common/checkbox.js";
|
|
17
|
+
export type { CheckboxProps } from "./components/common/checkbox.js";
|
|
18
|
+
export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, } from "./components/ui/dialog.js";
|
|
19
|
+
export { Alert, AlertTitle, AlertDescription } from "./components/ui/alert.js";
|
|
20
|
+
export type { AlertProps } from "./components/ui/alert.js";
|
|
21
|
+
export { Skeleton } from "./components/ui/skeleton.js";
|
|
22
|
+
export type { SkeletonProps } from "./components/ui/skeleton.js";
|
|
23
|
+
export { Tabs, TabsList, TabsTrigger, TabsContent, } from "./components/ui/tabs.js";
|
|
24
|
+
export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from "./components/ui/select.js";
|
|
25
|
+
export { Toast, ToastProvider, ToastViewport, ToastTitle, ToastDescription, ToastClose, ToastAction, toastVariants, } from "./components/ui/toast.js";
|
|
26
|
+
export type { ToastProps, ToastActionElement } from "./components/ui/toast.js";
|
|
27
|
+
export { Toaster } from "./components/ui/toaster.js";
|
|
28
|
+
export { useToast, toast } from "./hooks/use-toast.js";
|
|
29
|
+
export { AnimatedFade, AnimatedScale, AnimatedSlide, AnimatedHoverCard, AnimatedPage, AnimatedToast, AnimatedBackdrop, AnimatedList, AnimatedListItem, AnimatedPresenceWrapper, } from "./components/ui/animated.js";
|
|
30
|
+
export type { AnimatedFadeProps, AnimatedScaleProps, AnimatedSlideProps, AnimatedHoverCardProps, AnimatedPageProps, AnimatedToastProps, AnimatedBackdropProps, AnimatedListProps, AnimatedListItemProps, AnimatedPresenceWrapperProps, } from "./components/ui/animated.js";
|
|
31
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAGlC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AAGtC,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,6BAA6B,CAAA;AAGpE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAA;AACtE,YAAY,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAEhE,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,eAAe,EACf,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAEpC,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAA;AACpD,YAAY,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAE9D,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AACnE,YAAY,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAE9D,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AACnE,YAAY,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AAE9D,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAC1D,YAAY,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;AAEpE,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAC1D,YAAY,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAA;AAGpE,OAAO,EACL,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,MAAM,2BAA2B,CAAA;AAElC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAC9E,YAAY,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAE1D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AACtD,YAAY,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AAEhE,OAAO,EACL,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,WAAW,GACZ,MAAM,yBAAyB,CAAA;AAEhC,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,2BAA2B,CAAA;AAElC,OAAO,EACL,KAAK,EACL,aAAa,EACb,aAAa,EACb,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,aAAa,GACd,MAAM,0BAA0B,CAAA;AACjC,YAAY,EAAE,UAAU,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AAE9E,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAEpD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAA;AAGtD,OAAO,EACL,YAAY,EACZ,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,gBAAgB,EAChB,uBAAuB,GACxB,MAAM,6BAA6B,CAAA;AACpC,YAAY,EACV,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,EAClB,sBAAsB,EACtB,iBAAiB,EACjB,kBAAkB,EAClB,qBAAqB,EACrB,iBAAiB,EACjB,qBAAqB,EACrB,4BAA4B,GAC7B,MAAM,6BAA6B,CAAA"}
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export { cn } from "./utils/cn.js";
|
|
2
|
+
export * from "./lib/animations.js";
|
|
3
|
+
export * from "./lib/use-animation.js";
|
|
4
|
+
export { default as dailyPreset } from "./tokens/tailwind.preset.js";
|
|
5
|
+
export { Button, buttonVariants } from "./components/common/button.js";
|
|
6
|
+
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent, } from "./components/common/card.js";
|
|
7
|
+
export { Input } from "./components/common/input.js";
|
|
8
|
+
export { Badge, badgeVariants } from "./components/common/badge.js";
|
|
9
|
+
export { Label, labelVariants } from "./components/common/label.js";
|
|
10
|
+
export { Textarea } from "./components/common/textarea.js";
|
|
11
|
+
export { Checkbox } from "./components/common/checkbox.js";
|
|
12
|
+
export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, } from "./components/ui/dialog.js";
|
|
13
|
+
export { Alert, AlertTitle, AlertDescription } from "./components/ui/alert.js";
|
|
14
|
+
export { Skeleton } from "./components/ui/skeleton.js";
|
|
15
|
+
export { Tabs, TabsList, TabsTrigger, TabsContent, } from "./components/ui/tabs.js";
|
|
16
|
+
export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from "./components/ui/select.js";
|
|
17
|
+
export { Toast, ToastProvider, ToastViewport, ToastTitle, ToastDescription, ToastClose, ToastAction, toastVariants, } from "./components/ui/toast.js";
|
|
18
|
+
export { Toaster } from "./components/ui/toaster.js";
|
|
19
|
+
export { useToast, toast } from "./hooks/use-toast.js";
|
|
20
|
+
export { AnimatedFade, AnimatedScale, AnimatedSlide, AnimatedHoverCard, AnimatedPage, AnimatedToast, AnimatedBackdrop, AnimatedList, AnimatedListItem, AnimatedPresenceWrapper, } from "./components/ui/animated.js";
|
|
21
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAGlC,cAAc,qBAAqB,CAAA;AACnC,cAAc,wBAAwB,CAAA;AAGtC,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,6BAA6B,CAAA;AAGpE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAA;AAGtE,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,eAAe,EACf,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAEpC,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAGpD,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AAGnE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AAGnE,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAG1D,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAI1D,OAAO,EACL,MAAM,EACN,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,MAAM,2BAA2B,CAAA;AAElC,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAG9E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGtD,OAAO,EACL,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,WAAW,GACZ,MAAM,yBAAyB,CAAA;AAEhC,OAAO,EACL,MAAM,EACN,WAAW,EACX,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,eAAe,EACf,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,2BAA2B,CAAA;AAElC,OAAO,EACL,KAAK,EACL,aAAa,EACb,aAAa,EACb,UAAU,EACV,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,aAAa,GACd,MAAM,0BAA0B,CAAA;AAGjC,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAEpD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAA;AAGtD,OAAO,EACL,YAAY,EACZ,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,gBAAgB,EAChB,uBAAuB,GACxB,MAAM,6BAA6B,CAAA"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { type Variants, type Transition } from "framer-motion";
|
|
2
|
+
export declare const easings: {
|
|
3
|
+
readonly inOut: readonly [0.4, 0, 0.2, 1];
|
|
4
|
+
readonly outBack: readonly [0.34, 1.56, 0.64, 1];
|
|
5
|
+
readonly in: readonly [0.2, 0, 0.8, 0.2];
|
|
6
|
+
};
|
|
7
|
+
export declare const durations: {
|
|
8
|
+
readonly fast: 0.15;
|
|
9
|
+
readonly normal: 0.3;
|
|
10
|
+
readonly slow: 0.5;
|
|
11
|
+
};
|
|
12
|
+
export declare function createTransition(duration?: keyof typeof durations, easing?: keyof typeof easings): Transition;
|
|
13
|
+
export declare const fadeVariants: Variants;
|
|
14
|
+
export declare const scaleVariants: Variants;
|
|
15
|
+
export declare function createSlideVariants(direction?: "left" | "right" | "up" | "down"): Variants;
|
|
16
|
+
export declare const slideFromRight: Variants;
|
|
17
|
+
export declare const slideFromLeft: Variants;
|
|
18
|
+
export declare const slideFromTop: Variants;
|
|
19
|
+
export declare const slideFromBottom: Variants;
|
|
20
|
+
export declare const hoverVariants: Variants;
|
|
21
|
+
export declare const pageVariants: Variants;
|
|
22
|
+
export declare const staggerContainer: Variants;
|
|
23
|
+
export declare const staggerChild: Variants;
|
|
24
|
+
export declare const toastVariants: Variants;
|
|
25
|
+
export declare const backdropVariants: Variants;
|
|
26
|
+
export declare const drawerVariants: Variants;
|
|
27
|
+
export declare const collapseVariants: Variants;
|
|
28
|
+
export declare const spinnerVariants: Variants;
|
|
29
|
+
export declare const pulseVariants: Variants;
|
|
30
|
+
export declare function prefersReducedMotion(): boolean;
|
|
31
|
+
export declare function withReducedMotion<T extends Variants>(variants: T): T | Record<string, never>;
|
|
32
|
+
export declare function getTransition(duration?: keyof typeof durations, easing?: keyof typeof easings): Transition;
|
|
33
|
+
//# sourceMappingURL=animations.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.d.ts","sourceRoot":"","sources":["../../src/lib/animations.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,UAAU,EAAE,MAAM,eAAe,CAAA;AAK9D,eAAO,MAAM,OAAO;;;;CAIV,CAAA;AAQV,eAAO,MAAM,SAAS;;;;CAIZ,CAAA;AAKV,wBAAgB,gBAAgB,CAC9B,QAAQ,GAAE,MAAM,OAAO,SAAoB,EAC3C,MAAM,GAAE,MAAM,OAAO,OAAiB,GACrC,UAAU,CAKZ;AAMD,eAAO,MAAM,YAAY,EAAE,QAY1B,CAAA;AAMD,eAAO,MAAM,aAAa,EAAE,QAe3B,CAAA;AAMD,wBAAgB,mBAAmB,CAAC,SAAS,GAAE,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,MAAgB,GAAG,QAAQ,CAwCnG;AAKD,eAAO,MAAM,cAAc,UAA+B,CAAA;AAC1D,eAAO,MAAM,aAAa,UAA8B,CAAA;AACxD,eAAO,MAAM,YAAY,UAA4B,CAAA;AACrD,eAAO,MAAM,eAAe,UAA8B,CAAA;AAM1D,eAAO,MAAM,aAAa,EAAE,QAY3B,CAAA;AAMD,eAAO,MAAM,YAAY,EAAE,QAe1B,CAAA;AAMD,eAAO,MAAM,gBAAgB,EAAE,QAW9B,CAAA;AAMD,eAAO,MAAM,YAAY,EAAE,QAU1B,CAAA;AAMD,eAAO,MAAM,aAAa,EAAE,QAoB3B,CAAA;AAMD,eAAO,MAAM,gBAAgB,EAAE,QAY9B,CAAA;AAMD,eAAO,MAAM,cAAc,EAAE,QAS5B,CAAA;AAMD,eAAO,MAAM,gBAAgB,EAAE,QAW9B,CAAA;AAMD,eAAO,MAAM,eAAe,EAAE,QAS7B,CAAA;AAMD,eAAO,MAAM,aAAa,EAAE,QAU3B,CAAA;AAKD,wBAAgB,oBAAoB,IAAI,OAAO,CAG9C;AAMD,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,QAAQ,EAAE,QAAQ,EAAE,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAE5F;AAKD,wBAAgB,aAAa,CAC3B,QAAQ,GAAE,MAAM,OAAO,SAAoB,EAC3C,MAAM,GAAE,MAAM,OAAO,OAAiB,GACrC,UAAU,CAKZ"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
export declare function FadeExample(): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export declare function ModalExample(): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
export declare function StaggeredListExample(): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export declare function StaggeredListWithHook(): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare function HoverCardExample(): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare function DrawerExample(): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare function ToastExample(): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare function PageTransitionExample({ children }: {
|
|
10
|
+
children: React.ReactNode;
|
|
11
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function ScrollAnimationExample(): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export declare function CustomAnimationExample(): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export declare function DirectVariantExample(): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export declare function DelayedAnimationExample(): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function CustomSlideExample(): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export declare function StaggeredGridExample(): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
export declare function AnimatedButtonExample(): import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
//# sourceMappingURL=animations.example.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.example.d.ts","sourceRoot":"","sources":["../../src/lib/animations.example.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AA8C9B,wBAAgB,WAAW,4CAQ1B;AAMD,wBAAgB,YAAY,4CAoB3B;AAMD,wBAAgB,oBAAoB,4CAYnC;AAGD,wBAAgB,qBAAqB,4CAapC;AAMD,wBAAgB,gBAAgB,4CAO/B;AAMD,wBAAgB,aAAa,4CAsB5B;AAMD,wBAAgB,YAAY,4CA4B3B;AAMD,wBAAgB,qBAAqB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,2CAMhF;AAMD,wBAAgB,sBAAsB,4CAcrC;AAMD,wBAAgB,sBAAsB,4CAgBrC;AAMD,wBAAgB,oBAAoB,4CAYnC;AAMD,wBAAgB,uBAAuB,4CAYtC;AAMD,wBAAgB,kBAAkB,4CAajC;AAMD,wBAAgB,oBAAoB,4CAqBnC;AAMD,wBAAgB,qBAAqB,4CA8BpC"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { motion, AnimatePresence } from "framer-motion";
|
|
4
|
+
import { scaleVariants, staggerContainer, staggerChild, createSlideVariants, createTransition, } from "./animations.js";
|
|
5
|
+
import { useAnimation, useStaggerAnimation, useAnimatedPresence, useDelayedAnimation, useScrollAnimation, useTransition, useReducedMotion, } from "./use-animation.js";
|
|
6
|
+
import { AnimatedFade, AnimatedScale, AnimatedSlide, AnimatedHoverCard, AnimatedPage, AnimatedToast, AnimatedBackdrop, AnimatedList, AnimatedListItem, AnimatedPresenceWrapper, } from "../components/animated.js";
|
|
7
|
+
export function FadeExample() {
|
|
8
|
+
const animation = useAnimation("fade");
|
|
9
|
+
return (_jsx(motion.div, { variants: animation.variants, ...animation.props, children: _jsx("h1", { children: "This fades in" }) }));
|
|
10
|
+
}
|
|
11
|
+
export function ModalExample() {
|
|
12
|
+
const { isVisible, show, hide } = useAnimatedPresence();
|
|
13
|
+
return (_jsxs(_Fragment, { children: [_jsx("button", { onClick: show, children: "Open Modal" }), _jsx(AnimatePresence, { children: isVisible && (_jsxs(_Fragment, { children: [_jsx(AnimatedBackdrop, { onClick: hide, className: "fixed inset-0 bg-black/80" }), _jsxs(AnimatedScale, { className: "fixed left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 bg-white p-6 rounded-lg", children: [_jsx("h2", { children: "Modal Title" }), _jsx("p", { children: "Modal content here" }), _jsx("button", { onClick: hide, children: "Close" })] })] })) })] }));
|
|
14
|
+
}
|
|
15
|
+
export function StaggeredListExample() {
|
|
16
|
+
const items = ["Item 1", "Item 2", "Item 3", "Item 4"];
|
|
17
|
+
return (_jsx(AnimatedList, { children: items.map((item, index) => (_jsx(AnimatedListItem, { className: "p-4 bg-gray-100 mb-2 rounded", children: item }, index))) }));
|
|
18
|
+
}
|
|
19
|
+
export function StaggeredListWithHook() {
|
|
20
|
+
const { containerProps, childProps } = useStaggerAnimation();
|
|
21
|
+
const items = ["Item 1", "Item 2", "Item 3", "Item 4"];
|
|
22
|
+
return (_jsx(motion.ul, { ...containerProps, children: items.map((item, index) => (_jsx(motion.li, { ...childProps, className: "p-4 bg-gray-100 mb-2 rounded", children: item }, index))) }));
|
|
23
|
+
}
|
|
24
|
+
export function HoverCardExample() {
|
|
25
|
+
return (_jsxs(AnimatedHoverCard, { className: "p-6 bg-white rounded-lg shadow-md cursor-pointer", children: [_jsx("h3", { children: "Hover over me!" }), _jsx("p", { children: "I'll scale up slightly on hover" })] }));
|
|
26
|
+
}
|
|
27
|
+
export function DrawerExample() {
|
|
28
|
+
const { isVisible, toggle } = useAnimatedPresence();
|
|
29
|
+
return (_jsxs(_Fragment, { children: [_jsx("button", { onClick: toggle, children: "Toggle Drawer" }), _jsx(AnimatePresence, { children: isVisible && (_jsxs(_Fragment, { children: [_jsx(AnimatedBackdrop, { onClick: toggle, className: "fixed inset-0 bg-black/50 z-40" }), _jsxs(AnimatedSlide, { direction: "left", className: "fixed right-0 top-0 h-full w-80 bg-white shadow-lg z-50 p-6", children: [_jsx("h2", { children: "Drawer Content" }), _jsx("button", { onClick: toggle, children: "Close" })] })] })) })] }));
|
|
30
|
+
}
|
|
31
|
+
export function ToastExample() {
|
|
32
|
+
const [toasts, setToasts] = React.useState([]);
|
|
33
|
+
const addToast = () => {
|
|
34
|
+
const id = Date.now();
|
|
35
|
+
setToasts((prev) => [...prev, { id, message: "Operation successful!" }]);
|
|
36
|
+
setTimeout(() => {
|
|
37
|
+
setToasts((prev) => prev.filter((t) => t.id !== id));
|
|
38
|
+
}, 3000);
|
|
39
|
+
};
|
|
40
|
+
return (_jsxs(_Fragment, { children: [_jsx("button", { onClick: addToast, children: "Show Toast" }), _jsx("div", { className: "fixed top-4 right-4 z-50 space-y-2", children: _jsx(AnimatePresence, { children: toasts.map((toast) => (_jsx(AnimatedToast, { className: "bg-green-600 text-white px-4 py-3 rounded-lg shadow-lg", children: toast.message }, toast.id))) }) })] }));
|
|
41
|
+
}
|
|
42
|
+
export function PageTransitionExample({ children }) {
|
|
43
|
+
return (_jsx(AnimatedPresenceWrapper, { mode: "wait", children: _jsx(AnimatedPage, { children: children }, "page") }));
|
|
44
|
+
}
|
|
45
|
+
export function ScrollAnimationExample() {
|
|
46
|
+
const { ref, isInView } = useScrollAnimation();
|
|
47
|
+
return (_jsx(motion.div, { ref: ref, initial: { opacity: 0, y: 50 }, animate: isInView ? { opacity: 1, y: 0 } : { opacity: 0, y: 50 }, transition: { duration: 0.5 }, className: "p-6 bg-white rounded", children: _jsx("h3", { children: "I animate when you scroll to me!" }) }));
|
|
48
|
+
}
|
|
49
|
+
export function CustomAnimationExample() {
|
|
50
|
+
const shouldReduceMotion = useReducedMotion();
|
|
51
|
+
const transition = useTransition("normal", "outBack");
|
|
52
|
+
return (_jsxs(motion.div, { initial: { opacity: 0, scale: 0.8, rotate: -10 }, animate: { opacity: 1, scale: 1, rotate: 0 }, exit: { opacity: 0, scale: 0.8, rotate: 10 }, transition: transition, className: "p-6 bg-purple-600 text-white rounded", children: [_jsx("h3", { children: "Custom animation" }), shouldReduceMotion && _jsx("p", { className: "text-sm", children: "(Reduced motion active)" })] }));
|
|
53
|
+
}
|
|
54
|
+
export function DirectVariantExample() {
|
|
55
|
+
return (_jsx(motion.div, { variants: scaleVariants, initial: "hidden", animate: "visible", exit: "exit", className: "p-6 bg-orange-600 text-white rounded", children: _jsx("h3", { children: "Using variants directly" }) }));
|
|
56
|
+
}
|
|
57
|
+
export function DelayedAnimationExample() {
|
|
58
|
+
const shouldAnimate = useDelayedAnimation(500);
|
|
59
|
+
if (!shouldAnimate) {
|
|
60
|
+
return _jsx("div", { className: "opacity-0", children: "Loading..." });
|
|
61
|
+
}
|
|
62
|
+
return (_jsx(AnimatedFade, { className: "p-6 bg-blue-600 text-white rounded", children: _jsx("h3", { children: "This appears after a delay" }) }));
|
|
63
|
+
}
|
|
64
|
+
export function CustomSlideExample() {
|
|
65
|
+
const customSlideUp = createSlideVariants("up");
|
|
66
|
+
return (_jsx(motion.div, { variants: customSlideUp, initial: "hidden", animate: "visible", className: "p-6 bg-indigo-600 text-white rounded", children: _jsx("h3", { children: "Slides up from bottom" }) }));
|
|
67
|
+
}
|
|
68
|
+
export function StaggeredGridExample() {
|
|
69
|
+
const items = Array.from({ length: 12 }, (_, i) => i + 1);
|
|
70
|
+
return (_jsx(motion.div, { variants: staggerContainer, initial: "hidden", animate: "visible", className: "grid grid-cols-3 gap-4", children: items.map((item) => (_jsx(motion.div, { variants: staggerChild, className: "aspect-square bg-purple-600 rounded-lg flex items-center justify-center text-white text-2xl font-bold", children: item }, item))) }));
|
|
71
|
+
}
|
|
72
|
+
export function AnimatedButtonExample() {
|
|
73
|
+
const [isLoading, setIsLoading] = React.useState(false);
|
|
74
|
+
const handleClick = () => {
|
|
75
|
+
setIsLoading(true);
|
|
76
|
+
setTimeout(() => setIsLoading(false), 2000);
|
|
77
|
+
};
|
|
78
|
+
return (_jsx(motion.button, { onClick: handleClick, disabled: isLoading, whileHover: { scale: isLoading ? 1 : 1.05 }, whileTap: { scale: isLoading ? 1 : 0.95 }, transition: createTransition("fast"), className: "px-6 py-3 bg-orange-600 text-white rounded-lg disabled:opacity-50", children: isLoading ? (_jsx(motion.span, { animate: { rotate: 360 }, transition: { duration: 1, repeat: Infinity, ease: "linear" }, className: "inline-block", children: "\u27F3" })) : ("Click me") }));
|
|
79
|
+
}
|
|
80
|
+
//# sourceMappingURL=animations.example.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.example.js","sourceRoot":"","sources":["../../src/lib/animations.example.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,232 @@
|
|
|
1
|
+
export const easings = {
|
|
2
|
+
inOut: [0.4, 0, 0.2, 1],
|
|
3
|
+
outBack: [0.34, 1.56, 0.64, 1],
|
|
4
|
+
in: [0.2, 0, 0.8, 0.2],
|
|
5
|
+
};
|
|
6
|
+
export const durations = {
|
|
7
|
+
fast: 0.15,
|
|
8
|
+
normal: 0.3,
|
|
9
|
+
slow: 0.5,
|
|
10
|
+
};
|
|
11
|
+
export function createTransition(duration = "normal", easing = "inOut") {
|
|
12
|
+
return {
|
|
13
|
+
duration: durations[duration],
|
|
14
|
+
ease: easings[easing],
|
|
15
|
+
};
|
|
16
|
+
}
|
|
17
|
+
export const fadeVariants = {
|
|
18
|
+
hidden: {
|
|
19
|
+
opacity: 0,
|
|
20
|
+
},
|
|
21
|
+
visible: {
|
|
22
|
+
opacity: 1,
|
|
23
|
+
transition: createTransition("normal"),
|
|
24
|
+
},
|
|
25
|
+
exit: {
|
|
26
|
+
opacity: 0,
|
|
27
|
+
transition: createTransition("fast"),
|
|
28
|
+
},
|
|
29
|
+
};
|
|
30
|
+
export const scaleVariants = {
|
|
31
|
+
hidden: {
|
|
32
|
+
opacity: 0,
|
|
33
|
+
scale: 0.95,
|
|
34
|
+
},
|
|
35
|
+
visible: {
|
|
36
|
+
opacity: 1,
|
|
37
|
+
scale: 1,
|
|
38
|
+
transition: createTransition("normal", "outBack"),
|
|
39
|
+
},
|
|
40
|
+
exit: {
|
|
41
|
+
opacity: 0,
|
|
42
|
+
scale: 0.95,
|
|
43
|
+
transition: createTransition("fast"),
|
|
44
|
+
},
|
|
45
|
+
};
|
|
46
|
+
export function createSlideVariants(direction = "right") {
|
|
47
|
+
const offset = 20;
|
|
48
|
+
const isHorizontal = direction === "left" || direction === "right";
|
|
49
|
+
const value = direction === "right" || direction === "down" ? offset : -offset;
|
|
50
|
+
if (isHorizontal) {
|
|
51
|
+
return {
|
|
52
|
+
hidden: {
|
|
53
|
+
opacity: 0,
|
|
54
|
+
x: value,
|
|
55
|
+
},
|
|
56
|
+
visible: {
|
|
57
|
+
opacity: 1,
|
|
58
|
+
x: 0,
|
|
59
|
+
transition: createTransition("normal"),
|
|
60
|
+
},
|
|
61
|
+
exit: {
|
|
62
|
+
opacity: 0,
|
|
63
|
+
x: value,
|
|
64
|
+
transition: createTransition("fast"),
|
|
65
|
+
},
|
|
66
|
+
};
|
|
67
|
+
}
|
|
68
|
+
return {
|
|
69
|
+
hidden: {
|
|
70
|
+
opacity: 0,
|
|
71
|
+
y: value,
|
|
72
|
+
},
|
|
73
|
+
visible: {
|
|
74
|
+
opacity: 1,
|
|
75
|
+
y: 0,
|
|
76
|
+
transition: createTransition("normal"),
|
|
77
|
+
},
|
|
78
|
+
exit: {
|
|
79
|
+
opacity: 0,
|
|
80
|
+
y: value,
|
|
81
|
+
transition: createTransition("fast"),
|
|
82
|
+
},
|
|
83
|
+
};
|
|
84
|
+
}
|
|
85
|
+
export const slideFromRight = createSlideVariants("right");
|
|
86
|
+
export const slideFromLeft = createSlideVariants("left");
|
|
87
|
+
export const slideFromTop = createSlideVariants("up");
|
|
88
|
+
export const slideFromBottom = createSlideVariants("down");
|
|
89
|
+
export const hoverVariants = {
|
|
90
|
+
initial: {
|
|
91
|
+
scale: 1,
|
|
92
|
+
},
|
|
93
|
+
hover: {
|
|
94
|
+
scale: 1.02,
|
|
95
|
+
transition: createTransition("fast"),
|
|
96
|
+
},
|
|
97
|
+
tap: {
|
|
98
|
+
scale: 0.98,
|
|
99
|
+
transition: createTransition("fast"),
|
|
100
|
+
},
|
|
101
|
+
};
|
|
102
|
+
export const pageVariants = {
|
|
103
|
+
initial: {
|
|
104
|
+
opacity: 0,
|
|
105
|
+
y: 10,
|
|
106
|
+
},
|
|
107
|
+
animate: {
|
|
108
|
+
opacity: 1,
|
|
109
|
+
y: 0,
|
|
110
|
+
transition: createTransition("normal"),
|
|
111
|
+
},
|
|
112
|
+
exit: {
|
|
113
|
+
opacity: 0,
|
|
114
|
+
y: -10,
|
|
115
|
+
transition: createTransition("fast"),
|
|
116
|
+
},
|
|
117
|
+
};
|
|
118
|
+
export const staggerContainer = {
|
|
119
|
+
hidden: {
|
|
120
|
+
opacity: 0,
|
|
121
|
+
},
|
|
122
|
+
visible: {
|
|
123
|
+
opacity: 1,
|
|
124
|
+
transition: {
|
|
125
|
+
staggerChildren: 0.1,
|
|
126
|
+
delayChildren: 0.05,
|
|
127
|
+
},
|
|
128
|
+
},
|
|
129
|
+
};
|
|
130
|
+
export const staggerChild = {
|
|
131
|
+
hidden: {
|
|
132
|
+
opacity: 0,
|
|
133
|
+
y: 10,
|
|
134
|
+
},
|
|
135
|
+
visible: {
|
|
136
|
+
opacity: 1,
|
|
137
|
+
y: 0,
|
|
138
|
+
transition: createTransition("normal"),
|
|
139
|
+
},
|
|
140
|
+
};
|
|
141
|
+
export const toastVariants = {
|
|
142
|
+
initial: {
|
|
143
|
+
opacity: 0,
|
|
144
|
+
y: -20,
|
|
145
|
+
scale: 0.95,
|
|
146
|
+
},
|
|
147
|
+
animate: {
|
|
148
|
+
opacity: 1,
|
|
149
|
+
y: 0,
|
|
150
|
+
scale: 1,
|
|
151
|
+
transition: {
|
|
152
|
+
duration: 0.2,
|
|
153
|
+
ease: easings.inOut,
|
|
154
|
+
},
|
|
155
|
+
},
|
|
156
|
+
exit: {
|
|
157
|
+
opacity: 0,
|
|
158
|
+
scale: 0.95,
|
|
159
|
+
transition: createTransition("fast", "in"),
|
|
160
|
+
},
|
|
161
|
+
};
|
|
162
|
+
export const backdropVariants = {
|
|
163
|
+
hidden: {
|
|
164
|
+
opacity: 0,
|
|
165
|
+
},
|
|
166
|
+
visible: {
|
|
167
|
+
opacity: 1,
|
|
168
|
+
transition: createTransition("normal"),
|
|
169
|
+
},
|
|
170
|
+
exit: {
|
|
171
|
+
opacity: 0,
|
|
172
|
+
transition: createTransition("fast"),
|
|
173
|
+
},
|
|
174
|
+
};
|
|
175
|
+
export const drawerVariants = {
|
|
176
|
+
closed: {
|
|
177
|
+
x: "-100%",
|
|
178
|
+
transition: createTransition("normal"),
|
|
179
|
+
},
|
|
180
|
+
open: {
|
|
181
|
+
x: 0,
|
|
182
|
+
transition: createTransition("normal", "outBack"),
|
|
183
|
+
},
|
|
184
|
+
};
|
|
185
|
+
export const collapseVariants = {
|
|
186
|
+
collapsed: {
|
|
187
|
+
height: 0,
|
|
188
|
+
opacity: 0,
|
|
189
|
+
transition: createTransition("normal"),
|
|
190
|
+
},
|
|
191
|
+
expanded: {
|
|
192
|
+
height: "auto",
|
|
193
|
+
opacity: 1,
|
|
194
|
+
transition: createTransition("normal"),
|
|
195
|
+
},
|
|
196
|
+
};
|
|
197
|
+
export const spinnerVariants = {
|
|
198
|
+
animate: {
|
|
199
|
+
rotate: 360,
|
|
200
|
+
transition: {
|
|
201
|
+
duration: 1,
|
|
202
|
+
repeat: Infinity,
|
|
203
|
+
ease: "linear",
|
|
204
|
+
},
|
|
205
|
+
},
|
|
206
|
+
};
|
|
207
|
+
export const pulseVariants = {
|
|
208
|
+
animate: {
|
|
209
|
+
scale: [1, 1.05, 1],
|
|
210
|
+
opacity: [1, 0.8, 1],
|
|
211
|
+
transition: {
|
|
212
|
+
duration: 2,
|
|
213
|
+
repeat: Infinity,
|
|
214
|
+
ease: easings.inOut,
|
|
215
|
+
},
|
|
216
|
+
},
|
|
217
|
+
};
|
|
218
|
+
export function prefersReducedMotion() {
|
|
219
|
+
if (typeof window === "undefined")
|
|
220
|
+
return false;
|
|
221
|
+
return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
222
|
+
}
|
|
223
|
+
export function withReducedMotion(variants) {
|
|
224
|
+
return prefersReducedMotion() ? {} : variants;
|
|
225
|
+
}
|
|
226
|
+
export function getTransition(duration = "normal", easing = "inOut") {
|
|
227
|
+
if (prefersReducedMotion()) {
|
|
228
|
+
return { duration: 0.01 };
|
|
229
|
+
}
|
|
230
|
+
return createTransition(duration, easing);
|
|
231
|
+
}
|
|
232
|
+
//# sourceMappingURL=animations.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"animations.js","sourceRoot":"","sources":["../../src/lib/animations.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { type Variants } from "framer-motion";
|
|
2
|
+
import { type durations, type easings } from "./animations.js";
|
|
3
|
+
export declare function useReducedMotion(): boolean;
|
|
4
|
+
export declare function useAnimation(type: "fade" | "scale" | "slideLeft" | "slideRight" | "slideUp" | "slideDown" | "hover" | "page" | "toast" | "backdrop" | "drawer" | "collapse" | "spinner" | "pulse" | "staggerContainer" | "staggerChild"): {
|
|
5
|
+
variants: Variants | undefined;
|
|
6
|
+
props: Record<string, any>;
|
|
7
|
+
shouldReduceMotion: boolean;
|
|
8
|
+
};
|
|
9
|
+
export declare function useStaggerAnimation(): {
|
|
10
|
+
containerProps: {
|
|
11
|
+
variants?: undefined;
|
|
12
|
+
initial?: undefined;
|
|
13
|
+
animate?: undefined;
|
|
14
|
+
} | {
|
|
15
|
+
variants: Variants;
|
|
16
|
+
initial: string;
|
|
17
|
+
animate: string;
|
|
18
|
+
};
|
|
19
|
+
childProps: {
|
|
20
|
+
variants?: undefined;
|
|
21
|
+
} | {
|
|
22
|
+
variants: Variants;
|
|
23
|
+
};
|
|
24
|
+
shouldReduceMotion: boolean;
|
|
25
|
+
};
|
|
26
|
+
export declare function useAnimatedPresence(initialVisible?: boolean): {
|
|
27
|
+
isVisible: boolean;
|
|
28
|
+
show: () => void;
|
|
29
|
+
hide: () => void;
|
|
30
|
+
toggle: () => void;
|
|
31
|
+
setIsVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
|
|
32
|
+
};
|
|
33
|
+
export declare function useDelayedAnimation(delayMs?: number): boolean;
|
|
34
|
+
export declare function useScrollAnimation(options?: IntersectionObserverInit): {
|
|
35
|
+
ref: import("react").Dispatch<import("react").SetStateAction<HTMLElement | null>>;
|
|
36
|
+
isInView: boolean;
|
|
37
|
+
};
|
|
38
|
+
export declare function useTransition(duration?: keyof typeof durations, easing?: keyof typeof easings): import("motion-dom").Transition;
|
|
39
|
+
//# sourceMappingURL=use-animation.d.ts.map
|