@procore/core-react 11.12.1 → 11.13.0-rc.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/Modal/Modal.d.ts +3 -1
- package/dist/Modal/Modal.js +72 -19
- package/dist/Modal/Modal.js.map +1 -1
- package/dist/Modal/Modal.types.d.ts +59 -3
- package/dist/OverlayTrigger/OverlayTrigger.d.ts +6 -6
- package/dist/OverlayTrigger/OverlayTrigger.js +43 -32
- package/dist/OverlayTrigger/OverlayTrigger.js.map +1 -1
- package/dist/OverlayTrigger/OverlayTrigger.types.d.ts +15 -7
- package/dist/OverlayTrigger/a11yPresets.d.ts +202 -1
- package/dist/OverlayTrigger/a11yPresets.js +210 -0
- package/dist/OverlayTrigger/a11yPresets.js.map +1 -1
- package/dist/Popover/Popover.d.ts +24 -2
- package/dist/Popover/Popover.js +6 -4
- package/dist/Popover/Popover.js.map +1 -1
- package/dist/Popover/Popover.types.d.ts +15 -2
- package/dist/Portal/Portal.d.ts +1 -1
- package/dist/Portal/Portal.js +24 -2
- package/dist/Portal/Portal.js.map +1 -1
- package/dist/Section/Section.d.ts +4 -0
- package/dist/Section/Section.js +12 -6
- package/dist/Section/Section.js.map +1 -1
- package/dist/Semantic/Semantic.d.ts +8 -0
- package/dist/Semantic/Semantic.js +28 -0
- package/dist/Semantic/Semantic.js.map +1 -1
- package/dist/Semantic/Semantic.types.d.ts +1 -1
- package/dist/Tearsheet/Tearsheet.d.ts +7 -1
- package/dist/Tearsheet/Tearsheet.js +32 -19
- package/dist/Tearsheet/Tearsheet.js.map +1 -1
- package/dist/Tearsheet/Tearsheet.types.d.ts +24 -0
- package/dist/_hooks/I18n.d.ts +1 -0
- package/dist/_locales/en.json +2 -1
- package/dist/_typedoc/Avatar/Avatar.types.json +28 -28
- package/dist/_typedoc/AvatarStack/AvatarStack.types.json +22 -22
- package/dist/_typedoc/Badge/Badge.types.json +10 -10
- package/dist/_typedoc/Banner/Banner.types.json +19 -19
- package/dist/_typedoc/Box/Box.types.json +70 -70
- package/dist/_typedoc/Breadcrumbs/Breadcrumbs.types.json +14 -14
- package/dist/_typedoc/Button/Button.types.json +11 -11
- package/dist/_typedoc/Calendar/Calendar.types.json +98 -98
- package/dist/_typedoc/Card/Card.types.json +8 -8
- package/dist/_typedoc/Checkbox/Checkbox.types.json +7 -7
- package/dist/_typedoc/ContactItem/ContactItem.types.json +11 -11
- package/dist/_typedoc/DateInput/DateInput.types.json +37 -37
- package/dist/_typedoc/DateSelect/DateSelect.types.json +13 -13
- package/dist/_typedoc/DetailPage/DetailPage.types.json +6 -6
- package/dist/_typedoc/Dropdown/Dropdown.types.json +37 -37
- package/dist/_typedoc/DropdownFlyout/DropdownFlyout.types.json +31 -31
- package/dist/_typedoc/Dropzone/Dropzone.types.json +41 -41
- package/dist/_typedoc/EmptyState/EmptyState.types.json +22 -22
- package/dist/_typedoc/FileList/FileList.types.json +9 -9
- package/dist/_typedoc/FileSelect/FileSelect.types.json +26 -26
- package/dist/_typedoc/FileSelect/GridSource/GridSource.types.json +20 -20
- package/dist/_typedoc/FileSelect/LocalSource/LocalSource.types.json +14 -14
- package/dist/_typedoc/FileSelect/TreeSource/TreeSource.types.json +9 -9
- package/dist/_typedoc/Flex/Flex.types.json +29 -29
- package/dist/_typedoc/FlexList/FlexList.types.json +32 -32
- package/dist/_typedoc/Form/Form.types.json +698 -698
- package/dist/_typedoc/Grid/Grid.types.json +8 -8
- package/dist/_typedoc/GroupSelect/GroupSelect.types.json +54 -54
- package/dist/_typedoc/Input/Input.types.json +2 -2
- package/dist/_typedoc/Link/Link.types.json +6 -6
- package/dist/_typedoc/ListPage/ListPage.types.json +19 -19
- package/dist/_typedoc/Menu/Menu.types.json +68 -68
- package/dist/_typedoc/MenuImperative/MenuImperative.types.json +75 -75
- package/dist/_typedoc/Modal/Modal.types.json +213 -70
- package/dist/_typedoc/MultiSelect/MultiSelect.types.json +31 -31
- package/dist/_typedoc/Notation/Notation.types.json +6 -6
- package/dist/_typedoc/NumberInput/NumberInput.types.json +38 -38
- package/dist/_typedoc/OverlayTrigger/OverlayTrigger.types.json +76 -34
- package/dist/_typedoc/PageLayout/PageLayout.types.json +32 -32
- package/dist/_typedoc/Pagination/Pagination.types.json +9 -9
- package/dist/_typedoc/Panel/Panel.types.json +29 -29
- package/dist/_typedoc/Pill/Pill.types.json +1 -1
- package/dist/_typedoc/PillSelect/PillSelect.types.json +46 -46
- package/dist/_typedoc/Popover/Popover.types.json +60 -38
- package/dist/_typedoc/ProgressBar/ProgressBar.types.json +8 -8
- package/dist/_typedoc/RadioButton/RadioButton.types.json +8 -8
- package/dist/_typedoc/Required/Required.types.json +5 -5
- package/dist/_typedoc/Search/Search.types.json +18 -18
- package/dist/_typedoc/Section/Section.types.json +16 -16
- package/dist/_typedoc/SegmentedController/SegmentedController.types.json +26 -26
- package/dist/_typedoc/Select/Select.types.json +32 -32
- package/dist/_typedoc/Slider/Slider.types.json +6 -6
- package/dist/_typedoc/Spinner/Spinner.types.json +11 -11
- package/dist/_typedoc/Switch/Switch.types.json +5 -5
- package/dist/_typedoc/Table/Table.types.json +116 -116
- package/dist/_typedoc/Tabs/Tabs.types.json +21 -21
- package/dist/_typedoc/Tearsheet/Tearsheet.types.json +70 -10
- package/dist/_typedoc/TextArea/TextArea.types.json +3 -3
- package/dist/_typedoc/TextEditor/TextEditor.types.json +9 -9
- package/dist/_typedoc/TextEditorOutput/TextEditorOutput.types.json +3 -3
- package/dist/_typedoc/Thumbnail/Thumbnail.types.json +21 -21
- package/dist/_typedoc/TieredDropdown/TieredDropdown.types.json +42 -42
- package/dist/_typedoc/TieredSelect/TieredSelect.types.json +28 -28
- package/dist/_typedoc/Tile/Tile.types.json +42 -42
- package/dist/_typedoc/Toast/Toast.types.json +6 -6
- package/dist/_typedoc/ToggleButton/ToggleButton.types.json +3 -3
- package/dist/_typedoc/Token/Token.types.json +4 -4
- package/dist/_typedoc/ToolHeader/ToolHeader.types.json +14 -14
- package/dist/_typedoc/Tooltip/Tooltip.types.json +17 -17
- package/dist/_typedoc/Tree/Tree.types.json +88 -88
- package/dist/_typedoc/Typeahead/Typeahead.types.json +2 -2
- package/dist/_typedoc/Typography/Typography.types.json +8 -8
- package/dist/_typedoc/_utils/types.json +5 -5
- package/dist/_utils/polymorphic.d.ts +4 -4
- package/dist/_utils/types.d.ts +0 -3
- package/package.json +3 -2
package/dist/Modal/Modal.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { Heading } from '../Section/Section';
|
|
2
3
|
import { TypographyProps } from '../Typography/Typography.types';
|
|
3
4
|
import { RenderProps } from '../_hooks/Visibility';
|
|
4
5
|
import { DivAttributes, SpanAttributes } from '../_utils/types';
|
|
@@ -10,10 +11,11 @@ export declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.R
|
|
|
10
11
|
Container: React.ForwardRefExoticComponent<ModalContainerProps & React.RefAttributes<HTMLDivElement>>;
|
|
11
12
|
Content: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
12
13
|
Footer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
13
|
-
FooterButtons:
|
|
14
|
+
FooterButtons: React.ForwardRefExoticComponent<ModalCloseableHeaderProps & React.RefAttributes<HTMLDivElement>>;
|
|
14
15
|
FooterNotation: React.ForwardRefExoticComponent<SpanAttributes & TypographyProps & React.RefAttributes<HTMLSpanElement>>;
|
|
15
16
|
FooterSummary: React.ForwardRefExoticComponent<DivAttributes & React.RefAttributes<HTMLDivElement>>;
|
|
16
17
|
Header: React.ForwardRefExoticComponent<ModalCloseableHeaderProps & React.RefAttributes<HTMLDivElement>>;
|
|
18
|
+
Heading: typeof Heading;
|
|
17
19
|
Overlay: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
18
20
|
Scrim: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
19
21
|
State: typeof ModalState;
|
package/dist/Modal/Modal.js
CHANGED
|
@@ -25,8 +25,9 @@ import { FocusScope } from '@react-aria/focus';
|
|
|
25
25
|
import React from 'react';
|
|
26
26
|
import { Button } from '../Button/Button';
|
|
27
27
|
import { CloseWithConfirmContext, useCloseWithConfirmContext, useCloseWithConfirmState, } from '../Form/closeWithConfirm';
|
|
28
|
+
import { useModalDialogLike } from '../OverlayTrigger/a11yPresets';
|
|
28
29
|
import { Portal } from '../Portal/Portal';
|
|
29
|
-
import { LevelContext, Section, SectionProvider } from '../Section/Section';
|
|
30
|
+
import { Heading, LevelContext, Section, SectionProvider, } from '../Section/Section';
|
|
30
31
|
import { useDeprecation } from '../_hooks/Deprecation';
|
|
31
32
|
import { useLayoutEventListener } from '../_hooks/EventListener';
|
|
32
33
|
import { useI18nContext } from '../_hooks/I18n';
|
|
@@ -37,19 +38,47 @@ import { addSubcomponents } from '../_utils/addSubcomponents';
|
|
|
37
38
|
import { mergeRefs } from '../_utils/mergeRefs';
|
|
38
39
|
import { fadeInClassName, fadeOutClassName, StyledModal, StyledModalBody, StyledModalButtons, StyledModalCancel, StyledModalContainer, StyledModalContent, StyledModalFooter, StyledModalFooterNotation, StyledModalFooterSummary, StyledModalHeader, StyledModalHeading, StyledModalScrim, StyledModalWarningIcon, } from './Modal.styles';
|
|
39
40
|
function noop() { }
|
|
40
|
-
var
|
|
41
|
+
var defaultStartLevel = 2;
|
|
42
|
+
var initialBodyLevel = 3;
|
|
43
|
+
// TODO default in breaking
|
|
44
|
+
var defaultHowToClose = ['scrim', 'x'];
|
|
45
|
+
var ModalCloseContext = React.createContext({
|
|
46
|
+
howToClose: [],
|
|
47
|
+
onClose: undefined,
|
|
48
|
+
});
|
|
49
|
+
var ModalBodyScrollContext = React.createContext({
|
|
41
50
|
isBodyScrolled: false,
|
|
42
51
|
setIsBodyScrolled: noop,
|
|
43
52
|
});
|
|
44
53
|
var ModalClosableHeader = React.forwardRef(function (_a, ref) {
|
|
45
|
-
var children = _a.children,
|
|
46
|
-
var isBodyScrolled = React.useContext(
|
|
54
|
+
var children = _a.children, externalOnClose = _a.onClose, qa = _a.qa, props = __rest(_a, ["children", "onClose", "qa"]);
|
|
55
|
+
var isBodyScrolled = React.useContext(ModalBodyScrollContext).isBodyScrolled;
|
|
56
|
+
var _b = React.useContext(ModalCloseContext), howToClose = _b.howToClose, onClose = _b.onClose;
|
|
47
57
|
var I18n = useI18nContext();
|
|
48
58
|
var closeWithConfirm = useCloseWithConfirmContext().closeWithConfirm;
|
|
59
|
+
function onClickButton(e) {
|
|
60
|
+
if (onClose && (howToClose === null || howToClose === void 0 ? void 0 : howToClose.includes('x'))) {
|
|
61
|
+
closeWithConfirm(onClose)(e, 'x');
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
closeWithConfirm(externalOnClose)(e);
|
|
65
|
+
}
|
|
49
66
|
return (React.createElement(StyledModalHeader, __assign({ "$isBodyScrolled": isBodyScrolled }, props, { ref: ref }),
|
|
50
67
|
React.createElement(StyledModalHeading, null, children),
|
|
51
|
-
onClose && (React.createElement(StyledModalCancel, null,
|
|
52
|
-
React.createElement(Button, { "aria-label": I18n.t('core.modal.a11y.close'), "data-qa": qa === null || qa === void 0 ? void 0 : qa.closeButton, onClick:
|
|
68
|
+
(onClose && (howToClose === null || howToClose === void 0 ? void 0 : howToClose.includes('x'))) || externalOnClose ? (React.createElement(StyledModalCancel, null,
|
|
69
|
+
React.createElement(Button, { "aria-label": I18n.t('core.modal.a11y.close'), "data-qa": qa === null || qa === void 0 ? void 0 : qa.closeButton, onClick: onClickButton, icon: React.createElement(Clear, null), variant: "tertiary", tabIndex: -1 }))) : null));
|
|
70
|
+
});
|
|
71
|
+
var ModalClosableFooterButtons = React.forwardRef(function (_a, ref) {
|
|
72
|
+
var children = _a.children, props = __rest(_a, ["children"]);
|
|
73
|
+
var _b = React.useContext(ModalCloseContext), howToClose = _b.howToClose, onClose = _b.onClose;
|
|
74
|
+
var I18n = useI18nContext();
|
|
75
|
+
var closeWithConfirm = useCloseWithConfirmContext().closeWithConfirm;
|
|
76
|
+
function onClickButton(e) {
|
|
77
|
+
closeWithConfirm(onClose)(e, 'footer-button');
|
|
78
|
+
}
|
|
79
|
+
return (React.createElement(StyledModalButtons, __assign({}, props, { ref: ref }),
|
|
80
|
+
(howToClose === null || howToClose === void 0 ? void 0 : howToClose.includes('footer-button')) && (React.createElement(Button, { onClick: onClickButton, variant: "tertiary" }, I18n.t('core.modal.cancel'))),
|
|
81
|
+
children));
|
|
53
82
|
});
|
|
54
83
|
var ModalContainer = React.forwardRef(function (_a, ref) {
|
|
55
84
|
var placement = _a.placement, width = _a.width, props = __rest(_a, ["placement", "width"]);
|
|
@@ -59,7 +88,7 @@ var ModalBody = React.forwardRef(function (_a, ref) {
|
|
|
59
88
|
var children = _a.children, _b = _a.noSideSpacing, noSideSpacing = _b === void 0 ? false : _b, props = __rest(_a, ["children", "noSideSpacing"]);
|
|
60
89
|
var _c = useOverflowObserver(), isOverflowingY = _c.isOverflowingY, overflowRef = _c.ref;
|
|
61
90
|
var scrollRef = React.useRef(null);
|
|
62
|
-
var setIsBodyScrolled = React.useContext(
|
|
91
|
+
var setIsBodyScrolled = React.useContext(ModalBodyScrollContext).setIsBodyScrolled;
|
|
63
92
|
useLayoutEventListener({
|
|
64
93
|
event: 'scroll',
|
|
65
94
|
handler: function (e) {
|
|
@@ -68,7 +97,7 @@ var ModalBody = React.forwardRef(function (_a, ref) {
|
|
|
68
97
|
scope: scrollRef,
|
|
69
98
|
});
|
|
70
99
|
return (React.createElement(SectionProvider, null,
|
|
71
|
-
React.createElement(LevelContext.Provider, { value:
|
|
100
|
+
React.createElement(LevelContext.Provider, { value: initialBodyLevel },
|
|
72
101
|
React.createElement(StyledModalBody, __assign({}, props, { isOverflowingY: isOverflowingY, noSideSpacing: noSideSpacing, ref: mergeRefs(overflowRef, scrollRef, ref) }), children))));
|
|
73
102
|
});
|
|
74
103
|
var ModalFooterSummary = React.forwardRef(function (_a, ref) {
|
|
@@ -96,7 +125,7 @@ var ModalFooterNotation = React.forwardRef(function (_a, ref) {
|
|
|
96
125
|
|
|
97
126
|
*/
|
|
98
127
|
var Modal_ = React.forwardRef(function (_a, ref) {
|
|
99
|
-
var children = _a.children, _b = _a.onClickOverlay, onClickOverlay = _b === void 0 ? noop : _b, onClose = _a.onClose, _c = _a.open, open = _c === void 0 ? false : _c, _d = _a.placement, placement = _d === void 0 ? 'center' : _d, props = __rest(_a, ["children", "onClickOverlay", "onClose", "open", "placement"]);
|
|
128
|
+
var ariaDescribedby = _a["aria-describedby"], ariaDetails = _a["aria-details"], ariaLabelledby = _a["aria-labelledby"], ariaLabel = _a["aria-label"], children = _a.children, howToClose = _a.howToClose, id = _a.id, _b = _a.onClickOverlay, onClickOverlay = _b === void 0 ? noop : _b, onClose = _a.onClose, _c = _a.open, open = _c === void 0 ? false : _c, _d = _a.placement, placement = _d === void 0 ? 'center' : _d, role = _a.role, props = __rest(_a, ['aria-describedby', 'aria-details', 'aria-labelledby', 'aria-label', "children", "howToClose", "id", "onClickOverlay", "onClose", "open", "placement", "role"]);
|
|
100
129
|
useScrollLock(open);
|
|
101
130
|
var _e = React.useState(open), visible = _e[0], setVisible = _e[1];
|
|
102
131
|
var _f = React.useState(''), fadeType = _f[0], setFadeType = _f[1];
|
|
@@ -124,22 +153,45 @@ var Modal_ = React.forwardRef(function (_a, ref) {
|
|
|
124
153
|
if (e.key === 'Escape') {
|
|
125
154
|
e.preventDefault();
|
|
126
155
|
e.stopPropagation();
|
|
127
|
-
closeWithConfirm(onClose)(e);
|
|
156
|
+
closeWithConfirm(onClose)(e, 'x');
|
|
128
157
|
}
|
|
129
158
|
};
|
|
159
|
+
var dialogProps_ = useModalDialogLike({
|
|
160
|
+
'aria-describedby': ariaDescribedby,
|
|
161
|
+
'aria-details': ariaDetails,
|
|
162
|
+
'aria-labelledby': ariaLabelledby,
|
|
163
|
+
'aria-label': ariaLabel,
|
|
164
|
+
id: id,
|
|
165
|
+
isModal: false,
|
|
166
|
+
isOpen: open,
|
|
167
|
+
role: role,
|
|
168
|
+
}).dialogProps;
|
|
169
|
+
var dialogProps = onClose && role === 'dialog' ? dialogProps_ : {};
|
|
170
|
+
function onClickScrim(e) {
|
|
171
|
+
onClickOverlay(e);
|
|
172
|
+
if (onClose && (howToClose === null || howToClose === void 0 ? void 0 : howToClose.includes('scrim'))) {
|
|
173
|
+
closeWithConfirm(onClose)(e, 'scrim');
|
|
174
|
+
}
|
|
175
|
+
}
|
|
130
176
|
return visible ? (React.createElement(Portal, null,
|
|
131
|
-
React.createElement(
|
|
132
|
-
React.createElement(
|
|
133
|
-
React.createElement(
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
177
|
+
React.createElement(ModalCloseContext.Provider, { value: { onClose: onClose, howToClose: howToClose } },
|
|
178
|
+
React.createElement(LevelContext.Provider, { value: defaultStartLevel },
|
|
179
|
+
React.createElement(FocusScope
|
|
180
|
+
// TODO breaking - always
|
|
181
|
+
, {
|
|
182
|
+
// TODO breaking - always
|
|
183
|
+
autoFocus: !!onClose, contain: !!onClose, restoreFocus: !!onClose },
|
|
184
|
+
React.createElement(StyledModal, __assign({ className: fadeType, ref: ref, onTransitionEnd: onTransitionEnd, onKeyDown: handleKeyDown }, dialogProps),
|
|
185
|
+
React.createElement(StyledModalScrim, { onClick: onClickScrim }),
|
|
186
|
+
React.createElement(ModalContainer, __assign({}, props, { placement: placement }),
|
|
187
|
+
React.createElement(StyledModalContent, null,
|
|
188
|
+
React.createElement(ModalBodyScrollObserver, null,
|
|
189
|
+
React.createElement(CloseWithConfirmContext.Provider, { value: closeWithConfirmState }, children)))))))))) : null;
|
|
138
190
|
});
|
|
139
191
|
function ModalBodyScrollObserver(_a) {
|
|
140
192
|
var children = _a.children;
|
|
141
193
|
var _b = React.useState(false), isBodyScrolled = _b[0], setIsBodyScrolled = _b[1];
|
|
142
|
-
return (React.createElement(
|
|
194
|
+
return (React.createElement(ModalBodyScrollContext.Provider, { value: { isBodyScrolled: isBodyScrolled, setIsBodyScrolled: setIsBodyScrolled } }, children));
|
|
143
195
|
}
|
|
144
196
|
export var ConfirmModal = React.forwardRef(function (_a, ref) {
|
|
145
197
|
var children = _a.children, headline = _a.headline, onClose = _a.onClose, props = __rest(_a, ["children", "headline", "onClose"]);
|
|
@@ -163,7 +215,7 @@ var Container = ModalContainer;
|
|
|
163
215
|
var Content = StyledModalContent;
|
|
164
216
|
var FooterSummary = ModalFooterSummary;
|
|
165
217
|
var Footer = StyledModalFooter;
|
|
166
|
-
var FooterButtons =
|
|
218
|
+
var FooterButtons = ModalClosableFooterButtons;
|
|
167
219
|
var FooterNotation = ModalFooterNotation;
|
|
168
220
|
var Header = ModalClosableHeader;
|
|
169
221
|
var Overlay = StyledModal;
|
|
@@ -178,6 +230,7 @@ export var Modal = addSubcomponents({
|
|
|
178
230
|
FooterNotation: FooterNotation,
|
|
179
231
|
FooterSummary: FooterSummary,
|
|
180
232
|
Header: Header,
|
|
233
|
+
Heading: Heading,
|
|
181
234
|
Overlay: Overlay,
|
|
182
235
|
Scrim: Scrim,
|
|
183
236
|
State: State,
|
package/dist/Modal/Modal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../src/Modal/Modal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAC9C,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EACL,uBAAuB,EACvB,0BAA0B,EAC1B,wBAAwB,GACzB,MAAM,0BAA0B,CAAA;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../src/Modal/Modal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,25 +2,76 @@ import React from 'react';
|
|
|
2
2
|
import { DivAttributes, Props } from '../_utils/types';
|
|
3
3
|
export declare type ModalPlacement = 'top' | 'center';
|
|
4
4
|
export declare type ModalWidth = 'sm' | 'md' | 'lg' | 'xl';
|
|
5
|
+
/**
|
|
6
|
+
* Additional UI/UX to dismiss. (In addition to the Esc key)
|
|
7
|
+
* - `x` Close Button in the Modal Header
|
|
8
|
+
* - `scrim` Overlay dimmed scrim
|
|
9
|
+
* - `footer-button` Cancel Button in the Modal Footer Actions
|
|
10
|
+
*/
|
|
11
|
+
export declare type ModalOptionalCloseStartegy = 'x' | 'footer-button' | 'scrim';
|
|
12
|
+
declare type ModalCloseStragety = 'esc' | ModalOptionalCloseStartegy;
|
|
13
|
+
declare type ModalOnClose = (event: React.MouseEvent<HTMLDivElement> | React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLElement>, how: ModalCloseStragety) => void;
|
|
14
|
+
export interface ModalCloseContextApi {
|
|
15
|
+
/**
|
|
16
|
+
* Escape key will always close a dialog. This adds additional UI or UX to close.
|
|
17
|
+
*/
|
|
18
|
+
howToClose: ModalOptionalCloseStartegy[] | undefined;
|
|
19
|
+
onClose: ModalOnClose | undefined;
|
|
20
|
+
}
|
|
21
|
+
export interface ModalCloseableHeaderProps extends DivAttributes {
|
|
22
|
+
qa?: {
|
|
23
|
+
closeButton?: string;
|
|
24
|
+
};
|
|
25
|
+
}
|
|
5
26
|
export interface ModalProps extends Props {
|
|
27
|
+
'aria-describedby'?: string;
|
|
28
|
+
'aria-details'?: string;
|
|
29
|
+
/**
|
|
30
|
+
* @a11y `role='dialog'` MUST be labelled. Prefer `aria-labelledby` over `aria-label`.
|
|
31
|
+
* @since 11.12.0
|
|
32
|
+
*/
|
|
33
|
+
'aria-labelledby'?: string;
|
|
34
|
+
/**
|
|
35
|
+
* @a11y `role='dialog'` MUST be labelled. Prefer `aria-labelledby` over `aria-label`.
|
|
36
|
+
* @since 11.12.0
|
|
37
|
+
*/
|
|
38
|
+
'aria-label'?: string;
|
|
39
|
+
/**
|
|
40
|
+
* This adds additional UI or UX to close. Escape key will always close a dialog, see `onClose`.
|
|
41
|
+
*
|
|
42
|
+
* NOTE 'footer-button': Footer Cancel button still requires at least a rendered self closing `Modal.FooterButtons`.
|
|
43
|
+
*
|
|
44
|
+
* NOTE 'x': The X button still requires a rendered `Modal.Header` component.
|
|
45
|
+
* @defaultValue []
|
|
46
|
+
* @since 11.12.0
|
|
47
|
+
*/
|
|
48
|
+
howToClose?: ModalOptionalCloseStartegy[];
|
|
49
|
+
/**
|
|
50
|
+
* Aligns with `role` and `ref` location.
|
|
51
|
+
*/
|
|
52
|
+
id?: string;
|
|
6
53
|
/**
|
|
7
54
|
* Callback for clicking the overlay
|
|
8
55
|
* @since 10.19.0
|
|
9
56
|
*/
|
|
10
57
|
onClickOverlay?: (event: React.MouseEvent<HTMLDivElement>) => void;
|
|
11
58
|
/**
|
|
12
|
-
*
|
|
13
|
-
* @a11y Moves focus into and cycles focus in the Modal,
|
|
59
|
+
* When a user closes the Modal by some approved `howToClose` method or the Escape key. This also opts-in to dialog focus management.
|
|
60
|
+
* @a11y Future default! Moves focus into and cycles focus in the Modal, and returning focus
|
|
14
61
|
* to the trigger when closed. Also enables the Escape key to close the Modal.
|
|
15
62
|
* @since 11.6.0
|
|
16
63
|
*/
|
|
17
|
-
onClose?:
|
|
64
|
+
onClose?: ModalOnClose;
|
|
18
65
|
/**
|
|
19
66
|
* Modal open state
|
|
20
67
|
* @defaultValue false
|
|
21
68
|
* @since 10.19.0
|
|
22
69
|
*/
|
|
23
70
|
open?: boolean;
|
|
71
|
+
/**
|
|
72
|
+
* Enable dialog props. REQUIRES `onClose` to enable Escape key and focus management. MUST be labelled, prefer `aria-labelledby` over `aria-label`.
|
|
73
|
+
*/
|
|
74
|
+
role?: 'dialog';
|
|
24
75
|
/**
|
|
25
76
|
* Vertical placement of the modal
|
|
26
77
|
* @defaultValue center
|
|
@@ -56,6 +107,10 @@ export interface ConfirmModalProps extends Omit<ModalProps, 'onClose'> {
|
|
|
56
107
|
*/
|
|
57
108
|
onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
|
58
109
|
}
|
|
110
|
+
/**
|
|
111
|
+
* NOTE: Using howToClose 'x' requires the `Modal.Header` component.
|
|
112
|
+
* @a11y This component is a not semantic heading! For that, see `Modal.Heading`.
|
|
113
|
+
*/
|
|
59
114
|
export interface ModalCloseableHeaderProps extends Props {
|
|
60
115
|
/**
|
|
61
116
|
* @since 10.19.0
|
|
@@ -76,3 +131,4 @@ export interface ModalBodyProps extends DivAttributes {
|
|
|
76
131
|
*/
|
|
77
132
|
noSideSpacing?: boolean;
|
|
78
133
|
}
|
|
134
|
+
export {};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Placement } from '../_utils/placement';
|
|
3
|
-
import { OverlayTriggerProps
|
|
3
|
+
import { OverlayTriggerProps } from './OverlayTrigger.types';
|
|
4
4
|
/**
|
|
5
5
|
|
|
6
6
|
@since 10.19.0
|
|
@@ -18,18 +18,18 @@ export declare function useOverlayTriggerContext(): {
|
|
|
18
18
|
toggle: (event: any) => any;
|
|
19
19
|
};
|
|
20
20
|
interface TriggerOverlayProps {
|
|
21
|
+
containFocus?: boolean;
|
|
22
|
+
autoFocus?: boolean;
|
|
23
|
+
restoreFocus?: boolean;
|
|
21
24
|
placement: Placement;
|
|
22
25
|
canFlip?: boolean;
|
|
23
26
|
arrow?: boolean;
|
|
24
27
|
padding: number;
|
|
25
28
|
shrinkOverlay: boolean;
|
|
26
29
|
overlay: React.ReactNode;
|
|
30
|
+
overlayCloneProps: any;
|
|
31
|
+
wrapperProps: Record<string, unknown>;
|
|
27
32
|
referenceElement: HTMLElement | null;
|
|
28
|
-
role?: OverlayTriggerRole;
|
|
29
|
-
overlayId: string;
|
|
30
|
-
autoFocus?: boolean;
|
|
31
|
-
containFocus?: boolean;
|
|
32
|
-
passA11yPropsToOverlay: boolean;
|
|
33
33
|
}
|
|
34
34
|
export declare const TriggerOverlay: React.ForwardRefExoticComponent<TriggerOverlayProps & React.RefAttributes<HTMLElement>>;
|
|
35
35
|
export {};
|
|
@@ -32,7 +32,7 @@ import { DelayedToggleContext, useDelayedToggle, useDelayedToggleContext, } from
|
|
|
32
32
|
import { Trigger, useTrigger } from '../_hooks/Trigger';
|
|
33
33
|
import { useVisibility } from '../_hooks/Visibility';
|
|
34
34
|
import { mergeRefs } from '../_utils/mergeRefs';
|
|
35
|
-
import {
|
|
35
|
+
import { useOverlayTriggerA11y } from './a11yPresets';
|
|
36
36
|
if (!(globalThis === null || globalThis === void 0 ? void 0 : globalThis.ResizeObserver)) {
|
|
37
37
|
globalThis.ResizeObserver = ResizeObserverPolyfill;
|
|
38
38
|
}
|
|
@@ -52,19 +52,24 @@ var ClickOutside = function (_a) {
|
|
|
52
52
|
|
|
53
53
|
*/
|
|
54
54
|
export var OverlayTrigger = React.forwardRef(function OverlayTrigger(_a, ref) {
|
|
55
|
-
var _b;
|
|
56
|
-
|
|
57
|
-
_p = _a.
|
|
58
|
-
|
|
59
|
-
|
|
55
|
+
var _b = _a.afterHide, afterHide = _b === void 0 ? function () { } : _b, _c = _a.afterShow, afterShow = _c === void 0 ? function () { } : _c, ariaDescribedby = _a["aria-describedby"], ariaDetails = _a["aria-details"], ariaLabelledby = _a["aria-labelledby"], ariaLabel = _a["aria-label"], autoFocus = _a.autoFocus, _d = _a.beforeHide, beforeHide = _d === void 0 ? function () { return true; } : _d, _e = _a.beforeShow, beforeShow = _e === void 0 ? function () { return true; } : _e, _f = _a.canFlip, canFlip = _f === void 0 ? true : _f, children = _a.children, _g = _a.clickOutsideIgnoreRefs, clickOutsideIgnoreRefs = _g === void 0 ? [] : _g, containFocus = _a.containFocus, _h = _a.hideDelay, hideDelay = _h === void 0 ? 100 : _h, hideKeys_ = _a.hideKeys, _j = _a.initialIsVisible, initialIsVisible = _j === void 0 ? false : _j, overlay = _a.overlay, _k = _a.padding, padding = _k === void 0 ? 2 : _k, _l = _a.placement, placement = _l === void 0 ? 'top' : _l, _m = _a.restoreFocusOnHide, restoreFocusOnHide = _m === void 0 ? true : _m, // TODO: change default to be false, but that is a breaking change
|
|
56
|
+
_o = _a.showDelay, // TODO: change default to be false, but that is a breaking change
|
|
57
|
+
showDelay = _o === void 0 ? 0 : _o, _p = _a.showKeys, showKeys = _p === void 0 ? ['ArrowDown', 'Down'] : _p, _q = _a.shrinkOverlay, shrinkOverlay = _q === void 0 ? false : _q, _r = _a.trigger, trigger = _r === void 0 ? 'click' : _r, _s = _a.arrow, arrow = _s === void 0 ? false : _s, overlayApiRef = _a.overlayRef, role = _a.role, _t = _a.passA11yPropsToOverlay, passA11yPropsToOverlay = _t === void 0 ? false : _t;
|
|
58
|
+
var isDialogRole = role === 'dialog';
|
|
59
|
+
if (isDialogRole && (trigger === 'hover' || (trigger === null || trigger === void 0 ? void 0 : trigger.includes('hover')))) {
|
|
60
|
+
console.warn("@procore/core-react: OverlayTigger has role ".concat(role, " and a hover trigger, this may cause weird focus management and is unrecommended. Review autoFocus prop."));
|
|
61
|
+
}
|
|
60
62
|
var hideKeys = hideKeys_ !== null && hideKeys_ !== void 0 ? hideKeys_ : {
|
|
61
|
-
|
|
63
|
+
// Note by default OverlayTrigger closes on tab. Dialog role changes the default.
|
|
64
|
+
overlay: (containFocus !== null && containFocus !== void 0 ? containFocus : isDialogRole)
|
|
65
|
+
? ['Escape', 'Esc']
|
|
66
|
+
: ['Escape', 'Esc', 'Tab'],
|
|
62
67
|
target: ['Escape', 'Esc'],
|
|
63
68
|
};
|
|
64
69
|
var innerTriggerElRef = React.useRef(null);
|
|
65
70
|
var triggerElRef = ref || innerTriggerElRef;
|
|
66
71
|
var overlayElRef = React.useRef(null);
|
|
67
|
-
var
|
|
72
|
+
var _u = React.useState(null), referenceElement = _u[0], setReferenceElement = _u[1];
|
|
68
73
|
var clickedOutsideRef = React.useRef(true);
|
|
69
74
|
var visibility = useVisibility({
|
|
70
75
|
afterHide: afterHide,
|
|
@@ -84,6 +89,7 @@ export var OverlayTrigger = React.forwardRef(function OverlayTrigger(_a, ref) {
|
|
|
84
89
|
visibility.show();
|
|
85
90
|
}
|
|
86
91
|
}, [triggers, visibility.isVisible]);
|
|
92
|
+
// TODO delete in a separate branch for testing and rely only on FocusScope
|
|
87
93
|
React.useEffect(function () {
|
|
88
94
|
if (restoreFocusOnHide &&
|
|
89
95
|
!visibility.isVisible &&
|
|
@@ -110,18 +116,25 @@ export var OverlayTrigger = React.forwardRef(function OverlayTrigger(_a, ref) {
|
|
|
110
116
|
trigger: trigger,
|
|
111
117
|
triggerRef: triggerElRef,
|
|
112
118
|
});
|
|
113
|
-
var overlayId = useId();
|
|
114
119
|
var triggerElement = typeof children === 'function'
|
|
115
120
|
? children(triggerApi)
|
|
116
121
|
: children;
|
|
117
|
-
var
|
|
118
|
-
|
|
122
|
+
var overlayId = useId();
|
|
123
|
+
var _v = useOverlayTriggerA11y({
|
|
124
|
+
canPropOverlayUp: React.isValidElement(overlay) && passA11yPropsToOverlay,
|
|
125
|
+
'aria-describedby': ariaDescribedby,
|
|
126
|
+
'aria-details': ariaDetails,
|
|
127
|
+
'aria-labelledby': ariaLabelledby,
|
|
128
|
+
'aria-label': ariaLabel,
|
|
129
|
+
id: overlayId,
|
|
130
|
+
isOpen: visibility.isVisible,
|
|
119
131
|
role: role,
|
|
120
|
-
|
|
121
|
-
|
|
132
|
+
}), wrapperProps = _v.wrapperProps, overlayProps = _v.overlayProps, portalProps = _v.portalProps, triggerProps = _v.triggerProps, focusScopeProps = _v.focusScopeProps,
|
|
133
|
+
// Does not use. User needs to wire up when using dialog role!
|
|
134
|
+
labelProps = _v.labelProps;
|
|
122
135
|
var wrappedTriggerElement = React.cloneElement(triggerElement, __assign({ open: triggerApi.isVisible, ref: triggerElement.ref
|
|
123
136
|
? mergeRefs(triggerElement.ref, triggerElRef, setReferenceElement)
|
|
124
|
-
: mergeRefs(triggerElRef, setReferenceElement) },
|
|
137
|
+
: mergeRefs(triggerElRef, setReferenceElement) }, triggerProps));
|
|
125
138
|
React.useEffect(function () {
|
|
126
139
|
var targetErrors = [
|
|
127
140
|
'ResizeObserver loop completed with undelivered notifications.',
|
|
@@ -149,7 +162,7 @@ export var OverlayTrigger = React.forwardRef(function OverlayTrigger(_a, ref) {
|
|
|
149
162
|
},
|
|
150
163
|
refs: __spreadArray([overlayElRef, triggerElRef], clickOutsideIgnoreRefs, true),
|
|
151
164
|
})),
|
|
152
|
-
React.createElement(Portal,
|
|
165
|
+
React.createElement(Portal, __assign({}, portalProps),
|
|
153
166
|
React.createElement(Trigger, __assign({}, {
|
|
154
167
|
isEnabled: visibility.isVisible,
|
|
155
168
|
enable: delayedToggle.enable,
|
|
@@ -158,7 +171,9 @@ export var OverlayTrigger = React.forwardRef(function OverlayTrigger(_a, ref) {
|
|
|
158
171
|
trigger: trigger === 'click' ? 'none' : trigger,
|
|
159
172
|
triggerRef: overlayElRef,
|
|
160
173
|
}),
|
|
161
|
-
React.createElement(TriggerOverlay, {
|
|
174
|
+
React.createElement(TriggerOverlay, { autoFocus: autoFocus !== null && autoFocus !== void 0 ? autoFocus : focusScopeProps.autoFocus, containFocus: containFocus !== null && containFocus !== void 0 ? containFocus : focusScopeProps.contain,
|
|
175
|
+
// TODO add restoreFocusOnHide ?? when inhouse hook removed
|
|
176
|
+
restoreFocus: focusScopeProps.restoreFocus, ref: overlayElRef, referenceElement: referenceElement, overlay: overlay, shrinkOverlay: shrinkOverlay, placement: placement, padding: padding, canFlip: canFlip, arrow: arrow, wrapperProps: wrapperProps, overlayCloneProps: overlayProps })))))));
|
|
162
177
|
});
|
|
163
178
|
export function CloseOnFocus(_a) {
|
|
164
179
|
var hide = _a.hide;
|
|
@@ -182,8 +197,7 @@ export function useOverlayTriggerContext() {
|
|
|
182
197
|
};
|
|
183
198
|
}
|
|
184
199
|
export var TriggerOverlay = React.forwardRef(function (_a, ref) {
|
|
185
|
-
var
|
|
186
|
-
var placement = _a.placement, canFlip = _a.canFlip, arrow = _a.arrow, padding = _a.padding, shrinkOverlay = _a.shrinkOverlay, overlay = _a.overlay, referenceElement = _a.referenceElement, role = _a.role, overlayId = _a.overlayId, autoFocus = _a.autoFocus, containFocus = _a.containFocus, passA11yPropsToOverlay = _a.passA11yPropsToOverlay;
|
|
200
|
+
var autoFocus = _a.autoFocus, containFocus = _a.containFocus, restoreFocus = _a.restoreFocus, placement = _a.placement, canFlip = _a.canFlip, arrow = _a.arrow, padding = _a.padding, shrinkOverlay = _a.shrinkOverlay, overlay = _a.overlay, referenceElement = _a.referenceElement, wrapperProps = _a.wrapperProps, overlayCloneProps = _a.overlayCloneProps;
|
|
187
201
|
var arrowRef = React.useRef(null);
|
|
188
202
|
var arrowPadding = arrowSize / 2 + 1;
|
|
189
203
|
var middleware = [
|
|
@@ -205,25 +219,22 @@ export var TriggerOverlay = React.forwardRef(function (_a, ref) {
|
|
|
205
219
|
padding: 6,
|
|
206
220
|
}),
|
|
207
221
|
].filter(function (middleware) { return middleware !== null; });
|
|
208
|
-
var
|
|
222
|
+
var _b = useOverlay({
|
|
209
223
|
middleware: middleware,
|
|
210
224
|
placement: placement,
|
|
211
|
-
}), overlayStyle =
|
|
225
|
+
}), overlayStyle = _b.overlayStyle, referenceRefCallback = _b.referenceRef, overlayRef = _b.overlayRef, middlewareData = _b.middlewareData, currentPlacement = _b.placement;
|
|
212
226
|
React.useEffect(function () {
|
|
213
227
|
referenceRefCallback(referenceElement);
|
|
214
228
|
}, [referenceElement, referenceRefCallback]);
|
|
215
|
-
var
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
}
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
React.createElement("div", __assign({ "data-qa": "core-overlay-trigger-overlay-wrapper", ref: mergeRefs(ref, overlayRef), style: overlayStyle }, overlayWrapperA11yProps),
|
|
225
|
-
canPropOverlayUp
|
|
226
|
-
? React.cloneElement(overlay, overlayElementA11yProps)
|
|
229
|
+
var mergedRefs = mergeRefs(ref, overlayRef);
|
|
230
|
+
// TODO could just move clone and clone props to parent
|
|
231
|
+
if (!React.isValidElement(overlay) && overlayCloneProps) {
|
|
232
|
+
console.warn('PLEASE REPORT ISSUE @procore/core-react: OverlayTrigger TriggerOverlay is not a valid React element but wants to clone "overlay" with props. Cannot pass props to the element.');
|
|
233
|
+
}
|
|
234
|
+
return (React.createElement(FocusScope, { autoFocus: autoFocus, contain: containFocus, restoreFocus: restoreFocus },
|
|
235
|
+
React.createElement("div", __assign({ "data-qa": "core-overlay-trigger-overlay-wrapper", ref: mergedRefs, style: overlayStyle }, wrapperProps),
|
|
236
|
+
React.isValidElement(overlay)
|
|
237
|
+
? React.cloneElement(overlay, overlayCloneProps)
|
|
227
238
|
: overlay,
|
|
228
239
|
arrow && (React.createElement(Arrow, { ref: arrowRef, arrow: middlewareData.arrow, placement: currentPlacement })))));
|
|
229
240
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverlayTrigger.js","sourceRoot":"","sources":["../../src/OverlayTrigger/OverlayTrigger.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,OAAO,EACL,KAAK,IAAI,aAAa,EACtB,IAAI,IAAI,YAAY,EACpB,UAAU,EACV,MAAM,IAAI,cAAc,EACxB,KAAK,IAAI,aAAa,EACtB,IAAI,IAAI,YAAY,GACrB,MAAM,wBAAwB,CAAA;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,sBAAsB,MAAM,0BAA0B,CAAA;AAC7D,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAA;AAC1D,OAAO,EAAqB,UAAU,EAAE,MAAM,uBAAuB,CAAA;AACrE,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAsB,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAC5E,OAAO,EACL,oBAAoB,EACpB,gBAAgB,EAChB,uBAAuB,GACxB,MAAM,yBAAyB,CAAA;AAChC,OAAO,EAAE,OAAO,EAAc,UAAU,EAAE,MAAM,mBAAmB,CAAA;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAG/C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"OverlayTrigger.js","sourceRoot":"","sources":["../../src/OverlayTrigger/OverlayTrigger.tsx"],"names":[],"mappings":"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"}
|
|
@@ -9,6 +9,10 @@ export declare type PickedTriggerProps = Pick<TriggerRenderProps, 'children' | '
|
|
|
9
9
|
export declare type PickedTriggerRenderProps = Pick<TriggerRenderProps, 'children'>;
|
|
10
10
|
export declare type PickedVisibilityProps = Pick<VisibilityConfig, 'afterHide' | 'afterShow' | 'initialIsVisible'>;
|
|
11
11
|
export interface OverlayTriggerProps extends PickedOverlayProps, PickedTriggerProps, PickedTriggerRenderProps, PickedVisibilityProps {
|
|
12
|
+
['aria-labelledby']?: string;
|
|
13
|
+
['aria-label']?: string;
|
|
14
|
+
['aria-describedby']?: string;
|
|
15
|
+
['aria-details']?: string;
|
|
12
16
|
/**
|
|
13
17
|
* The callback to run before the overlay is hidden. Returning
|
|
14
18
|
* `false` will prevent hiding.
|
|
@@ -37,11 +41,13 @@ export interface OverlayTriggerProps extends PickedOverlayProps, PickedTriggerPr
|
|
|
37
41
|
* @since 10.19.0
|
|
38
42
|
*/
|
|
39
43
|
hideDelay?: number;
|
|
44
|
+
/**
|
|
45
|
+
* Keys to hide the overlay when the overlay is focused
|
|
46
|
+
* @a11y OverlayTrigger by default closes on tab. To remove tab from closing
|
|
47
|
+
* and have only Esc keys, set "containFocus" to true, or opt-in to a full dialog role.
|
|
48
|
+
* @since 10.19.0
|
|
49
|
+
*/
|
|
40
50
|
hideKeys?: {
|
|
41
|
-
/**
|
|
42
|
-
* Keys to hide the overlay when the overlay is focused
|
|
43
|
-
* @since 10.19.0
|
|
44
|
-
*/
|
|
45
51
|
overlay: string[];
|
|
46
52
|
target: string[];
|
|
47
53
|
};
|
|
@@ -68,12 +74,14 @@ export interface OverlayTriggerProps extends PickedOverlayProps, PickedTriggerPr
|
|
|
68
74
|
*/
|
|
69
75
|
overlayRef?: React.Ref<OverlayTriggerRef>;
|
|
70
76
|
/**
|
|
71
|
-
* Accessibility props
|
|
77
|
+
* Accessibility props.
|
|
78
|
+
* @a11y May opionate "autoFocus" and "containFocus"
|
|
72
79
|
* @since 11.2.0
|
|
73
80
|
*/
|
|
74
81
|
role?: OverlayTriggerRole;
|
|
75
82
|
/**
|
|
76
83
|
* Whether to auto focus the first focusable element in the overlay on mount.
|
|
84
|
+
* True by default for role "dialog"
|
|
77
85
|
* @since 11.5.0
|
|
78
86
|
*/
|
|
79
87
|
autoFocus?: boolean;
|
|
@@ -84,8 +92,8 @@ export interface OverlayTriggerProps extends PickedOverlayProps, PickedTriggerPr
|
|
|
84
92
|
* */
|
|
85
93
|
containFocus?: boolean;
|
|
86
94
|
/**
|
|
87
|
-
* By default, role and id are applied to wrapper.
|
|
88
|
-
* Set to true, if you want to
|
|
95
|
+
* By default, role and id are applied to wrapper. But has knowledge of
|
|
96
|
+
* Set to true, if you want OverlayTrigger to place them on your overlay component.
|
|
89
97
|
*
|
|
90
98
|
* @default false
|
|
91
99
|
* @since 11.5.0
|