react-transitions-library - npm Package Compare versions

Comparing version 1.6.4 to 1.7.0

dist/hooks/index.d.ts

 export * from "./use-press";
 export * from "./use-press-state";
-export * from './use-callback-ref';
-export * from './use-css-style';
+export * from "./use-callback-ref";
+export * from "./use-css-style";
+export * from "./use-hover";
 //# sourceMappingURL=index.d.ts.map

dist/hooks/index.js

 export * from "./use-press";
 export * from "./use-press-state";
-export * from './use-callback-ref';
-export * from './use-css-style';
+export * from "./use-callback-ref";
+export * from "./use-css-style";
+export * from "./use-hover";

dist/transitions/backdrop-transition/BackdropTransition.d.ts

@@ -1,2 +0,2 @@
-import { FC } from "react";
+import { ForwardRefExoticComponent } from "react";
 import { TransitionProps } from "../transition/TransitionProps.type";
@@ -12,4 +12,4 @@ declare type BackdropTransitionProps = TransitionProps & {
  * */
-declare const BackdropTransition: FC<BackdropTransitionProps>;
+declare const BackdropTransition: ForwardRefExoticComponent<BackdropTransitionProps>;
 export { BackdropTransition };
 //# sourceMappingURL=BackdropTransition.d.ts.map

dist/transitions/backdrop-transition/BackdropTransition.js

@@ -24,3 +24,3 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { forwardRef, useMemo, } from "react";
 import { useCSSStyle } from "../../hooks";
@@ -32,3 +32,3 @@ import { Transition } from "../transition";
  * */
-var BackdropTransition = function (_a) {
+var BackdropTransition = forwardRef(function (_a, outsideRef) {
     var timeout = _a.timeout, _b = _a.delay, delay = _b === void 0 ? 0 : _b, to = _a.to, _c = _a.ease, ease = _c === void 0 ? "ease" : _c, from = _a.from, backgroundColor = _a.backgroundColor, children = _a.children, props = __rest(_a, ["timeout", "delay", "to", "ease", "from", "backgroundColor", "children"]);
@@ -54,4 +54,4 @@ var defaultStyle = useCSSStyle({
     }); }, [from, to]);
-    return (_jsx(Transition, __assign({}, props, { timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle }, { children: children }), void 0));
-};
+    return (_jsx(Transition, __assign({}, props, { timeout: timeout, ref: outsideRef, defaultStyle: defaultStyle, transitionStyle: transitionStyle }, { children: children }), void 0));
+});
 export { BackdropTransition };

dist/transitions/blur-transition/BlurTransition.d.ts

@@ -1,2 +0,2 @@
-import { FC } from "react";
+import { ForwardRefExoticComponent } from "react";
 import { TransitionProps } from "../transition/TransitionProps.type";
@@ -7,4 +7,4 @@ declare type BlurTransitionProps = TransitionProps & {
 };
-declare const BlurTransition: FC<BlurTransitionProps>;
+declare const BlurTransition: ForwardRefExoticComponent<BlurTransitionProps>;
 export { BlurTransition };
 //# sourceMappingURL=BlurTransition.d.ts.map

dist/transitions/blur-transition/BlurTransition.js

@@ -24,7 +24,7 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { forwardRef, useMemo, } from "react";
 import { Transition } from "../transition";
 import { useCSSStyle } from "../../hooks";
 import { Ease } from "../../ease";
-var BlurTransition = function (_a) {
+var BlurTransition = forwardRef(function (_a, outsideRef) {
     var children = _a.children, timeout = _a.timeout, _b = _a.delay, delay = _b === void 0 ? 0 : _b, from = _a.from, to = _a.to, _c = _a.ease, ease = _c === void 0 ? Ease.ease : _c, props = __rest(_a, ["children", "timeout", "delay", "from", "to", "ease"]);
@@ -49,4 +49,4 @@ var defaultStyle = useCSSStyle({
     }); }, [from, to]);
-    return (_jsx(Transition, __assign({}, props, { timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle }, { children: children }), void 0));
-};
+    return (_jsx(Transition, __assign({}, props, { ref: outsideRef, timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle }, { children: children }), void 0));
+});
 export { BlurTransition };

