@atlaskit/side-nav-items 1.7.3 → 1.8.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 CHANGED
@@ -1,5 +1,24 @@
1
1
  # @atlaskit/side-nav-items
2
2
 
3
+ ## 1.8.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`0de59b20501c1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0de59b20501c1) -
8
+ Adjusts the padding on the flyout header and body slots to prevent focus ring clipping.
9
+
10
+ ### Patch Changes
11
+
12
+ - Updated dependencies
13
+
14
+ ## 1.7.4
15
+
16
+ ### Patch Changes
17
+
18
+ - [`6d87d08be8526`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6d87d08be8526) -
19
+ Add dependency for a11y testing.
20
+ - Updated dependencies
21
+
3
22
  ## 1.7.3
4
23
 
5
24
  ### Patch Changes
@@ -2,6 +2,7 @@
2
2
  ._18m91wug{overflow-y:auto}
3
3
  ._1bahv2br{justify-content:start}
4
4
  ._1e0c1txw{display:flex}
5
+ ._1q511b66{padding-block-start:var(--ds-space-050,4px)}
5
6
  ._2lx21bp4{flex-direction:column}
6
7
  ._4t3i1osq{height:100%}
7
8
  ._6rthx0bf{margin-block-end:var(--ds-space-negative-100,-8px)}
@@ -10,7 +10,7 @@ require("./flyout-body.compiled.css");
10
10
  var _runtime = require("@compiled/react/runtime");
11
11
  var _react = _interopRequireDefault(require("react"));
12
12
  var bodyStyles = {
13
- root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _6rthx0bf _bozgu2gc _y4tiu2gc _85i5u2gc"
13
+ root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _6rthx0bf _bozgu2gc _y4tiu2gc _1q511b66 _85i5u2gc"
14
14
  };
