@atlaskit/quick-search 8.0.13 → 8.0.15

package/dist/esm/components/QuickSearch.js

@@ -5,15 +5,10 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 import React from 'react';
 import keycode from 'keycode';
 import { withAnalytics } from '@atlaskit/analytics';
@@ -21,7 +16,6 @@ import AkSearch from './Search/Search';
 import { ResultContext, SelectedResultIdContext } from './context';
 import decorateWithAnalyticsData from './decorateWithAnalyticsData';
 import { QS_ANALYTICS_EV_CLOSE, QS_ANALYTICS_EV_KB_CTRLS_USED, QS_ANALYTICS_EV_OPEN, QS_ANALYTICS_EV_QUERY_ENTERED, QS_ANALYTICS_EV_SUBMIT } from './constants';
-
 /**
  * Get the result ID of a result by its index in the flatResults array
  * Returns null for a failed index or if resultId is empty|undefined
@@ -30,168 +24,170 @@ var getResultIdByIndex = function getResultIdByIndex(array, index) {
   if (array && index !== null && array[index] && array[index].props && array[index].props.resultId) {
     return array[index].props.resultId;
   }
-
   return null;
 };
+
 /**
  * Find a result in the flatResults array by its ID
  * Returns the result object or null
  */
-
-
 var getResultById = function getResultById(array, id) {
   return array && array.find(function (result) {
     return result.props && result.props.resultId === id;
   }) || null;
 };
+
 /**
  * Get a result's index in the flatResults array by its ID
  * Returns a numeric index or null
  */
-
-
 var getResultIndexById = function getResultIndexById(array, id) {
   if (!array) {
     return null;
   }
-
   var result = getResultById(array, id);
-
   if (!result) {
     return null;
   }
-
   var index = array.indexOf(result);
   return index >= 0 ? index : null;
 };
-
 var adjustIndex = function adjustIndex(arrayLength, currentIndex, adjustment) {
   if (arrayLength === 0) {
     return null;
   }
-
   if (adjustment === 0) {
     return currentIndex;
-  } // If nothing is selected, select the element on the end
-
+  }
 
+  // If nothing is selected, select the element on the end
   if (currentIndex === null) {
     return adjustment > 0 ? 0 : arrayLength - 1;
-  } // Adjust current index, wrapping around if necessary
-
-
-  var adjustedIndex = (currentIndex + adjustment) % arrayLength; // Correct for negative indices
-
+  }
+  // Adjust current index, wrapping around if necessary
+  var adjustedIndex = (currentIndex + adjustment) % arrayLength;
+  // Correct for negative indices
   return adjustedIndex >= 0 ? adjustedIndex : adjustedIndex + arrayLength;
 };
-
 export var QuickSearch = /*#__PURE__*/function (_React$Component) {
   _inherits(QuickSearch, _React$Component);
-
   var _super = _createSuper(QuickSearch);
-
   function QuickSearch(props) {
     var _this;
-
     _classCallCheck(this, QuickSearch);
-
     _this = _super.call(this, props);
-
     _defineProperty(_assertThisInitialized(_this), "flatResults", []);
-
     _defineProperty(_assertThisInitialized(_this), "hasSearchQueryEventFired", false);
-
     _defineProperty(_assertThisInitialized(_this), "hasKeyDownEventFired", false);
-
     _defineProperty(_assertThisInitialized(_this), "lastKeyPressed", '');
-
+    /**
+     * Uses the virtual list, this.flatResults, to move the selection across grouped results as if
+     * results were in a single, circular list.
+     *
+     * Process:
+     * 1. Finds the index of the selected result in the flatResults array,
+     * 2. Increments or decrements this index by the supplied adjustment amount,
+     * 3. Sets the new selectedResultId based on the modifed index
+     */
     _defineProperty(_assertThisInitialized(_this), "adjustSelectedResultIndex", function (adjustment) {
       var currentIndex = getResultIndexById(_this.flatResults, _this.state.selectedResultId);
       var newIndex = adjustIndex(_this.flatResults.length, currentIndex, adjustment);
       var selectedResultId = getResultIdByIndex(_this.flatResults, newIndex);
-
       _this.setState({
         selectedResultId: selectedResultId
       });
-
       if (selectedResultId) {
         _this.fireKeyboardControlEvent(selectedResultId);
       }
-
       if (_this.props.onSelectedResultIdChanged) {
         _this.props.onSelectedResultIdChanged(selectedResultId);
       }
     });
-
+    /** Select next result */
     _defineProperty(_assertThisInitialized(_this), "selectNext", function () {
       _this.adjustSelectedResultIndex(+1);
     });
-
+    /** Select previous result */
     _defineProperty(_assertThisInitialized(_this), "selectPrevious", function () {
       _this.adjustSelectedResultIndex(-1);
     });
-
+    /**
+     * Callback for register results in flatResults
+     */
     _defineProperty(_assertThisInitialized(_this), "handleRegisterResult", function (result) {
       if (!getResultById(_this.flatResults, result.props.resultId)) {
         _this.flatResults.push(result);
       }
     });
-
+    /**
+     * Callback for unregister results in flatResults
+     * It will reconcile a list of results for keyboard navigation after every update.
+     * 1. Component starts with an empty list of results
+     * 2. componentDidMount / componentDidUpdate lifecycle methods in ResultBase will be invoked
+     * 3. All ResultBase components call registerResult() in order to register itself in quick search
+     * 4. All ResultBase components call unregisterResult() in order to unregister itself in quick search
+     */
     _defineProperty(_assertThisInitialized(_this), "handleUnregisterResult", function (result) {
       var resultIndex = getResultIndexById(_this.flatResults, result.props.resultId);
-
       if (resultIndex !== null && +resultIndex >= 0) {
         _this.flatResults.splice(resultIndex, 1);
       }
     });
-
+    /**
+     * Callback for mouseEnter events on individual results
+     * Move selection to hovered result
+     */
     _defineProperty(_assertThisInitialized(_this), "handleResultMouseEnter", function (resultData) {
       _this.setState({
         selectedResultId: resultData && resultData.resultId
       });
     });
-
+    /**
+     * Callback for mouseLeave events on individual results
+     * Clear result selection
+     */
     _defineProperty(_assertThisInitialized(_this), "handleResultMouseLeave", function () {
       _this.setState({
         selectedResultId: null
       });
     });
-
+    /**
+     * Clear result selection when search input is blurred
+     */
     _defineProperty(_assertThisInitialized(_this), "handleSearchBlur", function (event) {
       _this.props.onSearchBlur(event);
-
       _this.setState({
         selectedResultId: null
       });
     });
-
     _defineProperty(_assertThisInitialized(_this), "onInput", function (event) {
       var onSearchInput = _this.props.onSearchInput;
-
       _this.setState({
         value: event.currentTarget.value
       });
-
       if (onSearchInput) {
         onSearchInput(event);
       }
     });
-
+    /**
+     * Keyboard controls
+     * Up - Select previous result
+     * Down - Select next result
+     * Enter - Submit selected result
+     * Tab / ArrowRight - Accept autocomplete
+     */
     _defineProperty(_assertThisInitialized(_this), "handleSearchKeyDown", function (event) {
       var firePrivateAnalyticsEvent = _this.props.firePrivateAnalyticsEvent;
-
       _this.props.onSearchKeyDown(event);
+      _this.lastKeyPressed = event.key;
 
-      _this.lastKeyPressed = event.key; // Need to check for keyCode for up/down/enter in case user is composing using an IME
+      // Need to check for keyCode for up/down/enter in case user is composing using an IME
       // fixes https://ecosystem.atlassian.net/browse/DS-6518
-
       if (event.key === 'ArrowUp' && event.keyCode === keycode('up')) {
         event.preventDefault(); // Don't move cursor around in search input field
-
         _this.selectPrevious();
       } else if (event.key === 'ArrowDown' && event.keyCode === keycode('down')) {
         event.preventDefault(); // Don't move cursor around in search input field
-
         _this.selectNext();
       } else if (event.key === 'Enter' && event.keyCode === keycode('enter')) {
         // shift key pressed or no result selected
@@ -204,21 +200,17 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
               method: 'shortcut'
             });
           }
-
           _this.props.onSearchSubmit(event);
         } else {
           event.preventDefault(); // Don't fire submit event from input
-
           var result = getResultById(_this.flatResults, _this.state.selectedResultId);
-
           if (!result || !result.props) {
             return;
-          } // Capture when users are using the keyboard to submit
-
+          }
 
+          // Capture when users are using the keyboard to submit
           if (typeof firePrivateAnalyticsEvent === 'function') {
             _this.fireKeyboardControlEvent(_this.state.selectedResultId);
-
             firePrivateAnalyticsEvent(QS_ANALYTICS_EV_SUBMIT, _objectSpread(_objectSpread({}, result.getAnalyticsData()), {}, {
               method: 'returnKey',
               newTab: false,
@@ -226,9 +218,7 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
               resultCount: _this.flatResults.length
             }));
           }
-
           var _preventDefault = false;
-
           if (result.props.onClick) {
             result.props.onClick({
               resultId: result.props.resultId,
@@ -241,55 +231,47 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
               })
             });
           }
