@onepercentio/one-ui 0.6.0 → 0.6.3

package/dist/components/Parallax/Parallax.js

@@ -1,175 +1,175 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.givenTheRelativePositionHowMuchToRotate = exports.calculateDistanceRelativeToBounds = void 0;
-const react_1 = __importStar(require("react"));
-const Parallax_module_scss_1 = __importDefault(require("./Parallax.module.scss"));
-const lodash_1 = require("lodash");
-const helpers_1 = require("./math/helpers");
-const MAXIMUM_PARALLAX = {
-    x: 20,
-    y: 20,
-};
-function calculateDistanceRelativeToBounds(mousePosition, elementInitialPosition, elementSizeDimension) {
-    const normalizeInitialPosition = mousePosition - elementInitialPosition;
-    const doNotAllowGoingBeyondLowerLimit = Math.max(normalizeInitialPosition, 0);
-    const doNotAllowHoingBeyondHigherLimit = Math.min(doNotAllowGoingBeyondLowerLimit, elementSizeDimension);
-    const threeRule = (doNotAllowHoingBeyondHigherLimit * 100) / elementSizeDimension;
-    const result = Math.round(threeRule) / 100;
-    return result;
-}
-exports.calculateDistanceRelativeToBounds = calculateDistanceRelativeToBounds;
-function givenTheRelativePositionHowMuchToRotate(relativePosition, maxRotation) {
-    return relativePosition * maxRotation - maxRotation / 2;
-}
-exports.givenTheRelativePositionHowMuchToRotate = givenTheRelativePositionHowMuchToRotate;
-/**
- * It holds a children and animates it according to mouse position
- **/
-function Parallax(_a, ref) {
-    var { children, className = "", active, onClick, reflection, maxParallax = MAXIMUM_PARALLAX } = _a, props = __rest(_a, ["children", "className", "active", "onClick", "reflection", "maxParallax"]);
-    const parallaxableRef = (0, react_1.useRef)(null);
-    const reflectionRef = (0, react_1.useRef)(null);
-    const multiplierRef = (0, react_1.useRef)(1);
-    const initialPositionRef = (0, react_1.useRef)();
-    (0, react_1.useEffect)(() => {
-        if (ref)
-            ref.current =
-                parallaxableRef.current;
-        const el = parallaxableRef.current;
-        if (active && !initialPositionRef.current) {
-            initialPositionRef.current = getComputedStyle(el).transform;
-            if (initialPositionRef.current === "none")
-                initialPositionRef.current = "";
-            el.style.transform = `${initialPositionRef.current} rotateX(0deg) rotateY(0deg) translateZ(0px)`;
-        }
-        // eslint-disable-next-line
-    }, [active]);
-    (0, react_1.useEffect)(() => {
-        const el = parallaxableRef.current;
-        if (active) {
-            const updatePositions = (relativeToX, relativeToY) => {
-                const rect = el.getBoundingClientRect();
-                const { width: [x0, xW], height: [y0, yH], } = {
-                    width: [rect.left, el.clientWidth],
-                    height: [rect.top, el.clientHeight],
-                };
-                const distanceOffRight = calculateDistanceRelativeToBounds(relativeToX, x0, xW);
-                const distanceOffBottom = calculateDistanceRelativeToBounds(relativeToY, y0, yH);
-                const howMuchToRotateY = givenTheRelativePositionHowMuchToRotate(distanceOffRight, maxParallax.y) * multiplierRef.current;
-                const howMuchToRotateX = givenTheRelativePositionHowMuchToRotate(distanceOffBottom, maxParallax.x) * multiplierRef.current;
-                const howMuchToOpacify = Math.abs(Math.abs(distanceOffBottom - 0.5) / 0.5);
-                const howMuchToOpacifyHorizontal = Math.max(Math.abs(Math.abs(distanceOffRight - 0.5) / 0.5), Math.abs(Math.abs(distanceOffBottom - 0.5) / 0.5));
-                el.style.transform = `${initialPositionRef.current} rotateY(${howMuchToRotateY}deg) rotateX(${-howMuchToRotateX}deg) translateZ(${multiplierRef.current === 1 ? 0 : -30}px)`;
-                if (reflectionRef.current) {
-                    reflectionRef.current.style.left = `${(1 - distanceOffRight) * 100}%`;
-                    reflectionRef.current.style.top = `${(1 - distanceOffBottom) * 100}%`;
-                    reflectionRef.current.style.opacity = `${Math.min(howMuchToOpacify, howMuchToOpacifyHorizontal)}`;
-                }
-            };
-            const handler = (0, lodash_1.throttle)(({ x, y }) => {
-                updatePositions(x, y);
-            }, 1000 / 30);
-            const touchHandler = (0, lodash_1.throttle)(({ touches }) => {
-                const { pageX, pageY } = touches[0];
-                updatePositions(pageX, pageY);
-            }, 1000 / 30);
-            const mouseDownHandler = () => {
-                multiplierRef.current = 1.5;
-            };
-            const mouseUpHandler = () => {
-                multiplierRef.current = 1;
-            };
-            window.addEventListener("mousemove", handler);
-            window.addEventListener("touchmove", touchHandler);
-            let _inverseMatrix;
-            const _limits = {
-                beta: undefined,
-                gamma: undefined,
-            };
-            const orientationListener = ({ beta, gamma, }) => {
-                beta = beta * 0.5;
-                gamma = gamma * 0.5;
-                if (!_inverseMatrix) {
-                    window.removeEventListener("mousemove", handler);
-                    window.removeEventListener("touchmove", touchHandler);
-                    const offset = 12.5;
-                    _limits.beta = [beta - offset, beta + offset];
-                    _limits.gamma = [gamma - offset, gamma + offset];
-                }
-                const _beta = Math.min(_limits.beta[1], Math.max(_limits.beta[0], beta));
-                const _gamma = Math.min(_limits.gamma[1], Math.max(_limits.gamma[0], gamma));
-                if (!_inverseMatrix) {
-                    _inverseMatrix = (0, helpers_1.flattenMatrix)((0, helpers_1.invertMatrix)((0, helpers_1.generateMatrixFromOperations)({
-                        type: "rotateY",
-                        angle: _gamma,
-                    }, {
-                        type: "rotateX",
-                        angle: -_beta,
-                    })));
-                }
-                el.style.transform = `matrix3d(${_inverseMatrix.join(",")}) rotateX(${-_beta}deg) rotateY(${_gamma}deg)`;
-            };
-            window.addEventListener("deviceorientation", orientationListener);
-            window.addEventListener("touchend", () => {
-                _inverseMatrix = undefined;
-            });
-            el.addEventListener("touchstart", mouseDownHandler);
-            el.addEventListener("touchend", mouseUpHandler);
-            el.addEventListener("mousedown", mouseDownHandler);
-            el.addEventListener("mouseup", mouseUpHandler);
-            return () => {
-                window.removeEventListener("deviceorientation", orientationListener);
-                window.removeEventListener("mousemove", handler);
-                window.removeEventListener("touchmove", touchHandler);
-                el.removeEventListener("mousedown", mouseDownHandler);
-                el.removeEventListener("mouseup", mouseUpHandler);
-                el.removeEventListener("touchstart", mouseDownHandler);
-                el.removeEventListener("touchend", mouseUpHandler);
-                // el.style.transform = initialPositionRef.current!;
-                el.style.transform = `rotateX(0deg) rotateY(0deg) translateZ(0px)`;
-            };
-        }
-    }, [active]);
-    return (react_1.default.createElement("div", Object.assign({ onClick: onClick, ref: parallaxableRef, className: `${Parallax_module_scss_1.default.parallax} ${className}` }, props),
-        children,
-        reflection && react_1.default.createElement("div", { ref: reflectionRef, className: Parallax_module_scss_1.default.reflection })));
-}
-exports.default = (0, react_1.forwardRef)(Parallax);
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.givenTheRelativePositionHowMuchToRotate = exports.calculateDistanceRelativeToBounds = void 0;
+const react_1 = __importStar(require("react"));
+const Parallax_module_scss_1 = __importDefault(require("./Parallax.module.scss"));
+const lodash_1 = require("lodash");
+const helpers_1 = require("./math/helpers");
+const MAXIMUM_PARALLAX = {
+    x: 20,
+    y: 20,
+};
+function calculateDistanceRelativeToBounds(mousePosition, elementInitialPosition, elementSizeDimension) {
+    const normalizeInitialPosition = mousePosition - elementInitialPosition;
+    const doNotAllowGoingBeyondLowerLimit = Math.max(normalizeInitialPosition, 0);
+    const doNotAllowHoingBeyondHigherLimit = Math.min(doNotAllowGoingBeyondLowerLimit, elementSizeDimension);
+    const threeRule = (doNotAllowHoingBeyondHigherLimit * 100) / elementSizeDimension;
+    const result = Math.round(threeRule) / 100;
+    return result;
+}
+exports.calculateDistanceRelativeToBounds = calculateDistanceRelativeToBounds;
+function givenTheRelativePositionHowMuchToRotate(relativePosition, maxRotation) {
+    return relativePosition * maxRotation - maxRotation / 2;
+}
+exports.givenTheRelativePositionHowMuchToRotate = givenTheRelativePositionHowMuchToRotate;
+/**
+ * It holds a children and animates it according to mouse position
+ **/
+function Parallax(_a, ref) {
+    var { children, className = "", active, onClick, reflection, maxParallax = MAXIMUM_PARALLAX } = _a, props = __rest(_a, ["children", "className", "active", "onClick", "reflection", "maxParallax"]);
+    const parallaxableRef = (0, react_1.useRef)(null);
+    const reflectionRef = (0, react_1.useRef)(null);
+    const multiplierRef = (0, react_1.useRef)(1);
+    const initialPositionRef = (0, react_1.useRef)();
+    (0, react_1.useEffect)(() => {
+        if (ref)
+            ref.current =
+                parallaxableRef.current;
+        const el = parallaxableRef.current;
+        if (active && !initialPositionRef.current) {
+            initialPositionRef.current = getComputedStyle(el).transform;
+            if (initialPositionRef.current === "none")
+                initialPositionRef.current = "";
+            el.style.transform = `${initialPositionRef.current} rotateX(0deg) rotateY(0deg) translateZ(0px)`;
+        }
+        // eslint-disable-next-line
+    }, [active]);
+    (0, react_1.useEffect)(() => {
+        const el = parallaxableRef.current;
+        if (active) {
+            const updatePositions = (relativeToX, relativeToY) => {
+                const rect = el.getBoundingClientRect();
+                const { width: [x0, xW], height: [y0, yH], } = {
+                    width: [rect.left, el.clientWidth],
+                    height: [rect.top, el.clientHeight],
+                };
+                const distanceOffRight = calculateDistanceRelativeToBounds(relativeToX, x0, xW);
+                const distanceOffBottom = calculateDistanceRelativeToBounds(relativeToY, y0, yH);
+                const howMuchToRotateY = givenTheRelativePositionHowMuchToRotate(distanceOffRight, maxParallax.y) * multiplierRef.current;
+                const howMuchToRotateX = givenTheRelativePositionHowMuchToRotate(distanceOffBottom, maxParallax.x) * multiplierRef.current;
+                const howMuchToOpacify = Math.abs(Math.abs(distanceOffBottom - 0.5) / 0.5);
+                const howMuchToOpacifyHorizontal = Math.max(Math.abs(Math.abs(distanceOffRight - 0.5) / 0.5), Math.abs(Math.abs(distanceOffBottom - 0.5) / 0.5));
+                el.style.transform = `${initialPositionRef.current} rotateY(${howMuchToRotateY}deg) rotateX(${-howMuchToRotateX}deg) translateZ(${multiplierRef.current === 1 ? 0 : -30}px)`;
+                if (reflectionRef.current) {
+                    reflectionRef.current.style.left = `${(1 - distanceOffRight) * 100}%`;
+                    reflectionRef.current.style.top = `${(1 - distanceOffBottom) * 100}%`;
+                    reflectionRef.current.style.opacity = `${Math.min(howMuchToOpacify, howMuchToOpacifyHorizontal)}`;
+                }
+            };
+            const handler = (0, lodash_1.throttle)(({ x, y }) => {
+                updatePositions(x, y);
+            }, 1000 / 30);
+            const touchHandler = (0, lodash_1.throttle)(({ touches }) => {
+                const { pageX, pageY } = touches[0];
+                updatePositions(pageX, pageY);
+            }, 1000 / 30);
+            const mouseDownHandler = () => {
+                multiplierRef.current = 1.5;
+            };
+            const mouseUpHandler = () => {
+                multiplierRef.current = 1;
+            };
+            window.addEventListener("mousemove", handler);
+            window.addEventListener("touchmove", touchHandler);
+            let _inverseMatrix;
+            const _limits = {
+                beta: undefined,
+                gamma: undefined,
+            };
+            const orientationListener = ({ beta, gamma, }) => {
+                beta = beta * 0.5;
+                gamma = gamma * 0.5;
+                if (!_inverseMatrix) {
+                    window.removeEventListener("mousemove", handler);
+                    window.removeEventListener("touchmove", touchHandler);
+                    const offset = 12.5;
+                    _limits.beta = [beta - offset, beta + offset];
+                    _limits.gamma = [gamma - offset, gamma + offset];
+                }
+                const _beta = Math.min(_limits.beta[1], Math.max(_limits.beta[0], beta));
+                const _gamma = Math.min(_limits.gamma[1], Math.max(_limits.gamma[0], gamma));
+                if (!_inverseMatrix) {
+                    _inverseMatrix = (0, helpers_1.flattenMatrix)((0, helpers_1.invertMatrix)((0, helpers_1.generateMatrixFromOperations)({
+                        type: "rotateY",
+                        angle: _gamma,
+                    }, {
+                        type: "rotateX",
+                        angle: -_beta,
+                    })));
+                }
+                el.style.transform = `matrix3d(${_inverseMatrix.join(",")}) rotateX(${-_beta}deg) rotateY(${_gamma}deg)`;
+            };
+            window.addEventListener("deviceorientation", orientationListener);
+            window.addEventListener("touchend", () => {
+                _inverseMatrix = undefined;
+            });
+            el.addEventListener("touchstart", mouseDownHandler);
+            el.addEventListener("touchend", mouseUpHandler);
+            el.addEventListener("mousedown", mouseDownHandler);
+            el.addEventListener("mouseup", mouseUpHandler);
+            return () => {
+                window.removeEventListener("deviceorientation", orientationListener);
+                window.removeEventListener("mousemove", handler);
+                window.removeEventListener("touchmove", touchHandler);
+                el.removeEventListener("mousedown", mouseDownHandler);
+                el.removeEventListener("mouseup", mouseUpHandler);
+                el.removeEventListener("touchstart", mouseDownHandler);
+                el.removeEventListener("touchend", mouseUpHandler);
+                // el.style.transform = initialPositionRef.current!;
+                el.style.transform = `rotateX(0deg) rotateY(0deg) translateZ(0px)`;
+            };
+        }
+    }, [active]);
+    return (react_1.default.createElement("div", Object.assign({ onClick: onClick, ref: parallaxableRef, className: `${Parallax_module_scss_1.default.parallax} ${className}` }, props),
+        children,
+        reflection && react_1.default.createElement("div", { ref: reflectionRef, className: Parallax_module_scss_1.default.reflection })));
+}
+exports.default = (0, react_1.forwardRef)(Parallax);
 //# sourceMappingURL=Parallax.js.map

