@atlaskit/link-datasource 3.19.1 → 3.20.0

package/dist/cjs/ui/assets-modal/modal/render-assets-content/initial-state-view/index.js

@@ -1,49 +1,49 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.InitialStateView = void 0;
-var _react = require("@emotion/react");
+exports.InitialStateViewNew = exports.InitialStateView = void 0;
+require("./index.compiled.css");
+var React = _interopRequireWildcard(require("react"));
+var _runtime = require("@compiled/react/runtime");
 var _reactIntlNext = require("react-intl-next");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _typography = require("@atlaskit/theme/typography");
-var _crystalBallSvg = require("./assets/crystal-ball-svg");
+var _search = require("../../../../../common/ui/rich-icon/search");
+var _crystalBallSvgOld = require("./assets/crystal-ball-svg-old");
+var _initialStateViewOld = require("./initial-state-view-old");
 var _messages = require("./messages");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-var initialStateViewContainerStyles = (0, _react.css)({
-  display: 'flex',
-  justifyContent: 'center',
-  height: '100%'
-});
-var svgAndTextsWrapperStyles = (0, _react.css)({
-  textAlign: 'center',
-  alignSelf: 'center'
-});
-var searchTitleStyles = (0, _react.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  font: "var(--ds-font-heading-small, ".concat(_typography.fontFallback.heading.small, ")"),
-  paddingTop: "var(--ds-space-200, 16px)",
-  paddingBottom: "var(--ds-space-100, 8px)"
-});
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var initialStateViewContainerStyles = null;
+var svgAndTextsWrapperStyles = null;
+var searchTitleStyles = null;
 var AQLSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-assets-query-language-aql/';
