@dreamcommerce/aurora 0.4.11 → 0.4.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/build/cjs/packages/aurora/src/components/dropdown/components/content.js +8 -5
  2. package/build/cjs/packages/aurora/src/components/dropdown/components/content.js.map +1 -1
  3. package/build/esm/packages/aurora/src/components/dropdown/components/content.js +8 -5
  4. package/build/esm/packages/aurora/src/components/dropdown/components/content.js.map +1 -1
  5. package/package.json +1 -1
package/build/cjs/packages/aurora/src/components/dropdown/components/content.js CHANGED
@@ -39,10 +39,14 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
39
39
  bottom: '0px',
40
40
  zIndex: constants.DROPDOWN_Z_INDEX
41
41
  });
42
+ const dropdownYOffset = 10;
43
+ const dropdownArrowIconHeight = 14;
44
+ const dropdownVerticalPadding = 14;
42
45
  const windowHeightMinusYOffset = window.innerHeight - window.pageYOffset;
43
46
  const checkIfIsOutsideBottomViewport = (elem) => {
44
47
  const bounding = elem.getBoundingClientRect();
45
- return bounding.bottom > windowHeightMinusYOffset;
48
+ const dropdownBottomPosition = bounding.bottom + dropdownYOffset + dropdownVerticalPadding + dropdownArrowIconHeight;
49
+ return dropdownBottomPosition > windowHeightMinusYOffset;
46
50
  };
47
51
  const dropdownIsOutsideBottomViewport = contentRef.current && checkIfIsOutsideBottomViewport(contentRef.current);
48
52
  const contentClassName = classNames.classNames([
@@ -63,10 +67,9 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
63
67
  React.useEffect(() => {
64
68
  if (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current) {
65
69
  const { x, y, height } = wrapperRef.current.getBoundingClientRect();
66
- const yOffset = 10;
67
70
  const { xModifier, yModifier } = utilities.getXYModifiersForNestedDropdowns(portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current);
68
- const positionTop = height + y + yOffset - yModifier;
69
- const positionBottom = windowHeightMinusYOffset - y + yOffset;
71
+ const positionTop = height + y + dropdownYOffset - yModifier;
72
+ const positionBottom = windowHeightMinusYOffset - y + dropdownYOffset;
70
73
  const positionLeft = x - xModifier;
71
74
  const isInModal = utilities.isChildOfModal(wrapperRef);
72
75
  const zIndex = isInModal ? constants.DROPDOWN_ON_MODAL_Z_INDEX : constants.DROPDOWN_Z_INDEX;
@@ -76,7 +79,7 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
76
79
  ? setStyles({ left: `0px`, top: `0px`, bottom: 'auto', zIndex })
77
80
  : setStyles({ left: `${positionLeft}px`, top: topPositionValue, bottom: bottomPositionValue, zIndex });
78
81
  }
79
- }, [portalContainer, screenWidthName, wrapperRef, isOpen, dropdownIsOutsideBottomViewport]);
82
+ }, [portalContainer, screenWidthName, wrapperRef, isOpen, windowHeightMinusYOffset, dropdownIsOutsideBottomViewport]);
80
83
  return reactDom.createPortal(React__default['default'].createElement(reactTransitionGroup.TransitionGroup, { component: null }, isOpen === true ? (React__default['default'].createElement(reactTransitionGroup.CSSTransition, { timeout: 200, classNames: {
81
84
  enter: main_module['default']['dropdown-enter'],
82
85
  enterActive: main_module['default']['dropdown-enter-active'],
package/build/cjs/packages/aurora/src/components/dropdown/components/content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA,6BAA6B,oEAAwE;AACrG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/build/esm/packages/aurora/src/components/dropdown/components/content.js CHANGED
@@ -31,10 +31,14 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
31
31
  bottom: '0px',
32
32
  zIndex: DROPDOWN_Z_INDEX
33
33
  });
34
+ const dropdownYOffset = 10;
35
+ const dropdownArrowIconHeight = 14;
36
+ const dropdownVerticalPadding = 14;
34
37
  const windowHeightMinusYOffset = window.innerHeight - window.pageYOffset;
35
38
  const checkIfIsOutsideBottomViewport = (elem) => {
36
39
  const bounding = elem.getBoundingClientRect();
37
- return bounding.bottom > windowHeightMinusYOffset;
40
+ const dropdownBottomPosition = bounding.bottom + dropdownYOffset + dropdownVerticalPadding + dropdownArrowIconHeight;
41
+ return dropdownBottomPosition > windowHeightMinusYOffset;
38
42
  };
39
43
  const dropdownIsOutsideBottomViewport = contentRef.current && checkIfIsOutsideBottomViewport(contentRef.current);
40
44
  const contentClassName = classNames([
@@ -55,10 +59,9 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
55
59
  useEffect(() => {
56
60
  if (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current) {
57
61
  const { x, y, height } = wrapperRef.current.getBoundingClientRect();
58
- const yOffset = 10;
59
62
  const { xModifier, yModifier } = getXYModifiersForNestedDropdowns(portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current);
60
- const positionTop = height + y + yOffset - yModifier;
61
- const positionBottom = windowHeightMinusYOffset - y + yOffset;
63
+ const positionTop = height + y + dropdownYOffset - yModifier;
64
+ const positionBottom = windowHeightMinusYOffset - y + dropdownYOffset;
62
65
  const positionLeft = x - xModifier;
63
66
  const isInModal = isChildOfModal(wrapperRef);
64
67
  const zIndex = isInModal ? DROPDOWN_ON_MODAL_Z_INDEX : DROPDOWN_Z_INDEX;
@@ -68,7 +71,7 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
68
71
  ? setStyles({ left: `0px`, top: `0px`, bottom: 'auto', zIndex })
69
72
  : setStyles({ left: `${positionLeft}px`, top: topPositionValue, bottom: bottomPositionValue, zIndex });
70
73
  }
71
- }, [portalContainer, screenWidthName, wrapperRef, isOpen, dropdownIsOutsideBottomViewport]);
74
+ }, [portalContainer, screenWidthName, wrapperRef, isOpen, windowHeightMinusYOffset, dropdownIsOutsideBottomViewport]);
72
75
  return createPortal(React.createElement(TransitionGroup, { component: null }, isOpen === true ? (React.createElement(CSSTransition, { timeout: 200, classNames: {
73
76
  enter: cssClasses['dropdown-enter'],
74
77
  enterActive: cssClasses['dropdown-enter-active'],
package/build/esm/packages/aurora/src/components/dropdown/components/content.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
1
+ {"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA,+BAA+B,oEAAwE;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@dreamcommerce/aurora",
3
3
  "packageManager": "yarn@3.2.0",
4
4
  "sideEffects": false,
5
- "version": "0.4.11",
5
+ "version": "0.4.12",
6
6
  "description": "aurora",
7
7
  "author": "k0ssak",
8
8
  "license": "MIT",