@atlaskit/link-datasource 7.12.2 → 7.13.0

package/dist/cjs/ui/jira-issues-modal/jira-search-container/embedded.js

@@ -0,0 +1,321 @@
+/* embedded.tsx generated by @compiled/babel-plugin v3.0.2 */
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EmbeddedJiraSearchContainer = void 0;
+require("./embedded.compiled.css");
+var _runtime = require("@compiled/react/runtime");
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactIntl = require("react-intl");
+var _useDebounce = require("use-debounce");
+var _box = require("@atlaskit/primitives/compiled/box");
+var _flex = require("@atlaskit/primitives/compiled/flex");
+var _text = require("@atlaskit/primitives/compiled/text");
+var _analytics = require("../../../analytics");
+var _basicSearchInput = require("../../common/modal/basic-search-input");
+var _messages = require("../../common/modal/basic-search-input/messages");
+var _ModeSwitcher = require("../../common/modal/mode-switcher/ModeSwitcher");
+var _constants = require("../../common/modal/popup-select/constants");
+var _useHydrateJqlQuery2 = require("../basic-filters/hooks/useHydrateJqlQuery");
+var _index = _interopRequireDefault(require("../basic-filters/ui/index"));
+var _isQueryTooComplex = require("../basic-filters/utils/isQueryTooComplex");
+var _jqlEditor = require("../jql-editor");
+var _buildJQL = require("./buildJQL");
+var _messages2 = require("./messages");
+var _excluded = ["basicInputTextValue"];
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+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) { (0, _defineProperty2.default)(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; }
+var styles = {
+  inlineSearch: "_16jlkb7n _i0dlghg7 _1ul9idpf",
+  inlineSwitcher: "_1o9zidpf",
+  basicSearchInputBoxStyles: "_1bsb1osq",
+  basicSearchInputContainerStyles: "_16jlkb7n _1n261g80 _1p57u2gc",
+  inputContainerStyles: "_4cvr1y6m _1e0c1txw _1tket9kd",
+  modeSwitcherContainerStyles: "_19pk1b66"
+};
+var EmbeddedJiraSearchContainer = exports.EmbeddedJiraSearchContainer = function EmbeddedJiraSearchContainer(props) {
+  var DEFAULT_JQL_QUERY = props.defaultJql,
+    ALLOWED_ORDER_BY_KEYS = props.allowedOrderByKeys,
+    isSearching = props.isSearching,
+    parameters = props.parameters,
+    onSearch = props.onSearch,
+    onSearchMethodChangeCallback = props.onSearchMethodChange,
+    initialSearchMethod = props.initialSearchMethod,
+    setSearchBarJql = props.setSearchBarJql,
+    _props$searchBarJql = props.searchBarJql,
+    searchBarJql = _props$searchBarJql === void 0 ? DEFAULT_JQL_QUERY : _props$searchBarJql,
+    site = props.site,
+    setHasJqlSyntaxErrors = props.setHasJqlSyntaxErrors,
+    _props$layout = props.layout,
+    layout = _props$layout === void 0 ? 'modal' : _props$layout,
+    _props$initialBasicSe = props.initialBasicSearchTerm,
+    initialBasicSearchTerm = _props$initialBasicSe === void 0 ? '' : _props$initialBasicSe,
+    _props$allowBasicMode = props.allowBasicModeReset,
+    allowBasicModeReset = _props$allowBasicMode === void 0 ? false : _props$allowBasicMode,
+    _props$showBasicSearc = props.showBasicSearchButton,
+    showBasicSearchButton = _props$showBasicSearc === void 0 ? true : _props$showBasicSearc,
+    textSearchField = props.textSearchField;
+  var _ref = parameters || {},
+    currentCloudId = _ref.cloudId;
+  var _useIntl = (0, _reactIntl.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var _useDatasourceAnalyti = (0, _analytics.useDatasourceAnalyticsEvents)(),
+    fireEvent = _useDatasourceAnalyti.fireEvent;
+  var _useState = (0, _react.useState)(initialBasicSearchTerm),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    basicSearchTerm = _useState2[0],
+    setBasicSearchTerm = _useState2[1];
+  var _useState3 = (0, _react.useState)(initialSearchMethod),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    currentSearchMethod = _useState4[0],
+    setCurrentSearchMethod = _useState4[1];
+  var _useState5 = (0, _react.useState)(currentCloudId),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    cloudId = _useState6[0],
+    setCloudId = _useState6[1];
+  var _useState7 = (0, _react.useState)(false),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    isComplexQuery = _useState8[0],
+    setIsComplexQuery = _useState8[1];
+  var _useState9 = (0, _react.useState)(),
+    _useState0 = (0, _slicedToArray2.default)(_useState9, 2),
+    orderKey = _useState0[0],
+    setOrderKey = _useState0[1];
+  var _useState1 = (0, _react.useState)(),
+    _useState10 = (0, _slicedToArray2.default)(_useState1, 2),
+    orderDirection = _useState10[0],
+    setOrderDirection = _useState10[1];
+  var _useState11 = (0, _react.useState)({}),
+    _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+    filterSelections = _useState12[0],
+    setFilterSelections = _useState12[1];
+  var basicDraft = (0, _react.useRef)({
+    jql: initialSearchMethod === 'basic' ? searchBarJql : (0, _buildJQL.buildJQL)({
+      rawSearch: initialBasicSearchTerm,
+      textSearchField: textSearchField
+    }),
+    term: initialBasicSearchTerm,
+    selections: {}
+  });
+  var advancedDraft = (0, _react.useRef)();
+  var modeSwitcherOptionsMap = (0, _react.useMemo)(function () {
+    return {
+      jql: {
+        label: 'JQL',
+        value: 'jql'
+      },
+      basic: {
+        label: formatMessage(_messages2.modeSwitcherMessages.basicTextSearchLabel),
+        value: 'basic',
+        disabled: isComplexQuery && !allowBasicModeReset,
+        tooltipText: isComplexQuery && !allowBasicModeReset ? formatMessage(_messages2.modeSwitcherMessages.basicModeSwitchDisabledTooltipText) : ''
+      }
+    };
+  }, [formatMessage, isComplexQuery, allowBasicModeReset]);
+  var modeSwitcherOptions = (0, _react.useMemo)(function () {
+    return [modeSwitcherOptionsMap.basic, modeSwitcherOptionsMap.jql];
+  }, [modeSwitcherOptionsMap]);
+  var _useHydrateJqlQuery = (0, _useHydrateJqlQuery2.useHydrateJqlQuery)(cloudId || '', searchBarJql),
+    hydratedOptions = _useHydrateJqlQuery.hydratedOptions,
+    fetchHydratedJqlOptions = _useHydrateJqlQuery.fetchHydratedJqlOptions,
+    basicFilterHydrationStatus = _useHydrateJqlQuery.status;
+  var onSearchMethodChange = (0, _react.useCallback)(function (searchMethod) {
+    if (allowBasicModeReset) {
+      if (searchMethod === 'jql') {
+        var _advancedDraft$curren;
+        basicDraft.current = {
+          jql: searchBarJql,
+          term: basicSearchTerm,
+          selections: filterSelections
+        };
+        setSearchBarJql((_advancedDraft$curren = advancedDraft.current) !== null && _advancedDraft$curren !== void 0 ? _advancedDraft$curren : searchBarJql);
+      } else if ((0, _isQueryTooComplex.isQueryTooComplex)(searchBarJql)) {
+        advancedDraft.current = searchBarJql;
+        setSearchBarJql(basicDraft.current.jql);
+        setBasicSearchTerm(basicDraft.current.term);
+        setFilterSelections(basicDraft.current.selections);
+      }
+    }
+    onSearchMethodChangeCallback(searchMethod);
+    setCurrentSearchMethod(searchMethod);
+  }, [onSearchMethodChangeCallback, allowBasicModeReset, searchBarJql, basicSearchTerm, filterSelections, setSearchBarJql]);
+  var handleBasicSearchChange = (0, _react.useCallback)(function (e) {
+    var rawSearch = e.currentTarget.value;
+    setBasicSearchTerm(rawSearch);
+    setSearchBarJql((0, _buildJQL.buildJQL)({
+      rawSearch: rawSearch,
+      textSearchField: textSearchField,
+      filterValues: filterSelections,
+      orderDirection: orderDirection,
+      orderKey: orderKey
+    }));
+  }, [setSearchBarJql, filterSelections, orderDirection, orderKey, textSearchField]);
+  var onQueryChange = (0, _react.useCallback)(function (query, jast) {
+    var _query$split$map$filt, _fragments$at, _fragments$at2, _fragments$at3;
+    setHasJqlSyntaxErrors === null || setHasJqlSyntaxErrors === void 0 || setHasJqlSyntaxErrors(jast.errors.length > 0);
+    // determine if order keys have been set so they can be saved and persisted when changes occur in basic search
+    var fragments = (_query$split$map$filt = query === null || query === void 0 ? void 0 : query.split(/(^| )(order by)( |$)/i).map(function (item) {
+      return item.trim();
+    }).filter(Boolean)) !== null && _query$split$map$filt !== void 0 ? _query$split$map$filt : [];
+    var hasOrder = ((_fragments$at = fragments.at(-2)) === null || _fragments$at === void 0 ? void 0 : _fragments$at.toLowerCase()) === 'order by';
+    var key = hasOrder ? (_fragments$at2 = fragments.at(-1)) === null || _fragments$at2 === void 0 ? void 0 : _fragments$at2.split(' ').at(-2) : undefined;
+    var order = hasOrder ? (_fragments$at3 = fragments.at(-1)) === null || _fragments$at3 === void 0 ? void 0 : _fragments$at3.split(' ').at(-1) : undefined;
+
+    // TODO: confirm if these are the only order keys we want to preserve - existing whiteboard logic
+    if (key && ALLOWED_ORDER_BY_KEYS.includes(key)) {
+      setOrderKey(key);
+      setOrderDirection(order);
+    }
+    setSearchBarJql(query);
+  }, [setSearchBarJql, setHasJqlSyntaxErrors]);
+  var handleSearch = (0, _react.useCallback)(function () {
+    var isCurrentQueryComplex = (0, _isQueryTooComplex.isQueryTooComplex)(searchBarJql);
+    if (currentSearchMethod === 'basic') {
+      advancedDraft.current = undefined;
+    }
+    onSearch({
+      jql: searchBarJql
+    }, {
+      searchMethod: currentSearchMethod,
+      basicFilterSelections: filterSelections,
+      isQueryComplex: isCurrentQueryComplex
+    });
+    if (currentSearchMethod === 'jql') {
+      fireEvent('ui.jqlEditor.searched', {
+        isQueryComplex: isCurrentQueryComplex
+      });
+      setIsComplexQuery(isCurrentQueryComplex);
+      if (!isCurrentQueryComplex) {
+        fetchHydratedJqlOptions();
+      }
+    }
+  }, [currentSearchMethod, fetchHydratedJqlOptions, filterSelections, fireEvent, searchBarJql, onSearch]);
+  var _useDebouncedCallback = (0, _useDebounce.useDebouncedCallback)(function (filterValues) {
+      var jqlWithFilterValues = (0, _buildJQL.buildJQL)({
+        rawSearch: basicSearchTerm,
+        textSearchField: textSearchField,
+        filterValues: filterValues,
+        orderDirection: orderDirection,
+        orderKey: orderKey
+      });
+      advancedDraft.current = undefined;
+      setSearchBarJql(jqlWithFilterValues);
+      var isCurrentQueryComplex = (0, _isQueryTooComplex.isQueryTooComplex)(jqlWithFilterValues);
+      onSearch({
+        jql: jqlWithFilterValues
+      }, {
+        searchMethod: currentSearchMethod,
+        basicFilterSelections: filterValues,
+        isQueryComplex: isCurrentQueryComplex
+      });
+    }, _constants.FILTER_SELECTION_DEBOUNCE_MS),
+    _useDebouncedCallback2 = (0, _slicedToArray2.default)(_useDebouncedCallback, 1),
+    debouncedBasicFilterSelectionChange = _useDebouncedCallback2[0];
+  var handleBasicFilterSelectionChange = (0, _react.useCallback)(function (filterType, options) {
+    var updatedSelection = _objectSpread(_objectSpread({}, filterSelections), {}, (0, _defineProperty2.default)({}, filterType, options));
+    setFilterSelections(updatedSelection);
+    debouncedBasicFilterSelectionChange(updatedSelection);
+  }, [debouncedBasicFilterSelectionChange, filterSelections]);
+  (0, _react.useEffect)(function () {
+    var isCurrentQueryComplex = (0, _isQueryTooComplex.isQueryTooComplex)(searchBarJql);
+    setIsComplexQuery(isCurrentQueryComplex);
+    if (!isCurrentQueryComplex && searchBarJql !== DEFAULT_JQL_QUERY) {
+      fetchHydratedJqlOptions();
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  (0, _react.useEffect)(function () {
+    if (basicFilterHydrationStatus === 'resolved') {
+      var basicInputTextValue = hydratedOptions.basicInputTextValue,
+        hydratedFilterOptions = (0, _objectWithoutProperties2.default)(hydratedOptions, _excluded);
+      setFilterSelections(hydratedFilterOptions);
+      if (basicInputTextValue) {
+        setBasicSearchTerm(basicInputTextValue);
+      }
+    }
+  }, [hydratedOptions, basicFilterHydrationStatus]);
+  (0, _react.useEffect)(function () {
+    if (currentCloudId !== cloudId) {
+      basicDraft.current = {
+        jql: DEFAULT_JQL_QUERY,
+        term: '',
+        selections: {}
+      };
+      advancedDraft.current = undefined;
+      setBasicSearchTerm('');
+      setSearchBarJql(DEFAULT_JQL_QUERY);
+      setIsComplexQuery(false);
+      setOrderKey(undefined);
+      setOrderDirection(undefined);
+      setFilterSelections({});
+      setCloudId(currentCloudId);
+    }
+  }, [currentCloudId, cloudId, setSearchBarJql]);
+  var searchInput = currentSearchMethod === 'basic' ? /*#__PURE__*/_react.default.createElement(_box.Box, {
+    xcss: layout === 'inline' ? styles.inlineSearch : styles.basicSearchInputBoxStyles
+  }, /*#__PURE__*/_react.default.createElement(_flex.Flex, {
+    alignItems: "center",
+    xcss: styles.basicSearchInputContainerStyles
+  }, /*#__PURE__*/_react.default.createElement(_basicSearchInput.BasicSearchInput, {
+    isCompact: layout === 'inline',
+    isSearching: isSearching,
+    onChange: handleBasicSearchChange,
+    onSearch: handleSearch,
+    searchTerm: basicSearchTerm,
+    showSearchButton: showBasicSearchButton,
+    ariaLabel: _messages.basicSearchInputMessages.basicTextSearchLabel,
+    testId: "jira-datasource-modal",
+    fullWidth: false
+  }), /*#__PURE__*/_react.default.createElement(_index.default, {
+    jql: searchBarJql,
+    site: site,
+    onChange: handleBasicFilterSelectionChange,
+    selections: filterSelections,
+    isJQLHydrating: basicFilterHydrationStatus === 'loading',
+    isInline: layout === 'inline'
+  })), layout !== 'inline' && /*#__PURE__*/_react.default.createElement(_text.Text, {
+    size: "small",
+    color: "color.text.subtlest",
+    testId: "jira-search-placeholder"
+  }, formatMessage(_messages.basicSearchInputMessages.basicTextSearchLabel))) : /*#__PURE__*/_react.default.createElement(_jqlEditor.JiraJQLEditor, {
+    isCompact: layout === 'inline',
+    cloudId: cloudId || '',
+    autoFocus: layout !== 'inline',
+    isSearching: isSearching,
+    onChange: onQueryChange,
+    onSearch: handleSearch,
+    query: searchBarJql
+  });
+  var modeSwitcher = /*#__PURE__*/_react.default.createElement(_ModeSwitcher.ModeSwitcher, {
+    isInline: layout === 'inline',
+    onOptionValueChange: onSearchMethodChange,
+    selectedOptionValue: currentSearchMethod,
+    options: modeSwitcherOptions
+  });
+  if (layout === 'inline') {
+    return /*#__PURE__*/_react.default.createElement(_flex.Flex, {
+      alignItems: "start",
+      gap: "space.100",
+      wrap: "wrap",
+      testId: "jira-search-container"
+    }, /*#__PURE__*/_react.default.createElement(_box.Box, {
+      xcss: styles.inlineSwitcher
+    }, modeSwitcher), currentSearchMethod === 'basic' ? searchInput : /*#__PURE__*/_react.default.createElement(_box.Box, {
+      xcss: styles.inlineSearch
+    }, searchInput));
+  }
+  return /*#__PURE__*/_react.default.createElement("div", {
+    "data-testid": "jira-search-container",
+    className: (0, _runtime.ax)([styles.inputContainerStyles])
+  }, searchInput, /*#__PURE__*/_react.default.createElement(_box.Box, {
+    xcss: styles.modeSwitcherContainerStyles
+  }, modeSwitcher));
+};

package/dist/cjs/ui/jira-issues-modal/jira-search-container/index.js

@@ -12,6 +12,7 @@ var _runtime = require("@compiled/react/runtime");
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactIntl = require("react-intl");
 var _useDebounce = require("use-debounce");
@@ -28,6 +29,7 @@ var _index = _interopRequireDefault(require("../basic-filters/ui/index"));
 var _isQueryTooComplex = require("../basic-filters/utils/isQueryTooComplex");
 var _jqlEditor = require("../jql-editor");
 var _buildJQL = require("./buildJQL");
+var _embedded = require("./embedded");
 var _messages2 = require("./messages");
 var _excluded = ["basicInputTextValue"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -41,7 +43,17 @@ var styles = {
 };
 var DEFAULT_JQL_QUERY = exports.DEFAULT_JQL_QUERY = 'ORDER BY created DESC';
 var ALLOWED_ORDER_BY_KEYS = exports.ALLOWED_ORDER_BY_KEYS = ['key', 'summary', 'assignee', 'status', 'created'];
+/** Opt-in consumers use a separate component; the configuration modal retains its existing path. */
 var JiraSearchContainer = exports.JiraSearchContainer = function JiraSearchContainer(props) {
+  if (props.layout === 'inline' || props.allowBasicModeReset || props.initialBasicSearchTerm !== undefined || props.showBasicSearchButton === false || props.textSearchField !== undefined) {
+    return /*#__PURE__*/_react.default.createElement(_embedded.EmbeddedJiraSearchContainer, (0, _extends2.default)({}, props, {
+      defaultJql: DEFAULT_JQL_QUERY,
+      allowedOrderByKeys: ALLOWED_ORDER_BY_KEYS
+    }));
+  }
+  return /*#__PURE__*/_react.default.createElement(ModalJiraSearchContainer, props);
+};
+var ModalJiraSearchContainer = function ModalJiraSearchContainer(props) {
   var isSearching = props.isSearching,
     parameters = props.parameters,
     onSearch = props.onSearch,

package/dist/cjs/ui/jira-issues-modal/jql-editor/index.js

@@ -15,6 +15,10 @@ var _makeGetJqlSuggestionsData = require("../../../services/makeGetJqlSuggestion
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var JiraJQLEditor = exports.JiraJQLEditor = function JiraJQLEditor(_ref) {
   var cloudId = _ref.cloudId,
+    _ref$autoFocus = _ref.autoFocus,
+    autoFocus = _ref$autoFocus === void 0 ? true : _ref$autoFocus,
+    _ref$isCompact = _ref.isCompact,
+    isCompact = _ref$isCompact === void 0 ? false : _ref$isCompact,
     isSearching = _ref.isSearching,
     onChange = _ref.onChange,
     onSearch = _ref.onSearch,
@@ -26,11 +30,14 @@ var JiraJQLEditor = exports.JiraJQLEditor = function JiraJQLEditor(_ref) {
     focus: function focus() {}
   });
   (0, _react.useEffect)(function () {
+    if (!autoFocus) {
+      return;
+    }
     requestAnimationFrame(function () {
       var _inputRef$current;
       (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
     });
-  }, []);
+  }, [autoFocus]);
   var searchIfValidJql = function searchIfValidJql(_, jast) {
     if (jast.errors.length === 0) {
       onSearch();
@@ -42,6 +49,7 @@ var JiraJQLEditor = exports.JiraJQLEditor = function JiraJQLEditor(_ref) {
     onSearch: searchIfValidJql,
     onUpdate: onChange,
     isSearching: isSearching,
+    isCompact: isCompact,
     inputRef: inputRef,
     query: query,
     "aria-label": /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, {

package/dist/cjs/ui/jira-search-state/index.compiled.css

@@ -0,0 +1,12 @@
+._18zrpxbi{padding-inline:var(--ds-space-200,1pc)}
+._1rjcpxbi{padding-block:var(--ds-space-200,1pc)}._18m915vq{overflow-y:hidden}
+._1pglindk{animation-timing-function:var(--ds-easing-out-practical,cubic-bezier(.4,1,.6,1))}
+._1reo15vq{overflow-x:hidden}
+._1tke194s{min-height:14pc}
+._1tkeva7c{min-height:281px}
+._4t3i1osq{height:100%}
+._5sag1ign{animation-duration:var(--ds-duration-short,.15s)}
+._j7hq1bym{animation-name:var(--ds-keyframe-fade-in,FadeIn0to100)}
+._p12f1gwv{max-width:360px}
+._y3gn1h6o{text-align:center}
+@media (prefers-reduced-motion:reduce){._bl8aglyw{animation-name:none}}

package/dist/cjs/ui/jira-search-state/index.js

@@ -0,0 +1,90 @@
+/* index.tsx generated by @compiled/babel-plugin v3.0.2 */
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.JiraSearchState = void 0;
+require("./index.compiled.css");
+var _runtime = require("@compiled/react/runtime");
+var _react = _interopRequireDefault(require("react"));
+var _reactIntl = require("react-intl");
+var _css = require("@atlaskit/css");
+var _heading = _interopRequireDefault(require("@atlaskit/heading/heading"));
+var _main = _interopRequireDefault(require("@atlaskit/intl-messages-provider/main"));
+var _box = require("@atlaskit/primitives/compiled/box");
+var _flex = require("@atlaskit/primitives/compiled/flex");
+var _text = require("@atlaskit/primitives/compiled/text");
+var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden/visually-hidden"));
+var _search = require("../../common/ui/rich-icon/search");
+var _searchNoResult = require("../../common/ui/spot/error-state/search-no-result");
+var _fetchMessagesForLocale = require("../../common/utils/locale/fetch-messages-for-locale");
+var _en = _interopRequireDefault(require("../../i18n/en"));
+var _messages = require("../common/error-state/messages");
+var _messages2 = require("../common/initial-state-view/messages");
+var _emptyState = _interopRequireDefault(require("../issue-like-table/empty-state"));
+var messages = (0, _reactIntl.defineMessages)({
+  loading: {
+    id: 'link-datasource.jira-search-state.loading',
+    defaultMessage: 'Searching for work items…',
+    description: 'Loading label while an embedded Jira work-item search is running.'
+  }
+});
+var styles = {
+  loading: "_1reo15vq _18m915vq _4t3i1osq",
+  canvas: "_1rjcpxbi _18zrpxbi _1tkeva7c",
+  compactCanvas: "_1tke194s",
+  resolvedEmpty: "_j7hq1bym _5sag1ign _1pglindk _bl8aglyw",
+  content: "_p12f1gwv _y3gn1h6o"
+};
+var SearchState = function SearchState(_ref) {
+  var variant = _ref.variant,
+    _ref$isCompact = _ref.isCompact,
+    isCompact = _ref$isCompact === void 0 ? false : _ref$isCompact;
+  var _useIntl = (0, _reactIntl.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var isEmpty = variant === 'empty';
+  if (variant === 'loading') {
+    return /*#__PURE__*/_react.default.createElement(_box.Box, {
+      xcss: styles.loading,
+      testId: "jira-search-state-loading"
+    }, /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, null, formatMessage(messages.loading)), /*#__PURE__*/_react.default.createElement("div", {
+      "aria-hidden": "true"
+    }, /*#__PURE__*/_react.default.createElement(_emptyState.default, {
+      isCompact: true,
+      testId: "jira-search-table-skeleton"
+    })));
+  }
+  return /*#__PURE__*/_react.default.createElement(_flex.Flex, {
+    direction: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: isCompact ? 'space.100' : 'space.200',
+    xcss: (0, _css.cx)(styles.canvas, isCompact && styles.compactCanvas, isEmpty && styles.resolvedEmpty),
+    testId: "jira-search-state-".concat(variant)
+  }, isEmpty ? /*#__PURE__*/_react.default.createElement(_searchNoResult.SpotSearchNoResult, {
+    size: isCompact ? 'large' : 'xlarge',
+    alt: ""
+  }) : /*#__PURE__*/_react.default.createElement(_search.RichIconSearch, {
+    size: isCompact ? 'large' : 'xlarge',
+    alt: ""
+  }), /*#__PURE__*/_react.default.createElement(_box.Box, {
+    xcss: styles.content
+  }, /*#__PURE__*/_react.default.createElement(_heading.default, {
+    as: "h3",
+    size: "small"
+  }, formatMessage(isEmpty ? _messages.loadingErrorMessages.noResultsFound : _messages2.initialStateViewMessages.jiraSearchTitle))), /*#__PURE__*/_react.default.createElement(_box.Box, {
+    xcss: styles.content
+  }, /*#__PURE__*/_react.default.createElement(_text.Text, {
+    color: "color.text.subtle"
+  }, formatMessage(isEmpty ? _messages.loadingErrorMessages.noResultsFoundDescription : _messages2.initialStateViewMessages.searchDescriptionForBasicSearchSllv))));
+};
+
+/** Reuses the work-item picker's illustrations and copy without emitting datasource analytics. */
+var JiraSearchState = exports.JiraSearchState = function JiraSearchState(props) {
+  return /*#__PURE__*/_react.default.createElement(_main.default, {
+    defaultMessages: _en.default,
+    loaderFn: _fetchMessagesForLocale.fetchMessagesForLocale
+  }, /*#__PURE__*/_react.default.createElement(SearchState, props));
+};

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

@@ -4,9 +4,15 @@ 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/fg';
+import { Flex } from '@atlaskit/primitives/compiled/flex';
 import { AssetsAqlSearchInputSkeleton } from './aql-search-input/loading-state';
 import { AssetsObjectSchemaSelectSkeleton } from './object-schema-select/loading-state';
 import { FormRowContainer } from './styled';
+const styles = {
+  flexStyles: "_1bsb1osq"
+};
+
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled
 const SchemaSelectContainer = forwardRef(({
   as: C = "div",
@@ -42,7 +48,12 @@ export const AssetsSearchContainerLoading = ({
 }) => {
   return /*#__PURE__*/React.createElement(FormContainer, {
     "data-testid": "assets-datasource-modal--search-container-skeleton"
-  }, /*#__PURE__*/React.createElement(FormRowContainer, {
+  }, fg('astral_assets_macro_table_ui_uplift') ? /*#__PURE__*/React.createElement(Flex, {
+    gap: "space.100",
+    alignItems: "center",
+    justifyContent: "space-between",
+    xcss: styles.flexStyles
+  }, modalTitle, /*#__PURE__*/React.createElement(SchemaSelectContainer, null, /*#__PURE__*/React.createElement(AssetsObjectSchemaSelectSkeleton, null))) : /*#__PURE__*/React.createElement(FormRowContainer, {
     isNarrowGap: true
   }, modalTitle, /*#__PURE__*/React.createElement(SchemaSelectContainer, null, /*#__PURE__*/React.createElement(AssetsObjectSchemaSelectSkeleton, null))), /*#__PURE__*/React.createElement(FormRowContainer, null, /*#__PURE__*/React.createElement(AssetsAqlSearchInputSkeleton, null)));
 };

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

@@ -17,11 +17,13 @@ const styles = {
 const formStyles = null;
 const formWithMaxWidthStyles = null;
 export const BasicSearchInput = ({
+  isCompact = false,
   isDisabled,
   isSearching,
   onChange,
   onSearch,
   searchTerm,
+  showSearchButton = true,
   fullWidth,
   testId,
   ariaLabel
@@ -44,7 +46,8 @@ export const BasicSearchInput = ({
     onSubmit: handleFormSubmit,
     className: ax([fullWidth ? "_16jlkb7n _1o9zkb7n _i0dlf1ug" : "_16jlkb7n _1o9zkb7n _i0dlf1ug _p12f1mjv"])
   }, /*#__PURE__*/React.createElement(Textfield, {
-    elemAfterInput: /*#__PURE__*/React.createElement(Box, {
+    isCompact: isCompact,
+    elemAfterInput: showSearchButton ? /*#__PURE__*/React.createElement(Box, {
       xcss: styles.searchButtonContainer
     }, /*#__PURE__*/React.createElement(IconButton, {
       appearance: "primary",
@@ -59,7 +62,7 @@ export const BasicSearchInput = ({
       isDisabled: isDisabled,
       testId: `${testId}--basic-search-button`,
       onClick: handleSearchWithAnalytics
-    })),
+    })) : undefined,
     autoFocus: true,
     onChange: onChange,
     testId: `${testId}--basic-search-input`,

package/dist/es2019/ui/common/modal/mode-switcher/ModeSwitcher.compiled.css

@@ -7,6 +7,7 @@
 ._1h6d1l7x{border-color:var(--ds-border,#0b120e24)}
 ._1h6dq98m{border-color:var(--ds-border-selected,#1868db)}
 ._18u0v47k{margin-left:var(--ds-space-250,20px)}
+._18u0ze3t{margin-left:var(--ds-space-0,0)}
 ._19bv1b66{padding-left:var(--ds-space-050,4px)}
 ._19bvutpp{padding-left:var(--ds-space-150,9pt)}
 ._1bah1h6o{justify-content:center}

package/dist/es2019/ui/common/modal/mode-switcher/ModeSwitcher.js

@@ -6,6 +6,7 @@ import React from 'react';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import VisuallyHidden from '@atlaskit/visually-hidden/visually-hidden';
 const modeSwitcherStyles = null;
+const inlineModeSwitcherStyles = null;
 const compactModeSwitcherStyles = null;
 const modeFocusStyles = null;
 const modeSwitcherLabelStyles = null;
@@ -17,6 +18,7 @@ export const ModeSwitcher = props => {
   var _options$;
   const {
     isCompact,
+    isInline,
     isDisabled,
     onOptionValueChange,
     options,
@@ -28,7 +30,7 @@ export const ModeSwitcher = props => {
   return options.length > 0 ? /*#__PURE__*/React.createElement("fieldset", {
     "data-testid": "mode-toggle-container",
     disabled: isDisabled,
-    className: ax(["_2rko1b66 _1h6d1l7x _189ee4h9 _1dqonqa1 _4cvr1h6o _vchhusvi _1e0c116y _u5f31b66 _19bv1b66 _18u0v47k _4t3izwfg _1j55105o", isCompact && "_zulpv77o _ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66"])
+    className: ax(["_2rko1b66 _1h6d1l7x _189ee4h9 _1dqonqa1 _4cvr1h6o _vchhusvi _1e0c116y _u5f31b66 _19bv1b66 _18u0v47k _4t3izwfg _1j55105o", isCompact && "_zulpv77o _ca0q1b66 _u5f31b66 _n3td1b66 _19bv1b66", isInline && "_18u0ze3t"])
   }, options.map(({
     value,
     label,

package/dist/es2019/ui/common/modal/popup-select/index.js

@@ -12,9 +12,38 @@ import formatOptionLabel from './formatOptionLabel';
 import CustomMenuList from './menu-list';
 import { asyncPopupSelectMessages } from './messages';
 import PopupTrigger from './trigger';
+import { useInlinePopupLayout } from './useInlinePopupLayout';
+
 // Needed to disable filtering from react-select
 const noFilterOptions = () => true;
-export const FilterPopupSelect = ({
+export const FilterPopupSelect = props => props.isInline ? /*#__PURE__*/React.createElement(InlineFilterPopupSelect, props) : /*#__PURE__*/React.createElement(FilterPopupSelectBase, props);
+const InlineFilterPopupSelect = props => {
+  const popupRef = useRef(null);
+  const layout = useInlinePopupLayout(true, popupRef);
+  const {
+    onMenuOpen,
+    onMenuClose
+  } = props;
+  const handleOpen = useCallback(() => {
+    layout.onOpen();
+    onMenuOpen === null || onMenuOpen === void 0 ? void 0 : onMenuOpen();
+  }, [layout.onOpen, onMenuOpen]);
+  const handleClose = useCallback(() => {
+    layout.onClose();
+    onMenuClose === null || onMenuClose === void 0 ? void 0 : onMenuClose();
+  }, [layout.onClose, onMenuClose]);
+  return /*#__PURE__*/React.createElement(FilterPopupSelectBase, _extends({}, props, {
+    onMenuOpen: handleOpen,
+    onMenuClose: handleClose,
+    inlinePopupProps: {
+      ref: popupRef,
+      maxMenuHeight: layout.maxMenuHeight,
+      minMenuHeight: 0,
+      popperProps: layout.popperProps
+    }
+  }));
+};
+const FilterPopupSelectBase = ({
   filterName,
   totalCount = 0,
   status,
@@ -30,7 +59,8 @@ export const FilterPopupSelect = ({
   onSelectionChange,
   onInputChange,
   onMenuClose,
-  onMenuOpen
+  onMenuOpen,
+  inlinePopupProps
 }) => {
   const {
     formatMessage
@@ -122,7 +152,7 @@ export const FilterPopupSelect = ({
       sortPaginatedResults.current = true;
     }
   }, [status]);
-  return /*#__PURE__*/React.createElement(PopupSelect, {
+  return /*#__PURE__*/React.createElement(PopupSelect, _extends({}, inlinePopupProps, {
     isMulti: true,
     maxMenuWidth: 300,
     minMenuWidth: 300,
@@ -187,5 +217,5 @@ export const FilterPopupSelect = ({
       totalCount: totalCount,
       filterName: filterName
     })
-  });
+  }));
 };