package/dist/components/Parallax/Parallax.stories.d.ts

@@ -1,32 +1,32 @@
-import React from "react";
-declare const _default: {
-    title: string;
-    component: React.ForwardRefExoticComponent<Pick<{
-        className?: string | undefined;
-        active: boolean;
-        onClick?: ((e: any) => void) | undefined;
-        reflection?: boolean | undefined;
-        maxParallax?: {
-            x: number;
-            y: number;
-        } | undefined;
-    } & {
-        children?: React.ReactNode;
-    } & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "key" | "active" | keyof React.HTMLAttributes<HTMLDivElement> | "reflection" | "maxParallax"> & React.RefAttributes<HTMLDivElement>>;
-};
-export default _default;
-export declare const InitialImplementation: {
-    (args: any): JSX.Element;
-    args: Partial<Pick<{
-        className?: string | undefined;
-        active: boolean;
-        onClick?: ((e: any) => void) | undefined;
-        reflection?: boolean | undefined;
-        maxParallax?: {
-            x: number;
-            y: number;
-        } | undefined;
-    } & {
-        children?: React.ReactNode;
-    } & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "key" | "active" | keyof React.HTMLAttributes<HTMLDivElement> | "reflection" | "maxParallax"> & React.RefAttributes<HTMLDivElement>>;
-};
+import React from "react";
+declare const _default: {
+    title: string;
+    component: React.ForwardRefExoticComponent<Pick<{
+        className?: string | undefined;
+        active: boolean;
+        onClick?: ((e: any) => void) | undefined;
+        reflection?: boolean | undefined;
+        maxParallax?: {
+            x: number;
+            y: number;
+        } | undefined;
+    } & {
+        children?: React.ReactNode;
+    } & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "key" | "active" | keyof React.HTMLAttributes<HTMLDivElement> | "reflection" | "maxParallax"> & React.RefAttributes<HTMLDivElement>>;
+};
+export default _default;
+export declare const InitialImplementation: {
+    (args: any): JSX.Element;
+    args: Partial<Pick<{
+        className?: string | undefined;
+        active: boolean;
+        onClick?: ((e: any) => void) | undefined;
+        reflection?: boolean | undefined;
+        maxParallax?: {
+            x: number;
+            y: number;
+        } | undefined;
+    } & {
+        children?: React.ReactNode;
+    } & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "key" | "active" | keyof React.HTMLAttributes<HTMLDivElement> | "reflection" | "maxParallax"> & React.RefAttributes<HTMLDivElement>>;
+};

