@atlaskit/link-picker 1.48.2 → 1.49.0

package/dist/cjs/ui/link-picker/search-results/scrolling-tabs/index.compiled.css

@@ -0,0 +1,29 @@
+
+._1bh4vqrj{scroll-padding:0 24px}
+._rfx3yh40:before{border-radius:2px}._154i1b66{top:var(--ds-space-050,4px)}
+._18q9glyw [role=tablist]:before{display:none}
+._19woidpf:before{bottom:0}
+._1cicglyw::-webkit-scrollbar{display:none}
+._1cs8stnw:before{position:absolute}
+._1dm8q5uf{scroll-behavior:smooth}
+._1dze261p [role=tab]{text-overflow:unset!important}
+._1fjgglyw{scrollbar-width:none}
+._1fud261p [role=tab]{overflow-y:unset!important}
+._1kt9b3bt:before{content:""}
+._1ltvidpf{left:0}
+._1mp41kw7:before{width:inherit}
+._1pby18h8{z-index:999}
+._1reo1wug{overflow-x:auto}
+._1russudh:before{background-color:var(--_lvpq93)}
+._1xi2idpf{right:0}
+._7hip261p [role=tab]{overflow-x:unset!important}
+._bfhkppbu{background-color:var(--_1t3jkli)}
+._eid3idpf:before{margin-right:0}
+._fntnidpf:before{margin-left:0}
+._kfgtyh40:before{height:2px}
+._kqswh2mm{position:relative}
+._kqswstnw{position:absolute}
+._oounu2gc:before{right:var(--ds-space-100,8px)}
+._pascidpf:before{margin-top:0}
+._qnecu2gc:before{left:var(--ds-space-100,8px)}
+._zr3eidpf:before{margin-bottom:0}

package/dist/cjs/ui/link-picker/search-results/scrolling-tabs/index.js

