@atlaskit/help 9.0.1 → 9.0.3

package/dist/cjs/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/cjs/components/styled.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.HomeAi = exports.Home = exports.HelpFooter = exports.HelpBodyContainer = exports.HelpBodyAi = exports.HelpBody = exports.BackButtonContainer = exports.BACK_BUTTON_CONTAINER_TRANSITION_DURATION_MS = void 0;
+exports.StyledUl = exports.HomeAi = exports.Home = exports.HelpFooter = exports.HelpBodyContainer = exports.HelpBodyAi = exports.HelpBody = exports.BackButtonContainer = exports.BACK_BUTTON_CONTAINER_TRANSITION_DURATION_MS = void 0;
 require("./styled.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -47,7 +47,7 @@ var Home = exports.Home = function Home(_ref4) {
       display: isOverlayFullyVisible ? 'none' : 'block',
       overflow: isOverlayVisible ? 'hidden' : 'auto'
     },
-    className: (0, _runtime.ax)(["_1reo1wug _18m91wug _1e0c1ule _4t3i1osq _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _vchhusvi"])
+    className: (0, _runtime.ax)(["_1reo1wug _18m91wug _1e0c1ule _4t3i1osq _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _vchhusvi _19pkidpf"])
   }, children);
 };
 var homeAiStyles = null;
@@ -60,7 +60,7 @@ var HomeAi = exports.HomeAi = function HomeAi(_ref5) {
       display: isOverlayFullyVisible ? 'none' : 'block',
       overflow: isOverlayVisible ? 'hidden' : 'auto'
     },
-    className: (0, _runtime.ax)(["_1reo1wug _18m91wug _1e0c1ule _19bvpxbi _u5f3pxbi _n3tdpxbi _vchhusvi"])
+    className: (0, _runtime.ax)(["_1reo1wug _18m91wug _1e0c1ule _19bvpxbi _u5f3pxbi _n3tdpxbi _vchhusvi _19pkidpf"])
   }, children);
 };
 var helpFooterStyles = null;
@@ -96,4 +96,11 @@ var BackButtonContainer = exports.BackButtonContainer = function BackButtonConta
       "--_m9bkgq": (0, _runtime.ix)("left ".concat(BACK_BUTTON_CONTAINER_TRANSITION_DURATION_MS, "ms, opacity ").concat(BACK_BUTTON_CONTAINER_TRANSITION_DURATION_MS, "ms"))
     })
   }, children);
+};
+var ulStyles = null;
+var StyledUl = exports.StyledUl = function StyledUl(_ref8) {
+  var children = _ref8.children;
+  return /*#__PURE__*/_react.default.createElement("ul", {
+    className: (0, _runtime.ax)(["_qtt8glyw _19pkidpf _2hwxidpf _otyridpf _18u0idpf _ca0qidpf _u5f3idpf _n3tdidpf _19bvidpf"])
+  }, children);
 };

package/dist/cjs/messages.js

@@ -290,5 +290,10 @@ var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
     id: 'help.need_more_help.text',
     defaultMessage: 'Need more help?',
     description: 'Need more help text'
+  },
+  help_whats_new_filter_select_label: {
+    id: 'help.whats_new.filter_select_label',
+    defaultMessage: "Select a Category",
+    description: "Label for the \"Release types\" dropdown"
   }
 });

package/dist/es2019/analytics.js

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

package/dist/es2019/assets/NotFoundImage.js

