react-ui-animate 2.0.0-rc.7 → 3.0.0-rc.0

package/dist/animation/core/helpers/camelToDash.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Function to convert camel case to dashed case
+ * eg: backgroundColor -> background-color
+ *
+ * @param str
+ */
+export declare function camelToDash(str: string): string;

package/dist/animation/core/helpers/canInterpolate.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Determines if two values can be interpolated.
+ * This function checks if two values, either numbers or strings,
+ * can be interpolated by ensuring they are of the same type and, in the case of strings,
+ * that they are compatible for interpolation based on processed color values.
+ *
+ * @param previousValue - The previous value to compare. Can be a number or a string.
+ * @param newValue - The new value to compare. Can be a number or a string.
+ * @returns True if interpolation is possible, false otherwise.
+ */
+export declare function canInterpolate(previousValue: number | string, newValue: number | string): boolean;

package/dist/animation/core/helpers/getAnimatableObject.d.ts

@@ -0,0 +1,22 @@
+import type { ExtrapolateConfig } from '../interpolation/Interpolation';
+import { FluidValue } from '../controllers/FluidValue';
+type PropertyType = 'style' | 'props';
+export type AnimationObject = {
+    propertyType: PropertyType;
+    property: string;
+    animatable: boolean;
+    isInterpolation: boolean;
+    interpolationConfig: {
+        inputRange: Array<number>;
+        outputRange: Array<number | string>;
+        extrapolateConfig?: ExtrapolateConfig;
+    };
+} & FluidValue;
+/**
+ * Function to get the array of animatable objects
+ * @param propertyType - which property type "props" or "style"
+ */
+export declare function getAnimatableObject(propertyType: PropertyType, propertiesObject: {
+    [key: string]: any;
+}): Array<AnimationObject>;
+export {};

package/dist/animation/core/helpers/getCleanProps.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Filters out properties with fluid values from a given props object.
+ * This function removes any properties that are considered fluid values,
+ * typically those that subscribe to updates and therefore should not be
+ * included in a static props object.
+ *
+ * @param props - The original props object, which may include fluid values.
+ * @returns A new props object with fluid values removed.
+ */
+export declare const getCleanProps: ({ style, ...props }: any) => any;

package/dist/animation/core/helpers/getCssValue.d.ts

@@ -0,0 +1,8 @@
+/**
+ * getCssValue() function to get css value with unit or without unit
+ * it is only for style property - it cannot be used with transform keys
+ * @param property - style property
+ * @param value - style value
+ * @returns - value with unit or without unit
+ */
+export declare function getCssValue(property: string, value: number | string): string | number;

package/dist/animation/core/helpers/getNonAnimatableStyle.d.ts

@@ -0,0 +1,6 @@
+/**
+ * getNonAnimatableStyle function returns the non-animatable style object
+ * @param style - CSSProperties
+ * @returns - non-animatable CSSProperties
+ */
+export declare function getNonAnimatableStyle(style: React.CSSProperties, transformObjectRef: React.MutableRefObject<any>): any;

package/dist/animation/core/helpers/index.d.ts

@@ -0,0 +1,5 @@
+export * from './getCleanProps';
+export * from './getCssValue';
+export * from './isDefined';
+export * from './isFluidValue';
+export * from './camelCaseToKebabCase';

package/dist/animation/core/helpers/isDefined.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Checks if a value is defined (not null or undefined).
+ *
+ * This utility function helps in determining whether a given value is neither `null` nor `undefined`.
+ * It can be useful for validation checks to ensure that a value is properly defined before proceeding
+ * with further operations.
+ *
+ * @param {T} value - The value to check.
+ * @returns {boolean} - Returns `true` if the value is neither `null` nor `undefined`, otherwise returns `false`.
+ *
+ */
+export declare const isDefined: <T>(value: T) => value is T & {};

package/dist/animation/core/helpers/isFluidValue.d.ts

@@ -0,0 +1,6 @@
+/**
+ * isFluidValue to check the value is FluidValue or not
+ * @param value - any
+ * @returns - boolean
+ */
+export declare const isFluidValue: (value: any) => any;

package/dist/animation/core/index.d.ts