-
           if (result.props.href && !_preventDefault) {
             window.location.assign(result.props.href);
           }
         }
       } else if (event.key === 'Tab' || event.key === 'ArrowRight') {
         var autocompleteText = _this.props.autocompleteText;
-
-        if (autocompleteText && autocompleteText.length > 0 && // multiple Tab or ArrowRight
+        if (autocompleteText && autocompleteText.length > 0 &&
+        // multiple Tab or ArrowRight
         autocompleteText.slice(-1) !== ' ') {
           _this.acceptAutocomplete(event, autocompleteText);
-
           event.preventDefault();
         }
       }
     });
-
     _defineProperty(_assertThisInitialized(_this), "acceptAutocomplete", function (event, text) {
       var onSearchInput = _this.props.onSearchInput;
       var newValue = "".concat(text, " ");
-
       if (_this.inputSearchRef) {
         _this.setState({
           value: newValue
-        }); // @ts-ignore unchecked
-
-
+        });
+        // @ts-ignore unchecked
         _this.inputSearchRef.value = newValue;
       }
-
       if (onSearchInput) {
         onSearchInput(event, true);
       }
     });
-
     _defineProperty(_assertThisInitialized(_this), "setSearchInputRef", function (refs) {
       if (refs && refs.inputRef) {
         _this.inputSearchRef = refs.inputRef;
       }
     });
-
     _defineProperty(_assertThisInitialized(_this), "focusSearchInput", function () {
-      if (_this.inputSearchRef && // @ts-ignore unchecked
+      if (_this.inputSearchRef &&
+      // @ts-ignore unchecked
       typeof _this.inputSearchRef.focus === 'function') {
         // @ts-ignore unchecked
         _this.inputSearchRef.focus();
       }
     });
-
     _this.state = {
       /** Select first result by default if `selectedResultId` prop is not provided */
       selectedResultId: _this.props.selectedResultId || null,
@@ -308,12 +290,10 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
     };
     return _this;
   }
-
   _createClass(QuickSearch, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       var firePrivateAnalyticsEvent = this.props.firePrivateAnalyticsEvent;
-
       if (firePrivateAnalyticsEvent) {
         firePrivateAnalyticsEvent(QS_ANALYTICS_EV_OPEN, {});
       }
@@ -322,7 +302,6 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       var firePrivateAnalyticsEvent = this.props.firePrivateAnalyticsEvent;
-
       if (firePrivateAnalyticsEvent) {
         firePrivateAnalyticsEvent(QS_ANALYTICS_EV_CLOSE, {});
       }
@@ -338,13 +317,12 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
         this.setState({
           selectedResultId: nextProps.selectedResultId || null
         });
-      } // keep context state in sync
-
+      }
 
+      // keep context state in sync
       var _this$state$context = this.state.context,
-          sendAnalytics = _this$state$context.sendAnalytics,
-          linkComponent = _this$state$context.linkComponent;
-
+        sendAnalytics = _this$state$context.sendAnalytics,
+        linkComponent = _this$state$context.linkComponent;
       if (sendAnalytics !== nextProps.firePrivateAnalyticsEvent || linkComponent !== nextProps.linkComponent) {
         this.setState({
           context: _objectSpread(_objectSpread({}, this.state.context), {}, {
@@ -353,17 +331,15 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
           })
         });
       }
+
       /**
        * Capture whether user needed to query in order to find their target result.
        * Only fire once per mount. Only fire when a search term is entered and the previous search
        * term was empty.
        */
