@atlaskit/link-datasource 3.19.2 → 3.20.0

package/dist/es2019/ui/common/error-state/provider-auth-required-svg.js

@@ -1,64 +1,60 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
-const imageStyles = css({
-  width: 200,
-  height: 140,
-  marginBottom: "var(--ds-space-200, 16px)"
-});
-export const ProviderAuthRequiredSVG = () => {
-  return jsx("svg", {
+/* provider-auth-required-svg.tsx generated by @compiled/babel-plugin v0.36.0 */
+import "./provider-auth-required-svg.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { fg } from "@atlaskit/platform-feature-flags";
+import { ProviderAuthRequiredSVGOld } from './provider-auth-required-svg-old';
+const imageStyles = null;
+export const ProviderAuthRequiredSVGNew = () => {
+  return /*#__PURE__*/React.createElement("svg", {
     width: "170",
     height: "130",
     viewBox: "0 0 170 130",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
-    css: imageStyles
-  }, jsx("rect", {
+    className: ax(["_1bsbuuw1 _4t3i11ux _otyrpxbi"])
+  }, /*#__PURE__*/React.createElement("rect", {
     width: "170",
     height: "130",
     rx: "6.25",
     fill: "white"
-  }), jsx("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M163.75 2H6.25C3.90279 2 2 3.90279 2 6.25V123.75C2 126.097 3.90279 128 6.25 128H163.75C166.097 128 168 126.097 168 123.75V6.25C168 3.90279 166.097 2 163.75 2ZM6.25 0C2.79822 0 0 2.79822 0 6.25V123.75C0 127.202 2.79822 130 6.25 130H163.75C167.202 130 170 127.202 170 123.75V6.25C170 2.79822 167.202 0 163.75 0H6.25Z",
     fill: "#091E42",
     fillOpacity: "0.14"
-  }), jsx("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M168 14H2V12H168V14Z",
     fill: "#091E42",
     fillOpacity: "0.14"
-  }), jsx("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M168 43L2 43L2 41L168 41V43Z",
     fill: "#091E42",
     fillOpacity: "0.14"
-  }), jsx("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M168 72H2V70H168V72Z",
     fill: "#091E42",
     fillOpacity: "0.14"
-  }), jsx("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M28 128L28 2H30L30 128H28Z",
     fill: "#091E42",
     fillOpacity: "0.14"
-  }), jsx("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M98 128L98 2H100L100 128H98Z",
     fill: "#091E42",
     fillOpacity: "0.14"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "34",
     y: "24.5",
     width: "60",
@@ -66,7 +62,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "104",
     y: "24.5",
     width: "60",
@@ -74,7 +70,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "34",
     y: "53.5",
     width: "60",
@@ -82,7 +78,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "104",
     y: "53.5",
     width: "60",
@@ -90,7 +86,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "34",
     y: "111.5",
     width: "60",
@@ -98,7 +94,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "104",
     y: "111.5",
     width: "60",
@@ -106,7 +102,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "34",
     y: "82.5",
     width: "60",
@@ -114,7 +110,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     x: "104",
     y: "82.5",
     width: "60",
@@ -122,7 +118,7 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "3",
     fill: "#091E42",
     fillOpacity: "0.06"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     opacity: "0.5",
     x: "8",
     y: "20.5",
@@ -130,7 +126,7 @@ export const ProviderAuthRequiredSVG = () => {
     height: "14",
     rx: "2",
     fill: "#1D7AFC"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     opacity: "0.5",
     x: "8",
     y: "49.5",
@@ -138,13 +134,13 @@ export const ProviderAuthRequiredSVG = () => {
     height: "14",
     rx: "2",
     fill: "#1D7AFC"
-  }), jsx("path", {
+  }), /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M168 101H2V99H168V101Z",
     fill: "#091E42",
     fillOpacity: "0.14"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     opacity: "0.5",
     x: "8",
     y: "107.5",
@@ -152,7 +148,7 @@ export const ProviderAuthRequiredSVG = () => {
     height: "14",
     rx: "2",
     fill: "#1D7AFC"
-  }), jsx("rect", {
+  }), /*#__PURE__*/React.createElement("rect", {
     opacity: "0.5",
     x: "8",
     y: "78.5",
@@ -161,4 +157,11 @@ export const ProviderAuthRequiredSVG = () => {
     rx: "2",
     fill: "#1D7AFC"
   }));
+};
+export const ProviderAuthRequiredSVG = () => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(ProviderAuthRequiredSVGNew, null);
+  } else {
+    return /*#__PURE__*/React.createElement(ProviderAuthRequiredSVGOld, null);
+  }
 };