@@ -0,0 +1,11 @@
+export { fluid } from './react/fluid';
+export { makeFluid } from './react/makeFluid';
+export { useFluidValue } from './react/useFluidValue';
+export { useMount } from './react/useMount';
+export { isFluidValue } from './helpers/isFluidValue';
+export { Easing } from './easing/Easing';
+export { interpolate } from './interpolation/Interpolation';
+export { FluidValue } from './controllers/FluidValue';
+export type { FluidValueConfig } from './types/animation';
+export type { UseMountConfig } from './react/useMount';
+export type { ExtrapolateConfig } from './interpolation/Interpolation';

package/dist/animation/core/interpolation/Colors.d.ts

@@ -0,0 +1,25 @@
+export declare const COLOR_NUMBER_REGEX: RegExp;
+export declare const HEX_NAME_COLOR: RegExp;
+interface classNameType {
+    [name: string]: string;
+}
+export declare const colorNames: classNameType;
+export declare function hexToRgba(hex: string): {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+};
+export declare function rgbaToHex(rgba: {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+}): string;
+export declare function processColor(color: number | string): {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+};
+export {};

package/dist/animation/core/interpolation/Interpolation.d.ts

@@ -0,0 +1,80 @@
+import { FluidValue } from '../controllers/FluidValue';
+type ExtrapolateType = 'identity' | 'extend' | 'clamp';
+export declare const _getTemplateString: (str: string) => string;
+/**
+ * Function returns if the template of two strings are matched
+ * i.e. they can be interpolated
+ * @param str1 - first string
+ * @param str2 - second string
+ * @returns boolean indicating two strings matched or not
+ */
+export declare const stringMatched: (str1: string, str2: string) => boolean;
+/**
+ * Function which proccess the
+ * hexadecimal colors to its proper formats
+ * @param str - string
+ * @returns hex color string
+ */
+export declare const getProcessedColor: (str: string) => string;
+export interface ExtrapolateConfig {
+    extrapolate?: ExtrapolateType;
+    extrapolateRight?: ExtrapolateType;
+    extrapolateLeft?: ExtrapolateType;
+}
+/**
+ * interpolateNumbers to interpolate the numeric value
+ * @param value - number
+ * @param inputRange
+ * @param outputRange
+ * @param extrapolateConfig
+ * @returns - number | string
+ */
+export declare function interpolateNumbers(value: number, inputRange: Array<number>, outputRange: Array<number | string>, extrapolateConfig?: ExtrapolateConfig): any;
+/**
+ * interpolateTransitionValue to interpolating TransitionValue type value
+ * @param value
+ * @param inputRange
+ * @param outputRange
+ * @param extrapolateConfig
+ * @returns TransitionValue
+ */
+export declare const interpolateTransitionValue: (value: FluidValue, inputRange: Array<number>, outputRange: Array<number | string>, extrapolateConfig?: ExtrapolateConfig) => {
+    isInterpolation: boolean;
+    interpolationConfig: {
+        inputRange: number[];
+        outputRange: (string | number)[];
+        extrapolateConfig: ExtrapolateConfig | undefined;
+    };
+    _subscribe: import("../types/animation").SubscribeFn;
+    _value: import("../types/animation").Length;
+    _config?: import("..").FluidValueConfig;
+    _currentValue: {
+        current: import("../types/animation").Length;
+    };
+    _subscriptions: Map<{
+        uuid: number;
+        property: string;
+    }, import("../types/animation").OnUpdateFn>;
+    get: () => import("../types/animation").Length;
+};
+/**
+ * interpolate function to interpolate both transition
+ * as well as numerical value
+ * @param value
+ * @param inputRange
+ * @param outputRange
+ * @param extrapolateConfig
+ */
+export declare const interpolate: (value: number | FluidValue, inputRange: Array<number>, outputRange: Array<number | string>, extrapolateConfig?: ExtrapolateConfig) => any;
+/**
+ * Determines if two values can be interpolated.
+ * This function checks if two values, either numbers or strings,
+ * can be interpolated by ensuring they are of the same type and, in the case of strings,
+ * that they are compatible for interpolation based on processed color values.
+ *
+ * @param previousValue - The previous value to compare. Can be a number or a string.
+ * @param newValue - The new value to compare. Can be a number or a string.
+ * @returns True if interpolation is possible, false otherwise.
+ */
+export declare function canInterpolate(previousValue: number | string, newValue: number | string): boolean;
+export {};

package/dist/animation/core/interpolation/__tests__/Colors.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/animation/core/react/Tags.d.ts

@@ -0,0 +1,3 @@
+type HTMLTags = keyof JSX.IntrinsicElements;
+export declare const tags: HTMLTags[];
+export {};