-var InitialStateView = exports.InitialStateView = function InitialStateView() {
+var InitialStateViewNew = exports.InitialStateViewNew = function InitialStateViewNew() {
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
-  return (0, _react.jsx)("div", {
-    css: initialStateViewContainerStyles,
-    "data-testid": "assets-aql-datasource-modal--initial-state-view"
-  }, (0, _react.jsx)("div", {
-    css: svgAndTextsWrapperStyles
-  }, (0, _react.jsx)(_crystalBallSvg.CrystalBallSVG, null), (0, _react.jsx)("div", {
-    css: searchTitleStyles
-  }, formatMessage(_messages.initialStateViewMessages.searchTitle)), (0, _react.jsx)("div", null, formatMessage(_messages.initialStateViewMessages.searchDescription)), (0, _react.jsx)("a", {
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": "assets-aql-datasource-modal--initial-state-view",
+    className: (0, _runtime.ax)(["_1e0c1txw _1bah1h6o _4t3i1osq"])
+  }, /*#__PURE__*/React.createElement("div", {
+    className: (0, _runtime.ax)(["_y3gn1h6o _1wpz1h6o"])
+  }, (0, _platformFeatureFlags.fg)('bandicoots-update-sllv-icons') ? /*#__PURE__*/React.createElement(_search.RichIconSearch, {
+    size: "xlarge",
+    alt: formatMessage(_messages.initialStateViewMessages.searchTitle)
+  }) : /*#__PURE__*/React.createElement(_crystalBallSvgOld.CrystalBallSVGOld, null), /*#__PURE__*/React.createElement("div", {
+    className: (0, _runtime.ax)(["_ca0qpxbi _n3tdu2gc _wtt41hi2 _pfzw1qd6 _zzcc1522 _x3fx5x7c _v2gl1dku _1y0b14fl _z7oy15vm"])
+  }, formatMessage(_messages.initialStateViewMessages.searchTitle)), /*#__PURE__*/React.createElement("div", null, formatMessage(_messages.initialStateViewMessages.searchDescription)), /*#__PURE__*/React.createElement("a", {
     href: AQLSupportDocumentLink,
     target: "_blank"
   }, formatMessage(_messages.initialStateViewMessages.learnMoreLink))));
+};
+var InitialStateView = exports.InitialStateView = function InitialStateView() {
+  if ((0, _platformFeatureFlags.fg)('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(InitialStateViewNew, null);
+  } else {
+    return /*#__PURE__*/React.createElement(_initialStateViewOld.InitialStateViewOld, null);
+  }
 };

package/dist/cjs/ui/assets-modal/modal/render-assets-content/initial-state-view/initial-state-view-old.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InitialStateViewOld = void 0;
+var _react = require("@emotion/react");
+var _reactIntlNext = require("react-intl-next");
+var _typography = require("@atlaskit/theme/typography");
+var _crystalBallSvgOld = require("./assets/crystal-ball-svg-old");
+var _messages = require("./messages");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var initialStateViewContainerStyles = (0, _react.css)({
+  display: 'flex',
+  justifyContent: 'center',
+  height: '100%'
+});
+var svgAndTextsWrapperStyles = (0, _react.css)({
+  textAlign: 'center',
+  alignSelf: 'center'
+});
+var searchTitleStyles = (0, _react.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+  font: "var(--ds-font-heading-small, ".concat(_typography.fontFallback.heading.small, ")"),
+  paddingTop: "var(--ds-space-200, 16px)",
+  paddingBottom: "var(--ds-space-100, 8px)"
+});
+var AQLSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-assets-query-language-aql/';
+var InitialStateViewOld = exports.InitialStateViewOld = function InitialStateViewOld() {
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  return (0, _react.jsx)("div", {
+    css: initialStateViewContainerStyles,
+    "data-testid": "assets-aql-datasource-modal--initial-state-view"
+  }, (0, _react.jsx)("div", {
+    css: svgAndTextsWrapperStyles
+  }, (0, _react.jsx)(_crystalBallSvgOld.CrystalBallSVGOld, null), (0, _react.jsx)("div", {
+    css: searchTitleStyles
+  }, formatMessage(_messages.initialStateViewMessages.searchTitle)), (0, _react.jsx)("div", null, formatMessage(_messages.initialStateViewMessages.searchDescription)), (0, _react.jsx)("a", {
+    href: AQLSupportDocumentLink,
+    target: "_blank"
+  }, formatMessage(_messages.initialStateViewMessages.learnMoreLink))));
+};

package/dist/cjs/ui/assets-modal/modal/render-assets-content/render-assets-content-old.js

@@ -0,0 +1,121 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RenderAssetsContentOld = exports.MODAL_HEIGHT = void 0;
+var _react = require("react");
+var _react2 = require("@emotion/react");
+var _colors = require("@atlaskit/theme/colors");
+var _accessRequired = require("../../../common/error-state/access-required");
+var _modalLoadingError = require("../../../common/error-state/modal-loading-error");
+var _noResults = require("../../../common/error-state/no-results");
+var _issueLikeTableOld = require("../../../issue-like-table/issue-like-table-old");
+var _initialStateView = require("./initial-state-view");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var MODAL_HEIGHT = exports.MODAL_HEIGHT = 420;
+
+// This is to prevent y scrollbar when showing table loading state
+var disableOverflowStyles = (0, _react2.css)({
+  overflow: 'hidden'
+});
+var contentContainerStyles = (0, _react2.css)({
+  height: MODAL_HEIGHT,
+  display: 'grid',
+  overflow: 'auto'
+});
+var tableBordersStyles = (0, _react2.css)({
+  border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N40, ")")),
+  borderTopLeftRadius: "var(--ds-border-radius-200, 8px)",
+  borderTopRightRadius: "var(--ds-border-radius-200, 8px)",
+  borderBottom: "2px solid ".concat("var(--ds-background-accent-gray-subtler, ".concat(_colors.N40, ")")),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  backgroundImage: _issueLikeTableOld.scrollableContainerShadowsCssComponents.backgroundImage,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  backgroundRepeat: _issueLikeTableOld.scrollableContainerShadowsCssComponents.backgroundRepeat,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  backgroundSize: _issueLikeTableOld.scrollableContainerShadowsCssComponents.backgroundSize,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  backgroundAttachment: _issueLikeTableOld.scrollableContainerShadowsCssComponents.backgroundAttachment
+});
+var RejectedView = function RejectedView() {
+  return (0, _react2.jsx)("div", {
+    css: [contentContainerStyles]
+  }, (0, _react2.jsx)(_modalLoadingError.ModalLoadingError, null));
+};
+var UnauthorizedView = function UnauthorizedView() {
+  return (0, _react2.jsx)("div", {
+    css: [contentContainerStyles]
+  }, (0, _react2.jsx)(_accessRequired.AccessRequired, null));
+};
+var EmptyView = function EmptyView() {
+  return (0, _react2.jsx)("div", {
+    css: [contentContainerStyles]
+  }, (0, _react2.jsx)(_initialStateView.InitialStateView, null));
+};
+var NoResultsView = function NoResultsView() {
+  return (0, _react2.jsx)("div", {
+    css: [contentContainerStyles]
+  }, (0, _react2.jsx)(_noResults.NoResults, null));
+};
+var LoadingView = function LoadingView() {
+  return (0, _react2.jsx)("div", {
+    css: [contentContainerStyles, contentContainerStyles, tableBordersStyles, disableOverflowStyles]
+  }, (0, _react2.jsx)(_issueLikeTableOld.EmptyStateOld, {
+    testId: "assets-aql-datasource-modal--loading-state"
+  }));
+};
+var RenderAssetsContentOld = exports.RenderAssetsContentOld = function RenderAssetsContentOld(props) {
+  var status = props.status,
+    responseItems = props.responseItems,
+    responseItemIds = props.responseItemIds,
+    visibleColumnKeys = props.visibleColumnKeys,
+    onNextPage = props.onNextPage,
+    hasNextPage = props.hasNextPage,
+    loadDatasourceDetails = props.loadDatasourceDetails,
+    columns = props.columns,
+    defaultVisibleColumnKeys = props.defaultVisibleColumnKeys,
+    onVisibleColumnKeysChange = props.onVisibleColumnKeysChange,
+    isFetchingInitialData = props.isFetchingInitialData;
+  var resolvedWithNoResults = status === 'resolved' && !responseItems.length;
+  var issueLikeDataTableView = (0, _react.useMemo)(function () {
+    return (0, _react2.jsx)("div", {
+      css: [contentContainerStyles, tableBordersStyles]
+    }, (0, _react2.jsx)(_issueLikeTableOld.IssueLikeDataTableViewOld, {
+      testId: "asset-datasource-table",
+      status: status,
+      columns: columns,
+      items: responseItems,
+      itemIds: responseItemIds,
+      hasNextPage: hasNextPage,
+      visibleColumnKeys: visibleColumnKeys || defaultVisibleColumnKeys,
+      onNextPage: onNextPage,
+      onLoadDatasourceDetails: loadDatasourceDetails,
+      onVisibleColumnKeysChange: onVisibleColumnKeysChange
+    }));
+  }, [columns, defaultVisibleColumnKeys, hasNextPage, loadDatasourceDetails, onNextPage, onVisibleColumnKeysChange, responseItems, responseItemIds, status, visibleColumnKeys]);
+  var renderAssetsContentView = (0, _react.useCallback)(function () {
+    if (isFetchingInitialData) {
+      // Placing this check first as it's a priority before all others
+      return (0, _react2.jsx)(LoadingView, null);
+    } else if (status === 'rejected') {
+      return (0, _react2.jsx)(RejectedView, null);
+    } else if (status === 'unauthorized') {
+      return (0, _react2.jsx)(UnauthorizedView, null);
+    } else if (status === 'empty') {
+      return (0, _react2.jsx)(EmptyView, null);
+    } else if (resolvedWithNoResults) {
+      return (0, _react2.jsx)(NoResultsView, null);
+    } else if (status === 'loading' && !columns.length) {
+      return (0, _react2.jsx)(LoadingView, null);
+    }
+    return issueLikeDataTableView;
+  }, [columns.length, isFetchingInitialData, issueLikeDataTableView, resolvedWithNoResults, status]);
+  return renderAssetsContentView();
+};

package/dist/cjs/ui/assets-modal/search-container/aql-search-input/aql-search-input-old.js

@@ -0,0 +1,137 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AqlSearchInputOld = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = require("react");
+var _react2 = require("@emotion/react");
+var _reactIntlNext = require("react-intl-next");
+var _button = require("@atlaskit/button");
+var _form = require("@atlaskit/form");
+var _crossCircle = _interopRequireDefault(require("@atlaskit/icon/core/migration/cross-circle"));
+var _questionCircle = _interopRequireDefault(require("@atlaskit/icon/core/migration/question-circle"));
+var _searchEditorSearch = _interopRequireDefault(require("@atlaskit/icon/core/migration/search--editor-search"));
+var _successCheckCircle = _interopRequireDefault(require("@atlaskit/icon/core/migration/success--check-circle"));
+var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
+var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
+var _colors = require("@atlaskit/theme/colors");
+var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
+var _useValidateAqlText2 = require("../../../../hooks/useValidateAqlText");
+var _types = require("../../../../types/assets/types");
+var _styledOld = require("../styled-old");
+var _messages = require("./messages");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var buttonBaseStyles = (0, _react2.css)({
+  display: 'flex',
+  height: '100%',
+  position: 'relative',
+  alignItems: 'center',
+  justifyContent: 'center',
+  flexDirection: 'column',
+  marginRight: "var(--ds-space-100, 0.5em)"
+});
+var AQLSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-assets-query-language-aql/';
+var searchButtonStyles = (0, _react2.css)({
+  marginRight: "var(--ds-space-075, 6px)"
+});
+var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
+  if (lastValidationResult.type === 'loading') {
+    return (0, _react2.jsx)(_spinner.default, {
+      size: "medium",
+      testId: "assets-datasource-modal--aql-validating"
+    });
+  }
+  if (lastValidationResult.type === 'invalid') {
+    return (0, _react2.jsx)(_crossCircle.default, {
+      label: "label",
+      color: "var(--ds-icon-danger, ".concat(_colors.R400, ")"),
+      LEGACY_size: "medium",
+      testId: "assets-datasource-modal--aql-invalid",
+      spacing: "spacious"
+    });
+  }
+  if (lastValidationResult.type === 'valid') {
+    return (0, _react2.jsx)(_successCheckCircle.default, {
+      label: "label",
+      color: "var(--ds-icon-success, ".concat(_colors.G300, ")"),
+      LEGACY_size: "medium",
+      testId: "assets-datasource-modal--aql-valid",
+      spacing: "spacious"
+    });
+  }
+  return (0, _react2.jsx)(_searchEditorSearch.default, {
+    label: "label",
+    LEGACY_size: "medium",
+    testId: "assets-datasource-modal--aql-idle",
+    color: "currentColor",
+    spacing: "spacious"
+  });
+};
+var AqlSearchInputOld = exports.AqlSearchInputOld = function AqlSearchInputOld(_ref) {
+  var value = _ref.value,
+    workspaceId = _ref.workspaceId,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'assets-datasource-modal--aql-search-input' : _ref$testId,
+    isSearching = _ref.isSearching;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var _useValidateAqlText = (0, _useValidateAqlText2.useValidateAqlText)(workspaceId, value),
+    debouncedValidation = _useValidateAqlText.debouncedValidation,
+    lastValidationResult = _useValidateAqlText.lastValidationResult;
+  return (0, _react2.jsx)(_styledOld.FieldContainer, null, (0, _react2.jsx)(_form.Field, {
+    name: _types.aqlKey,
+    defaultValue: value,
+    validate: debouncedValidation
+  }, function (_ref2) {
+    var fieldProps = _ref2.fieldProps;
+    return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_textfield.default, (0, _extends2.default)({}, fieldProps, {
+      elemBeforeInput: (0, _react2.jsx)("span", {
+        // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+        style: {
+          paddingLeft: "var(--ds-space-075, 6px)",
+          width: 24,
+          display: 'flex'
+        }
+      }, renderValidatorIcon(lastValidationResult)),
+      elemAfterInput: (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_tooltip.default, {
+        content: formatMessage(_messages.searchInputMessages.helpTooltipText),
+        position: "bottom"
+      }, (0, _react2.jsx)("a", {
+        href: AQLSupportDocumentLink,
+        target: "_blank",
+        css: buttonBaseStyles
+      }, (0, _react2.jsx)(_questionCircle.default, {
+        label: "label",
+        color: "var(--ds-icon, ".concat(_colors.N500, ")"),
+        LEGACY_size: "medium",
+        testId: "assets-datasource-modal-help",
+        spacing: "spacious"
+      }))), (0, _react2.jsx)(_button.LoadingButton, {
+        appearance: "primary",
+        css: searchButtonStyles,
+        iconBefore: (0, _react2.jsx)(_searchEditorSearch.default, {
+          label: formatMessage(_messages.searchInputMessages.placeholder),
+          LEGACY_size: "medium",
+          color: "currentColor",
+          spacing: "spacious"
+        }),
+        isLoading: isSearching,
+        spacing: "none",
+        testId: "assets-datasource-modal--aql-search-button",
+        type: "submit",
+        isDisabled: lastValidationResult.type !== 'valid'
+      })),
+      placeholder: formatMessage(_messages.searchInputMessages.placeholder),
+      testId: testId
+    })), lastValidationResult.type === 'invalid' && lastValidationResult.error && (0, _react2.jsx)(_form.ErrorMessage, null, lastValidationResult.error));
+  }));
+};