15
15
  /**
16
16
  * __Flyout menu item body__
@@ -6,6 +6,7 @@
6
6
  ._2lx21bp4{flex-direction:column}
7
7
  ._2lx21sbv{flex-direction:row-reverse}
8
8
  ._4cvr1h6o{align-items:center}
9
- ._85i512x7{padding-block-end:var(--ds-space-075,6px)}
9
+ ._85i51b66{padding-block-end:var(--ds-space-050,4px)}
10
+ ._85i5v77o{padding-block-end:var(--ds-space-025,2px)}
10
11
  ._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
11
12
  ._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
@@ -16,7 +16,8 @@ var _closeButton = require("./close-button");
16
16
  var _flyoutMenuItemContext = require("./flyout-menu-item-context");
17
17
  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); }
18
18
  var headerStyles = {
19
- root: "_zulp12x7 _bozg1b66 _85i512x7 _1e0c1txw _2lx21bp4",
19
+ root: "_zulp12x7 _bozg1b66 _85i5v77o _1e0c1txw _2lx21bp4",
20
+ hasChildren: "_85i51b66",
20
21
  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq _bozgv77o"
21
22
  };
22
23
  /**
@@ -39,7 +40,7 @@ var FlyoutHeader = exports.FlyoutHeader = function FlyoutHeader(props) {
39
40
  }, [onCloseRef]);
40
41
  return /*#__PURE__*/_react.default.createElement("div", {
41
42
  "data-testid": testId,
42
- className: (0, _runtime.ax)([headerStyles.root])
43
+ className: (0, _runtime.ax)([headerStyles.root, Boolean(children) && headerStyles.hasChildren])
43
44
  }, /*#__PURE__*/_react.default.createElement(_compiled.Flex, {
44
45
  xcss: headerStyles.flex
45
46
  }, /*#__PURE__*/_react.default.createElement(_closeButton.CloseButton, {
@@ -2,6 +2,7 @@
2
2
  ._18m91wug{overflow-y:auto}
3
3
  ._1bahv2br{justify-content:start}
4
4
  ._1e0c1txw{display:flex}
5
+ ._1q511b66{padding-block-start:var(--ds-space-050,4px)}
5
6
  ._2lx21bp4{flex-direction:column}
6
7
  ._4t3i1osq{height:100%}
7
8
  ._6rthx0bf{margin-block-end:var(--ds-space-negative-100,-8px)}
@@ -3,7 +3,7 @@ import "./flyout-body.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
4
  import React from 'react';
5
5
  const bodyStyles = {
6
- root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _6rthx0bf _bozgu2gc _y4tiu2gc _85i5u2gc"
6
+ root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _6rthx0bf _bozgu2gc _y4tiu2gc _1q511b66 _85i5u2gc"
7
7
  };
8
8
  /**
9
9
  * __Flyout menu item body__
@@ -6,6 +6,7 @@
6
6
  ._2lx21bp4{flex-direction:column}
7
7
  ._2lx21sbv{flex-direction:row-reverse}
8
8
  ._4cvr1h6o{align-items:center}
9
- ._85i512x7{padding-block-end:var(--ds-space-075,6px)}
9
+ ._85i51b66{padding-block-end:var(--ds-space-050,4px)}
10
+ ._85i5v77o{padding-block-end:var(--ds-space-025,2px)}
10
11
  ._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
11
12
  ._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
@@ -7,7 +7,8 @@ import { Flex } from '@atlaskit/primitives/compiled';
7
7
  import { CloseButton } from './close-button';
8
8
  import { OnCloseContext, useTitleId } from './flyout-menu-item-context';
9
9
  const headerStyles = {
10
- root: "_zulp12x7 _bozg1b66 _85i512x7 _1e0c1txw _2lx21bp4",
10
+ root: "_zulp12x7 _bozg1b66 _85i5v77o _1e0c1txw _2lx21bp4",
11
+ hasChildren: "_85i51b66",
11
12
  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq _bozgv77o"
12
13
  };
13
14
  /**
@@ -32,7 +33,7 @@ export const FlyoutHeader = props => {
32
33
  }, [onCloseRef]);
33
34
  return /*#__PURE__*/React.createElement("div", {
34
35
  "data-testid": testId,
35
- className: ax([headerStyles.root])
36
+ className: ax([headerStyles.root, Boolean(children) && headerStyles.hasChildren])
36
37
  }, /*#__PURE__*/React.createElement(Flex, {
37
38
  xcss: headerStyles.flex
38
39
  }, /*#__PURE__*/React.createElement(CloseButton, {
@@ -2,6 +2,7 @@
2
2
  ._18m91wug{overflow-y:auto}
3
3
  ._1bahv2br{justify-content:start}
4
4
  ._1e0c1txw{display:flex}
5
+ ._1q511b66{padding-block-start:var(--ds-space-050,4px)}
5
6
  ._2lx21bp4{flex-direction:column}
6
7
  ._4t3i1osq{height:100%}
7
8
  ._6rthx0bf{margin-block-end:var(--ds-space-negative-100,-8px)}
@@ -3,7 +3,7 @@ import "./flyout-body.compiled.css";
3
3
  import { ax, ix } from "@compiled/react/runtime";
4
4
  import React from 'react';
5
5
  var bodyStyles = {
6
- root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _6rthx0bf _bozgu2gc _y4tiu2gc _85i5u2gc"
6
+ root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _6rthx0bf _bozgu2gc _y4tiu2gc _1q511b66 _85i5u2gc"
7
7
  };
8
8
  /**
9
9
  * __Flyout menu item body__
@@ -6,6 +6,7 @@
6
6
  ._2lx21bp4{flex-direction:column}
7
7
  ._2lx21sbv{flex-direction:row-reverse}
8
8
  ._4cvr1h6o{align-items:center}
9
- ._85i512x7{padding-block-end:var(--ds-space-075,6px)}
9
+ ._85i51b66{padding-block-end:var(--ds-space-050,4px)}
10
+ ._85i5v77o{padding-block-end:var(--ds-space-025,2px)}
10
11
  ._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
11
12
  ._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}
@@ -7,7 +7,8 @@ import { Flex } from '@atlaskit/primitives/compiled';
7
7
  import { CloseButton } from './close-button';
8
8
  import { OnCloseContext, useTitleId } from './flyout-menu-item-context';
9
9
  var headerStyles = {
10
- root: "_zulp12x7 _bozg1b66 _85i512x7 _1e0c1txw _2lx21bp4",
10
+ root: "_zulp12x7 _bozg1b66 _85i5v77o _1e0c1txw _2lx21bp4",
11
+ hasChildren: "_85i51b66",
11
12
  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq _bozgv77o"
12
13
  };
13
14
  /**
@@ -30,7 +31,7 @@ export var FlyoutHeader = function FlyoutHeader(props) {
30
31
  }, [onCloseRef]);
31
32
  return /*#__PURE__*/React.createElement("div", {
32
33
  "data-testid": testId,
33
- className: ax([headerStyles.root])
34
+ className: ax([headerStyles.root, Boolean(children) && headerStyles.hasChildren])
34
35
  }, /*#__PURE__*/React.createElement(Flex, {
35
36
  xcss: headerStyles.flex
36
37
  }, /*#__PURE__*/React.createElement(CloseButton, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/side-nav-items",
3
- "version": "1.7.3",
3
+ "version": "1.8.0",
4
4
  "description": "Menu items and elements for the navigation side nav area.",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -58,7 +58,7 @@
58
58
  "@af/visual-regression": "workspace:^",
59
59
  "@atlaskit/app-provider": "^4.1.0",
60
60
  "@atlaskit/lozenge": "^13.4.0",
61
- "@atlaskit/navigation-system": "^5.39.0",
61
+ "@atlaskit/navigation-system": "^5.40.0",
62
62
  "@atlaskit/ssr": "workspace:^",
63
63
  "@atlassian/a11y-jest-testing": "^0.10.0",
64
64
  "@atlassian/feature-flags-test-utils": "^1.0.0",