package/dist/animation/core/react/TransformStyles.d.ts

@@ -0,0 +1,8 @@
+/**
+ * style keys which can be accepted by animated component
+ */
+export declare const styleTrasformKeys: readonly ["perspective", "translate", "translateX", "translateY", "translateZ", "scale", "scaleX", "scaleY", "scaleZ", "rotate", "rotateX", "rotateY", "rotateZ", "skew", "skewX", "skewY"];
+/**
+ * getTransform function returns transform string from style object
+ */
+export declare function getTransform(style: any): any;

package/dist/animation/core/react/animated.d.ts

@@ -0,0 +1,29 @@
+import { FluidValue } from '../types';
+import { styleTrasformKeys } from './TransformStyles';
+export type AnimatedCSSProperties = {
+    [key in keyof React.CSSProperties]: React.CSSProperties[key] | any;
+} & {
+    [key in (typeof styleTrasformKeys)[number]]?: number | string | FluidValue | any;
+};
+export type AnimatedHTMLAttributes<T> = {
+    [property in keyof React.HTMLAttributes<T>]: React.HTMLAttributes<T>[property] | FluidValue | any;
+};
+export type AnimatedSVGAttributes<T> = {
+    [property in keyof React.SVGAttributes<T>]: React.SVGAttributes<T>[property] | FluidValue | any;
+};
+export type AnimatedProps<T> = Omit<AnimatedHTMLAttributes<T> & AnimatedSVGAttributes<T>, 'style'> & {
+    style?: AnimatedCSSProperties;
+};
+type WrappedComponentOrTag = React.ComponentType<any> | keyof JSX.IntrinsicElements;
+/**
+ * Higher order component to make any component animatable
+ * @param WrapperComponent
+ */
+export declare function makeAnimatedComponent<C extends WrappedComponentOrTag>(WrapperComponent: C): import("react").ForwardRefExoticComponent<Omit<AnimatedHTMLAttributes<C> & AnimatedSVGAttributes<C>, "style"> & {
+    style?: AnimatedCSSProperties;
+} & import("react").RefAttributes<unknown>>;
+type WithAnimated = {
+    [element in keyof JSX.IntrinsicElements]: React.ComponentType<AnimatedProps<element>>;
+} & any;
+export declare const animated: WithAnimated;
+export {};

package/dist/animation/core/react/combineRefs.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from 'react';
+export declare function combineRefs(...refs: Array<RefObject<any> | ((element: HTMLElement) => void)>): (element: HTMLElement) => void;

package/dist/animation/core/react/fluid.d.ts

@@ -0,0 +1,6 @@
+import type { FluidProps } from '../types/fluid';
+type WithFluid = {
+    [k in keyof JSX.IntrinsicElements]: React.ComponentType<FluidProps<HTMLElement>>;
+};
+export declare const fluid: WithFluid;
+export {};

package/dist/animation/core/react/functions/camelToDash.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Function to convert camel case to dashed case
+ * eg: backgroundColor -> background-color
+ *
+ * @param str
+ */
+export declare function camelToDash(str: string): string;

package/dist/animation/core/react/functions/getAnimatableObject.d.ts

@@ -0,0 +1,22 @@
+import type { ExtrapolateConfig } from '../../interpolation/Interpolation';
+import type { FluidValue } from '../../types';
+type PropertyType = 'style' | 'props';
+export type AnimationObject = {
+    propertyType: PropertyType;
+    property: string;
+    animatable: boolean;
+    isInterpolation: boolean;
+    interpolationConfig: {
+        inputRange: Array<number>;
+        outputRange: Array<number | string>;
+        extrapolateConfig?: ExtrapolateConfig;
+    };
+} & FluidValue;
+/**
+ * Function to get the array of animatable objects
+ * @param propertyType - which property type "props" or "style"
+ */
+export declare function getAnimatableObject(propertyType: PropertyType, propertiesObject: {
+    [key: string]: any;
+}): Array<AnimationObject>;
+export {};

package/dist/animation/core/react/functions/getCleanProps.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Function to get clean props object without any subscribers
+ */
+export declare const getCleanProps: (props: any) => any;

package/dist/animation/core/react/functions/getCssValue.d.ts

