@atlaskit/modal-dialog 12.18.4 → 12.19.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 +14 -0
- package/dist/cjs/modal-body.js +1 -1
- package/dist/cjs/modal-title.js +18 -1
- package/dist/cjs/modal-wrapper.js +1 -1
- package/dist/es2019/modal-body.js +1 -1
- package/dist/es2019/modal-title.js +18 -1
- package/dist/es2019/modal-wrapper.js +1 -1
- package/dist/esm/modal-body.js +1 -1
- package/dist/esm/modal-title.js +18 -1
- package/dist/esm/modal-wrapper.js +1 -1
- package/package.json +8 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @atlaskit/modal-dialog
|
|
2
2
|
|
|
3
|
+
## 12.19.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#100038](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100038)
|
|
8
|
+
[`f4fe1a42a5809`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/f4fe1a42a5809) -
|
|
9
|
+
Move the icon in a modal title (when present) out of the H1 tag
|
|
10
|
+
|
|
11
|
+
## 12.18.5
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- Updated dependencies
|
|
16
|
+
|
|
3
17
|
## 12.18.4
|
|
4
18
|
|
|
5
19
|
### Patch Changes
|
package/dist/cjs/modal-body.js
CHANGED
|
@@ -30,7 +30,7 @@ var bodyStyles = (0, _react2.css)({
|
|
|
30
30
|
* keyline height from header and footer using negative margins.
|
|
31
31
|
*/
|
|
32
32
|
var bodyScrollStyles = (0, _react2.css)({
|
|
33
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
33
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/use-tokens-typography -- Ignored via go/DSP-18766
|
|
34
34
|
paddingBlock: _constants.keylineHeight,
|
|
35
35
|
paddingInline: "var(--ds-space-300, 24px)"
|
|
36
36
|
});
|
package/dist/cjs/modal-title.js
CHANGED
|
@@ -8,6 +8,8 @@ exports.default = void 0;
|
|
|
8
8
|
var _react = require("@emotion/react");
|
|
9
9
|
var _error = _interopRequireDefault(require("@atlaskit/icon/core/migration/error"));
|
|
10
10
|
var _warning = _interopRequireDefault(require("@atlaskit/icon/core/migration/warning"));
|
|
11
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
12
|
+
var _primitives = require("@atlaskit/primitives");
|
|
11
13
|
var _hooks = require("./hooks");
|
|
12
14
|
var _constants = require("./internal/constants");
|
|
13
15
|
/**
|
|
@@ -40,10 +42,14 @@ var iconStyles = (0, _react.css)({
|
|
|
40
42
|
// https://stash.atlassian.com/projects/JIRACLOUD/repos/jira/browse/jira-components/jira-legacy-frontend/jira-atlaskit-module/src/main/resources/jira-atlaskit-module/css/adg3-general-overrides.less?at=master#24
|
|
41
43
|
// When the override is removed, these can be removed.
|
|
42
44
|
color: 'inherit',
|
|
45
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
43
46
|
fontSize: 'inherit',
|
|
44
47
|
fontStyle: 'inherit',
|
|
48
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
45
49
|
fontWeight: 'inherit',
|
|
50
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
46
51
|
letterSpacing: 'inherit',
|
|
52
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
47
53
|
lineHeight: 'inherit'
|
|
48
54
|
});
|
|
49
55
|
var truncatedTextStyles = (0, _react.css)({
|
|
@@ -81,7 +87,18 @@ var ModalTitle = function ModalTitle(props) {
|
|
|
81
87
|
titleId = _useModal.titleId,
|
|
82
88
|
modalTestId = _useModal.testId;
|
|
83
89
|
var testId = userDefinedTestId || modalTestId && "".concat(modalTestId, "--title");
|
|
84
|
-
return (0, _react.jsx)(
|
|
90
|
+
return (0, _platformFeatureFlags.fg)('platform_modal-dialog-heading-icon-a11y-fix') ? (0, _react.jsx)(_primitives.Flex, {
|
|
91
|
+
gap: "space.100"
|
|
92
|
+
}, appearance && (0, _react.jsx)(TitleIcon, {
|
|
93
|
+
appearance: appearance
|
|
94
|
+
}), (0, _react.jsx)("h1", {
|
|
95
|
+
css: titleStyles,
|
|
96
|
+
"data-testid": testId
|
|
97
|
+
}, (0, _react.jsx)("span", {
|
|
98
|
+
id: titleId,
|
|
99
|
+
css: [textStyles, !isMultiline && truncatedTextStyles],
|
|
100
|
+
"data-testid": testId && "".concat(testId, "-text")
|
|
101
|
+
}, children))) : (0, _react.jsx)("h1", {
|
|
85
102
|
css: titleStyles,
|
|
86
103
|
"data-testid": testId
|
|
87
104
|
}, appearance && (0, _react.jsx)(TitleIcon, {
|
|
@@ -108,7 +108,7 @@ var ModalWrapper = function ModalWrapper(props) {
|
|
|
108
108
|
action: 'closed',
|
|
109
109
|
componentName: 'modalDialog',
|
|
110
110
|
packageName: "@atlaskit/modal-dialog",
|
|
111
|
-
packageVersion: "12.
|
|
111
|
+
packageVersion: "12.19.0"
|
|
112
112
|
});
|
|
113
113
|
var onBlanketClicked = (0, _react.useCallback)(function (e) {
|
|
114
114
|
if (shouldCloseOnOverlayClick) {
|
|
@@ -23,7 +23,7 @@ const bodyStyles = css({
|
|
|
23
23
|
* keyline height from header and footer using negative margins.
|
|
24
24
|
*/
|
|
25
25
|
const bodyScrollStyles = css({
|
|
26
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
26
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/use-tokens-typography -- Ignored via go/DSP-18766
|
|
27
27
|
paddingBlock: keylineHeight,
|
|
28
28
|
paddingInline: "var(--ds-space-300, 24px)"
|
|
29
29
|
});
|
|
@@ -7,6 +7,8 @@
|
|
|
7
7
|
import { css, jsx } from '@emotion/react';
|
|
8
8
|
import ErrorIcon from '@atlaskit/icon/core/migration/error';
|
|
9
9
|
import WarningIcon from '@atlaskit/icon/core/migration/warning';
|
|
10
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
11
|
+
import { Flex } from '@atlaskit/primitives';
|
|
10
12
|
import { useModal } from './hooks';
|
|
11
13
|
import { iconColor } from './internal/constants';
|
|
12
14
|
const titleStyles = css({
|
|
@@ -32,10 +34,14 @@ const iconStyles = css({
|
|
|
32
34
|
// https://stash.atlassian.com/projects/JIRACLOUD/repos/jira/browse/jira-components/jira-legacy-frontend/jira-atlaskit-module/src/main/resources/jira-atlaskit-module/css/adg3-general-overrides.less?at=master#24
|
|
33
35
|
// When the override is removed, these can be removed.
|
|
34
36
|
color: 'inherit',
|
|
37
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
35
38
|
fontSize: 'inherit',
|
|
36
39
|
fontStyle: 'inherit',
|
|
40
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
37
41
|
fontWeight: 'inherit',
|
|
42
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
38
43
|
letterSpacing: 'inherit',
|
|
44
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
39
45
|
lineHeight: 'inherit'
|
|
40
46
|
});
|
|
41
47
|
const truncatedTextStyles = css({
|
|
@@ -76,7 +82,18 @@ const ModalTitle = props => {
|
|
|
76
82
|
testId: modalTestId
|
|
77
83
|
} = useModal();
|
|
78
84
|
const testId = userDefinedTestId || modalTestId && `${modalTestId}--title`;
|
|
79
|
-
return jsx(
|
|
85
|
+
return fg('platform_modal-dialog-heading-icon-a11y-fix') ? jsx(Flex, {
|
|
86
|
+
gap: "space.100"
|
|
87
|
+
}, appearance && jsx(TitleIcon, {
|
|
88
|
+
appearance: appearance
|
|
89
|
+
}), jsx("h1", {
|
|
90
|
+
css: titleStyles,
|
|
91
|
+
"data-testid": testId
|
|
92
|
+
}, jsx("span", {
|
|
93
|
+
id: titleId,
|
|
94
|
+
css: [textStyles, !isMultiline && truncatedTextStyles],
|
|
95
|
+
"data-testid": testId && `${testId}-text`
|
|
96
|
+
}, children))) : jsx("h1", {
|
|
80
97
|
css: titleStyles,
|
|
81
98
|
"data-testid": testId
|
|
82
99
|
}, appearance && jsx(TitleIcon, {
|
|
@@ -93,7 +93,7 @@ const ModalWrapper = props => {
|
|
|
93
93
|
action: 'closed',
|
|
94
94
|
componentName: 'modalDialog',
|
|
95
95
|
packageName: "@atlaskit/modal-dialog",
|
|
96
|
-
packageVersion: "12.
|
|
96
|
+
packageVersion: "12.19.0"
|
|
97
97
|
});
|
|
98
98
|
const onBlanketClicked = useCallback(e => {
|
|
99
99
|
if (shouldCloseOnOverlayClick) {
|
package/dist/esm/modal-body.js
CHANGED
|
@@ -23,7 +23,7 @@ var bodyStyles = css({
|
|
|
23
23
|
* keyline height from header and footer using negative margins.
|
|
24
24
|
*/
|
|
25
25
|
var bodyScrollStyles = css({
|
|
26
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
26
|
+
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/design-system/use-tokens-typography -- Ignored via go/DSP-18766
|
|
27
27
|
paddingBlock: keylineHeight,
|
|
28
28
|
paddingInline: "var(--ds-space-300, 24px)"
|
|
29
29
|
});
|
package/dist/esm/modal-title.js
CHANGED
|
@@ -7,6 +7,8 @@
|
|
|
7
7
|
import { css, jsx } from '@emotion/react';
|
|
8
8
|
import ErrorIcon from '@atlaskit/icon/core/migration/error';
|
|
9
9
|
import WarningIcon from '@atlaskit/icon/core/migration/warning';
|
|
10
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
11
|
+
import { Flex } from '@atlaskit/primitives';
|
|
10
12
|
import { useModal } from './hooks';
|
|
11
13
|
import { iconColor } from './internal/constants';
|
|
12
14
|
var titleStyles = css({
|
|
@@ -32,10 +34,14 @@ var iconStyles = css({
|
|
|
32
34
|
// https://stash.atlassian.com/projects/JIRACLOUD/repos/jira/browse/jira-components/jira-legacy-frontend/jira-atlaskit-module/src/main/resources/jira-atlaskit-module/css/adg3-general-overrides.less?at=master#24
|
|
33
35
|
// When the override is removed, these can be removed.
|
|
34
36
|
color: 'inherit',
|
|
37
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
35
38
|
fontSize: 'inherit',
|
|
36
39
|
fontStyle: 'inherit',
|
|
40
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
37
41
|
fontWeight: 'inherit',
|
|
42
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
38
43
|
letterSpacing: 'inherit',
|
|
44
|
+
// eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
|
|
39
45
|
lineHeight: 'inherit'
|
|
40
46
|
});
|
|
41
47
|
var truncatedTextStyles = css({
|
|
@@ -73,7 +79,18 @@ var ModalTitle = function ModalTitle(props) {
|
|
|
73
79
|
titleId = _useModal.titleId,
|
|
74
80
|
modalTestId = _useModal.testId;
|
|
75
81
|
var testId = userDefinedTestId || modalTestId && "".concat(modalTestId, "--title");
|
|
76
|
-
return jsx(
|
|
82
|
+
return fg('platform_modal-dialog-heading-icon-a11y-fix') ? jsx(Flex, {
|
|
83
|
+
gap: "space.100"
|
|
84
|
+
}, appearance && jsx(TitleIcon, {
|
|
85
|
+
appearance: appearance
|
|
86
|
+
}), jsx("h1", {
|
|
87
|
+
css: titleStyles,
|
|
88
|
+
"data-testid": testId
|
|
89
|
+
}, jsx("span", {
|
|
90
|
+
id: titleId,
|
|
91
|
+
css: [textStyles, !isMultiline && truncatedTextStyles],
|
|
92
|
+
"data-testid": testId && "".concat(testId, "-text")
|
|
93
|
+
}, children))) : jsx("h1", {
|
|
77
94
|
css: titleStyles,
|
|
78
95
|
"data-testid": testId
|
|
79
96
|
}, appearance && jsx(TitleIcon, {
|
|
@@ -98,7 +98,7 @@ var ModalWrapper = function ModalWrapper(props) {
|
|
|
98
98
|
action: 'closed',
|
|
99
99
|
componentName: 'modalDialog',
|
|
100
100
|
packageName: "@atlaskit/modal-dialog",
|
|
101
|
-
packageVersion: "12.
|
|
101
|
+
packageVersion: "12.19.0"
|
|
102
102
|
});
|
|
103
103
|
var onBlanketClicked = useCallback(function (e) {
|
|
104
104
|
if (shouldCloseOnOverlayClick) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/modal-dialog",
|
|
3
|
-
"version": "12.
|
|
3
|
+
"version": "12.19.0",
|
|
4
4
|
"description": "A modal dialog displays content that requires user interaction, in a layer above the page.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
31
|
"@atlaskit/analytics-next": "^10.2.0",
|
|
32
|
-
"@atlaskit/blanket": "^
|
|
32
|
+
"@atlaskit/blanket": "^14.0.0",
|
|
33
33
|
"@atlaskit/codemod-utils": "^4.2.0",
|
|
34
34
|
"@atlaskit/ds-lib": "^3.3.0",
|
|
35
35
|
"@atlaskit/focus-ring": "^2.0.0",
|
|
@@ -37,11 +37,11 @@
|
|
|
37
37
|
"@atlaskit/layering": "^1.0.0",
|
|
38
38
|
"@atlaskit/motion": "^1.9.0",
|
|
39
39
|
"@atlaskit/platform-feature-flags": "^0.3.0",
|
|
40
|
-
"@atlaskit/portal": "^4.
|
|
40
|
+
"@atlaskit/portal": "^4.10.0",
|
|
41
41
|
"@atlaskit/pragmatic-drag-and-drop": "^1.4.0",
|
|
42
42
|
"@atlaskit/primitives": "^13.3.0",
|
|
43
43
|
"@atlaskit/theme": "^14.0.0",
|
|
44
|
-
"@atlaskit/tokens": "^2.
|
|
44
|
+
"@atlaskit/tokens": "^2.5.0",
|
|
45
45
|
"@babel/runtime": "^7.0.0",
|
|
46
46
|
"@emotion/react": "^11.7.1",
|
|
47
47
|
"bind-event-listener": "^3.0.0",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@atlaskit/dropdown-menu": "^12.23.0",
|
|
62
62
|
"@atlaskit/popup": "^1.30.0",
|
|
63
63
|
"@atlaskit/radio": "^7.0.0",
|
|
64
|
-
"@atlaskit/select": "^18.
|
|
64
|
+
"@atlaskit/select": "^18.9.0",
|
|
65
65
|
"@atlaskit/ssr": "*",
|
|
66
66
|
"@atlaskit/textfield": "^6.7.0",
|
|
67
67
|
"@atlaskit/tooltip": "^19.0.0",
|
|
@@ -131,6 +131,9 @@
|
|
|
131
131
|
},
|
|
132
132
|
"platform_dst_allowlist-aui-dialog-for-ak-modal": {
|
|
133
133
|
"type": "boolean"
|
|
134
|
+
},
|
|
135
|
+
"platform_modal-dialog-heading-icon-a11y-fix": {
|
|
136
|
+
"type": "boolean"
|
|
134
137
|
}
|
|
135
138
|
},
|
|
136
139
|
"homepage": "https://atlassian.design/components/modal-dialog/"
|