@instructure/ui-modal 10.26.1 → 11.0.1-snapshot-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/CHANGELOG.md +30 -1
- package/es/Modal/ModalBody/index.js +8 -8
- package/es/Modal/ModalBody/props.js +1 -13
- package/es/Modal/ModalFooter/index.js +6 -6
- package/es/Modal/ModalFooter/props.js +1 -6
- package/es/Modal/ModalHeader/index.js +6 -6
- package/es/Modal/ModalHeader/props.js +1 -7
- package/es/Modal/index.js +6 -6
- package/es/Modal/props.js +1 -31
- package/lib/Modal/ModalBody/index.js +7 -7
- package/lib/Modal/ModalBody/props.js +1 -14
- package/lib/Modal/ModalFooter/index.js +5 -5
- package/lib/Modal/ModalFooter/props.js +1 -7
- package/lib/Modal/ModalHeader/index.js +5 -5
- package/lib/Modal/ModalHeader/props.js +1 -8
- package/lib/Modal/index.js +5 -5
- package/lib/Modal/props.js +1 -32
- package/package.json +19 -22
- package/src/Modal/ModalBody/index.tsx +4 -6
- package/src/Modal/ModalBody/props.ts +4 -16
- package/src/Modal/ModalFooter/index.tsx +2 -4
- package/src/Modal/ModalFooter/props.ts +1 -10
- package/src/Modal/ModalHeader/index.tsx +2 -4
- package/src/Modal/ModalHeader/props.ts +1 -11
- package/src/Modal/index.tsx +2 -4
- package/src/Modal/props.ts +1 -40
- package/tsconfig.build.json +0 -2
- package/tsconfig.build.tsbuildinfo +1 -1
- package/types/Modal/ModalBody/index.d.ts +0 -8
- package/types/Modal/ModalBody/index.d.ts.map +1 -1
- package/types/Modal/ModalBody/props.d.ts +6 -4
- package/types/Modal/ModalBody/props.d.ts.map +1 -1
- package/types/Modal/ModalFooter/index.d.ts +0 -4
- package/types/Modal/ModalFooter/index.d.ts.map +1 -1
- package/types/Modal/ModalFooter/props.d.ts +2 -3
- package/types/Modal/ModalFooter/props.d.ts.map +1 -1
- package/types/Modal/ModalHeader/index.d.ts +0 -5
- package/types/Modal/ModalHeader/index.d.ts.map +1 -1
- package/types/Modal/ModalHeader/props.d.ts +2 -3
- package/types/Modal/ModalHeader/props.d.ts.map +1 -1
- package/types/Modal/index.d.ts +1 -2
- package/types/Modal/index.d.ts.map +1 -1
- package/types/Modal/props.d.ts +2 -3
- package/types/Modal/props.d.ts.map +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
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
|
-
## [
|
|
6
|
+
## [11.0.1-snapshot-0](https://github.com/instructure/instructure-ui/compare/v11.0.0...v11.0.1-snapshot-0) (2025-10-07)
|
|
7
7
|
|
|
8
8
|
**Note:** Version bump only for package @instructure/ui-modal
|
|
9
9
|
|
|
@@ -11,6 +11,35 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
11
11
|
|
|
12
12
|
|
|
13
13
|
|
|
14
|
+
# [11.0.0](https://github.com/instructure/instructure-ui/compare/v10.26.0...v11.0.0) (2025-10-06)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
### Features
|
|
18
|
+
|
|
19
|
+
* **many:** instUI v11 release ([36f5438](https://github.com/instructure/instructure-ui/commit/36f54382669186227ba24798bbf7201ef2f5cd4c))
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
### BREAKING CHANGES
|
|
23
|
+
|
|
24
|
+
* **many:** InstUI v11 contains the following breaking changes:
|
|
25
|
+
- React 16 and 17 are no longer supported
|
|
26
|
+
- remove `PropTypes` from all packages
|
|
27
|
+
- remove `CodeEditor` component
|
|
28
|
+
- remove `@instui/theme-registry` package
|
|
29
|
+
- remove `@testable`, `@experimental`, `@hack` decorators
|
|
30
|
+
- InstUISettingsProvider's `as` prop is removed
|
|
31
|
+
- `canvas.use()`, `canvasHighContrast.use()` functions are removed
|
|
32
|
+
- `canvasThemeLocal`, `canvasHighContrastThemeLocal` are removed
|
|
33
|
+
- `variables` field on theme objects are removed
|
|
34
|
+
- remove deprecated props from Table: Row's `isStacked`, Body's
|
|
35
|
+
`isStacked`, `hover`, and `headers`
|
|
36
|
+
- `Table`'s `caption` prop is now required
|
|
37
|
+
- `ui-dom-utils`'s `getComputedStyle` can now return `undefined`
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
|
|
14
43
|
# [10.26.0](https://github.com/instructure/instructure-ui/compare/v10.25.0...v10.26.0) (2025-10-01)
|
|
15
44
|
|
|
16
45
|
**Note:** Version bump only for package @instructure/ui-modal
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
2
|
const _excluded = ["as", "elementRef", "overflow", "variant", "padding", "children"];
|
|
3
|
-
var _dec,
|
|
3
|
+
var _dec, _class, _ModalBody;
|
|
4
4
|
/*
|
|
5
5
|
* The MIT License (MIT)
|
|
6
6
|
*
|
|
@@ -27,13 +27,12 @@ var _dec, _dec2, _class, _ModalBody;
|
|
|
27
27
|
|
|
28
28
|
import { Component } from 'react';
|
|
29
29
|
import { View } from '@instructure/ui-view';
|
|
30
|
-
import { testable } from '@instructure/ui-testable';
|
|
31
30
|
import { omitProps } from '@instructure/ui-react-utils';
|
|
32
|
-
import {
|
|
31
|
+
import { getCSSStyleDeclaration } from '@instructure/ui-dom-utils';
|
|
33
32
|
import { withStyle } from '@instructure/emotion';
|
|
34
33
|
import generateStyle from './styles';
|
|
35
34
|
import generateComponentTheme from './theme';
|
|
36
|
-
import {
|
|
35
|
+
import { allowedProps } from './props';
|
|
37
36
|
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
38
37
|
/**
|
|
39
38
|
---
|
|
@@ -41,7 +40,7 @@ parent: Modal
|
|
|
41
40
|
id: Modal.Body
|
|
42
41
|
---
|
|
43
42
|
**/
|
|
44
|
-
let ModalBody = (_dec = withStyle(generateStyle, generateComponentTheme),
|
|
43
|
+
let ModalBody = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_ModalBody = class ModalBody extends Component {
|
|
45
44
|
constructor(props) {
|
|
46
45
|
super(props);
|
|
47
46
|
this.ref = null;
|
|
@@ -58,7 +57,7 @@ let ModalBody = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2
|
|
|
58
57
|
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
59
58
|
|
|
60
59
|
// We detect if -moz- prefixed style is present to identify whether we are in Firefox browser
|
|
61
|
-
const style = this.ref &&
|
|
60
|
+
const style = this.ref && getCSSStyleDeclaration(this.ref);
|
|
62
61
|
const isFirefox = !!(style && Array.prototype.slice.call(style).join('').match(/(?:-moz-)/));
|
|
63
62
|
if (isFirefox) {
|
|
64
63
|
this.setState({
|
|
@@ -101,6 +100,7 @@ let ModalBody = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2
|
|
|
101
100
|
return _jsx(View, {
|
|
102
101
|
...passthroughProps,
|
|
103
102
|
display: "block",
|
|
103
|
+
"data-cid": "ModalBody",
|
|
104
104
|
width: isFit ? '100%' : void 0,
|
|
105
105
|
height: isFit ? '100%' : void 0,
|
|
106
106
|
elementRef: this.handleRef,
|
|
@@ -116,10 +116,10 @@ let ModalBody = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2
|
|
|
116
116
|
children: children
|
|
117
117
|
});
|
|
118
118
|
}
|
|
119
|
-
}, _ModalBody.displayName = "ModalBody", _ModalBody.componentId = 'Modal.Body', _ModalBody.
|
|
119
|
+
}, _ModalBody.displayName = "ModalBody", _ModalBody.componentId = 'Modal.Body', _ModalBody.allowedProps = allowedProps, _ModalBody.defaultProps = {
|
|
120
120
|
padding: 'medium',
|
|
121
121
|
as: 'div',
|
|
122
122
|
variant: 'default'
|
|
123
|
-
}, _ModalBody)) || _class)
|
|
123
|
+
}, _ModalBody)) || _class);
|
|
124
124
|
export default ModalBody;
|
|
125
125
|
export { ModalBody };
|
|
@@ -22,17 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
const propTypes = {
|
|
27
|
-
children: PropTypes.node,
|
|
28
|
-
padding: PropTypes.string,
|
|
29
|
-
/**
|
|
30
|
-
* provides a reference to the underlying html root element
|
|
31
|
-
*/
|
|
32
|
-
elementRef: PropTypes.func,
|
|
33
|
-
as: PropTypes.elementType,
|
|
34
|
-
variant: PropTypes.oneOf(['default', 'inverse']),
|
|
35
|
-
overflow: PropTypes.oneOf(['scroll', 'fit'])
|
|
36
|
-
};
|
|
37
25
|
const allowedProps = ['children', 'padding', 'elementRef', 'as', 'variant', 'overflow'];
|
|
38
|
-
export {
|
|
26
|
+
export { allowedProps };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
2
|
const _excluded = ["children"];
|
|
3
|
-
var _dec,
|
|
3
|
+
var _dec, _class, _ModalFooter;
|
|
4
4
|
/*
|
|
5
5
|
* The MIT License (MIT)
|
|
6
6
|
*
|
|
@@ -27,11 +27,10 @@ var _dec, _dec2, _class, _ModalFooter;
|
|
|
27
27
|
|
|
28
28
|
import { Component } from 'react';
|
|
29
29
|
import { passthroughProps } from '@instructure/ui-react-utils';
|
|
30
|
-
import { testable } from '@instructure/ui-testable';
|
|
31
30
|
import { withStyle } from '@instructure/emotion';
|
|
32
31
|
import generateStyle from './styles';
|
|
33
32
|
import generateComponentTheme from './theme';
|
|
34
|
-
import {
|
|
33
|
+
import { allowedProps } from './props';
|
|
35
34
|
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
36
35
|
/**
|
|
37
36
|
---
|
|
@@ -39,7 +38,7 @@ parent: Modal
|
|
|
39
38
|
id: Modal.Footer
|
|
40
39
|
---
|
|
41
40
|
**/
|
|
42
|
-
let ModalFooter = (_dec = withStyle(generateStyle, generateComponentTheme),
|
|
41
|
+
let ModalFooter = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_ModalFooter = class ModalFooter extends Component {
|
|
43
42
|
constructor(...args) {
|
|
44
43
|
super(...args);
|
|
45
44
|
this.ref = null;
|
|
@@ -64,11 +63,12 @@ let ModalFooter = (_dec = withStyle(generateStyle, generateComponentTheme), _dec
|
|
|
64
63
|
css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.modalFooter,
|
|
65
64
|
...passthroughProps(rest),
|
|
66
65
|
ref: this.handleRef,
|
|
66
|
+
"data-cid": "ModalFooter",
|
|
67
67
|
children: children
|
|
68
68
|
});
|
|
69
69
|
}
|
|
70
|
-
}, _ModalFooter.displayName = "ModalFooter", _ModalFooter.componentId = 'Modal.Footer', _ModalFooter.
|
|
70
|
+
}, _ModalFooter.displayName = "ModalFooter", _ModalFooter.componentId = 'Modal.Footer', _ModalFooter.allowedProps = allowedProps, _ModalFooter.defaultProps = {
|
|
71
71
|
variant: 'default'
|
|
72
|
-
}, _ModalFooter)) || _class)
|
|
72
|
+
}, _ModalFooter)) || _class);
|
|
73
73
|
export default ModalFooter;
|
|
74
74
|
export { ModalFooter };
|
|
@@ -22,10 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
const propTypes = {
|
|
27
|
-
children: PropTypes.node,
|
|
28
|
-
variant: PropTypes.oneOf(['default', 'inverse'])
|
|
29
|
-
};
|
|
30
25
|
const allowedProps = ['children', 'variant'];
|
|
31
|
-
export {
|
|
26
|
+
export { allowedProps };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
2
|
const _excluded = ["children"];
|
|
3
|
-
var _dec,
|
|
3
|
+
var _dec, _class, _ModalHeader;
|
|
4
4
|
/*
|
|
5
5
|
* The MIT License (MIT)
|
|
6
6
|
*
|
|
@@ -27,12 +27,11 @@ var _dec, _dec2, _class, _ModalHeader;
|
|
|
27
27
|
|
|
28
28
|
import { Children, Component } from 'react';
|
|
29
29
|
import { matchComponentTypes, passthroughProps } from '@instructure/ui-react-utils';
|
|
30
|
-
import { testable } from '@instructure/ui-testable';
|
|
31
30
|
import { withStyle } from '@instructure/emotion';
|
|
32
31
|
import { CloseButton } from '@instructure/ui-buttons';
|
|
33
32
|
import generateStyle from './styles';
|
|
34
33
|
import generateComponentTheme from './theme';
|
|
35
|
-
import {
|
|
34
|
+
import { allowedProps } from './props';
|
|
36
35
|
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
37
36
|
/**
|
|
38
37
|
---
|
|
@@ -40,7 +39,7 @@ parent: Modal
|
|
|
40
39
|
id: Modal.Header
|
|
41
40
|
---
|
|
42
41
|
**/
|
|
43
|
-
let ModalHeader = (_dec = withStyle(generateStyle, generateComponentTheme),
|
|
42
|
+
let ModalHeader = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_ModalHeader = class ModalHeader extends Component {
|
|
44
43
|
constructor(...args) {
|
|
45
44
|
super(...args);
|
|
46
45
|
this.ref = null;
|
|
@@ -79,12 +78,13 @@ let ModalHeader = (_dec = withStyle(generateStyle, generateComponentTheme), _dec
|
|
|
79
78
|
css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.modalHeader,
|
|
80
79
|
...passthroughProps(rest),
|
|
81
80
|
ref: this.handleRef,
|
|
81
|
+
"data-cid": "ModalHeader",
|
|
82
82
|
children: children
|
|
83
83
|
});
|
|
84
84
|
}
|
|
85
|
-
}, _ModalHeader.displayName = "ModalHeader", _ModalHeader.componentId = 'Modal.Header', _ModalHeader.
|
|
85
|
+
}, _ModalHeader.displayName = "ModalHeader", _ModalHeader.componentId = 'Modal.Header', _ModalHeader.allowedProps = allowedProps, _ModalHeader.defaultProps = {
|
|
86
86
|
variant: 'default',
|
|
87
87
|
spacing: 'default'
|
|
88
|
-
}, _ModalHeader)) || _class)
|
|
88
|
+
}, _ModalHeader)) || _class);
|
|
89
89
|
export default ModalHeader;
|
|
90
90
|
export { ModalHeader };
|
|
@@ -22,11 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
const propTypes = {
|
|
27
|
-
children: PropTypes.node,
|
|
28
|
-
variant: PropTypes.oneOf(['default', 'inverse']),
|
|
29
|
-
spacing: PropTypes.oneOf(['default', 'compact'])
|
|
30
|
-
};
|
|
31
25
|
const allowedProps = ['children', 'variant', 'spacing'];
|
|
32
|
-
export {
|
|
26
|
+
export { allowedProps };
|
package/es/Modal/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
2
|
const _excluded = ["open", "onOpen", "onClose", "mountNode", "insertAt", "transition", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "constrain", "overflow"];
|
|
3
|
-
var _dec,
|
|
3
|
+
var _dec, _class, _Modal;
|
|
4
4
|
/*
|
|
5
5
|
* The MIT License (MIT)
|
|
6
6
|
*
|
|
@@ -28,7 +28,6 @@ var _dec, _dec2, _class, _Modal;
|
|
|
28
28
|
import { Children, Component, isValidElement } from 'react';
|
|
29
29
|
import { passthroughProps, safeCloneElement } from '@instructure/ui-react-utils';
|
|
30
30
|
import { createChainedFunction } from '@instructure/ui-utils';
|
|
31
|
-
import { testable } from '@instructure/ui-testable';
|
|
32
31
|
import { Transition } from '@instructure/ui-motion';
|
|
33
32
|
import { Portal } from '@instructure/ui-portal';
|
|
34
33
|
import { Dialog } from '@instructure/ui-dialog';
|
|
@@ -39,7 +38,7 @@ import { ModalFooter } from './ModalFooter';
|
|
|
39
38
|
import { withStyle } from '@instructure/emotion';
|
|
40
39
|
import generateStyle from './styles';
|
|
41
40
|
import generateComponentTheme from './theme';
|
|
42
|
-
import {
|
|
41
|
+
import { allowedProps } from './props';
|
|
43
42
|
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
|
|
44
43
|
/**
|
|
45
44
|
---
|
|
@@ -47,7 +46,7 @@ category: components
|
|
|
47
46
|
tags: overlay, portal, dialog
|
|
48
47
|
---
|
|
49
48
|
**/
|
|
50
|
-
let Modal = (_dec = withStyle(generateStyle, generateComponentTheme),
|
|
49
|
+
let Modal = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_Modal = class Modal extends Component {
|
|
51
50
|
constructor(props) {
|
|
52
51
|
var _props$open;
|
|
53
52
|
super(props);
|
|
@@ -218,6 +217,7 @@ let Modal = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = te
|
|
|
218
217
|
insertAt: insertAt,
|
|
219
218
|
open: portalIsOpen,
|
|
220
219
|
onOpen: this.handlePortalOpen,
|
|
220
|
+
"data-cid": "Modal",
|
|
221
221
|
children: _jsx(Transition, {
|
|
222
222
|
in: open,
|
|
223
223
|
transitionOnMount: true,
|
|
@@ -235,7 +235,7 @@ let Modal = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = te
|
|
|
235
235
|
})
|
|
236
236
|
});
|
|
237
237
|
}
|
|
238
|
-
}, _Modal.displayName = "Modal", _Modal.componentId = 'Modal', _Modal.
|
|
238
|
+
}, _Modal.displayName = "Modal", _Modal.componentId = 'Modal', _Modal.allowedProps = allowedProps, _Modal.defaultProps = {
|
|
239
239
|
open: false,
|
|
240
240
|
size: 'auto',
|
|
241
241
|
variant: 'default',
|
|
@@ -245,6 +245,6 @@ let Modal = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = te
|
|
|
245
245
|
shouldReturnFocus: true,
|
|
246
246
|
constrain: 'window',
|
|
247
247
|
overflow: 'scroll'
|
|
248
|
-
}, _Modal.Header = ModalHeader, _Modal.Body = ModalBody, _Modal.Footer = ModalFooter, _Modal)) || _class)
|
|
248
|
+
}, _Modal.Header = ModalHeader, _Modal.Body = ModalBody, _Modal.Footer = ModalFooter, _Modal)) || _class);
|
|
249
249
|
export default Modal;
|
|
250
250
|
export { Modal, ModalHeader, ModalBody, ModalFooter };
|
package/es/Modal/props.js
CHANGED
|
@@ -22,35 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
import { element } from '@instructure/ui-prop-types';
|
|
27
|
-
import { transitionTypePropType } from '@instructure/ui-motion';
|
|
28
|
-
const propTypes = {
|
|
29
|
-
label: PropTypes.string.isRequired,
|
|
30
|
-
children: PropTypes.node,
|
|
31
|
-
as: PropTypes.elementType,
|
|
32
|
-
size: PropTypes.oneOf(['auto', 'small', 'medium', 'large', 'fullscreen']),
|
|
33
|
-
variant: PropTypes.oneOf(['default', 'inverse']),
|
|
34
|
-
open: PropTypes.bool,
|
|
35
|
-
defaultFocusElement: PropTypes.oneOfType([PropTypes.element, PropTypes.func]),
|
|
36
|
-
shouldReturnFocus: PropTypes.bool,
|
|
37
|
-
shouldCloseOnDocumentClick: PropTypes.bool,
|
|
38
|
-
onOpen: PropTypes.func,
|
|
39
|
-
onClose: PropTypes.func,
|
|
40
|
-
onDismiss: PropTypes.func,
|
|
41
|
-
contentRef: PropTypes.func,
|
|
42
|
-
mountNode: PropTypes.oneOfType([element, PropTypes.func]),
|
|
43
|
-
insertAt: PropTypes.oneOf(['bottom', 'top']),
|
|
44
|
-
liveRegion: PropTypes.oneOfType([element, PropTypes.arrayOf(element), PropTypes.func]),
|
|
45
|
-
transition: transitionTypePropType,
|
|
46
|
-
onEnter: PropTypes.func,
|
|
47
|
-
onEntering: PropTypes.func,
|
|
48
|
-
onEntered: PropTypes.func,
|
|
49
|
-
onExit: PropTypes.func,
|
|
50
|
-
onExiting: PropTypes.func,
|
|
51
|
-
onExited: PropTypes.func,
|
|
52
|
-
constrain: PropTypes.oneOf(['window', 'parent']),
|
|
53
|
-
overflow: PropTypes.oneOf(['scroll', 'fit'])
|
|
54
|
-
};
|
|
55
25
|
const allowedProps = ['label', 'children', 'as', 'size', 'variant', 'open', 'defaultFocusElement', 'shouldReturnFocus', 'shouldCloseOnDocumentClick', 'onOpen', 'onClose', 'onDismiss', 'contentRef', 'mountNode', 'insertAt', 'liveRegion', 'transition', 'onEnter', 'onEntering', 'onEntered', 'onExit', 'onExiting', 'onExited', 'constrain', 'overflow'];
|
|
56
|
-
export {
|
|
26
|
+
export { allowedProps };
|
|
@@ -8,16 +8,15 @@ exports.default = exports.ModalBody = void 0;
|
|
|
8
8
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
9
9
|
var _react = require("react");
|
|
10
10
|
var _View = require("@instructure/ui-view/lib/View");
|
|
11
|
-
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
12
11
|
var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
|
|
13
|
-
var
|
|
12
|
+
var _getCSSStyleDeclaration = require("@instructure/ui-dom-utils/lib/getCSSStyleDeclaration.js");
|
|
14
13
|
var _emotion = require("@instructure/emotion");
|
|
15
14
|
var _styles = _interopRequireDefault(require("./styles"));
|
|
16
15
|
var _theme = _interopRequireDefault(require("./theme"));
|
|
17
16
|
var _props = require("./props");
|
|
18
17
|
var _jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
19
18
|
const _excluded = ["as", "elementRef", "overflow", "variant", "padding", "children"];
|
|
20
|
-
var _dec,
|
|
19
|
+
var _dec, _class, _ModalBody;
|
|
21
20
|
/*
|
|
22
21
|
* The MIT License (MIT)
|
|
23
22
|
*
|
|
@@ -47,7 +46,7 @@ parent: Modal
|
|
|
47
46
|
id: Modal.Body
|
|
48
47
|
---
|
|
49
48
|
**/
|
|
50
|
-
let ModalBody = exports.ModalBody = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default),
|
|
49
|
+
let ModalBody = exports.ModalBody = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_ModalBody = class ModalBody extends _react.Component {
|
|
51
50
|
constructor(props) {
|
|
52
51
|
super(props);
|
|
53
52
|
this.ref = null;
|
|
@@ -64,7 +63,7 @@ let ModalBody = exports.ModalBody = (_dec = (0, _emotion.withStyle)(_styles.defa
|
|
|
64
63
|
(_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
|
|
65
64
|
|
|
66
65
|
// We detect if -moz- prefixed style is present to identify whether we are in Firefox browser
|
|
67
|
-
const style = this.ref && (0,
|
|
66
|
+
const style = this.ref && (0, _getCSSStyleDeclaration.getCSSStyleDeclaration)(this.ref);
|
|
68
67
|
const isFirefox = !!(style && Array.prototype.slice.call(style).join('').match(/(?:-moz-)/));
|
|
69
68
|
if (isFirefox) {
|
|
70
69
|
this.setState({
|
|
@@ -107,6 +106,7 @@ let ModalBody = exports.ModalBody = (_dec = (0, _emotion.withStyle)(_styles.defa
|
|
|
107
106
|
return (0, _jsxRuntime.jsx)(_View.View, {
|
|
108
107
|
...passthroughProps,
|
|
109
108
|
display: "block",
|
|
109
|
+
"data-cid": "ModalBody",
|
|
110
110
|
width: isFit ? '100%' : void 0,
|
|
111
111
|
height: isFit ? '100%' : void 0,
|
|
112
112
|
elementRef: this.handleRef,
|
|
@@ -122,9 +122,9 @@ let ModalBody = exports.ModalBody = (_dec = (0, _emotion.withStyle)(_styles.defa
|
|
|
122
122
|
children: children
|
|
123
123
|
});
|
|
124
124
|
}
|
|
125
|
-
}, _ModalBody.displayName = "ModalBody", _ModalBody.componentId = 'Modal.Body', _ModalBody.
|
|
125
|
+
}, _ModalBody.displayName = "ModalBody", _ModalBody.componentId = 'Modal.Body', _ModalBody.allowedProps = _props.allowedProps, _ModalBody.defaultProps = {
|
|
126
126
|
padding: 'medium',
|
|
127
127
|
as: 'div',
|
|
128
128
|
variant: 'default'
|
|
129
|
-
}, _ModalBody)) || _class)
|
|
129
|
+
}, _ModalBody)) || _class);
|
|
130
130
|
var _default = exports.default = ModalBody;
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
6
|
+
exports.allowedProps = void 0;
|
|
9
7
|
/*
|
|
10
8
|
* The MIT License (MIT)
|
|
11
9
|
*
|
|
@@ -30,15 +28,4 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
30
28
|
* SOFTWARE.
|
|
31
29
|
*/
|
|
32
30
|
|
|
33
|
-
const propTypes = exports.propTypes = {
|
|
34
|
-
children: _propTypes.default.node,
|
|
35
|
-
padding: _propTypes.default.string,
|
|
36
|
-
/**
|
|
37
|
-
* provides a reference to the underlying html root element
|
|
38
|
-
*/
|
|
39
|
-
elementRef: _propTypes.default.func,
|
|
40
|
-
as: _propTypes.default.elementType,
|
|
41
|
-
variant: _propTypes.default.oneOf(['default', 'inverse']),
|
|
42
|
-
overflow: _propTypes.default.oneOf(['scroll', 'fit'])
|
|
43
|
-
};
|
|
44
31
|
const allowedProps = exports.allowedProps = ['children', 'padding', 'elementRef', 'as', 'variant', 'overflow'];
|
|
@@ -8,14 +8,13 @@ exports.default = exports.ModalFooter = void 0;
|
|
|
8
8
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
9
9
|
var _react = require("react");
|
|
10
10
|
var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
|
|
11
|
-
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
12
11
|
var _emotion = require("@instructure/emotion");
|
|
13
12
|
var _styles = _interopRequireDefault(require("./styles"));
|
|
14
13
|
var _theme = _interopRequireDefault(require("./theme"));
|
|
15
14
|
var _props = require("./props");
|
|
16
15
|
var _jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
17
16
|
const _excluded = ["children"];
|
|
18
|
-
var _dec,
|
|
17
|
+
var _dec, _class, _ModalFooter;
|
|
19
18
|
/*
|
|
20
19
|
* The MIT License (MIT)
|
|
21
20
|
*
|
|
@@ -45,7 +44,7 @@ parent: Modal
|
|
|
45
44
|
id: Modal.Footer
|
|
46
45
|
---
|
|
47
46
|
**/
|
|
48
|
-
let ModalFooter = exports.ModalFooter = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default),
|
|
47
|
+
let ModalFooter = exports.ModalFooter = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_ModalFooter = class ModalFooter extends _react.Component {
|
|
49
48
|
constructor(...args) {
|
|
50
49
|
super(...args);
|
|
51
50
|
this.ref = null;
|
|
@@ -70,10 +69,11 @@ let ModalFooter = exports.ModalFooter = (_dec = (0, _emotion.withStyle)(_styles.
|
|
|
70
69
|
css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.modalFooter,
|
|
71
70
|
...(0, _passthroughProps.passthroughProps)(rest),
|
|
72
71
|
ref: this.handleRef,
|
|
72
|
+
"data-cid": "ModalFooter",
|
|
73
73
|
children: children
|
|
74
74
|
});
|
|
75
75
|
}
|
|
76
|
-
}, _ModalFooter.displayName = "ModalFooter", _ModalFooter.componentId = 'Modal.Footer', _ModalFooter.
|
|
76
|
+
}, _ModalFooter.displayName = "ModalFooter", _ModalFooter.componentId = 'Modal.Footer', _ModalFooter.allowedProps = _props.allowedProps, _ModalFooter.defaultProps = {
|
|
77
77
|
variant: 'default'
|
|
78
|
-
}, _ModalFooter)) || _class)
|
|
78
|
+
}, _ModalFooter)) || _class);
|
|
79
79
|
var _default = exports.default = ModalFooter;
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
6
|
+
exports.allowedProps = void 0;
|
|
9
7
|
/*
|
|
10
8
|
* The MIT License (MIT)
|
|
11
9
|
*
|
|
@@ -30,8 +28,4 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
30
28
|
* SOFTWARE.
|
|
31
29
|
*/
|
|
32
30
|
|
|
33
|
-
const propTypes = exports.propTypes = {
|
|
34
|
-
children: _propTypes.default.node,
|
|
35
|
-
variant: _propTypes.default.oneOf(['default', 'inverse'])
|
|
36
|
-
};
|
|
37
31
|
const allowedProps = exports.allowedProps = ['children', 'variant'];
|
|
@@ -9,7 +9,6 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
9
9
|
var _react = require("react");
|
|
10
10
|
var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
|
|
11
11
|
var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
|
|
12
|
-
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
13
12
|
var _emotion = require("@instructure/emotion");
|
|
14
13
|
var _CloseButton = require("@instructure/ui-buttons/lib/CloseButton");
|
|
15
14
|
var _styles = _interopRequireDefault(require("./styles"));
|
|
@@ -17,7 +16,7 @@ var _theme = _interopRequireDefault(require("./theme"));
|
|
|
17
16
|
var _props = require("./props");
|
|
18
17
|
var _jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
19
18
|
const _excluded = ["children"];
|
|
20
|
-
var _dec,
|
|
19
|
+
var _dec, _class, _ModalHeader;
|
|
21
20
|
/*
|
|
22
21
|
* The MIT License (MIT)
|
|
23
22
|
*
|
|
@@ -47,7 +46,7 @@ parent: Modal
|
|
|
47
46
|
id: Modal.Header
|
|
48
47
|
---
|
|
49
48
|
**/
|
|
50
|
-
let ModalHeader = exports.ModalHeader = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default),
|
|
49
|
+
let ModalHeader = exports.ModalHeader = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_ModalHeader = class ModalHeader extends _react.Component {
|
|
51
50
|
constructor(...args) {
|
|
52
51
|
super(...args);
|
|
53
52
|
this.ref = null;
|
|
@@ -86,11 +85,12 @@ let ModalHeader = exports.ModalHeader = (_dec = (0, _emotion.withStyle)(_styles.
|
|
|
86
85
|
css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.modalHeader,
|
|
87
86
|
...(0, _passthroughProps.passthroughProps)(rest),
|
|
88
87
|
ref: this.handleRef,
|
|
88
|
+
"data-cid": "ModalHeader",
|
|
89
89
|
children: children
|
|
90
90
|
});
|
|
91
91
|
}
|
|
92
|
-
}, _ModalHeader.displayName = "ModalHeader", _ModalHeader.componentId = 'Modal.Header', _ModalHeader.
|
|
92
|
+
}, _ModalHeader.displayName = "ModalHeader", _ModalHeader.componentId = 'Modal.Header', _ModalHeader.allowedProps = _props.allowedProps, _ModalHeader.defaultProps = {
|
|
93
93
|
variant: 'default',
|
|
94
94
|
spacing: 'default'
|
|
95
|
-
}, _ModalHeader)) || _class)
|
|
95
|
+
}, _ModalHeader)) || _class);
|
|
96
96
|
var _default = exports.default = ModalHeader;
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
6
|
+
exports.allowedProps = void 0;
|
|
9
7
|
/*
|
|
10
8
|
* The MIT License (MIT)
|
|
11
9
|
*
|
|
@@ -30,9 +28,4 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
30
28
|
* SOFTWARE.
|
|
31
29
|
*/
|
|
32
30
|
|
|
33
|
-
const propTypes = exports.propTypes = {
|
|
34
|
-
children: _propTypes.default.node,
|
|
35
|
-
variant: _propTypes.default.oneOf(['default', 'inverse']),
|
|
36
|
-
spacing: _propTypes.default.oneOf(['default', 'compact'])
|
|
37
|
-
};
|
|
38
31
|
const allowedProps = exports.allowedProps = ['children', 'variant', 'spacing'];
|
package/lib/Modal/index.js
CHANGED
|
@@ -29,7 +29,6 @@ var _react = require("react");
|
|
|
29
29
|
var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
|
|
30
30
|
var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
|
|
31
31
|
var _createChainedFunction = require("@instructure/ui-utils/lib/createChainedFunction.js");
|
|
32
|
-
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
33
32
|
var _Transition = require("@instructure/ui-motion/lib/Transition");
|
|
34
33
|
var _Portal = require("@instructure/ui-portal/lib/Portal");
|
|
35
34
|
var _Dialog = require("@instructure/ui-dialog/lib/Dialog");
|
|
@@ -43,7 +42,7 @@ var _theme = _interopRequireDefault(require("./theme"));
|
|
|
43
42
|
var _props = require("./props");
|
|
44
43
|
var _jsxRuntime = require("@emotion/react/jsx-runtime");
|
|
45
44
|
const _excluded = ["open", "onOpen", "onClose", "mountNode", "insertAt", "transition", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "constrain", "overflow"];
|
|
46
|
-
var _dec,
|
|
45
|
+
var _dec, _class, _Modal;
|
|
47
46
|
/*
|
|
48
47
|
* The MIT License (MIT)
|
|
49
48
|
*
|
|
@@ -73,7 +72,7 @@ category: components
|
|
|
73
72
|
tags: overlay, portal, dialog
|
|
74
73
|
---
|
|
75
74
|
**/
|
|
76
|
-
let Modal = exports.Modal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default),
|
|
75
|
+
let Modal = exports.Modal = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_Modal = class Modal extends _react.Component {
|
|
77
76
|
constructor(props) {
|
|
78
77
|
var _props$open;
|
|
79
78
|
super(props);
|
|
@@ -244,6 +243,7 @@ let Modal = exports.Modal = (_dec = (0, _emotion.withStyle)(_styles.default, _th
|
|
|
244
243
|
insertAt: insertAt,
|
|
245
244
|
open: portalIsOpen,
|
|
246
245
|
onOpen: this.handlePortalOpen,
|
|
246
|
+
"data-cid": "Modal",
|
|
247
247
|
children: (0, _jsxRuntime.jsx)(_Transition.Transition, {
|
|
248
248
|
in: open,
|
|
249
249
|
transitionOnMount: true,
|
|
@@ -261,7 +261,7 @@ let Modal = exports.Modal = (_dec = (0, _emotion.withStyle)(_styles.default, _th
|
|
|
261
261
|
})
|
|
262
262
|
});
|
|
263
263
|
}
|
|
264
|
-
}, _Modal.displayName = "Modal", _Modal.componentId = 'Modal', _Modal.
|
|
264
|
+
}, _Modal.displayName = "Modal", _Modal.componentId = 'Modal', _Modal.allowedProps = _props.allowedProps, _Modal.defaultProps = {
|
|
265
265
|
open: false,
|
|
266
266
|
size: 'auto',
|
|
267
267
|
variant: 'default',
|
|
@@ -271,5 +271,5 @@ let Modal = exports.Modal = (_dec = (0, _emotion.withStyle)(_styles.default, _th
|
|
|
271
271
|
shouldReturnFocus: true,
|
|
272
272
|
constrain: 'window',
|
|
273
273
|
overflow: 'scroll'
|
|
274
|
-
}, _Modal.Header = _ModalHeader.ModalHeader, _Modal.Body = _ModalBody.ModalBody, _Modal.Footer = _ModalFooter.ModalFooter, _Modal)) || _class)
|
|
274
|
+
}, _Modal.Header = _ModalHeader.ModalHeader, _Modal.Body = _ModalBody.ModalBody, _Modal.Footer = _ModalFooter.ModalFooter, _Modal)) || _class);
|
|
275
275
|
var _default = exports.default = Modal;
|
package/lib/Modal/props.js
CHANGED
|
@@ -1,13 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
-
var _element = require("@instructure/ui-prop-types/lib/element.js");
|
|
10
|
-
var _uiMotion = require("@instructure/ui-motion");
|
|
6
|
+
exports.allowedProps = void 0;
|
|
11
7
|
/*
|
|
12
8
|
* The MIT License (MIT)
|
|
13
9
|
*
|
|
@@ -32,31 +28,4 @@ var _uiMotion = require("@instructure/ui-motion");
|
|
|
32
28
|
* SOFTWARE.
|
|
33
29
|
*/
|
|
34
30
|
|
|
35
|
-
const propTypes = exports.propTypes = {
|
|
36
|
-
label: _propTypes.default.string.isRequired,
|
|
37
|
-
children: _propTypes.default.node,
|
|
38
|
-
as: _propTypes.default.elementType,
|
|
39
|
-
size: _propTypes.default.oneOf(['auto', 'small', 'medium', 'large', 'fullscreen']),
|
|
40
|
-
variant: _propTypes.default.oneOf(['default', 'inverse']),
|
|
41
|
-
open: _propTypes.default.bool,
|
|
42
|
-
defaultFocusElement: _propTypes.default.oneOfType([_propTypes.default.element, _propTypes.default.func]),
|
|
43
|
-
shouldReturnFocus: _propTypes.default.bool,
|
|
44
|
-
shouldCloseOnDocumentClick: _propTypes.default.bool,
|
|
45
|
-
onOpen: _propTypes.default.func,
|
|
46
|
-
onClose: _propTypes.default.func,
|
|
47
|
-
onDismiss: _propTypes.default.func,
|
|
48
|
-
contentRef: _propTypes.default.func,
|
|
49
|
-
mountNode: _propTypes.default.oneOfType([_element.element, _propTypes.default.func]),
|
|
50
|
-
insertAt: _propTypes.default.oneOf(['bottom', 'top']),
|
|
51
|
-
liveRegion: _propTypes.default.oneOfType([_element.element, _propTypes.default.arrayOf(_element.element), _propTypes.default.func]),
|
|
52
|
-
transition: _uiMotion.transitionTypePropType,
|
|
53
|
-
onEnter: _propTypes.default.func,
|
|
54
|
-
onEntering: _propTypes.default.func,
|
|
55
|
-
onEntered: _propTypes.default.func,
|
|
56
|
-
onExit: _propTypes.default.func,
|
|
57
|
-
onExiting: _propTypes.default.func,
|
|
58
|
-
onExited: _propTypes.default.func,
|
|
59
|
-
constrain: _propTypes.default.oneOf(['window', 'parent']),
|
|
60
|
-
overflow: _propTypes.default.oneOf(['scroll', 'fit'])
|
|
61
|
-
};
|
|
62
31
|
const allowedProps = exports.allowedProps = ['label', 'children', 'as', 'size', 'variant', 'open', 'defaultFocusElement', 'shouldReturnFocus', 'shouldCloseOnDocumentClick', 'onOpen', 'onClose', 'onDismiss', 'contentRef', 'mountNode', 'insertAt', 'liveRegion', 'transition', 'onEnter', 'onEntering', 'onEntered', 'onExit', 'onExiting', 'onExited', 'constrain', 'overflow'];
|