-
-
       if (!this.hasSearchQueryEventFired && !this.props.value && nextProps.value) {
         this.hasSearchQueryEventFired = true;
         var firePrivateAnalyticsEvent = this.props.firePrivateAnalyticsEvent;
-
         if (firePrivateAnalyticsEvent) {
           firePrivateAnalyticsEvent(QS_ANALYTICS_EV_QUERY_ENTERED, {});
         }
@@ -373,10 +349,8 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
     key: "fireKeyboardControlEvent",
     value: function fireKeyboardControlEvent(selectedResultId) {
       var firePrivateAnalyticsEvent = this.props.firePrivateAnalyticsEvent;
-
       if (firePrivateAnalyticsEvent) {
         var result = getResultById(this.flatResults, selectedResultId);
-
         if (result) {
           firePrivateAnalyticsEvent(QS_ANALYTICS_EV_KB_CTRLS_USED, _objectSpread(_objectSpread({}, result.getAnalyticsData()), {}, {
             key: this.lastKeyPressed,
@@ -384,19 +358,8 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
           }));
         }
       }
-
       this.lastKeyPressed = '';
     }
-    /**
-     * Uses the virtual list, this.flatResults, to move the selection across grouped results as if
-     * results were in a single, circular list.
-     *
-     * Process:
-     * 1. Finds the index of the selected result in the flatResults array,
-     * 2. Increments or decrements this index by the supplied adjustment amount,
-     * 3. Sets the new selectedResultId based on the modifed index
-     */
-
   }, {
     key: "render",
     value: function render() {
@@ -417,16 +380,15 @@ export var QuickSearch = /*#__PURE__*/function (_React$Component) {
       }, this.props.children)));
     }
   }]);
-
   return QuickSearch;
 }(React.Component);
+
 /**
  * HOCs:
  * `decorateWithAnalyticsData` - Wrapper that decorates analytics events with additional data.
  * `withAnalytics` - Injects analytics firing methods that are picked up by
  * @atlaskit/analytics/AnalyticsListener.
  */
-
 _defineProperty(QuickSearch, "defaultProps", {
   children: [],
   firePrivateAnalyticsEvent: function firePrivateAnalyticsEvent(_) {},
@@ -437,6 +399,6 @@ _defineProperty(QuickSearch, "defaultProps", {
   placeholder: 'Search',
   value: ''
 });
-
-export default decorateWithAnalyticsData( // @ts-ignore
+export default decorateWithAnalyticsData(
+// @ts-ignore
 withAnalytics(QuickSearch, {}, {}));

package/dist/esm/components/ResultItem/ResultItem.js

@@ -5,27 +5,19 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 import React from 'react';
 import baseItem, { withItemClick, withItemFocus } from '@atlaskit/item';
 import { ResultItemAfter, ResultItemAfterWrapper, ResultItemCaption, ResultItemIcon, ResultItemTextAfter, ResultItemSubText } from './styled';
 var Item = withItemClick(withItemFocus(baseItem));
-
 var ResultItem = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(ResultItem, _React$PureComponent);
-
   var _super = _createSuper(ResultItem);
-
   function ResultItem() {
     _classCallCheck(this, ResultItem);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(ResultItem, [{
     key: "render",
     value: function render() {
@@ -53,13 +45,10 @@ var ResultItem = /*#__PURE__*/function (_React$PureComponent) {
       }, interactiveWrapperProps), this.props.text, wrappedCaption);
     }
   }]);
-
   return ResultItem;
 }(React.PureComponent);
-
 _defineProperty(ResultItem, "defaultProps", {
   isSelected: false,
   isMouseSelected: false
 });
-
 export default ResultItem;

package/dist/esm/components/ResultItem/ResultItemGroup.js

@@ -3,40 +3,30 @@ import _createClass from "@babel/runtime/helpers/createClass";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 import React from 'react';
 import { ItemGroup } from '@atlaskit/item';
 import { ResultItemGroupTitle, ResultItemGroupHeader } from './styled';
-
 var ResultItemGroup = /*#__PURE__*/function (_React$Component) {
   _inherits(ResultItemGroup, _React$Component);
-
   var _super = _createSuper(ResultItemGroup);
-
   function ResultItemGroup() {
     _classCallCheck(this, ResultItemGroup);
-
     return _super.apply(this, arguments);
   }
-
   _createClass(ResultItemGroup, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          title = _this$props.title,
-          children = _this$props.children;
+        title = _this$props.title,
+        children = _this$props.children;
       var wrappedTitle = /*#__PURE__*/React.createElement(ResultItemGroupHeader, null, /*#__PURE__*/React.createElement(ResultItemGroupTitle, null, title));
       return /*#__PURE__*/React.createElement(ItemGroup, {
         title: wrappedTitle
       }, children);
     }
   }]);
-
   return ResultItemGroup;
 }(React.Component);
-
 export { ResultItemGroup as default };

package/dist/esm/components/ResultItem/styled.js

@@ -1,18 +1,15 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
-
 import styled from 'styled-components';
-import { gridSize } from '@atlaskit/theme/constants';
 import { N200 } from '@atlaskit/theme/colors';
