react-ui-animate 1.4.6 → 2.0.0-rc.1

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.
@@ -0,0 +1,3 @@
1
+ {
2
+ "compile-hero.disable-compile-files-on-did-save-code": false
3
+ }
@@ -0,0 +1,7 @@
1
+ export declare const AnimationConfigUtils: {
2
+ ELASTIC: import("@raidipesh78/re-motion").UseTransitionConfig;
3
+ BOUNCE: import("@raidipesh78/re-motion").UseTransitionConfig;
4
+ EASE: import("@raidipesh78/re-motion").UseTransitionConfig;
5
+ STIFF: import("@raidipesh78/re-motion").UseTransitionConfig;
6
+ WOOBLE: import("@raidipesh78/re-motion").UseTransitionConfig;
7
+ };
@@ -1,3 +1,3 @@
1
- import { GenericAnimationConfig } from "./useAnimatedValue";
2
- export declare type InitialConfigType = "ease" | "elastic" | "stiff" | "wooble" | "bounce" | undefined;
3
- export declare const getInitialConfig: (animationType: InitialConfigType) => GenericAnimationConfig;
1
+ import { UseTransitionConfig } from '@raidipesh78/re-motion';
2
+ export declare type InitialConfigType = 'ease' | 'elastic' | 'stiff' | 'wooble' | 'bounce' | undefined;
3
+ export declare const getInitialConfig: (animationType: InitialConfigType) => UseTransitionConfig;
@@ -1,4 +1,5 @@
1
- export * from "./interpolation";
2
- export * from "./modules";
3
- export { useAnimatedValue } from "./useAnimatedValue";
4
- export { useMountedValue } from "./useMountedValue";
1
+ export * from './interpolation';
2
+ export * from './modules';
3
+ export { useAnimatedValue, ValueType, UseAnimatedValueConfig, } from './useAnimatedValue';
4
+ export { useMountedValue } from './useMountedValue';
5
+ export * from './animationType';
@@ -1,13 +1,5 @@
1
- import { ExtrapolateConfig } from "@raidipesh78/re-motion";
2
- /**
3
- * interpolate function maps input range to output range
4
- * @param value - number | TransitionValue
5
- * @param inputRange - Array<number>
6
- * @param outputRange - Array<string | number>
7
- * @param extrapolateConfig - "clamp" | "identity" | "extend"
8
- * @returns - number | TransitionValue
9
- */
10
- export declare function interpolate(value: any, inputRange: Array<number>, outputRange: Array<number | string>, extrapolateConfig?: ExtrapolateConfig): any;
1
+ import { ExtrapolateConfig, TransitionValue } from '@raidipesh78/re-motion';
2
+ export { interpolate } from '@raidipesh78/re-motion';
11
3
  /**
12
4
  * bInterpolate functions maps input range [0, 1] to given [minOutput, maxOutput]
13
5
  * sorthand function to interpolate input range [0, 1]
@@ -17,4 +9,4 @@ export declare function interpolate(value: any, inputRange: Array<number>, outpu
17
9
  * @param extrapolateConfig - "clamp" | "identity" | "extend"
18
10
  * @returns - number | TransitionValue
19
11
  */
20
- export declare function bInterpolate(value: any, minOutput: number | string, maxOutput: number | string, extrapolateConfig?: ExtrapolateConfig): any;
12
+ export declare function bInterpolate(value: number | TransitionValue, minOutput: number | string, maxOutput: number | string, extrapolateConfig?: ExtrapolateConfig): any;
@@ -1,26 +1,34 @@
1
- import * as React from "react";
2
- import { TransitionValue } from "@raidipesh78/re-motion";
3
- import { UseAnimatedValueConfig } from "./useAnimatedValue";
4
- import { InnerUseMountedValueConfig } from "./useMountedValue";
1
+ import * as React from 'react';
2
+ import { TransitionValue } from '@raidipesh78/re-motion';
3
+ import { UseAnimatedValueConfig } from './useAnimatedValue';
4
+ import { UseMountedValueConfig } from './useMountedValue';
5
5
  /**
6
6
  * Make any component animatable
7
7
  */
