@steroidsjs/core 3.1.8 → 3.1.9

package/tests/utils/calculateComponentAbsolutePosition.test.js

@@ -0,0 +1,544 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var useAbsolutePositioning_1 = require("../../src/hooks/useAbsolutePositioning");
+var calculateComponentAbsolutePosition_1 = __importDefault(require("../../src/utils/calculateComponentAbsolutePosition"));
+var MOCKED_WINDOW_SCROLL_Y_VALUE = 0;
+var MOCKED_DOCUMENT_BODY_CLIENT_WIDTH_VALUE = 375;
+var MOCKED_WINDOW_INNER_HEIGHT_VALUE = 667;
+var originalWindowScrollY;
+var originalDocumentBodyClientWidth;
+var originalWindowInnerHeight;
+beforeEach(function () {
+    originalWindowScrollY = global.window.scrollY;
+    originalDocumentBodyClientWidth = global.document.body.clientWidth;
+    originalWindowInnerHeight = global.window.innerHeight;
+    Object.defineProperty(global.window, 'scrollY', {
+        value: MOCKED_WINDOW_SCROLL_Y_VALUE,
+        writable: true
+    });
+    Object.defineProperty(global.document.body, 'clientWidth', {
+        value: MOCKED_DOCUMENT_BODY_CLIENT_WIDTH_VALUE,
+        writable: true
+    });
+    Object.defineProperty(global.window, 'innerHeight', {
+        value: MOCKED_WINDOW_INNER_HEIGHT_VALUE,
+        writable: true
+    });
+});
+afterAll(function () {
+    Object.defineProperty(global.window, 'scrollY', {
+        value: originalWindowScrollY
+    });
+    Object.defineProperty(global.document.body, 'clientWidth', {
+        value: originalDocumentBodyClientWidth
+    });
+    Object.defineProperty(global.window, 'innerHeight', {
+        value: originalWindowInnerHeight
+    });
+});
+var GAP = 15;
+var PARENT_AT_THE_TOP_REF = {
+    getBoundingClientRect: function () { return ({
+        top: 61,
+        left: 10,
+        right: 365,
+        width: 355,
+        height: 42
+    }); }
+};
+var PARENT_AT_THE_BOTTOM_REF = {
+    getBoundingClientRect: function () { return ({
+        top: 497,
+        left: 197,
+        right: 200,
+        width: 167,
+        height: 64
+    }); }
+};
+var PARENT_AT_THE_CENTER_REF = {
+    getBoundingClientRect: function () { return ({
+        top: 190,
+        left: 100,
+        right: 250,
+        width: 160,
+        height: 40
+    }); }
+};
+var DEFAULT_COMPONENT_SIZE = {
+    height: 100,
+    width: 200
+};
+var LARGE_WIDTH_COMPONENT_SIZE = {
+    height: 92,
+    width: 375
+};
+var LARGE_HEIGHT_COMPONENT_SIZE = {
+    height: 224,
+    width: 200
+};
+var LARGE_HEIGHT_SMALL_WIDTH_COMPONENT_SIZE = {
+    height: 224,
+    width: 70
+};
+var ARROW_SIZE = {
+    width: 14,
+    height: 14
+};
+describe('calculateComponentAbsolutePosition utils', function () {
+    describe('without autoPositioning', function () {
+        it('should keep initial TOP position and calculate style for top value correctly', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.TOP,
+                useAbsolutePositioning_1.Position.TOP_LEFT,
+                useAbsolutePositioning_1.Position.TOP_RIGHT,
+            ];
+            var top = PARENT_AT_THE_TOP_REF.getBoundingClientRect().top;
+            var expectedStyle = {
+                top: top - DEFAULT_COMPONENT_SIZE.height
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_TOP_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.top).toBe(expectedStyle.top);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should keep initial BOTTOM position and calculate style for top value correctly', function () {
+            var bottomPositions = [
+                useAbsolutePositioning_1.Position.BOTTOM,
+                useAbsolutePositioning_1.Position.BOTTOM_LEFT,
+                useAbsolutePositioning_1.Position.BOTTOM_RIGHT,
+            ];
+            var _a = PARENT_AT_THE_TOP_REF.getBoundingClientRect(), top = _a.top, height = _a.height;
+            var expectedStyle = {
+                top: top + height
+            };
+            bottomPositions.forEach(function (bottomPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, bottomPosition, PARENT_AT_THE_TOP_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.top).toBe(expectedStyle.top);
+                expect(position).toEqual(bottomPosition);
+            });
+        });
+        it('should keep initial LEFT position and calculate style for left value correctly', function () {
+            var leftPositions = [
+                useAbsolutePositioning_1.Position.LEFT,
+                useAbsolutePositioning_1.Position.LEFT_TOP,
+            ];
+            var left = PARENT_AT_THE_TOP_REF.getBoundingClientRect().left;
+            var expectedStyle = {
+                left: left - DEFAULT_COMPONENT_SIZE.width
+            };
+            leftPositions.forEach(function (leftPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, leftPosition, PARENT_AT_THE_TOP_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.left).toBe(expectedStyle.left);
+                expect(position).toEqual(leftPosition);
+            });
+        });
+        it('should keep initial LEFT_BOTTOM position and calculate style for left value correctly', function () {
+            var left = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect().left;
+            var expectedStyle = {
+                left: left - DEFAULT_COMPONENT_SIZE.width
+            };
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.LEFT_BOTTOM, PARENT_AT_THE_BOTTOM_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            expect(style.left).toBe(expectedStyle.left);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.LEFT_BOTTOM);
+        });
+        it('should keep initial RIGHT position and calculate style for left value correctly', function () {
+            var rightPositions = [
+                useAbsolutePositioning_1.Position.RIGHT,
+                useAbsolutePositioning_1.Position.RIGHT_TOP,
+            ];
+            var right = PARENT_AT_THE_TOP_REF.getBoundingClientRect().right;
+            var expectedStyle = {
+                left: right
+            };
+            rightPositions.forEach(function (rightPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, rightPosition, PARENT_AT_THE_TOP_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.left).toBe(expectedStyle.left);
+                expect(position).toEqual(rightPosition);
+            });
+        });
+        it('should keep initial RIGHT_BOTTOM position and calculate style for left value correctly', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.RIGHT_BOTTOM, PARENT_AT_THE_BOTTOM_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var right = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect().right;
+            expect(style.left).toBe(right);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.RIGHT_BOTTOM);
+        });
+    });
+    describe('with autoPositioning', function () {
+        it('should change position from TOP to BOTTOM and calculate style for top value correctly', function () {
+            var changingPositions = [
+                [useAbsolutePositioning_1.Position.TOP, useAbsolutePositioning_1.Position.BOTTOM],
+                [useAbsolutePositioning_1.Position.TOP_LEFT, useAbsolutePositioning_1.Position.BOTTOM_LEFT],
+                [useAbsolutePositioning_1.Position.TOP_RIGHT, useAbsolutePositioning_1.Position.BOTTOM_RIGHT],
+            ];
+            var _a = PARENT_AT_THE_TOP_REF.getBoundingClientRect(), top = _a.top, height = _a.height;
+            var expectedStyle = {
+                top: top + height
+            };
+            changingPositions.forEach(function (_a) {
+                var initialPosition = _a[0], resultPosition = _a[1];
+                var _b = (0, calculateComponentAbsolutePosition_1["default"])(GAP, initialPosition, PARENT_AT_THE_TOP_REF, DEFAULT_COMPONENT_SIZE, null, true), style = _b.style, position = _b.position;
+                expect(style.top).toEqual(expectedStyle.top);
+                expect(position).toEqual(resultPosition);
+            });
+        });
+        it('should change position from BOTTOM to TOP and calculate style for top value correctly', function () {
+            var changingPositions = [
+                [useAbsolutePositioning_1.Position.BOTTOM, useAbsolutePositioning_1.Position.TOP],
+                [useAbsolutePositioning_1.Position.BOTTOM_LEFT, useAbsolutePositioning_1.Position.TOP_LEFT],
+                [useAbsolutePositioning_1.Position.BOTTOM_RIGHT, useAbsolutePositioning_1.Position.TOP_RIGHT],
+            ];
+            var top = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect().top;
+            var expectedStyle = {
+                top: top - DEFAULT_COMPONENT_SIZE.height
+            };
+            changingPositions.forEach(function (_a) {
+                var initialPosition = _a[0], resultPosition = _a[1];
+                var _b = (0, calculateComponentAbsolutePosition_1["default"])(GAP, initialPosition, PARENT_AT_THE_BOTTOM_REF, DEFAULT_COMPONENT_SIZE, null, true), style = _b.style, position = _b.position;
+                expect(style.top).toBe(expectedStyle.top);
+                expect(position).toEqual(resultPosition);
+            });
+        });
+        it('should change position from left/right to BOTTOM when component is beyond left/right', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.LEFT,
+                useAbsolutePositioning_1.Position.LEFT_TOP,
+                useAbsolutePositioning_1.Position.LEFT_BOTTOM,
+                useAbsolutePositioning_1.Position.RIGHT,
+                useAbsolutePositioning_1.Position.RIGHT_TOP,
+                useAbsolutePositioning_1.Position.RIGHT_BOTTOM,
+            ];
+            var _a = PARENT_AT_THE_TOP_REF.getBoundingClientRect(), top = _a.top, left = _a.left, width = _a.width, height = _a.height;
+            var expectedStyle = {
+                left: (left + (width / 2)) - (DEFAULT_COMPONENT_SIZE.width / 2),
+                top: top + height
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_TOP_REF, DEFAULT_COMPONENT_SIZE, null, true), style = _a.style, position = _a.position;
+                expect(style.left).toBe(expectedStyle.left);
+                expect(style.top).toBe(expectedStyle.top);
+                expect(position).toEqual(useAbsolutePositioning_1.Position.BOTTOM);
+            });
+        });
+    });
+    describe('with autoPositioning and left/right position', function () {
+        beforeEach(function () {
+            Object.defineProperty(global.document.body, 'clientWidth', {
+                value: 1024,
+                writable: true
+            });
+        });
+        afterAll(function () {
+            Object.defineProperty(global.document.body, 'clientWidth', {
+                value: originalDocumentBodyClientWidth
+            });
+        });
+        it('should change position from LEFT to RIGHT and calculate style for left value correctly', function () {
+            var changingPositions = [
+                [useAbsolutePositioning_1.Position.LEFT, useAbsolutePositioning_1.Position.RIGHT],
+                [useAbsolutePositioning_1.Position.LEFT_TOP, useAbsolutePositioning_1.Position.RIGHT_TOP],
+            ];
+            var right = PARENT_AT_THE_TOP_REF.getBoundingClientRect().right;
+            changingPositions.forEach(function (_a) {
+                var initialPosition = _a[0], resultPosition = _a[1];
+                var _b = (0, calculateComponentAbsolutePosition_1["default"])(GAP, initialPosition, PARENT_AT_THE_TOP_REF, DEFAULT_COMPONENT_SIZE, null, true), style = _b.style, position = _b.position;
+                expect(style.left).toBe(right);
+                expect(position).toEqual(resultPosition);
+            });
+        });
+        it('should change position from LEFT_BOTTOM to RIGHT_BOTTOM and calculate style for left value correctly', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.LEFT_BOTTOM, PARENT_AT_THE_BOTTOM_REF, DEFAULT_COMPONENT_SIZE, null, true), style = _a.style, position = _a.position;
+            var right = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect().right;
+            expect(style.left).toBe(right);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.RIGHT_BOTTOM);
+        });
+        it('should change position from RIGHT to LEFT and calculate style for left value correctly', function () {
+            var parentAtTheTopRightRef = {
+                getBoundingClientRect: function () { return ({
+                    top: 61,
+                    left: 614,
+                    right: 1014,
+                    width: 179,
+                    height: 42
+                }); }
+            };
+            var changingPositions = [
+                [useAbsolutePositioning_1.Position.RIGHT, useAbsolutePositioning_1.Position.LEFT],
+                [useAbsolutePositioning_1.Position.RIGHT_TOP, useAbsolutePositioning_1.Position.LEFT_TOP],
+            ];
+            var left = parentAtTheTopRightRef.getBoundingClientRect().left;
+            var expectedStyle = {
+                left: left - DEFAULT_COMPONENT_SIZE.width
+            };
+            changingPositions.forEach(function (_a) {
+                var initialPosition = _a[0], resultPosition = _a[1];
+                var _b = (0, calculateComponentAbsolutePosition_1["default"])(GAP, initialPosition, parentAtTheTopRightRef, DEFAULT_COMPONENT_SIZE, null, true), style = _b.style, position = _b.position;
+                expect(style.left).toEqual(expectedStyle.left);
+                expect(position).toEqual(resultPosition);
+            });
+        });
+        it('should change position from RIGHT_BOTTOM to LEFT_BOTTOM and calculate style for left value correctly', function () {
+            var parentAtTheBottomRef = {
+                getBoundingClientRect: function () { return ({
+                    top: 497,
+                    left: 614,
+                    right: 1014,
+                    width: 179,
+                    height: 42
+                }); }
+            };
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.RIGHT_BOTTOM, parentAtTheBottomRef, DEFAULT_COMPONENT_SIZE, null, true), style = _a.style, position = _a.position;
+            var left = parentAtTheBottomRef.getBoundingClientRect().left;
+            expect(style.left).toBe(left - DEFAULT_COMPONENT_SIZE.width);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.LEFT_BOTTOM);
+        });
+    });
+    describe('calculate styles for left or top, depends on the position', function () {
+        it('should calculate style for left if pass TOP/BOTTOM position', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.TOP,
+                useAbsolutePositioning_1.Position.BOTTOM,
+            ];
+            var _a = PARENT_AT_THE_CENTER_REF.getBoundingClientRect(), left = _a.left, width = _a.width;
+            var expectedStyle = {
+                left: left + (width / 2) - (DEFAULT_COMPONENT_SIZE.width / 2)
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.left).toEqual(expectedStyle.left);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for left if pass BOTTOM_LEFT/TOP_LEFT position', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.BOTTOM_LEFT,
+                useAbsolutePositioning_1.Position.TOP_LEFT,
+            ];
+            var left = PARENT_AT_THE_CENTER_REF.getBoundingClientRect().left;
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.left).toEqual(left);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for left if pass TOP_RIGHT/BOTTOM_RIGHT position', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.TOP_RIGHT,
+                useAbsolutePositioning_1.Position.BOTTOM_RIGHT,
+            ];
+            var right = PARENT_AT_THE_CENTER_REF.getBoundingClientRect().right;
+            var expectedStyle = {
+                left: right - DEFAULT_COMPONENT_SIZE.width
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.left).toEqual(expectedStyle.left);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for top if pass LEFT/RIGHT position', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.LEFT,
+                useAbsolutePositioning_1.Position.RIGHT,
+            ];
+            var _a = PARENT_AT_THE_CENTER_REF.getBoundingClientRect(), top = _a.top, height = _a.height;
+            var expectedStyle = {
+                top: top + (height / 2) - (DEFAULT_COMPONENT_SIZE.height / 2)
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.top).toEqual(expectedStyle.top);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for top if pass LEFT_TOP/RIGHT_TOP position', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.LEFT_TOP,
+                useAbsolutePositioning_1.Position.RIGHT_TOP,
+            ];
+            var top = PARENT_AT_THE_CENTER_REF.getBoundingClientRect().top;
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.top).toEqual(top);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for top if pass LEFT_BOTTOM/RIGHT_BOTTOM position', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.LEFT_BOTTOM,
+                useAbsolutePositioning_1.Position.RIGHT_BOTTOM,
+            ];
+            var _a = PARENT_AT_THE_CENTER_REF.getBoundingClientRect(), top = _a.top, height = _a.height;
+            var expectedStyle = {
+                top: top + height - DEFAULT_COMPONENT_SIZE.height
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+                expect(style.top).toEqual(expectedStyle.top);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+    });
+    describe('calculate styles for arrow', function () {
+        it('should calculate style for arrow position if pass TOP_LEFT/BOTTOM_LEFT position and component width more than parent width', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.TOP_LEFT,
+                useAbsolutePositioning_1.Position.BOTTOM_LEFT,
+            ];
+            var width = PARENT_AT_THE_CENTER_REF.getBoundingClientRect().width;
+            var expectedArrowPosition = {
+                left: width / 2
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, ARROW_SIZE, true), arrowPosition = _a.arrowPosition, position = _a.position;
+                expect(width).toBeLessThan(DEFAULT_COMPONENT_SIZE.width);
+                expect(arrowPosition.right).toBeUndefined();
+                expect(arrowPosition.left).toEqual(expectedArrowPosition.left);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for arrow position if pass TOP_RIGHT/BOTTOM_RIGHT position and component width more than parent width', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.TOP_RIGHT,
+                useAbsolutePositioning_1.Position.BOTTOM_RIGHT,
+            ];
+            var width = PARENT_AT_THE_CENTER_REF.getBoundingClientRect().width;
+            var expectedArrowPosition = {
+                left: null,
+                right: (width / 2) - (ARROW_SIZE.width / 2)
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, DEFAULT_COMPONENT_SIZE, ARROW_SIZE, true), arrowPosition = _a.arrowPosition, position = _a.position;
+                expect(width).toBeLessThan(DEFAULT_COMPONENT_SIZE.width);
+                expect(arrowPosition.left).toEqual(expectedArrowPosition.left);
+                expect(arrowPosition.right).toEqual(expectedArrowPosition.right);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for arrow position if pass LEFT_TOP/RIGHT_TOP position and component height more than parent height', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.LEFT_TOP,
+                useAbsolutePositioning_1.Position.RIGHT_TOP,
+            ];
+            var height = PARENT_AT_THE_CENTER_REF.getBoundingClientRect().height;
+            var expectedArrowPosition = {
+                top: height / 2
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_CENTER_REF, LARGE_HEIGHT_SMALL_WIDTH_COMPONENT_SIZE, ARROW_SIZE, true), arrowPosition = _a.arrowPosition, position = _a.position;
+                expect(height).toBeLessThan(LARGE_HEIGHT_SMALL_WIDTH_COMPONENT_SIZE.height);
+                expect(arrowPosition.top).toEqual(expectedArrowPosition.top);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+        it('should calculate style for arrow position if pass RIGHT_BOTTOM/LEFT_BOTTOM position and component height more than parent height', function () {
+            var testCases = [
+                useAbsolutePositioning_1.Position.RIGHT_BOTTOM,
+                useAbsolutePositioning_1.Position.LEFT_BOTTOM,
+            ];
+            var height = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect().height;
+            var expectedArrowPosition = {
+                bottom: (height / 2) - (ARROW_SIZE.height / 2)
+            };
+            testCases.forEach(function (testingPosition) {
+                var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, testingPosition, PARENT_AT_THE_BOTTOM_REF, LARGE_HEIGHT_SMALL_WIDTH_COMPONENT_SIZE, ARROW_SIZE, true), arrowPosition = _a.arrowPosition, position = _a.position;
+                expect(height).toBeLessThan(LARGE_HEIGHT_SMALL_WIDTH_COMPONENT_SIZE.height);
+                expect(arrowPosition.bottom).toEqual(expectedArrowPosition.bottom);
+                expect(position).toEqual(testingPosition);
+            });
+        });
+    });
+    describe('when positioning top/bottom component does not go beyond the page horizontally', function () {
+        it('should change position from TOP_LEFT to the TOP_RIGHT if component go beyond the page horizontally', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.TOP_LEFT, PARENT_AT_THE_TOP_REF, LARGE_WIDTH_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var right = PARENT_AT_THE_TOP_REF.getBoundingClientRect().right;
+            expect(style.right).toBe(MOCKED_DOCUMENT_BODY_CLIENT_WIDTH_VALUE - right);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.TOP_RIGHT);
+        });
+        it('should set arrow position to the middle of parent width if component position is TOP_LEFT', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.TOP_LEFT, PARENT_AT_THE_TOP_REF, LARGE_WIDTH_COMPONENT_SIZE, ARROW_SIZE, false), arrowPosition = _a.arrowPosition, position = _a.position;
+            var width = PARENT_AT_THE_TOP_REF.getBoundingClientRect().width;
+            expect(width).toBeLessThan(LARGE_WIDTH_COMPONENT_SIZE.width);
+            expect(arrowPosition.left).toBeNull();
+            expect(arrowPosition.right).toBe((width / 2) - (ARROW_SIZE.width / 2));
+            expect(position).toEqual(useAbsolutePositioning_1.Position.TOP_RIGHT);
+        });
+        it('should change position from TOP_RIGHT to the TOP_LEFT if component go beyond the page horizontally', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.TOP_RIGHT, PARENT_AT_THE_TOP_REF, LARGE_WIDTH_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var left = PARENT_AT_THE_TOP_REF.getBoundingClientRect().left;
+            expect(style.right).toBeNull();
+            expect(style.left).toBe(left);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.TOP_LEFT);
+        });
+        it('should set arrow position to the middle of parent width if component position is TOP_RIGHT', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.TOP_RIGHT, PARENT_AT_THE_TOP_REF, LARGE_WIDTH_COMPONENT_SIZE, ARROW_SIZE, false), arrowPosition = _a.arrowPosition, position = _a.position;
+            var _b = PARENT_AT_THE_TOP_REF.getBoundingClientRect(), left = _b.left, width = _b.width;
+            expect(left).toBeLessThan(LARGE_WIDTH_COMPONENT_SIZE.width);
+            expect(arrowPosition.left).toBe(width / 2);
+            expect(arrowPosition.right).toBeUndefined();
+            expect(position).toEqual(useAbsolutePositioning_1.Position.TOP_LEFT);
+        });
+        it('should change position from BOTTOM_LEFT to the BOTTOM_RIGHT if component go beyond the page horizontally', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.BOTTOM_LEFT, PARENT_AT_THE_BOTTOM_REF, LARGE_WIDTH_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var _b = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect(), top = _b.top, right = _b.right, height = _b.height;
+            expect(style.left).toBeNull();
+            expect(style.right).toBe(MOCKED_DOCUMENT_BODY_CLIENT_WIDTH_VALUE - right);
+            expect(style.top).toBe(top + height);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.BOTTOM_RIGHT);
+        });
+        it('should change position from BOTTOM_RIGHT to the BOTTOM_LEFT if component go beyond the page horizontally', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.BOTTOM_RIGHT, PARENT_AT_THE_BOTTOM_REF, LARGE_WIDTH_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var left = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect().left;
+            expect(style.right).toBeNull();
+            expect(style.left).toBe(left);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.BOTTOM_LEFT);
+        });
+    });
+    describe('when positioning left/right component does not go beyond the page vertically', function () {
+        it('should change position from RIGHT_BOTTOM to the RIGHT_TOP if component go beyond the page vertically', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.RIGHT_BOTTOM, PARENT_AT_THE_TOP_REF, LARGE_HEIGHT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var top = PARENT_AT_THE_TOP_REF.getBoundingClientRect().top;
+            expect(style.top).toBe(top);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.RIGHT_TOP);
+        });
+        it('should set arrow position to the middle of parent height if component position is RIGHT_BOTTOM', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.RIGHT_BOTTOM, PARENT_AT_THE_TOP_REF, LARGE_HEIGHT_COMPONENT_SIZE, ARROW_SIZE, false), arrowPosition = _a.arrowPosition, position = _a.position;
+            var height = PARENT_AT_THE_TOP_REF.getBoundingClientRect().height;
+            expect(height).toBeLessThan(LARGE_HEIGHT_COMPONENT_SIZE.height);
+            expect(arrowPosition.left).toBeUndefined();
+            expect(arrowPosition.top).toBe(height / 2);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.RIGHT_TOP);
+        });
+        it('should change position from RIGHT_TOP to the RIGHT_BOTTOM if component go beyond the page vertically', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.RIGHT_TOP, PARENT_AT_THE_BOTTOM_REF, LARGE_HEIGHT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var _b = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect(), top = _b.top, height = _b.height;
+            expect(style.top).toBe(top + height - LARGE_HEIGHT_COMPONENT_SIZE.height);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.RIGHT_BOTTOM);
+        });
+        it('should set arrow position to the middle of parent height if component position is RIGHT_TOP', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.RIGHT_TOP, PARENT_AT_THE_BOTTOM_REF, LARGE_HEIGHT_COMPONENT_SIZE, ARROW_SIZE, false), arrowPosition = _a.arrowPosition, position = _a.position;
+            var height = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect().height;
+            expect(height).toBeLessThan(LARGE_HEIGHT_COMPONENT_SIZE.height);
+            expect(arrowPosition.top).toBeUndefined();
+            expect(arrowPosition.bottom).toBe((height / 2) - (ARROW_SIZE.height / 2));
+            expect(position).toEqual(useAbsolutePositioning_1.Position.RIGHT_BOTTOM);
+        });
+        it('should change position from LEFT_BOTTOM to the LEFT_TOP if component go beyond the page vertically', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.LEFT_BOTTOM, PARENT_AT_THE_TOP_REF, LARGE_HEIGHT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var _b = PARENT_AT_THE_TOP_REF.getBoundingClientRect(), top = _b.top, left = _b.left;
+            expect(style.top).toBe(top);
+            expect(style.left).toBe(left - LARGE_HEIGHT_COMPONENT_SIZE.width);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.LEFT_TOP);
+        });
+        it('should change position from LEFT_TOP to the LEFT_BOTTOM if component go beyond the page vertically', function () {
+            var _a = (0, calculateComponentAbsolutePosition_1["default"])(GAP, useAbsolutePositioning_1.Position.LEFT_TOP, PARENT_AT_THE_BOTTOM_REF, LARGE_HEIGHT_COMPONENT_SIZE, null, false), style = _a.style, position = _a.position;
+            var _b = PARENT_AT_THE_BOTTOM_REF.getBoundingClientRect(), top = _b.top, height = _b.height, left = _b.left;
+            expect(style.top).toBe(top + height - LARGE_HEIGHT_COMPONENT_SIZE.height);
+            expect(style.left).toBe(left - LARGE_HEIGHT_COMPONENT_SIZE.width);
+            expect(position).toEqual(useAbsolutePositioning_1.Position.LEFT_BOTTOM);
+        });
+    });
+});