@@ -0,0 +1,8 @@
+/**
+ * getCssValue() function to get css value with unit or without unit
+ * it is only for style property - it cannot be used with transform keys
+ * @param property - style property
+ * @param value - style value
+ * @returns - value with unit or without unit
+ */
+export declare function getCssValue(property: string, value: number | string): string | number;

package/dist/animation/core/react/functions/getNonAnimatableStyle.d.ts

@@ -0,0 +1,6 @@
+/**
+ * getNonAnimatableStyle function returns the non-animatable style object
+ * @param style - CSSProperties
+ * @returns - non-animatable CSSProperties
+ */
+export declare function getNonAnimatableStyle(style: React.CSSProperties, transformObjectRef: React.MutableRefObject<any>): any;

package/dist/animation/core/react/functions/index.d.ts

@@ -0,0 +1,7 @@
+export * from './getAnimatableObject';
+export * from './getNonAnimatableStyle';
+export * from './getCleanProps';
+export * from './getCssValue';
+export * from './isDefined';
+export * from './isTransitionValue';
+export * from './camelToDash';

package/dist/animation/core/react/functions/isDefined.d.ts

@@ -0,0 +1,6 @@
+/**
+ * isDefined to check the value is defined or not
+ * @param value - any
+ * @returns - boolean
+ */
+export declare const isDefined: <T>(value: T) => value is T & {};

package/dist/animation/core/react/functions/isTransitionValue.d.ts

@@ -0,0 +1,6 @@
+/**
+ * isTransitionValue to check the value is TransitionValue or not
+ * @param value - any
+ * @returns - boolean
+ */
+export declare const isTransitionValue: (value: any) => any;

package/dist/animation/core/react/helpers/camelToDash.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Function to convert camel case to dashed case
+ * eg: backgroundColor -> background-color
+ *
+ * @param str
+ */
+export declare function camelToDash(str: string): string;

package/dist/animation/core/react/helpers/canInterpolate.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Determines if two values can be interpolated.
+ * @param previousValue - The previous value to compare.
+ * @param newValue - The new value to compare.
+ * @returns True if interpolation is possible, false otherwise.
+ */
+export declare function canInterpolate(previousValue: number | string, newValue: number | string): boolean;

package/dist/animation/core/react/helpers/getAnimatableObject.d.ts

@@ -0,0 +1,22 @@
+import type { ExtrapolateConfig } from '../../interpolation/Interpolation';
+import { FluidValue } from '../../controllers/FluidValue';
+type PropertyType = 'style' | 'props';
+export type AnimationObject = {
+    propertyType: PropertyType;
+    property: string;
+    animatable: boolean;
+    isInterpolation: boolean;
+    interpolationConfig: {
+        inputRange: Array<number>;
+        outputRange: Array<number | string>;
+        extrapolateConfig?: ExtrapolateConfig;
+    };
+} & FluidValue;
+/**
+ * Function to get the array of animatable objects
+ * @param propertyType - which property type "props" or "style"
+ */
+export declare function getAnimatableObject(propertyType: PropertyType, propertiesObject: {
+    [key: string]: any;
+}): Array<AnimationObject>;
+export {};

package/dist/animation/core/react/helpers/getCleanProps.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Function to get clean props object without any subscribers
+ */
+export declare const getCleanProps: (props: any) => any;

package/dist/animation/core/react/helpers/getCssValue.d.ts

@@ -0,0 +1,8 @@
+/**
+ * getCssValue() function to get css value with unit or without unit
+ * it is only for style property - it cannot be used with transform keys
+ * @param property - style property
+ * @param value - style value
+ * @returns - value with unit or without unit
+ */
+export declare function getCssValue(property: string, value: number | string): string | number;

package/dist/animation/core/react/helpers/getNonAnimatableStyle.d.ts

@@ -0,0 +1,6 @@
+/**
+ * getNonAnimatableStyle function returns the non-animatable style object
+ * @param style - CSSProperties
+ * @returns - non-animatable CSSProperties
+ */
+export declare function getNonAnimatableStyle(style: React.CSSProperties, transformObjectRef: React.MutableRefObject<any>): any;

package/dist/animation/core/react/helpers/index.d.ts

@@ -0,0 +1,7 @@
+export * from './getAnimatableObject';
+export * from './getNonAnimatableStyle';
+export * from './getCleanProps';
+export * from './getCssValue';
+export * from './isDefined';
+export * from './isFluidValue';
+export * from './camelToDash';

package/dist/animation/core/react/helpers/isDefined.d.ts