8
- export declare function makeAnimatedComponent(WrappedComponent: React.ElementType<any>): React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<unknown>>;
8
+ export declare function makeAnimatedComponent(WrappedComponent: React.ElementType<any>): React.ForwardRefExoticComponent<Pick<import("@raidipesh78/re-motion").AnimatedHTMLAttributes<React.ElementType<any>> & import("@raidipesh78/re-motion").AnimatedSVGAttributes<React.ElementType<any>>, "string" | "slot" | "title" | "clipPath" | "filter" | "mask" | "path" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "max" | "media" | "method" | "min" | "name" | "target" | "type" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "alphabetic" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "hanging" | "horizAdvX" | "horizOriginX" | "href" | "ideographic" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mathematical" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & {
9
+ style?: import("@raidipesh78/re-motion").AnimatedCSSProperties | undefined;
10
+ } & React.RefAttributes<unknown>>;
9
11
  /**
10
12
  * AnimatedBlock : Animated Div
11
13
  */
12
- export declare const AnimatedBlock: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<unknown>>;
14
+ export declare const AnimatedBlock: React.ForwardRefExoticComponent<Pick<import("@raidipesh78/re-motion").AnimatedHTMLAttributes<"div"> & import("@raidipesh78/re-motion").AnimatedSVGAttributes<"div">, "string" | "slot" | "title" | "clipPath" | "filter" | "mask" | "path" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "max" | "media" | "method" | "min" | "name" | "target" | "type" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "alphabetic" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "hanging" | "horizAdvX" | "horizOriginX" | "href" | "ideographic" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mathematical" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & {
15
+ style?: import("@raidipesh78/re-motion").AnimatedCSSProperties | undefined;
16
+ } & React.RefAttributes<unknown>>;
13
17
  /**
14
18
  * AnimatedInline : Animated Span
15
19
  */
16
- export declare const AnimatedInline: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<unknown>>;
20
+ export declare const AnimatedInline: React.ForwardRefExoticComponent<Pick<import("@raidipesh78/re-motion").AnimatedHTMLAttributes<"span"> & import("@raidipesh78/re-motion").AnimatedSVGAttributes<"span">, "string" | "slot" | "title" | "clipPath" | "filter" | "mask" | "path" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "max" | "media" | "method" | "min" | "name" | "target" | "type" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "alphabetic" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "hanging" | "horizAdvX" | "horizOriginX" | "href" | "ideographic" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mathematical" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & {
21
+ style?: import("@raidipesh78/re-motion").AnimatedCSSProperties | undefined;
22
+ } & React.RefAttributes<unknown>>;
17
23
  /**
18
24
  * AnimatedImage : Animated Image
19
25
  */
20
- export declare const AnimatedImage: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<unknown>>;
26
+ export declare const AnimatedImage: React.ForwardRefExoticComponent<Pick<import("@raidipesh78/re-motion").AnimatedHTMLAttributes<"img"> & import("@raidipesh78/re-motion").AnimatedSVGAttributes<"img">, "string" | "slot" | "title" | "clipPath" | "filter" | "mask" | "path" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "max" | "media" | "method" | "min" | "name" | "target" | "type" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "alphabetic" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "hanging" | "horizAdvX" | "horizOriginX" | "href" | "ideographic" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mathematical" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & {
27
+ style?: import("@raidipesh78/re-motion").AnimatedCSSProperties | undefined;
28
+ } & React.RefAttributes<unknown>>;
21
29
  interface ScrollableBlockProps {
22
30
  children?: (animation: any) => React.ReactNode;
23
- direction?: "single" | "both";
31
+ direction?: 'single' | 'both';
24
32
  threshold?: number;
25
33
  animationConfig?: UseAnimatedValueConfig;
26
34
  }
@@ -36,7 +44,7 @@ interface MountedBlockProps {
36
44
  children: (animation: {
37
45
  value: TransitionValue;
38
46
  }) => React.ReactNode;
39
- config?: InnerUseMountedValueConfig;
47
+ config: UseMountedValueConfig;
40
48
  }
