@dreamcommerce/aurora 0.4.15 → 0.4.16

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 +12 -14
  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 +12 -14
  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,22 +39,13 @@ 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 = 12;
45
- const windowHeightMinusYOffset = window.innerHeight - window.pageYOffset;
46
- const checkIfIsOutsideBottomViewport = (elem) => {
47
- const bounding = elem.getBoundingClientRect();
48
- const dropdownBottomPosition = bounding.bottom + dropdownYOffset + dropdownVerticalPadding + dropdownArrowIconHeight;
49
- return dropdownBottomPosition > windowHeightMinusYOffset;
50
- };
51
- const dropdownIsOutsideBottomViewport = contentRef.current && checkIfIsOutsideBottomViewport(contentRef.current);
42
+ const screenWidthName = use_screen_detect.useScreenDetect();
43
+ const [isDropdownArrowVerticalDirectBottom, setIsDropdownArrowVerticalDirectBottom] = React.useState(false);
52
44
  const contentClassName = classNames.classNames([
53
45
  css_classes.cssDropdownContent,
54
46
  arrowSide === 'right' && css_classes.cssDropdownArrowHorizontalDirectionRight,
55
- dropdownIsOutsideBottomViewport && css_classes.cssDropdownArrowVerticalDirectionBottom
47
+ isDropdownArrowVerticalDirectBottom && css_classes.cssDropdownArrowVerticalDirectionBottom
56
48
  ], main_module['default']);
57
- const screenWidthName = use_screen_detect.useScreenDetect();
58
49
  const refs = [contentRef];
59
50
  if (wrapperRef) {
60
51
  refs.push(wrapperRef);
@@ -67,8 +58,15 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
67
58
  React.useEffect(() => {
68
59
  if (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current) {
69
60
  const { x, y, height } = wrapperRef.current.getBoundingClientRect();
70
- const yOffset = 10;
71
61
  const { xModifier, yModifier } = utilities.getXYModifiersForNestedDropdowns(portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current);
62
+ const windowHeightMinusYOffset = window.innerHeight - window.pageYOffset;
63
+ const checkIfIsOutsideBottomViewport = (elem) => {
64
+ const elementBottomPosition = elem.offsetTop + elem.offsetHeight;
65
+ return elementBottomPosition > windowHeightMinusYOffset;
66
+ };
67
+ const dropdownIsOutsideBottomViewport = contentRef.current && checkIfIsOutsideBottomViewport(contentRef.current);
68
+ dropdownIsOutsideBottomViewport && setIsDropdownArrowVerticalDirectBottom(dropdownIsOutsideBottomViewport);
69
+ const yOffset = 10;
72
70
  const positionTop = height + y + yOffset - yModifier;
73
71
  const positionBottom = windowHeightMinusYOffset - y + yOffset;
74
72
  const positionLeft = x - xModifier;
@@ -80,7 +78,7 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
80
78
  ? setStyles({ left: `0px`, top: `0px`, bottom: 'auto', zIndex })
81
79
  : setStyles({ left: `${positionLeft}px`, top: topPositionValue, bottom: bottomPositionValue, zIndex });
82
80
  }
83
- }, [portalContainer, screenWidthName, wrapperRef, isOpen, dropdownIsOutsideBottomViewport, windowHeightMinusYOffset]);
81
+ }, [portalContainer, screenWidthName, wrapperRef, isOpen]);
84
82
  return reactDom.createPortal(React__default['default'].createElement(reactTransitionGroup.TransitionGroup, { component: null }, isOpen === true ? (React__default['default'].createElement(reactTransitionGroup.CSSTransition, { timeout: 200, classNames: {
85
83
  enter: main_module['default']['dropdown-enter'],
86
84
  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;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;"}
package/build/esm/packages/aurora/src/components/dropdown/components/content.js CHANGED
@@ -31,22 +31,13 @@ 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 = 12;
37
- const windowHeightMinusYOffset = window.innerHeight - window.pageYOffset;
38
- const checkIfIsOutsideBottomViewport = (elem) => {
39
- const bounding = elem.getBoundingClientRect();
40
- const dropdownBottomPosition = bounding.bottom + dropdownYOffset + dropdownVerticalPadding + dropdownArrowIconHeight;
41
- return dropdownBottomPosition > windowHeightMinusYOffset;
42
- };
43
- const dropdownIsOutsideBottomViewport = contentRef.current && checkIfIsOutsideBottomViewport(contentRef.current);
34
+ const screenWidthName = useScreenDetect();
35
+ const [isDropdownArrowVerticalDirectBottom, setIsDropdownArrowVerticalDirectBottom] = useState(false);
44
36
  const contentClassName = classNames([
45
37
  cssDropdownContent,
46
38
  arrowSide === 'right' && cssDropdownArrowHorizontalDirectionRight,
47
- dropdownIsOutsideBottomViewport && cssDropdownArrowVerticalDirectionBottom
39
+ isDropdownArrowVerticalDirectBottom && cssDropdownArrowVerticalDirectionBottom
48
40
  ], cssClasses);
49
- const screenWidthName = useScreenDetect();
50
41
  const refs = [contentRef];
51
42
  if (wrapperRef) {
52
43
  refs.push(wrapperRef);
@@ -59,8 +50,15 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
59
50
  useEffect(() => {
60
51
  if (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current) {
61
52
  const { x, y, height } = wrapperRef.current.getBoundingClientRect();
62
- const yOffset = 10;
63
53
  const { xModifier, yModifier } = getXYModifiersForNestedDropdowns(portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current);
54
+ const windowHeightMinusYOffset = window.innerHeight - window.pageYOffset;
55
+ const checkIfIsOutsideBottomViewport = (elem) => {
56
+ const elementBottomPosition = elem.offsetTop + elem.offsetHeight;
57
+ return elementBottomPosition > windowHeightMinusYOffset;
58
+ };
59
+ const dropdownIsOutsideBottomViewport = contentRef.current && checkIfIsOutsideBottomViewport(contentRef.current);
60
+ dropdownIsOutsideBottomViewport && setIsDropdownArrowVerticalDirectBottom(dropdownIsOutsideBottomViewport);
61
+ const yOffset = 10;
64
62
  const positionTop = height + y + yOffset - yModifier;
65
63
  const positionBottom = windowHeightMinusYOffset - y + yOffset;
66
64
  const positionLeft = x - xModifier;
@@ -72,7 +70,7 @@ const Content = ({ headerComponent, headerGoBackText, headerGoBackIcon, children
72
70
  ? setStyles({ left: `0px`, top: `0px`, bottom: 'auto', zIndex })
73
71
  : setStyles({ left: `${positionLeft}px`, top: topPositionValue, bottom: bottomPositionValue, zIndex });
74
72
  }
75
- }, [portalContainer, screenWidthName, wrapperRef, isOpen, dropdownIsOutsideBottomViewport, windowHeightMinusYOffset]);
73
+ }, [portalContainer, screenWidthName, wrapperRef, isOpen]);
76
74
  return createPortal(React.createElement(TransitionGroup, { component: null }, isOpen === true ? (React.createElement(CSSTransition, { timeout: 200, classNames: {
77
75
  enter: cssClasses['dropdown-enter'],
78
76
  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;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;"}
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.15",
5
+ "version": "0.4.16",
6
6
  "description": "aurora",
7
7
  "author": "k0ssak",
8
8
  "license": "MIT",