dist/transitions/fade-in-transition/FadeInTransition.d.ts

 import React from "react";
-declare const FadeInTransition: React.FC<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
+declare const FadeInTransition: React.ForwardRefExoticComponent<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
     from: number;
@@ -4,0 +4,0 @@ to: number;

dist/transitions/fade-out-transition/FadeOutTransition.d.ts

 import React from "react";
-declare const FadeOutTransition: React.FC<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
+declare const FadeOutTransition: React.ForwardRefExoticComponent<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
     from: number;
@@ -4,0 +4,0 @@ to: number;

dist/transitions/index.d.ts

@@ -11,2 +11,4 @@ export * from "./touch-scale-transition";
 export * from "./fade-in-transition";
+export * from "./fade-in-up-transition";
+export * from "./fade-out-down-transition";
 export * from "./css-transition/CSSTransition";
@@ -13,0 +15,0 @@ export * from "./scale-transition";

dist/transitions/index.js

@@ -11,2 +11,4 @@ export * from "./touch-scale-transition";
 export * from "./fade-in-transition";
+export * from "./fade-in-up-transition";
+export * from "./fade-out-down-transition";
 export * from "./css-transition/CSSTransition";
@@ -13,0 +15,0 @@ export * from "./scale-transition";

dist/transitions/opacity-transition/OpacityTransition.d.ts

@@ -1,2 +0,2 @@
-import { FC } from "react";
+import { ForwardRefExoticComponent } from "react";
 import { TransitionProps } from "../transition/TransitionProps.type";
@@ -7,4 +7,4 @@ declare type OpacityTransitionProps = TransitionProps & {
 };
-declare const OpacityTransition: FC<OpacityTransitionProps>;
+declare const OpacityTransition: ForwardRefExoticComponent<OpacityTransitionProps>;
 export { OpacityTransition };
 //# sourceMappingURL=OpacityTransition.d.ts.map

dist/transitions/opacity-transition/OpacityTransition.js

@@ -24,6 +24,6 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { forwardRef, useMemo, } from "react";
 import { Transition } from "../transition/Transition";
 import { Ease } from "../../ease";
-var OpacityTransition = function (_a) {
+var OpacityTransition = forwardRef(function (_a, outsideRef) {
     var children = _a.children, from = _a.from, to = _a.to, _b = _a.delay, delay = _b === void 0 ? 0 : _b, timeout = _a.timeout, _c = _a.ease, ease = _c === void 0 ? Ease.ease : _c, props = __rest(_a, ["children", "from", "to", "delay", "timeout", "ease"]);
@@ -48,4 +48,4 @@ var transitionStyle = useMemo(function () { return ({
     }); }, [timeout, delay, ease]);
-    return (_jsx(Transition, __assign({}, props, { timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "OpacityTransition" }, { children: children }), void 0));
-};
+    return (_jsx(Transition, __assign({}, props, { ref: outsideRef, timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "OpacityTransition" }, { children: children }), void 0));
+});
 export { OpacityTransition };

dist/transitions/shake-in-transition/ShakeInTransition.d.ts

@@ -1,2 +0,2 @@
-import { FC } from "react";
+import { ForwardRefExoticComponent } from "react";
 import { TransitionProps } from "../transition/TransitionProps.type";
@@ -7,4 +7,4 @@ declare type ShakeInTransitionProps = TransitionProps & {
 };
-declare const ShakeInTransition: FC<ShakeInTransitionProps>;
+declare const ShakeInTransition: ForwardRefExoticComponent<ShakeInTransitionProps>;
 export { ShakeInTransition };
 //# sourceMappingURL=ShakeInTransition.d.ts.map

dist/transitions/shake-in-transition/ShakeInTransition.js

@@ -24,3 +24,3 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useMemo } from "react";
+import { forwardRef, useEffect, useMemo, } from "react";
 import { Transition } from "../transition";
@@ -34,3 +34,3 @@ import { Ease } from "../../ease";
 };