package/dist/es2019/ui/common/error-state/provider-auth-required.compiled.css

@@ -0,0 +1 @@
+._19pkpxbi{margin-top:var(--ds-space-200,1pc)}

package/dist/es2019/ui/common/error-state/provider-auth-required.js

@@ -1,26 +1,21 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+/* provider-auth-required.tsx generated by @compiled/babel-plugin v0.36.0 */
+import "./provider-auth-required.compiled.css";
+import { ax, ix } from "@compiled/react/runtime";
 import React, { useEffect } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import Button from '@atlaskit/button';
 import EmptyState from '@atlaskit/empty-state';
 import { AuthError, auth as outboundAuth } from '@atlaskit/outbound-auth-flow-client';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { Anchor } from '@atlaskit/primitives';
+import { Anchor } from '@atlaskit/primitives/compiled';
 import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import useErrorLogger from '../../../hooks/useErrorLogger';
 import { loadingErrorMessages } from './messages';
+import { ProviderAuthRequiredOld } from './provider-auth-required-old';
 import { ProviderAuthRequiredSVG } from './provider-auth-required-svg';
-const buttonStyles = css({
-  marginTop: "var(--ds-space-200, 16px)"
-});
+const buttonStyles = null;
 const learnMoreAboutSmartLinksUrl = 'https://support.atlassian.com/confluence-cloud/docs/insert-links-and-anchors/#Smart-Links-from-Jira-and-other-products';
