@atlaskit/side-navigation 2.0.1 → 2.0.3
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 +13 -0
- package/dist/cjs/common/styles.js +2 -2
- package/dist/cjs/components/Header/index.js +8 -10
- package/dist/cjs/components/Item/skeleton-item.js +2 -2
- package/dist/cjs/components/NavigationContent/styles.js +2 -2
- package/dist/cjs/components/NavigationFooter/index.js +4 -4
- package/dist/cjs/components/NestableNavigationContent/nesting-motion.js +2 -2
- package/dist/cjs/components/NestingItem/index.js +2 -2
- package/dist/cjs/components/NestingItem/styles.js +2 -2
- package/dist/cjs/components/Section/skeleton-heading-item.js +2 -2
- package/dist/es2019/components/Header/index.js +8 -7
- package/dist/es2019/components/NavigationFooter/index.js +3 -4
- package/dist/esm/common/styles.js +2 -2
- package/dist/esm/components/Header/index.js +8 -7
- package/dist/esm/components/Item/skeleton-item.js +2 -2
- package/dist/esm/components/NavigationContent/styles.js +2 -2
- package/dist/esm/components/NavigationFooter/index.js +3 -4
- package/dist/esm/components/NestableNavigationContent/nesting-motion.js +2 -2
- package/dist/esm/components/NestingItem/index.js +2 -2
- package/dist/esm/components/NestingItem/styles.js +2 -2
- package/dist/esm/components/Section/skeleton-heading-item.js +2 -2
- package/dist/types/components/Header/index.d.ts +4 -3
- package/dist/types/components/NavigationFooter/index.d.ts +1 -3
- package/dist/types-ts4.5/components/Header/index.d.ts +4 -3
- package/dist/types-ts4.5/components/NavigationFooter/index.d.ts +1 -3
- package/package.json +5 -5
- package/report.api.md +7 -7
- package/tmp/api-report-tmp.d.ts +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @atlaskit/side-navigation
|
|
2
2
|
|
|
3
|
+
## 2.0.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`e3b28897c5f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e3b28897c5f) - Internal code changes. There is no expected change in behaviour.
|
|
8
|
+
- Updated dependencies
|
|
9
|
+
|
|
10
|
+
## 2.0.2
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- [`bff06efcf86`](https://bitbucket.org/atlassian/atlassian-frontend/commits/bff06efcf86) - Fix a bug where `className` was not being applied to Header.
|
|
15
|
+
|
|
3
16
|
## 2.0.1
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
|
@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.sectionHeaderSpacingStyles = exports.overrideStyleFunction = exports.baseSideNavItemStyle = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _colors = require("@atlaskit/theme/colors");
|
|
10
|
-
function ownKeys(
|
|
11
|
-
function _objectSpread(
|
|
10
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
11
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
12
12
|
/**
|
|
13
13
|
* Allows chaining of style functions on top of base style functions
|
|
14
14
|
* @param baseStyle the base custom cssFn
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
@@ -9,17 +8,16 @@ exports.default = exports.Container = void 0;
|
|
|
9
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
10
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
12
|
-
var _react =
|
|
13
|
-
var
|
|
11
|
+
var _react = require("react");
|
|
12
|
+
var _react2 = require("@emotion/react");
|
|
14
13
|
var _colors = require("@atlaskit/theme/colors");
|
|
15
14
|
var _typography = require("@atlaskit/theme/typography");
|
|
16
15
|
var _styles = require("../../common/styles");
|
|
17
16
|
var _Item = require("../Item");
|
|
18
17
|
var _excluded = ["children"],
|
|
19
18
|
_excluded2 = ["children"];
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
var containerStyles = (0, _primitives.xcss)({
|
|
19
|
+
/** @jsx jsx */
|
|
20
|
+
var containerStyles = (0, _react2.css)({
|
|
23
21
|
display: 'block',
|
|
24
22
|
position: 'relative'
|
|
25
23
|
});
|
|
@@ -55,8 +53,8 @@ var Container = function Container(_ref) {
|
|
|
55
53
|
disabled: disabled
|
|
56
54
|
};
|
|
57
55
|
}(props);
|
|
58
|
-
return
|
|
59
|
-
|
|
56
|
+
return (0, _react2.jsx)("div", (0, _extends2.default)({
|
|
57
|
+
css: containerStyles
|
|
60
58
|
}, safeProps), children);
|
|
61
59
|
};
|
|
62
60
|
exports.Container = Container;
|
|
@@ -84,7 +82,7 @@ var Header = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
84
82
|
color: "var(--ds-text, ".concat(_colors.N500, ")")
|
|
85
83
|
}), _ref3;
|
|
86
84
|
}, props.cssFn);
|
|
87
|
-
return
|
|
85
|
+
return (0, _react2.jsx)(_Item.CustomItem, (0, _extends2.default)({}, props, {
|
|
88
86
|
ref: ref,
|
|
89
87
|
component: props.component || Container
|
|
90
88
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
@@ -97,7 +95,7 @@ var Header = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
97
95
|
render: function render(_, _ref4) {
|
|
98
96
|
var children = _ref4.children,
|
|
99
97
|
props = (0, _objectWithoutProperties2.default)(_ref4, _excluded2);
|
|
100
|
-
return
|
|
98
|
+
return (0, _react2.jsx)("h2", props, children);
|
|
101
99
|
}
|
|
102
100
|
}
|
|
103
101
|
}
|
|
@@ -11,8 +11,8 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
11
11
|
var _menu = require("@atlaskit/menu");
|
|
12
12
|
var _styles = require("../../common/styles");
|
|
13
13
|
var _context = require("../NestableNavigationContent/context");
|
|
14
|
-
function ownKeys(
|
|
15
|
-
function _objectSpread(
|
|
14
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
15
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
16
16
|
/**
|
|
17
17
|
* __Skeleton item__
|
|
18
18
|
*
|
|
@@ -9,8 +9,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
|
|
|
9
9
|
var _colors = require("@atlaskit/theme/colors");
|
|
10
10
|
var _typography = require("@atlaskit/theme/typography");
|
|
11
11
|
var _constants = require("../../common/constants");
|
|
12
|
-
function ownKeys(
|
|
13
|
-
function _objectSpread(
|
|
12
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
13
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
14
14
|
var scrollIndicatorMaskZIndex = 2;
|
|
15
15
|
var scrollIndicatorZIndex = 1;
|
|
16
16
|
var scrollIndicatorHeight = 2;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
7
|
exports.default = void 0;
|
|
7
|
-
var _react = require("
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
9
|
var _primitives = require("@atlaskit/primitives");
|
|
9
|
-
/** @jsx jsx */
|
|
10
|
-
|
|
11
10
|
var navigationFooterStyles = (0, _primitives.xcss)({
|
|
12
11
|
position: 'relative'
|
|
13
12
|
});
|
|
13
|
+
|
|
14
14
|
/**
|
|
15
15
|
* __Navigation footer__
|
|
16
16
|
*
|
|
@@ -21,7 +21,7 @@ var navigationFooterStyles = (0, _primitives.xcss)({
|
|
|
21
21
|
*/
|
|
22
22
|
var NavigationFooter = function NavigationFooter(_ref) {
|
|
23
23
|
var children = _ref.children;
|
|
24
|
-
return
|
|
24
|
+
return /*#__PURE__*/_react.default.createElement(_primitives.Box, {
|
|
25
25
|
padding: "space.100",
|
|
26
26
|
paddingBlockEnd: "space.200",
|
|
27
27
|
xcss: navigationFooterStyles
|
|
@@ -8,8 +8,8 @@ exports.NestingMotion = void 0;
|
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _react = require("@emotion/react");
|
|
10
10
|
var _motion = require("@atlaskit/motion");
|
|
11
|
-
function ownKeys(
|
|
12
|
-
function _objectSpread(
|
|
11
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
12
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /** @jsx jsx */
|
|
13
13
|
/**
|
|
14
14
|
* @internal
|
|
15
15
|
*/
|
|
@@ -26,8 +26,8 @@ var _excluded = ["children", "iconAfter", "title", "onClick", "cssFn", "isSelect
|
|
|
26
26
|
/** @jsx jsx */
|
|
27
27
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
28
28
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
29
|
-
function ownKeys(
|
|
30
|
-
function _objectSpread(
|
|
29
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
30
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
31
31
|
var iconContainerStyles = (0, _primitives.xcss)({
|
|
32
32
|
display: 'inline'
|
|
33
33
|
});
|
|
@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.nestingItemStyle = exports.enabledCSS = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _enabledCSS, _disabledCSS;
|
|
10
|
-
function ownKeys(
|
|
11
|
-
function _objectSpread(
|
|
10
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
11
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
12
12
|
// exposed for testing purposes
|
|
13
13
|
var enabledCSS = (_enabledCSS = {}, (0, _defineProperty2.default)(_enabledCSS, '&:hover [data-custom-icon]', {
|
|
14
14
|
display: 'none'
|
|
@@ -11,8 +11,8 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
11
11
|
var _menu = require("@atlaskit/menu");
|
|
12
12
|
var _styles = require("../../common/styles");
|
|
13
13
|
var _context = require("../NestableNavigationContent/context");
|
|
14
|
-
function ownKeys(
|
|
15
|
-
function _objectSpread(
|
|
14
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
15
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
16
16
|
/**
|
|
17
17
|
* __Skeleton heading item__
|
|
18
18
|
*
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
|
|
3
|
-
import {
|
|
2
|
+
/** @jsx jsx */
|
|
3
|
+
import { forwardRef } from 'react';
|
|
4
|
+
import { css, jsx } from '@emotion/react';
|
|
4
5
|
import { N500 } from '@atlaskit/theme/colors';
|
|
5
6
|
import { headingSizes } from '@atlaskit/theme/typography';
|
|
6
7
|
import { overrideStyleFunction } from '../../common/styles';
|
|
7
8
|
import { CustomItem } from '../Item';
|
|
8
|
-
const containerStyles =
|
|
9
|
+
const containerStyles = css({
|
|
9
10
|
display: 'block',
|
|
10
11
|
position: 'relative'
|
|
11
12
|
});
|
|
@@ -41,8 +42,8 @@ export const Container = ({
|
|
|
41
42
|
tabIndex,
|
|
42
43
|
disabled
|
|
43
44
|
}))(props);
|
|
44
|
-
return
|
|
45
|
-
|
|
45
|
+
return jsx("div", _extends({
|
|
46
|
+
css: containerStyles
|
|
46
47
|
}, safeProps), children);
|
|
47
48
|
};
|
|
48
49
|
/**
|
|
@@ -70,7 +71,7 @@ const Header = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
70
71
|
color: `var(--ds-text, ${N500})`
|
|
71
72
|
}
|
|
72
73
|
}), props.cssFn);
|
|
73
|
-
return
|
|
74
|
+
return jsx(CustomItem, _extends({}, props, {
|
|
74
75
|
ref: ref,
|
|
75
76
|
component: props.component || Container
|
|
76
77
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
@@ -83,7 +84,7 @@ const Header = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
83
84
|
render: (_, {
|
|
84
85
|
children,
|
|
85
86
|
...props
|
|
86
|
-
}) =>
|
|
87
|
+
}) => jsx("h2", props, children)
|
|
87
88
|
}
|
|
88
89
|
}
|
|
89
90
|
}));
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { jsx } from '@emotion/react';
|
|
1
|
+
import React from 'react';
|
|
4
2
|
import { Box, xcss } from '@atlaskit/primitives';
|
|
5
3
|
const navigationFooterStyles = xcss({
|
|
6
4
|
position: 'relative'
|
|
7
5
|
});
|
|
6
|
+
|
|
8
7
|
/**
|
|
9
8
|
* __Navigation footer__
|
|
10
9
|
*
|
|
@@ -16,7 +15,7 @@ const navigationFooterStyles = xcss({
|
|
|
16
15
|
const NavigationFooter = ({
|
|
17
16
|
children
|
|
18
17
|
}) => {
|
|
19
|
-
return
|
|
18
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
20
19
|
padding: "space.100",
|
|
21
20
|
paddingBlockEnd: "space.200",
|
|
22
21
|
xcss: navigationFooterStyles
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
function ownKeys(
|
|
3
|
-
function _objectSpread(
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
4
|
import { B400, B50, N30, N500 } from '@atlaskit/theme/colors';
|
|
5
5
|
/**
|
|
6
6
|
* Allows chaining of style functions on top of base style functions
|
|
@@ -3,13 +3,14 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
3
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
4
|
var _excluded = ["children"],
|
|
5
5
|
_excluded2 = ["children"];
|
|
6
|
-
|
|
7
|
-
import {
|
|
6
|
+
/** @jsx jsx */
|
|
7
|
+
import { forwardRef } from 'react';
|
|
8
|
+
import { css, jsx } from '@emotion/react';
|
|
8
9
|
import { N500 } from '@atlaskit/theme/colors';
|
|
9
10
|
import { headingSizes } from '@atlaskit/theme/typography';
|
|
10
11
|
import { overrideStyleFunction } from '../../common/styles';
|
|
11
12
|
import { CustomItem } from '../Item';
|
|
12
|
-
var containerStyles =
|
|
13
|
+
var containerStyles = css({
|
|
13
14
|
display: 'block',
|
|
14
15
|
position: 'relative'
|
|
15
16
|
});
|
|
@@ -45,8 +46,8 @@ export var Container = function Container(_ref) {
|
|
|
45
46
|
disabled: disabled
|
|
46
47
|
};
|
|
47
48
|
}(props);
|
|
48
|
-
return
|
|
49
|
-
|
|
49
|
+
return jsx("div", _extends({
|
|
50
|
+
css: containerStyles
|
|
50
51
|
}, safeProps), children);
|
|
51
52
|
};
|
|
52
53
|
/**
|
|
@@ -73,7 +74,7 @@ var Header = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
73
74
|
color: "var(--ds-text, ".concat(N500, ")")
|
|
74
75
|
}), _ref3;
|
|
75
76
|
}, props.cssFn);
|
|
76
|
-
return
|
|
77
|
+
return jsx(CustomItem, _extends({}, props, {
|
|
77
78
|
ref: ref,
|
|
78
79
|
component: props.component || Container
|
|
79
80
|
// eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
|
|
@@ -86,7 +87,7 @@ var Header = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
86
87
|
render: function render(_, _ref4) {
|
|
87
88
|
var children = _ref4.children,
|
|
88
89
|
props = _objectWithoutProperties(_ref4, _excluded2);
|
|
89
|
-
return
|
|
90
|
+
return jsx("h2", props, children);
|
|
90
91
|
}
|
|
91
92
|
}
|
|
92
93
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
-
function ownKeys(
|
|
4
|
-
function _objectSpread(
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
5
|
import React from 'react';
|
|
6
6
|
import { SkeletonItem as SkelItem } from '@atlaskit/menu';
|
|
7
7
|
import { sectionHeaderSpacingStyles } from '../../common/styles';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
function ownKeys(
|
|
3
|
-
function _objectSpread(
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
4
|
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
5
5
|
import { N10, N30 } from '@atlaskit/theme/colors';
|
|
6
6
|
import { headingSizes } from '@atlaskit/theme/typography';
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { jsx } from '@emotion/react';
|
|
1
|
+
import React from 'react';
|
|
4
2
|
import { Box, xcss } from '@atlaskit/primitives';
|
|
5
3
|
var navigationFooterStyles = xcss({
|
|
6
4
|
position: 'relative'
|
|
7
5
|
});
|
|
6
|
+
|
|
8
7
|
/**
|
|
9
8
|
* __Navigation footer__
|
|
10
9
|
*
|
|
@@ -15,7 +14,7 @@ var navigationFooterStyles = xcss({
|
|
|
15
14
|
*/
|
|
16
15
|
var NavigationFooter = function NavigationFooter(_ref) {
|
|
17
16
|
var children = _ref.children;
|
|
18
|
-
return
|
|
17
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
19
18
|
padding: "space.100",
|
|
20
19
|
paddingBlockEnd: "space.200",
|
|
21
20
|
xcss: navigationFooterStyles
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
function ownKeys(
|
|
3
|
-
function _objectSpread(
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
4
|
/** @jsx jsx */
|
|
5
5
|
|
|
6
6
|
import { jsx } from '@emotion/react';
|
|
@@ -4,8 +4,8 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
|
4
4
|
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
5
5
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
6
6
|
var _excluded = ["children", "iconAfter", "title", "onClick", "cssFn", "isSelected", "id", "component", "testId"];
|
|
7
|
-
function ownKeys(
|
|
8
|
-
function _objectSpread(
|
|
7
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
8
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
9
9
|
/** @jsx jsx */
|
|
10
10
|
import React, { Fragment, useCallback, useMemo, useState } from 'react';
|
|
11
11
|
import { jsx } from '@emotion/react';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
var _enabledCSS, _disabledCSS;
|
|
3
|
-
function ownKeys(
|
|
4
|
-
function _objectSpread(
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
5
|
// exposed for testing purposes
|
|
6
6
|
export var enabledCSS = (_enabledCSS = {}, _defineProperty(_enabledCSS, '&:hover [data-custom-icon]', {
|
|
7
7
|
display: 'none'
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
-
function ownKeys(
|
|
4
|
-
function _objectSpread(
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
5
|
import React from 'react';
|
|
6
6
|
import { SkeletonHeadingItem as MenuSkeletonHeadingItem } from '@atlaskit/menu';
|
|
7
7
|
import { sectionHeaderSpacingStyles } from '../../common/styles';
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { jsx } from '@emotion/react';
|
|
2
3
|
import { CSSFn, CustomItemComponentProps } from '@atlaskit/menu';
|
|
3
4
|
/**
|
|
4
5
|
* __Container__
|
|
5
6
|
*
|
|
6
7
|
* A container for Header and Footer that safely handles props to the child component
|
|
7
8
|
*/
|
|
8
|
-
export declare const Container: ({ children, ...props }: CustomItemComponentProps) => JSX.Element;
|
|
9
|
+
export declare const Container: ({ children, ...props }: CustomItemComponentProps) => jsx.JSX.Element;
|
|
9
10
|
export type HeaderProps = {
|
|
10
11
|
/**
|
|
11
12
|
* A function that can be used to override the styles of the component.
|
|
@@ -51,5 +52,5 @@ export type HeaderProps = {
|
|
|
51
52
|
* - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
|
|
52
53
|
* - [Code](https://atlassian.design/components/side-navigation/code)
|
|
53
54
|
*/
|
|
54
|
-
declare const Header:
|
|
55
|
+
declare const Header: import("react").ForwardRefExoticComponent<HeaderProps & import("react").RefAttributes<HTMLElement>>;
|
|
55
56
|
export default Header;
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
/** @jsx jsx */
|
|
2
1
|
import { ReactNode } from 'react';
|
|
3
|
-
import { jsx } from '@emotion/react';
|
|
4
2
|
export interface NavigationFooterProps {
|
|
5
3
|
children: ReactNode;
|
|
6
4
|
}
|
|
@@ -12,5 +10,5 @@ export interface NavigationFooterProps {
|
|
|
12
10
|
* - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
|
|
13
11
|
* - [Code](https://atlassian.design/components/side-navigation/code)
|
|
14
12
|
*/
|
|
15
|
-
declare const NavigationFooter: ({ children }: NavigationFooterProps) =>
|
|
13
|
+
declare const NavigationFooter: ({ children }: NavigationFooterProps) => JSX.Element;
|
|
16
14
|
export default NavigationFooter;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { jsx } from '@emotion/react';
|
|
2
3
|
import { CSSFn, CustomItemComponentProps } from '@atlaskit/menu';
|
|
3
4
|
/**
|
|
4
5
|
* __Container__
|
|
5
6
|
*
|
|
6
7
|
* A container for Header and Footer that safely handles props to the child component
|
|
7
8
|
*/
|
|
8
|
-
export declare const Container: ({ children, ...props }: CustomItemComponentProps) => JSX.Element;
|
|
9
|
+
export declare const Container: ({ children, ...props }: CustomItemComponentProps) => jsx.JSX.Element;
|
|
9
10
|
export type HeaderProps = {
|
|
10
11
|
/**
|
|
11
12
|
* A function that can be used to override the styles of the component.
|
|
@@ -51,5 +52,5 @@ export type HeaderProps = {
|
|
|
51
52
|
* - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
|
|
52
53
|
* - [Code](https://atlassian.design/components/side-navigation/code)
|
|
53
54
|
*/
|
|
54
|
-
declare const Header:
|
|
55
|
+
declare const Header: import("react").ForwardRefExoticComponent<HeaderProps & import("react").RefAttributes<HTMLElement>>;
|
|
55
56
|
export default Header;
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
/** @jsx jsx */
|
|
2
1
|
import { ReactNode } from 'react';
|
|
3
|
-
import { jsx } from '@emotion/react';
|
|
4
2
|
export interface NavigationFooterProps {
|
|
5
3
|
children: ReactNode;
|
|
6
4
|
}
|
|
@@ -12,5 +10,5 @@ export interface NavigationFooterProps {
|
|
|
12
10
|
* - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
|
|
13
11
|
* - [Code](https://atlassian.design/components/side-navigation/code)
|
|
14
12
|
*/
|
|
15
|
-
declare const NavigationFooter: ({ children }: NavigationFooterProps) =>
|
|
13
|
+
declare const NavigationFooter: ({ children }: NavigationFooterProps) => JSX.Element;
|
|
16
14
|
export default NavigationFooter;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/side-navigation",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.3",
|
|
4
4
|
"description": "A highly composable side navigation component that supports nested views.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -35,11 +35,11 @@
|
|
|
35
35
|
"@atlaskit/ds-explorations": "^2.2.0",
|
|
36
36
|
"@atlaskit/ds-lib": "^2.2.0",
|
|
37
37
|
"@atlaskit/icon": "^21.12.0",
|
|
38
|
-
"@atlaskit/menu": "^1.
|
|
38
|
+
"@atlaskit/menu": "^1.10.0",
|
|
39
39
|
"@atlaskit/motion": "^1.4.0",
|
|
40
|
-
"@atlaskit/primitives": "^1.
|
|
41
|
-
"@atlaskit/theme": "^12.
|
|
42
|
-
"@atlaskit/tokens": "^1.
|
|
40
|
+
"@atlaskit/primitives": "^1.3.0",
|
|
41
|
+
"@atlaskit/theme": "^12.6.0",
|
|
42
|
+
"@atlaskit/tokens": "^1.18.0",
|
|
43
43
|
"@babel/runtime": "^7.0.0",
|
|
44
44
|
"@emotion/react": "^11.7.1"
|
|
45
45
|
},
|
package/report.api.md
CHANGED
|
@@ -91,19 +91,19 @@ export const GoBackItem: React_2.ForwardRefExoticComponent<
|
|
|
91
91
|
>;
|
|
92
92
|
|
|
93
93
|
// @public
|
|
94
|
-
export const Header:
|
|
95
|
-
HeaderProps &
|
|
94
|
+
export const Header: ForwardRefExoticComponent<
|
|
95
|
+
HeaderProps & RefAttributes<HTMLElement>
|
|
96
96
|
>;
|
|
97
97
|
|
|
98
98
|
// @public (undocumented)
|
|
99
99
|
export type HeaderProps = {
|
|
100
100
|
cssFn?: CSSFn;
|
|
101
|
-
iconBefore?:
|
|
102
|
-
onClick?: (event:
|
|
101
|
+
iconBefore?: React.ReactNode;
|
|
102
|
+
onClick?: (event: React.KeyboardEvent | React.MouseEvent) => void;
|
|
103
103
|
description?: JSX.Element | string;
|
|
104
|
-
children?:
|
|
104
|
+
children?: React.ReactNode;
|
|
105
105
|
testId?: string;
|
|
106
|
-
component?:
|
|
106
|
+
component?: React.ComponentType<CustomItemComponentProps>;
|
|
107
107
|
};
|
|
108
108
|
|
|
109
109
|
// @public
|
|
@@ -152,7 +152,7 @@ export interface NavigationContentProps {
|
|
|
152
152
|
// @public
|
|
153
153
|
export const NavigationFooter: ({
|
|
154
154
|
children,
|
|
155
|
-
}: NavigationFooterProps) =>
|
|
155
|
+
}: NavigationFooterProps) => JSX.Element;
|
|
156
156
|
|
|
157
157
|
// @public (undocumented)
|
|
158
158
|
export interface NavigationFooterProps {
|
package/tmp/api-report-tmp.d.ts
CHANGED
|
@@ -63,17 +63,17 @@ export type FooterProps = HeaderProps | NewFooterProps;
|
|
|
63
63
|
export const GoBackItem: React_2.ForwardRefExoticComponent<ButtonItemProps & React_2.RefAttributes<HTMLElement>>;
|
|
64
64
|
|
|
65
65
|
// @public
|
|
66
|
-
export const Header:
|
|
66
|
+
export const Header: ForwardRefExoticComponent<HeaderProps & RefAttributes<HTMLElement>>;
|
|
67
67
|
|
|
68
68
|
// @public (undocumented)
|
|
69
69
|
export type HeaderProps = {
|
|
70
70
|
cssFn?: CSSFn;
|
|
71
|
-
iconBefore?:
|
|
72
|
-
onClick?: (event:
|
|
71
|
+
iconBefore?: React.ReactNode;
|
|
72
|
+
onClick?: (event: React.KeyboardEvent | React.MouseEvent) => void;
|
|
73
73
|
description?: JSX.Element | string;
|
|
74
|
-
children?:
|
|
74
|
+
children?: React.ReactNode;
|
|
75
75
|
testId?: string;
|
|
76
|
-
component?:
|
|
76
|
+
component?: React.ComponentType<CustomItemComponentProps>;
|
|
77
77
|
};
|
|
78
78
|
|
|
79
79
|
// @public
|
|
@@ -109,7 +109,7 @@ export interface NavigationContentProps {
|
|
|
109
109
|
}
|
|
110
110
|
|
|
111
111
|
// @public
|
|
112
|
-
export const NavigationFooter: ({ children }: NavigationFooterProps) =>
|
|
112
|
+
export const NavigationFooter: ({ children }: NavigationFooterProps) => JSX.Element;
|
|
113
113
|
|
|
114
114
|
// @public (undocumented)
|
|
115
115
|
export interface NavigationFooterProps {
|