package/dist/components/Parallax/Parallax.stories.js

@@ -1,23 +1,23 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InitialImplementation = void 0;
-const react_1 = __importDefault(require("react"));
-const Parallax_1 = __importDefault(require("./Parallax"));
-exports.default = {
-    title: "Parallax",
-    component: Parallax_1.default,
-};
-const InitialImplementation = (args) => {
-    return (react_1.default.createElement(Parallax_1.default, Object.assign({}, args),
-        react_1.default.createElement("div", null,
-            react_1.default.createElement("h1", null, "This is a parallax component"),
-            react_1.default.createElement("p", null, "It should emulate movement when moving the screen on mobile or hovering the mouse on desktop"))));
-};
-exports.InitialImplementation = InitialImplementation;
-exports.InitialImplementation.args = {
-    active: true,
-};
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InitialImplementation = void 0;
+const react_1 = __importDefault(require("react"));
+const Parallax_1 = __importDefault(require("./Parallax"));
+exports.default = {
+    title: "Parallax",
+    component: Parallax_1.default,
+};
+const InitialImplementation = (args) => {
+    return (react_1.default.createElement(Parallax_1.default, Object.assign({}, args),
+        react_1.default.createElement("div", null,
+            react_1.default.createElement("h1", null, "This is a parallax component"),
+            react_1.default.createElement("p", null, "It should emulate movement when moving the screen on mobile or hovering the mouse on desktop"))));
+};
+exports.InitialImplementation = InitialImplementation;
+exports.InitialImplementation.args = {
+    active: true,
+};
 //# sourceMappingURL=Parallax.stories.js.map

