@atlaskit/side-navigation 1.1.2 → 1.2.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 +35 -0
- package/dist/cjs/components/Footer/index.js +28 -28
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/components/Footer/index.js +8 -10
- package/dist/es2019/version.json +1 -1
- package/dist/esm/components/Footer/index.js +28 -27
- package/dist/esm/version.json +1 -1
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,40 @@
|
|
|
1
1
|
# @atlaskit/side-navigation
|
|
2
2
|
|
|
3
|
+
## 1.2.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`213bfd77e61`](https://bitbucket.org/atlassian/atlassian-frontend/commits/213bfd77e61) - The DOM structure of menu item components has been flattened.
|
|
8
|
+
If you used CSS hacks (via className or cssFn) that targetted specific DOM nodes you may be broken.
|
|
9
|
+
|
|
10
|
+
Previously the structure looked like:
|
|
11
|
+
|
|
12
|
+
```jsx
|
|
13
|
+
<button>
|
|
14
|
+
<div> // <-- this intermediate div has been removed
|
|
15
|
+
<span>
|
|
16
|
+
<span />
|
|
17
|
+
</span>
|
|
18
|
+
</div>
|
|
19
|
+
</button>
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
Now it looks like:
|
|
23
|
+
|
|
24
|
+
```jsx
|
|
25
|
+
<button>
|
|
26
|
+
<span>
|
|
27
|
+
<span />
|
|
28
|
+
</span>
|
|
29
|
+
</button>
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
- [`e4f332d8697`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e4f332d8697) - Internal refactor to update style declarations to match menu changes.
|
|
33
|
+
|
|
34
|
+
### Patch Changes
|
|
35
|
+
|
|
36
|
+
- Updated dependencies
|
|
37
|
+
|
|
3
38
|
## 1.1.2
|
|
4
39
|
|
|
5
40
|
### Patch Changes
|
|
@@ -9,8 +9,6 @@ exports.default = void 0;
|
|
|
9
9
|
|
|
10
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
11
|
|
|
12
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
-
|
|
14
12
|
var _react = _interopRequireDefault(require("react"));
|
|
15
13
|
|
|
16
14
|
var _colors = require("@atlaskit/theme/colors");
|
|
@@ -27,35 +25,37 @@ var Container = function Container(props) {
|
|
|
27
25
|
|
|
28
26
|
var Footer = function Footer(props) {
|
|
29
27
|
var cssFn = (0, _styles.overrideStyleFunction)(function () {
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
return _ref = {
|
|
28
|
+
return {
|
|
33
29
|
userSelect: 'auto',
|
|
34
|
-
|
|
35
|
-
|
|
30
|
+
display: 'block',
|
|
31
|
+
textAlign: 'center',
|
|
32
|
+
minHeight: '24px',
|
|
33
|
+
alignItems: 'center',
|
|
34
|
+
width: '100%',
|
|
35
|
+
'[data-item-elem-before]': {
|
|
36
|
+
marginRight: 0,
|
|
37
|
+
marginBottom: '8px',
|
|
38
|
+
display: 'inline-block'
|
|
39
|
+
},
|
|
40
|
+
'[data-item-title]': {
|
|
36
41
|
textAlign: 'center',
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
42
|
+
fontSize: 12
|
|
43
|
+
},
|
|
44
|
+
'[data-item-description]': {
|
|
45
|
+
textAlign: 'center',
|
|
46
|
+
display: 'inline-block',
|
|
47
|
+
margin: '6px'
|
|
48
|
+
},
|
|
49
|
+
// Will look interactive if the `component` is anything other than a div.
|
|
50
|
+
'div&:hover': {
|
|
51
|
+
backgroundColor: 'transparent',
|
|
52
|
+
cursor: 'default'
|
|
53
|
+
},
|
|
54
|
+
'div&:active': {
|
|
55
|
+
backgroundColor: 'transparent',
|
|
56
|
+
color: (0, _tokens.token)('color.text.mediumEmphasis', _colors.N500)
|
|
40
57
|
}
|
|
41
|
-
}
|
|
42
|
-
marginRight: 0,
|
|
43
|
-
marginBottom: '8px',
|
|
44
|
-
display: 'inline-block'
|
|
45
|
-
}), (0, _defineProperty2.default)(_ref, '[data-item-title]', {
|
|
46
|
-
textAlign: 'center',
|
|
47
|
-
fontSize: 12
|
|
48
|
-
}), (0, _defineProperty2.default)(_ref, '[data-item-description]', {
|
|
49
|
-
textAlign: 'center',
|
|
50
|
-
display: 'inline-block',
|
|
51
|
-
margin: '6px'
|
|
52
|
-
}), (0, _defineProperty2.default)(_ref, 'div&:hover', {
|
|
53
|
-
backgroundColor: 'transparent',
|
|
54
|
-
cursor: 'default'
|
|
55
|
-
}), (0, _defineProperty2.default)(_ref, 'div&:active', {
|
|
56
|
-
backgroundColor: 'transparent',
|
|
57
|
-
color: (0, _tokens.token)('color.text.mediumEmphasis', _colors.N500)
|
|
58
|
-
}), _ref;
|
|
58
|
+
};
|
|
59
59
|
}, props.cssFn);
|
|
60
60
|
return /*#__PURE__*/_react.default.createElement(_Item.CustomItem, (0, _extends2.default)({}, props, {
|
|
61
61
|
component: props.component || Container,
|
package/dist/cjs/version.json
CHANGED
|
@@ -12,23 +12,21 @@ const Container = props => {
|
|
|
12
12
|
const Footer = props => {
|
|
13
13
|
const cssFn = overrideStyleFunction(() => ({
|
|
14
14
|
userSelect: 'auto',
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
},
|
|
22
|
-
['[data-item-elem-before]']: {
|
|
15
|
+
display: 'block',
|
|
16
|
+
textAlign: 'center',
|
|
17
|
+
minHeight: '24px',
|
|
18
|
+
alignItems: 'center',
|
|
19
|
+
width: '100%',
|
|
20
|
+
'[data-item-elem-before]': {
|
|
23
21
|
marginRight: 0,
|
|
24
22
|
marginBottom: '8px',
|
|
25
23
|
display: 'inline-block'
|
|
26
24
|
},
|
|
27
|
-
|
|
25
|
+
'[data-item-title]': {
|
|
28
26
|
textAlign: 'center',
|
|
29
27
|
fontSize: 12
|
|
30
28
|
},
|
|
31
|
-
|
|
29
|
+
'[data-item-description]': {
|
|
32
30
|
textAlign: 'center',
|
|
33
31
|
display: 'inline-block',
|
|
34
32
|
margin: '6px'
|
package/dist/es2019/version.json
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
2
|
import React from 'react';
|
|
4
3
|
import { N500 } from '@atlaskit/theme/colors';
|
|
5
4
|
import { token } from '@atlaskit/tokens';
|
|
@@ -12,35 +11,37 @@ var Container = function Container(props) {
|
|
|
12
11
|
|
|
13
12
|
var Footer = function Footer(props) {
|
|
14
13
|
var cssFn = overrideStyleFunction(function () {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
return _ref = {
|
|
14
|
+
return {
|
|
18
15
|
userSelect: 'auto',
|
|
19
|
-
|
|
20
|
-
|
|
16
|
+
display: 'block',
|
|
17
|
+
textAlign: 'center',
|
|
18
|
+
minHeight: '24px',
|
|
19
|
+
alignItems: 'center',
|
|
20
|
+
width: '100%',
|
|
21
|
+
'[data-item-elem-before]': {
|
|
22
|
+
marginRight: 0,
|
|
23
|
+
marginBottom: '8px',
|
|
24
|
+
display: 'inline-block'
|
|
25
|
+
},
|
|
26
|
+
'[data-item-title]': {
|
|
27
|
+
textAlign: 'center',
|
|
28
|
+
fontSize: 12
|
|
29
|
+
},
|
|
30
|
+
'[data-item-description]': {
|
|
21
31
|
textAlign: 'center',
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
32
|
+
display: 'inline-block',
|
|
33
|
+
margin: '6px'
|
|
34
|
+
},
|
|
35
|
+
// Will look interactive if the `component` is anything other than a div.
|
|
36
|
+
'div&:hover': {
|
|
37
|
+
backgroundColor: 'transparent',
|
|
38
|
+
cursor: 'default'
|
|
39
|
+
},
|
|
40
|
+
'div&:active': {
|
|
41
|
+
backgroundColor: 'transparent',
|
|
42
|
+
color: token('color.text.mediumEmphasis', N500)
|
|
25
43
|
}
|
|
26
|
-
}
|
|
27
|
-
marginRight: 0,
|
|
28
|
-
marginBottom: '8px',
|
|
29
|
-
display: 'inline-block'
|
|
30
|
-
}), _defineProperty(_ref, '[data-item-title]', {
|
|
31
|
-
textAlign: 'center',
|
|
32
|
-
fontSize: 12
|
|
33
|
-
}), _defineProperty(_ref, '[data-item-description]', {
|
|
34
|
-
textAlign: 'center',
|
|
35
|
-
display: 'inline-block',
|
|
36
|
-
margin: '6px'
|
|
37
|
-
}), _defineProperty(_ref, 'div&:hover', {
|
|
38
|
-
backgroundColor: 'transparent',
|
|
39
|
-
cursor: 'default'
|
|
40
|
-
}), _defineProperty(_ref, 'div&:active', {
|
|
41
|
-
backgroundColor: 'transparent',
|
|
42
|
-
color: token('color.text.mediumEmphasis', N500)
|
|
43
|
-
}), _ref;
|
|
44
|
+
};
|
|
44
45
|
}, props.cssFn);
|
|
45
46
|
return /*#__PURE__*/React.createElement(CustomItem, _extends({}, props, {
|
|
46
47
|
component: props.component || Container,
|
package/dist/esm/version.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/side-navigation",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.2.0",
|
|
4
4
|
"description": "A highly composable side navigation component that supports nested views.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -25,10 +25,10 @@
|
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"@atlaskit/ds-lib": "^1.1.0",
|
|
27
27
|
"@atlaskit/icon": "^21.9.0",
|
|
28
|
-
"@atlaskit/menu": "^1.
|
|
28
|
+
"@atlaskit/menu": "^1.2.0",
|
|
29
29
|
"@atlaskit/motion": "^1.0.0",
|
|
30
30
|
"@atlaskit/theme": "^12.0.0",
|
|
31
|
-
"@atlaskit/tokens": "^0.
|
|
31
|
+
"@atlaskit/tokens": "^0.3.0",
|
|
32
32
|
"@babel/runtime": "^7.0.0",
|
|
33
33
|
"@emotion/core": "^10.0.9"
|
|
34
34
|
},
|
|
@@ -36,11 +36,11 @@
|
|
|
36
36
|
"react": "^16.8.0"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@atlaskit/atlassian-navigation": "^1.
|
|
39
|
+
"@atlaskit/atlassian-navigation": "^1.2.0",
|
|
40
40
|
"@atlaskit/button": "^16.0.0",
|
|
41
41
|
"@atlaskit/docs": "*",
|
|
42
42
|
"@atlaskit/logo": "^13.5.0",
|
|
43
|
-
"@atlaskit/onboarding": "^10.
|
|
43
|
+
"@atlaskit/onboarding": "^10.3.0",
|
|
44
44
|
"@atlaskit/section-message": "^6.0.0",
|
|
45
45
|
"@atlaskit/select": "^15.2.0",
|
|
46
46
|
"@atlaskit/visual-regression": "*",
|