@atlaskit/section-message 6.6.2 → 6.6.4

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 CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/section-message
2
2
 
3
+ ## 6.6.4
4
+
5
+ ### Patch Changes
6
+
7
+ - [#137586](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/137586)
8
+ [`7ef921d67c033`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/7ef921d67c033) -
9
+ Accessibility changes. Add roles to improve semantics.
10
+ - Updated dependencies
11
+
12
+ ## 6.6.3
13
+
14
+ ### Patch Changes
15
+
16
+ - [#128532](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/128532)
17
+ [`4d5c91fed0306`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4d5c91fed0306) -
18
+ Change element wrapping children from `span` to `div` to improve HTML specification compliance.
19
+
3
20
  ## 6.6.2
4
21
 
5
22
  ### Patch Changes
@@ -12,7 +12,7 @@ var _primitives = require("@atlaskit/primitives");
12
12
  var _appearanceIcon = require("./internal/appearance-icon");
13
13
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
14
14
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
15
- var sectionMessageStyles = (0, _primitives.xcss)({
15
+ var containerStyles = (0, _primitives.xcss)({
16
16
  wordBreak: 'break-word',
17
17
  borderRadius: 'border.radius'
18
18
  });
@@ -20,6 +20,10 @@ var bleedStyles = (0, _primitives.xcss)({
20
20
  display: 'flex',
21
21
  marginBlock: 'space.negative.025'
22
22
  });
23
+ var contentStyles = (0, _primitives.xcss)({
24
+ color: 'color.text',
25
+ font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
26
+ });
23
27
 
24
28
  /**
25
29
  * __Section message__
@@ -50,7 +54,7 @@ var SectionMessage = /*#__PURE__*/(0, _react.forwardRef)(function SectionMessage
50
54
  padding: "space.200",
51
55
  testId: testId,
52
56
  ref: ref,
53
- xcss: sectionMessageStyles
57
+ xcss: containerStyles
54
58
  }, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
55
59
  space: "space.200",
56
60
  alignBlock: "stretch"
@@ -66,13 +70,21 @@ var SectionMessage = /*#__PURE__*/(0, _react.forwardRef)(function SectionMessage
66
70
  }, !!title && /*#__PURE__*/_react.default.createElement(_heading.default, {
67
71
  as: "h2",
68
72
  size: "small"
69
- }, title), /*#__PURE__*/_react.default.createElement(_primitives.Text, null, children), actionsArray.length > 0 && /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
73
+ }, title), /*#__PURE__*/_react.default.createElement(_primitives.Box, {
74
+ xcss: contentStyles
75
+ }, children), actionsArray.length > 0 && /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
70
76
  shouldWrap: true,
71
77
  testId: testId && "".concat(testId, "--actions"),
72
78
  separator: "\xB7",
73
79
  space: "space.100",
74
- rowSpace: "space.0"
75
- }, actionsArray))));
80
+ rowSpace: "space.0",
81
+ role: "list"
82
+ }, actionsArray.map(function (action, id) {
83
+ return /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
84
+ role: "listitem",
85
+ key: id
86
+ }, action);
87
+ })))));
76
88
  });
77
89
  var appearanceMap = {
78
90
  information: 'color.background.information',
@@ -1,8 +1,8 @@
1
1
  import React, { forwardRef } from 'react';
2
2
  import Heading from '@atlaskit/heading';
3
- import { Box, Inline, Stack, Text, xcss } from '@atlaskit/primitives';
3
+ import { Box, Inline, Stack, xcss } from '@atlaskit/primitives';
4
4
  import { getAppearanceIconStyles } from './internal/appearance-icon';
5
- const sectionMessageStyles = xcss({
5
+ const containerStyles = xcss({
6
6
  wordBreak: 'break-word',
7
7
  borderRadius: 'border.radius'
8
8
  });
@@ -10,6 +10,10 @@ const bleedStyles = xcss({
10
10
  display: 'flex',
11
11
  marginBlock: 'space.negative.025'
12
12
  });
13
+ const contentStyles = xcss({
14
+ color: 'color.text',
15
+ font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
16
+ });
13
17
 
14
18
  /**
15
19
  * __Section message__
@@ -41,7 +45,7 @@ const SectionMessage = /*#__PURE__*/forwardRef(function SectionMessage({
41
45
  padding: "space.200",
42
46
  testId: testId,
43
47
  ref: ref,
44
- xcss: sectionMessageStyles
48
+ xcss: containerStyles
45
49
  }, /*#__PURE__*/React.createElement(Inline, {
46
50
  space: "space.200",
47
51
  alignBlock: "stretch"
@@ -57,13 +61,19 @@ const SectionMessage = /*#__PURE__*/forwardRef(function SectionMessage({
57
61
  }, !!title && /*#__PURE__*/React.createElement(Heading, {
58
62
  as: "h2",
59
63
  size: "small"
60
- }, title), /*#__PURE__*/React.createElement(Text, null, children), actionsArray.length > 0 && /*#__PURE__*/React.createElement(Inline, {
64
+ }, title), /*#__PURE__*/React.createElement(Box, {
65
+ xcss: contentStyles
66
+ }, children), actionsArray.length > 0 && /*#__PURE__*/React.createElement(Inline, {
61
67
  shouldWrap: true,
62
68
  testId: testId && `${testId}--actions`,
63
69
  separator: "\xB7",
64
70
  space: "space.100",
65
- rowSpace: "space.0"
66
- }, actionsArray))));
71
+ rowSpace: "space.0",
72
+ role: "list"
73
+ }, actionsArray.map((action, id) => /*#__PURE__*/React.createElement(Inline, {
74
+ role: "listitem",
75
+ key: id
76
+ }, action))))));
67
77
  });
