@atlaskit/side-navigation 11.0.13 → 11.0.15
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 +16 -0
- package/dist/cjs/components/Item/button-item.compiled.css +1 -1
- package/dist/cjs/components/Item/button-item.js +1 -1
- package/dist/cjs/components/Item/custom-item.compiled.css +1 -1
- package/dist/cjs/components/Item/custom-item.js +1 -1
- package/dist/cjs/components/Item/link-item.compiled.css +1 -1
- package/dist/cjs/components/Item/link-item.js +1 -1
- package/dist/cjs/components/NavigationContent/index.compiled.css +2 -2
- package/dist/cjs/components/NavigationContent/index.js +3 -3
- package/dist/cjs/components/NavigationContent/styles.js +4 -4
- package/dist/es2019/components/Item/button-item.compiled.css +1 -1
- package/dist/es2019/components/Item/button-item.js +1 -1
- package/dist/es2019/components/Item/custom-item.compiled.css +1 -1
- package/dist/es2019/components/Item/custom-item.js +1 -1
- package/dist/es2019/components/Item/link-item.compiled.css +1 -1
- package/dist/es2019/components/Item/link-item.js +1 -1
- package/dist/es2019/components/NavigationContent/index.compiled.css +2 -2
- package/dist/es2019/components/NavigationContent/index.js +3 -3
- package/dist/es2019/components/NavigationContent/styles.js +4 -4
- package/dist/esm/components/Item/button-item.compiled.css +1 -1
- package/dist/esm/components/Item/button-item.js +1 -1
- package/dist/esm/components/Item/custom-item.compiled.css +1 -1
- package/dist/esm/components/Item/custom-item.js +1 -1
- package/dist/esm/components/Item/link-item.compiled.css +1 -1
- package/dist/esm/components/Item/link-item.js +1 -1
- package/dist/esm/components/NavigationContent/index.compiled.css +2 -2
- package/dist/esm/components/NavigationContent/index.js +3 -3
- package/dist/esm/components/NavigationContent/styles.js +4 -4
- package/dist/types/components/NavigationContent/styles.d.ts +4 -4
- package/dist/types-ts4.5/components/NavigationContent/styles.d.ts +4 -4
- package/package.json +3 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/side-navigation
|
|
2
2
|
|
|
3
|
+
## 11.0.15
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`255837cfba315`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/255837cfba315) -
|
|
8
|
+
Internal changes to how border radius is applied.
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
11
|
+
## 11.0.14
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [`23bcc5bbc9cee`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/23bcc5bbc9cee) -
|
|
16
|
+
Internal changes to how border radius is applied.
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
3
19
|
## 11.0.13
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -19,7 +19,7 @@ var _context = require("../NestableNavigationContent/context");
|
|
|
19
19
|
var _excluded = ["className"];
|
|
20
20
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
21
21
|
var styles = {
|
|
22
|
-
root: "
|
|
22
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
23
23
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
24
24
|
};
|
|
25
25
|
|
|
@@ -19,7 +19,7 @@ var _context = require("../NestableNavigationContent/context");
|
|
|
19
19
|
var _excluded = ["className"];
|
|
20
20
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
21
21
|
var styles = {
|
|
22
|
-
root: "
|
|
22
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
23
23
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
24
24
|
};
|
|
25
25
|
|
|
@@ -19,7 +19,7 @@ var _context = require("../NestableNavigationContent/context");
|
|
|
19
19
|
var _excluded = ["href", "children", "className"];
|
|
20
20
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
21
21
|
var styles = {
|
|
22
|
-
root: "
|
|
22
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
23
23
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
24
24
|
};
|
|
25
25
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
|
-
.
|
|
3
|
-
.
|
|
2
|
+
._14mjlb4i:after{border-radius:var(--ds-radius-xsmall,2px)}
|
|
3
|
+
._rfx3lb4i:before{border-radius:var(--ds-radius-xsmall,2px)}._12l2u2gc{margin-inline-end:var(--ds-space-100,8px)}
|
|
4
4
|
._18m915vq{overflow-y:hidden}
|
|
5
5
|
._18m91wug{overflow-y:auto}
|
|
6
6
|
._18poh2mm:after{position:relative}
|
|
@@ -15,8 +15,8 @@ var _context = require("../NestableNavigationContent/context");
|
|
|
15
15
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
16
16
|
var outerContainerCSS = null;
|
|
17
17
|
var innerContainerCSS = {
|
|
18
|
-
basic: "_1reo1wug _18m91wug _1e0c1txw _vchhusvi _1bsb1osq _kqswh2mm _2lx21bp4
|
|
19
|
-
topScrollIndicator: "
|
|
18
|
+
basic: "_1reo1wug _18m91wug _1e0c1txw _vchhusvi _1bsb1osq _kqswh2mm _2lx21bp4 _14mjlb4i _1ywu1ule _1qdgyh40 _18poh2mm _1bqqcs5v _tua5idpf _1hfk1q2g _aetrb3bt _3mxo1wug",
|
|
19
|
+
topScrollIndicator: "_rfx3lb4i _cfu11ule _kfgtyh40 _1cs8stnw _1g0vcs5v _1rus1q2g _1kt9b3bt _1enwidpf _z5wtidpf"
|
|
20
20
|
};
|
|
21
21
|
var containerCSS = {
|
|
22
22
|
basic: "_kqswh2mm _12l2u2gc _ahbqu2gc _1pfhidpf _1p3h12x7 _1l6bpxbi _auo4rdoj _hp2110yn",
|
|
@@ -45,7 +45,7 @@ var NavigationContent = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref
|
|
|
45
45
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
46
46
|
ref: typedRef,
|
|
47
47
|
"data-testid": testId,
|
|
48
|
-
className: (0, _runtime.ax)(["_1reo15vq _18m915vq _1e0c1txw _4t3i1osq _kqswh2mm
|
|
48
|
+
className: (0, _runtime.ax)(["_1reo15vq _18m915vq _1e0c1txw _4t3i1osq _kqswh2mm _rfx3lb4i _cfu11ule _kfgtyh40 _1cs8stnw _1g0vkb7n _1rus1x3l _1kt9b3bt _1enwftgi _z5wtu2gc _14mjlb4i _1ywu1ule _1qdgyh40 _18postnw _1bqqkb7n _tua5idpf _1hfk1x3l _aetrb3bt _1gufidpf _1czdftgi _g0nfu2gc"]),
|
|
49
49
|
style: {
|
|
50
50
|
"--_1uyno6z": (0, _runtime.ix)("var(--ds-menu-seperator-color, ".concat("var(--ds-border, #091E4224)", ")"))
|
|
51
51
|
}
|
|
@@ -43,7 +43,7 @@ var outerContainerCSS = exports.outerContainerCSS = function outerContainerCSS(o
|
|
|
43
43
|
left: "var(--ds-space-100, 8px)",
|
|
44
44
|
right: containerPadding + opts.scrollbarWidth,
|
|
45
45
|
height: scrollIndicatorHeight,
|
|
46
|
-
borderRadius: "var(--ds-
|
|
46
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
47
47
|
backgroundColor: "var(".concat(_constants.VAR_SEPARATOR_COLOR, ", ", "var(--ds-border, ".concat(_colors.N30, ")"), ")"),
|
|
48
48
|
position: 'absolute',
|
|
49
49
|
zIndex: scrollIndicatorZIndex
|
|
@@ -52,7 +52,7 @@ var outerContainerCSS = exports.outerContainerCSS = function outerContainerCSS(o
|
|
|
52
52
|
content: "''",
|
|
53
53
|
position: 'absolute',
|
|
54
54
|
display: 'block',
|
|
55
|
-
borderRadius: "var(--ds-
|
|
55
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
56
56
|
flexShrink: 0,
|
|
57
57
|
height: scrollIndicatorHeight,
|
|
58
58
|
left: "var(--ds-space-100, 8px)",
|
|
@@ -79,7 +79,7 @@ var innerContainerCSS = exports.innerContainerCSS = function innerContainerCSS(o
|
|
|
79
79
|
flexDirection: 'column'
|
|
80
80
|
}, !opts.showTopScrollIndicator && {
|
|
81
81
|
'&::before': {
|
|
82
|
-
borderRadius: "var(--ds-
|
|
82
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
83
83
|
content: "''",
|
|
84
84
|
left: 0,
|
|
85
85
|
right: 0,
|
|
@@ -93,7 +93,7 @@ var innerContainerCSS = exports.innerContainerCSS = function innerContainerCSS(o
|
|
|
93
93
|
// This after pseudo element abuses being a flex child and pushes itself down to the
|
|
94
94
|
// very bottom of the container - doing so ends up "masking" the actual scroll indicator.
|
|
95
95
|
'&::after': {
|
|
96
|
-
borderRadius: "var(--ds-
|
|
96
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
97
97
|
content: "''",
|
|
98
98
|
display: 'block',
|
|
99
99
|
flexShrink: 0,
|
|
@@ -8,7 +8,7 @@ import { ButtonItem as Button } from '@atlaskit/menu';
|
|
|
8
8
|
import { B400, B50, N30, N500 } from '@atlaskit/theme/colors';
|
|
9
9
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
10
10
|
const styles = {
|
|
11
|
-
root: "
|
|
11
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
12
12
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
13
13
|
};
|
|
14
14
|
|
|
@@ -8,7 +8,7 @@ import { CustomItem as Custom } from '@atlaskit/menu';
|
|
|
8
8
|
import { B400, B50, N30, N500 } from '@atlaskit/theme/colors';
|
|
9
9
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
10
10
|
const styles = {
|
|
11
|
-
root: "
|
|
11
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
12
12
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
13
13
|
};
|
|
14
14
|
|
|
@@ -8,7 +8,7 @@ import { LinkItem as Link } from '@atlaskit/menu';
|
|
|
8
8
|
import { B400, B50, N30, N500 } from '@atlaskit/theme/colors';
|
|
9
9
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
10
10
|
const styles = {
|
|
11
|
-
root: "
|
|
11
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
12
12
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
13
13
|
};
|
|
14
14
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
|
-
.
|
|
3
|
-
.
|
|
2
|
+
._14mjlb4i:after{border-radius:var(--ds-radius-xsmall,2px)}
|
|
3
|
+
._rfx3lb4i:before{border-radius:var(--ds-radius-xsmall,2px)}._12l2u2gc{margin-inline-end:var(--ds-space-100,8px)}
|
|
4
4
|
._18m915vq{overflow-y:hidden}
|
|
5
5
|
._18m91wug{overflow-y:auto}
|
|
6
6
|
._18poh2mm:after{position:relative}
|
|
@@ -6,8 +6,8 @@ import useScrollbarWidth from '@atlaskit/ds-lib/use-scrollbar-width';
|
|
|
6
6
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
7
7
|
const outerContainerCSS = null;
|
|
8
8
|
const innerContainerCSS = {
|
|
9
|
-
basic: "_1reo1wug _18m91wug _1e0c1txw _vchhusvi _1bsb1osq _kqswh2mm _2lx21bp4
|
|
10
|
-
topScrollIndicator: "
|
|
9
|
+
basic: "_1reo1wug _18m91wug _1e0c1txw _vchhusvi _1bsb1osq _kqswh2mm _2lx21bp4 _14mjlb4i _1ywu1ule _1qdgyh40 _18poh2mm _1bqqcs5v _tua5idpf _1hfk1q2g _aetrb3bt _3mxo1wug",
|
|
10
|
+
topScrollIndicator: "_rfx3lb4i _cfu11ule _kfgtyh40 _1cs8stnw _1g0vcs5v _1rus1q2g _1kt9b3bt _1enwidpf _z5wtidpf"
|
|
11
11
|
};
|
|
12
12
|
const containerCSS = {
|
|
13
13
|
basic: "_kqswh2mm _12l2u2gc _ahbqu2gc _1pfhidpf _1p3h12x7 _1l6bpxbi _auo4rdoj _hp2110yn",
|
|
@@ -39,7 +39,7 @@ const NavigationContent = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
39
39
|
return /*#__PURE__*/React.createElement("div", {
|
|
40
40
|
ref: typedRef,
|
|
41
41
|
"data-testid": testId,
|
|
42
|
-
className: ax(["_1reo15vq _18m915vq _1e0c1txw _4t3i1osq _kqswh2mm
|
|
42
|
+
className: ax(["_1reo15vq _18m915vq _1e0c1txw _4t3i1osq _kqswh2mm _rfx3lb4i _cfu11ule _kfgtyh40 _1cs8stnw _1g0vkb7n _1rus1p09 _1kt9b3bt _1enwftgi _z5wtu2gc _14mjlb4i _1ywu1ule _1qdgyh40 _18postnw _1bqqkb7n _tua5idpf _1hfk1p09 _aetrb3bt _1gufidpf _1czdftgi _g0nfu2gc"])
|
|
43
43
|
}, /*#__PURE__*/React.createElement("div", {
|
|
44
44
|
ref: scrollbar.ref,
|
|
45
45
|
className: ax([innerContainerCSS.basic, !showTopScrollIndicator && innerContainerCSS.topScrollIndicator])
|
|
@@ -32,7 +32,7 @@ export const outerContainerCSS = opts => ({
|
|
|
32
32
|
left: "var(--ds-space-100, 8px)",
|
|
33
33
|
right: containerPadding + opts.scrollbarWidth,
|
|
34
34
|
height: scrollIndicatorHeight,
|
|
35
|
-
borderRadius: `var(--ds-
|
|
35
|
+
borderRadius: `var(--ds-radius-xsmall, ${scrollIndicatorBorderRadius})`,
|
|
36
36
|
backgroundColor: `var(${VAR_SEPARATOR_COLOR}, ${`var(--ds-border, ${N30})`})`,
|
|
37
37
|
position: 'absolute',
|
|
38
38
|
zIndex: scrollIndicatorZIndex
|
|
@@ -41,7 +41,7 @@ export const outerContainerCSS = opts => ({
|
|
|
41
41
|
content: "''",
|
|
42
42
|
position: 'absolute',
|
|
43
43
|
display: 'block',
|
|
44
|
-
borderRadius: `var(--ds-
|
|
44
|
+
borderRadius: `var(--ds-radius-xsmall, ${scrollIndicatorBorderRadius})`,
|
|
45
45
|
flexShrink: 0,
|
|
46
46
|
height: scrollIndicatorHeight,
|
|
47
47
|
left: "var(--ds-space-100, 8px)",
|
|
@@ -68,7 +68,7 @@ export const innerContainerCSS = opts => ({
|
|
|
68
68
|
// container - so when you scroll down it stops "masking" the actual scroll indicator.
|
|
69
69
|
...(!opts.showTopScrollIndicator && {
|
|
70
70
|
'&::before': {
|
|
71
|
-
borderRadius: `var(--ds-
|
|
71
|
+
borderRadius: `var(--ds-radius-xsmall, ${scrollIndicatorBorderRadius})`,
|
|
72
72
|
content: "''",
|
|
73
73
|
left: 0,
|
|
74
74
|
right: 0,
|
|
@@ -82,7 +82,7 @@ export const innerContainerCSS = opts => ({
|
|
|
82
82
|
// This after pseudo element abuses being a flex child and pushes itself down to the
|
|
83
83
|
// very bottom of the container - doing so ends up "masking" the actual scroll indicator.
|
|
84
84
|
'&::after': {
|
|
85
|
-
borderRadius: `var(--ds-
|
|
85
|
+
borderRadius: `var(--ds-radius-xsmall, ${scrollIndicatorBorderRadius})`,
|
|
86
86
|
content: "''",
|
|
87
87
|
display: 'block',
|
|
88
88
|
flexShrink: 0,
|
|
@@ -10,7 +10,7 @@ import { ButtonItem as Button } from '@atlaskit/menu';
|
|
|
10
10
|
import { B400, B50, N30, N500 } from '@atlaskit/theme/colors';
|
|
11
11
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
12
12
|
var styles = {
|
|
13
|
-
root: "
|
|
13
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
14
14
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
15
15
|
};
|
|
16
16
|
|
|
@@ -10,7 +10,7 @@ import { CustomItem as Custom } from '@atlaskit/menu';
|
|
|
10
10
|
import { B400, B50, N30, N500 } from '@atlaskit/theme/colors';
|
|
11
11
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
12
12
|
var styles = {
|
|
13
|
-
root: "
|
|
13
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
14
14
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
15
15
|
};
|
|
16
16
|
|
|
@@ -10,7 +10,7 @@ import { LinkItem as Link } from '@atlaskit/menu';
|
|
|
10
10
|
import { B400, B50, N30, N500 } from '@atlaskit/theme/colors';
|
|
11
11
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
12
12
|
var styles = {
|
|
13
|
-
root: "
|
|
13
|
+
root: "_2rkofajl _1rjcu2gc _18zru2gc _bfhkqtfy _1a391k8s _racp1k8s _30l3jjyb _irr314ae _ppn2dud1 _183j1l7b",
|
|
14
14
|
selectedStyles: "_bfhkbal5 _syaz1ldt _10531ldt _irr31gf2 _30l31pwi _1di61elt _9h8h1ldt"
|
|
15
15
|
};
|
|
16
16
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
|
-
.
|
|
3
|
-
.
|
|
2
|
+
._14mjlb4i:after{border-radius:var(--ds-radius-xsmall,2px)}
|
|
3
|
+
._rfx3lb4i:before{border-radius:var(--ds-radius-xsmall,2px)}._12l2u2gc{margin-inline-end:var(--ds-space-100,8px)}
|
|
4
4
|
._18m915vq{overflow-y:hidden}
|
|
5
5
|
._18m91wug{overflow-y:auto}
|
|
6
6
|
._18poh2mm:after{position:relative}
|
|
@@ -6,8 +6,8 @@ import useScrollbarWidth from '@atlaskit/ds-lib/use-scrollbar-width';
|
|
|
6
6
|
import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
|
|
7
7
|
var outerContainerCSS = null;
|
|
8
8
|
var innerContainerCSS = {
|
|
9
|
-
basic: "_1reo1wug _18m91wug _1e0c1txw _vchhusvi _1bsb1osq _kqswh2mm _2lx21bp4
|
|
10
|
-
topScrollIndicator: "
|
|
9
|
+
basic: "_1reo1wug _18m91wug _1e0c1txw _vchhusvi _1bsb1osq _kqswh2mm _2lx21bp4 _14mjlb4i _1ywu1ule _1qdgyh40 _18poh2mm _1bqqcs5v _tua5idpf _1hfk1q2g _aetrb3bt _3mxo1wug",
|
|
10
|
+
topScrollIndicator: "_rfx3lb4i _cfu11ule _kfgtyh40 _1cs8stnw _1g0vcs5v _1rus1q2g _1kt9b3bt _1enwidpf _z5wtidpf"
|
|
11
11
|
};
|
|
12
12
|
var containerCSS = {
|
|
13
13
|
basic: "_kqswh2mm _12l2u2gc _ahbqu2gc _1pfhidpf _1p3h12x7 _1l6bpxbi _auo4rdoj _hp2110yn",
|
|
@@ -36,7 +36,7 @@ var NavigationContent = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
36
36
|
return /*#__PURE__*/React.createElement("div", {
|
|
37
37
|
ref: typedRef,
|
|
38
38
|
"data-testid": testId,
|
|
39
|
-
className: ax(["_1reo15vq _18m915vq _1e0c1txw _4t3i1osq _kqswh2mm
|
|
39
|
+
className: ax(["_1reo15vq _18m915vq _1e0c1txw _4t3i1osq _kqswh2mm _rfx3lb4i _cfu11ule _kfgtyh40 _1cs8stnw _1g0vkb7n _1rus1x3l _1kt9b3bt _1enwftgi _z5wtu2gc _14mjlb4i _1ywu1ule _1qdgyh40 _18postnw _1bqqkb7n _tua5idpf _1hfk1x3l _aetrb3bt _1gufidpf _1czdftgi _g0nfu2gc"]),
|
|
40
40
|
style: {
|
|
41
41
|
"--_1uyno6z": ix("var(--ds-menu-seperator-color, ".concat("var(--ds-border, #091E4224)", ")"))
|
|
42
42
|
}
|
|
@@ -36,7 +36,7 @@ export var outerContainerCSS = function outerContainerCSS(opts) {
|
|
|
36
36
|
left: "var(--ds-space-100, 8px)",
|
|
37
37
|
right: containerPadding + opts.scrollbarWidth,
|
|
38
38
|
height: scrollIndicatorHeight,
|
|
39
|
-
borderRadius: "var(--ds-
|
|
39
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
40
40
|
backgroundColor: "var(".concat(VAR_SEPARATOR_COLOR, ", ", "var(--ds-border, ".concat(N30, ")"), ")"),
|
|
41
41
|
position: 'absolute',
|
|
42
42
|
zIndex: scrollIndicatorZIndex
|
|
@@ -45,7 +45,7 @@ export var outerContainerCSS = function outerContainerCSS(opts) {
|
|
|
45
45
|
content: "''",
|
|
46
46
|
position: 'absolute',
|
|
47
47
|
display: 'block',
|
|
48
|
-
borderRadius: "var(--ds-
|
|
48
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
49
49
|
flexShrink: 0,
|
|
50
50
|
height: scrollIndicatorHeight,
|
|
51
51
|
left: "var(--ds-space-100, 8px)",
|
|
@@ -72,7 +72,7 @@ export var innerContainerCSS = function innerContainerCSS(opts) {
|
|
|
72
72
|
flexDirection: 'column'
|
|
73
73
|
}, !opts.showTopScrollIndicator && {
|
|
74
74
|
'&::before': {
|
|
75
|
-
borderRadius: "var(--ds-
|
|
75
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
76
76
|
content: "''",
|
|
77
77
|
left: 0,
|
|
78
78
|
right: 0,
|
|
@@ -86,7 +86,7 @@ export var innerContainerCSS = function innerContainerCSS(opts) {
|
|
|
86
86
|
// This after pseudo element abuses being a flex child and pushes itself down to the
|
|
87
87
|
// very bottom of the container - doing so ends up "masking" the actual scroll indicator.
|
|
88
88
|
'&::after': {
|
|
89
|
-
borderRadius: "var(--ds-
|
|
89
|
+
borderRadius: "var(--ds-radius-xsmall, ".concat(scrollIndicatorBorderRadius, ")"),
|
|
90
90
|
content: "''",
|
|
91
91
|
display: 'block',
|
|
92
92
|
flexShrink: 0,
|
|
@@ -20,7 +20,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
|
|
|
20
20
|
readonly left: "var(--ds-space-100)";
|
|
21
21
|
readonly right: number;
|
|
22
22
|
readonly height: 2;
|
|
23
|
-
readonly borderRadius: "var(--ds-
|
|
23
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
24
24
|
readonly backgroundColor: "var(--ds-menu-seperator-color, var(--ds-border))";
|
|
25
25
|
readonly position: "absolute";
|
|
26
26
|
readonly zIndex: 1;
|
|
@@ -29,7 +29,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
|
|
|
29
29
|
readonly content: "''";
|
|
30
30
|
readonly position: "absolute";
|
|
31
31
|
readonly display: "block";
|
|
32
|
-
readonly borderRadius: "var(--ds-
|
|
32
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
33
33
|
readonly flexShrink: 0;
|
|
34
34
|
readonly height: 2;
|
|
35
35
|
readonly left: "var(--ds-space-100)";
|
|
@@ -46,7 +46,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
|
|
|
46
46
|
*/
|
|
47
47
|
export declare const innerContainerCSS: (opts: StyleOpts) => {
|
|
48
48
|
readonly '&::after': {
|
|
49
|
-
readonly borderRadius: "var(--ds-
|
|
49
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
50
50
|
readonly content: "''";
|
|
51
51
|
readonly display: "block";
|
|
52
52
|
readonly flexShrink: 0;
|
|
@@ -57,7 +57,7 @@ export declare const innerContainerCSS: (opts: StyleOpts) => {
|
|
|
57
57
|
readonly backgroundColor: "var(--ds-menu-scroll-indicator-color, var(--ds-surface))";
|
|
58
58
|
};
|
|
59
59
|
readonly '&::before'?: {
|
|
60
|
-
readonly borderRadius: "var(--ds-
|
|
60
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
61
61
|
readonly content: "''";
|
|
62
62
|
readonly left: 0;
|
|
63
63
|
readonly right: 0;
|
|
@@ -20,7 +20,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
|
|
|
20
20
|
readonly left: "var(--ds-space-100)";
|
|
21
21
|
readonly right: number;
|
|
22
22
|
readonly height: 2;
|
|
23
|
-
readonly borderRadius: "var(--ds-
|
|
23
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
24
24
|
readonly backgroundColor: "var(--ds-menu-seperator-color, var(--ds-border))";
|
|
25
25
|
readonly position: "absolute";
|
|
26
26
|
readonly zIndex: 1;
|
|
@@ -29,7 +29,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
|
|
|
29
29
|
readonly content: "''";
|
|
30
30
|
readonly position: "absolute";
|
|
31
31
|
readonly display: "block";
|
|
32
|
-
readonly borderRadius: "var(--ds-
|
|
32
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
33
33
|
readonly flexShrink: 0;
|
|
34
34
|
readonly height: 2;
|
|
35
35
|
readonly left: "var(--ds-space-100)";
|
|
@@ -46,7 +46,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
|
|
|
46
46
|
*/
|
|
47
47
|
export declare const innerContainerCSS: (opts: StyleOpts) => {
|
|
48
48
|
readonly '&::after': {
|
|
49
|
-
readonly borderRadius: "var(--ds-
|
|
49
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
50
50
|
readonly content: "''";
|
|
51
51
|
readonly display: "block";
|
|
52
52
|
readonly flexShrink: 0;
|
|
@@ -57,7 +57,7 @@ export declare const innerContainerCSS: (opts: StyleOpts) => {
|
|
|
57
57
|
readonly backgroundColor: "var(--ds-menu-scroll-indicator-color, var(--ds-surface))";
|
|
58
58
|
};
|
|
59
59
|
readonly '&::before'?: {
|
|
60
|
-
readonly borderRadius: "var(--ds-
|
|
60
|
+
readonly borderRadius: "var(--ds-radius-xsmall)";
|
|
61
61
|
readonly content: "''";
|
|
62
62
|
readonly left: 0;
|
|
63
63
|
readonly right: 0;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/side-navigation",
|
|
3
|
-
"version": "11.0.
|
|
3
|
+
"version": "11.0.15",
|
|
4
4
|
"description": "A highly composable side navigation component that supports nested views.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -16,9 +16,6 @@
|
|
|
16
16
|
"**/*.compiled.css"
|
|
17
17
|
],
|
|
18
18
|
"atlaskit:src": "src/index.tsx",
|
|
19
|
-
"af:exports": {
|
|
20
|
-
".": "./src/index.tsx"
|
|
21
|
-
},
|
|
22
19
|
"atlassian": {
|
|
23
20
|
"team": "Design System Team",
|
|
24
21
|
"website": {
|
|
@@ -54,7 +51,7 @@
|
|
|
54
51
|
"@atlaskit/button": "^23.4.0",
|
|
55
52
|
"@atlaskit/docs": "^11.0.0",
|
|
56
53
|
"@atlaskit/dropdown-menu": "^16.3.0",
|
|
57
|
-
"@atlaskit/form": "^12.
|
|
54
|
+
"@atlaskit/form": "^12.4.0",
|
|
58
55
|
"@atlaskit/image": "^3.0.0",
|
|
59
56
|
"@atlaskit/link": "^3.2.0",
|
|
60
57
|
"@atlaskit/logo": "^19.7.0",
|
|
@@ -63,7 +60,7 @@
|
|
|
63
60
|
"@atlaskit/pragmatic-drag-and-drop-live-region": "^1.3.0",
|
|
64
61
|
"@atlaskit/pragmatic-drag-and-drop-react-accessibility": "^2.1.0",
|
|
65
62
|
"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
|
|
66
|
-
"@atlaskit/section-message": "^8.
|
|
63
|
+
"@atlaskit/section-message": "^8.7.0",
|
|
67
64
|
"@atlaskit/select": "^21.2.0",
|
|
68
65
|
"@testing-library/react": "^13.4.0",
|
|
69
66
|
"raf-stub": "^2.0.1",
|