@@ -1,3 +1,4 @@
+/* index.tsx generated by @compiled/babel-plugin v0.36.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -5,24 +6,24 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ScrollingTabList = void 0;
+exports.ScrollingTabListNew = exports.ScrollingTabList = void 0;
+require("./index.compiled.css");
+var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
-var _react2 = require("@emotion/react");
 var _new = require("@atlaskit/button/new");
 var _chevronLeft = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-left"));
 var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-right"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _colors = require("@atlaskit/theme/colors");
+var _old = require("./old");
 var _scrollingTabs = require("./scrolling-tabs");
-var _styles = require("./styles");
 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; }
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } /**
- * @jsxRuntime classic
- * @jsx jsx
- */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function isTouchDevice() {
   return 'ontouchstart' in window ||
   // eslint-disable-next-line compat/compat
@@ -32,9 +33,13 @@ var initialConditionalButtonsState = {
   back: false,
   forward: false
 };
+var scrollingContainerStyles = null;
+var containerStyles = null;
+var backButtonStyles = null;
+var nextButtonStyles = null;
 
 /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
-var ScrollingTabList = exports.ScrollingTabList = function ScrollingTabList(props) {
+var ScrollingTabListNew = exports.ScrollingTabListNew = function ScrollingTabListNew(props) {
   var ref = (0, _react.useRef)(null);
   var _useState = (0, _react.useState)(initialConditionalButtonsState),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -126,38 +131,45 @@ var ScrollingTabList = exports.ScrollingTabList = function ScrollingTabList(prop
     appearance: 'subtle',
     spacing: 'compact'
   };
-  return (
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    (0, _react2.jsx)("div", {
-      css: _styles.containerStyles,
-      ref: ref,
-      "data-testid": "scrolling-tabs"
-    }, conditionalButtons.back &&
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    (0, _react2.jsx)("div", {
-      className: "back",
-      css: _styles.backButtonStyles
-    }, (0, _react2.jsx)(_new.IconButton, (0, _extends2.default)({
-      "data-test-id": "back",
-      onClick: function onClick() {
-        return (0, _scrollingTabs.scrollBack)(ref);
-      },
-      label: "back",
-      icon: _chevronLeft.default
-    }, buttonProps))), (0, _react2.jsx)("div", {
-      css: _styles.scrollingContainerStyles
-    }, props.children), conditionalButtons.forward &&
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    (0, _react2.jsx)("div", {
-      css: _styles.nextButtonStyles
-    }, (0, _react2.jsx)(_new.IconButton, (0, _extends2.default)({
-      "data-test-id": "forward",
-      onClick: function onClick() {
-        return (0, _scrollingTabs.scrollForward)(ref);
-      }
-    }, buttonProps, {
-      label: "forward",
-      icon: _chevronRight.default
-    }))))
-  );
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: ref,
+    "data-testid": "scrolling-tabs",
+    className: (0, _runtime.ax)(["_kqswh2mm _18q9glyw _7hip261p _1fud261p _1dze261p"])
+  }, conditionalButtons.back && /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _runtime.ax)(["_kqswstnw _154i1b66 _1pby18h8 _bfhkppbu _1ltvidpf", "back"]),
+    style: {
+      "--_1t3jkli": (0, _runtime.ix)("var(--ds-surface, ".concat(_colors.N0, ")"))
+    }
+  }, /*#__PURE__*/_react.default.createElement(_new.IconButton, (0, _extends2.default)({
+    "data-test-id": "back",
+    onClick: function onClick() {
+      return (0, _scrollingTabs.scrollBack)(ref);
+    },
+    label: "back",
+    icon: _chevronLeft.default
+  }, buttonProps))), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _runtime.ax)(["_1bh4vqrj _1reo1wug _1dm8q5uf _1fjgglyw _rfx3yh40 _pascidpf _eid3idpf _zr3eidpf _fntnidpf _1kt9b3bt _19woidpf _1cs8stnw _1mp41kw7 _qnecu2gc _oounu2gc _kfgtyh40 _1russudh _1cicglyw"]),
+    style: {
+      "--_lvpq93": (0, _runtime.ix)("var(--ds-border, ".concat(_colors.N30, ")"))
+    }
+  }, props.children), conditionalButtons.forward && /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _runtime.ax)(["_kqswstnw _154i1b66 _1pby18h8 _bfhkppbu _1xi2idpf"]),
+    style: {
+      "--_1t3jkli": (0, _runtime.ix)("var(--ds-surface, ".concat(_colors.N0, ")"))
+    }
+  }, /*#__PURE__*/_react.default.createElement(_new.IconButton, (0, _extends2.default)({
+    "data-test-id": "forward",
+    onClick: function onClick() {
+      return (0, _scrollingTabs.scrollForward)(ref);
+    }
+  }, buttonProps, {
+    label: "forward",
+    icon: _chevronRight.default
+  }))));
+};
+var ScrollingTabList = exports.ScrollingTabList = function ScrollingTabList(props) {
+  if ((0, _platformFeatureFlags.fg)('platform_bandicoots-link-picker-css')) {
+    return /*#__PURE__*/_react.default.createElement(ScrollingTabListNew, props);
+  }
+  return /*#__PURE__*/_react.default.createElement(_old.ScrollingTabListOld, props);
 };

package/dist/cjs/ui/link-picker/search-results/scrolling-tabs/old/index.js