package/dist/cjs/ui/assets-modal/search-container/aql-search-input/index.compiled.css

@@ -0,0 +1,12 @@
+._16jlkb7n{flex-grow:1}
+._19pkx0bf{margin-top:var(--ds-space-negative-100,-8px)}
+._1bah1h6o{justify-content:center}
+._1e0c1txw{display:flex}
+._1o9zkb7n{flex-shrink:1}
+._2hwx12x7{margin-right:var(--ds-space-075,6px)}
+._2hwx1f3t{margin-right:var(--ds-space-100,.5em)}
+._2lx21bp4{flex-direction:column}
+._4cvr1h6o{align-items:center}
+._4t3i1osq{height:100%}
+._i0dlf1ug{flex-basis:0%}
+._kqswh2mm{position:relative}

package/dist/cjs/ui/assets-modal/search-container/aql-search-input/index.js

@@ -1,13 +1,18 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.AqlSearchInput = void 0;
+exports.AqlSearchInputNew = exports.AqlSearchInput = void 0;
+require("./index.compiled.css");
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
+var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _react = require("react");
-var _react2 = require("@emotion/react");
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _reactIntlNext = require("react-intl-next");
 var _button = require("@atlaskit/button");
 var _form = require("@atlaskit/form");
@@ -15,43 +20,45 @@ var _crossCircle = _interopRequireDefault(require("@atlaskit/icon/core/migration
 var _questionCircle = _interopRequireDefault(require("@atlaskit/icon/core/migration/question-circle"));
 var _searchEditorSearch = _interopRequireDefault(require("@atlaskit/icon/core/migration/search--editor-search"));
 var _successCheckCircle = _interopRequireDefault(require("@atlaskit/icon/core/migration/success--check-circle"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
 var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
 var _colors = require("@atlaskit/theme/colors");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _useValidateAqlText2 = require("../../../../hooks/useValidateAqlText");
 var _types = require("../../../../types/assets/types");
-var _styled = require("../styled");
+var _aqlSearchInputOld = require("./aql-search-input-old");
 var _messages = require("./messages");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-var buttonBaseStyles = (0, _react2.css)({
-  display: 'flex',
-  height: '100%',
-  position: 'relative',
-  alignItems: 'center',
-  justifyContent: 'center',
-  flexDirection: 'column',
-  marginRight: "var(--ds-space-100, 0.5em)"
+var _excluded = ["as", "style"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
+var FieldContainer = (0, _react.forwardRef)(function (_ref, __cmplr) {
+  var _ref$as = _ref.as,
+    C = _ref$as === void 0 ? "div" : _ref$as,
+    __cmpls = _ref.style,
+    __cmplp = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(C, (0, _extends2.default)({}, __cmplp, {
+    style: __cmpls,
+    ref: __cmplr,
+    className: (0, _runtime.ax)(["_16jlkb7n _1o9zkb7n _i0dlf1ug _19pkx0bf", __cmplp.className])
+  }));
 });
+if (process.env.NODE_ENV !== 'production') {
+  FieldContainer.displayName = 'FieldContainer';
+}
+var buttonBaseStyles = null;
 var AQLSupportDocumentLink = 'https://support.atlassian.com/jira-service-management-cloud/docs/use-assets-query-language-aql/';
-var searchButtonStyles = (0, _react2.css)({
-  marginRight: "var(--ds-space-075, 6px)"
-});
+var searchButtonStyles = null;
 var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
   if (lastValidationResult.type === 'loading') {
-    return (0, _react2.jsx)(_spinner.default, {
+    return /*#__PURE__*/React.createElement(_spinner.default, {
       size: "medium",
       testId: "assets-datasource-modal--aql-validating"
     });
   }
   if (lastValidationResult.type === 'invalid') {
-    return (0, _react2.jsx)(_crossCircle.default, {
+    return /*#__PURE__*/React.createElement(_crossCircle.default, {
       label: "label",
       color: "var(--ds-icon-danger, ".concat(_colors.R400, ")"),
       LEGACY_size: "medium",
@@ -60,7 +67,7 @@ var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
     });
   }
   if (lastValidationResult.type === 'valid') {
-    return (0, _react2.jsx)(_successCheckCircle.default, {
+    return /*#__PURE__*/React.createElement(_successCheckCircle.default, {
       label: "label",
       color: "var(--ds-icon-success, ".concat(_colors.G300, ")"),
       LEGACY_size: "medium",
@@ -68,7 +75,7 @@ var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
       spacing: "spacious"
     });
   }
-  return (0, _react2.jsx)(_searchEditorSearch.default, {
+  return /*#__PURE__*/React.createElement(_searchEditorSearch.default, {
     label: "label",
     LEGACY_size: "medium",
     testId: "assets-datasource-modal--aql-idle",
@@ -76,25 +83,25 @@ var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
     spacing: "spacious"
   });
 };
-var AqlSearchInput = exports.AqlSearchInput = function AqlSearchInput(_ref) {
-  var value = _ref.value,
-    workspaceId = _ref.workspaceId,
-    _ref$testId = _ref.testId,
-    testId = _ref$testId === void 0 ? 'assets-datasource-modal--aql-search-input' : _ref$testId,
-    isSearching = _ref.isSearching;
+var AqlSearchInputNew = exports.AqlSearchInputNew = function AqlSearchInputNew(_ref2) {
+  var value = _ref2.value,
+    workspaceId = _ref2.workspaceId,
+    _ref2$testId = _ref2.testId,
+    testId = _ref2$testId === void 0 ? 'assets-datasource-modal--aql-search-input' : _ref2$testId,
+    isSearching = _ref2.isSearching;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
   var _useValidateAqlText = (0, _useValidateAqlText2.useValidateAqlText)(workspaceId, value),
     debouncedValidation = _useValidateAqlText.debouncedValidation,
     lastValidationResult = _useValidateAqlText.lastValidationResult;
-  return (0, _react2.jsx)(_styled.FieldContainer, null, (0, _react2.jsx)(_form.Field, {
+  return /*#__PURE__*/React.createElement(FieldContainer, null, /*#__PURE__*/React.createElement(_form.Field, {
     name: _types.aqlKey,
     defaultValue: value,
     validate: debouncedValidation
-  }, function (_ref2) {
-    var fieldProps = _ref2.fieldProps;
-    return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_textfield.default, (0, _extends2.default)({}, fieldProps, {
-      elemBeforeInput: (0, _react2.jsx)("span", {
+  }, function (_ref3) {
+    var fieldProps = _ref3.fieldProps;
+    return /*#__PURE__*/React.createElement(_react.Fragment, null, /*#__PURE__*/React.createElement(_textfield.default, (0, _extends2.default)({}, fieldProps, {
+      elemBeforeInput: /*#__PURE__*/React.createElement("span", {
         // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         style: {
           paddingLeft: "var(--ds-space-075, 6px)",
@@ -102,23 +109,22 @@ var AqlSearchInput = exports.AqlSearchInput = function AqlSearchInput(_ref) {
           display: 'flex'
         }
       }, renderValidatorIcon(lastValidationResult)),
-      elemAfterInput: (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_tooltip.default, {
+      elemAfterInput: /*#__PURE__*/React.createElement(_react.Fragment, null, /*#__PURE__*/React.createElement(_tooltip.default, {
         content: formatMessage(_messages.searchInputMessages.helpTooltipText),
         position: "bottom"
-      }, (0, _react2.jsx)("a", {
+      }, /*#__PURE__*/React.createElement("a", {
         href: AQLSupportDocumentLink,
         target: "_blank",
-        css: buttonBaseStyles
-      }, (0, _react2.jsx)(_questionCircle.default, {
+        className: (0, _runtime.ax)(["_1e0c1txw _4t3i1osq _kqswh2mm _4cvr1h6o _1bah1h6o _2lx21bp4 _2hwx1f3t"])
+      }, /*#__PURE__*/React.createElement(_questionCircle.default, {
         label: "label",
         color: "var(--ds-icon, ".concat(_colors.N500, ")"),
         LEGACY_size: "medium",
         testId: "assets-datasource-modal-help",
         spacing: "spacious"
-      }))), (0, _react2.jsx)(_button.LoadingButton, {
+      }))), /*#__PURE__*/React.createElement(_button.LoadingButton, {
         appearance: "primary",
-        css: searchButtonStyles,
-        iconBefore: (0, _react2.jsx)(_searchEditorSearch.default, {
+        iconBefore: /*#__PURE__*/React.createElement(_searchEditorSearch.default, {
           label: formatMessage(_messages.searchInputMessages.placeholder),
           LEGACY_size: "medium",
           color: "currentColor",
@@ -128,10 +134,18 @@ var AqlSearchInput = exports.AqlSearchInput = function AqlSearchInput(_ref) {
         spacing: "none",
         testId: "assets-datasource-modal--aql-search-button",
         type: "submit",
-        isDisabled: lastValidationResult.type !== 'valid'
+        isDisabled: lastValidationResult.type !== 'valid',
+        className: (0, _runtime.ax)(["_2hwx12x7"])
       })),
       placeholder: formatMessage(_messages.searchInputMessages.placeholder),
       testId: testId
-    })), lastValidationResult.type === 'invalid' && lastValidationResult.error && (0, _react2.jsx)(_form.ErrorMessage, null, lastValidationResult.error));
+    })), lastValidationResult.type === 'invalid' && lastValidationResult.error && /*#__PURE__*/React.createElement(_form.ErrorMessage, null, lastValidationResult.error));
   }));
+};
+var AqlSearchInput = exports.AqlSearchInput = function AqlSearchInput(props) {
+  if ((0, _platformFeatureFlags.fg)('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(AqlSearchInputNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(_aqlSearchInputOld.AqlSearchInputOld, props);
+  }
 };

package/dist/cjs/ui/assets-modal/search-container/aql-search-input/loading-state.js

@@ -1,19 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AssetsAqlSearchInputSkeleton = void 0;
-var _react = require("@emotion/react");
+var _react = _interopRequireDefault(require("react"));
 var _linkingCommon = require("@atlaskit/linking-common");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
 var AssetsAqlSearchInputSkeleton = exports.AssetsAqlSearchInputSkeleton = function AssetsAqlSearchInputSkeleton() {
-  return (0, _react.jsx)(_linkingCommon.Skeleton, {
+  return /*#__PURE__*/_react.default.createElement(_linkingCommon.Skeleton, {
     width: "100%",
     height: "40px",
     testId: "assets-datasource-modal--aql-search-input-skeleton"

package/dist/cjs/ui/assets-modal/search-container/index.compiled.css

@@ -0,0 +1,4 @@
+._1bsb1osq{width:100%}
+._1e0c11p5{display:grid}
+._1p57pxbi{row-gap:var(--ds-space-200,1pc)}
+._p12ffkat{max-width:386px}