-export const ProviderAuthRequired = ({
+export const ProviderAuthRequiredNew = ({
   auth = [],
   onAuthSuccess,
   onAuthError,
@@ -64,19 +59,19 @@ export const ProviderAuthRequired = ({
     }
   };
   const AnchorFFed = fg('fix_a11y_violations_in_link_datasource') ? Anchor : 'a';
-  const renderAuthDescription = () => jsx(React.Fragment, null, formatMessage(loadingErrorMessages.authScreenDescriptionText, {
+  const renderAuthDescription = () => /*#__PURE__*/React.createElement(React.Fragment, null, formatMessage(loadingErrorMessages.authScreenDescriptionText, {
     providerName
-  }), ' ', jsx(AnchorFFed, {
+  }), ' ', /*#__PURE__*/React.createElement(AnchorFFed, {
     href: learnMoreAboutSmartLinksUrl,
     target: "_blank",
     rel: "noreferrer noopener"
   }, formatMessage(loadingErrorMessages.learnMoreAboutSmartLinks)));
-  const renderAuthConnectButton = () => jsx(Button, {
+  const renderAuthConnectButton = () => /*#__PURE__*/React.createElement(Button, {
     onClick: onAuthRequest,
     appearance: "primary",
-    css: buttonStyles
+    className: ax(["_19pkpxbi"])
   }, formatMessage(loadingErrorMessages.authConnectButtonText));
-  return jsx(EmptyState, {
+  return /*#__PURE__*/React.createElement(EmptyState, {
     testId: "datasource--access-required-with-auth",
     header: formatMessage(loadingErrorMessages.authScreenHeaderText, {
       providerName
@@ -85,4 +80,11 @@ export const ProviderAuthRequired = ({
     renderImage: ProviderAuthRequiredSVG,
     primaryAction: renderAuthConnectButton()
   });
+};
+export const ProviderAuthRequired = props => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(ProviderAuthRequiredNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(ProviderAuthRequiredOld, props);
+  }
 };

package/dist/es2019/ui/common/initial-state-view/index.compiled.css

@@ -0,0 +1,14 @@
+._11c8o0gd{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif)}
+._zulpu2gc{gap:var(--ds-space-100,8px)}
+._1bah1h6o{justify-content:center}
+._1e0c1o8l{display:inline-block}
+._1e0c1txw{display:flex}
+._1wpz1h6o{align-self:center}
+._4cvr1h6o{align-items:center}
+._4t3i1osq{height:100%}
+._ca0qoahv{padding-top:var(--ds-space-600,3pc)}
+._ca0qpxbi{padding-top:var(--ds-space-200,1pc)}
+._n3tdoahv{padding-bottom:var(--ds-space-600,3pc)}
+._n3tdu2gc{padding-bottom:var(--ds-space-100,8px)}
+._syaz1rc1{color:var(--ds-text-subtlest,#5e6c84)}
+._y3gn1h6o{text-align:center}

package/dist/es2019/ui/common/initial-state-view/index.js

@@ -1,47 +1,21 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
+import "./index.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { FormattedMessage, useIntl } from 'react-intl-next';
 import Lozenge from '@atlaskit/lozenge';
+import { fg } from "@atlaskit/platform-feature-flags";
 import { N300 } from '@atlaskit/theme/colors';
 import { fontFallback } from '@atlaskit/theme/typography';
+import { InitialStateViewOld } from './initial-state-view-old';
 import { initialStateViewMessages } from './messages';
-const initialStateViewContainerStyles = css({
-  display: 'flex',
-  justifyContent: 'center',
-  height: '100%'
-});
-const svgAndTextsWrapperStyles = css({
-  textAlign: 'center',
-  alignSelf: 'center',
-  paddingTop: "var(--ds-space-600, 48px)",
-  paddingBottom: "var(--ds-space-600, 48px)"
-});
-const betaTagStyles = css({
-  display: 'flex'
-});
-const searchTitleStyles = css({
-  color: `var(--ds-text-subtlest, ${N300})`,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  font: `var(--ds-font-heading-medium, ${fontFallback.heading.medium})`,
-  paddingTop: "var(--ds-space-200, 16px)",
-  paddingBottom: "var(--ds-space-100, 8px)",
-  display: 'flex',
-  justifyContent: 'center',
-  alignItems: 'center',
-  gap: "var(--ds-space-100, 8px)"
-});
-const mainTextStyles = css({
-  color: `var(--ds-text-subtlest, ${N300})`
-});
-const learnMoreLinkStyles = css({
-  paddingTop: "var(--ds-space-200, 16px)",
-  display: 'inline-block'
-});
-export const InitialStateView = ({
+const initialStateViewContainerStyles = null;
+const svgAndTextsWrapperStyles = null;
+const betaTagStyles = null;
+const searchTitleStyles = null;
+const mainTextStyles = null;
+const learnMoreLinkStyles = null;
+export const InitialStateViewNew = ({
   icon,
   showBeta = false,
   title,
@@ -51,22 +25,29 @@ export const InitialStateView = ({
   const {
     formatMessage
   } = useIntl();
-  return jsx("div", {
-    css: initialStateViewContainerStyles,
-    "data-testid": "datasource-modal--initial-state-view"
-  }, jsx("div", {
-    css: svgAndTextsWrapperStyles
-  }, icon, jsx("div", {
-    css: searchTitleStyles
-  }, showBeta && jsx("div", {
-    css: betaTagStyles
-  }, jsx(Lozenge, {
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": "datasource-modal--initial-state-view",
+    className: ax(["_1e0c1txw _1bah1h6o _4t3i1osq"])
+  }, /*#__PURE__*/React.createElement("div", {
+    className: ax(["_y3gn1h6o _1wpz1h6o _ca0qoahv _n3tdoahv"])
+  }, icon, /*#__PURE__*/React.createElement("div", {
+    className: ax(["_11c8o0gd _zulpu2gc _syaz1rc1 _ca0qpxbi _n3tdu2gc _1e0c1txw _1bah1h6o _4cvr1h6o"])
+  }, showBeta && /*#__PURE__*/React.createElement("div", {
+    className: ax(["_1e0c1txw"])
+  }, /*#__PURE__*/React.createElement(Lozenge, {
     appearance: "new"
-  }, jsx(FormattedMessage, initialStateViewMessages.beta))), formatMessage(title)), jsx("div", {
-    css: mainTextStyles
-  }, formatMessage(description)), learnMoreLink && jsx("a", {
+  }, /*#__PURE__*/React.createElement(FormattedMessage, initialStateViewMessages.beta))), formatMessage(title)), /*#__PURE__*/React.createElement("div", {
+    className: ax(["_syaz1rc1"])
+  }, formatMessage(description)), learnMoreLink && /*#__PURE__*/React.createElement("a", {
     href: learnMoreLink.href,
     target: "_blank",
-    css: learnMoreLinkStyles
+    className: ax(["_ca0qpxbi _1e0c1o8l"])
   }, formatMessage(learnMoreLink.text))));
+};
+export const InitialStateView = props => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(InitialStateViewNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(InitialStateViewOld, props);
+  }
 };

package/dist/es2019/ui/common/initial-state-view/initial-state-view-old.js

@@ -0,0 +1,72 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { css, jsx } from '@emotion/react';
+import { FormattedMessage, useIntl } from 'react-intl-next';
+import Lozenge from '@atlaskit/lozenge';
+import { N300 } from '@atlaskit/theme/colors';
+import { fontFallback } from '@atlaskit/theme/typography';
+import { initialStateViewMessages } from './messages';
+const initialStateViewContainerStyles = css({
+  display: 'flex',
+  justifyContent: 'center',
+  height: '100%'
+});
+const svgAndTextsWrapperStyles = css({
+  textAlign: 'center',
+  alignSelf: 'center',
+  paddingTop: "var(--ds-space-600, 48px)",
+  paddingBottom: "var(--ds-space-600, 48px)"
+});
+const betaTagStyles = css({
+  display: 'flex'
+});
+const searchTitleStyles = css({
+  color: `var(--ds-text-subtlest, ${N300})`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+  font: `var(--ds-font-heading-medium, ${fontFallback.heading.medium})`,
+  paddingTop: "var(--ds-space-200, 16px)",
+  paddingBottom: "var(--ds-space-100, 8px)",
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  gap: "var(--ds-space-100, 8px)"
+});
+const mainTextStyles = css({
+  color: `var(--ds-text-subtlest, ${N300})`
+});
+const learnMoreLinkStyles = css({
+  paddingTop: "var(--ds-space-200, 16px)",
+  display: 'inline-block'
+});
+export const InitialStateViewOld = ({
+  icon,
+  showBeta = false,
+  title,
+  description,
+  learnMoreLink
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  return jsx("div", {
+    css: initialStateViewContainerStyles,
+    "data-testid": "datasource-modal--initial-state-view"
+  }, jsx("div", {
+    css: svgAndTextsWrapperStyles
+  }, icon, jsx("div", {
+    css: searchTitleStyles
+  }, showBeta && jsx("div", {
+    css: betaTagStyles
+  }, jsx(Lozenge, {
+    appearance: "new"
+  }, jsx(FormattedMessage, initialStateViewMessages.beta))), formatMessage(title)), jsx("div", {
+    css: mainTextStyles
+  }, formatMessage(description)), learnMoreLink && jsx("a", {
+    href: learnMoreLink.href,
+    target: "_blank",
+    css: learnMoreLinkStyles
+  }, formatMessage(learnMoreLink.text))));
+};

package/dist/es2019/ui/common/modal/basic-search-input/basic-search-input-old.js

@@ -0,0 +1,74 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { css, jsx } from '@emotion/react';
+import { useIntl } from 'react-intl-next';
+import { LoadingButton } from '@atlaskit/button';
+import SearchIcon from '@atlaskit/icon/core/migration/search--editor-search';
+import { fg } from '@atlaskit/platform-feature-flags';
+import Textfield from '@atlaskit/textfield';
+import { useDatasourceAnalyticsEvents } from '../../../../analytics';
+import { basicSearchInputMessages } from './messages';
+const searchButtonStyles = css({
+  marginRight: "var(--ds-space-075, 6px)"
+});
+const formStyles = css({
+  flex: 1
+});
+const formWithMaxWidthStyles = css({
+  flex: 1,
+  maxWidth: 250
+});
+export const BasicSearchInputOld = ({
+  isDisabled,
+  isSearching,
+  onChange,
+  onSearch,
+  searchTerm,
+  fullWidth,
+  testId,
+  placeholder
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const {
+    fireEvent
+  } = useDatasourceAnalyticsEvents();
+  const handleSearchWithAnalytics = () => {
+    fireEvent('ui.form.submitted.basicSearch', {});
+    onSearch(searchTerm);
+  };
+  const handleFormSubmit = e => {
+    e.preventDefault();
+    handleSearchWithAnalytics();
+  };
+  return jsx("form", {
+    css: fullWidth ? formStyles : formWithMaxWidthStyles,
+    onSubmit: handleFormSubmit
+  }, jsx(Textfield, {
+    elemAfterInput: jsx(LoadingButton, {
+      appearance: "primary",
+      css: searchButtonStyles,
+      iconBefore: jsx(SearchIcon, {
+        label: formatMessage(fg('confluence-issue-terminology-refresh') ? basicSearchInputMessages.basicTextSearchLabelIssueTermRefresh : basicSearchInputMessages.basicTextSearchLabel),
+        LEGACY_size: "medium",
+        color: "currentColor",
+        spacing: "spacious"
+      }),
+      isDisabled: isDisabled,
+      isLoading: isSearching,
+      onClick: handleSearchWithAnalytics,
+      spacing: "none",
+      testId: `${testId}--basic-search-button`
+    }),
+    autoFocus: true,
+    onChange: onChange,
+    placeholder: formatMessage(placeholder),
+    testId: `${testId}--basic-search-input`,
+    value: searchTerm
+  }));
+};

package/dist/es2019/ui/common/modal/basic-search-input/index.compiled.css

@@ -0,0 +1,5 @@
+._16jlkb7n{flex-grow:1}
+._1o9zkb7n{flex-shrink:1}
+._2hwx12x7{margin-right:var(--ds-space-075,6px)}
+._i0dlf1ug{flex-basis:0%}
+._p12fr0r7{max-width:250px}

package/dist/es2019/ui/common/modal/basic-search-input/index.js

@@ -1,28 +1,19 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
+import "./index.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { useIntl } from 'react-intl-next';
 import { LoadingButton } from '@atlaskit/button';
 import SearchIcon from '@atlaskit/icon/core/migration/search--editor-search';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Textfield from '@atlaskit/textfield';
 import { useDatasourceAnalyticsEvents } from '../../../../analytics';
+import { BasicSearchInputOld } from './basic-search-input-old';
 import { basicSearchInputMessages } from './messages';
-const searchButtonStyles = css({
-  marginRight: "var(--ds-space-075, 6px)"
-});
-const formStyles = css({
-  flex: 1
-});
-const formWithMaxWidthStyles = css({
-  flex: 1,
-  maxWidth: 250
-});
-export const BasicSearchInput = ({
+const searchButtonStyles = null;
+const formStyles = null;
+const formWithMaxWidthStyles = null;
+export const BasicSearchInputNew = ({
   isDisabled,
   isSearching,
   onChange,
@@ -46,14 +37,13 @@ export const BasicSearchInput = ({
     e.preventDefault();
     handleSearchWithAnalytics();
   };
-  return jsx("form", {
-    css: fullWidth ? formStyles : formWithMaxWidthStyles,
-    onSubmit: handleFormSubmit
-  }, jsx(Textfield, {
-    elemAfterInput: jsx(LoadingButton, {
+  return /*#__PURE__*/React.createElement("form", {
+    onSubmit: handleFormSubmit,
+    className: ax([fullWidth ? "_16jlkb7n _1o9zkb7n _i0dlf1ug" : "_16jlkb7n _1o9zkb7n _i0dlf1ug _p12fr0r7"])
+  }, /*#__PURE__*/React.createElement(Textfield, {
+    elemAfterInput: /*#__PURE__*/React.createElement(LoadingButton, {
       appearance: "primary",
-      css: searchButtonStyles,
-      iconBefore: jsx(SearchIcon, {
+      iconBefore: /*#__PURE__*/React.createElement(SearchIcon, {
         label: formatMessage(fg('confluence-issue-terminology-refresh') ? basicSearchInputMessages.basicTextSearchLabelIssueTermRefresh : basicSearchInputMessages.basicTextSearchLabel),
         LEGACY_size: "medium",
         color: "currentColor",
@@ -63,7 +53,8 @@ export const BasicSearchInput = ({
       isLoading: isSearching,
       onClick: handleSearchWithAnalytics,
       spacing: "none",
-      testId: `${testId}--basic-search-button`
+      testId: `${testId}--basic-search-button`,
+      className: ax(["_2hwx12x7"])
     }),
     autoFocus: true,
     onChange: onChange,
@@ -71,4 +62,11 @@ export const BasicSearchInput = ({
     testId: `${testId}--basic-search-input`,
     value: searchTerm
   }));
+};
+export const BasicSearchInput = props => {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(BasicSearchInputNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(BasicSearchInputOld, props);
+  }
 };

package/dist/es2019/ui/common/modal/cancel-button/index.js

@@ -1,11 +1,4 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import { useCallback } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import React, { useCallback } from 'react';
 import { FormattedMessage } from 'react-intl-next';
 import Button from '@atlaskit/button/standard-button';
 import { useDatasourceAnalyticsEvents } from '../../../../analytics';
@@ -22,9 +15,9 @@ export const CancelButton = ({
     fireEvent('ui.button.clicked.cancel', getAnalyticsPayload());
     onCancel();
   }, [getAnalyticsPayload, fireEvent, onCancel]);
-  return jsx(Button, {
+  return /*#__PURE__*/React.createElement(Button, {
     appearance: "default",
     onClick: onCancelClick,
     testId: testId
-  }, jsx(FormattedMessage, cancelButtonMessages.cancelButtonText));
+  }, /*#__PURE__*/React.createElement(FormattedMessage, cancelButtonMessages.cancelButtonText));
 };