@atlaskit/link-datasource 3.19.2 → 3.20.1

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

@@ -1,12 +1,12 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["as", "style"];
+import "./index.compiled.css";
+import { forwardRef } from 'react';
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { Fragment } 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 { LoadingButton } from '@atlaskit/button';
 import { ErrorMessage, Field } from '@atlaskit/form';
@@ -14,36 +14,43 @@ import CrossCircleIcon from '@atlaskit/icon/core/migration/cross-circle';
 import QuestionCircleIcon from '@atlaskit/icon/core/migration/question-circle';
 import SearchIcon from '@atlaskit/icon/core/migration/search--editor-search';
 import CheckCircleIcon from '@atlaskit/icon/core/migration/success--check-circle';
+import { fg } from '@atlaskit/platform-feature-flags';
 import Spinner from '@atlaskit/spinner';
 import Textfield from '@atlaskit/textfield';
 import { G300, N500, R400 } from '@atlaskit/theme/colors';
 import Tooltip from '@atlaskit/tooltip';
 import { useValidateAqlText } from '../../../../hooks/useValidateAqlText';
 import { aqlKey } from '../../../../types/assets/types';
-import { FieldContainer } from '../styled';
+import { AqlSearchInputOld } from './aql-search-input-old';
 import { searchInputMessages } from './messages';