41
49
  /**
42
50
  * MountedBlock handles mounting and unmounting of a component
@@ -1,30 +1,18 @@
1
- import { TransitionValue, ResultType } from "@raidipesh78/re-motion";
2
- import { InitialConfigType } from "./getInitialConfig";
1
+ import { UseTransitionConfig } from '@raidipesh78/re-motion';
3
2
  declare type AnimatedValueType = number | string;
4
- export interface GenericAnimationConfig {
5
- duration?: number;
6
- mass?: number;
7
- friction?: number;
8
- tension?: number;
9
- easing?: (t: number) => number;
10
- delay?: number;
3
+ export interface UseAnimatedValueConfig extends UseTransitionConfig {
11
4
  }
12
- export interface UseAnimatedValueConfig extends GenericAnimationConfig {
13
- animationType?: InitialConfigType;
14
- onAnimationEnd?: (value: ResultType) => void;
15
- listener?: (value: number) => void;
16
- immediate?: boolean;
17
- }
18
- export declare type ValueReturnType = TransitionValue | number | string | {
19
- toValue: number | string;
20
- immediate?: boolean;
5
+ declare type Length = number | string;
6
+ declare type AssignValue = {
7
+ toValue: Length;
8
+ config?: UseAnimatedValueConfig;
21
9
  };
22
- interface UseAnimatedValueReturn {
23
- value: ValueReturnType;
24
- currentValue: number | string;
25
- }
10
+ export declare type ValueType = Length | AssignValue | ((update: (next: AssignValue) => Promise<any>) => void);
26
11
  /**
27
12
  * useAnimatedValue for animated transitions
28
13
  */
29
- export declare function useAnimatedValue(initialValue: AnimatedValueType, config?: UseAnimatedValueConfig): UseAnimatedValueReturn;
14
+ export declare function useAnimatedValue(initialValue: AnimatedValueType, config?: UseAnimatedValueConfig): {
15
+ value: any;
16
+ currentValue: number | string;
17
+ };
30
18
  export {};
