Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@react-aria/overlays

Package Overview
Dependencies
Maintainers
1
Versions
789
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@react-aria/overlays - npm Package Compare versions

Comparing version 3.0.0-nightly.741 to 3.0.0-nightly.746

28

dist/main.js

@@ -178,18 +178,29 @@ var {

} = placementInfo;
let position = {};
position[crossAxis] = childOffset[crossAxis] + crossOffset;
let position = {}; // button position
position[crossAxis] = childOffset[crossAxis];
if (crossPlacement === 'center') {
// + (button size / 2) - (overlay size / 2)
// at this point the overlay center should match the button center
position[crossAxis] += (childOffset[crossSize] - overlaySize[crossSize]) / 2;
} else if (crossPlacement !== crossAxis) {
// + (button size) - (overlay size)
// at this point the overlay bottom should match the button bottom
position[crossAxis] += childOffset[crossSize] - overlaySize[crossSize];
} // Ensure overlay sticks to target(ignore for overlays smaller than target)
}
/* else {
the overlay top should match the button top
} */
// add the crossOffset from props
if (childOffset[crossSize] < overlaySize[crossSize]) {
let positionForPositiveSideOverflow = Math.min(position[crossAxis], childOffset[crossAxis]);
position[crossAxis] = Math.max(positionForPositiveSideOverflow, childOffset[crossAxis] - overlaySize[crossSize] + childOffset[crossSize]);
} // Floor these so the position isn't placed on a partial pixel, only whole pixels. Shouldn't matter if it was floored or ceiled, so chose one.
position[crossAxis] += crossOffset; // this is button center position - the overlay size + half of the button to align bottom of overlay with button center
let minViablePosition = childOffset[crossAxis] + childOffset[crossSize] / 2 - overlaySize[crossSize]; // this is button position of center, aligns top of overlay with button center
let maxViablePosition = childOffset[crossAxis] + childOffset[crossSize] / 2; // clamp it into the range of the min/max positions
position[crossAxis] = Math.min(Math.max(minViablePosition, position[crossAxis]), maxViablePosition); // Floor these so the position isn't placed on a partial pixel, only whole pixels. Shouldn't matter if it was floored or ceiled, so chose one.
if (placement === axis) {

@@ -268,3 +279,3 @@ // If the container is positioned (non-static), then we use the container's actual

let arrowPosition = {};
arrowPosition[crossAxis] = childOffset[crossSize] > overlaySize[crossSize] ? null : childOffset[crossAxis] - position[crossAxis] + childOffset[crossSize] / 2;
arrowPosition[crossAxis] = childOffset[crossAxis] - position[crossAxis] + childOffset[crossSize] / 2;
return {

@@ -726,3 +737,2 @@ position,

// Last resort. If the window scrolled, scroll it back to the top.
// It should always be at the top because the body will have a negative margin (see below).
window.scrollTo(0, 0);

@@ -729,0 +739,0 @@ }; // Record the original scroll position so we can restore it.

@@ -138,18 +138,29 @@ import { VisuallyHidden } from "@react-aria/visually-hidden";

} = placementInfo;
let position = {};
position[crossAxis] = childOffset[crossAxis] + crossOffset;
let position = {}; // button position
position[crossAxis] = childOffset[crossAxis];
if (crossPlacement === 'center') {
// + (button size / 2) - (overlay size / 2)
// at this point the overlay center should match the button center
position[crossAxis] += (childOffset[crossSize] - overlaySize[crossSize]) / 2;
} else if (crossPlacement !== crossAxis) {
// + (button size) - (overlay size)
// at this point the overlay bottom should match the button bottom
position[crossAxis] += childOffset[crossSize] - overlaySize[crossSize];
} // Ensure overlay sticks to target(ignore for overlays smaller than target)
}
/* else {
the overlay top should match the button top
} */
// add the crossOffset from props
if (childOffset[crossSize] < overlaySize[crossSize]) {
let positionForPositiveSideOverflow = Math.min(position[crossAxis], childOffset[crossAxis]);
position[crossAxis] = Math.max(positionForPositiveSideOverflow, childOffset[crossAxis] - overlaySize[crossSize] + childOffset[crossSize]);
} // Floor these so the position isn't placed on a partial pixel, only whole pixels. Shouldn't matter if it was floored or ceiled, so chose one.
position[crossAxis] += crossOffset; // this is button center position - the overlay size + half of the button to align bottom of overlay with button center
let minViablePosition = childOffset[crossAxis] + childOffset[crossSize] / 2 - overlaySize[crossSize]; // this is button position of center, aligns top of overlay with button center
let maxViablePosition = childOffset[crossAxis] + childOffset[crossSize] / 2; // clamp it into the range of the min/max positions
position[crossAxis] = Math.min(Math.max(minViablePosition, position[crossAxis]), maxViablePosition); // Floor these so the position isn't placed on a partial pixel, only whole pixels. Shouldn't matter if it was floored or ceiled, so chose one.
if (placement === axis) {

@@ -228,3 +239,3 @@ // If the container is positioned (non-static), then we use the container's actual

let arrowPosition = {};
arrowPosition[crossAxis] = childOffset[crossSize] > overlaySize[crossSize] ? null : childOffset[crossAxis] - position[crossAxis] + childOffset[crossSize] / 2;
arrowPosition[crossAxis] = childOffset[crossAxis] - position[crossAxis] + childOffset[crossSize] / 2;
return {

@@ -677,3 +688,2 @@ position,

// Last resort. If the window scrolled, scroll it back to the top.
// It should always be at the top because the body will have a negative margin (see below).
window.scrollTo(0, 0);

@@ -680,0 +690,0 @@ }; // Record the original scroll position so we can restore it.

{
"name": "@react-aria/overlays",
"version": "3.0.0-nightly.741+975957a3",
"version": "3.0.0-nightly.746+db9b0228",
"description": "Spectrum UI components in React",

@@ -21,9 +21,9 @@ "license": "Apache-2.0",

"@babel/runtime": "^7.6.2",
"@react-aria/i18n": "3.0.0-nightly.741+975957a3",
"@react-aria/interactions": "3.0.0-nightly.741+975957a3",
"@react-aria/utils": "3.0.0-nightly.741+975957a3",
"@react-aria/visually-hidden": "3.0.0-nightly.741+975957a3",
"@react-stately/overlays": "3.1.2-nightly.2419+975957a3",
"@react-types/button": "3.2.2-nightly.2419+975957a3",
"@react-types/overlays": "3.2.2-nightly.2419+975957a3",
"@react-aria/i18n": "3.0.0-nightly.746+db9b0228",
"@react-aria/interactions": "3.0.0-nightly.746+db9b0228",
"@react-aria/utils": "3.0.0-nightly.746+db9b0228",
"@react-aria/visually-hidden": "3.0.0-nightly.746+db9b0228",
"@react-stately/overlays": "3.1.2-nightly.2424+db9b0228",
"@react-types/button": "3.2.2-nightly.2424+db9b0228",
"@react-types/overlays": "3.2.2-nightly.2424+db9b0228",
"dom-helpers": "^3.3.1"

@@ -38,3 +38,3 @@ },

},
"gitHead": "975957a3c3fb4a9f3be358428e0980a4d4e51c1a"
"gitHead": "db9b022848d4b83627aa98a0b347534bf3376ed4"
}