-var buttonBaseStyles = css({
-  display: 'flex',
-  height: '100%',
-  position: 'relative',
-  alignItems: 'center',
-  justifyContent: 'center',
-  flexDirection: 'column',
-  marginRight: "var(--ds-space-100, 0.5em)"
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
+var FieldContainer = forwardRef(function (_ref, __cmplr) {
+  var _ref$as = _ref.as,
+    C = _ref$as === void 0 ? "div" : _ref$as,
+    __cmpls = _ref.style,
+    __cmplp = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(C, _extends({}, __cmplp, {
+    style: __cmpls,
+    ref: __cmplr,
+    className: 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 = css({
-  marginRight: "var(--ds-space-075, 6px)"
-});
+var searchButtonStyles = null;
 var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
   if (lastValidationResult.type === 'loading') {
-    return jsx(Spinner, {
+    return /*#__PURE__*/React.createElement(Spinner, {
       size: "medium",
       testId: "assets-datasource-modal--aql-validating"
     });
   }
   if (lastValidationResult.type === 'invalid') {
-    return jsx(CrossCircleIcon, {
+    return /*#__PURE__*/React.createElement(CrossCircleIcon, {
       label: "label",
       color: "var(--ds-icon-danger, ".concat(R400, ")"),
       LEGACY_size: "medium",
@@ -52,7 +59,7 @@ var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
     });
   }
   if (lastValidationResult.type === 'valid') {
-    return jsx(CheckCircleIcon, {
+    return /*#__PURE__*/React.createElement(CheckCircleIcon, {
       label: "label",
       color: "var(--ds-icon-success, ".concat(G300, ")"),
       LEGACY_size: "medium",
@@ -60,7 +67,7 @@ var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
       spacing: "spacious"
     });
   }
-  return jsx(SearchIcon, {
+  return /*#__PURE__*/React.createElement(SearchIcon, {
     label: "label",
     LEGACY_size: "medium",
     testId: "assets-datasource-modal--aql-idle",
@@ -68,25 +75,25 @@ var renderValidatorIcon = function renderValidatorIcon(lastValidationResult) {
     spacing: "spacious"
   });
 };
-export var 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;
+export var 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 = useIntl(),
     formatMessage = _useIntl.formatMessage;
   var _useValidateAqlText = useValidateAqlText(workspaceId, value),
     debouncedValidation = _useValidateAqlText.debouncedValidation,
     lastValidationResult = _useValidateAqlText.lastValidationResult;
-  return jsx(FieldContainer, null, jsx(Field, {
+  return /*#__PURE__*/React.createElement(FieldContainer, null, /*#__PURE__*/React.createElement(Field, {
     name: aqlKey,
     defaultValue: value,
     validate: debouncedValidation
-  }, function (_ref2) {
-    var fieldProps = _ref2.fieldProps;
-    return jsx(Fragment, null, jsx(Textfield, _extends({}, fieldProps, {
-      elemBeforeInput: jsx("span", {
+  }, function (_ref3) {
+    var fieldProps = _ref3.fieldProps;
+    return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(Textfield, _extends({}, 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)",
@@ -94,23 +101,22 @@ export var AqlSearchInput = function AqlSearchInput(_ref) {
           display: 'flex'
         }
       }, renderValidatorIcon(lastValidationResult)),
-      elemAfterInput: jsx(Fragment, null, jsx(Tooltip, {
+      elemAfterInput: /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(Tooltip, {
         content: formatMessage(searchInputMessages.helpTooltipText),
         position: "bottom"
-      }, jsx("a", {
+      }, /*#__PURE__*/React.createElement("a", {
         href: AQLSupportDocumentLink,
         target: "_blank",
-        css: buttonBaseStyles
-      }, jsx(QuestionCircleIcon, {
+        className: ax(["_1e0c1txw _4t3i1osq _kqswh2mm _4cvr1h6o _1bah1h6o _2lx21bp4 _2hwx1f3t"])
+      }, /*#__PURE__*/React.createElement(QuestionCircleIcon, {
         label: "label",
         color: "var(--ds-icon, ".concat(N500, ")"),
         LEGACY_size: "medium",
         testId: "assets-datasource-modal-help",
         spacing: "spacious"
-      }))), jsx(LoadingButton, {
+      }))), /*#__PURE__*/React.createElement(LoadingButton, {
         appearance: "primary",
-        css: searchButtonStyles,
-        iconBefore: jsx(SearchIcon, {
+        iconBefore: /*#__PURE__*/React.createElement(SearchIcon, {
           label: formatMessage(searchInputMessages.placeholder),
           LEGACY_size: "medium",
           color: "currentColor",
@@ -120,10 +126,18 @@ export var AqlSearchInput = function AqlSearchInput(_ref) {
         spacing: "none",
         testId: "assets-datasource-modal--aql-search-button",
         type: "submit",
-        isDisabled: lastValidationResult.type !== 'valid'
+        isDisabled: lastValidationResult.type !== 'valid',
+        className: ax(["_2hwx12x7"])
       })),
       placeholder: formatMessage(searchInputMessages.placeholder),
       testId: testId
-    })), lastValidationResult.type === 'invalid' && lastValidationResult.error && jsx(ErrorMessage, null, lastValidationResult.error));
+    })), lastValidationResult.type === 'invalid' && lastValidationResult.error && /*#__PURE__*/React.createElement(ErrorMessage, null, lastValidationResult.error));
   }));
+};
+export var AqlSearchInput = function AqlSearchInput(props) {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(AqlSearchInputNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(AqlSearchInputOld, props);
+  }
 };

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

@@ -1,12 +1,7 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import React from 'react';
 import { Skeleton } from '@atlaskit/linking-common';
 export var AssetsAqlSearchInputSkeleton = function AssetsAqlSearchInputSkeleton() {
-  return jsx(Skeleton, {
+  return /*#__PURE__*/React.createElement(Skeleton, {
     width: "100%",
     height: "40px",
     testId: "assets-datasource-modal--aql-search-input-skeleton"

package/dist/esm/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}

package/dist/esm/ui/assets-modal/search-container/index.js

@@ -1,18 +1,54 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _extends from "@babel/runtime/helpers/extends";
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["as", "style"],
+  _excluded2 = ["as", "style"];
+import "./index.compiled.css";
+import { forwardRef } from 'react';
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import Form from '@atlaskit/form';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { useDatasourceAnalyticsEvents } from '../../../analytics';
 import { AqlSearchInput } from './aql-search-input';
 import { AssetsObjectSchemaSelect } from './object-schema-select';
-import { FormContainer, FormRowContainer, SchemaSelectContainer } from './styled';
+import { AssetsSearchContainerOld } from './search-container-old';
+import { FormRowContainer } from './styled';
 var DEFAULT_AQL_QUERY = '';
 var SEARCH_FORM_ID = 'linkDataSource.assets.configModal.searchContainer-form';
-export var AssetsSearchContainer = function AssetsSearchContainer(props) {
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
+var SchemaSelectContainer = forwardRef(function (_ref, __cmplr) {
+  var _ref$as = _ref.as,
+    C = _ref$as === void 0 ? "div" : _ref$as,
+    __cmpls = _ref.style,
+    __cmplp = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(C, _extends({}, __cmplp, {
+    style: __cmpls,
+    ref: __cmplr,
+    className: ax(["_1bsb1osq _p12ffkat", __cmplp.className])
+  }));
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
+if (process.env.NODE_ENV !== 'production') {
+  SchemaSelectContainer.displayName = 'SchemaSelectContainer';
+}
+var FormContainer = forwardRef(function (_ref2, __cmplr) {
+  var _ref2$as = _ref2.as,
+    C = _ref2$as === void 0 ? "form" : _ref2$as,
+    __cmpls = _ref2.style,
+    __cmplp = _objectWithoutProperties(_ref2, _excluded2);
+  return /*#__PURE__*/React.createElement(C, _extends({}, __cmplp, {
+    style: __cmpls,
+    ref: __cmplr,
+    className: ax(["_1e0c11p5 _1p57pxbi _1bsb1osq", __cmplp.className])
+  }));
+});
+if (process.env.NODE_ENV !== 'production') {
+  FormContainer.displayName = 'FormContainer';
+}
+export var AssetsSearchContainerNew = function AssetsSearchContainerNew(props) {
   var onSearch = props.onSearch,
     workspaceId = props.workspaceId,
     initialSearchData = props.initialSearchData,
@@ -29,24 +65,31 @@ export var AssetsSearchContainer = function AssetsSearchContainer(props) {
       onSearch(aql, objectSchema.value);
     }
   };
-  return jsx(Form, {
+  return /*#__PURE__*/React.createElement(Form, {
     onSubmit: onFormSubmit
-  }, function (_ref) {
+  }, function (_ref3) {
     var _initialSearchData$ob, _initialSearchData$ob2, _initialSearchData$aq;
-    var formProps = _ref.formProps;
-    return jsx(FormContainer, _extends({}, formProps, {
+    var formProps = _ref3.formProps;
+    return /*#__PURE__*/React.createElement(FormContainer, _extends({}, formProps, {
       id: SEARCH_FORM_ID
-    }), jsx(FormRowContainer, {
+    }), /*#__PURE__*/React.createElement(FormRowContainer, {
       isNarrowGap: true
-    }, modalTitle, jsx(SchemaSelectContainer, null, jsx(AssetsObjectSchemaSelect, {
+    }, modalTitle, /*#__PURE__*/React.createElement(SchemaSelectContainer, null, /*#__PURE__*/React.createElement(AssetsObjectSchemaSelect, {
       value: (_initialSearchData$ob = initialSearchData.objectSchema) !== null && _initialSearchData$ob !== void 0 ? _initialSearchData$ob : undefined,
       workspaceId: workspaceId,
       initialObjectSchemas: (_initialSearchData$ob2 = initialSearchData.objectSchemas) !== null && _initialSearchData$ob2 !== void 0 ? _initialSearchData$ob2 : undefined,
       classNamePrefix: "assets-datasource-modal--object-schema-select"
-    }))), jsx(FormRowContainer, null, jsx(AqlSearchInput, {
+    }))), /*#__PURE__*/React.createElement(FormRowContainer, null, /*#__PURE__*/React.createElement(AqlSearchInput, {
       value: (_initialSearchData$aq = initialSearchData.aql) !== null && _initialSearchData$aq !== void 0 ? _initialSearchData$aq : DEFAULT_AQL_QUERY,
       workspaceId: workspaceId,
       isSearching: isSearching
     })));
   });
+};
+export var AssetsSearchContainer = function AssetsSearchContainer(props) {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(AssetsSearchContainerNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(AssetsSearchContainerOld, props);
+  }
 };

package/dist/esm/ui/assets-modal/search-container/loading-state-old.js

@@ -0,0 +1,17 @@
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { jsx } from '@emotion/react';
+import { AssetsAqlSearchInputSkeleton } from './aql-search-input/loading-state';
+import { AssetsObjectSchemaSelectSkeleton } from './object-schema-select/loading-state';
+import { FormContainer, FormRowContainer, SchemaSelectContainer } from './styled-old';
+export var AssetsSearchContainerLoadingOld = function AssetsSearchContainerLoadingOld(_ref) {
+  var modalTitle = _ref.modalTitle;
+  return jsx(FormContainer, {
+    "data-testid": "assets-datasource-modal--search-container-skeleton"
+  }, jsx(FormRowContainer, {
+    isNarrowGap: true
+  }, modalTitle, jsx(SchemaSelectContainer, null, jsx(AssetsObjectSchemaSelectSkeleton, null))), jsx(FormRowContainer, null, jsx(AssetsAqlSearchInputSkeleton, null)));
+};

package/dist/esm/ui/assets-modal/search-container/loading-state.compiled.css

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

package/dist/esm/ui/assets-modal/search-container/loading-state.js

@@ -1,17 +1,59 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+/* loading-state.tsx generated by @compiled/babel-plugin v0.36.0 */
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["as", "style"],
+  _excluded2 = ["as", "style"];
+import "./loading-state.compiled.css";
+import { forwardRef } from 'react';
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { fg } from '@atlaskit/platform-feature-flags';
 import { AssetsAqlSearchInputSkeleton } from './aql-search-input/loading-state';
+import { AssetsSearchContainerLoadingOld } from './loading-state-old';
 import { AssetsObjectSchemaSelectSkeleton } from './object-schema-select/loading-state';
-import { FormContainer, FormRowContainer, SchemaSelectContainer } from './styled';
-export var AssetsSearchContainerLoading = function AssetsSearchContainerLoading(_ref) {
-  var modalTitle = _ref.modalTitle;
-  return jsx(FormContainer, {
+import { FormRowContainer } from './styled';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
+var SchemaSelectContainer = forwardRef(function (_ref, __cmplr) {
+  var _ref$as = _ref.as,
+    C = _ref$as === void 0 ? "div" : _ref$as,
+    __cmpls = _ref.style,
+    __cmplp = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(C, _extends({}, __cmplp, {
+    style: __cmpls,
+    ref: __cmplr,
+    className: ax(["_1bsb1osq _p12ffkat", __cmplp.className])
+  }));
+});
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
+if (process.env.NODE_ENV !== 'production') {
+  SchemaSelectContainer.displayName = 'SchemaSelectContainer';
+}
+var FormContainer = forwardRef(function (_ref2, __cmplr) {
+  var _ref2$as = _ref2.as,
+    C = _ref2$as === void 0 ? "form" : _ref2$as,
+    __cmpls = _ref2.style,
+    __cmplp = _objectWithoutProperties(_ref2, _excluded2);
+  return /*#__PURE__*/React.createElement(C, _extends({}, __cmplp, {
+    style: __cmpls,
+    ref: __cmplr,
+    className: ax(["_1e0c11p5 _1p57pxbi _1bsb1osq", __cmplp.className])
+  }));
+});
+if (process.env.NODE_ENV !== 'production') {
+  FormContainer.displayName = 'FormContainer';
+}
+var AssetsSearchContainerLoadingNew = function AssetsSearchContainerLoadingNew(_ref3) {
+  var modalTitle = _ref3.modalTitle;
+  return /*#__PURE__*/React.createElement(FormContainer, {
     "data-testid": "assets-datasource-modal--search-container-skeleton"
-  }, jsx(FormRowContainer, {
+  }, /*#__PURE__*/React.createElement(FormRowContainer, {
     isNarrowGap: true
-  }, modalTitle, jsx(SchemaSelectContainer, null, jsx(AssetsObjectSchemaSelectSkeleton, null))), jsx(FormRowContainer, null, jsx(AssetsAqlSearchInputSkeleton, null)));
+  }, modalTitle, /*#__PURE__*/React.createElement(SchemaSelectContainer, null, /*#__PURE__*/React.createElement(AssetsObjectSchemaSelectSkeleton, null))), /*#__PURE__*/React.createElement(FormRowContainer, null, /*#__PURE__*/React.createElement(AssetsAqlSearchInputSkeleton, null)));
+};
+export var AssetsSearchContainerLoading = function AssetsSearchContainerLoading(props) {
+  if (fg('bandicoots-compiled-migration-link-datasource')) {
+    return /*#__PURE__*/React.createElement(AssetsSearchContainerLoadingNew, props);
+  } else {
+    return /*#__PURE__*/React.createElement(AssetsSearchContainerLoadingOld, props);
+  }
 };

package/dist/esm/ui/assets-modal/search-container/object-schema-select/index.compiled.css

@@ -0,0 +1,4 @@
+._16jlkb7n{flex-grow:1}
+._19pkx0bf{margin-top:var(--ds-space-negative-100,-8px)}
+._1o9zkb7n{flex-shrink:1}
+._i0dlf1ug{flex-basis:0%}

package/dist/esm/ui/assets-modal/search-container/object-schema-select/index.js

@@ -1,18 +1,17 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["onChange", "onFocus"];
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["as", "style"],
+  _excluded2 = ["onChange", "onFocus"];
+import "./index.compiled.css";
+import { forwardRef } from 'react';
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
 import debounce from 'debounce-promise';
 import { useIntl } from 'react-intl-next';
 import { Field } from '@atlaskit/form';
@@ -20,9 +19,24 @@ import { AsyncSelect } from '@atlaskit/select';
 import { layers } from '@atlaskit/theme/constants';
 import { useObjectSchemas } from '../../../../hooks/useObjectSchemas';
 import { objectSchemaKey } from '../../../../types/assets/types';
-import { FieldContainer } from '../styled';
 import { objectSchemaSelectMessages } from './messages';
 import { objectSchemaToSelectOption } from './utils';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
+var FieldContainer = forwardRef(function (_ref, __cmplr) {
+  var _ref$as = _ref.as,
+    C = _ref$as === void 0 ? "div" : _ref$as,
+    __cmpls = _ref.style,
+    __cmplp = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(C, _extends({}, __cmplp, {
+    style: __cmpls,
+    ref: __cmplr,
+    className: ax(["_16jlkb7n _1o9zkb7n _i0dlf1ug _19pkx0bf", __cmplp.className])
+  }));
+});
+if (process.env.NODE_ENV !== 'production') {
+  FieldContainer.displayName = 'FieldContainer';
+}
 export var SEARCH_DEBOUNCE_MS = 350;
 var mapObjectSchemasToOptions = function mapObjectSchemasToOptions(objectSchemas) {
   return objectSchemas ? objectSchemas.map(function (objectSchema) {
@@ -44,12 +58,12 @@ export var selectInAModalStyleFixProps = {
   },
   menuPortalTarget: document.body
 };
-export var AssetsObjectSchemaSelect = function AssetsObjectSchemaSelect(_ref) {
-  var value = _ref.value,
-    workspaceId = _ref.workspaceId,
-    initialObjectSchemas = _ref.initialObjectSchemas,
-    _ref$classNamePrefix = _ref.classNamePrefix,
-    classNamePrefix = _ref$classNamePrefix === void 0 ? 'assets-datasource-modal--object-schema-select' : _ref$classNamePrefix;
+export var AssetsObjectSchemaSelect = function AssetsObjectSchemaSelect(_ref2) {
+  var value = _ref2.value,
+    workspaceId = _ref2.workspaceId,
+    initialObjectSchemas = _ref2.initialObjectSchemas,
+    _ref2$classNamePrefix = _ref2.classNamePrefix,
+    classNamePrefix = _ref2$classNamePrefix === void 0 ? 'assets-datasource-modal--object-schema-select' : _ref2$classNamePrefix;
   var _useIntl = useIntl(),
     formatMessage = _useIntl.formatMessage;
   var _useObjectSchemas = useObjectSchemas(workspaceId),
@@ -57,7 +71,7 @@ export var AssetsObjectSchemaSelect = function AssetsObjectSchemaSelect(_ref) {
     objectSchemasLoading = _useObjectSchemas.objectSchemasLoading;
   var selectedObjectSchema = value ? objectSchemaToSelectOption(value) : undefined;
   var loadOptions = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(inputValue) {
+    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(inputValue) {
       var _yield$fetchObjectSch, objectSchemas;
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
@@ -75,7 +89,7 @@ export var AssetsObjectSchemaSelect = function AssetsObjectSchemaSelect(_ref) {
       }, _callee);
     }));
     return function loadOptions(_x) {
-      return _ref2.apply(this, arguments);
+      return _ref3.apply(this, arguments);
     };
   }();
   var debouncedLoadOptions = debounce(loadOptions, SEARCH_DEBOUNCE_MS);
@@ -85,18 +99,18 @@ export var AssetsObjectSchemaSelect = function AssetsObjectSchemaSelect(_ref) {
     }
     return undefined;
   };
-  return jsx(FieldContainer, null, jsx(Field, {
+  return /*#__PURE__*/React.createElement(FieldContainer, null, /*#__PURE__*/React.createElement(Field, {
     name: objectSchemaKey,
     defaultValue: selectedObjectSchema,
     validate: function validate(value) {
       return validateSchema(value);
     }
-  }, function (_ref3) {
-    var _ref3$fieldProps = _ref3.fieldProps,
-      _onChange = _ref3$fieldProps.onChange,
-      onFocus = _ref3$fieldProps.onFocus,
-      restFieldProps = _objectWithoutProperties(_ref3$fieldProps, _excluded);
-    return jsx(AsyncSelect, _extends({
+  }, function (_ref4) {
+    var _ref4$fieldProps = _ref4.fieldProps,
+      _onChange = _ref4$fieldProps.onChange,
+      onFocus = _ref4$fieldProps.onFocus,
+      restFieldProps = _objectWithoutProperties(_ref4$fieldProps, _excluded2);
+    return /*#__PURE__*/React.createElement(AsyncSelect, _extends({
       autoFocus: true,
       classNamePrefix: classNamePrefix,
       isLoading: objectSchemasLoading,

package/dist/esm/ui/assets-modal/search-container/object-schema-select/loading-state.js

@@ -1,12 +1,7 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { jsx } from '@emotion/react';
+import React from 'react';
 import { Skeleton } from '@atlaskit/linking-common';
 export var AssetsObjectSchemaSelectSkeleton = function AssetsObjectSchemaSelectSkeleton() {
-  return jsx(Skeleton, {
+  return /*#__PURE__*/React.createElement(Skeleton, {
     width: "100%",
     height: "40px",
     testId: "assets-datasource-modal--object-schema-select-skeleton"

package/dist/esm/ui/assets-modal/search-container/search-container-old.js

@@ -0,0 +1,52 @@
+import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { jsx } from '@emotion/react';
+import Form from '@atlaskit/form';
+import { useDatasourceAnalyticsEvents } from '../../../analytics';
+import { AqlSearchInput } from './aql-search-input';
+import { AssetsObjectSchemaSelect } from './object-schema-select';
+import { FormContainer, FormRowContainer, SchemaSelectContainer } from './styled-old';
+var DEFAULT_AQL_QUERY = '';
+var SEARCH_FORM_ID = 'linkDataSource.assets.configModal.searchContainer-form';
+export var AssetsSearchContainerOld = function AssetsSearchContainerOld(props) {
+  var onSearch = props.onSearch,
+    workspaceId = props.workspaceId,
+    initialSearchData = props.initialSearchData,
+    modalTitle = props.modalTitle,
+    isSearching = props.isSearching;
+  var _useDatasourceAnalyti = useDatasourceAnalyticsEvents(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
+  var onFormSubmit = function onFormSubmit(searchFormValues) {
+    var aql = searchFormValues.aql,
+      objectSchema = searchFormValues.objectSchema;
+    if (aql && objectSchema) {
+      fireEvent('ui.aqlEditor.searched', {});
+      // Pass the validated aql and object schema back to modal
+      onSearch(aql, objectSchema.value);
+    }
+  };
+  return jsx(Form, {
+    onSubmit: onFormSubmit
+  }, function (_ref) {
+    var _initialSearchData$ob, _initialSearchData$ob2, _initialSearchData$aq;
+    var formProps = _ref.formProps;
+    return jsx(FormContainer, _extends({}, formProps, {
+      id: SEARCH_FORM_ID
+    }), jsx(FormRowContainer, {
+      isNarrowGap: true
+    }, modalTitle, jsx(SchemaSelectContainer, null, jsx(AssetsObjectSchemaSelect, {
+      value: (_initialSearchData$ob = initialSearchData.objectSchema) !== null && _initialSearchData$ob !== void 0 ? _initialSearchData$ob : undefined,
+      workspaceId: workspaceId,
+      initialObjectSchemas: (_initialSearchData$ob2 = initialSearchData.objectSchemas) !== null && _initialSearchData$ob2 !== void 0 ? _initialSearchData$ob2 : undefined,
+      classNamePrefix: "assets-datasource-modal--object-schema-select"
+    }))), jsx(FormRowContainer, null, jsx(AqlSearchInput, {
+      value: (_initialSearchData$aq = initialSearchData.aql) !== null && _initialSearchData$aq !== void 0 ? _initialSearchData$aq : DEFAULT_AQL_QUERY,
+      workspaceId: workspaceId,
+      isSearching: isSearching
+    })));
+  });
+};

package/dist/esm/ui/assets-modal/search-container/styled-old.js

@@ -0,0 +1,34 @@
+// 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, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
+export var FormRowContainer = styled.div(function (props) {
+  return {
+    alignItems: 'center',
+    display: 'flex',
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+    gap: props.isNarrowGap ? "var(--ds-space-100, 8px)" : "var(--ds-space-200, 16px)",
+    flexGrow: 1,
+    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 var FormContainer = styled.form({
+  display: 'grid',
+  rowGap: "var(--ds-space-200, 16px)",
+  width: '100%'
+});
+
+// Override the top margin of fields
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var FieldContainer = styled.div({
+  flex: 1,
+  marginTop: "var(--ds-space-negative-100, -8px)"
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var SchemaSelectContainer = styled.div({
+  width: '100%',
+  maxWidth: '386px'
+});
+"\nmv click-summary-column-dropdown-to-see-its-items--default--bandicoots-compiled-migration-smartcard-false.png click-summary-column-dropdown-to-see-its-items--default--bandicoots-compiled-migration-link-datasource-false.png\nmv click-summary-column-dropdown-to-see-its-items--default--bandicoots-compiled-migration-smartcard-true.png click-summary-column-dropdown-to-see-its-items--default--bandicoots-compiled-migration-link-datasource-true.png\nmv double-lined-date-of-creation-header-text-is-truncated-with-ellipses--default--bandicoots-compiled-migration-smartcard-false.png double-lined-date-of-creation-header-text-is-truncated-with-ellipses--default--bandicoots-compiled-migration-link-datasource-false.png\nmv double-lined-date-of-creation-header-text-is-truncated-with-ellipses--default--bandicoots-compiled-migration-smartcard-true.png double-lined-date-of-creation-header-text-is-truncated-with-ellipses--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-bug-icon--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-bug-icon--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-bug-icon--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-bug-icon--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-date--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-date--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-date--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-date--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-label-another-third-labels--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-label-another-third-labels--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-label-another-third-labels--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-label-another-third-labels--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-labels-header--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-labels-header--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-labels-header--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-labels-header--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-people--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-people--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-people--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-people--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-people-header--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-people-header--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-people-header--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-people-header--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-status-header--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-status-header--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-status-header--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-status-header--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-summary--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-summary--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-summary--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-summary--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-to-do-status--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-to-do-status--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-to-do-status--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-to-do-status--default--bandicoots-compiled-migration-link-datasource-true.png\nmv hovering-over-unassigned-assignee--default--bandicoots-compiled-migration-smartcard-false.png hovering-over-unassigned-assignee--default--bandicoots-compiled-migration-link-datasource-false.png\nmv hovering-over-unassigned-assignee--default--bandicoots-compiled-migration-smartcard-true.png hovering-over-unassigned-assignee--default--bandicoots-compiled-migration-link-datasource-true.png\nmv toggle-wrapping-on-several-columns--default--bandicoots-compiled-migration-smartcard-false.png toggle-wrapping-on-several-columns--default--bandicoots-compiled-migration-link-datasource-false.png\nmv toggle-wrapping-on-several-columns--default--bandicoots-compiled-migration-smartcard-true.png toggle-wrapping-on-several-columns--default--bandicoots-compiled-migration-link-datasource-true.png\n";