package/tests/utils/calendar.test.d.ts

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

package/tests/utils/calendar.test.js

@@ -0,0 +1,29 @@
+"use strict";
+exports.__esModule = true;
+var calendar_1 = require("../../src/utils/calendar");
+describe('calendar utils', function () {
+    var date = '1.1.2023';
+    var fromFormats = 'D.M.YYYY';
+    var utc = true;
+    var toFormat = 'DD.MM.YY';
+    it('default behavior', function () {
+        var expectedFormatDate = '01.01.23';
+        expect((0, calendar_1.convertDate)(date, fromFormats, toFormat)).toBe(expectedFormatDate);
+    });
+    it('with utc', function () {
+        var anotherDate = '1.1.2023 23:59';
+        var anotherFromFormat = 'D.M.YYYY HH:mm';
+        var expectedFormatDate = '01.01.23';
+        expect((0, calendar_1.convertDate)(anotherDate, anotherFromFormat, toFormat, utc)).toBe(expectedFormatDate);
+    });
+    it('with utc and dateInUtc', function () {
+        var dateInUtc = true;
+        var expectedFormatDate = '01.01.23';
+        expect((0, calendar_1.convertDate)(date, fromFormats, toFormat, utc, dateInUtc)).toBe(expectedFormatDate);
+    });
+    it('with date as Date instance', function () {
+        var dateInstance = new Date(new Date().setFullYear(2000, 8, 3));
+        var toFormatWithFullYear = 'DD.MM.YYYY';
+        expect((0, calendar_1.convertDate)(dateInstance, fromFormats, toFormatWithFullYear)).toBe('03.09.2000');
+    });
+});

package/tests/utils/collection.test.d.ts

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

package/tests/utils/collection.test.js

@@ -0,0 +1,33 @@
+"use strict";
+exports.__esModule = true;
+var collection_1 = require("../../src/utils/collection");
+describe('indexBy', function () {
+    it('collection as not array', function () {
+        var collection = {};
+        var key = 'id';
+        expect((0, collection_1.indexBy)(collection, key)).toEqual(collection);
+    });
+    it('collection as array', function () {
+        var _a, _b, _c;
+        var indexKey = 'route';
+        var homeValue = 'home';
+        var dashboardValue = 'dashboard';
+        var collection = [
+            (_a = {},
+                _a[indexKey] = homeValue,
+                _a.isNavVisible = false,
+                _a.isVisible = true,
+                _a),
+            (_b = {},
+                _b[indexKey] = dashboardValue,
+                _b.isNavVisible = false,
+                _b.isVisible = false,
+                _b),
+        ];
+        var expectedIndexedObject = (_c = {},
+            _c[homeValue] = collection[0],
+            _c[dashboardValue] = collection[1],
+            _c);
+        expect((0, collection_1.indexBy)(collection, indexKey)).toEqual(expectedIndexedObject);
+    });
+});

package/tests/utils/data.test.d.ts

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