@@ -194,15 +194,26 @@ /*

position[crossAxis] = childOffset[crossAxis] + crossOffset;
// button position
position[crossAxis] = childOffset[crossAxis];
if (crossPlacement === 'center') {
// + (button size / 2) - (overlay size / 2)
// at this point the overlay center should match the button center
position[crossAxis] += (childOffset[crossSize] - overlaySize[crossSize]) / 2;
} else if (crossPlacement !== crossAxis) {
// + (button size) - (overlay size)
// at this point the overlay bottom should match the button bottom
position[crossAxis] += (childOffset[crossSize] - overlaySize[crossSize]);
}
}/* else {
the overlay top should match the button top
} */
// add the crossOffset from props
position[crossAxis] += crossOffset;
// Ensure overlay sticks to target(ignore for overlays smaller than target)
if (childOffset[crossSize] < overlaySize[crossSize]) {
let positionForPositiveSideOverflow = Math.min(position[crossAxis], childOffset[crossAxis]);
position[crossAxis] = Math.max(positionForPositiveSideOverflow, childOffset[crossAxis] - overlaySize[crossSize] + childOffset[crossSize]);
}
// this is button center position - the overlay size + half of the button to align bottom of overlay with button center
let minViablePosition = childOffset[crossAxis] + (childOffset[crossSize] / 2) - overlaySize[crossSize];
// this is button position of center, aligns top of overlay with button center
let maxViablePosition = childOffset[crossAxis] + (childOffset[crossSize] / 2);
// clamp it into the range of the min/max positions
position[crossAxis] = Math.min(Math.max(minViablePosition, position[crossAxis]), maxViablePosition);
// Floor these so the position isn't placed on a partial pixel, only whole pixels. Shouldn't matter if it was floored or ceiled, so chose one.

@@ -233,3 +244,3 @@ if (placement === axis) {

// We want the distance between the top of the overlay to the bottom of the boundary
? Math.max(0,
? Math.max(0,
(boundaryDimensions.height + boundaryDimensions.top + boundaryDimensions.scroll.top) // this is the bottom of the boundary

@@ -240,3 +251,3 @@ - (containerOffsetWithBoundary.top + position.top) // this is the top of the overlay

// We want the distance between the top of the trigger to the top of the boundary
: Math.max(0,
: Math.max(0,
(childOffset.top + containerOffsetWithBoundary.top) // this is the top of the trigger

@@ -331,3 +342,3 @@ - (boundaryDimensions.top + boundaryDimensions.scroll.top) // this is the top of the boundary

let arrowPosition: Position = {};
arrowPosition[crossAxis] = childOffset[crossSize] > overlaySize[crossSize] ? null : (childOffset[crossAxis] - position[crossAxis] + childOffset[crossSize] / 2);
arrowPosition[crossAxis] = (childOffset[crossAxis] - position[crossAxis] + childOffset[crossSize] / 2);

@@ -334,0 +345,0 @@ return {

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc