@atlaskit/help 9.4.10 → 9.4.12

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

@@ -3,13 +3,12 @@ import _extends from "@babel/runtime/helpers/extends";
 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(["_11c81e3o _syaz1fxt _ca0qpxbi _u5f3idpf _n3tdpxbi _19bvidpf"])
+  className: ax(["_11c81e3o _syazi7uo _ca0qpxbi _u5f3idpf _n3tdpxbi _19bvidpf"])
 }, /*#__PURE__*/React.createElement(Heading, {
   size: "large",
   as: "h3",

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

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

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

@@ -3,7 +3,7 @@
 ._18u01ejb{margin-left:var(--ds-space-300,24px)}
 ._18u01i6y{margin-left:var(--ds-space-negative-025,-2px)}
 ._19bv1b66{padding-left:var(--ds-space-050,4px)}
-._19pkou31{margin-top:var(--ds-space-200,14px)}
+._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
 ._1bsb1ejb{width:var(--ds-space-300,24px)}
 ._1bsb1j1s{width:calc(100% - var(--ds-space-300, 24px) - var(--ds-space-300, 24px))}
 ._1bsb1osq{width:100%}
@@ -25,6 +25,6 @@
 ._kqswh2mm{position:relative}
 ._nbgx1ejb>span{width:var(--ds-space-300,24px)}
 ._o5721q9c{white-space:nowrap}
-._otyrou31{margin-bottom:var(--ds-space-200,14px)}
+._otyrpxbi{margin-bottom:var(--ds-space-200,1pc)}
 ._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
 ._vchhusvi{box-sizing:border-box}

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

@@ -12,7 +12,7 @@ const searchInputContainerAiStyles = null;
 export const SearchInputContainerAi = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
-  className: ax(["_16jlidpf _1o9zkb7n _i0dl1wug _1bsb1j1s _4t3ixy5q _18u01ejb _2hwx1ejb _19pkou31 _otyrou31 _1f49idpf _1wpz1wug _vchhusvi"])
+  className: ax(["_16jlidpf _1o9zkb7n _i0dl1wug _1bsb1j1s _4t3ixy5q _18u01ejb _2hwx1ejb _19pkpxbi _otyrpxbi _1f49idpf _1wpz1wug _vchhusvi"])
 }, children);
 const searchIconContainerStyles = null;
 export const SearchIconContainer = ({

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

@@ -1,6 +1,5 @@
 import React from 'react';
 import { useAnalyticsEvents, AnalyticsContext } from '@atlaskit/analytics-next';
-import * as colors from '@atlaskit/theme/colors';
 import Button from '@atlaskit/button';
 import ShortcutIcon from '@atlaskit/icon/core/link-external';
 import { injectIntl } from 'react-intl-next';
@@ -35,7 +34,7 @@ export const SearchExternalSite = ({
     appearance: "link",
     iconAfter: /*#__PURE__*/React.createElement(ShortcutIcon, {
       label: "",
-      color: `var(--ds-icon-subtle, ${colors.N90})`
+      color: "var(--ds-icon-subtle, #505258)"
     }),
     spacing: "compact",
     href: searchExternalUrl,

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

@@ -1,6 +1,5 @@
 import React from 'react';
 import { useAnalyticsEvents, AnalyticsContext } from '@atlaskit/analytics-next';
-import * as colors from '@atlaskit/theme/colors';
 import Button from '@atlaskit/button';
 import ShortcutIcon from '@atlaskit/icon/core/link-external';
 import { injectIntl } from 'react-intl-next';
@@ -36,7 +35,7 @@ export const SearchResultsEmpty = ({
     appearance: "link",
     iconAfter: /*#__PURE__*/React.createElement(ShortcutIcon, {
       label: "",
-      color: `var(--ds-icon-subtle, ${colors.N90})`
+      color: "var(--ds-icon-subtle, #505258)"
     }),
     spacing: "compact",
     href: searchExternalUrl,

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

@@ -1,8 +1,8 @@
 ._11c8fhey{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._v5643rtd{transition:opacity .44s}
-._125x1wmz p{color:var(--ds-text-subtlest,#6b778c)}
-._154i1eca{top:var(--ds-space-800,60px)}
+._125x1rpy p{color:var(--ds-text-subtlest,#6b6e76)}
 ._154iidpf{top:0}
+._154ixncg{top:var(--ds-space-800,4pc)}
 ._16jlkb7n{flex-grow:1}
 ._18m91wug{overflow-y:auto}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
@@ -13,7 +13,7 @@
 ._1reo15vq{overflow-x:hidden}
 ._2lx21bp4{flex-direction:column}
 ._3um015vq{visibility:hidden}
-._4t3i1kz6{height:calc(100% - var(--ds-space-800, 60px))}
+._4t3i11fm{height:calc(100% - var(--ds-space-800, 4pc))}
 ._4t3i1osq{height:100%}
 ._bfhkvuon{background-color:var(--ds-surface,#fff)}
 ._ca0q1ejb{padding-top:var(--ds-space-300,24px)}
@@ -23,7 +23,7 @@
 ._kqswstnw{position:absolute}
 ._n3td1ejb{padding-bottom:var(--ds-space-300,24px)}
 ._n3tdidpf{padding-bottom:0}
-._syaz10s3{color:var(--ds-text,#42526e)}
+._syazi7uo{color:var(--ds-text,#292a2e)}
 ._tzy4idpf{opacity:0}
 ._u5f31ejb{padding-right:var(--ds-space-300,24px)}
 ._u5f3pxbi{padding-right:var(--ds-space-200,1pc)}

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

@@ -2,7 +2,6 @@
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-import { N200, N500 } from '@atlaskit/theme/colors';
 export const FADEIN_OVERLAY_TRANSITION_DURATION_MS = 440;
 const searchResultsContainerStyles = null;
 const transitionStyles = {
@@ -39,7 +38,7 @@ export const SearchResultsContainerAi = /*#__PURE__*/React.forwardRef(({
 }, ref) => /*#__PURE__*/React.createElement("div", {
   ref: ref,
   style: transitionStyles[transitionState],
-  className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _v5643rtd _kqswstnw _4t3i1kz6 _1bsb1osq _154i1eca _bfhkvuon _2lx21bp4 _vchhusvi _1reo15vq _18m91wug _1pbyzo7u _ca0qidpf _u5f3pxbi _n3tdidpf _19bvpxbi _tzy4idpf _3um015vq"])
+  className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _v5643rtd _kqswstnw _4t3i11fm _1bsb1osq _154ixncg _bfhkvuon _2lx21bp4 _vchhusvi _1reo15vq _18m91wug _1pbyzo7u _ca0qidpf _u5f3pxbi _n3tdidpf _19bvpxbi _tzy4idpf _3um015vq"])
 }, children));
 SearchResultsContainerAi.displayName = 'SearchResultsContainerAi';
 const searchResultEmptyMessageImageStyles = null;
@@ -52,17 +51,17 @@ const searchResultEmptyMessageTextStyles = null;
 export const SearchResultEmptyMessageText = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
-  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1wmz"])
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1rpy"])
 }, children);
 const searchResultEmptyMessageHeaderTextStyles = null;
 export const SearchResultEmptyMessageHeaderText = ({
   children
 }) => /*#__PURE__*/React.createElement("h2", {
-  className: ax(["_11c8fhey _syaz10s3 _k48pwu06"])
+  className: ax(["_11c8fhey _syazi7uo _k48pwu06"])
 }, children);
 const searchResultSearchExternalSiteContainerStyles = null;
 export const SearchResultSearchExternalSiteContainer = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
-  className: ax(["_ca0q1ejb _u5f31ejb _n3td1ejb _19bv1ejb _y3gn1h6o _125x1wmz"])
+  className: ax(["_ca0q1ejb _u5f31ejb _n3td1ejb _19bv1ejb _y3gn1h6o _125x1rpy"])
 }, children);

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

@@ -1,6 +1,5 @@
 import React, { useCallback } from 'react';
 import { AnalyticsContext } from '@atlaskit/analytics-next';
-import * as colors from '@atlaskit/theme/colors';
 import LightbulbIcon from '@atlaskit/icon/core/lightbulb';
 import { injectIntl } from 'react-intl-next';
 import { useWhatsNewArticleContext } from '../../contexts/whatsNewArticleContext';
@@ -11,7 +10,7 @@ import { ARTICLE_TYPE } from '../../../model/Help';
 const ANALYTICS_CONTEXT_DATA = {
   componentName: 'WhatsNewButton',
   packageName: "@atlaskit/help",
-  packageVersion: "0.0.0-development"
+  packageVersion: "9.4.11"
 };
 export const WhatsNewButton = ({
   productName,
@@ -45,7 +44,7 @@ export const WhatsNewButton = ({
       productName
     }) : formatMessage(messages.help_whats_new_button_label_without_product_name),
     icon: /*#__PURE__*/React.createElement(LightbulbIcon, {
-      color: `var(--ds-icon-subtle, ${colors.N600})`,
+      color: "var(--ds-icon-subtle, #505258)",
       spacing: "spacious",
       label: ""
     })

package/dist/es2019/components/WhatsNew/WhatsNewResults/WhatsNewResultsEmpty/styled.compiled.css

@@ -1,4 +1,4 @@
-._125x1wmz p{color:var(--ds-text-subtlest,#6b778c)}
+._125x1rpy p{color:var(--ds-text-subtlest,#6b6e76)}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
 ._ca0q1ejb{padding-top:var(--ds-space-300,24px)}
 ._n3tdidpf{padding-bottom:0}

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

@@ -2,7 +2,6 @@
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-import { N200 } from '@atlaskit/theme/colors';
 const whatsNewResultsEmptyMessageImageStyles = null;
 export const WhatsNewResultsEmptyMessageImage = ({
   children
@@ -13,5 +12,5 @@ const whatsNewResultsEmptyMessageTextStyles = null;
 export const WhatsNewResultsEmptyMessageText = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
-  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1wmz"])
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1rpy"])
 }, children);

package/dist/es2019/components/WhatsNew/WhatsNewResults/WhatsNewResultsError/styled.compiled.css

@@ -1,4 +1,4 @@
-._125x1wmz p{color:var(--ds-text-subtlest,#6b778c)}
+._125x1rpy p{color:var(--ds-text-subtlest,#6b6e76)}
 ._19bv1ejb{padding-left:var(--ds-space-300,24px)}
 ._ca0q1ejb{padding-top:var(--ds-space-300,24px)}
 ._n3tdidpf{padding-bottom:0}

package/dist/es2019/components/WhatsNew/WhatsNewResults/WhatsNewResultsError/styled.js

@@ -2,7 +2,6 @@
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-import { N200 } from '@atlaskit/theme/colors';
 const searchResultEmptyMessageImageStyles = null;
 export const SearchResultEmptyMessageImage = ({
   children
@@ -13,5 +12,5 @@ const searchResultEmptyMessageTextStyles = null;
 export const SearchResultEmptyMessageText = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
-  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1wmz"])
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1rpy"])
 }, children);

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: "0.0.0-development"
+  packageVersion: "9.4.11"
 };
 export const WhatsNewResultListItem = ({
   intl: {

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

@@ -13,7 +13,7 @@
 ._4bfu1r31{text-decoration-color:currentColor}
 ._80omtlke{cursor:pointer}
 ._ajmmnqa1{text-decoration-style:solid}
-._bfhktxrc{background-color:var(--ds-background-neutral-subtle,#fff)}
+._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
 ._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
 ._kqswh2mm{position:relative}
 ._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
@@ -22,8 +22,8 @@
 ._otyr1b66{margin-bottom:var(--ds-space-050,4px)}
 ._otyridpf{margin-bottom:0}
 ._s7n4nkob{vertical-align:middle}
-._syaz1fxt{color:var(--ds-text,#172b4d)}
-._syaz1wmz{color:var(--ds-text-subtlest,#6b778c)}
+._syaz1rpy{color:var(--ds-text-subtlest,#6b6e76)}
+._syazi7uo{color:var(--ds-text,#292a2e)}
 ._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
 ._vchhusvi{box-sizing:border-box}
 ._vwz4gktf{line-height:20px}
@@ -41,18 +41,18 @@
 ._49pcglyw:focus{outline-style:none}
 ._4fprglyw:focus{text-decoration-line:none}
 ._5goinqa1:focus{text-decoration-style:solid}
-._7ehi1ssq:focus{box-shadow:var(--ds-border-focused,#4c9aff) 0 0 0 2px inset}
+._7ehiksal:focus{box-shadow:var(--ds-border-focused,#4688ec) 0 0 0 2px inset}
 ._nt751r31:focus{outline-color:currentColor}
 ._1bnxglyw:hover{text-decoration-line:none}
 ._1dit1r31:hover{outline-color:currentColor}
 ._1qb1glyw:hover{outline-offset:none}
 ._4hz81o36:hover{outline-width:medium}
 ._9oik1r31:hover{text-decoration-color:currentColor}
-._irr314ae:hover{background-color:var(--ds-background-neutral-subtle-hovered,#ebecf0)}
+._irr31dpa:hover{background-color:var(--ds-background-neutral-subtle-hovered,#0515240f)}
 ._jf4cnqa1:hover{text-decoration-style:solid}
 ._ksodglyw:hover{outline-style:none}
 ._13roglyw:active{outline-offset:none}
-._1di61l7b:active{background-color:var(--ds-background-neutral-subtle-pressed,#deebff)}
+._1di6fcek:active{background-color:var(--ds-background-neutral-subtle-pressed,#0b120e24)}
 ._1iohnqa1:active{text-decoration-style:solid}
 ._1nrm1r31:active{text-decoration-color:currentColor}
 ._1ohyglyw:active{outline-style:none}

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

@@ -3,7 +3,6 @@ import _extends from "@babel/runtime/helpers/extends";
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-import { B100, B50, N0, N200, N30, N800 } from '@atlaskit/theme/colors';
 const whatsNewResultListItemWrapperStyles = null;
 export const WhatsNewResultListItemWrapper = ({
   styles,
@@ -12,7 +11,7 @@ export const WhatsNewResultListItemWrapper = ({
 }) => /*#__PURE__*/React.createElement("button", _extends({
   style: styles
 }, rest, {
-  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"])
+  className: ax(["_4bfu1r31 _1hmsglyw _ajmmnqa1 _2rko1l7b _kqswh2mm _vchhusvi _ca0qu2gc _u5f3u2gc _n3tdu2gc _19bvu2gc _1e0c1ule _80omtlke _syaz1rpy _bfhksm61 _y3gn1e5h _7ehiksal _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 _irr31dpa _1di6fcek"])
 }), children);
 const whatsNewResultListItemTitleContainerStyles = null;
 export const WhatsNewResultListItemTitleContainer = ({
@@ -30,5 +29,5 @@ const whatsNewResultListItemDescriptionStyles = null;
 export const WhatsNewResultListItemDescription = ({
   children
 }) => /*#__PURE__*/React.createElement("p", {
-  className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf _1e0c1ule _vwz4gktf _syaz1fxt"])
+  className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf _1e0c1ule _vwz4gktf _syazi7uo"])
 }, children);

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

@@ -1,5 +1,4 @@
 import React, { useEffect, useState } from 'react';
-import * as colors from '@atlaskit/theme/colors';
 import toDate from 'date-fns/toDate';
 import isYesterday from 'date-fns/isYesterday';
 import isToday from 'date-fns/isToday';
@@ -36,9 +35,7 @@ const WhatsNewResultsList = ({
       key: key
     }, /*#__PURE__*/React.createElement(WhatsNewResultsListGroupTitle, null, whatsNewArticlesGroupedByDate[key].title), whatsNewArticlesGroupedByDate[key].items.map((whatsNewArticle, i) => /*#__PURE__*/React.createElement(WhatsNewResultItem, {
       styles: {
-        border: style === 'secondary' ?
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-        `2px solid ${`var(--ds-border, ${colors.N30})`}` : 0,
+        border: style === 'secondary' ? `2px solid ${"var(--ds-border, #0B120E24)"}` : 0,
         padding: style === 'secondary' ? `${"var(--ds-space-100, 8px)"} ${"var(--ds-space-200, 16px)"}` : `${"var(--ds-space-100, 8px)"}`,
         marginBottom: style === 'secondary' ? `${"var(--ds-space-150, 12px)"}` : 0
       },

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

@@ -7,6 +7,6 @@
 ._k48pwu06{font-weight:var(--ds-font-weight-bold,653)}
 ._kqswh2mm{position:relative}
 ._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
-._syaz1wmz{color:var(--ds-text-subtlest,#6b778c)}
+._syaz1rpy{color:var(--ds-text-subtlest,#6b6e76)}
 ._u5f3idpf{padding-right:0}
 ._u5f3u2gc{padding-right:var(--ds-space-100,8px)}

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

@@ -2,7 +2,6 @@
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-import { N200 } from '@atlaskit/theme/colors';
 const whatsNewResultsListContainerStyles = null;
 export const WhatsNewResultsListContainer = ({
   children
@@ -21,5 +20,5 @@ const whatsNewResultsListGroupTitleStyles = null;
 export const WhatsNewResultsListGroupTitle = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
-  className: ax(["_11c8wadc _syaz1wmz _k48pwu06 _ca0qidpf _u5f3u2gc _n3tdu2gc _19bvu2gc _1p1dangw"])
+  className: ax(["_11c8wadc _syaz1rpy _k48pwu06 _ca0qidpf _u5f3u2gc _n3tdu2gc _19bvu2gc _1p1dangw"])
 }, children);

package/dist/es2019/components/WhatsNew/WhatsNewResults/index.compiled.css

@@ -1,6 +1,6 @@
 
-._v5643rtd{transition:opacity .44s}._154i1eca{top:var(--ds-space-800,60px)}
-._154iidpf{top:0}
+._v5643rtd{transition:opacity .44s}._154iidpf{top:0}
+._154ixncg{top:var(--ds-space-800,4pc)}
 ._16jlkb7n{flex-grow:1}
 ._18m91wug{overflow-y:auto}
 ._19bvpxbi{padding-left:var(--ds-space-200,1pc)}

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

@@ -120,7 +120,7 @@ export const WhatsNewResults = ({
       // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
       ...transitionStyles[state]
     },
-    className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _n3tdpxbi _19bvpxbi _u5f3pxbi _kqswstnw _1bsb1osq _154i1eca _bfhkvuon _2lx21bp4 _vchhusvi _1reo15vq _18m91wug _1pbykb7n"])
+    className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _n3tdpxbi _19bvpxbi _u5f3pxbi _kqswstnw _1bsb1osq _154ixncg _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(Label, {
     htmlFor: "help_whats_new_filter_select_label"
   }, formatMessage(messages.help_whats_new_filter_select_label)), /*#__PURE__*/React.createElement(Select, {

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

@@ -1,13 +1,13 @@
 
 ._qtt8glyw{list-style:none}
 ._v5641kd4{transition:left .22s,opacity .22s}
-._x3do1mqz{border-top:var(--ds-border-width-selected,2px) solid var(--ds-border,#ebecf0)}._16jlkb7n{flex-grow:1}
+._x3do1uh4{border-top:var(--ds-border-width-selected,2px) solid var(--ds-border,#0b120e24)}._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)}
+._19pkpxbi{margin-top:var(--ds-space-200,1pc)}
 ._1bah1yb4{justify-content:space-between}
 ._1bsb1osq{width:100%}
 ._1e0c1txw{display:flex}
@@ -26,7 +26,7 @@
 ._4t3i1osq{height:100%}
 ._4t3ixy5q{height:var(--ds-space-400,2pc)}
 ._ae4v1fhb{align-content:stretch}
-._bfhk1gi7{background-color:var(--ds-background-neutral,#fafbfc)}
+._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
 ._ca0qidpf{padding-top:0}
 ._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
 ._ca0qu2gc{padding-top:var(--ds-space-100,8px)}

package/dist/es2019/components/styled.js

@@ -3,7 +3,6 @@ import _extends from "@babel/runtime/helpers/extends";
 import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
-import { N10, N30 } from '@atlaskit/theme/colors';
 const helpBodyContainerStyles = null;
 export const HelpBodyContainer = ({
   children
@@ -51,7 +50,7 @@ export const HelpFooter = ({
   children,
   ...rest
 }) => /*#__PURE__*/React.createElement("div", _extends({}, rest, {
-  className: ax(["_x3do1mqz _ca0qu2gc _u5f3idpf _n3tdu2gc _19bvidpf _vchhusvi _1bsb1osq _bfhk1gi7 _1bah1yb4"])
+  className: ax(["_x3do1uh4 _ca0qu2gc _u5f3idpf _n3tdu2gc _19bvidpf _vchhusvi _1bsb1osq _bfhki8nm _1bah1yb4"])
 }), children);
 export const BACK_BUTTON_CONTAINER_TRANSITION_DURATION_MS = 220;
 const backButtonContainerStyles = null;
@@ -72,7 +71,7 @@ export const BackButtonContainer = /*#__PURE__*/React.forwardRef(({
   ref: ref,
   // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
   style: backButtonContainerTransitionStyles[transitionState],
-  className: ax(["_v5641kd4 _kqswstnw _19pkou31 _1ltv1ejb _4t3ixy5q _tzy4idpf"])
+  className: ax(["_v5641kd4 _kqswstnw _19pkpxbi _1ltv1ejb _4t3ixy5q _tzy4idpf"])
 }, children));
 BackButtonContainer.displayName = 'BackButtonContainer';
 const ulStyles = null;

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

@@ -7,7 +7,7 @@
 ._1bsb1osq{width:100%}
 ._1bsbpxbi{width:var(--ds-space-200,1pc)}
 ._1e0c1o8l{display:inline-block}
-._1itk67kk{background-image:linear-gradient(to right,var(--ds-background-neutral-subtle,#ebecf0) 10%,var(--ds-background-neutral,#dfe1e6) 20%,var(--ds-background-neutral-subtle,#ebecf0) 30%)}
+._1itkesoe{background-image:linear-gradient(to right,var(--ds-background-neutral-subtle,#00000000) 10%,var(--ds-background-neutral,#0515240f) 20%,var(--ds-background-neutral-subtle,#00000000) 30%)}
 ._1jrq1osq>img>svg{width:100%}
 ._1o51q7pw{animation-fill-mode:forwards}
 ._1pglp3kn{animation-timing-function:linear}
@@ -16,8 +16,8 @@
 ._5s2h1ssb>img{left:50%}
 ._5sag126j{animation-duration:1.2s}
 ._9qcx1ooe>img{transform:translate(-50%,-50%)}
-._bfhk1yrq{background-color:var(--ds-background-neutral,#ebecf0)}
-._bfhkpt7r{background-color:var(--ds-border,rgba(9,30,66,.08))}
+._bfhk1l7x{background-color:var(--ds-border,#0b120e24)}
+._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
 ._ca0qidpf{padding-top:0}
 ._iu1x1wgc>img{width:calc(100% - var(--ds-space-050, 4px))}
 ._j7hq1en8{animation-name:k6xje6p}

package/dist/es2019/util/styled.js

@@ -3,13 +3,12 @@ import "./styled.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useEffect, useState } from 'react';
 import { WHATS_NEW_ITEM_TYPES } from '../model/WhatsNew';
-import { B500, G300, N30, N30A, N40, N400, N700, P500, Y200 } from '@atlaskit/theme/colors';
 const dividerLineStyles = null;
 export const DividerLine = ({
   style
 }) => /*#__PURE__*/React.createElement("div", {
   style: style,
-  className: ax(["_bfhkpt7r _4t3iyh40 _1bsb1osq _ca0qidpf _u5f3pxbi _n3tdidpf _19bvpxbi _19pkpxbi _vchhusvi"])
+  className: ax(["_bfhk1l7x _4t3iyh40 _1bsb1osq _ca0qidpf _u5f3pxbi _n3tdidpf _19bvpxbi _19pkpxbi _vchhusvi"])
 });
 
 /**
@@ -31,33 +30,33 @@ export const LoadingRectangle = ({
     marginTop: marginTop !== null && marginTop !== void 0 ? marginTop : "var(--ds-space-100, 8px)",
     width: contentWidth !== null && contentWidth !== void 0 ? contentWidth : '100%'
   },
-  className: ax(["_2rkolb4i _1e0c1o8l _s7n4nkob _kqswh2mm _5sag126j _1o51q7pw _tip812c5 _j7hq1en8 _1pglp3kn _bfhk1yrq _1itk67kk _12vemgnk"])
+  className: ax(["_2rkolb4i _1e0c1o8l _s7n4nkob _kqswh2mm _5sag126j _1o51q7pw _tip812c5 _j7hq1en8 _1pglp3kn _bfhki8nm _1itkesoe _12vemgnk"])
 });
 const whatsNewTypeIconStyles = null;
 export const WhatsNewTypeIcon = ({
   type,
   children
 }) => {
-  const [backgroundColor, setBackgroundColor] = useState(`var(--ds-icon, ${N400})`);
+  const [backgroundColor, setBackgroundColor] = useState("var(--ds-icon, #292A2E)");
   useEffect(() => {
     switch (type) {
       case WHATS_NEW_ITEM_TYPES.IMPROVEMENT:
-        setBackgroundColor(`var(--ds-icon-warning, ${Y200})`);
+        setBackgroundColor("var(--ds-icon-warning, #E06C00)");
         break;
       case WHATS_NEW_ITEM_TYPES.NEW_FEATURE:
-        setBackgroundColor(`var(--ds-icon-success, ${G300})`);
+        setBackgroundColor("var(--ds-icon-success, #6A9A23)");
         break;
       case WHATS_NEW_ITEM_TYPES.FIX:
-        setBackgroundColor(`var(--ds-icon-information, ${B500})`);
+        setBackgroundColor("var(--ds-icon-information, #357DE8)");
         break;
       case WHATS_NEW_ITEM_TYPES.EXPERIMENT:
-        setBackgroundColor(`var(--ds-icon-discovery, ${P500})`);
+        setBackgroundColor("var(--ds-icon-discovery, #AF59E1)");
         break;
       case WHATS_NEW_ITEM_TYPES.REMOVED:
-        setBackgroundColor(`var(--ds-icon-disabled, ${N700})`);
+        setBackgroundColor("var(--ds-icon-disabled, #080F214A)");
         break;
       default:
-        setBackgroundColor(`var(--ds-icon, ${N400})`);
+        setBackgroundColor("var(--ds-icon, #292A2E)");
     }
   }, [type]);
   return /*#__PURE__*/React.createElement("div", {

package/dist/esm/analytics.js

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

package/dist/esm/assets/WhatsNewIcoExperiment.js

@@ -1,10 +1,9 @@
 import React from 'react';
 import FlaskIcon from '@atlaskit/icon/core/flask';
 import { IconWrapper } from './IconWrapper';
-import { P500 } from '@atlaskit/theme/colors';
 export default function WhatsNewIcoExperiment() {
   return /*#__PURE__*/React.createElement(IconWrapper, {
     Icon: FlaskIcon,
-    appearance: "var(--ds-icon-discovery, ".concat(P500, ")")
+    appearance: "var(--ds-icon-discovery, #AF59E1)"
   });
 }

package/dist/esm/assets/WhatsNewIconFix.js

@@ -1,10 +1,9 @@
 import React from 'react';
 import BugIcon from '@atlaskit/icon/core/bug';
 import { IconWrapper } from './IconWrapper';
-import { B500 } from '@atlaskit/theme/colors';
 export default function WhatsNewIconFix() {
   return /*#__PURE__*/React.createElement(IconWrapper, {
     Icon: BugIcon,
-    appearance: "var(--ds-icon-information, ".concat(B500, ")")
+    appearance: "var(--ds-icon-information, #357DE8)"
   });
 }

package/dist/esm/assets/WhatsNewIconImprovement.js

@@ -1,10 +1,9 @@
 import React from 'react';
 import MegaphoneIcon from '@atlaskit/icon/core/megaphone';
 import { IconWrapper } from './IconWrapper';
-import { Y200 } from '@atlaskit/theme/colors';
 export default function WhatsNewIconImprovement() {
   return /*#__PURE__*/React.createElement(IconWrapper, {
     Icon: MegaphoneIcon,
-    appearance: "var(--ds-icon-warning, ".concat(Y200, ")")
+    appearance: "var(--ds-icon-warning, #E06C00)"
   });
 }

package/dist/esm/assets/WhatsNewIconNew.js

@@ -1,10 +1,9 @@
 import React from 'react';
 import MegaphoneIcon from '@atlaskit/icon/core/megaphone';
 import { IconWrapper } from './IconWrapper';
-import { N400 } from '@atlaskit/theme/colors';
 export default function WhatsNewIconNew() {
   return /*#__PURE__*/React.createElement(IconWrapper, {
     Icon: MegaphoneIcon,
-    appearance: "var(--ds-icon, ".concat(N400, ")")
+    appearance: "var(--ds-icon, #292A2E)"
   });
 }

package/dist/esm/assets/WhatsNewIconRemoved.js

@@ -1,10 +1,9 @@
 import React from 'react';
 import DeleteIcon from '@atlaskit/icon/core/delete';
 import { IconWrapper } from './IconWrapper';
-import { N700 } from '@atlaskit/theme/colors';
 export default function WhatsNewIconRemoved() {
   return /*#__PURE__*/React.createElement(IconWrapper, {
     Icon: DeleteIcon,
-    appearance: "var(--ds-icon-disabled, ".concat(N700, ")")
+    appearance: "var(--ds-icon-disabled, #080F214A)"
   });
 }

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: "0.0.0-development"
+  packageVersion: "9.4.11"
 };
 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: "0.0.0-development"
+  packageVersion: "9.4.11"
 };
 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: "0.0.0-development"
+  packageVersion: "9.4.11"
 };
 export var ArticleWasHelpfulYesButton = function ArticleWasHelpfulYesButton(_ref) {
   var _ref$isSelected = _ref.isSelected,

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

@@ -16,7 +16,6 @@ import { RadioGroup } from '@atlaskit/radio';
 import { Checkbox } from '@atlaskit/checkbox';
 import TextArea from '@atlaskit/textarea';
 import CheckCircleIcon from '@atlaskit/icon/core/status-success';
-import { colors } from '@atlaskit/theme';
 import { Text } from '@atlaskit/primitives/compiled';
 import { messages } from '../../../../messages';
 import ArticleWasHelpfulYesButton from './WasHelpfulYesButton';
@@ -27,7 +26,7 @@ var FEEDBACK_REASON_TEXT_MAX_LENGTH = '16000';
 var ANALYTICS_CONTEXT_DATA = {
   componentName: 'ArticleWasHelpfulForm',
   packageName: "@atlaskit/help",
-  packageVersion: "0.0.0-development"
+  packageVersion: "9.4.11"
 };
 var buttonStyles = null;
 export var ArticleWasHelpfulForm = function ArticleWasHelpfulForm(_ref) {
@@ -241,7 +240,7 @@ export var ArticleWasHelpfulForm = function ArticleWasHelpfulForm(_ref) {
         "aria-label": "Success"
       }, /*#__PURE__*/React.createElement(CheckCircleIcon, {
         spacing: "spacious",
-        color: "var(--ds-icon-success, ".concat(colors.G400, ")"),
+        color: "var(--ds-icon-success, #6A9A23)",
         label: ""
       })), /*#__PURE__*/React.createElement(ArticleFeedbackText, {
         role: "alert",