@kurocado-studio/systemhaus-motion-react 1.0.0-develop.4 → 1.0.0-develop.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/exports.js +1 -1
- package/dist/index.d.ts +4 -3
- package/package.json +1 -1
package/dist/exports.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{get as
|
|
1
|
+
import{get as A}from"lodash-es";function I(t,e,o,a){var r=t.getBoundingClientRect(),i=r.left+r.width/2,l=r.top+r.height/2,s=e-i,m=o-l,n=a.magneticModeActivationRadius,p=A(a,["maxDistance"],3e3),f=A(a,["intensity"],.1);if(globalThis.matchMedia("(prefers-reduced-motion: reduce)").matches)return{x:0,y:0};if(typeof n=="number"){var c=Math.hypot(Math.pow(s,2)+Math.pow(m,2));if(c>p)return{x:0,y:0};var v=0;return c<n&&(v=1-c/n),{x:s*v*f,y:m*v*f}}if(Math.abs(s)<p&&Math.abs(m)<p){var C=1-Math.max(Math.abs(s),Math.abs(m))/p;return{x:s*C*f,y:m*C*f}}return{x:0,y:0}}var N=.4;var b="easeInOut",u=12;var H=12,x={isStatic:!1,fadeInSpeed:H,fadeDistance:u,transition:{duration:N,ease:b},reducedMotion:"user"};import{get as E}from"lodash-es";import O,{createContext as U,useContext as w,useMemo as V}from"react";var d=(i=>(i.TOP="TOP",i.BOTTOM="BOTTOM",i.LEFT="LEFT",i.RIGHT="RIGHT",i.DEFAULT="DEFAULT",i))(d||{});import{useMotionValue as P,useSpring as T,MotionConfig as h,AnimatePresence as F,motion as D}from"framer-motion";var y={...x,fadeInDirection:"TOP",fadeInDistance:u,viewport:{once:!1,amount:.2}},R=U(y),oe=({children:t,motionOverrides:e})=>{let o=V(()=>({...x,...e,viewport:E(e,["viewport"],y.viewport),fadeInDistance:E(e,["fadeInDistance"],y.fadeInDistance),fadeInDirection:E(e,["fadeInDirection"],y.fadeInDirection)}),[e]);return O.createElement(R.Provider,{value:o},O.createElement(h,{...o},t))},S=()=>w(R);import{get as g}from"lodash-es";import{useEffect as B,useState as G}from"react";function me(t){let e=g(t,["damping"],100),o=g(t,["stiffness"],600),a=P(0),r=P(0),[i,l]=G(),s=T(a,{damping:e,stiffness:o}),m=T(r,{damping:e,stiffness:o});return B(()=>{let n=p=>{if(!i)return;let{x:f,y:c}=I(i,p.clientX,p.clientY,t);a.set(f),r.set(c)};return document.addEventListener("mousemove",n),()=>document.removeEventListener("mousemove",n)},[i,t,a,r]),{ref:l,x:s,y:m}}import{get as _}from"lodash-es";import L from"react";var de=({onEnterDirection:t,onExitDirection:e}={})=>{let{viewport:o,transition:a,fadeInDistance:r=u}=S(),i=Math.abs(r),s=L.useCallback(n=>({DEFAULT:{hidden:{opacity:0,y:0},visible:{opacity:1,y:0},exit:{opacity:0,y:0}},TOP:{hidden:{opacity:0,y:-n},visible:{opacity:1,y:0},exit:{opacity:0,y:-n}},BOTTOM:{hidden:{opacity:0,y:n},visible:{opacity:1,y:0},exit:{opacity:0,y:n}},LEFT:{hidden:{opacity:0,x:-n},visible:{opacity:1,x:0},exit:{opacity:0,x:-n}},RIGHT:{hidden:{opacity:0,x:n},visible:{opacity:1,x:0},exit:{opacity:0,x:n}}}),[])(i),m=_(s,[e??"BOTTOM","exit"],s.BOTTOM.exit);return L.useMemo(()=>({initial:"hidden",animate:"visible",exit:"exit",variants:{..._(s,[t??"TOP"],s.TOP),exit:m},transition:a,viewport:o}),[s,m,t,a,o])};import{get as X}from"lodash-es";import Y from"react";function Te(t){let{as:e,...o}=t,a=X(D,[e??"div"],D.div);return Y.createElement(a,{...o})}import M from"react";function Ae({children:t,isVisible:e,mode:o,initial:a}){return M.createElement(F,{mode:o,initial:a},e&&M.Children.toArray(t).map((r,i)=>M.isValidElement(r)?M.cloneElement(r,{key:r.key??`motion-child-${i}`}):r))}import{cloneDeep as k,merge as W}from"lodash-es";function Fe(...t){let e=t.map(o=>k(o));return W({},...e)}export{Ae as AnimateMotionPresence,d as DirectionEnum,oe as MotionProvider,Te as PolymorphicMotionElement,Fe as mergeMotionProperties,y as systemHausMotionConfiguration,me as useCursorFollow,de as useFadeIn,S as useSystemHausMotionProvider};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import * as Motion from 'framer-motion';
|
|
2
2
|
import { MotionProps } from 'framer-motion';
|
|
3
|
-
import { MotionProps as MotionProps_2 } from 'motion/react';
|
|
4
3
|
import * as React_2 from 'react';
|
|
5
4
|
import React__default from 'react';
|
|
6
5
|
import { ViewportOptions } from 'framer-motion';
|
|
7
6
|
|
|
7
|
+
export declare function AnimateMotionPresence({ children, isVisible, mode, initial, }: React__default.PropsWithChildren<AnimateMotionPresenceProperties>): React__default.ReactNode;
|
|
8
|
+
|
|
8
9
|
export declare interface AnimateMotionPresenceProperties {
|
|
9
10
|
isVisible?: boolean;
|
|
10
11
|
initial?: boolean;
|
|
@@ -30,13 +31,13 @@ export declare enum DirectionEnum {
|
|
|
30
31
|
DEFAULT = "DEFAULT"
|
|
31
32
|
}
|
|
32
33
|
|
|
33
|
-
export declare function mergeMotionProperties(...motionProperties:
|
|
34
|
+
export declare function mergeMotionProperties(...motionProperties: MotionProps[]): MotionProps;
|
|
34
35
|
|
|
35
36
|
export declare const MotionProvider: React__default.FC<SystemHausMotionProviderProperties>;
|
|
36
37
|
|
|
37
38
|
export declare function PolymorphicMotionElement<T extends keyof React__default.JSX.IntrinsicElements = 'div'>(properties: React__default.PropsWithChildren<PolymorphicMotionProperties<T>>): React__default.ReactNode;
|
|
38
39
|
|
|
39
|
-
export declare type PolymorphicMotionProperties<T extends keyof React__default.JSX.IntrinsicElements = 'div'> = Omit<React__default.JSX.IntrinsicElements[T], keyof MotionProps | 'ref'> & MotionProps &
|
|
40
|
+
export declare type PolymorphicMotionProperties<T extends keyof React__default.JSX.IntrinsicElements = 'div'> = Omit<React__default.JSX.IntrinsicElements[T], keyof MotionProps | 'ref'> & MotionProps & {
|
|
40
41
|
as?: T;
|
|
41
42
|
isVisible?: boolean;
|
|
42
43
|
};
|