-var ShakeInTransition = function (_a) {
+var ShakeInTransition = forwardRef(function (_a, outsideRef) {
     var children = _a.children, from = _a.from, to = _a.to, timeout = _a.timeout, _b = _a.ease, ease = _b === void 0 ? Ease.ease : _b, _c = _a.delay, delay = _c === void 0 ? 0 : _c, props = __rest(_a, ["children", "from", "to", "timeout", "ease", "delay"]);
@@ -61,4 +61,4 @@ var shakeKeyFrame = useMemo(function () { return getShakeKeyframe(from, to); }, [from, to]);
     }); }, [timeout, ease, delay]);
-    return (_jsx(Transition, __assign({}, props, { timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ShakeInTransition" }, { children: children }), void 0));
-};
+    return (_jsx(Transition, __assign({}, props, { ref: outsideRef, timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ShakeInTransition" }, { children: children }), void 0));
+});
 export { ShakeInTransition };

dist/transitions/shake-out-transition/ShakeOutTransition.d.ts

@@ -1,2 +0,2 @@
-import { FC } from "react";
+import { ForwardRefExoticComponent } from "react";
 import { TransitionProps } from "../transition/TransitionProps.type";
@@ -7,4 +7,4 @@ declare type ShakeOutTransitionProps = TransitionProps & {
 };
-declare const ShakeOutTransition: FC<ShakeOutTransitionProps>;
+declare const ShakeOutTransition: ForwardRefExoticComponent<ShakeOutTransitionProps>;
 export { ShakeOutTransition };
 //# sourceMappingURL=ShakeOutTransition.d.ts.map

dist/transitions/shake-out-transition/ShakeOutTransition.js

@@ -24,3 +24,3 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect, useMemo } from "react";
+import { forwardRef, useEffect, useMemo, } from "react";
 import { Transition } from "../transition";
@@ -33,3 +33,3 @@ import { Ease } from "../../ease";
 };
-var ShakeOutTransition = function (_a) {
+var ShakeOutTransition = forwardRef(function (_a, outsideRef) {
     var children = _a.children, from = _a.from, to = _a.to, timeout = _a.timeout, _b = _a.ease, ease = _b === void 0 ? Ease.ease : _b, _c = _a.delay, delay = _c === void 0 ? 0 : _c, props = __rest(_a, ["children", "from", "to", "timeout", "ease", "delay"]);
@@ -60,4 +60,4 @@ var shakeKeyFrame = useMemo(function () { return getShakeKeyframe(from, to); }, [from, to]);
     }); }, [delay, timeout, ease]);
-    return (_jsx(Transition, __assign({}, props, { timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ShakeOutTransition" }, { children: children }), void 0));
-};
+    return (_jsx(Transition, __assign({}, props, { ref: outsideRef, timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ShakeOutTransition" }, { children: children }), void 0));
+});
 export { ShakeOutTransition };

dist/transitions/slide-y-transition/SlideYTransition.d.ts

@@ -1,8 +0,9 @@
-import { FC } from "react";
+import { ForwardRefExoticComponent } from "react";
 import { TransitionProps } from "../transition/TransitionProps.type";
-declare const SlideYTransition: FC<TransitionProps & {
+declare type SlideYTransitionProps = TransitionProps & {
     from: string;
     to: string;
-}>;
+};
+declare const SlideYTransition: ForwardRefExoticComponent<SlideYTransitionProps>;
 export { SlideYTransition };
 //# sourceMappingURL=SlideYTransition.d.ts.map

dist/transitions/slide-y-transition/SlideYTransition.js

@@ -24,7 +24,7 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { forwardRef, useMemo, } from "react";
 import { useCSSStyle } from "../../hooks";
 import { Transition } from "../transition";
 import { Ease } from "../../ease";
-var SlideYTransition = function (_a) {
+var SlideYTransition = forwardRef(function (_a, outsideRef) {
     var children = _a.children, from = _a.from, to = _a.to, _b = _a.ease, ease = _b === void 0 ? Ease.ease : _b, _c = _a.delay, delay = _c === void 0 ? 0 : _c, timeout = _a.timeout, props = __rest(_a, ["children", "from", "to", "ease", "delay", "timeout"]);
@@ -50,4 +50,4 @@ var defaultStyle = useCSSStyle({
     }); }, [from, to]);
-    return (_jsx(Transition, __assign({}, props, { timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ScaleInUpTransition" }, { children: children }), void 0));
-};
+    return (_jsx(Transition, __assign({}, props, { ref: outsideRef, timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ScaleInUpTransition" }, { children: children }), void 0));
+});
 export { SlideYTransition };

dist/transitions/zoom-in-transition/ZoomInTransition.d.ts

 import React from "react";
-declare const ZoomInTransition: React.FC<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
+declare const ZoomInTransition: React.ForwardRefExoticComponent<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
     delay?: number | undefined;
@@ -4,0 +4,0 @@ ease?: string | undefined;

dist/transitions/zoom-out-transition/ZoomOutTransition.d.ts

 import React from "react";
-declare const ZoomOutTransition: React.FC<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
+declare const ZoomOutTransition: React.ForwardRefExoticComponent<import("../transition/TransitionProps.type").TransitionProps<undefined> & {
     delay?: number | undefined;
@@ -4,0 +4,0 @@ ease?: string | undefined;

dist/transitions/zoom-transition/ZoomTransition.d.ts

@@ -1,2 +0,2 @@
-import { FC } from "react";
+import { ForwardRefExoticComponent } from "react";
 import { TransitionProps } from "../transition/TransitionProps.type";
@@ -10,4 +10,4 @@ declare type ZoomTransitionProps = TransitionProps & {
 };
-declare const ZoomTransition: FC<ZoomTransitionProps>;
+declare const ZoomTransition: ForwardRefExoticComponent<ZoomTransitionProps>;
 export { ZoomTransition };
 //# sourceMappingURL=ZoomTransition.d.ts.map

dist/transitions/zoom-transition/ZoomTransition.js

@@ -24,7 +24,7 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { forwardRef, useMemo, } from "react";
 import { Transition } from "../transition/Transition";
 import { useCSSStyle } from "../../hooks/use-css-style";
 import { Ease } from "../../ease";
-var ZoomTransition = function (_a) {
+var ZoomTransition = forwardRef(function (_a, outsideRef) {
     var children = _a.children, _b = _a.delay, delay = _b === void 0 ? 0 : _b, _c = _a.ease, ease = _c === void 0 ? Ease.ease : _c, _d = _a.transformOrigin, transformOrigin = _d === void 0 ? "center" : _d, from = _a.from, to = _a.to, timeout = _a.timeout, props = __rest(_a, ["children", "delay", "ease", "transformOrigin", "from", "to", "timeout"]);
@@ -50,4 +50,4 @@ var defaultStyle = useCSSStyle({
     }); }, [from, to]);
-    return (_jsx(Transition, __assign({}, props, { timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ZoomInTransition" }, { children: children }), void 0));
-};
+    return (_jsx(Transition, __assign({}, props, { ref: outsideRef, timeout: timeout, defaultStyle: defaultStyle, transitionStyle: transitionStyle, className: "ZoomInTransition" }, { children: children }), void 0));
+});
 export { ZoomTransition };

hooks/index.ts

 export * from "./use-press";
 export * from "./use-press-state";
-export * from './use-callback-ref';
-export * from './use-css-style';
+export * from "./use-callback-ref";
+export * from "./use-css-style";
+export * from "./use-hover";

package.json

 {
   "name": "react-transitions-library",
-  "version": "1.6.4",
+  "version": "1.7.0",
   "license": "MIT",
@@ -5,0 +5,0 @@ "description": "A react component library for animations.",

site/pages/index.ts

@@ -8,1 +8,3 @@ export * from "./home";
 export * from "./blur";
+export * from "./fade-in-up";
+export * from "./fade-out-down";

transitions/index.ts

@@ -15,2 +15,4 @@ export * from "./touch-scale-transition";
 export * from "./fade-in-transition";
+export * from "./fade-in-up-transition";
+export * from "./fade-out-down-transition";
 
@@ -17,0 +19,0 @@ export * from "./css-transition/CSSTransition";

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2726520

increased by1.78%

Number of package files

528

increased by9.09%

Lines of code

16571

increased by4.22%

No dependency changes