@@ -0,0 +1,6 @@
+/**
+ * isDefined to check the value is defined or not
+ * @param value - any
+ * @returns - boolean
+ */
+export declare const isDefined: <T>(value: T) => value is T & {};

package/dist/animation/core/react/helpers/isFluidValue.d.ts

@@ -0,0 +1,6 @@
+/**
+ * isFluidValue to check the value is FluidValue or not
+ * @param value - any
+ * @returns - boolean
+ */
+export declare const isFluidValue: (value: any) => any;

package/dist/animation/core/react/helpers/isTransitionValue.d.ts

@@ -0,0 +1,6 @@
+/**
+ * isTransitionValue to check the value is TransitionValue or not
+ * @param value - any
+ * @returns - boolean
+ */
+export declare const isTransitionValue: (value: any) => any;

package/dist/animation/core/react/makeFluid.d.ts

@@ -0,0 +1,30 @@
+import type { WrappedComponentOrTag } from '../types/fluid';
+/**
+ * Higher-order component to make any component animatable.
+ *
+ * This function takes a React component or an HTML tag and returns a new component
+ * that can smoothly transition between states using fluid animations. It enhances
+ * the user experience by adding dynamic and engaging animations to the wrapped component.
+ *
+ * @param WrapperComponent - The React component or HTML tag to be wrapped with animation functionality.
+ * @returns - A new component with added animation capabilities.
+ *
+ * The returned component uses fluid animations to smoothly transition between different
+ * states. It supports both style and prop animations, handling transforms and other
+ * properties seamlessly. The component ensures that animations are efficiently applied
+ * and updated based on the current state and configuration of fluid values.
+ *
+ * @example
+ * const AnimatedDiv = makeFluid('div');
+ *
+ * const MyComponent = () => {
+ *  const opacity = useAnimatedValue(1)
+ *  return (
+ *   <AnimatedDiv style={{ opacity: opacity.value }}>
+ *     Hello, world!
+ *   </AnimatedDiv>
+ * )};
+ */
+export declare function makeFluid<C extends WrappedComponentOrTag>(WrapperComponent: C): import("react").ForwardRefExoticComponent<Omit<import("../types/fluid").FluidHTMLAttributes<C> & import("../types/fluid").FluidSVGAttributes<C>, "style"> & {
+    style?: import("../types/fluid").FluidCSSProperties;
+} & import("react").RefAttributes<unknown>>;

package/dist/animation/core/react/transforms.d.ts

@@ -0,0 +1,6 @@
+export declare const styleTrasformKeys: readonly ["translate", "translateX", "translateY", "translateZ", "scale", "scaleX", "scaleY", "scaleZ", "rotate", "rotateX", "rotateY", "rotateZ", "skew", "skewX", "skewY"];
+/**
+ * getTransform function returns transform string from style object
+ */
+export declare function getTransform(style: Record<string, any>): string;
+export declare function isTransformKey(key: string): boolean;

package/dist/animation/core/react/useFluidValue.d.ts

@@ -0,0 +1,9 @@
+import { FluidValue } from '../controllers/FluidValue';
+import type { FluidValueConfig, Length, AssignValue, OnUpdateCallback } from '../types/animation';
+/**
+ * useFluidValue
+ *
+ * @param value - initial value
+ * @param config - the config object for `FluidValue`
+ */
+export declare const useFluidValue: (value: Length, config?: FluidValueConfig) => [FluidValue, (updateValue: AssignValue, config?: FluidValueConfig, callback?: OnUpdateCallback) => void];

package/dist/animation/core/react/useMount.d.ts

@@ -0,0 +1,20 @@
+import { FluidValue } from '../controllers/FluidValue';
+import type { AssignValue, FluidValueConfig } from '../types/animation';
+export interface UseMountConfig {
+    from: number;
+    enter: number | AssignValue;
+    exit: number | AssignValue;
+    enterConfig?: FluidValueConfig;
+    exitConfig?: FluidValueConfig;
+    config?: FluidValueConfig;
+}
+/**
+ * `useMount`
+ *
+ * applies mounting and unmounting of a component according to state change
+ * applying transitions
+ *
+ * @param state - boolean indicating mount state of a component
+ * @param config - the config object `UseMountConfig`
+ */
+export declare const useMount: (state: boolean, config: UseMountConfig) => (callback: (animation: FluidValue, mounted: boolean) => React.ReactNode) => import("react").ReactNode;

