@instructure/ui-dialog 11.7.8 → 11.7.9-snapshot-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/CHANGELOG.md +8 -0
- package/lib/Dialog/index.js +11 -13
- package/package.json +8 -8
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [11.7.9-snapshot-1](https://github.com/instructure/instructure-ui/compare/v11.7.8...v11.7.9-snapshot-1) (2026-10-06)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @instructure/ui-dialog
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
## [11.7.8](https://github.com/instructure/instructure-ui/compare/v11.7.7...v11.7.8) (2026-10-02)
|
|
7
15
|
|
|
8
16
|
**Note:** Version bump only for package @instructure/ui-dialog
|
package/lib/Dialog/index.js
CHANGED
|
@@ -6,12 +6,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = exports.Dialog = void 0;
|
|
7
7
|
var _react = require("react");
|
|
8
8
|
var _emotion = require("@instructure/emotion");
|
|
9
|
-
var
|
|
10
|
-
var
|
|
11
|
-
var _findDOMNode = require("@instructure/ui-dom-utils/lib/findDOMNode.js");
|
|
12
|
-
var _requestAnimationFrame = require("@instructure/ui-dom-utils/lib/requestAnimationFrame.js");
|
|
9
|
+
var _uiReactUtils = require("@instructure/ui-react-utils");
|
|
10
|
+
var _uiDomUtils = require("@instructure/ui-dom-utils");
|
|
13
11
|
var _console = require("@instructure/console");
|
|
14
|
-
var
|
|
12
|
+
var _uiA11yUtils = require("@instructure/ui-a11y-utils");
|
|
15
13
|
var _props = require("./props.js");
|
|
16
14
|
var _jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
17
15
|
/*
|
|
@@ -95,8 +93,8 @@ class Dialog extends _react.Component {
|
|
|
95
93
|
contentElement,
|
|
96
94
|
...options
|
|
97
95
|
} = this.props;
|
|
98
|
-
this._raf.push((0,
|
|
99
|
-
this._focusRegion =
|
|
96
|
+
this._raf.push((0, _uiDomUtils.requestAnimationFrame)(() => {
|
|
97
|
+
this._focusRegion = _uiA11yUtils.FocusRegionManager.activateRegion(this.contentElement, {
|
|
100
98
|
...options
|
|
101
99
|
});
|
|
102
100
|
}));
|
|
@@ -109,7 +107,7 @@ class Dialog extends _react.Component {
|
|
|
109
107
|
this._raf.forEach(request => request.cancel());
|
|
110
108
|
this._raf = [];
|
|
111
109
|
if (_focusRegion) {
|
|
112
|
-
|
|
110
|
+
_uiA11yUtils.FocusRegionManager.blurRegion(contentElement, _focusRegion.id);
|
|
113
111
|
this._focusRegion = null;
|
|
114
112
|
}
|
|
115
113
|
}
|
|
@@ -119,7 +117,7 @@ class Dialog extends _react.Component {
|
|
|
119
117
|
return;
|
|
120
118
|
}
|
|
121
119
|
if (this._focusRegion) {
|
|
122
|
-
|
|
120
|
+
_uiA11yUtils.FocusRegionManager.focusRegion(this.contentElement, this._focusRegion.id);
|
|
123
121
|
}
|
|
124
122
|
}
|
|
125
123
|
blur() {
|
|
@@ -139,22 +137,22 @@ class Dialog extends _react.Component {
|
|
|
139
137
|
}
|
|
140
138
|
};
|
|
141
139
|
get contentElement() {
|
|
142
|
-
let contentElement = (0,
|
|
140
|
+
let contentElement = (0, _uiDomUtils.findDOMNode)(this.props.contentElement);
|
|
143
141
|
if (!contentElement) {
|
|
144
142
|
contentElement = this.ref ?? undefined;
|
|
145
143
|
}
|
|
146
144
|
return contentElement;
|
|
147
145
|
}
|
|
148
146
|
get focused() {
|
|
149
|
-
return this.contentElement && this._focusRegion &&
|
|
147
|
+
return this.contentElement && this._focusRegion && _uiA11yUtils.FocusRegionManager.isFocused(this.contentElement, this._focusRegion.id);
|
|
150
148
|
}
|
|
151
149
|
render() {
|
|
152
|
-
const ElementType = (0,
|
|
150
|
+
const ElementType = (0, _uiReactUtils.getElementType)(Dialog, this.props);
|
|
153
151
|
|
|
154
152
|
// In case the HTML role attribute is explicitly passed, use props.role
|
|
155
153
|
const role = this.props.role || (this.props.label ? 'dialog' : undefined);
|
|
156
154
|
return this.props.open ? (0, _jsxRuntime.jsx)(ElementType, {
|
|
157
|
-
...(0,
|
|
155
|
+
...(0, _uiReactUtils.omitProps)(this.props, Dialog.allowedProps),
|
|
158
156
|
role: role,
|
|
159
157
|
"aria-label": this.props.label,
|
|
160
158
|
"aria-modal": role === 'dialog' && this.props.shouldContainFocus ? true : undefined,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@instructure/ui-dialog",
|
|
3
|
-
"version": "11.7.
|
|
3
|
+
"version": "11.7.9-snapshot-1",
|
|
4
4
|
"description": "A utility component for managing keyboard accessibility and screen reader behavior",
|
|
5
5
|
"author": "Instructure, Inc. Engineering and Product Design",
|
|
6
6
|
"module": "./es/index.js",
|
|
@@ -15,16 +15,16 @@
|
|
|
15
15
|
"license": "MIT",
|
|
16
16
|
"dependencies": {
|
|
17
17
|
"@babel/runtime": "^7.29.7",
|
|
18
|
-
"@instructure/emotion": "11.7.
|
|
19
|
-
"@instructure/
|
|
20
|
-
"@instructure/ui-dom-utils": "11.7.
|
|
21
|
-
"@instructure/
|
|
22
|
-
"@instructure/ui-
|
|
18
|
+
"@instructure/emotion": "11.7.9-snapshot-1",
|
|
19
|
+
"@instructure/shared-types": "11.7.9-snapshot-1",
|
|
20
|
+
"@instructure/ui-dom-utils": "11.7.9-snapshot-1",
|
|
21
|
+
"@instructure/ui-react-utils": "11.7.9-snapshot-1",
|
|
22
|
+
"@instructure/ui-a11y-utils": "11.7.9-snapshot-1"
|
|
23
23
|
},
|
|
24
24
|
"devDependencies": {
|
|
25
25
|
"vitest": "^5.0.0",
|
|
26
|
-
"@instructure/console": "11.7.
|
|
27
|
-
"@instructure/ui-babel-preset": "11.7.
|
|
26
|
+
"@instructure/console": "11.7.9-snapshot-1",
|
|
27
|
+
"@instructure/ui-babel-preset": "11.7.9-snapshot-1"
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
30
30
|
"react": ">=18 <=19"
|