@atlaskit/navigation-system 5.14.0 → 5.15.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlassian/navigation-system
 
+## 5.15.0
+
+### Minor Changes
+
+- [`d88efc1c38998`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d88efc1c38998) -
+  Fixes to issues from first implementation of FlyoutMenuItem slots and close button.
+
+  This includes fixing comments for the FlyoutMenuItemContext, cleaning up fallback strings for the
+  close button label, and fixing the positioning of the scroll container within the flyout.
+
 ## 5.14.0
 
 ### Minor Changes

package/dist/cjs/ui/menu-item/flyout-menu-item/close-button.js

@@ -27,7 +27,7 @@ var CloseButton = exports.CloseButton = function CloseButton(_ref) {
     testId: testId,
     appearance: "subtle",
     icon: _cross.default,
-    label: label || 'Close Flyout Menu',
+    label: label,
     onClick: onClick
   });
 };

package/dist/cjs/ui/menu-item/flyout-menu-item/flyout-body.compiled.css

@@ -1,5 +1,9 @@
+._12l2x0bf{margin-inline-end:var(--ds-space-negative-100,-8px)}
 ._18m91wug{overflow-y:auto}
 ._1bahv2br{justify-content:start}
 ._1e0c1txw{display:flex}
 ._2lx21bp4{flex-direction:column}
-._4t3i1osq{height:100%}
+._4t3i1osq{height:100%}
+._ahbqx0bf{margin-inline-start:var(--ds-space-negative-100,-8px)}
+._bozgu2gc{padding-inline-start:var(--ds-space-100,8px)}
+._y4tiu2gc{padding-inline-end:var(--ds-space-100,8px)}

package/dist/cjs/ui/menu-item/flyout-menu-item/flyout-body.js

@@ -10,7 +10,7 @@ require("./flyout-body.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _react = _interopRequireDefault(require("react"));
 var bodyStyles = {
-  root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br"
+  root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _bozgu2gc _y4tiu2gc"
 };
 /**
  * __Flyout menu item body__

package/dist/cjs/ui/menu-item/flyout-menu-item/flyout-footer.compiled.css

@@ -0,0 +1,4 @@
+._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}
+._1sw7nqa1{border-block-start-style:solid}
+._7myae4h9{border-block-start-width:var(--ds-border-width,1px)}
+._qgnu1l7x{border-block-start-color:var(--ds-border,#0b120e24)}

package/dist/cjs/ui/menu-item/flyout-menu-item/flyout-footer.js

@@ -6,8 +6,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.FlyoutFooter = void 0;
+require("./flyout-footer.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _react = _interopRequireDefault(require("react"));
+var footerStyles = {
+  root: "_7myae4h9 _1sw7nqa1 _qgnu1l7x _1q51u2gc"
+};
 /**
  * __Flyout menu item footer__
  *
@@ -19,6 +23,7 @@ var FlyoutFooter = exports.FlyoutFooter = function FlyoutFooter(props) {
   var children = props.children,
     testId = props.testId;
   return /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": testId
+    "data-testid": testId,
+    className: (0, _runtime.ax)([footerStyles.root])
   }, children);
 };

package/dist/cjs/ui/menu-item/flyout-menu-item/flyout-header.compiled.css

@@ -7,4 +7,5 @@
 ._2lx21sbv{flex-direction:row-reverse}
 ._4cvr1h6o{align-items:center}
 ._85i512x7{padding-block-end:var(--ds-space-075,6px)}
-._bozg12x7{padding-inline-start:var(--ds-space-075,6px)}
+._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
+._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}

package/dist/cjs/ui/menu-item/flyout-menu-item/flyout-header.js

@@ -16,8 +16,8 @@ var _closeButton = require("./close-button");
 var _flyoutMenuItemContext = require("./flyout-menu-item-context");
 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); }
 var headerStyles = {
-  root: "_zulp12x7 _bozg12x7 _85i512x7 _1e0c1txw _2lx21bp4",
-  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq"
+  root: "_zulp12x7 _bozg1b66 _85i512x7 _1e0c1txw _2lx21bp4",
+  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq _bozgv77o"
 };
 /**
  * __FlyoutHeader__

package/dist/cjs/ui/menu-item/flyout-menu-item/flyout-menu-item-context.js

@@ -37,6 +37,6 @@ var OnCloseContext = exports.OnCloseContext = /*#__PURE__*/(0, _react.createCont
 /**
  * __On close provider__
  * 
- * A context provider for supplying the testId to the FlyoutHeader.
+ * A context provider for supplying the onClose function to the FlyoutHeader.
  */
 var OnCloseProvider = exports.OnCloseProvider = OnCloseContext.Provider;

package/dist/es2019/ui/menu-item/flyout-menu-item/close-button.js

@@ -20,6 +20,6 @@ export const CloseButton = ({
   testId: testId,
   appearance: "subtle",
   icon: CrossIcon,
-  label: label || 'Close Flyout Menu',
+  label: label,
   onClick: onClick
 });

package/dist/es2019/ui/menu-item/flyout-menu-item/flyout-body.compiled.css

@@ -1,5 +1,9 @@
+._12l2x0bf{margin-inline-end:var(--ds-space-negative-100,-8px)}
 ._18m91wug{overflow-y:auto}
 ._1bahv2br{justify-content:start}
 ._1e0c1txw{display:flex}
 ._2lx21bp4{flex-direction:column}
-._4t3i1osq{height:100%}
+._4t3i1osq{height:100%}
+._ahbqx0bf{margin-inline-start:var(--ds-space-negative-100,-8px)}
+._bozgu2gc{padding-inline-start:var(--ds-space-100,8px)}
+._y4tiu2gc{padding-inline-end:var(--ds-space-100,8px)}

package/dist/es2019/ui/menu-item/flyout-menu-item/flyout-body.js

@@ -3,7 +3,7 @@ import "./flyout-body.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 const bodyStyles = {
-  root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br"
+  root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _bozgu2gc _y4tiu2gc"
 };
 /**
  * __Flyout menu item body__

package/dist/es2019/ui/menu-item/flyout-menu-item/flyout-footer.compiled.css

@@ -0,0 +1,4 @@
+._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}
+._1sw7nqa1{border-block-start-style:solid}
+._7myae4h9{border-block-start-width:var(--ds-border-width,1px)}
+._qgnu1l7x{border-block-start-color:var(--ds-border,#0b120e24)}

package/dist/es2019/ui/menu-item/flyout-menu-item/flyout-footer.js

@@ -1,6 +1,10 @@
 /* flyout-footer.tsx generated by @compiled/babel-plugin v0.38.1 */
+import "./flyout-footer.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
+const footerStyles = {
+  root: "_7myae4h9 _1sw7nqa1 _qgnu1l7x _1q51u2gc"
+};
 /**
  * __Flyout menu item footer__
  *
@@ -14,6 +18,7 @@ export const FlyoutFooter = props => {
     testId
   } = props;
   return /*#__PURE__*/React.createElement("div", {
-    "data-testid": testId
+    "data-testid": testId,
+    className: ax([footerStyles.root])
   }, children);
 };