@@ -0,0 +1,163 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ScrollingTabListOld = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _react2 = require("@emotion/react");
+var _new = require("@atlaskit/button/new");
+var _chevronLeft = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-left"));
+var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-right"));
+var _scrollingTabs = require("../scrolling-tabs");
+var _styles = require("./styles");
+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; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } /* eslint-disable @atlassian/tangerine/import/no-parent-imports */ /**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+function isTouchDevice() {
+  return 'ontouchstart' in window ||
+  // eslint-disable-next-line compat/compat
+  navigator.maxTouchPoints > 0;
+}
+var initialConditionalButtonsState = {
+  back: false,
+  forward: false
+};
+
+/* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
+var ScrollingTabListOld = exports.ScrollingTabListOld = function ScrollingTabListOld(props) {
+  var ref = (0, _react.useRef)(null);
+  var _useState = (0, _react.useState)(initialConditionalButtonsState),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    conditionalButtons = _useState2[0],
+    setConditionalButtons = _useState2[1];
+  var ghost = (0, _react.useMemo)(function () {
+    return (0, _scrollingTabs.createGhost)();
+  }, []);
+  var onTabClick = (0, _react.useCallback)(function (e) {
+    var target = e.currentTarget;
+    if (target) {
+      target.scrollIntoView({
+        behavior: 'smooth',
+        block: 'nearest',
+        inline: 'center'
+      });
+    }
+  }, []);
+  _react.default.useLayoutEffect(function () {
+    var container = ref.current;
+    var scrollingContainer;
+    var tabs;
+    var handleConditionalButtonsChange = function handleConditionalButtonsChange() {
+      var buttons = (0, _scrollingTabs.calculateConditionalButtons)(scrollingContainer, isTouchDevice());
+      setConditionalButtons(buttons);
+    };
+    var observerCallback = function observerCallback(mutationList) {
+      var tablist = (0, _scrollingTabs.getTabList)(ref);
+      var _iterator = _createForOfIteratorHelper(mutationList),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var mutation = _step.value;
+          if (mutation.type === 'childList') {
+            var addedNodes = Array.from(mutation.addedNodes);
+            var found = addedNodes.find(function (node) {
+              return node.getAttribute('role') === 'tab';
+            });
+            if (found && tablist) {
+              ghost.remove();
+              var _tabs = Array.from(tablist.children);
+              _tabs.forEach(function (tab) {
+                tab.removeEventListener('click', onTabClick);
+                tab.addEventListener('click', onTabClick);
+              });
+              tablist.appendChild(ghost);
+              handleConditionalButtonsChange();
+            }
+          }
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    };
+    var observer = new MutationObserver(observerCallback);
+    if (container) {
+      var tablist = (0, _scrollingTabs.getTabList)(ref);
+      scrollingContainer = tablist === null || tablist === void 0 ? void 0 : tablist.parentElement;
+      observer.observe(container, {
+        attributes: false,
+        childList: true,
+        subtree: true
+      });
+      if (scrollingContainer instanceof HTMLElement && tablist) {
+        tablist.appendChild(ghost);
+        tabs = Array.from(tablist.children);
+        tabs.forEach(function (tab) {
+          return tab.addEventListener('click', onTabClick);
+        });
+        handleConditionalButtonsChange();
+        scrollingContainer.addEventListener('scroll', handleConditionalButtonsChange);
+      }
+      return function () {
+        if (scrollingContainer) {
+          // eslint-disable-next-line @repo/internal/dom-events/no-unsafe-event-listeners
+          scrollingContainer.removeEventListener('scroll', handleConditionalButtonsChange);
+        }
+        if (tabs.length) {
+          tabs.forEach(function (tab) {
+            return tab.removeEventListener('click', onTabClick);
+          });
+        }
+      };
+    }
+  }, [onTabClick, ghost, ref]);
+  var buttonProps = {
+    appearance: 'subtle',
+    spacing: 'compact'
+  };
+  return (
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _react2.jsx)("div", {
+      css: _styles.containerStyles,
+      ref: ref,
+      "data-testid": "scrolling-tabs"
+    }, conditionalButtons.back &&
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _react2.jsx)("div", {
+      className: "back",
+      css: _styles.backButtonStyles
+    }, (0, _react2.jsx)(_new.IconButton, (0, _extends2.default)({
+      "data-test-id": "back",
+      onClick: function onClick() {
+        return (0, _scrollingTabs.scrollBack)(ref);
+      },
+      label: "back",
+      icon: _chevronLeft.default
+    }, buttonProps))), (0, _react2.jsx)("div", {
+      css: _styles.scrollingContainerStyles
+    }, props.children), conditionalButtons.forward &&
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _react2.jsx)("div", {
+      css: _styles.nextButtonStyles
+    }, (0, _react2.jsx)(_new.IconButton, (0, _extends2.default)({
+      "data-test-id": "forward",
+      onClick: function onClick() {
+        return (0, _scrollingTabs.scrollForward)(ref);
+      }
+    }, buttonProps, {
+      label: "forward",
+      icon: _chevronRight.default
+    }))))
+  );
+};

package/dist/cjs/ui/link-picker/search-results/search-results-container/index.compiled.css

@@ -0,0 +1,4 @@
+._1bah1y6m{justify-content:flex-start}
+._1bsb1osq{width:100%}
+._1e0c1txw{display:flex}
+._2lx21bp4{flex-direction:column}

package/dist/cjs/ui/link-picker/search-results/search-results-container/index.js

@@ -1,26 +1,22 @@
+/* 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.SearchResultsContainer = void 0;
-var _react = require("react");
-var _react2 = require("@emotion/react");
+exports.SearchResultsContainerNew = exports.SearchResultsContainer = void 0;
+require("./index.compiled.css");
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
+var _runtime = require("@compiled/react/runtime");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _minHeightContainer = require("../../../../common/ui/min-height-container");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-var flexColumn = (0, _react2.css)({
-  display: 'flex',
-  flexDirection: 'column',
-  justifyContent: 'flex-start',
-  width: '100%'
-});
-var SearchResultsContainer = exports.SearchResultsContainer = function SearchResultsContainer(_ref) {
+var _old = require("./old");
+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 flexColumn = null;
+var SearchResultsContainerNew = exports.SearchResultsContainerNew = function SearchResultsContainerNew(_ref) {
   var hasTabs = _ref.hasTabs,
     adaptiveHeight = _ref.adaptiveHeight,
     isLoadingResults = _ref.isLoadingResults,
@@ -35,9 +31,15 @@ var SearchResultsContainer = exports.SearchResultsContainer = function SearchRes
       currentHeight.current = ref.current.getBoundingClientRect().height;
     }
   });
-  return (0, _react2.jsx)(_minHeightContainer.MinHeightContainer, {
+  return /*#__PURE__*/React.createElement(_minHeightContainer.MinHeightContainer, {
     ref: ref,
     minHeight: minheight,
-    css: flexColumn
+    className: (0, _runtime.ax)(["_1e0c1txw _2lx21bp4 _1bah1y6m _1bsb1osq"])
   }, children);
