@activecollab/components 1.0.66 → 1.0.67
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/cjs/components/Menu/Menu.js +5 -2
- package/dist/cjs/components/Menu/Menu.js.map +1 -1
- package/dist/cjs/components/Modal/Modal.js +5 -2
- package/dist/cjs/components/Modal/Modal.js.map +1 -1
- package/dist/cjs/components/Overlay/Overlay.js.map +1 -1
- package/dist/cjs/components/Sheet/Sheet.js +5 -2
- package/dist/cjs/components/Sheet/Sheet.js.map +1 -1
- package/dist/cjs/components/Window/Window.js +13 -2
- package/dist/cjs/components/Window/Window.js.map +1 -1
- package/dist/esm/components/Menu/Menu.d.ts +1 -0
- package/dist/esm/components/Menu/Menu.d.ts.map +1 -1
- package/dist/esm/components/Menu/Menu.js +5 -2
- package/dist/esm/components/Menu/Menu.js.map +1 -1
- package/dist/esm/components/Modal/Modal.d.ts +1 -0
- package/dist/esm/components/Modal/Modal.d.ts.map +1 -1
- package/dist/esm/components/Modal/Modal.js +5 -2
- package/dist/esm/components/Modal/Modal.js.map +1 -1
- package/dist/esm/components/Overlay/Overlay.d.ts +2 -2
- package/dist/esm/components/Overlay/Overlay.d.ts.map +1 -1
- package/dist/esm/components/Overlay/Overlay.js.map +1 -1
- package/dist/esm/components/Sheet/Sheet.d.ts +1 -0
- package/dist/esm/components/Sheet/Sheet.d.ts.map +1 -1
- package/dist/esm/components/Sheet/Sheet.js +5 -2
- package/dist/esm/components/Sheet/Sheet.js.map +1 -1
- package/dist/esm/components/Window/Window.d.ts +3 -3
- package/dist/esm/components/Window/Window.d.ts.map +1 -1
- package/dist/esm/components/Window/Window.js +13 -2
- package/dist/esm/components/Window/Window.js.map +1 -1
- package/dist/index.js +28 -8
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Sheet/Sheet.tsx"],"names":["React","useRef","useCallback","useEffect","forwardRef","useState","Transition","Window","classnames","useForkRef","StyledAnimatedSpan","StyledCssTransition","StyledSheetIcons","StyledSheetWrapper","StyledSheetWrapperPaper","Overlay","Sheet","ref","children","onClose","controls","open","defaultOpen","animation","position","mode","disableFocusLock","disableScrollLock","disableBackgroundColor","bodyStyle","bodyClassName","disableBackgroundClick","rest","setOpen","exited","setExited","innerRef","handleRef","handleEnter","handleExited","handleClose","handleBackgroundClick","event","preventDefault","length","map","item","index","maxDurationIn","maxDurationOut","control","durationOut","durationIn","state","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IACEC,MADF,EAEEC,WAFF,EAGEC,SAHF,EAIEC,UAJF,EAMEC,QANF,QAUO,OAVP;AAYA,SAASC,UAAT,QAA2B,wBAA3B;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,UAAP,MAAuB,wBAAvB;AACA,SACEC,kBADF,EAEEC,mBAFF,EAGEC,gBAHF,EAIEC,kBAJF,EAKEC,uBALF,QAMO,UANP;AAOA,SAASC,OAAT,QAAwB,YAAxB;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Sheet/Sheet.tsx"],"names":["React","useRef","useCallback","useEffect","forwardRef","useState","Transition","Window","classnames","useForkRef","StyledAnimatedSpan","StyledCssTransition","StyledSheetIcons","StyledSheetWrapper","StyledSheetWrapperPaper","Overlay","Sheet","ref","children","onClose","controls","open","defaultOpen","animation","position","mode","disableFocusLock","disableScrollLock","disableBackgroundColor","bodyStyle","bodyClassName","disableBackgroundClick","preventClickEventBubbling","rest","setOpen","exited","setExited","innerRef","handleRef","handleEnter","handleExited","handleClose","handleBackgroundClick","event","preventDefault","length","map","item","index","maxDurationIn","maxDurationOut","control","durationOut","durationIn","state","displayName"],"mappings":"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","sourcesContent":["import React, {\n useRef,\n useCallback,\n useEffect,\n forwardRef,\n HTMLAttributes,\n useState,\n CSSProperties,\n ReactElement,\n MouseEvent,\n} from \"react\";\n\nimport { Transition } from \"react-transition-group\";\nimport { Window } from \"../Window\";\nimport classnames from \"classnames\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport {\n StyledAnimatedSpan,\n StyledCssTransition,\n StyledSheetIcons,\n StyledSheetWrapper,\n StyledSheetWrapperPaper,\n} from \"./Styles\";\nimport { Overlay } from \"../Overlay\";\n\ninterface ISheet {\n onClose?: () => void;\n controls?: JSX.Element[];\n open?: boolean;\n animation?: \"top\" | \"bottom\" | \"left\" | \"right\";\n position?: \"center\" | \"left\" | \"right\";\n mode?: \"normal\" | \"stretch\";\n disableFocusLock?: boolean;\n disableScrollLock?: boolean;\n disableBackgroundColor?: boolean;\n bodyStyle?: CSSProperties;\n bodyClassName?: string;\n disableBackgroundClick?: boolean;\n preventClickEventBubbling?: boolean;\n}\n\nexport const Sheet = forwardRef<\n HTMLDivElement,\n ISheet & HTMLAttributes<HTMLDivElement>\n>(\n (\n {\n children,\n onClose,\n controls = [],\n open: defaultOpen = false,\n animation = \"top\",\n position = \"center\",\n mode = \"normal\",\n disableFocusLock = false,\n disableScrollLock = false,\n disableBackgroundColor = false,\n bodyStyle,\n bodyClassName,\n disableBackgroundClick = false,\n preventClickEventBubbling = false,\n ...rest\n },\n ref\n ) => {\n const [open, setOpen] = useState(defaultOpen);\n const [exited, setExited] = useState(true);\n const innerRef = useRef<HTMLDivElement>(null);\n\n const handleRef = useForkRef(innerRef, ref);\n\n useEffect(() => {\n setOpen(defaultOpen);\n }, [defaultOpen]);\n\n const handleEnter = useCallback(() => {\n setExited(false);\n }, []);\n\n const handleExited = useCallback(() => {\n setExited(true);\n typeof onClose === \"function\" && onClose();\n }, [onClose]);\n\n const handleClose = useCallback(() => {\n setOpen(false);\n }, []);\n\n const handleBackgroundClick = useCallback(\n (event: MouseEvent<HTMLDivElement>) => {\n if (!disableBackgroundClick) {\n event.preventDefault();\n handleClose();\n }\n },\n [disableBackgroundClick, handleClose]\n );\n\n if (!open && exited) {\n return null;\n }\n\n return (\n <Window\n {...rest}\n ref={handleRef}\n onClose={handleClose}\n disableFocusLock={disableFocusLock}\n disableScrollLock={disableScrollLock}\n preventClickEventBubbling={preventClickEventBubbling}\n >\n {open ? (\n <Overlay\n onClick={handleBackgroundClick}\n disableBackgroundColor={disableBackgroundColor}\n />\n ) : null}\n <StyledSheetWrapper\n className={classnames(\"c-sheet__wrapper\", bodyClassName)}\n style={bodyStyle}\n $position={position}\n $mode={mode}\n >\n {controls.length ? (\n <StyledSheetIcons>\n {controls.map((item, index) => {\n const maxDurationIn = 4; // max duration 4 for 400ms, shorten .4s\n const maxDurationOut = 2; // max duration 2 for 200ms, shorten .2s\n const control = index + 1;\n const durationOut =\n controls.length > maxDurationOut\n ? maxDurationOut\n : maxDurationOut - control;\n const durationIn = control >= maxDurationIn ? 1 : control;\n return (\n <Transition\n appear\n in={open}\n timeout={maxDurationIn * 100}\n key={`c-sheet-control-${index}`}\n >\n {(state): ReactElement => (\n <StyledAnimatedSpan\n $state={state}\n $mode={mode}\n $maxDurationIn={maxDurationIn / 10}\n $maxDurationOut={maxDurationOut / 10}\n $durationOut={durationOut / 10}\n $durationIn={durationIn / 10}\n >\n {item}\n </StyledAnimatedSpan>\n )}\n </Transition>\n );\n })}\n </StyledSheetIcons>\n ) : null}\n <StyledCssTransition\n appear\n in={open}\n timeout={400}\n classNames={\"c-sheet__animation\"}\n $direction={animation}\n onEnter={handleEnter}\n onExited={handleExited}\n >\n <StyledSheetWrapperPaper className=\"c-sheet__wrapper__paper\">\n {children}\n </StyledSheetWrapperPaper>\n </StyledCssTransition>\n </StyledSheetWrapper>\n </Window>\n );\n }\n);\n\nSheet.displayName = \"Sheet\";\n"],"file":"Sheet.js"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
interface IWindow {
|
|
2
|
+
export interface IWindow {
|
|
3
3
|
onClose?: () => void;
|
|
4
4
|
disableFocusLock?: boolean;
|
|
5
5
|
disableScrollLock?: boolean;
|
|
6
|
+
preventClickEventBubbling?: boolean;
|
|
6
7
|
}
|
|
7
|
-
export declare const Window: React.ForwardRefExoticComponent<IWindow & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
8
|
-
export {};
|
|
8
|
+
export declare const Window: React.ForwardRefExoticComponent<IWindow & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, keyof IWindow> & React.RefAttributes<HTMLDivElement>>;
|
|
9
9
|
//# sourceMappingURL=Window.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Window.d.ts","sourceRoot":"","sources":["../../../../src/components/Window/Window.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Window.d.ts","sourceRoot":"","sources":["../../../../src/components/Window/Window.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAQf,MAAM,WAAW,OAAO;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,yBAAyB,CAAC,EAAE,OAAO,CAAC;CACrC;AAID,eAAO,MAAM,MAAM,+OAmFlB,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
-
var _excluded = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock"];
|
|
3
|
+
var _excluded = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock", "preventClickEventBubbling", "onClick"];
|
|
4
4
|
import React, { useCallback, useRef, useEffect, forwardRef } from "react";
|
|
5
5
|
import classnames from "classnames";
|
|
6
6
|
import FocusLock from "react-focus-lock";
|
|
@@ -21,6 +21,9 @@ export var Window = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
21
21
|
disableFocusLock = _ref$disableFocusLock === void 0 ? false : _ref$disableFocusLock,
|
|
22
22
|
_ref$disableScrollLoc = _ref.disableScrollLock,
|
|
23
23
|
disableScrollLock = _ref$disableScrollLoc === void 0 ? false : _ref$disableScrollLoc,
|
|
24
|
+
_ref$preventClickEven = _ref.preventClickEventBubbling,
|
|
25
|
+
preventClickEventBubbling = _ref$preventClickEven === void 0 ? false : _ref$preventClickEven,
|
|
26
|
+
onClick = _ref.onClick,
|
|
24
27
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
25
28
|
|
|
26
29
|
var innerRef = useRef(null);
|
|
@@ -49,6 +52,13 @@ export var Window = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
49
52
|
}; // Dependency is empty because we only want to call onClose when component is unmounted
|
|
50
53
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
51
54
|
}, []);
|
|
55
|
+
var handleClick = useCallback(function (event) {
|
|
56
|
+
if (preventClickEventBubbling) {
|
|
57
|
+
event == null ? void 0 : event.stopPropagation();
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
typeof onClick === "function" && onClick(event);
|
|
61
|
+
}, [onClick, preventClickEventBubbling]);
|
|
52
62
|
return /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(FocusLock, {
|
|
53
63
|
returnFocus: returnFocus,
|
|
54
64
|
disabled: disableFocusLock
|
|
@@ -63,7 +73,8 @@ export var Window = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
63
73
|
}, style),
|
|
64
74
|
onKeyDown: handleKeyDown,
|
|
65
75
|
tabIndex: 0,
|
|
66
|
-
className: classnames("c-window", className)
|
|
76
|
+
className: classnames("c-window", className),
|
|
77
|
+
onClick: handleClick
|
|
67
78
|
}), children))));
|
|
68
79
|
});
|
|
69
80
|
Window.displayName = "Window";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Window/Window.tsx"],"names":["React","useCallback","useRef","useEffect","forwardRef","classnames","FocusLock","Portal","useLayerContext","useForkRef","RemoveScroll","StyledWindow","returnFocus","preventScroll","Window","ref","children","onClose","className","style","onKeyDown","disableFocusLock","disableScrollLock","rest","innerRef","handleRef","zIndex","handleKeyDown","event","defaultPrevented","key","preventDefault","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IACEC,WADF,EAEEC,MAFF,EAGEC,SAHF,EAIEC,UAJF,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Window/Window.tsx"],"names":["React","useCallback","useRef","useEffect","forwardRef","classnames","FocusLock","Portal","useLayerContext","useForkRef","RemoveScroll","StyledWindow","returnFocus","preventScroll","Window","ref","children","onClose","className","style","onKeyDown","disableFocusLock","disableScrollLock","preventClickEventBubbling","onClick","rest","innerRef","handleRef","zIndex","handleKeyDown","event","defaultPrevented","key","preventDefault","handleClick","stopPropagation","displayName"],"mappings":"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","sourcesContent":["import React, {\n useCallback,\n useRef,\n useEffect,\n forwardRef,\n KeyboardEvent,\n} from \"react\";\nimport classnames from \"classnames\";\nimport FocusLock from \"react-focus-lock\";\nimport { Portal, useLayerContext } from \"../../helpers\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport { StyledWindow } from \"./Style\";\n\nexport interface IWindow {\n onClose?: () => void;\n disableFocusLock?: boolean;\n disableScrollLock?: boolean;\n preventClickEventBubbling?: boolean;\n}\n\nconst returnFocus = { preventScroll: true };\n\nexport const Window = forwardRef<\n HTMLDivElement,\n IWindow & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof IWindow>\n>(\n (\n {\n children,\n onClose,\n className,\n style,\n onKeyDown,\n disableFocusLock = false,\n disableScrollLock = false,\n preventClickEventBubbling = false,\n onClick,\n ...rest\n },\n ref\n ) => {\n const innerRef = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(innerRef, ref);\n const { zIndex = 1300 } = useLayerContext();\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent<HTMLDivElement>) => {\n if (\n !event.defaultPrevented &&\n (event.key === \"Esc\" || event.key === \"Escape\")\n ) {\n event.preventDefault();\n if (onClose) {\n onClose();\n }\n }\n if (typeof onKeyDown === \"function\") {\n onKeyDown(event);\n }\n },\n [onClose, onKeyDown]\n );\n\n useEffect(() => {\n return (): void => {\n typeof onClose === \"function\" && onClose();\n };\n // Dependency is empty because we only want to call onClose when component is unmounted\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const handleClick = useCallback(\n (event) => {\n if (preventClickEventBubbling) {\n event?.stopPropagation();\n }\n typeof onClick === \"function\" && onClick(event);\n },\n [onClick, preventClickEventBubbling]\n );\n\n return (\n <Portal>\n <FocusLock returnFocus={returnFocus} disabled={disableFocusLock}>\n <RemoveScroll\n forwardProps\n ref={handleRef}\n enabled={!disableScrollLock}\n noIsolation\n >\n <StyledWindow\n {...rest}\n style={{ zIndex, ...style }}\n onKeyDown={handleKeyDown}\n tabIndex={0}\n className={classnames(\"c-window\", className)}\n onClick={handleClick}\n >\n {children}\n </StyledWindow>\n </RemoveScroll>\n </FocusLock>\n </Portal>\n );\n }\n);\n\nWindow.displayName = \"Window\";\n"],"file":"Window.js"}
|
package/dist/index.js
CHANGED
|
@@ -1732,7 +1732,7 @@
|
|
|
1732
1732
|
})(["", " ", " position:fixed;top:0;right:0;bottom:0;left:0;"], FontStyle, BoxSizingStyle);
|
|
1733
1733
|
StyledWindow.displayName = "StyledWindow";
|
|
1734
1734
|
|
|
1735
|
-
var _excluded$M = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock"];
|
|
1735
|
+
var _excluded$M = ["children", "onClose", "className", "style", "onKeyDown", "disableFocusLock", "disableScrollLock", "preventClickEventBubbling", "onClick"];
|
|
1736
1736
|
var returnFocus = {
|
|
1737
1737
|
preventScroll: true
|
|
1738
1738
|
};
|
|
@@ -1746,6 +1746,9 @@
|
|
|
1746
1746
|
disableFocusLock = _ref$disableFocusLock === void 0 ? false : _ref$disableFocusLock,
|
|
1747
1747
|
_ref$disableScrollLoc = _ref.disableScrollLock,
|
|
1748
1748
|
disableScrollLock = _ref$disableScrollLoc === void 0 ? false : _ref$disableScrollLoc,
|
|
1749
|
+
_ref$preventClickEven = _ref.preventClickEventBubbling,
|
|
1750
|
+
preventClickEventBubbling = _ref$preventClickEven === void 0 ? false : _ref$preventClickEven,
|
|
1751
|
+
onClick = _ref.onClick,
|
|
1749
1752
|
rest = _objectWithoutProperties(_ref, _excluded$M);
|
|
1750
1753
|
|
|
1751
1754
|
var innerRef = React.useRef(null);
|
|
@@ -1774,6 +1777,13 @@
|
|
|
1774
1777
|
}; // Dependency is empty because we only want to call onClose when component is unmounted
|
|
1775
1778
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
1776
1779
|
}, []);
|
|
1780
|
+
var handleClick = React.useCallback(function (event) {
|
|
1781
|
+
if (preventClickEventBubbling) {
|
|
1782
|
+
event === null || event === void 0 ? void 0 : event.stopPropagation();
|
|
1783
|
+
}
|
|
1784
|
+
|
|
1785
|
+
typeof onClick === "function" && onClick(event);
|
|
1786
|
+
}, [onClick, preventClickEventBubbling]);
|
|
1777
1787
|
return /*#__PURE__*/React__default["default"].createElement(Portal, null, /*#__PURE__*/React__default["default"].createElement(FocusLock__default["default"], {
|
|
1778
1788
|
returnFocus: returnFocus,
|
|
1779
1789
|
disabled: disableFocusLock
|
|
@@ -1788,7 +1798,8 @@
|
|
|
1788
1798
|
}, style),
|
|
1789
1799
|
onKeyDown: handleKeyDown,
|
|
1790
1800
|
tabIndex: 0,
|
|
1791
|
-
className: classnames__default["default"]("c-window", className)
|
|
1801
|
+
className: classnames__default["default"]("c-window", className),
|
|
1802
|
+
onClick: handleClick
|
|
1792
1803
|
}), children))));
|
|
1793
1804
|
});
|
|
1794
1805
|
Window.displayName = "Window";
|
|
@@ -1894,7 +1905,9 @@
|
|
|
1894
1905
|
popperClassName = _ref.popperClassName,
|
|
1895
1906
|
backgroundElementClass = _ref.backgroundElementClass,
|
|
1896
1907
|
_ref$windowAbsolutely = _ref.windowAbsolutelyPositioned,
|
|
1897
|
-
windowAbsolutelyPositioned = _ref$windowAbsolutely === void 0 ? false : _ref$windowAbsolutely
|
|
1908
|
+
windowAbsolutelyPositioned = _ref$windowAbsolutely === void 0 ? false : _ref$windowAbsolutely,
|
|
1909
|
+
_ref$preventClickEven = _ref.preventClickEventBubbling,
|
|
1910
|
+
preventClickEventBubbling = _ref$preventClickEven === void 0 ? false : _ref$preventClickEven;
|
|
1898
1911
|
|
|
1899
1912
|
var _useState = React.useState(defaultOpen),
|
|
1900
1913
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -1939,7 +1952,8 @@
|
|
|
1939
1952
|
disableFocusLock: disableFocusLock,
|
|
1940
1953
|
style: {
|
|
1941
1954
|
position: windowAbsolutelyPositioned ? "absolute" : "fixed"
|
|
1942
|
-
}
|
|
1955
|
+
},
|
|
1956
|
+
preventClickEventBubbling: preventClickEventBubbling
|
|
1943
1957
|
}, /*#__PURE__*/React__default["default"].createElement(Overlay, {
|
|
1944
1958
|
className: backgroundElementClass,
|
|
1945
1959
|
onClick: handleClose,
|
|
@@ -7756,7 +7770,7 @@
|
|
|
7756
7770
|
function () {});
|
|
7757
7771
|
}
|
|
7758
7772
|
|
|
7759
|
-
var _excluded$i = ["children", "disableFocusLock", "disableScrollLock", "disableBackgroundClick", "disableBackgroundColor", "open", "onClose"];
|
|
7773
|
+
var _excluded$i = ["children", "disableFocusLock", "disableScrollLock", "disableBackgroundClick", "disableBackgroundColor", "preventClickEventBubbling", "open", "onClose"];
|
|
7760
7774
|
|
|
7761
7775
|
var getHasTransition = function getHasTransition(children) {
|
|
7762
7776
|
return children.props ? Object.prototype.hasOwnProperty.call(children.props, "in") : false;
|
|
@@ -7772,6 +7786,8 @@
|
|
|
7772
7786
|
disableBackgroundClick = _ref$disableBackgroun === void 0 ? false : _ref$disableBackgroun,
|
|
7773
7787
|
_ref$disableBackgroun2 = _ref.disableBackgroundColor,
|
|
7774
7788
|
disableBackgroundColor = _ref$disableBackgroun2 === void 0 ? false : _ref$disableBackgroun2,
|
|
7789
|
+
_ref$preventClickEven = _ref.preventClickEventBubbling,
|
|
7790
|
+
preventClickEventBubbling = _ref$preventClickEven === void 0 ? false : _ref$preventClickEven,
|
|
7775
7791
|
_ref$open = _ref.open,
|
|
7776
7792
|
defaultOpen = _ref$open === void 0 ? false : _ref$open,
|
|
7777
7793
|
onClose = _ref.onClose,
|
|
@@ -7837,7 +7853,8 @@
|
|
|
7837
7853
|
ref: handleRef,
|
|
7838
7854
|
onClose: handleClose,
|
|
7839
7855
|
disableFocusLock: disableFocusLock,
|
|
7840
|
-
disableScrollLock: disableScrollLock
|
|
7856
|
+
disableScrollLock: disableScrollLock,
|
|
7857
|
+
preventClickEventBubbling: preventClickEventBubbling
|
|
7841
7858
|
}), open ? /*#__PURE__*/React__default["default"].createElement(Overlay, {
|
|
7842
7859
|
onClick: handleBackgroundClick,
|
|
7843
7860
|
disableBackgroundColor: disableBackgroundColor
|
|
@@ -7914,7 +7931,7 @@
|
|
|
7914
7931
|
});
|
|
7915
7932
|
StyledCssTransition.displayName = "StyledCssTransition";
|
|
7916
7933
|
|
|
7917
|
-
var _excluded$h = ["children", "onClose", "controls", "open", "animation", "position", "mode", "disableFocusLock", "disableScrollLock", "disableBackgroundColor", "bodyStyle", "bodyClassName", "disableBackgroundClick"];
|
|
7934
|
+
var _excluded$h = ["children", "onClose", "controls", "open", "animation", "position", "mode", "disableFocusLock", "disableScrollLock", "disableBackgroundColor", "bodyStyle", "bodyClassName", "disableBackgroundClick", "preventClickEventBubbling"];
|
|
7918
7935
|
var Sheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
7919
7936
|
var children = _ref.children,
|
|
7920
7937
|
onClose = _ref.onClose,
|
|
@@ -7938,6 +7955,8 @@
|
|
|
7938
7955
|
bodyClassName = _ref.bodyClassName,
|
|
7939
7956
|
_ref$disableBackgroun2 = _ref.disableBackgroundClick,
|
|
7940
7957
|
disableBackgroundClick = _ref$disableBackgroun2 === void 0 ? false : _ref$disableBackgroun2,
|
|
7958
|
+
_ref$preventClickEven = _ref.preventClickEventBubbling,
|
|
7959
|
+
preventClickEventBubbling = _ref$preventClickEven === void 0 ? false : _ref$preventClickEven,
|
|
7941
7960
|
rest = _objectWithoutProperties(_ref, _excluded$h);
|
|
7942
7961
|
|
|
7943
7962
|
var _useState = React.useState(defaultOpen),
|
|
@@ -7980,7 +7999,8 @@
|
|
|
7980
7999
|
ref: handleRef,
|
|
7981
8000
|
onClose: handleClose,
|
|
7982
8001
|
disableFocusLock: disableFocusLock,
|
|
7983
|
-
disableScrollLock: disableScrollLock
|
|
8002
|
+
disableScrollLock: disableScrollLock,
|
|
8003
|
+
preventClickEventBubbling: preventClickEventBubbling
|
|
7984
8004
|
}), open ? /*#__PURE__*/React__default["default"].createElement(Overlay, {
|
|
7985
8005
|
onClick: handleBackgroundClick,
|
|
7986
8006
|
disableBackgroundColor: disableBackgroundColor
|