@charcoal-ui/react 3.9.0 → 3.9.1
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/Modal/index.story.d.ts +1 -0
- package/dist/components/Modal/index.story.d.ts.map +1 -1
- package/dist/components/Modal/useCustomModalOverlay.d.ts.map +1 -1
- package/dist/index.cjs.js +5 -2
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +6 -3
- package/dist/index.esm.js.map +1 -1
- package/package.json +7 -7
- package/src/components/Modal/__snapshots__/index.story.storyshot +914 -0
- package/src/components/Modal/index.story.tsx +23 -0
- package/src/components/Modal/useCustomModalOverlay.tsx +5 -0
package/dist/index.esm.js
CHANGED
|
@@ -879,7 +879,7 @@ var ModalBackgroundContext = React8.createContext(null);
|
|
|
879
879
|
|
|
880
880
|
// src/components/Modal/useCustomModalOverlay.tsx
|
|
881
881
|
import * as React9 from "react";
|
|
882
|
-
import { ariaHideOutside, useOverlay, useOverlayFocusContain } from "@react-aria/overlays";
|
|
882
|
+
import { ariaHideOutside, useOverlay, useOverlayFocusContain, usePreventScroll } from "@react-aria/overlays";
|
|
883
883
|
function useCharcoalModalOverlay(props, state, ref) {
|
|
884
884
|
const {
|
|
885
885
|
overlayProps,
|
|
@@ -890,6 +890,9 @@ function useCharcoalModalOverlay(props, state, ref) {
|
|
|
890
890
|
onClose: state.onClose,
|
|
891
891
|
shouldCloseOnInteractOutside: () => false
|
|
892
892
|
}, ref);
|
|
893
|
+
usePreventScroll({
|
|
894
|
+
isDisabled: !state.isOpen
|
|
895
|
+
});
|
|
893
896
|
useOverlayFocusContain();
|
|
894
897
|
React9.useEffect(() => {
|
|
895
898
|
if (state.isOpen && ref.current) {
|
|
@@ -1100,7 +1103,7 @@ import styled14 from "styled-components";
|
|
|
1100
1103
|
|
|
1101
1104
|
// src/components/DropdownSelector/Popover/usePreventScroll.tsx
|
|
1102
1105
|
import { useEffect as useEffect6 } from "react";
|
|
1103
|
-
function
|
|
1106
|
+
function usePreventScroll2(element, isOpen) {
|
|
1104
1107
|
useEffect6(() => {
|
|
1105
1108
|
if (isOpen && element) {
|
|
1106
1109
|
const defaultPaddingRight = element.style.paddingRight;
|
|
@@ -1136,7 +1139,7 @@ function Popover(props) {
|
|
|
1136
1139
|
toggle: _empty
|
|
1137
1140
|
});
|
|
1138
1141
|
const modalBackground = useContext6(ModalBackgroundContext);
|
|
1139
|
-
|
|
1142
|
+
usePreventScroll2(modalBackground, props.isOpen);
|
|
1140
1143
|
if (!props.isOpen)
|
|
1141
1144
|
return null;
|
|
1142
1145
|
return /* @__PURE__ */ jsxs9(Overlay2, { portalContainer: document.body, children: [
|