68
78
  const appearanceMap = {
69
79
  information: 'color.background.information',
@@ -1,8 +1,8 @@
1
1
  import React, { forwardRef } from 'react';
2
2
  import Heading from '@atlaskit/heading';
3
- import { Box, Inline, Stack, Text, xcss } from '@atlaskit/primitives';
3
+ import { Box, Inline, Stack, xcss } from '@atlaskit/primitives';
4
4
  import { getAppearanceIconStyles } from './internal/appearance-icon';
5
- var sectionMessageStyles = xcss({
5
+ var containerStyles = xcss({
6
6
  wordBreak: 'break-word',
7
7
  borderRadius: 'border.radius'
8
8
  });
@@ -10,6 +10,10 @@ var bleedStyles = xcss({
10
10
  display: 'flex',
11
11
  marginBlock: 'space.negative.025'
12
12
  });
13
+ var contentStyles = xcss({
14
+ color: 'color.text',
15
+ font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
16
+ });
13
17
 
14
18
  /**
15
19
  * __Section message__
@@ -40,7 +44,7 @@ var SectionMessage = /*#__PURE__*/forwardRef(function SectionMessage(_ref, ref)
40
44
  padding: "space.200",
41
45
  testId: testId,
42
46
  ref: ref,
43
- xcss: sectionMessageStyles
47
+ xcss: containerStyles
44
48
  }, /*#__PURE__*/React.createElement(Inline, {
45
49
  space: "space.200",
46
50
  alignBlock: "stretch"
@@ -56,13 +60,21 @@ var SectionMessage = /*#__PURE__*/forwardRef(function SectionMessage(_ref, ref)
56
60
  }, !!title && /*#__PURE__*/React.createElement(Heading, {
57
61
  as: "h2",
58
62
  size: "small"
59
- }, title), /*#__PURE__*/React.createElement(Text, null, children), actionsArray.length > 0 && /*#__PURE__*/React.createElement(Inline, {
63
+ }, title), /*#__PURE__*/React.createElement(Box, {
64
+ xcss: contentStyles
65
+ }, children), actionsArray.length > 0 && /*#__PURE__*/React.createElement(Inline, {
60
66
  shouldWrap: true,
61
67
  testId: testId && "".concat(testId, "--actions"),
62
68
  separator: "\xB7",
63
69
  space: "space.100",
64
- rowSpace: "space.0"
65
- }, actionsArray))));
70
+ rowSpace: "space.0",
71
+ role: "list"
72
+ }, actionsArray.map(function (action, id) {
73
+ return /*#__PURE__*/React.createElement(Inline, {
74
+ role: "listitem",
75
+ key: id
76
+ }, action);
77
+ })))));
66
78
  });
67
79
  var appearanceMap = {
68
80
  information: 'color.background.information',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/section-message",
3
- "version": "6.6.2",
3
+ "version": "6.6.4",
4
4
  "description": "A section message is used to alert users to a particular section of the screen.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -24,14 +24,10 @@
24
24
  "atlaskit:src": "src/index.tsx",
25
25
  "atlassian": {
26
26
  "team": "Design System Team",
27
- "releaseModel": "continuous",
28
27
  "website": {
29
28
  "name": "Section message",
30
29
  "category": "Components"
31
30
  },
32
- "productPushConsumption": [
33
- "jira"
34
- ],
35
31
  "runReact18": true
36
32
  },
37
33
  "af:exports": {
@@ -41,13 +37,13 @@
41
37
  ".": "./src/index.tsx"
42
38
  },
43
39
  "dependencies": {
44
- "@atlaskit/button": "^20.0.0",
40
+ "@atlaskit/button": "^20.1.0",
45
41
  "@atlaskit/codemod-utils": "^4.2.0",
46
42
  "@atlaskit/heading": "^2.4.0",
47
- "@atlaskit/icon": "^22.13.0",
48
- "@atlaskit/primitives": "^12.0.0",
43
+ "@atlaskit/icon": "^22.16.0",
44
+ "@atlaskit/primitives": "^12.1.0",
49
45
  "@atlaskit/theme": "^13.0.0",
50
- "@atlaskit/tokens": "^1.58.0",
46
+ "@atlaskit/tokens": "^1.59.0",
51
47
  "@babel/runtime": "^7.0.0"
52
48
  },
53
49
  "peerDependencies": {
@@ -57,7 +53,7 @@
57
53
  "@af/accessibility-testing": "*",
58
54
  "@af/integration-testing": "*",
59
55
  "@atlaskit/analytics-next": "^10.1.0",
60
- "@atlaskit/ds-lib": "^2.4.0",
56
+ "@atlaskit/ds-lib": "^2.5.0",
61
57
  "@atlaskit/ssr": "*",
62
58
  "@atlaskit/visual-regression": "*",
63
59
  "@testing-library/react": "^12.1.5",
@@ -65,7 +61,6 @@
65
61
  "jest-in-case": "^1.0.2",
66
62
  "jscodeshift": "^0.13.0",
67
63
  "react-dom": "^16.8.0",
68
- "react-test-renderer": "^16.8.0",
69
64
  "storybook-addon-performance": "^0.16.0",
70
65
  "typescript": "~5.4.2"
71
66
  },