package/dist/es2019/ui/menu-item/flyout-menu-item/flyout-header.compiled.css

@@ -7,4 +7,5 @@
 ._2lx21sbv{flex-direction:row-reverse}
 ._4cvr1h6o{align-items:center}
 ._85i512x7{padding-block-end:var(--ds-space-075,6px)}
-._bozg12x7{padding-inline-start:var(--ds-space-075,6px)}
+._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
+._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}

package/dist/es2019/ui/menu-item/flyout-menu-item/flyout-header.js

@@ -7,8 +7,8 @@ import { Flex } from '@atlaskit/primitives/compiled';
 import { CloseButton } from './close-button';
 import { OnCloseContext, SetIsOpenContext } from './flyout-menu-item-context';
 const headerStyles = {
-  root: "_zulp12x7 _bozg12x7 _85i512x7 _1e0c1txw _2lx21bp4",
-  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq"
+  root: "_zulp12x7 _bozg1b66 _85i512x7 _1e0c1txw _2lx21bp4",
+  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq _bozgv77o"
 };
 /**
  * __FlyoutHeader__

package/dist/es2019/ui/menu-item/flyout-menu-item/flyout-menu-item-context.js

@@ -27,6 +27,6 @@ export const OnCloseContext = /*#__PURE__*/createContext(null);
 /**
  * __On close provider__
  * 
- * A context provider for supplying the testId to the FlyoutHeader.
+ * A context provider for supplying the onClose function to the FlyoutHeader.
  */
 export const OnCloseProvider = OnCloseContext.Provider;

package/dist/esm/ui/menu-item/flyout-menu-item/close-button.js

@@ -20,7 +20,7 @@ export var CloseButton = function CloseButton(_ref) {
     testId: testId,
     appearance: "subtle",
     icon: CrossIcon,
-    label: label || 'Close Flyout Menu',
+    label: label,
     onClick: onClick
   });
 };

package/dist/esm/ui/menu-item/flyout-menu-item/flyout-body.compiled.css

@@ -1,5 +1,9 @@
+._12l2x0bf{margin-inline-end:var(--ds-space-negative-100,-8px)}
 ._18m91wug{overflow-y:auto}
 ._1bahv2br{justify-content:start}
 ._1e0c1txw{display:flex}
 ._2lx21bp4{flex-direction:column}
-._4t3i1osq{height:100%}
+._4t3i1osq{height:100%}
+._ahbqx0bf{margin-inline-start:var(--ds-space-negative-100,-8px)}
+._bozgu2gc{padding-inline-start:var(--ds-space-100,8px)}
+._y4tiu2gc{padding-inline-end:var(--ds-space-100,8px)}

package/dist/esm/ui/menu-item/flyout-menu-item/flyout-body.js