package/dist/components/Parallax/Parallax.test.d.ts

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

package/dist/components/Parallax/Parallax.test.js

@@ -1,22 +1,22 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const Parallax_1 = require("./Parallax");
-const ELEMENT_POSITION_SIZE = [130, 500];
-it.each([
-    [0, ...ELEMENT_POSITION_SIZE, 0],
-    [130, ...ELEMENT_POSITION_SIZE, 0],
-    [380, ...ELEMENT_POSITION_SIZE, 0.5],
-    [630, ...ELEMENT_POSITION_SIZE, 1],
-    [750, ...ELEMENT_POSITION_SIZE, 1],
-])("Should calculate relative mouse position correctly", (mousePosition, elementPosition, elementSize, expectedResult) => {
-    expect((0, Parallax_1.calculateDistanceRelativeToBounds)(mousePosition, elementPosition, elementSize)).toEqual(expectedResult);
-});
-const MAX_ROTATION = 50;
-it.each([
-    [0, MAX_ROTATION, -25],
-    [0.5, MAX_ROTATION, 0],
-    [1, MAX_ROTATION, 25],
-])("Should calculate rotation correctly", (relativePosition, maxRotation, expectedRotation) => {
-    expect((0, Parallax_1.givenTheRelativePositionHowMuchToRotate)(relativePosition, maxRotation)).toEqual(expectedRotation);
-});
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Parallax_1 = require("./Parallax");
+const ELEMENT_POSITION_SIZE = [130, 500];
+it.each([
+    [0, ...ELEMENT_POSITION_SIZE, 0],
+    [130, ...ELEMENT_POSITION_SIZE, 0],
+    [380, ...ELEMENT_POSITION_SIZE, 0.5],
+    [630, ...ELEMENT_POSITION_SIZE, 1],
+    [750, ...ELEMENT_POSITION_SIZE, 1],
+])("Should calculate relative mouse position correctly", (mousePosition, elementPosition, elementSize, expectedResult) => {
+    expect((0, Parallax_1.calculateDistanceRelativeToBounds)(mousePosition, elementPosition, elementSize)).toEqual(expectedResult);
+});
+const MAX_ROTATION = 50;
+it.each([
+    [0, MAX_ROTATION, -25],
+    [0.5, MAX_ROTATION, 0],
+    [1, MAX_ROTATION, 25],
+])("Should calculate rotation correctly", (relativePosition, maxRotation, expectedRotation) => {
+    expect((0, Parallax_1.givenTheRelativePositionHowMuchToRotate)(relativePosition, maxRotation)).toEqual(expectedRotation);
+});
 //# sourceMappingURL=Parallax.test.js.map

package/dist/components/Parallax/index.d.ts

@@ -1 +1 @@
-export { default } from './Parallax';
+export { default } from './Parallax';

package/dist/components/Parallax/index.js

@@ -1,9 +1,9 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var Parallax_1 = require("./Parallax");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Parallax_1).default; } });
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Parallax_1 = require("./Parallax");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Parallax_1).default; } });
 //# sourceMappingURL=index.js.map