@@ -1,22 +1,13 @@
1
- import * as React from "react";
2
- import { TransitionValue, UseTransitionConfig } from "@raidipesh78/re-motion";
3
- export interface InnerUseMountedValueConfig extends UseTransitionConfig {
4
- enterDuration?: number;
5
- exitDuration?: number;
6
- }
7
- interface UseMountedValueConfig {
8
- from: number;
9
- enter: number;
10
- exit: number;
11
- config?: InnerUseMountedValueConfig;
1
+ import * as React from 'react';
2
+ import { TransitionValue, UseMountConfig } from '@raidipesh78/re-motion';
3
+ export interface UseMountedValueConfig extends UseMountConfig {
12
4
  }
13
5
  /**
14
6
  * useMountedValue handles mounting and unmounting of a component
15
7
  * @param state - boolean
16
8
  * @param config - useTransitionConfig
17
- * @returns mountedValueFunction with a callback with argument ( animationNode, mounted )
9
+ * @returns mountedValueFunction with a callback with argument ( { value: animationNode }, mounted )
18
10
  */
19
- export declare function useMountedValue(state: boolean, config: UseMountedValueConfig): (callback: ({ value }: {
11
+ export declare function useMountedValue(state: boolean, config: UseMountedValueConfig): (callback: ({ value: animation }: {
20
12
  value: TransitionValue;
21
13
  }, mounted: boolean) => React.ReactNode) => React.ReactNode;
22
- export {};
package/dist/index.js CHANGED
@@ -3,25 +3,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
3
3
  var reMotion = require('@raidipesh78/re-motion');
4
4
  var React = require('react');
5
5
 
6
- /**
7
- * interpolate function maps input range to output range
8
- * @param value - number | TransitionValue
9
- * @param inputRange - Array<number>
10
- * @param outputRange - Array<string | number>
11
- * @param extrapolateConfig - "clamp" | "identity" | "extend"
12
- * @returns - number | TransitionValue
13
- */
14
- function interpolate(value, inputRange, outputRange, extrapolateConfig) {
15
- if (typeof value === "object" && reMotion.isSubscriber(value)) {
16
- return reMotion.interpolateTransitionValue(value, inputRange, outputRange, extrapolateConfig);
17
- }
18
- else if (typeof value === "number") {
19
- return reMotion.interpolateNumbers(value, inputRange, outputRange, extrapolateConfig);
20
- }
21
- else {
22
- throw new Error("Error! " + typeof value + " cannot be interpolated");
23
- }
24
- }
25
6
  /**
26
7
  * bInterpolate functions maps input range [0, 1] to given [minOutput, maxOutput]
27
8
  * sorthand function to interpolate input range [0, 1]
@@ -32,7 +13,7 @@ function interpolate(value, inputRange, outputRange, extrapolateConfig) {
32
13
  * @returns - number | TransitionValue
33
14
  */
34
15
  function bInterpolate(value, minOutput, maxOutput, extrapolateConfig) {
35
- return interpolate(value, [0, 1], [minOutput, maxOutput], extrapolateConfig);
16
+ return reMotion.interpolate(value, [0, 1], [minOutput, maxOutput], extrapolateConfig);
36
17
  }
37
18
 
38
19
  /*! *****************************************************************************
@@ -110,86 +91,36 @@ function __spread() {
110
91
  return ar;
111
92
  }
112
93
 
113
- var getInitialConfig = function (animationType) {
114
- switch (animationType) {
115
- case "elastic":
116
- return { mass: 1, friction: 18, tension: 250 };
117
- case "stiff":
118
- return { mass: 1, friction: 18, tension: 350 };
119
- case "wooble":
120
- return { mass: 1, friction: 8, tension: 250 };
121
- case "bounce":
122
- return { duration: 500, easing: reMotion.Easing.bounce };
123
- case "ease":
124
- default:
125
- return { mass: 1, friction: 26, tension: 170 };
126
- }
127
- };
128
-
129
- /**
130
- * getValue checks for type of initialValue and throws error
131
- * for type other than AnimatedValueType
132
- */
133
- var getValue = function (value) {
134
- if (typeof value === "number" || typeof value === "string") {
135
- return value;
136
- }
137
- else {
138
- throw new Error("Invalid Value! Animated value only accepts string or number.");
139
- }
140
- };
141
94
  /**
142
95
  * useAnimatedValue for animated transitions
143
96
  */
144
97
  function useAnimatedValue(initialValue, config) {
145
- var _a;
146
- var _isInitial = React.useRef(true);
147
- var _initialValue = getValue(initialValue);
148
- var animationType = (_a = config === null || config === void 0 ? void 0 : config.animationType) !== null && _a !== void 0 ? _a : "ease"; // Defines default animation
149
- var onAnimationEnd = config === null || config === void 0 ? void 0 : config.onAnimationEnd;
150
- var listener = config === null || config === void 0 ? void 0 : config.listener;
151
- var _b = __read(reMotion.useTransition(_initialValue, __assign(__assign(__assign({}, getInitialConfig(animationType)), config), { onRest: function (result) {
152
- if (result.finished) {
153
- onAnimationEnd && onAnimationEnd(result.value);
154
- }
155
- }, onChange: function (value) {
156
- listener && listener(value);
157
- } })), 2), animation = _b[0], setAnimation = _b[1];
158
- // doesn't fire on initial render
159
- React.useEffect(function () {
160
- if (!_isInitial.current) {
161
- setAnimation({ toValue: _initialValue });
162
- }
163
- _isInitial.current = false;
164
- }, [_initialValue]);
98
+ var _a = __read(reMotion.useTransition(initialValue, config), 2), animation = _a[0], setAnimation = _a[1];
165
99
  var targetObject = {
166
100
  value: animation,
167
101
  currentValue: animation.get(),
168
102
  };
169
103
  return new Proxy(targetObject, {
170
104
  set: function (_, key, value) {
171
- if (key === "value") {
172
- if (typeof value === "number" || typeof value === "string") {
105
+ if (key === 'value') {
106
+ if (typeof value === 'number' || typeof value === 'string') {
173
107
  setAnimation({ toValue: value });
174
108
  }
175
- else if (typeof value === "object") {
176
- setAnimation({
177
- toValue: value.toValue,
178
- config: { immediate: value.immediate },
179
- });
109
+ else if (typeof value === 'object' || typeof value === 'function') {
110
+ setAnimation(value);
180
111
  }
181
112
  return true;
182
113
  }
183
- throw new Error("You cannot set any other property to animation node.");
114
+ throw new Error('You cannot set any other property to animation node.');
184
115
  },
185
116
  get: function (_, key) {
186
- if (key === "value") {
117
+ if (key === 'value') {
187
118
  return animation;
188
119
  }
189
- if (key === "currentValue") {
120
+ if (key === 'currentValue') {
190
121
  return animation.get();
191
122
  }
192
- throw new Error("You cannot access any other property from animation node.");
123
+ throw new Error('You cannot access any other property from animation node.');
193
124
  },
194
125
  });
195
126
  }
@@ -198,28 +129,23 @@ function useAnimatedValue(initialValue, config) {
198
129
  * useMountedValue handles mounting and unmounting of a component
199
130
  * @param state - boolean
200
131
  * @param config - useTransitionConfig
201
- * @returns mountedValueFunction with a callback with argument ( animationNode, mounted )
132
+ * @returns mountedValueFunction with a callback with argument ( { value: animationNode }, mounted )
202
133
  */
203
134
  function useMountedValue(state, config) {
204
- var _a, _b, _c, _d, _e, _f;
205
- var _g = __read(React.useState(true), 2), initial = _g[0], setInitial = _g[1];
206
- var _h = __read(React.useState(state), 2), mounted = _h[0], setMounted = _h[1];
207
- var _j = React.useRef(config).current, from = _j.from, enter = _j.enter, exit = _j.exit, _config = _j.config;
208
- var _k = __read(reMotion.useTransition(from, _config), 2), animation = _k[0], setAnimation = _k[1];
209
- var enterDuration = (_b = (_a = config.config) === null || _a === void 0 ? void 0 : _a.enterDuration) !== null && _b !== void 0 ? _b : (_c = config.config) === null || _c === void 0 ? void 0 : _c.duration;
210
- var exitDuration = (_e = (_d = config.config) === null || _d === void 0 ? void 0 : _d.exitDuration) !== null && _e !== void 0 ? _e : (_f = config.config) === null || _f === void 0 ? void 0 : _f.exitDuration;
135
+ var initial = React.useRef(true);
136
+ var _a = __read(React.useState(state), 2), mounted = _a[0], setMounted = _a[1];
137
+ var _b = React.useRef(config).current, from = _b.from, enter = _b.enter, exit = _b.exit, innerConfig = _b.config, enterConfig = _b.enterConfig, exitConfig = _b.exitConfig;
138
+ var _c = __read(reMotion.useTransition(from, innerConfig), 2), animation = _c[0], setAnimation = _c[1];
211
139
  React.useEffect(function () {
212
140
  if (state) {
213
- setInitial(true);
141
+ initial.current = true;
214
142
  setMounted(true);
215
143
  }
216
144
  else {
217
- setInitial(false);
145
+ initial.current = false;
218
146
  setAnimation({
219
147
  toValue: exit,
220
- config: {
221
- duration: exitDuration,
222
- },
148
+ config: exitConfig,
223
149
  }, function (_a) {
224
150
  var finished = _a.finished;
225
151
  if (finished) {
@@ -229,17 +155,13 @@ function useMountedValue(state, config) {
229
155
  }
230
156
  }, [state]);
231
157
  React.useEffect(function () {
232
- if (mounted && initial) {
158
+ if (mounted && initial.current) {
233
159
  setAnimation({
234
160
  toValue: enter,
235
- config: {
236
- duration: enterDuration,
237
- },
238
- }, function () {
239
- return;
161
+ config: enterConfig,
240
162
  });
241
163
  }
242
- }, [mounted, initial]);
164
+ }, [mounted, initial.current]);
243
165
  return function (callback) {
244
166
  return callback({ value: animation }, mounted);
245
167
  };
@@ -254,15 +176,15 @@ function makeAnimatedComponent(WrappedComponent) {
254
176
  /**
255
177
  * AnimatedBlock : Animated Div
256
178
  */
257
- var AnimatedBlock = reMotion.makeAnimatedComponent("div");
179
+ var AnimatedBlock = reMotion.makeAnimatedComponent('div');
258
180
  /**
259
181
  * AnimatedInline : Animated Span
260
182
  */
261
- var AnimatedInline = reMotion.makeAnimatedComponent("span");
183
+ var AnimatedInline = reMotion.makeAnimatedComponent('span');
262
184
  /**
263
185
  * AnimatedImage : Animated Image
264
186
  */
265
- var AnimatedImage = reMotion.makeAnimatedComponent("img");
187
+ var AnimatedImage = reMotion.makeAnimatedComponent('img');
266
188
  /**
267
189
  * ScrollableBlock
268
190
  * Used to animate element when enter into viewport
@@ -270,7 +192,7 @@ var AnimatedImage = reMotion.makeAnimatedComponent("img");
270
192
  * animated value goes from 0 to 1 when appear on viewport & vice versa.
271
193
  */
272
194
  var ScrollableBlock = function (props) {
273
- var children = props.children, _a = props.direction, direction = _a === void 0 ? "single" : _a, animationConfig = props.animationConfig, _b = props.threshold, threshold = _b === void 0 ? 0.2 : _b;
195
+ var children = props.children, _a = props.direction, direction = _a === void 0 ? 'single' : _a, animationConfig = props.animationConfig, _b = props.threshold, threshold = _b === void 0 ? 0.2 : _b;
274
196
  var scrollableBlockRef = React.useRef(null);
275
197
  var animation = useAnimatedValue(0, animationConfig); // 0: not intersecting | 1: intersecting
276
198
  React.useEffect(function () {
@@ -282,7 +204,7 @@ var ScrollableBlock = function (props) {
282
204
  animation.value = 1;
283
205
  }
284
206
  else {
285
- if (direction === "both")
207
+ if (direction === 'both')
286
208
  animation.value = 0;
287
209
  }
288
210
  }, {
@@ -307,10 +229,34 @@ var ScrollableBlock = function (props) {
307
229
  */
308
230
  var MountedBlock = function (_a) {
309
231
  var state = _a.state, children = _a.children, config = _a.config;
310
- var open = useMountedValue(state, { from: 0, enter: 1, exit: 0, config: config });
232
+ var open = useMountedValue(state, config);
311
233
  return React.createElement(React.Fragment, null, open(function (animation, mounted) { return mounted && children(animation); }));
312
234
  };
313
235
 
236
+ var getInitialConfig = function (animationType) {
237
+ switch (animationType) {
238
+ case 'elastic':
239
+ return { mass: 1, friction: 18, tension: 250 };
240
+ case 'stiff':
241
+ return { mass: 1, friction: 18, tension: 350 };
242
+ case 'wooble':
243
+ return { mass: 1, friction: 8, tension: 250 };
244
+ case 'bounce':
245
+ return { duration: 500, easing: reMotion.Easing.bounce };
246
+ case 'ease':
247
+ default:
248
+ return { mass: 1, friction: 26, tension: 170 };
249
+ }
250
+ };
251
+
252
+ var AnimationConfigUtils = {
253
+ ELASTIC: getInitialConfig('elastic'),
254
+ BOUNCE: getInitialConfig('bounce'),
255
+ EASE: getInitialConfig('ease'),
256
+ STIFF: getInitialConfig('stiff'),
257
+ WOOBLE: getInitialConfig('wooble'),
258
+ };
259
+
314
260
  /**
315
261
  * Attach single document / window event / HTMLElement
316
262
  */
@@ -1170,15 +1116,21 @@ Object.defineProperty(exports, 'Easing', {
1170
1116
  return reMotion.Easing;
1171
1117
  }
1172
1118
  });
1119
+ Object.defineProperty(exports, 'interpolate', {
1120
+ enumerable: true,
1121
+ get: function () {
1122
+ return reMotion.interpolate;
1123
+ }
1124
+ });
1173
1125
  exports.AnimatedBlock = AnimatedBlock;
1174
1126
  exports.AnimatedImage = AnimatedImage;
1175
1127
  exports.AnimatedInline = AnimatedInline;
1128
+ exports.AnimationConfigUtils = AnimationConfigUtils;
1176
1129
  exports.MountedBlock = MountedBlock;
1177
1130
  exports.ScrollableBlock = ScrollableBlock;
1178
1131
  exports.bInterpolate = bInterpolate;
1179
1132
  exports.bin = bin;
1180
1133
  exports.clamp = clamp;
1181
- exports.interpolate = interpolate;
1182
1134
  exports.makeAnimatedComponent = makeAnimatedComponent;
1183
1135
  exports.mix = mix;
1184
1136
  exports.move = move;