@charcoal-ui/react 4.4.0 → 4.5.0
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.
- package/dist/components/DropdownSelector/Popover/usePreventScroll.d.ts +1 -1
- package/dist/components/DropdownSelector/Popover/usePreventScroll.d.ts.map +1 -1
- package/dist/components/Modal/index.d.ts +5 -3
- package/dist/components/Modal/index.d.ts.map +1 -1
- package/dist/components/Modal/useCustomModalOverlay.d.ts +4 -1
- package/dist/components/Modal/useCustomModalOverlay.d.ts.map +1 -1
- package/dist/index.cjs.js +4 -4
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +4 -4
- package/dist/index.esm.js.map +1 -1
- package/package.json +6 -6
- package/src/components/DropdownSelector/Popover/usePreventScroll.tsx +7 -3
- package/src/components/Modal/index.tsx +3 -2
- package/src/components/Modal/useCustomModalOverlay.tsx +6 -2
package/dist/index.esm.js
CHANGED
|
@@ -798,19 +798,19 @@ import { ariaHideOutside, useOverlay, useOverlayFocusContain } from "@react-aria
|
|
|
798
798
|
|
|
799
799
|
// src/components/DropdownSelector/Popover/usePreventScroll.tsx
|
|
800
800
|
import { useEffect as useEffect6 } from "react";
|
|
801
|
-
function usePreventScroll(element, isOpen) {
|
|
801
|
+
function usePreventScroll(element, isOpen, useClip = false) {
|
|
802
802
|
useEffect6(() => {
|
|
803
803
|
if (isOpen && element) {
|
|
804
804
|
const defaultPaddingRight = element.style.paddingRight;
|
|
805
805
|
const defaultOverflow = element.style.overflow;
|
|
806
806
|
element.style.paddingRight = `${window.innerWidth - element.clientWidth}px`;
|
|
807
|
-
element.style.overflow = "hidden";
|
|
807
|
+
element.style.overflow = useClip ? "clip" : "hidden";
|
|
808
808
|
return () => {
|
|
809
809
|
element.style.paddingRight = defaultPaddingRight;
|
|
810
810
|
element.style.overflow = defaultOverflow;
|
|
811
811
|
};
|
|
812
812
|
}
|
|
813
|
-
}, [element, isOpen]);
|
|
813
|
+
}, [element, isOpen, useClip]);
|
|
814
814
|
}
|
|
815
815
|
|
|
816
816
|
// src/components/Modal/useCustomModalOverlay.tsx
|
|
@@ -824,7 +824,7 @@ function useCharcoalModalOverlay(props, state, ref) {
|
|
|
824
824
|
onClose: state.onClose,
|
|
825
825
|
shouldCloseOnInteractOutside: () => false
|
|
826
826
|
}, ref);
|
|
827
|
-
usePreventScroll(typeof document !== "undefined" ? document.body : null, state.isOpen);
|
|
827
|
+
usePreventScroll(typeof document !== "undefined" ? document.body : null, state.isOpen, props.overflowClip);
|
|
828
828
|
useOverlayFocusContain();
|
|
829
829
|
React11.useEffect(() => {
|
|
830
830
|
if (state.isOpen && ref.current) {
|