package/dist/animation/core/react/useMounts.d.ts

@@ -0,0 +1,26 @@
+import { TransitionValue } from '../animation/TransitionValue';
+import type { AssignValue, Length, TransitionValueConfig } from '../types/animation';
+export interface UseMountsConfig<T> {
+    from: T;
+    enter: Partial<{
+        [key in keyof T]: AssignValue;
+    }>;
+    exit: Partial<{
+        [key in keyof T]: AssignValue;
+    }>;
+    enterConfig?: TransitionValueConfig;
+    exitConfig?: TransitionValueConfig;
+    config?: TransitionValueConfig;
+}
+/**
+ * `useMounts`
+ *
+ * applies mounting and unmounting of a component according to state change
+ * applying transitions for multiple keys
+ *
+ * @param state - boolean indicating mount state of a component
+ * @param config - the config object `UseMountsConfig`
+ */
+export declare const useMounts: <T extends {
+    [key: string]: Length;
+}>(state: boolean, config: UseMountsConfig<T>) => (callback: (animation: { [key in keyof T]?: TransitionValue; }, mounted: boolean) => React.ReactNode) => import("react").ReactNode;

package/dist/animation/core/react/useTransition.d.ts

@@ -0,0 +1,9 @@
+import { FluidValue } from '../controllers/FluidValue';
+import type { FluidValueConfig, Length, AssignValue, OnUpdateCallback } from '../types/animation';
+/**
+ * useTransition
+ *
+ * @param value - initial value
+ * @param config - the config object for `FluidValue`
+ */
+export declare const useTransition: (value: Length, config?: FluidValueConfig) => [FluidValue, (updateValue: AssignValue, config?: FluidValueConfig, callback?: OnUpdateCallback) => void];

package/dist/animation/core/react/useTransitions.d.ts

@@ -0,0 +1,11 @@
+import { TransitionValue } from '../animation/TransitionValue';
+import type { TransitionValueConfig, Length, AssignValue, OnUpdateCallback } from '../types/animation';
+/**
+ * useTransitions hook for multiple values transition
+ *
+ * @param values - object with different keys
+ * @param config - the config object for `TransitionValue`
+ */
+export declare const useTransitions: <T extends {
+    [key: string]: Length;
+}>(values: T, config?: TransitionValueConfig) => [{ [key in keyof T]?: TransitionValue; }, (updateValues: Partial<{ [key in keyof T]?: AssignValue; }>, config?: TransitionValueConfig, callback?: OnUpdateCallback) => void];

package/dist/animation/core/types/animation.d.ts

@@ -0,0 +1,54 @@
+import type { Fn } from './common';
+/**
+ * Base unit which is accepted by `TransitionValue`
+ */
+export type Length = number | string;
+/**
+ * Object passed as an argument on `onRest` function
+ */
+export type ResultType = {
+    finished: boolean;
+    value: number;
+};
+/**
+ * Function read by `animated` hoc to determine whether it
+ * can be animated or not
+ */
+export type SubscribeFn = (onUpdate: OnUpdateFn, property: string, uuid: number) => void;
+/**
+ * Configuration object for `TransitionValue`
+ */
+export interface TransitionValueConfig {
+    mass?: number;
+    tension?: number;
+    friction?: number;
+    duration?: number;
+    easing?: Fn<number, number>;
+    immediate?: boolean;
+    delay?: number;
+    restDistance?: number;
+    onChange?: Fn<number, void>;
+    onRest?: Fn<ResultType, void>;
+    onStart?: Fn<number, void>;
+}
+/**
+ * FluidValue
+ */
+export type FluidValue = {
+    _subscribe: SubscribeFn;
+    _value: Length;
+    _currentValue: {
+        current: Length;
+    };
+    _config?: TransitionValueConfig;
+    get: () => Length;
+};
+/**
+ * Object which can be assigned to animate
+ */
+export type AssignValue = Length | Fn<(next: Length, config?: TransitionValueConfig) => Promise<any>, void>;
+export type OnUpdateCallback = Fn<ResultType, void>;
+/**
+ * Function to start the animation (it starts the already subscribed animation)
+ */
+export type OnUpdateFn = (updatedValue: AssignValue, config?: TransitionValueConfig, callback?: OnUpdateCallback) => void;

package/dist/animation/core/types/common.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Generic function type argument of type T returns type U
+ */
+export type Fn<T, U> = (value: T) => U;