@atlaskit/help 8.0.9 → 9.0.0

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

@@ -1,80 +1,64 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import * as colors from '@atlaskit/theme/colors';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultsContainer = styled.div({
-  position: 'absolute',
-  height: '100%',
-  width: '100%',
-  top: 0,
-  backgroundColor: "var(--ds-surface, #FFFFFF)",
-  flex: 1,
-  flexDirection: 'column',
-  boxSizing: 'border-box',
-  overflowX: 'hidden',
-  overflowY: 'auto',
-  zIndex: 10,
-  padding: `0 ${"var(--ds-space-200, 16px)"}`
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultsContainerAi = styled.div({
-  position: 'absolute',
-  height: `calc(100% - ${"var(--ds-space-800, 60px)"})`,
-  width: '100%',
-  top: "var(--ds-space-800, 60px)",
-  backgroundColor: "var(--ds-surface, #FFFFFF)",
-  flex: 1,
-  flexDirection: 'column',
-  boxSizing: 'border-box',
-  overflowX: 'hidden',
-  overflowY: 'auto',
-  zIndex: 10,
-  padding: `0 ${"var(--ds-space-200, 16px)"}`
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultsList = styled.div({
-  paddingTop: "var(--ds-space-300, 24px)",
-  position: 'relative'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultEmptyMessageImage = styled.div({
-  padding: `${"var(--ds-space-300, 24px)"} ${"var(--ds-space-300, 24px)"} 0 ${"var(--ds-space-300, 24px)"}`,
-  textAlign: 'center'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultEmptyMessageText = styled.div({
-  padding: `${"var(--ds-space-300, 24px)"} ${"var(--ds-space-300, 24px)"} 0 ${"var(--ds-space-300, 24px)"}`,
-  textAlign: 'center',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  p: {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    color: `var(--ds-text-subtlest, ${colors.N200})`
+/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+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 = {
+  entering: {
+    opacity: 1,
+    visibility: 'visible'
+  },
+  entered: {
+    opacity: 1,
+    visibility: 'visible'
+  },
+  exiting: {
+    opacity: 0,
+    visibility: 'visible'
+  },
+  exited: {
+    opacity: 0,
+    visibility: 'hidden'
   }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultEmptyMessageHeaderText = styled.h2({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  color: `var(--ds-text, ${colors.N500})`,
-  font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
-  fontWeight: "var(--ds-font-weight-bold, 700)"
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultSearchExternalSiteContainer = styled.div({
-  padding: "var(--ds-space-300, 24px)",
-  textAlign: 'center',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  p: {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    color: `var(--ds-text-subtlest, ${colors.N200})`
-  }
-});
+};
+export const SearchResultsContainer = ({
+  children,
+  transitionState
+}) => /*#__PURE__*/React.createElement("div", {
+  style: transitionStyles[transitionState],
+  className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _v5643rtd _kqswstnw _4t3i1osq _1bsb1osq _154iidpf _bfhkvuon _2lx21bp4 _vchhusvi _1reo15vq _18m91wug _1pbyzo7u _ca0qidpf _u5f3pxbi _n3tdidpf _19bvpxbi _tzy4idpf _3um015vq"])
+}, children);
+const searchResultsContainerAiStyles = null;
+export const SearchResultsContainerAi = ({
+  children,
+  transitionState
+}) => /*#__PURE__*/React.createElement("div", {
+  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"])
+}, children);
+const searchResultEmptyMessageImageStyles = null;
+export const SearchResultEmptyMessageImage = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o"])
+}, children);
+const searchResultEmptyMessageTextStyles = null;
+export const SearchResultEmptyMessageText = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1wmz"])
+}, children);
+const searchResultEmptyMessageHeaderTextStyles = null;
+export const SearchResultEmptyMessageHeaderText = ({
+  children
+}) => /*#__PURE__*/React.createElement("h2", {
+  className: ax(["_11c82smr _syaz10s3 _k48pmoej"])
+}, children);
+const searchResultSearchExternalSiteContainerStyles = null;
+export const SearchResultSearchExternalSiteContainer = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_ca0q1ejb _u5f31ejb _n3td1ejb _19bv1ejb _y3gn1h6o _125x1wmz"])
+}, children);

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

@@ -1,6 +1,6 @@
 import React from 'react';
 import { TabContainer, TabLabels, TabLabel } from './styled';
-import { Inline, Text } from '@atlaskit/primitives';
+import { Inline, Text } from '@atlaskit/primitives/compiled';
 const Tab = ({
   label,
   index,

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

@@ -0,0 +1,13 @@
+._16jlkb7n{flex-grow:1}
+._19bvutpp{padding-left:var(--ds-space-150,9pt)}
+._1bah1yb4{justify-content:space-between}
+._1bsb1osq{width:100%}
+._1e0c1txw{display:flex}
+._1o9zkb7n{flex-shrink:1}
+._80omtlke{cursor:pointer}
+._ae4v1h6o{align-content:center}
+._ca0qutpp{padding-top:var(--ds-space-150,9pt)}
+._i0dlf1ug{flex-basis:0%}
+._n3tdutpp{padding-bottom:var(--ds-space-150,9pt)}
+._u5f3utpp{padding-right:var(--ds-space-150,9pt)}
+._y3gn1h6o{text-align:center}

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

@@ -1,31 +1,29 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const TabContainer = styled.div({
-  width: '100%'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const TabLabels = styled.div({
-  display: 'flex',
-  justifyContent: 'space-between'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
-export const TabLabel = styled.div(({
-  isActive
-}) => ({
-  flex: 1,
-  padding: "var(--ds-space-150, 12px)",
-  textAlign: 'center',
-  cursor: 'pointer',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
-  color: isActive ? "var(--ds-text-selected, #0C66E4)" : "var(--ds-text, #172B4D)",
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
-  borderBottom: isActive ? `1px solid ${"var(--ds-text-selected, #0C66E4)"}` : `1px solid ${"var(--ds-text-disabled, #091E424F)"}`
-}));
+/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+import "./styled.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
+import React from 'react';
+const tabContainerStyles = null;
+export const TabContainer = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_1bsb1osq"])
+}, children);
+const tabLabelsStyles = null;
+export const TabLabels = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_1e0c1txw _1bah1yb4"])
+}, children);
+const tabLabelStyles = null;
+export const TabLabel = ({
+  isActive,
+  onClick,
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  style: {
+    color: isActive ? "var(--ds-text-selected, #0C66E4)" : "var(--ds-text, #172B4D)",
+    borderBottom: isActive ? `1px solid ${"var(--ds-text-selected, #0C66E4)"}` : `1px solid ${"var(--ds-text-disabled, #091E424F)"}`
+  },
+  onClick: onClick,
+  className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _ca0qutpp _u5f3utpp _n3tdutpp _19bvutpp _y3gn1h6o _ae4v1h6o _80omtlke"])
+}, children);

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

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useAnalyticsEvents, AnalyticsContext } from '@atlaskit/analytics-next';
 import { injectIntl } from 'react-intl-next';
-import { Text } from '@atlaskit/primitives';
+import { Text } from '@atlaskit/primitives/compiled';
 import NotFoundImage from '../../../../assets/NotFoundImage';
 import { messages } from '../../../../messages';
 import { WhatsNewResultsEmptyMessageImage, WhatsNewResultsEmptyMessageText } from './styled';

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

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

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

@@ -1,23 +1,17 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import * as colors from '@atlaskit/theme/colors';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultsEmptyMessageImage = styled.div({
-  padding: `${"var(--ds-space-300, 24px)"} ${"var(--ds-space-300, 24px)"} 0 ${"var(--ds-space-300, 24px)"}`,
-  textAlign: 'center'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultsEmptyMessageText = styled.div({
-  padding: `${"var(--ds-space-300, 24px)"} ${"var(--ds-space-300, 24px)"} 0 ${"var(--ds-space-300, 24px)"}`,
-  textAlign: 'center',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  p: {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    color: `var(--ds-text-subtlest, ${colors.N200})`
-  }
-});
+/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+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
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o"])
+}, children);
+const whatsNewResultsEmptyMessageTextStyles = null;
+export const WhatsNewResultsEmptyMessageText = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1wmz"])
+}, children);

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

@@ -3,7 +3,7 @@ import Button from '@atlaskit/button';
 import { injectIntl } from 'react-intl-next';
 import ErrorImage from '../../../../assets/ErrorImage';
 import { messages } from '../../../../messages';
-import { Text } from '@atlaskit/primitives';
+import { Text } from '@atlaskit/primitives/compiled';
 import { SearchResultEmptyMessageImage, SearchResultEmptyMessageText } from './styled';
 export const WhatsNewResultsError = ({
   onSearch,

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

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

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

@@ -1,23 +1,17 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import * as colors from '@atlaskit/theme/colors';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultEmptyMessageImage = styled.div({
-  padding: `${"var(--ds-space-300, 24px)"} ${"var(--ds-space-300, 24px)"} 0 ${"var(--ds-space-300, 24px)"}`,
-  textAlign: 'center'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const SearchResultEmptyMessageText = styled.div({
-  padding: `${"var(--ds-space-300, 24px)"} ${"var(--ds-space-300, 24px)"} 0 ${"var(--ds-space-300, 24px)"}`,
-  textAlign: 'center',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  p: {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    color: `var(--ds-text-subtlest, ${colors.N200})`
-  }
-});
+/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+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
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o"])
+}, children);
+const searchResultEmptyMessageTextStyles = null;
+export const SearchResultEmptyMessageText = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_ca0q1ejb _u5f31ejb _n3tdidpf _19bv1ejb _y3gn1h6o _125x1wmz"])
+}, 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: "8.0.9"
+  packageVersion: "9.0.0"
 };
 export const WhatsNewResultListItem = ({
   intl: {

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

@@ -0,0 +1,39 @@
+._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._2rko1l7b{border-radius:3px}
+._18u0idpf{margin-left:0}
+._19bv1b66{padding-left:var(--ds-space-050,4px)}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._19pkidpf{margin-top:0}
+._1bsb1osq{width:100%}
+._1e0c1o8l{display:inline-block}
+._1e0c1ule{display:block}
+._1hmsglyw{text-decoration-line:none}
+._1reo15vq{overflow-x:hidden}
+._2hwxidpf{margin-right:0}
+._4bfu1r31{text-decoration-color:currentColor}
+._80omtlke{cursor:pointer}
+._ajmmnqa1{text-decoration-style:solid}
+._bfhktxrc{background-color:var(--ds-background-neutral-subtle,#fff)}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
+._kqswh2mm{position:relative}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._o5721q9c{white-space:nowrap}
+._o5724jg8{white-space:normal}
+._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)}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}
+._vchhusvi{box-sizing:border-box}
+._vwz4gktf{line-height:20px}
+._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}
+._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}
+._1ohyglyw:active, ._49pcglyw:focus, ._ksodglyw:hover, ._tpgfglyw:visited{outline-style:none}
+._1q5t1r31:active, ._nt751r31:focus, ._1dit1r31:hover, ._9nxe1r31:visited{outline-color:currentColor}
+._1r9x1o36:active, ._1hvw1o36:focus, ._4hz81o36:hover, ._12gr1o36:visited{outline-width:medium}
+._c2waglyw:active, ._4fprglyw:focus, ._1bnxglyw:hover, ._1x28glyw:visited{text-decoration-line:none}

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

@@ -1,70 +1,34 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import * as colors from '@atlaskit/theme/colors';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultListItemWrapper =
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
-styled.a({
-  position: `relative`,
-  boxSizing: `border-box`,
-  padding: "var(--ds-space-100, 8px)",
-  display: `block`,
-  textDecoration: `none`,
-  cursor: `pointer`,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  color: `${`var(--ds-text-subtlest, ${colors.N200})`}`,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  backgroundColor: `${`var(--ds-background-neutral-subtle, ${colors.N0})`}`,
-  borderRadius: `3px`,
-  '&:hover, &:focus, &:visited, &:active': {
-    textDecoration: `none`,
-    outline: `none`,
-    outlineOffset: `none`
-  },
-  '&:focus': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    boxShadow: `${`var(--ds-border-focused, ${colors.B100})`} 0px 0px 0px 2px inset`
-  },
-  '&:hover': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    backgroundColor: `${`var(--ds-background-neutral-subtle-hovered, ${colors.N30})`}`
-  },
-  '&:active': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    backgroundColor: `${`var(--ds-background-neutral-subtle-pressed, ${colors.B50})`}`
-  }
-},
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
-props => props.styles);
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultListItemTitleContainer = styled.div({
-  width: '100%',
-  whiteSpace: 'nowrap',
-  marginBottom: "var(--ds-space-050, 4px)"
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultListItemTitleText = styled.span({
-  font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
-  display: 'inline-block',
-  verticalAlign: 'middle',
-  margin: 0,
-  paddingLeft: "var(--ds-space-050, 4px)",
-  whiteSpace: 'normal',
-  overflowX: 'hidden'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultListItemDescription = styled.p({
-  display: 'block',
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-  lineHeight: '20px',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  color: `var(--ds-text, ${colors.N800})`,
-  margin: 0
-});
+/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+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,
+  children,
+  ...rest
+}) => /*#__PURE__*/React.createElement("a", _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"])
+}), children);
+const whatsNewResultListItemTitleContainerStyles = null;
+export const WhatsNewResultListItemTitleContainer = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_1bsb1osq _o5721q9c _otyr1b66"])
+}, children);
+const whatsNewResultListItemTitleTextStyles = null;
+export const WhatsNewResultListItemTitleText = ({
+  children
+}) => /*#__PURE__*/React.createElement("span", {
+  className: ax(["_11c81o8v _19pkidpf _2hwxidpf _otyridpf _18u0idpf _1e0c1o8l _s7n4nkob _19bv1b66 _o5724jg8 _1reo15vq"])
+}, children);
+const whatsNewResultListItemDescriptionStyles = null;
+export const WhatsNewResultListItemDescription = ({
+  children
+}) => /*#__PURE__*/React.createElement("p", {
+  className: ax(["_19pkidpf _2hwxidpf _otyridpf _18u0idpf _1e0c1ule _vwz4gktf _syaz1fxt"])
+}, children);

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

@@ -0,0 +1,12 @@
+._11c81o8v{font:var(--ds-font-body-small,normal 400 11px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
+._19bvidpf{padding-left:0}
+._19bvu2gc{padding-left:var(--ds-space-100,8px)}
+._1p1dangw{text-transform:uppercase}
+._ca0qidpf{padding-top:0}
+._ca0qu2gc{padding-top:var(--ds-space-100,8px)}
+._k48pmoej{font-weight:var(--ds-font-weight-bold,700)}
+._kqswh2mm{position:relative}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._syaz1wmz{color:var(--ds-text-subtlest,#6b778c)}
+._u5f3idpf{padding-right:0}
+._u5f3u2gc{padding-right:var(--ds-space-100,8px)}

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

@@ -1,47 +1,25 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css } from '@emotion/react';
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import styled from '@emotion/styled';
-import * as colors from '@atlaskit/theme/colors';
-export const truncate = (width = '100%') => css({
-  overflowX: 'hidden',
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  width: width
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultsListContainer = styled.div({
-  position: 'relative'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultsListGroupWrapper = styled.div({
-  padding: `${"var(--ds-space-100, 8px)"} 0 ${"var(--ds-space-100, 8px)"} 0`
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const WhatsNewResultsListGroupTitle = styled.div({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  color: `var(--ds-text-subtlest, ${colors.N200})`,
-  font: "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
-  fontWeight: "var(--ds-font-weight-bold, 700)",
-  padding: `0 ${"var(--ds-space-100, 8px)"} ${"var(--ds-space-100, 8px)"} ${"var(--ds-space-100, 8px)"}`,
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-  textTransform: 'uppercase'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export const ToggleShowWhatsNewResultsContainer = styled.div({
-  padding: `${"var(--ds-space-100, 8px)"} 0`,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  span: {
-    margin: 0
-  }
-});
+/* styled.tsx generated by @compiled/babel-plugin v0.36.1 */
+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
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_kqswh2mm"])
+}, children);
+const whatsNewResultsListGroupWrapperStyles = null;
+export const WhatsNewResultsListGroupWrapper = ({
+  key,
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  key: key,
+  className: ax(["_ca0qu2gc _u5f3idpf _n3tdu2gc _19bvidpf"])
+}, children);
+const whatsNewResultsListGroupTitleStyles = null;
+export const WhatsNewResultsListGroupTitle = ({
+  children
+}) => /*#__PURE__*/React.createElement("div", {
+  className: ax(["_11c81o8v _syaz1wmz _k48pmoej _ca0qidpf _u5f3u2gc _n3tdu2gc _19bvu2gc _1p1dangw"])
+}, children);