+};
+var SearchResultsContainer = exports.SearchResultsContainer = function SearchResultsContainer(props) {
+  if ((0, _platformFeatureFlags.fg)('platform_bandicoots-link-picker-css')) {
+    return /*#__PURE__*/React.createElement(SearchResultsContainerNew, props);
+  }
+  return /*#__PURE__*/React.createElement(_old.SearchResultsContainerOld, props);
 };

package/dist/cjs/ui/link-picker/search-results/search-results-container/old/index.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SearchResultsContainerOld = void 0;
+var _react = require("react");
+var _react2 = require("@emotion/react");
+var _minHeightContainer = require("../../../../../common/ui/min-height-container");
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+var flexColumn = (0, _react2.css)({
+  display: 'flex',
+  flexDirection: 'column',
+  justifyContent: 'flex-start',
+  width: '100%'
+});
+var SearchResultsContainerOld = exports.SearchResultsContainerOld = function SearchResultsContainerOld(_ref) {
+  var hasTabs = _ref.hasTabs,
+    adaptiveHeight = _ref.adaptiveHeight,
+    isLoadingResults = _ref.isLoadingResults,
+    children = _ref.children;
+  var ref = (0, _react.useRef)(null);
+  var currentHeight = (0, _react.useRef)(null);
+  var fixedMinHeight = hasTabs ? '347px' : '302px';
+  var adaptiveMinHeight = isLoadingResults && !!currentHeight.current ? "".concat(currentHeight.current, "px") : 'auto';
+  var minheight = adaptiveHeight ? adaptiveMinHeight : fixedMinHeight;
+  (0, _react.useLayoutEffect)(function () {
+    if (ref.current && adaptiveHeight && !isLoadingResults) {
+      currentHeight.current = ref.current.getBoundingClientRect().height;
+    }
+  });
+  return (0, _react2.jsx)(_minHeightContainer.MinHeightContainer, {
+    ref: ref,
+    minHeight: minheight,
+    css: flexColumn
+  }, children);
+};

package/dist/cjs/ui/link-picker/text-input/index.compiled.css

@@ -0,0 +1,10 @@
+
+._19itglyw{border:none}._19bvze3t{padding-left:var(--ds-space-0,0)}
+._2hwx1b66{margin-right:var(--ds-space-050,4px)}
+._7yjtidpf >div{margin-top:0}
+._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
+._ca0qze3t{padding-top:var(--ds-space-0,0)}
+._n3tdze3t{padding-bottom:var(--ds-space-0,0)}
+._onzypxbi+._onzypxbi{margin-top:var(--ds-space-200,1pc)}
+._s7n4nkob{vertical-align:middle}
+._u5f3ze3t{padding-right:var(--ds-space-0,0)}

package/dist/cjs/ui/link-picker/text-input/index.js

