@atlaskit/help 9.0.2 → 9.0.3

package/dist/es2019/components/HelpContentButton/styled.compiled.css

@@ -1,31 +1,39 @@
-
+._11c8376l{font:var(--ds-font-body,inherit)}
+._19itglyw{border:none}
 ._2rko1l7b{border-radius:3px}
 ._2rko1y44{border-radius:4px}
+._18u0idpf{margin-left:0}
 ._19bv1b66{padding-left:var(--ds-space-050,4px)}
 ._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._19pkidpf{margin-top:0}
 ._19pkr5cr{margin-top:var(--ds-space-negative-050,-4px)}
 ._1bsbgktf{width:20px}
 ._1bsbnau3{width:calc(100% - var(--ds-space-200, 1pc))}
 ._1bsbwgn3{width:calc(100% - 20px)}
 ._1e0c1o8l{display:inline-block}
 ._1e0c1ule{display:block}
+._1e0c5mfb{display:table}
 ._1eab1ooe span{transform:translate(-50%,-50%)}
 ._1t181ssb span{top:50%}
 ._1t981ssb span{left:50%}
+._2hwxidpf{margin-right:0}
 ._4t3igktf{height:20px}
 ._80omtlke{cursor:pointer}
+._bfhk1j28{background-color:transparent}
 ._ca0qidpf{padding-top:0}
 ._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._kqswh2mm{position:relative}
 ._n3tdidpf{padding-bottom:0}
 ._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._otyridpf{margin-bottom:0}
 ._s7n4nkob{vertical-align:middle}
 ._syazc8hx{color:var(--ds-text-subtle,#344563)}
 ._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
 ._vchhusvi{box-sizing:border-box}
 ._vr2wstnw span{position:absolute}
 ._7ehi1ssq:focus{box-shadow:var(--ds-border-focused,#4c9aff) 0 0 0 2px inset}
-._irr314ae:hover{background-color:var(--ds-background-neutral-subtle-hovered,#ebecf0)}._13roglyw:active, ._1bg4glyw:focus, ._1qb1glyw:hover, ._1dnaglyw:visited{outline-offset:none}
+._irr314ae:hover{background-color:var(--ds-background-neutral-subtle-hovered,#ebecf0)}
+._13roglyw:active, ._1bg4glyw:focus, ._1qb1glyw:hover, ._1dnaglyw:visited{outline-offset:none}
 ._1di61l7b:active{background-color:var(--ds-background-neutral-subtle-pressed,#deebff)}
 ._1iohnqa1:active, ._5goinqa1:focus, ._jf4cnqa1:hover, ._1726nqa1:visited{text-decoration-style:solid}
 ._1nrm1r31:active, ._1a3b1r31:focus, ._9oik1r31:hover, ._1ydc1r31:visited{text-decoration-color:currentColor}

package/dist/es2019/components/HelpContentButton/styled.js

@@ -3,6 +3,8 @@ import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { B100, B50, N30, N600 } from '@atlaskit/theme/colors';
+const wrappedSpanStyles = null;
+const parentListItemHelpContentButtonContainerStyles = null;
 const helpContentButtonContainerStyles = null;
 export const HelpContentButtonContainer = ({
   onClick,
@@ -12,15 +14,34 @@ export const HelpContentButtonContainer = ({
   tabIndex,
   target,
   children
-}) => /*#__PURE__*/React.createElement("a", {
-  onClick: onClick,
-  onKeyDown: onKeyDown,
-  href: href,
-  id: id,
-  tabIndex: tabIndex,
-  target: target,
-  className: ax(["_2rko1l7b _1e0c1ule _80omtlke _1bsbnau3 _syazc8hx _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _7ehi1ssq _1nrm1r31 _1a3b1r31 _9oik1r31 _1ydc1r31 _c2waglyw _4fprglyw _1bnxglyw _1x28glyw _1iohnqa1 _5goinqa1 _jf4cnqa1 _1726nqa1 _1q5t1r31 _nt751r31 _1dit1r31 _9nxe1r31 _1ohyglyw _49pcglyw _ksodglyw _tpgfglyw _1r9x1o36 _1hvw1o36 _4hz81o36 _12gr1o36 _13roglyw _1bg4glyw _1qb1glyw _1dnaglyw _9h8hc8hx _f8pjc8hx _30l3c8hx _1053c8hx _irr314ae _1di61l7b"])
-}, children);
+}) => {
+  if (href) {
+    return /*#__PURE__*/React.createElement("li", {
+      className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf"])
+    }, /*#__PURE__*/React.createElement("a", {
+      onClick: onClick,
+      onKeyDown: onKeyDown,
+      href: href,
+      id: id,
+      tabIndex: tabIndex,
+      target: target,
+      className: ax(["_2rko1l7b _19itglyw _bfhk1j28 _11c8376l _1e0c1ule _80omtlke _1bsbnau3 _syazc8hx _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _7ehi1ssq _1nrm1r31 _1a3b1r31 _9oik1r31 _1ydc1r31 _c2waglyw _4fprglyw _1bnxglyw _1x28glyw _1iohnqa1 _5goinqa1 _jf4cnqa1 _1726nqa1 _1q5t1r31 _nt751r31 _1dit1r31 _9nxe1r31 _1ohyglyw _49pcglyw _ksodglyw _tpgfglyw _1r9x1o36 _1hvw1o36 _4hz81o36 _12gr1o36 _13roglyw _1bg4glyw _1qb1glyw _1dnaglyw _9h8hc8hx _f8pjc8hx _30l3c8hx _1053c8hx _irr314ae _1di61l7b"])
+    }, /*#__PURE__*/React.createElement("span", {
+      className: ax(["_1e0c5mfb"])
+    }, children)));
+  }
+  return /*#__PURE__*/React.createElement("li", {
+    className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf"])
+  }, /*#__PURE__*/React.createElement("button", {
+    onClick: onClick,
+    onKeyDown: onKeyDown,
+    id: id,
+    tabIndex: tabIndex,
+    className: ax(["_2rko1l7b _19itglyw _bfhk1j28 _11c8376l _1e0c1ule _80omtlke _1bsbnau3 _syazc8hx _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _7ehi1ssq _1nrm1r31 _1a3b1r31 _9oik1r31 _1ydc1r31 _c2waglyw _4fprglyw _1bnxglyw _1x28glyw _1iohnqa1 _5goinqa1 _jf4cnqa1 _1726nqa1 _1q5t1r31 _nt751r31 _1dit1r31 _9nxe1r31 _1ohyglyw _49pcglyw _ksodglyw _tpgfglyw _1r9x1o36 _1hvw1o36 _4hz81o36 _12gr1o36 _13roglyw _1bg4glyw _1qb1glyw _1dnaglyw _9h8hc8hx _f8pjc8hx _30l3c8hx _1053c8hx _irr314ae _1di61l7b"])
+  }, /*#__PURE__*/React.createElement("span", {
+    className: ax(["_1e0c5mfb"])
+  }, children)));
+};
 const helpContentButtonIconStyles = null;
 export const HelpContentButtonIcon = ({
   children

package/dist/es2019/components/RelatedArticles/index.js

@@ -16,7 +16,7 @@ import { RelatedArticlesTitle } from './styled';
 import useCancellablePromise from '../../util/hooks/cancellablePromise';
 import { usePrevious } from '../../util/hooks/previous';
 const packageName = "@atlaskit/help";
-const packageVersion = "9.0.2";
+const packageVersion = "9.0.3";
 const buttonStyles = null;
 export const RelatedArticles = ({
   style = 'primary',

package/dist/es2019/components/Search/SearchInput/index.js

@@ -19,7 +19,7 @@ import { useNavigationContext } from '../../contexts/navigationContext';
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'searchInput',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 const buttonStyles = null;
 export const SearchInput = ({

package/dist/es2019/components/WhatsNew/WhatsNewButton/index.js

@@ -11,7 +11,7 @@ import { ARTICLE_TYPE } from '../../../model/Help';
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'WhatsNewButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export const WhatsNewButton = ({
   productName,

package/dist/es2019/components/WhatsNew/WhatsNewResults/WhatsNewResultsList/WhatsNewResultItem/index.js

@@ -8,7 +8,7 @@ import { WhatsNewResultListItemWrapper, WhatsNewResultListItemTitleContainer, Wh
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticlesListItem',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export const WhatsNewResultListItem = ({
   intl: {

package/dist/es2019/components/styled.compiled.css

@@ -1,9 +1,12 @@
 
+._qtt8glyw{list-style:none}
 ._v5641kd4{transition:left .22s,opacity .22s}
 ._x3domfkj{border-top:var(--ds-space-025,2px) solid var(--ds-border,#ebecf0)}._16jlkb7n{flex-grow:1}
 ._18m91wug{overflow-y:auto}
+._18u0idpf{margin-left:0}
 ._19bvidpf{padding-left:0}
 ._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
+._19pkidpf{margin-top:0}
 ._19pkou31{margin-top:var(--ds-space-200,14px)}
 ._1bah1yb4{justify-content:space-between}
 ._1bsb1osq{width:100%}
@@ -17,19 +20,23 @@
 ._1reo1wug{overflow-x:auto}
 ._1tkeidpf{min-height:0}
 ._1wpz1wug{align-self:auto}
+._2hwxidpf{margin-right:0}
 ._2lx21bp4{flex-direction:column}
 ._4cvr1y6m{align-items:flex-start}
 ._4t3i1osq{height:100%}
 ._4t3ixy5q{height:var(--ds-space-400,2pc)}
 ._ae4v1fhb{align-content:stretch}
 ._bfhk1gi7{background-color:var(--ds-background-neutral,#fafbfc)}
+._ca0qidpf{padding-top:0}
 ._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
 ._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._i0dl1wug{flex-basis:auto}
 ._kqswh2mm{position:relative}
 ._kqswstnw{position:absolute}
+._n3tdidpf{padding-bottom:0}
 ._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
 ._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._otyridpf{margin-bottom:0}
 ._tzy4idpf{opacity:0}
 ._u5f3idpf{padding-right:0}
 ._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}

package/dist/es2019/components/styled.js

@@ -32,7 +32,7 @@ export const Home = ({
     display: isOverlayFullyVisible ? 'none' : 'block',
     overflow: isOverlayVisible ? 'hidden' : 'auto'
   },
-  className: ax(["_1reo1wug _18m91wug _1e0c1ule _4t3i1osq _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _vchhusvi"])
+  className: ax(["_1reo1wug _18m91wug _1e0c1ule _4t3i1osq _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _vchhusvi _19pkidpf"])
 }, children);
 const homeAiStyles = null;
 export const HomeAi = ({
@@ -44,7 +44,7 @@ export const HomeAi = ({
     display: isOverlayFullyVisible ? 'none' : 'block',
     overflow: isOverlayVisible ? 'hidden' : 'auto'
   },
-  className: ax(["_1reo1wug _18m91wug _1e0c1ule _19bvpxbi _u5f3pxbi _n3tdpxbi _vchhusvi"])
+  className: ax(["_1reo1wug _18m91wug _1e0c1ule _19bvpxbi _u5f3pxbi _n3tdpxbi _vchhusvi _19pkidpf"])
 }, children);
 const helpFooterStyles = null;
 export const HelpFooter = ({
@@ -72,4 +72,10 @@ export const BackButtonContainer = ({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
   style: backButtonContainerTransitionStyles[transitionState],
   className: ax(["_v5641kd4 _kqswstnw _19pkou31 _1ltv1ejb _4t3ixy5q _tzy4idpf"])
+}, children);
+const ulStyles = null;
+export const StyledUl = ({
+  children
+}) => /*#__PURE__*/React.createElement("ul", {
+  className: ax(["_qtt8glyw _19pkidpf _2hwxidpf _otyridpf _18u0idpf _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf"])
 }, children);

package/dist/esm/analytics.js

@@ -5,5 +5,5 @@ export var createAndFire = x.createAndFireEvent('atlaskit');
 export var defaultAnalyticsAttributes = {
   componentName: 'help',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };

package/dist/esm/components/Article/ArticleLoadingFail/index.js

@@ -10,7 +10,7 @@ import { LoadingErrorMessage, LoadingErrorButtonContainer, LoadingErrorHeading }
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleLoadingFail',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export var ArticleLoadingFail = function ArticleLoadingFail(_ref) {
   var onTryAgainButtonClick = _ref.onTryAgainButtonClick,

package/dist/esm/components/Article/HelpArticle/WasHelpfulForm/WasHelpfulNoButton.js

@@ -6,7 +6,7 @@ import { messages } from '../../../../messages';
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleWasHelpfulNoButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export var ArticleWasHelpfulNoButton = function ArticleWasHelpfulNoButton(_ref) {
   var _ref$isSelected = _ref.isSelected,

package/dist/esm/components/Article/HelpArticle/WasHelpfulForm/WasHelpfulYesButton.js

@@ -6,7 +6,7 @@ import { messages } from '../../../../messages';
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleWasHelpfulYesButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export var ArticleWasHelpfulYesButton = function ArticleWasHelpfulYesButton(_ref) {
   var _ref$isSelected = _ref.isSelected,

package/dist/esm/components/Article/HelpArticle/WasHelpfulForm/index.js

@@ -5,7 +5,7 @@ import "./index.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 /** @jsxFrag */
 
-import React, { useState } from 'react';
+import React, { useRef, useState } from 'react';
 import { injectIntl } from 'react-intl-next';
 import { useAnalyticsEvents, AnalyticsContext } from '@atlaskit/analytics-next';
 import SectionMessage from '@atlaskit/section-message';
@@ -26,7 +26,7 @@ var FEEDBACK_REASON_TEXT_MAX_LENGTH = '16000';
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleWasHelpfulForm',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 var buttonStyles = null;
 export var ArticleWasHelpfulForm = function ArticleWasHelpfulForm(_ref) {
@@ -64,6 +64,7 @@ export var ArticleWasHelpfulForm = function ArticleWasHelpfulForm(_ref) {
     setWasHelpfulFormSubmitedFailed = _useState14[1];
   var _useAnalyticsEvents = useAnalyticsEvents(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  var wasHelpfulFormClickedButtonRef = useRef(null);
   var negativeFeedbackReason = [{
     name: 'negativeFeedbackReason',
     value: 'noAccurate',
@@ -82,12 +83,14 @@ export var ArticleWasHelpfulForm = function ArticleWasHelpfulForm(_ref) {
       onWasHelpfulYesButtonClick(event, analyticsEvent);
     }
     setWasHelpful(true);
+    wasHelpfulFormClickedButtonRef.current = event.currentTarget;
   };
   var handleArticleWasHelpfulNoButtonClick = (onWasHelpfulNoButtonClick || onWasHelpfulSubmit) && function (event, analyticsEvent) {
     if (onWasHelpfulNoButtonClick) {
       onWasHelpfulNoButtonClick(event, analyticsEvent);
     }
     setWasHelpful(false);
+    wasHelpfulFormClickedButtonRef.current = event.currentTarget;
   };
   var radioGroupReasonOnChange = function radioGroupReasonOnChange(event) {
     setFeedbackReason(event.currentTarget.value);
@@ -129,7 +132,9 @@ export var ArticleWasHelpfulForm = function ArticleWasHelpfulForm(_ref) {
     }
   };
   var onFeedbackSubmitCancel = function onFeedbackSubmitCancel() {
+    var _wasHelpfulFormClicke, _wasHelpfulFormClicke2;
     setWasHelpful(null);
+    (_wasHelpfulFormClicke = wasHelpfulFormClickedButtonRef.current) === null || _wasHelpfulFormClicke === void 0 || (_wasHelpfulFormClicke2 = _wasHelpfulFormClicke.focus) === null || _wasHelpfulFormClicke2 === void 0 || _wasHelpfulFormClicke2.call(_wasHelpfulFormClicke);
   };
   var handleTryAgainOnClick = function handleTryAgainOnClick() {
     var feedback = {

package/dist/esm/components/Article/HelpArticle/index.js

@@ -56,7 +56,7 @@ export var HelpArticle = function HelpArticle(_ref) {
     analyticsEvent.payload.attributes = {
       componentName: 'Article',
       packageName: "@atlaskit/help",
-      packageVersion: "9.0.2"
+      packageVersion: "9.0.3"
     };
     if (onRelatedArticlesShowMoreClick) {
       onRelatedArticlesShowMoreClick(event, analyticsEvent, isCollapsed);

package/dist/esm/components/Article/WhatsNewArticle/index.js

@@ -13,7 +13,7 @@ import { WhatsNewTypeTitle, WhatsNewTitleText, WhatsNewIconContainer, RelatedLin
 var analyticsContextData = {
   componentName: 'ArticlesListItem',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export var WhatsNewArticle = function WhatsNewArticle(_ref) {
   var formatMessage = _ref.intl.formatMessage,

package/dist/esm/components/ArticlesList/ArticlesListItem/index.js

@@ -8,7 +8,7 @@ import { ArticlesListItemWrapper, ArticlesListItemContainer, ArticlesListItemTit
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticlesListItem',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 var highlightText = function highlightText(text) {
   if (!text) {

package/dist/esm/components/ArticlesList/ArticlesListItem/styled.js

@@ -8,6 +8,7 @@ import { ax, ix } from "@compiled/react/runtime";
 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; }
 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; }
 import React from 'react';
+import Heading from '@atlaskit/heading';
 import { fontFallback } from '@atlaskit/theme/typography';
 import { B100, B50, N200, N30, N400, N400A, N800, Y100 } from '@atlaskit/theme/colors';
 var heading = fontFallback.heading,
@@ -51,13 +52,16 @@ export var ArticlesListItemLinkIcon = function ArticlesListItemLinkIcon(_ref4) {
 var articlesListItemTitleTextStyles = null;
 export var ArticlesListItemTitleText = function ArticlesListItemTitleText(_ref5) {
   var children = _ref5.children;
-  return /*#__PURE__*/React.createElement("p", {
+  return /*#__PURE__*/React.createElement("div", {
     className: ax(["_4bfu1r31 _1hmsglyw _ajmmnqa1 _11c81ysy _1reo15vq _18m915vq _syaz1o8f _1e0c1o8l _o5724jg8 _otyrh9hh"]),
     style: {
       "--_ggxzyp": ix("var(--ds-text, ".concat(N800, ")")),
       "--_9taizs": ix("var(--ds-font-heading-xsmall, ".concat(heading.xsmall, ")"))
     }
-  }, children);
+  }, /*#__PURE__*/React.createElement(Heading, {
+    size: "xsmall",
+    as: "h3"
+  }, children));
 };
 var articlesListItemDescriptionStyles = null;
 export var ArticlesListItemDescription = function ArticlesListItemDescription(_ref6) {

package/dist/esm/components/BackButton/index.js

@@ -49,7 +49,7 @@ var BackButtonWithContext = function BackButtonWithContext(props) {
     data: {
       componentName: 'backButton',
       packageName: "@atlaskit/help",
-      packageVersion: "9.0.2"
+      packageVersion: "9.0.3"
     }
   }, /*#__PURE__*/React.createElement(BackButton, props));
 };

package/dist/esm/components/HelpContent.js

@@ -17,7 +17,7 @@ import WhatsNewResults from './WhatsNew/WhatsNewResults';
 import HelpContentButton from './HelpContentButton';
 import BackButton from './BackButton';
 import { NeedMoreHelp } from './NeedMoreHelp';
-import { HelpBodyContainer, HelpBody, Home, HomeAi, HelpBodyAi } from './styled';
+import { HelpBodyContainer, HelpBody, Home, HomeAi, HelpBodyAi, StyledUl } from './styled';
 import { HelpFooter } from './styled';
 import { Tabs } from './Tabs';
 import AiChatIcon from '@atlaskit/icon/core/ai-chat';
@@ -116,13 +116,13 @@ export var HelpContent = function HelpContent(_ref) {
   }), /*#__PURE__*/React.createElement(HomeAi, {
     isOverlayFullyVisible: isOverlayFullyVisible,
     isOverlayVisible: isOverlayVisible
-  }, homeContent, onSearchWhatsNewArticles && onGetWhatsNewArticle && /*#__PURE__*/React.createElement(WhatsNewButton, {
+  }, homeContent, /*#__PURE__*/React.createElement(StyledUl, null, onSearchWhatsNewArticles && onGetWhatsNewArticle && /*#__PURE__*/React.createElement(WhatsNewButton, {
     productName: productName
   }), homeOptions && homeOptions.map(function (defaultOption) {
     return /*#__PURE__*/React.createElement(HelpContentButton, _extends({
       key: defaultOption.id
     }, defaultOption));
-  }))), /*#__PURE__*/React.createElement(WhatsNewResults, null)), /*#__PURE__*/React.createElement(NeedMoreHelp, {
+  })))), /*#__PURE__*/React.createElement(WhatsNewResults, null)), /*#__PURE__*/React.createElement(NeedMoreHelp, {
     label: formatMessage(messages.help_need_more_help_label),
     onNeedMoreHelpClick: handleNeedMoreHelpClick
   }), footer && /*#__PURE__*/React.createElement(HelpFooter, {
@@ -137,13 +137,13 @@ export var HelpContent = function HelpContent(_ref) {
   }, /*#__PURE__*/React.createElement(HelpBodyContainer, null, /*#__PURE__*/React.createElement(HelpBody, null, /*#__PURE__*/React.createElement(SearchResults, null), /*#__PURE__*/React.createElement(ArticleComponent, null), /*#__PURE__*/React.createElement(Home, {
     isOverlayFullyVisible: isOverlayFullyVisible,
     isOverlayVisible: isOverlayVisible
-  }, homeContent, onSearchWhatsNewArticles && onGetWhatsNewArticle && /*#__PURE__*/React.createElement(WhatsNewButton, {
+  }, homeContent, /*#__PURE__*/React.createElement(StyledUl, null, onSearchWhatsNewArticles && onGetWhatsNewArticle && /*#__PURE__*/React.createElement(WhatsNewButton, {
     productName: productName
   }), homeOptions && homeOptions.map(function (defaultOption) {
     return /*#__PURE__*/React.createElement(HelpContentButton, _extends({
       key: defaultOption.id
     }, defaultOption));
-  }))), /*#__PURE__*/React.createElement(WhatsNewResults, null)));
+  })))), /*#__PURE__*/React.createElement(WhatsNewResults, null)));
   return isAiEnabled ? HelpLayoutWithAi : HelpLayoutWithoutAi;
 };
 export default injectIntl(HelpContent);

package/dist/esm/components/HelpContentButton/index.js

@@ -7,7 +7,7 @@ import { HelpContentButtonContainer, HelpContentButtonIcon, HelpContentButtonTex
 var analitycsContextData = {
   componentName: 'HelpContentButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 var HelpContentButton = function HelpContentButton(_ref) {
   var _ref$id = _ref.id,

package/dist/esm/components/HelpContentButton/styled.compiled.css

@@ -1,31 +1,39 @@
-
+._11c8376l{font:var(--ds-font-body,inherit)}
+._19itglyw{border:none}
 ._2rko1l7b{border-radius:3px}
 ._2rko1y44{border-radius:4px}
+._18u0idpf{margin-left:0}
 ._19bv1b66{padding-left:var(--ds-space-050,4px)}
 ._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._19pkidpf{margin-top:0}
 ._19pkr5cr{margin-top:var(--ds-space-negative-050,-4px)}
 ._1bsbb8xr{width:var(--_2br7en)}
 ._1bsbgktf{width:20px}
 ._1bsbwgn3{width:calc(100% - 20px)}
 ._1e0c1o8l{display:inline-block}
 ._1e0c1ule{display:block}
+._1e0c5mfb{display:table}
 ._1eab1ooe span{transform:translate(-50%,-50%)}
 ._1t181ssb span{top:50%}
 ._1t981ssb span{left:50%}
+._2hwxidpf{margin-right:0}
 ._4t3igktf{height:20px}
 ._80omtlke{cursor:pointer}
+._bfhk1j28{background-color:transparent}
 ._ca0qidpf{padding-top:0}
 ._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._kqswh2mm{position:relative}
 ._n3tdidpf{padding-bottom:0}
 ._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._otyridpf{margin-bottom:0}
 ._s7n4nkob{vertical-align:middle}
 ._syaz1a5u{color:var(--_1oh641w)}
 ._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
 ._vchhusvi{box-sizing:border-box}
 ._vr2wstnw span{position:absolute}
 ._7ehiu5t6:focus{box-shadow:var(--_ow3z6t)}
-._irr32tgk:hover{background-color:var(--_1y60f1n)}._13roglyw:active, ._1bg4glyw:focus, ._1qb1glyw:hover, ._1dnaglyw:visited{outline-offset:none}
+._irr32tgk:hover{background-color:var(--_1y60f1n)}
+._13roglyw:active, ._1bg4glyw:focus, ._1qb1glyw:hover, ._1dnaglyw:visited{outline-offset:none}
 ._1di618xb:active{background-color:var(--_18th9fi)}
 ._1iohnqa1:active, ._5goinqa1:focus, ._jf4cnqa1:hover, ._1726nqa1:visited{text-decoration-style:solid}
 ._1nrm1r31:active, ._1a3b1r31:focus, ._9oik1r31:hover, ._1ydc1r31:visited{text-decoration-color:currentColor}

package/dist/esm/components/HelpContentButton/styled.js

@@ -3,6 +3,8 @@ import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { B100, B50, N30, N600 } from '@atlaskit/theme/colors';
+var wrappedSpanStyles = null;
+var parentListItemHelpContentButtonContainerStyles = null;
 var helpContentButtonContainerStyles = null;
 export var HelpContentButtonContainer = function HelpContentButtonContainer(_ref) {
   var onClick = _ref.onClick,
@@ -12,14 +14,36 @@ export var HelpContentButtonContainer = function HelpContentButtonContainer(_ref
     tabIndex = _ref.tabIndex,
     target = _ref.target,
     children = _ref.children;
-  return /*#__PURE__*/React.createElement("a", {
+  if (href) {
+    return /*#__PURE__*/React.createElement("li", {
+      className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf"])
+    }, /*#__PURE__*/React.createElement("a", {
+      onClick: onClick,
+      onKeyDown: onKeyDown,
+      href: href,
+      id: id,
+      tabIndex: tabIndex,
+      target: target,
+      className: ax(["_2rko1l7b _19itglyw _bfhk1j28 _11c8376l _1e0c1ule _80omtlke _1bsbb8xr _syaz1a5u _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _7ehiu5t6 _1nrm1r31 _1a3b1r31 _9oik1r31 _1ydc1r31 _c2waglyw _4fprglyw _1bnxglyw _1x28glyw _1iohnqa1 _5goinqa1 _jf4cnqa1 _1726nqa1 _1q5t1r31 _nt751r31 _1dit1r31 _9nxe1r31 _1ohyglyw _49pcglyw _ksodglyw _tpgfglyw _1r9x1o36 _1hvw1o36 _4hz81o36 _12gr1o36 _13roglyw _1bg4glyw _1qb1glyw _1dnaglyw _9h8h1a5u _f8pj1a5u _30l31a5u _10531a5u _irr32tgk _1di618xb"]),
+      style: {
+        "--_2br7en": ix("calc(100% - ".concat("var(--ds-space-200, 16px)", ")")),
+        "--_1oh641w": ix("var(--ds-text-subtle, ".concat(N600, ")")),
+        "--_ow3z6t": ix("".concat("var(--ds-border-focused, ".concat(B100, ")"), " 0 0 0 2px inset")),
+        "--_1y60f1n": ix("var(--ds-background-neutral-subtle-hovered, ".concat(N30, ")")),
+        "--_18th9fi": ix("var(--ds-background-neutral-subtle-pressed, ".concat(B50, ")"))
+      }
+    }, /*#__PURE__*/React.createElement("span", {
+      className: ax(["_1e0c5mfb"])
+    }, children)));
+  }
+  return /*#__PURE__*/React.createElement("li", {
+    className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf"])
+  }, /*#__PURE__*/React.createElement("button", {
     onClick: onClick,
     onKeyDown: onKeyDown,
-    href: href,
     id: id,
     tabIndex: tabIndex,
-    target: target,
-    className: ax(["_2rko1l7b _1e0c1ule _80omtlke _1bsbb8xr _syaz1a5u _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _7ehiu5t6 _1nrm1r31 _1a3b1r31 _9oik1r31 _1ydc1r31 _c2waglyw _4fprglyw _1bnxglyw _1x28glyw _1iohnqa1 _5goinqa1 _jf4cnqa1 _1726nqa1 _1q5t1r31 _nt751r31 _1dit1r31 _9nxe1r31 _1ohyglyw _49pcglyw _ksodglyw _tpgfglyw _1r9x1o36 _1hvw1o36 _4hz81o36 _12gr1o36 _13roglyw _1bg4glyw _1qb1glyw _1dnaglyw _9h8h1a5u _f8pj1a5u _30l31a5u _10531a5u _irr32tgk _1di618xb"]),
+    className: ax(["_2rko1l7b _19itglyw _bfhk1j28 _11c8376l _1e0c1ule _80omtlke _1bsbb8xr _syaz1a5u _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _7ehiu5t6 _1nrm1r31 _1a3b1r31 _9oik1r31 _1ydc1r31 _c2waglyw _4fprglyw _1bnxglyw _1x28glyw _1iohnqa1 _5goinqa1 _jf4cnqa1 _1726nqa1 _1q5t1r31 _nt751r31 _1dit1r31 _9nxe1r31 _1ohyglyw _49pcglyw _ksodglyw _tpgfglyw _1r9x1o36 _1hvw1o36 _4hz81o36 _12gr1o36 _13roglyw _1bg4glyw _1qb1glyw _1dnaglyw _9h8h1a5u _f8pj1a5u _30l31a5u _10531a5u _irr32tgk _1di618xb"]),
     style: {
       "--_2br7en": ix("calc(100% - ".concat("var(--ds-space-200, 16px)", ")")),
       "--_1oh641w": ix("var(--ds-text-subtle, ".concat(N600, ")")),
@@ -27,7 +51,9 @@ export var HelpContentButtonContainer = function HelpContentButtonContainer(_ref
       "--_1y60f1n": ix("var(--ds-background-neutral-subtle-hovered, ".concat(N30, ")")),
       "--_18th9fi": ix("var(--ds-background-neutral-subtle-pressed, ".concat(B50, ")"))
     }
-  }, children);
+  }, /*#__PURE__*/React.createElement("span", {
+    className: ax(["_1e0c5mfb"])
+  }, children)));
 };
 var helpContentButtonIconStyles = null;
 export var HelpContentButtonIcon = function HelpContentButtonIcon(_ref2) {

package/dist/esm/components/RelatedArticles/index.js

@@ -20,7 +20,7 @@ import { RelatedArticlesTitle } from './styled';
 import useCancellablePromise from '../../util/hooks/cancellablePromise';
 import { usePrevious } from '../../util/hooks/previous';
 var packageName = "@atlaskit/help";
-var packageVersion = "9.0.2";
+var packageVersion = "9.0.3";
 var buttonStyles = null;
 export var RelatedArticles = function RelatedArticles(_ref) {
   var _ref$style = _ref.style,

package/dist/esm/components/Search/SearchInput/index.js

@@ -19,7 +19,7 @@ import { useNavigationContext } from '../../contexts/navigationContext';
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'searchInput',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 var buttonStyles = null;
 export var SearchInput = function SearchInput(_ref) {

package/dist/esm/components/WhatsNew/WhatsNewButton/index.js

@@ -11,7 +11,7 @@ import { ARTICLE_TYPE } from '../../../model/Help';
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'WhatsNewButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export var WhatsNewButton = function WhatsNewButton(_ref) {
   var productName = _ref.productName,

package/dist/esm/components/WhatsNew/WhatsNewResults/WhatsNewResultsList/WhatsNewResultItem/index.js

@@ -8,7 +8,7 @@ import { WhatsNewResultListItemWrapper, WhatsNewResultListItemTitleContainer, Wh
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticlesListItem',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.2"
+  packageVersion: "9.0.3"
 };
 export var WhatsNewResultListItem = function WhatsNewResultListItem(_ref) {
   var formatMessage = _ref.intl.formatMessage,

package/dist/esm/components/styled.compiled.css

@@ -1,9 +1,12 @@
 
+._qtt8glyw{list-style:none}
 ._v5641tic{transition:var(--_m9bkgq)}
 ._x3do3yx5{border-top:var(--_1it2dty)}._16jlkb7n{flex-grow:1}
 ._18m91wug{overflow-y:auto}
+._18u0idpf{margin-left:0}
 ._19bvidpf{padding-left:0}
 ._19bvpxbi{padding-left:var(--ds-space-200,1pc)}
+._19pkidpf{margin-top:0}
 ._19pkou31{margin-top:var(--ds-space-200,14px)}
 ._1bah1yb4{justify-content:space-between}
 ._1bsb1osq{width:100%}
@@ -17,19 +20,23 @@
 ._1reo1wug{overflow-x:auto}
 ._1tkeidpf{min-height:0}
 ._1wpz1wug{align-self:auto}
+._2hwxidpf{margin-right:0}
 ._2lx21bp4{flex-direction:column}
 ._4cvr1y6m{align-items:flex-start}
 ._4t3i1osq{height:100%}
 ._4t3ixy5q{height:var(--ds-space-400,2pc)}
 ._ae4v1fhb{align-content:stretch}
 ._bfhk1v7z{background-color:var(--_1xglsrh)}
+._ca0qidpf{padding-top:0}
 ._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
 ._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._i0dl1wug{flex-basis:auto}
 ._kqswh2mm{position:relative}
 ._kqswstnw{position:absolute}
+._n3tdidpf{padding-bottom:0}
 ._n3tdpxbi{padding-bottom:var(--ds-space-200,1pc)}
 ._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._otyridpf{margin-bottom:0}
 ._tzy4idpf{opacity:0}
 ._u5f3idpf{padding-right:0}
 ._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}

package/dist/esm/components/styled.js

@@ -40,7 +40,7 @@ export var Home = function Home(_ref4) {
       display: isOverlayFullyVisible ? 'none' : 'block',
       overflow: isOverlayVisible ? 'hidden' : 'auto'
     },
-    className: ax(["_1reo1wug _18m91wug _1e0c1ule _4t3i1osq _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _vchhusvi"])
+    className: ax(["_1reo1wug _18m91wug _1e0c1ule _4t3i1osq _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _vchhusvi _19pkidpf"])
   }, children);
 };
 var homeAiStyles = null;
@@ -53,7 +53,7 @@ export var HomeAi = function HomeAi(_ref5) {
       display: isOverlayFullyVisible ? 'none' : 'block',
       overflow: isOverlayVisible ? 'hidden' : 'auto'
     },
-    className: ax(["_1reo1wug _18m91wug _1e0c1ule _19bvpxbi _u5f3pxbi _n3tdpxbi _vchhusvi"])
+    className: ax(["_1reo1wug _18m91wug _1e0c1ule _19bvpxbi _u5f3pxbi _n3tdpxbi _vchhusvi _19pkidpf"])
   }, children);
 };
 var helpFooterStyles = null;
@@ -89,4 +89,11 @@ export var BackButtonContainer = function BackButtonContainer(_ref7) {
       "--_m9bkgq": ix("left ".concat(BACK_BUTTON_CONTAINER_TRANSITION_DURATION_MS, "ms, opacity ").concat(BACK_BUTTON_CONTAINER_TRANSITION_DURATION_MS, "ms"))
     })
   }, children);
+};
+var ulStyles = null;
+export var StyledUl = function StyledUl(_ref8) {
+  var children = _ref8.children;
+  return /*#__PURE__*/React.createElement("ul", {
+    className: ax(["_qtt8glyw _19pkidpf _2hwxidpf _otyridpf _18u0idpf _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf"])
+  }, children);
 };

package/dist/types/components/styled.d.ts

@@ -29,4 +29,7 @@ export declare const BackButtonContainer: ({ transitionState, children, }: {
     transitionState: TransitionStatus;
     children: React.ReactNode;
 }) => JSX.Element;
+export declare const StyledUl: ({ children }: {
+    children: React.ReactNode;
+}) => JSX.Element;
 export {};