@nikitph/flux-ui 0.1.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/LICENSE +21 -0
- package/README.md +310 -0
- package/dist/config/flux.config.d.ts +36 -0
- package/dist/context/FluxProvider.d.ts +11 -0
- package/dist/hooks/useAnimationBudget.d.ts +7 -0
- package/dist/hooks/useInView.d.ts +3 -0
- package/dist/hooks/useIsClient.d.ts +1 -0
- package/dist/hooks/useMergedRef.d.ts +2 -0
- package/dist/hooks/usePhysics.d.ts +7 -0
- package/dist/hooks/usePrefersReducedMotion.d.ts +1 -0
- package/dist/hooks/useReducedMotion.d.ts +1 -0
- package/dist/hooks/useScrollProgress.d.ts +2 -0
- package/dist/index.d.ts +53 -0
- package/dist/index.js +3330 -0
- package/dist/index.js.map +7 -0
- package/dist/primitives/01-reveal.d.ts +22 -0
- package/dist/primitives/02-presence.d.ts +15 -0
- package/dist/primitives/03-stagger.d.ts +23 -0
- package/dist/primitives/04-text-reveal.d.ts +21 -0
- package/dist/primitives/05-count-up.d.ts +22 -0
- package/dist/primitives/06-morph-text.d.ts +19 -0
- package/dist/primitives/07-flip-card.d.ts +17 -0
- package/dist/primitives/08-collapse.d.ts +16 -0
- package/dist/primitives/09-magnetic.d.ts +14 -0
- package/dist/primitives/10-hover-scale.d.ts +16 -0
- package/dist/primitives/11-tilt.d.ts +20 -0
- package/dist/primitives/12-drag.d.ts +31 -0
- package/dist/primitives/13-swipe.d.ts +20 -0
- package/dist/primitives/14-long-press.d.ts +18 -0
- package/dist/primitives/15-hover-3d.d.ts +23 -0
- package/dist/primitives/16-scroll-velocity.d.ts +15 -0
- package/dist/primitives/17-spotlight.d.ts +17 -0
- package/dist/primitives/18-follow-cursor.d.ts +20 -0
- package/dist/primitives/19-morph.d.ts +14 -0
- package/dist/primitives/20-fluid-layout.d.ts +14 -0
- package/dist/primitives/21-reorder.d.ts +25 -0
- package/dist/primitives/22-page-transition.d.ts +16 -0
- package/dist/primitives/23-animated-list.d.ts +20 -0
- package/dist/primitives/24-marquee.d.ts +16 -0
- package/dist/primitives/25-dock.d.ts +25 -0
- package/dist/primitives/26-infinite-scroll.d.ts +21 -0
- package/dist/primitives/27-scroll-progress.d.ts +14 -0
- package/dist/primitives/28-parallax.d.ts +11 -0
- package/dist/primitives/29-sticky-scroll.d.ts +14 -0
- package/dist/primitives/30-scroll-snap.d.ts +22 -0
- package/dist/primitives/31-aurora.d.ts +12 -0
- package/dist/primitives/32-mesh-gradient.d.ts +9 -0
- package/dist/primitives/33-particles.d.ts +11 -0
- package/dist/primitives/34-grid-pattern.d.ts +10 -0
- package/dist/primitives/35-noise.d.ts +9 -0
- package/dist/primitives/36-streaming-text.d.ts +14 -0
- package/dist/primitives/37-typing-indicator.d.ts +10 -0
- package/dist/primitives/38-skeleton.d.ts +13 -0
- package/dist/primitives/39-ai-message.d.ts +13 -0
- package/dist/primitives/40-hero-highlight.d.ts +13 -0
- package/dist/utils/clamp.d.ts +1 -0
- package/dist/utils/resolveMotion.d.ts +2 -0
- package/dist/utils/slot.d.ts +4 -0
- package/package.json +86 -0
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface RevealProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
physics?: PhysicsPreset;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
className?: string;
|
|
8
|
+
style?: React.CSSProperties;
|
|
9
|
+
asChild?: boolean;
|
|
10
|
+
from?: "below" | "above" | "left" | "right" | "none";
|
|
11
|
+
distance?: number;
|
|
12
|
+
fade?: boolean;
|
|
13
|
+
scale?: number | false;
|
|
14
|
+
rotate?: number | false;
|
|
15
|
+
trigger?: "mount" | "viewport" | "manual";
|
|
16
|
+
threshold?: number;
|
|
17
|
+
once?: boolean;
|
|
18
|
+
delay?: number;
|
|
19
|
+
show?: boolean;
|
|
20
|
+
onReveal?: () => void;
|
|
21
|
+
}
|
|
22
|
+
export declare const Reveal: React.ForwardRefExoticComponent<RevealProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface PresenceProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
enterFrom?: "below" | "above" | "left" | "right" | "scale" | "none";
|
|
6
|
+
exitTo?: "below" | "above" | "left" | "right" | "scale" | "none";
|
|
7
|
+
distance?: number;
|
|
8
|
+
fade?: boolean;
|
|
9
|
+
physics?: PhysicsPreset;
|
|
10
|
+
exitPhysics?: PhysicsPreset;
|
|
11
|
+
mode?: "sync" | "wait" | "popLayout";
|
|
12
|
+
onExitComplete?: () => void;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
}
|
|
15
|
+
export declare const Presence: React.FC<PresenceProps>;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface StaggerProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
interval?: number;
|
|
6
|
+
from?: "first" | "last" | "center" | "random";
|
|
7
|
+
reveal?: {
|
|
8
|
+
from?: "below" | "above" | "left" | "right" | "none";
|
|
9
|
+
distance?: number;
|
|
10
|
+
fade?: boolean;
|
|
11
|
+
scale?: number | false;
|
|
12
|
+
};
|
|
13
|
+
trigger?: "mount" | "viewport" | "manual";
|
|
14
|
+
threshold?: number;
|
|
15
|
+
once?: boolean;
|
|
16
|
+
show?: boolean;
|
|
17
|
+
physics?: PhysicsPreset;
|
|
18
|
+
className?: string;
|
|
19
|
+
style?: React.CSSProperties;
|
|
20
|
+
asChild?: boolean;
|
|
21
|
+
disabled?: boolean;
|
|
22
|
+
}
|
|
23
|
+
export declare const Stagger: React.ForwardRefExoticComponent<StaggerProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface TextRevealProps {
|
|
4
|
+
children: string;
|
|
5
|
+
by?: "char" | "word" | "line";
|
|
6
|
+
stagger?: number;
|
|
7
|
+
from?: "below" | "above" | "left" | "right" | "none";
|
|
8
|
+
distance?: number;
|
|
9
|
+
fade?: boolean;
|
|
10
|
+
blur?: number | false;
|
|
11
|
+
trigger?: "mount" | "viewport" | "manual";
|
|
12
|
+
threshold?: number;
|
|
13
|
+
once?: boolean;
|
|
14
|
+
show?: boolean;
|
|
15
|
+
tag?: "p" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "div";
|
|
16
|
+
physics?: PhysicsPreset;
|
|
17
|
+
className?: string;
|
|
18
|
+
style?: React.CSSProperties;
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
}
|
|
21
|
+
export declare const TextReveal: React.ForwardRefExoticComponent<TextRevealProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface CountUpProps {
|
|
4
|
+
from?: number;
|
|
5
|
+
to: number;
|
|
6
|
+
duration?: number;
|
|
7
|
+
decimals?: number;
|
|
8
|
+
prefix?: string;
|
|
9
|
+
suffix?: string;
|
|
10
|
+
separator?: string;
|
|
11
|
+
trigger?: "mount" | "viewport" | "manual";
|
|
12
|
+
threshold?: number;
|
|
13
|
+
once?: boolean;
|
|
14
|
+
show?: boolean;
|
|
15
|
+
tag?: "span" | "p" | "div" | "h1" | "h2" | "h3";
|
|
16
|
+
formatFn?: (value: number) => string;
|
|
17
|
+
physics?: PhysicsPreset;
|
|
18
|
+
className?: string;
|
|
19
|
+
style?: React.CSSProperties;
|
|
20
|
+
disabled?: boolean;
|
|
21
|
+
}
|
|
22
|
+
export declare const CountUp: React.ForwardRefExoticComponent<CountUpProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface MorphTextProps {
|
|
4
|
+
texts: string[];
|
|
5
|
+
interval?: number;
|
|
6
|
+
mode?: "crossfade" | "scramble" | "typewriter" | "blur";
|
|
7
|
+
stagger?: number;
|
|
8
|
+
scrambleChars?: string;
|
|
9
|
+
scrambleDuration?: number;
|
|
10
|
+
loop?: boolean;
|
|
11
|
+
pause?: boolean;
|
|
12
|
+
tag?: "span" | "p" | "h1" | "h2" | "h3" | "h4" | "div";
|
|
13
|
+
onTextChange?: (index: number) => void;
|
|
14
|
+
physics?: PhysicsPreset;
|
|
15
|
+
className?: string;
|
|
16
|
+
style?: React.CSSProperties;
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
}
|
|
19
|
+
export declare const MorphText: React.ForwardRefExoticComponent<MorphTextProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface FlipCardProps {
|
|
4
|
+
front: React.ReactNode;
|
|
5
|
+
back: React.ReactNode;
|
|
6
|
+
flipped?: boolean;
|
|
7
|
+
direction?: "horizontal" | "vertical";
|
|
8
|
+
trigger?: "click" | "hover" | "manual";
|
|
9
|
+
perspective?: number;
|
|
10
|
+
height?: string | number;
|
|
11
|
+
width?: string | number;
|
|
12
|
+
physics?: PhysicsPreset;
|
|
13
|
+
className?: string;
|
|
14
|
+
style?: React.CSSProperties;
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
}
|
|
17
|
+
export declare const FlipCard: React.ForwardRefExoticComponent<FlipCardProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface CollapseProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
open: boolean;
|
|
6
|
+
initialHeight?: number;
|
|
7
|
+
fade?: boolean;
|
|
8
|
+
overflow?: "hidden" | "visible";
|
|
9
|
+
onOpenComplete?: () => void;
|
|
10
|
+
onCloseComplete?: () => void;
|
|
11
|
+
physics?: PhysicsPreset;
|
|
12
|
+
className?: string;
|
|
13
|
+
style?: React.CSSProperties;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
}
|
|
16
|
+
export declare const Collapse: React.ForwardRefExoticComponent<CollapseProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface MagneticProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
strength?: number;
|
|
6
|
+
radius?: number;
|
|
7
|
+
maxDisplacement?: number;
|
|
8
|
+
spring?: PhysicsPreset;
|
|
9
|
+
disableOnTouch?: boolean;
|
|
10
|
+
className?: string;
|
|
11
|
+
style?: React.CSSProperties;
|
|
12
|
+
asChild?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const Magnetic: React.ForwardRefExoticComponent<MagneticProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface HoverScaleProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
hoverScale?: number;
|
|
6
|
+
pressScale?: number;
|
|
7
|
+
hoverRotate?: number;
|
|
8
|
+
liftShadow?: boolean;
|
|
9
|
+
shadowColor?: string;
|
|
10
|
+
physics?: PhysicsPreset;
|
|
11
|
+
className?: string;
|
|
12
|
+
style?: React.CSSProperties;
|
|
13
|
+
asChild?: boolean;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
}
|
|
16
|
+
export declare const HoverScale: React.ForwardRefExoticComponent<HoverScaleProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface TiltProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
maxTilt?: number;
|
|
6
|
+
perspective?: number;
|
|
7
|
+
scale?: number;
|
|
8
|
+
glare?: boolean;
|
|
9
|
+
glareOpacity?: number;
|
|
10
|
+
glareColor?: string;
|
|
11
|
+
reverse?: boolean;
|
|
12
|
+
resetOnLeave?: boolean;
|
|
13
|
+
disableOnTouch?: boolean;
|
|
14
|
+
axis?: "both" | "x" | "y";
|
|
15
|
+
physics?: PhysicsPreset;
|
|
16
|
+
className?: string;
|
|
17
|
+
style?: React.CSSProperties;
|
|
18
|
+
disabled?: boolean;
|
|
19
|
+
}
|
|
20
|
+
export declare const Tilt: React.ForwardRefExoticComponent<TiltProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PanInfo } from "motion/react";
|
|
3
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
4
|
+
export interface DragProps {
|
|
5
|
+
children: React.ReactNode;
|
|
6
|
+
axis?: "x" | "y" | "both";
|
|
7
|
+
constraints?: {
|
|
8
|
+
top?: number;
|
|
9
|
+
right?: number;
|
|
10
|
+
bottom?: number;
|
|
11
|
+
left?: number;
|
|
12
|
+
} | React.RefObject<HTMLElement>;
|
|
13
|
+
snapBack?: boolean;
|
|
14
|
+
snapPoints?: Array<{
|
|
15
|
+
x: number;
|
|
16
|
+
y: number;
|
|
17
|
+
}>;
|
|
18
|
+
snapThreshold?: number;
|
|
19
|
+
dragElastic?: number;
|
|
20
|
+
onDragStart?: (event: PointerEvent, info: PanInfo) => void;
|
|
21
|
+
onDrag?: (event: PointerEvent, info: PanInfo) => void;
|
|
22
|
+
onDragEnd?: (event: PointerEvent, info: PanInfo) => void;
|
|
23
|
+
cursor?: "grab" | "move" | "default";
|
|
24
|
+
handle?: React.RefObject<HTMLElement>;
|
|
25
|
+
physics?: PhysicsPreset;
|
|
26
|
+
className?: string;
|
|
27
|
+
style?: React.CSSProperties;
|
|
28
|
+
asChild?: boolean;
|
|
29
|
+
disabled?: boolean;
|
|
30
|
+
}
|
|
31
|
+
export declare const Drag: React.ForwardRefExoticComponent<DragProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface SwipeProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
direction?: "left" | "right" | "up" | "down" | "horizontal" | "vertical" | "any";
|
|
6
|
+
threshold?: number;
|
|
7
|
+
velocityThreshold?: number;
|
|
8
|
+
rubberBand?: boolean;
|
|
9
|
+
rubberBandFactor?: number;
|
|
10
|
+
onSwipe?: (direction: "left" | "right" | "up" | "down") => void;
|
|
11
|
+
onSwipeStart?: (direction: "left" | "right" | "up" | "down") => void;
|
|
12
|
+
renderBackground?: (direction: "left" | "right", progress: number) => React.ReactNode;
|
|
13
|
+
snapBack?: boolean;
|
|
14
|
+
exitAnimation?: boolean;
|
|
15
|
+
physics?: PhysicsPreset;
|
|
16
|
+
className?: string;
|
|
17
|
+
style?: React.CSSProperties;
|
|
18
|
+
disabled?: boolean;
|
|
19
|
+
}
|
|
20
|
+
export declare const Swipe: React.ForwardRefExoticComponent<SwipeProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface LongPressProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
duration?: number;
|
|
6
|
+
onLongPress?: () => void;
|
|
7
|
+
onPressStart?: () => void;
|
|
8
|
+
onPressEnd?: () => void;
|
|
9
|
+
feedback?: "ring" | "fill" | "scale" | "none";
|
|
10
|
+
feedbackColor?: string;
|
|
11
|
+
cancelOnMove?: boolean;
|
|
12
|
+
haptic?: boolean;
|
|
13
|
+
physics?: PhysicsPreset;
|
|
14
|
+
className?: string;
|
|
15
|
+
style?: React.CSSProperties;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
}
|
|
18
|
+
export declare const LongPress: React.ForwardRefExoticComponent<LongPressProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface Hover3DProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
perspective?: number;
|
|
6
|
+
maxMovement?: number;
|
|
7
|
+
layers?: number;
|
|
8
|
+
disableOnTouch?: boolean;
|
|
9
|
+
physics?: PhysicsPreset;
|
|
10
|
+
className?: string;
|
|
11
|
+
style?: React.CSSProperties;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export interface Hover3DLayerProps {
|
|
15
|
+
children: React.ReactNode;
|
|
16
|
+
depth?: number;
|
|
17
|
+
className?: string;
|
|
18
|
+
style?: React.CSSProperties;
|
|
19
|
+
}
|
|
20
|
+
export declare const Hover3DLayer: React.ForwardRefExoticComponent<Hover3DLayerProps & React.RefAttributes<HTMLDivElement>>;
|
|
21
|
+
export declare const Hover3D: React.ForwardRefExoticComponent<Hover3DProps & React.RefAttributes<HTMLDivElement>> & {
|
|
22
|
+
Layer: React.ForwardRefExoticComponent<Hover3DLayerProps & React.RefAttributes<HTMLDivElement>>;
|
|
23
|
+
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface ScrollVelocityProps {
|
|
4
|
+
children?: React.ReactNode | ((velocity: number) => React.ReactNode);
|
|
5
|
+
effect?: "speed" | "blur" | "stretch" | "skew" | "opacity";
|
|
6
|
+
sensitivity?: number;
|
|
7
|
+
maxEffect?: number;
|
|
8
|
+
direction?: "x" | "y";
|
|
9
|
+
smoothing?: number;
|
|
10
|
+
physics?: PhysicsPreset;
|
|
11
|
+
className?: string;
|
|
12
|
+
style?: React.CSSProperties;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
}
|
|
15
|
+
export declare const ScrollVelocity: React.ForwardRefExoticComponent<ScrollVelocityProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface SpotlightProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
size?: number;
|
|
6
|
+
color?: string;
|
|
7
|
+
borderColor?: string;
|
|
8
|
+
opacity?: number;
|
|
9
|
+
blur?: number;
|
|
10
|
+
mode?: "glow" | "reveal" | "border";
|
|
11
|
+
disableOnTouch?: boolean;
|
|
12
|
+
physics?: PhysicsPreset;
|
|
13
|
+
className?: string;
|
|
14
|
+
style?: React.CSSProperties;
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
}
|
|
17
|
+
export declare const Spotlight: React.ForwardRefExoticComponent<SpotlightProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface FollowCursorProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
offset?: {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
};
|
|
9
|
+
lag?: number;
|
|
10
|
+
rotate?: boolean;
|
|
11
|
+
hideOnLeave?: boolean;
|
|
12
|
+
containTo?: "parent" | "viewport" | "none";
|
|
13
|
+
visible?: boolean;
|
|
14
|
+
physics?: PhysicsPreset;
|
|
15
|
+
className?: string;
|
|
16
|
+
style?: React.CSSProperties;
|
|
17
|
+
asChild?: boolean;
|
|
18
|
+
disabled?: boolean;
|
|
19
|
+
}
|
|
20
|
+
export declare const FollowCursor: React.ForwardRefExoticComponent<FollowCursorProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface MorphProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
layoutId: string;
|
|
6
|
+
tag?: any;
|
|
7
|
+
mode?: "position" | "size" | "both";
|
|
8
|
+
physics?: PhysicsPreset;
|
|
9
|
+
className?: string;
|
|
10
|
+
style?: React.CSSProperties;
|
|
11
|
+
asChild?: boolean;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const Morph: React.ForwardRefExoticComponent<MorphProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface FluidLayoutProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
axis?: "width" | "height" | "both";
|
|
6
|
+
overflow?: "hidden" | "visible";
|
|
7
|
+
tag?: any;
|
|
8
|
+
debounce?: number;
|
|
9
|
+
physics?: PhysicsPreset;
|
|
10
|
+
className?: string;
|
|
11
|
+
style?: React.CSSProperties;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const FluidLayout: React.ForwardRefExoticComponent<FluidLayoutProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface ReorderProps<T> {
|
|
4
|
+
items: T[];
|
|
5
|
+
onReorder: (newOrder: T[]) => void;
|
|
6
|
+
axis?: "x" | "y";
|
|
7
|
+
gap?: number;
|
|
8
|
+
renderItem: (item: T, index: number, isDragging: boolean) => React.ReactNode;
|
|
9
|
+
dragHandle?: boolean;
|
|
10
|
+
physics?: PhysicsPreset;
|
|
11
|
+
className?: string;
|
|
12
|
+
style?: React.CSSProperties;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
}
|
|
15
|
+
export declare const ReorderContext: React.Context<any>;
|
|
16
|
+
export declare function ReorderDragHandle({ children, className, style }: {
|
|
17
|
+
children: React.ReactNode;
|
|
18
|
+
className?: string;
|
|
19
|
+
style?: React.CSSProperties;
|
|
20
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
export declare const Reorder: <T extends {
|
|
22
|
+
id: string | number;
|
|
23
|
+
}>(props: ReorderProps<T> & {
|
|
24
|
+
ref?: React.Ref<HTMLUListElement>;
|
|
25
|
+
}) => React.ReactElement;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface PageTransitionProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
mode?: "fade" | "slide" | "morph" | "crossfade" | "none";
|
|
6
|
+
direction?: "left" | "right" | "up" | "down" | "auto";
|
|
7
|
+
physics?: PhysicsPreset;
|
|
8
|
+
exitBeforeEnter?: boolean;
|
|
9
|
+
onTransitionStart?: () => void;
|
|
10
|
+
onTransitionComplete?: () => void;
|
|
11
|
+
className?: string;
|
|
12
|
+
style?: React.CSSProperties;
|
|
13
|
+
layoutId?: string;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
}
|
|
16
|
+
export declare const PageTransition: React.ForwardRefExoticComponent<PageTransitionProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface AnimatedListProps<T> {
|
|
4
|
+
items: T[];
|
|
5
|
+
keyExtractor: (item: T) => string;
|
|
6
|
+
renderItem: (item: T, index: number) => React.ReactNode;
|
|
7
|
+
enterFrom?: "below" | "above" | "left" | "right" | "scale";
|
|
8
|
+
enterDistance?: number;
|
|
9
|
+
stagger?: number;
|
|
10
|
+
layout?: boolean;
|
|
11
|
+
maxRendered?: number;
|
|
12
|
+
reversed?: boolean;
|
|
13
|
+
physics?: PhysicsPreset;
|
|
14
|
+
className?: string;
|
|
15
|
+
style?: React.CSSProperties;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
}
|
|
18
|
+
export declare const AnimatedList: <T>(props: AnimatedListProps<T> & {
|
|
19
|
+
ref?: React.Ref<HTMLUListElement>;
|
|
20
|
+
}) => React.ReactElement;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface MarqueeProps {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
speed?: number;
|
|
5
|
+
direction?: "left" | "right" | "up" | "down";
|
|
6
|
+
pauseOnHover?: boolean;
|
|
7
|
+
gap?: number;
|
|
8
|
+
gradientWidth?: number;
|
|
9
|
+
gradientColor?: string;
|
|
10
|
+
reverse?: boolean;
|
|
11
|
+
speedOnHover?: number;
|
|
12
|
+
className?: string;
|
|
13
|
+
style?: React.CSSProperties;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
}
|
|
16
|
+
export declare const Marquee: React.ForwardRefExoticComponent<MarqueeProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface DockProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
magnification?: number;
|
|
6
|
+
distance?: number;
|
|
7
|
+
direction?: "horizontal" | "vertical";
|
|
8
|
+
gap?: number;
|
|
9
|
+
baseSize?: number;
|
|
10
|
+
physics?: PhysicsPreset;
|
|
11
|
+
className?: string;
|
|
12
|
+
style?: React.CSSProperties;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
}
|
|
15
|
+
export interface DockItemProps {
|
|
16
|
+
children: React.ReactNode;
|
|
17
|
+
label?: string;
|
|
18
|
+
onClick?: () => void;
|
|
19
|
+
className?: string;
|
|
20
|
+
style?: React.CSSProperties;
|
|
21
|
+
}
|
|
22
|
+
export declare const DockItem: React.ForwardRefExoticComponent<DockItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
23
|
+
export declare const Dock: React.ForwardRefExoticComponent<DockProps & React.RefAttributes<HTMLDivElement>> & {
|
|
24
|
+
Item: React.ForwardRefExoticComponent<DockItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
25
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface InfiniteScrollProps<T> {
|
|
4
|
+
items: T[];
|
|
5
|
+
renderItem: (item: T, index: number) => React.ReactNode;
|
|
6
|
+
keyExtractor: (item: T) => string;
|
|
7
|
+
onLoadMore: () => void | Promise<void>;
|
|
8
|
+
hasMore: boolean;
|
|
9
|
+
threshold?: number;
|
|
10
|
+
loader?: React.ReactNode;
|
|
11
|
+
enterFrom?: "below" | "above" | "left" | "right" | "scale";
|
|
12
|
+
stagger?: number;
|
|
13
|
+
batchSize?: number;
|
|
14
|
+
physics?: PhysicsPreset;
|
|
15
|
+
className?: string;
|
|
16
|
+
style?: React.CSSProperties;
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
}
|
|
19
|
+
export declare const InfiniteScroll: <T>(props: InfiniteScrollProps<T> & {
|
|
20
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
21
|
+
}) => React.ReactElement;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface ScrollProgressProps {
|
|
3
|
+
children?: React.ReactNode;
|
|
4
|
+
axis?: "x" | "y";
|
|
5
|
+
container?: React.RefObject<HTMLElement | null>;
|
|
6
|
+
color?: string;
|
|
7
|
+
height?: number | string;
|
|
8
|
+
position?: "top" | "bottom" | "left" | "right" | "none";
|
|
9
|
+
smooth?: boolean;
|
|
10
|
+
className?: string;
|
|
11
|
+
style?: React.CSSProperties;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const ScrollProgress: React.ForwardRefExoticComponent<ScrollProgressProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface ParallaxProps {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
offset?: number;
|
|
5
|
+
direction?: "up" | "down" | "left" | "right";
|
|
6
|
+
container?: React.RefObject<HTMLElement | null>;
|
|
7
|
+
className?: string;
|
|
8
|
+
style?: React.CSSProperties;
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
}
|
|
11
|
+
export declare const Parallax: React.ForwardRefExoticComponent<ParallaxProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface StickyScrollProps {
|
|
3
|
+
content: {
|
|
4
|
+
title: string;
|
|
5
|
+
description: React.ReactNode;
|
|
6
|
+
asset?: React.ReactNode;
|
|
7
|
+
}[];
|
|
8
|
+
container?: React.RefObject<HTMLElement | null>;
|
|
9
|
+
physics?: any;
|
|
10
|
+
className?: string;
|
|
11
|
+
style?: React.CSSProperties;
|
|
12
|
+
disabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const StickyScroll: React.ForwardRefExoticComponent<StickyScrollProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { PhysicsPreset } from "../config/flux.config";
|
|
3
|
+
export interface ScrollSnapProps {
|
|
4
|
+
children: React.ReactNode;
|
|
5
|
+
axis?: "x" | "y" | "both";
|
|
6
|
+
alignment?: "start" | "center" | "end";
|
|
7
|
+
strictness?: "mandatory" | "proximity";
|
|
8
|
+
physics?: PhysicsPreset;
|
|
9
|
+
className?: string;
|
|
10
|
+
style?: React.CSSProperties;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
}
|
|
13
|
+
export declare const ScrollSnapItem: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
|
|
14
|
+
alignment?: "start" | "center" | "end";
|
|
15
|
+
stopHandling?: "normal" | "always";
|
|
16
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
17
|
+
export declare const ScrollSnap: React.ForwardRefExoticComponent<ScrollSnapProps & React.RefAttributes<HTMLDivElement>> & {
|
|
18
|
+
Item: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
|
|
19
|
+
alignment?: "start" | "center" | "end";
|
|
20
|
+
stopHandling?: "normal" | "always";
|
|
21
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
22
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface AuroraProps {
|
|
3
|
+
colors?: string[];
|
|
4
|
+
speed?: number;
|
|
5
|
+
blur?: number;
|
|
6
|
+
opacity?: number;
|
|
7
|
+
blendMode?: React.CSSProperties["mixBlendMode"];
|
|
8
|
+
className?: string;
|
|
9
|
+
style?: React.CSSProperties;
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare const Aurora: React.ForwardRefExoticComponent<AuroraProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface MeshGradientProps {
|
|
3
|
+
colors?: [string, string, string, string];
|
|
4
|
+
speed?: number;
|
|
5
|
+
className?: string;
|
|
6
|
+
style?: React.CSSProperties;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
}
|
|
9
|
+
export declare const MeshGradient: React.ForwardRefExoticComponent<MeshGradientProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface ParticlesProps {
|
|
3
|
+
color?: string;
|
|
4
|
+
quantity?: number;
|
|
5
|
+
staticity?: number;
|
|
6
|
+
ease?: number;
|
|
7
|
+
className?: string;
|
|
8
|
+
style?: React.CSSProperties;
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
}
|
|
11
|
+
export declare const Particles: React.ForwardRefExoticComponent<ParticlesProps & React.RefAttributes<HTMLCanvasElement>>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface GridPatternProps {
|
|
3
|
+
size?: number;
|
|
4
|
+
color?: string;
|
|
5
|
+
fade?: boolean;
|
|
6
|
+
className?: string;
|
|
7
|
+
style?: React.CSSProperties;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
}
|
|
10
|
+
export declare const GridPattern: React.ForwardRefExoticComponent<GridPatternProps & React.RefAttributes<HTMLDivElement>>;
|