@@ -1,54 +1,44 @@
+/* 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.testIds = exports.TextInput = void 0;
+exports.testIds = exports.TextInputNew = exports.TextInput = 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 _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = require("react");
-var _react2 = require("@emotion/react");
 var _form = require("@atlaskit/form");
 var _crossCircleSelectClear = _interopRequireDefault(require("@atlaskit/icon/core/migration/cross-circle--select-clear"));
-var _primitives = require("@atlaskit/primitives");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _compiled = require("@atlaskit/primitives/compiled");
 var _textfield = _interopRequireDefault(require("@atlaskit/textfield"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _conditionalSpotlightTargetWrapper = require("./conditional-spotlight-target-wrapper");
+var _old = require("./old");
 var _utils = require("./utils");
 var _excluded = ["name", "label", "autoFocus", "onRedo", "onUndo", "onKeyDown", "onClear", "clearLabel", "error", "spotlightTargetName"];
+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 styles = {
+  clearTextButton: "_19itglyw _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _2hwx1b66 _bfhksm61 _s7n4nkob"
+};
+
 /**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-/**
- * Overidding text input margin top which design system provides as a default spacer
+ * Overriding text input margin top which design system provides as a default spacer
  * but it gets in the way of our layout
  */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var fieldStyles = (0, _react2.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '> div': {
-    marginTop: 0
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  '& + &': {
-    marginTop: "var(--ds-space-200, 16px)"
-  }
-});
+var fieldStyles = null;
 var testIds = exports.testIds = {
   urlError: 'link-error',
   clearUrlButton: 'clear-text'
 };
-var clearTextButtonStyles = (0, _primitives.xcss)({
-  padding: 'space.0',
-  marginRight: 'space.050',
-  backgroundColor: 'color.background.neutral.subtle',
-  border: 'none',
-  verticalAlign: 'middle'
-});
-var TextInput = exports.TextInput = function TextInput(_ref) {
+var TextInputNew = exports.TextInputNew = function TextInputNew(_ref) {
   var name = _ref.name,
     label = _ref.label,
     autoFocus = _ref.autoFocus,
@@ -91,34 +81,40 @@ var TextInput = exports.TextInput = function TextInput(_ref) {
     onClear === null || onClear === void 0 || onClear(name);
     (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
   }, [name, onClear]);
-  var clearText = restProps.value !== '' && (0, _react2.jsx)(_tooltip.default, {
+  var clearText = restProps.value !== '' && /*#__PURE__*/React.createElement(_tooltip.default, {
     content: clearLabel
-  }, (0, _react2.jsx)(_primitives.Pressable, {
-    xcss: clearTextButtonStyles,
+  }, /*#__PURE__*/React.createElement(_compiled.Pressable, {
+    xcss: styles.clearTextButton,
     onClick: handleClear,
     testId: testIds.clearUrlButton
-  }, (0, _react2.jsx)(_crossCircleSelectClear.default, {
+  }, /*#__PURE__*/React.createElement(_crossCircleSelectClear.default, {
     LEGACY_size: "medium",
     label: clearLabel || '',
     color: "var(--ds-icon-subtle, #626F86)",
     spacing: "spacious"
   })));
-  return (0, _react2.jsx)("div", {
-    css: fieldStyles
-  }, (0, _react2.jsx)(_form.Field, {
+  return /*#__PURE__*/React.createElement("div", {
+    className: (0, _runtime.ax)(["_7yjtidpf _onzypxbi"])
+  }, /*#__PURE__*/React.createElement(_form.Field, {
     label: label,
     name: name
   }, function (_ref2) {
     var fieldProps = _ref2.fieldProps;
-    return (0, _react2.jsx)(_conditionalSpotlightTargetWrapper.ConditionalSpotlightTargetWrapper, {
+    return /*#__PURE__*/React.createElement(_conditionalSpotlightTargetWrapper.ConditionalSpotlightTargetWrapper, {
       spotlightTargetName: spotlightTargetName
-    }, (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_textfield.default, (0, _extends2.default)({}, fieldProps, restProps, {
+    }, /*#__PURE__*/React.createElement(_react.Fragment, null, /*#__PURE__*/React.createElement(_textfield.default, (0, _extends2.default)({}, fieldProps, restProps, {
       onKeyDown: handleKeydown,
       ref: handleRef,
       elemAfterInput: clearText,
       isInvalid: !!error
-    })), error && (0, _react2.jsx)(_form.ErrorMessage, {
+    })), error && /*#__PURE__*/React.createElement(_form.ErrorMessage, {
       testId: testIds.urlError
     }, error)));
   }));
+};
+var TextInput = exports.TextInput = function TextInput(props) {
+  if ((0, _platformFeatureFlags.fg)('platform_bandicoots-link-picker-css')) {
+    return /*#__PURE__*/React.createElement(TextInputNew, props);
+  }
+  return /*#__PURE__*/React.createElement(_old.TextInputOld, props);
 };