@@ -3,7 +3,7 @@ import "./flyout-body.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 var bodyStyles = {
-  root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br"
+  root: "_1e0c1txw _2lx21bp4 _18m91wug _4t3i1osq _1bahv2br _ahbqx0bf _12l2x0bf _bozgu2gc _y4tiu2gc"
 };
 /**
  * __Flyout menu item body__

package/dist/esm/ui/menu-item/flyout-menu-item/flyout-footer.compiled.css

@@ -0,0 +1,4 @@
+._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}
+._1sw7nqa1{border-block-start-style:solid}
+._7myae4h9{border-block-start-width:var(--ds-border-width,1px)}
+._qgnu1l7x{border-block-start-color:var(--ds-border,#0b120e24)}

package/dist/esm/ui/menu-item/flyout-menu-item/flyout-footer.js

@@ -1,6 +1,10 @@
 /* flyout-footer.tsx generated by @compiled/babel-plugin v0.38.1 */
+import "./flyout-footer.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
+var footerStyles = {
+  root: "_7myae4h9 _1sw7nqa1 _qgnu1l7x _1q51u2gc"
+};
 /**
  * __Flyout menu item footer__
  *
@@ -12,6 +16,7 @@ export var FlyoutFooter = function FlyoutFooter(props) {
   var children = props.children,
     testId = props.testId;
   return /*#__PURE__*/React.createElement("div", {
-    "data-testid": testId
+    "data-testid": testId,
+    className: ax([footerStyles.root])
   }, children);
 };

package/dist/esm/ui/menu-item/flyout-menu-item/flyout-header.compiled.css

@@ -7,4 +7,5 @@
 ._2lx21sbv{flex-direction:row-reverse}
 ._4cvr1h6o{align-items:center}
 ._85i512x7{padding-block-end:var(--ds-space-075,6px)}
-._bozg12x7{padding-inline-start:var(--ds-space-075,6px)}
+._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
+._bozgv77o{padding-inline-start:var(--ds-space-025,2px)}

package/dist/esm/ui/menu-item/flyout-menu-item/flyout-header.js

@@ -7,8 +7,8 @@ import { Flex } from '@atlaskit/primitives/compiled';
 import { CloseButton } from './close-button';
 import { OnCloseContext, SetIsOpenContext } from './flyout-menu-item-context';
 var headerStyles = {
-  root: "_zulp12x7 _bozg12x7 _85i512x7 _1e0c1txw _2lx21bp4",
-  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq"
+  root: "_zulp12x7 _bozg1b66 _85i512x7 _1e0c1txw _2lx21bp4",
+  flex: "_zulppxbi _1bah1yb4 _2lx21sbv _4cvr1h6o _1bsb1osq _bozgv77o"
 };
 /**
  * __FlyoutHeader__

package/dist/esm/ui/menu-item/flyout-menu-item/flyout-menu-item-context.js

@@ -31,6 +31,6 @@ export var OnCloseContext = /*#__PURE__*/createContext(null);
 /**
  * __On close provider__
  * 
- * A context provider for supplying the testId to the FlyoutHeader.
+ * A context provider for supplying the onClose function to the FlyoutHeader.
  */
 export var OnCloseProvider = OnCloseContext.Provider;

package/dist/types/ui/menu-item/flyout-menu-item/flyout-menu-item-context.d.ts

@@ -21,6 +21,6 @@ export declare const OnCloseContext: import("react").Context<(() => void) | null
 /**
  * __On close provider__
  *
- * A context provider for supplying the testId to the FlyoutHeader.
+ * A context provider for supplying the onClose function to the FlyoutHeader.
  */
 export declare const OnCloseProvider: import("react").Provider<(() => void) | null | undefined>;

package/dist/types-ts4.5/ui/menu-item/flyout-menu-item/flyout-menu-item-context.d.ts

@@ -21,6 +21,6 @@ export declare const OnCloseContext: import("react").Context<(() => void) | null
 /**
  * __On close provider__
  *
- * A context provider for supplying the testId to the FlyoutHeader.
+ * A context provider for supplying the onClose function to the FlyoutHeader.
  */
 export declare const OnCloseProvider: import("react").Provider<(() => void) | null | undefined>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/navigation-system",
-	"version": "5.14.0",
+	"version": "5.15.0",
 	"description": "The latest navigation system for Atlassian apps.",
 	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
 	"author": "Atlassian Pty Ltd",
@@ -108,7 +108,7 @@
 		"@atlaskit/lozenge": "^13.3.0",
 		"@atlaskit/menu": "^8.4.0",
 		"@atlaskit/modal-dialog": "^14.9.0",
-		"@atlaskit/onboarding": "^14.4.0",
+		"@atlaskit/onboarding": "^14.5.0",
 		"@atlaskit/page-header": "^12.1.0",
 		"@atlaskit/page-layout": "^4.2.0",
 		"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.1.0",
@@ -116,7 +116,7 @@
 		"@atlaskit/skeleton": "^2.1.0",
 		"@atlaskit/textfield": "^8.2.0",
 		"@atlassian/feature-flags-test-utils": "^1.0.0",
-		"@atlassian/gemini": "^1.26.0",
+		"@atlassian/gemini": "^1.27.0",
 		"@atlassian/search-dialog": "^9.10.0",
 		"@atlassian/ssr-tests": "workspace:^",
 		"@atlassian/test-utils": "^1.0.0",