-export var ResultItemGroupHeader = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  margin-left: -", "px;\n  margin-top: ", "px;\n"])), gridSize() * 1.5, gridSize() * 1.5);
-export var ResultItemGroupTitle = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-size: 11px;\n  line-height: ", "px;\n  font-weight: 600;\n"])), gridSize() * 2);
+export var ResultItemGroupHeader = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  margin-left: calc(-1 * ", ");\n  margin-top: ", ";\n"])), "var(--ds-space-150, 12px)", "var(--ds-space-150, 12px)");
+export var ResultItemGroupTitle = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-size: 11px;\n  line-height: ", ";\n  font-weight: 600;\n"])), "var(--ds-font-lineHeight-100, 16px)");
 export var ResultItemAfter = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  min-width: ", ";\n"])), function (_ref) {
   var shouldTakeSpace = _ref.shouldTakeSpace;
   return shouldTakeSpace ? '24px' : 0;
 });
 export var ResultItemAfterWrapper = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n"])));
-export var ResultItemCaption = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-size: 12px;\n  margin-left: ", "px;\n"])), N200, gridSize());
+export var ResultItemCaption = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-size: 12px;\n  margin-left: ", ";\n"])), N200, "var(--ds-space-100, 8px)");
 export var ResultItemSubText = styled.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  font-size: 12px;\n  color: ", ";\n"])), N200);
-export var ResultItemIcon = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  transition: padding 200ms;\n\n  > * {\n    flex: 1 0 auto;\n  }\n\n  /* We need to ensure that any image passed in as a child (<img/>, <svg/>\n    etc.) receives the correct width, height and border radius. We don't\n    currently assume that the image passed in is the correct dimensions, or has\n    width / height 100% */\n  > img {\n    height: ", "px;\n    width: ", "px;\n  }\n"])), gridSize() * 3, gridSize() * 3);
+export var ResultItemIcon = styled.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  transition: padding 200ms;\n\n  > * {\n    flex: 1 0 auto;\n  }\n\n  /* We need to ensure that any image passed in as a child (<img/>, <svg/>\n    etc.) receives the correct width, height and border radius. We don't\n    currently assume that the image passed in is the correct dimensions, or has\n    width / height 100% */\n  > img {\n    height: ", ";\n    width: ", ";\n  }\n"])), "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)");
 export var ResultItemTextAfter = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  position: relative;\n  z-index: 1;\n"])));

package/dist/esm/components/Results/ContainerResult.js

@@ -8,39 +8,28 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["name", "isPrivate", "type", "subText"];
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 import React from 'react';
 import Avatar from '@atlaskit/avatar';
 import ResultBase from './ResultBase';
-
 /**
  * Generic result type for Atlassian containers.
  */
 var ContainerResult = /*#__PURE__*/function (_React$PureComponent) {
   _inherits(ContainerResult, _React$PureComponent);
-
   var _super = _createSuper(ContainerResult);
-
   function ContainerResult() {
     var _this;
-
     _classCallCheck(this, ContainerResult);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
-
     _defineProperty(_assertThisInitialized(_this), "getAvatar", function () {
       if (_this.props.avatar) {
         return _this.props.avatar;
       }
-
       return /*#__PURE__*/React.createElement(Avatar, {
         borderColor: "transparent",
         src: _this.props.avatarUrl,
@@ -49,21 +38,18 @@ var ContainerResult = /*#__PURE__*/function (_React$PureComponent) {
         status: _this.props.isPrivate ? 'locked' : null
       });
     });
-
     return _this;
   }
-
   _createClass(ContainerResult, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
-          name = _this$props.name,
-          isPrivate = _this$props.isPrivate,
-          _this$props$type = _this$props.type,
-          type = _this$props$type === void 0 ? 'container' : _this$props$type,
-          subText = _this$props.subText,
-          commonResultProps = _objectWithoutProperties(_this$props, _excluded);
-
+        name = _this$props.name,
+        isPrivate = _this$props.isPrivate,
+        _this$props$type = _this$props.type,
+        type = _this$props$type === void 0 ? 'container' : _this$props$type,
+        subText = _this$props.subText,
+        commonResultProps = _objectWithoutProperties(_this$props, _excluded);
       return /*#__PURE__*/React.createElement(ResultBase, _extends({}, commonResultProps, {
         type: type,
         text: name,
@@ -72,8 +58,6 @@ var ContainerResult = /*#__PURE__*/function (_React$PureComponent) {
       }));
     }
   }]);
-
   return ContainerResult;
 }(React.PureComponent);
-
 export { ContainerResult as default };