@@ -1,6 +1,6 @@
 import React from 'react';
 export const svg = `<?xml version="1.0" encoding="UTF-8"?>
-<svg width="100" height="116" viewBox="0 0 100 116" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="100" height="116" aria-hidden="true" viewBox="0 0 100 116" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M0 0H100V116H0V0Z"/>
 <g opacity="0.3">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M14.4783 115.563H23.4169H23.4237C24.2045 115.563 24.8375 114.928 24.8375 114.144C24.8375 113.36 24.2045 112.725 23.4237 112.725H14.4783C13.6975 112.725 13.0645 113.36 13.0645 114.144C13.0645 114.928 13.6975 115.563 14.4783 115.563ZM40.6686 115.563H31.7301C30.9492 115.563 30.3162 114.928 30.3162 114.144C30.3162 113.36 30.9492 112.725 31.7301 112.725H40.6686C41.4495 112.725 42.0825 113.36 42.0825 114.144C42.0825 114.928 41.4495 115.563 40.6686 115.563ZM48.975 115.563H57.9204C58.7013 115.563 59.3343 114.928 59.3343 114.144C59.3343 113.36 58.7013 112.725 57.9204 112.725H48.975C48.1942 112.725 47.5612 113.36 47.5612 114.144C47.5612 114.928 48.1942 115.563 48.975 115.563ZM66.2268 115.563H75.1722C75.953 115.563 76.586 114.928 76.586 114.144C76.586 113.36 75.953 112.725 75.1722 112.725H66.2268C65.446 112.725 64.813 113.36 64.813 114.144C64.813 114.928 65.446 115.563 66.2268 115.563Z" fill="#B3BAC5"/>

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

@@ -10,7 +10,7 @@ import { LoadingErrorMessage, LoadingErrorButtonContainer, LoadingErrorHeading }
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleLoadingFail',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.1"
+  packageVersion: "9.0.3"
 };
 export const ArticleLoadingFail = ({
   onTryAgainButtonClick,

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

@@ -6,7 +6,7 @@ import { messages } from '../../../../messages';
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleWasHelpfulNoButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.1"
+  packageVersion: "9.0.3"
 };
 export const ArticleWasHelpfulNoButton = ({
   isSelected = false,

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

@@ -6,7 +6,7 @@ import { messages } from '../../../../messages';
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleWasHelpfulYesButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.1"
+  packageVersion: "9.0.3"
 };
 export const ArticleWasHelpfulYesButton = ({
   isSelected = false,

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

@@ -4,7 +4,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';
@@ -25,7 +25,7 @@ const FEEDBACK_REASON_TEXT_MAX_LENGTH = '16000';
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleWasHelpfulForm',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.1"
+  packageVersion: "9.0.3"
 };
 const buttonStyles = null;
 export const ArticleWasHelpfulForm = ({
@@ -46,6 +46,7 @@ export const ArticleWasHelpfulForm = ({
   const {
     createAnalyticsEvent
   } = useAnalyticsEvents();
+  const wasHelpfulFormClickedButtonRef = useRef(null);
   const negativeFeedbackReason = [{
     name: 'negativeFeedbackReason',
     value: 'noAccurate',
@@ -64,12 +65,14 @@ export const ArticleWasHelpfulForm = ({
       onWasHelpfulYesButtonClick(event, analyticsEvent);
     }
     setWasHelpful(true);
+    wasHelpfulFormClickedButtonRef.current = event.currentTarget;
   });
   const handleArticleWasHelpfulNoButtonClick = (onWasHelpfulNoButtonClick || onWasHelpfulSubmit) && ((event, analyticsEvent) => {
     if (onWasHelpfulNoButtonClick) {
       onWasHelpfulNoButtonClick(event, analyticsEvent);
     }
     setWasHelpful(false);
+    wasHelpfulFormClickedButtonRef.current = event.currentTarget;
   });
   const radioGroupReasonOnChange = event => {
     setFeedbackReason(event.currentTarget.value);
@@ -111,7 +114,9 @@ export const ArticleWasHelpfulForm = ({
     }
   };
   const onFeedbackSubmitCancel = () => {
+    var _wasHelpfulFormClicke, _wasHelpfulFormClicke2;
     setWasHelpful(null);
+    (_wasHelpfulFormClicke = wasHelpfulFormClickedButtonRef.current) === null || _wasHelpfulFormClicke === void 0 ? void 0 : (_wasHelpfulFormClicke2 = _wasHelpfulFormClicke.focus) === null || _wasHelpfulFormClicke2 === void 0 ? void 0 : _wasHelpfulFormClicke2.call(_wasHelpfulFormClicke);
   };
   const handleTryAgainOnClick = () => {
     const feedback = {
@@ -206,7 +211,9 @@ export const ArticleWasHelpfulForm = ({
           paddingRight: "var(--ds-space-100, 8px)",
           // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
           verticalAlign: 'middle'
-        }
+        },
+        role: "img",
+        "aria-label": "Success"
       }, /*#__PURE__*/React.createElement(CheckCircleIcon, {
         spacing: "spacious",
         color: `var(--ds-icon-success, ${colors.G400})`,

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

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

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

@@ -13,7 +13,7 @@ import { WhatsNewTypeTitle, WhatsNewTitleText, WhatsNewIconContainer, RelatedLin
 const analyticsContextData = {
   componentName: 'ArticlesListItem',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.1"
+  packageVersion: "9.0.3"
 };
 export const WhatsNewArticle = ({
   intl: {

package/dist/es2019/components/ArticlesList/ArticlesList.js

@@ -1,8 +1,12 @@
 import React from 'react';
 import { N30 } from '@atlaskit/theme/colors';
 import AnimateHeight from 'react-animate-height';
+import { Box, xcss } from '@atlaskit/primitives';
 import ArticlesListItem from './ArticlesListItem';
 import { MIN_ITEMS_TO_DISPLAY, ANIMATE_HEIGHT_TRANSITION_DURATION_MS } from './constants';
+const listStyles = xcss({
+  listStyle: 'none'
+});
 const getStyles = style => {
   if (style === 'secondary') {
     return {
@@ -23,8 +27,14 @@ const articlesList = ({
   minItemsToDisplay = MIN_ITEMS_TO_DISPLAY,
   numberOfArticlesToDisplay = MIN_ITEMS_TO_DISPLAY,
   onArticlesListItemClick
-}) => articles && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, articles.slice(0, minItemsToDisplay).map(article => {
-  return /*#__PURE__*/React.createElement(ArticlesListItem, {
+}) => articles && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
+  as: "ul",
+  padding: "space.0"
+}, articles.slice(0, minItemsToDisplay).map(article => {
+  return /*#__PURE__*/React.createElement(Box, {
+    as: "li",
+    xcss: listStyles
+  }, /*#__PURE__*/React.createElement(ArticlesListItem, {
     styles: getStyles(style),
     id: article.id,
     onClick: (event, analyticsEvent) => {
@@ -39,12 +49,18 @@ const articlesList = ({
     trustFactors: article.trustFactors,
     source: article.source,
     lastPublished: article.lastPublished
-  });
+  }));
 })), /*#__PURE__*/React.createElement(AnimateHeight, {
   duration: ANIMATE_HEIGHT_TRANSITION_DURATION_MS,
   easing: "linear",
   height: numberOfArticlesToDisplay > minItemsToDisplay ? 'auto' : 0
-}, articles.slice(minItemsToDisplay, articles.length).map(article => /*#__PURE__*/React.createElement(ArticlesListItem, {
+}, /*#__PURE__*/React.createElement(Box, {
+  as: "ul",
+  padding: "space.0"
+}, articles.slice(minItemsToDisplay, articles.length).map(article => /*#__PURE__*/React.createElement(Box, {
+  as: "li",
+  xcss: listStyles
+}, /*#__PURE__*/React.createElement(ArticlesListItem, {
   styles: getStyles(style),
   id: article.id,
   onClick: (event, analyticsEvent) => {
@@ -59,5 +75,5 @@ const articlesList = ({
   trustFactors: article.trustFactors,
   source: article.source,
   lastPublished: article.lastPublished
-}))));
+}))))));
 export default articlesList;

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

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

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

@@ -3,6 +3,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 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';
 const {
@@ -40,9 +41,12 @@ export const ArticlesListItemLinkIcon = ({
 const articlesListItemTitleTextStyles = null;
 export const ArticlesListItemTitleText = ({
   children
-}) => /*#__PURE__*/React.createElement("p", {
+}) => /*#__PURE__*/React.createElement("div", {
   className: ax(["_4bfu1r31 _1hmsglyw _ajmmnqa1 _11c8140y _1reo15vq _18m915vq _syaz1fxt _1e0c1o8l _o5724jg8 _otyrh9hh"])
-}, children);
+}, /*#__PURE__*/React.createElement(Heading, {
+  size: "xsmall",
+  as: "h3"
+}, children));
 const articlesListItemDescriptionStyles = null;
 export const ArticlesListItemDescription = ({
   children

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

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

package/dist/es2019/components/HelpContent.js

@@ -16,7 +16,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';
@@ -118,13 +118,13 @@ export const HelpContent = ({
   }), /*#__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(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, {
@@ -139,13 +139,13 @@ export const HelpContent = ({
   }, /*#__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(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/es2019/components/HelpContentButton/index.js

@@ -7,7 +7,7 @@ import { HelpContentButtonContainer, HelpContentButtonIcon, HelpContentButtonTex
 const analitycsContextData = {
   componentName: 'HelpContentButton',
   packageName: "@atlaskit/help",
-  packageVersion: "9.0.1"
+  packageVersion: "9.0.3"
 };
 const HelpContentButton = ({
   id = '',

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.1";
+const packageVersion = "9.0.3";
 const buttonStyles = null;
 export const RelatedArticles = ({
   style = 'primary',

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

@@ -4,12 +4,16 @@ import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { N800 } from '@atlaskit/theme/colors';
+import Heading from '@atlaskit/heading';
 const relatedArticlesTitleStyles = null;
 export const RelatedArticlesTitle = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
   className: ax(["_11c8nbxd _syaz1fxt _ca0qpxbi _u5f3idpf _n3tdpxbi _19bvidpf"])
-}, children);
+}, /*#__PURE__*/React.createElement(Heading, {
+  size: "large",
+  color: "color.text"
+}, children));
 
 /**
  * Loading styled-components

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.1"
+  packageVersion: "9.0.3"
 };
 const buttonStyles = null;
 export const SearchInput = ({
@@ -100,7 +100,7 @@ export const SearchInput = ({
       appearance: "subtle",
       onClick: handleOnClearButtonClick,
       spacing: "none",
-      "aria-label": "Clear field",
+      "aria-label": "Clear",
       className: ax(["_1bsb1tcg _4t3i1tcg"])
     }, /*#__PURE__*/React.createElement(EditorCloseIcon, {
       color: "currentColor",

package/dist/es2019/components/Search/SearchResults/SearchResultsError.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import Button from '@atlaskit/button/custom-theme-button';
+import Button from '@atlaskit/button';
 import { injectIntl } from 'react-intl-next';
 import { Text } from '@atlaskit/primitives/compiled';
 import ErrorImage from '../../../assets/ErrorImage';

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.1"
+  packageVersion: "9.0.3"
 };
 export const WhatsNewButton = ({
   productName,

package/dist/es2019/components/WhatsNew/WhatsNewResults/WhatsNewResultsEmpty/index.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { useAnalyticsEvents, AnalyticsContext } from '@atlaskit/analytics-next';
 import { injectIntl } from 'react-intl-next';
 import { Text } from '@atlaskit/primitives/compiled';
+import Button from '@atlaskit/button/new';
 import NotFoundImage from '../../../../assets/NotFoundImage';
 import { messages } from '../../../../messages';
 import { WhatsNewResultsEmptyMessageImage, WhatsNewResultsEmptyMessageText } from './styled';
@@ -30,8 +31,8 @@ export const WhatsNewResultsEmpty = ({
     data: {
       componentName: 'WhatsNewResultsEmpty'
     }
-  }, /*#__PURE__*/React.createElement("a", {
-    href: "#",
+  }, /*#__PURE__*/React.createElement(Button, {
+    appearance: "primary",
     onClick: handleClearFilterLinkClick
   }, formatMessage(messages.help_whats_new_no_results_clear_filter_button_label)), /*#__PURE__*/React.createElement(Text, null, formatMessage(messages.help_whats_new_no_results_clear_filter_info))))));
 };

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.1"
+  packageVersion: "9.0.3"
 };
 export const WhatsNewResultListItem = ({
   intl: {

package/dist/es2019/components/WhatsNew/WhatsNewResults/WhatsNewResultsList/WhatsNewResultItem/styled.compiled.css

@@ -27,6 +27,7 @@
 ._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
 ._vchhusvi{box-sizing:border-box}
 ._vwz4gktf{line-height:20px}
+._y3gn1e5h{text-align:left}
 ._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}

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

@@ -9,10 +9,10 @@ export const WhatsNewResultListItemWrapper = ({
   styles,
   children,
   ...rest
-}) => /*#__PURE__*/React.createElement("a", _extends({
+}) => /*#__PURE__*/React.createElement("button", _extends({
   style: styles
 }, rest, {
-  className: ax(["_4bfu1r31 _1hmsglyw _ajmmnqa1 _2rko1l7b _kqswh2mm _vchhusvi _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1ule _80omtlke _syaz1wmz _bfhktxrc _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 _irr314ae _1di61l7b"])
+  className: ax(["_4bfu1r31 _1hmsglyw _ajmmnqa1 _2rko1l7b _kqswh2mm _vchhusvi _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1ule _80omtlke _syaz1wmz _bfhktxrc _y3gn1e5h _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 _irr314ae _1di61l7b"])
 }), children);
 const whatsNewResultListItemTitleContainerStyles = null;
 export const WhatsNewResultListItemTitleContainer = ({

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

@@ -7,6 +7,7 @@ import { Transition } from 'react-transition-group';
 import isEqual from 'lodash/isEqual';
 import Select from '@atlaskit/select';
 import { injectIntl } from 'react-intl-next';
+import { Label } from '@atlaskit/form';
 import { VIEW } from '../../constants';
 import { messages } from '../../../messages';
 import { WHATS_NEW_ITEM_TYPES } from '../../../model/WhatsNew';
@@ -120,12 +121,15 @@ export const WhatsNewResults = ({
       ...transitionStyles[state]
     },
     className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _n3tdpxbi _19bvpxbi _u5f3pxbi _kqswstnw _1bsb1osq _154i1eca _bfhkvuon _2lx21bp4 _vchhusvi _1reo15vq _18m91wug _1pbykb7n"])
-  }, searchWhatsNewArticlesState === REQUEST_STATE.loading && searchWhatsNewArticlesResult === null && state !== 'exited' && /*#__PURE__*/React.createElement(WhatsNewResultsLoading, null), (searchWhatsNewArticlesState === REQUEST_STATE.done || searchWhatsNewArticlesState === REQUEST_STATE.loading) && searchWhatsNewArticlesResult !== null && state !== 'exited' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectContainer, null, /*#__PURE__*/React.createElement(Select, {
+  }, searchWhatsNewArticlesState === REQUEST_STATE.loading && searchWhatsNewArticlesResult === null && state !== 'exited' && /*#__PURE__*/React.createElement(WhatsNewResultsLoading, null), (searchWhatsNewArticlesState === REQUEST_STATE.done || searchWhatsNewArticlesState === REQUEST_STATE.loading) && searchWhatsNewArticlesResult !== null && state !== 'exited' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectContainer, null, /*#__PURE__*/React.createElement(Label, {
+    htmlFor: "help_whats_new_filter_select_label"
+  }, formatMessage(messages.help_whats_new_filter_select_label)), /*#__PURE__*/React.createElement(Select, {
     defaultValue: selectedOption
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: "single-select",
     classNamePrefix: "react-select",
+    inputId: "help_whats_new_filter_select_label",
     options: [{
       value: '',
       label: formatMessage(messages.help_whats_new_filter_select_option_all)
@@ -175,12 +179,15 @@ export const WhatsNewResults = ({
       ...transitionStyles[state]
     },
     className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _v5643rtd _kqswstnw _4t3i1osq _1bsb1osq _154iidpf _bfhkvuon _2lx21bp4 _vchhusvi _1reo15vq _18m91wug _1pbykb7n _ca0qpxbi _u5f3pxbi _n3tdpxbi _19bvpxbi _tzy4idpf _3um015vq"])
-  }, searchWhatsNewArticlesState === REQUEST_STATE.loading && searchWhatsNewArticlesResult === null && state !== 'exited' && /*#__PURE__*/React.createElement(WhatsNewResultsLoading, null), (searchWhatsNewArticlesState === REQUEST_STATE.done || searchWhatsNewArticlesState === REQUEST_STATE.loading) && searchWhatsNewArticlesResult !== null && state !== 'exited' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectContainer, null, /*#__PURE__*/React.createElement(Select, {
+  }, searchWhatsNewArticlesState === REQUEST_STATE.loading && searchWhatsNewArticlesResult === null && state !== 'exited' && /*#__PURE__*/React.createElement(WhatsNewResultsLoading, null), (searchWhatsNewArticlesState === REQUEST_STATE.done || searchWhatsNewArticlesState === REQUEST_STATE.loading) && searchWhatsNewArticlesResult !== null && state !== 'exited' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectContainer, null, /*#__PURE__*/React.createElement(Label, {
+    htmlFor: "help_whats_new_filter_select_label"
+  }, formatMessage(messages.help_whats_new_filter_select_label)), /*#__PURE__*/React.createElement(Select, {
     defaultValue: selectedOption
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: "single-select",
     classNamePrefix: "react-select",
+    inputId: "help_whats_new_filter_select_label",
     options: [{
       value: '',
       label: formatMessage(messages.help_whats_new_filter_select_option_all)