@atlaskit/quick-search 8.0.9

package/dist/cjs/components/Results/ResultBase.js

@@ -0,0 +1,206 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.ResultBase = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _constants = require("../constants");
+
+var _ResultItem = _interopRequireDefault(require("../ResultItem/ResultItem"));
+
+var _context = require("../context");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { 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 = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } }
+
+var ResultBase = /*#__PURE__*/function (_React$PureComponent) {
+  (0, _inherits2.default)(ResultBase, _React$PureComponent);
+
+  var _super = _createSuper(ResultBase);
+
+  function ResultBase() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, ResultBase);
+
+    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));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
+      isMouseSelected: false
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleClick", function (e) {
+      var _this$props = _this.props,
+          onClick = _this$props.onClick,
+          resultId = _this$props.resultId,
+          type = _this$props.type,
+          context = _this$props.context;
+
+      if (context.sendAnalytics) {
+        context.sendAnalytics(_constants.QS_ANALYTICS_EV_SUBMIT, _objectSpread(_objectSpread({}, _this.getAnalyticsData()), {}, {
+          method: 'click',
+          newTab: e && (e.metaKey || e.shiftKey || e.ctrlKey)
+        }));
+      }
+
+      if (onClick) {
+        onClick({
+          resultId: resultId,
+          type: type,
+          event: e
+        });
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseEnter", function (event) {
+      _this.props.context.onMouseEnter({
+        resultId: _this.props.resultId,
+        type: _this.props.type,
+        event: event
+      });
+
+      _this.setState({
+        isMouseSelected: true
+      });
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseLeave", function () {
+      _this.props.context.onMouseLeave();
+
+      _this.setState({
+        isMouseSelected: false
+      });
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(ResultBase, [{
+    key: "registerResult",
+    value: function registerResult() {
+      var context = this.props.context;
+      context.registerResult(this);
+    }
+  }, {
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.registerResult();
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate() {
+      this.registerResult();
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var context = this.props.context;
+      context.unregisterResult(this);
+    }
+  }, {
+    key: "getAnalyticsData",
+    value: function getAnalyticsData() {
+      var _this$props2 = this.props,
+          resultId = _this$props2.resultId,
+          analyticsData = _this$props2.analyticsData,
+          type = _this$props2.type,
+          context = _this$props2.context;
+      return _objectSpread({
+        index: context.getIndex(resultId),
+        type: type,
+        resultId: resultId
+      }, analyticsData instanceof Function ? analyticsData() : analyticsData);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props3 = this.props,
+          caption = _this$props3.caption,
+          elemAfter = _this$props3.elemAfter,
+          selectedIcon = _this$props3.selectedIcon,
+          href = _this$props3.href,
+          target = _this$props3.target,
+          icon = _this$props3.icon,
+          isCompact = _this$props3.isCompact,
+          subText = _this$props3.subText,
+          text = _this$props3.text,
+          resultId = _this$props3.resultId,
+          context = _this$props3.context;
+      var isMouseSelected = this.state.isMouseSelected;
+      return /*#__PURE__*/_react.default.createElement(_context.SelectedResultIdContext.Consumer, null, function (selectedResultId) {
+        return /*#__PURE__*/_react.default.createElement(_ResultItem.default, {
+          caption: caption,
+          href: href,
+          target: target,
+          icon: icon,
+          isCompact: isCompact,
+          isSelected: resultId === selectedResultId,
+          onClick: _this2.handleClick,
+          onMouseEnter: _this2.handleMouseEnter,
+          onMouseLeave: _this2.handleMouseLeave,
+          isMouseSelected: isMouseSelected,
+          subText: subText,
+          text: text,
+          textAfter: elemAfter,
+          selectedIcon: selectedIcon,
+          linkComponent: context.linkComponent
+        });
+      });
+    }
+  }]);
+  return ResultBase;
+}(_react.default.PureComponent);
+
+exports.ResultBase = ResultBase;
+(0, _defineProperty2.default)(ResultBase, "defaultProps", {
+  type: 'base',
+  context: {
+    registerResult: function registerResult(result) {},
+    unregisterResult: function unregisterResult(result) {},
+    onMouseEnter: function onMouseEnter(resultData) {},
+    onMouseLeave: function onMouseLeave() {},
+    // @ts-ignore
+    sendAnalytics: function sendAnalytics(string, data) {},
+    getIndex: function getIndex() {
+      return null;
+    }
+  },
+  analyticsData: {}
+});
+
+var _default = function _default(props) {
+  return /*#__PURE__*/_react.default.createElement(_context.ResultContext.Consumer, null, function (context) {
+    return /*#__PURE__*/_react.default.createElement(ResultBase, (0, _extends2.default)({
+      context: context
+    }, props));
+  });
+};
+
+exports.default = _default;

package/dist/cjs/components/Results/index.js

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ContainerResult", {
+  enumerable: true,
+  get: function get() {
+    return _ContainerResult.default;
+  }
+});
+Object.defineProperty(exports, "ObjectResult", {
+  enumerable: true,
+  get: function get() {
+    return _ObjectResult.default;
+  }
+});
+Object.defineProperty(exports, "PersonResult", {
+  enumerable: true,
+  get: function get() {
+    return _PersonResult.default;
+  }
+});
+Object.defineProperty(exports, "ResultBase", {
+  enumerable: true,
+  get: function get() {
+    return _ResultBase.default;
+  }
+});
+
+var _ContainerResult = _interopRequireDefault(require("./ContainerResult"));
+
+var _ObjectResult = _interopRequireDefault(require("./ObjectResult"));
+
+var _PersonResult = _interopRequireDefault(require("./PersonResult"));
+
+var _ResultBase = _interopRequireDefault(require("./ResultBase"));

package/dist/cjs/components/Results/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/components/Search/Search.js

@@ -0,0 +1,124 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.controlKeys = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _styled = require("./styled");
+
+var _templateObject;
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } }
+
+var controlKeys = ['ArrowUp', 'ArrowDown', 'Enter', 'Tab', 'ArrowRight'];
+exports.controlKeys = controlKeys;
+
+var SpinnerParent = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  height: 20px;\n  margin-left: 10px;\n  margin-top: 10px;\n"])));
+
+var Search = /*#__PURE__*/function (_React$PureComponent) {
+  (0, _inherits2.default)(Search, _React$PureComponent);
+
+  var _super = _createSuper(Search);
+
+  function Search() {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, Search);
+
+    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));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onInputKeyDown", function (event) {
+      var onKeyDown = _this.props.onKeyDown;
+
+      if (!controlKeys.includes(event.key)) {
+        return;
+      }
+
+      if (onKeyDown) {
+        onKeyDown(event);
+      }
+
+      event.stopPropagation();
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setInputRef", function (ref) {
+      _this.inputRef = ref;
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderInputControls", function () {
+      return _this.props.inputControls ? /*#__PURE__*/_react.default.createElement(_styled.SearchInputControlsContainer, null, _this.props.inputControls) : null;
+    });
+    return _this;
+  }
+
+  (0, _createClass2.default)(Search, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          children = _this$props.children,
+          onBlur = _this$props.onBlur,
+          onInput = _this$props.onInput,
+          placeholder = _this$props.placeholder,
+          isLoading = _this$props.isLoading,
+          value = _this$props.value,
+          autocomplete = _this$props.autocompleteText;
+      return /*#__PURE__*/_react.default.createElement(_styled.SearchInner, null, /*#__PURE__*/_react.default.createElement(_styled.SearchBox, null, /*#__PURE__*/_react.default.createElement(_styled.SearchFieldBaseOuter, null, /*#__PURE__*/_react.default.createElement(_styled.SearchFieldBaseInner, null, autocomplete && /*#__PURE__*/_react.default.createElement(_styled.SearchInputTypeAhead, {
+        spellCheck: false,
+        type: "text",
+        value: "".concat(autocomplete),
+        readOnly: true,
+        tabIndex: -1
+      }), /*#__PURE__*/_react.default.createElement(_styled.SearchInput, {
+        autoFocus: true,
+        innerRef: this.setInputRef,
+        onBlur: onBlur,
+        onInput: onInput,
+        placeholder: placeholder,
+        spellCheck: false,
+        type: "text",
+        value: value,
+        onChange: function onChange() {} // Suppresses the console warning, we handle onChange by using onKeyDown instead.
+        ,
+        onKeyDown: this.onInputKeyDown
+      }), isLoading && /*#__PURE__*/_react.default.createElement(SpinnerParent, null, /*#__PURE__*/_react.default.createElement(_spinner.default, {
+        size: "small"
+      })))), this.renderInputControls()), children);
+    }
+  }]);
+  return Search;
+}(_react.default.PureComponent);
+
+exports.default = Search;
+(0, _defineProperty2.default)(Search, "defaultProps", {
+  isLoading: false,
+  onBlur: function onBlur() {},
+  placeholder: 'Search'
+});

package/dist/cjs/components/Search/styled.js

@@ -0,0 +1,61 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SearchInputControlsContainer = exports.SearchInputTypeAhead = exports.SearchInput = exports.getPlaceholderColor = exports.getPlaceholderStyle = exports.SearchInner = exports.SearchFieldBaseInner = exports.SearchFieldBaseOuter = exports.SearchBox = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _constants = require("@atlaskit/theme/constants");
+
+var _colors = require("@atlaskit/theme/colors");
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var inputRightPadding = (0, _constants.gridSize)() * 2;
+
+var SearchBox = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: sticky;\n  top: 0;\n  z-index: 1; /* required to keep the search box on top of icons in results when sticky */\n  background-color: ", ";\n  color: ", ";\n  display: flex;\n  height: 36px;\n  z-index: 10;\n"])), _colors.N0, _colors.N500);
+
+exports.SearchBox = SearchBox;
+
+var SearchFieldBaseOuter = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex: 1;\n  margin-right: auto;\n  padding-bottom: 2px;\n  border-bottom: 2px solid ", ";\n"])), _colors.B200);
+
+exports.SearchFieldBaseOuter = SearchFieldBaseOuter;
+
+var SearchFieldBaseInner = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  align-items: center;\n  padding-right: ", "px; /* pad search text from FieldBase's isLoading spinner */\n  display: flex;\n  flex-grow: 1;\n"])), inputRightPadding);
+
+exports.SearchFieldBaseInner = SearchFieldBaseInner;
+
+var SearchInner = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  padding-right: ", "px;\n"])), (0, _constants.gridSize)() * 3);
+
+exports.SearchInner = SearchInner;
+
+var getPlaceholderStyle = function getPlaceholderStyle(style) {
+  return (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  &::-webkit-input-placeholder {\n    ", ";\n  }\n  &::-moz-placeholder {\n    /* Mozilla Firefox 19+ */\n    ", " opacity: 1;\n  }\n  &::-ms-input-placeholder {\n    /* Microsoft Edge */\n    ", ";\n  }\n  &:-moz-placeholder {\n    /* Mozilla Firefox 4 to 18 */\n    ", " opacity: 1;\n  }\n  &:-ms-input-placeholder {\n    /* Internet Explorer 10-11 */\n    ", ";\n  }\n"])), style, style, style, style, style);
+};
+
+exports.getPlaceholderStyle = getPlaceholderStyle;
+var getPlaceholderColor = (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n"])), _colors.placeholderText);
+exports.getPlaceholderColor = getPlaceholderColor;
+
+var SearchInput = _styledComponents.default.input(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: transparent;\n  border: 0;\n  color: ", ";\n  flex-grow: 1;\n  font-size: 1.4em;\n  outline: 0;\n  // Safari adds 2px margin-left\n  margin-left: 0;\n  ", ";\n"])), _colors.N500, getPlaceholderStyle(getPlaceholderColor));
+
+exports.SearchInput = SearchInput;
+var SearchInputTypeAhead = (0, _styledComponents.default)(SearchInput)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  position: absolute;\n  width: calc(100% - ", "px);\n  z-index: -1;\n"])), _colors.N50, inputRightPadding);
+exports.SearchInputTypeAhead = SearchInputTypeAhead;
+
+var SearchInputControlsContainer = _styledComponents.default.span(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  padding-left: ", "px;\n"])), (0, _constants.gridSize)() * 3);
+
+exports.SearchInputControlsContainer = SearchInputControlsContainer;
+SearchInputControlsContainer.displayName = 'SearchInputControlsContainer'; // required for testing

package/dist/cjs/components/constants.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.QS_ANALYTICS_EV_SUBMIT = exports.QS_ANALYTICS_EV_QUERY_ENTERED = exports.QS_ANALYTICS_EV_OPEN = exports.QS_ANALYTICS_EV_KB_CTRLS_USED = exports.QS_ANALYTICS_EV_CLOSE = exports.ATLASKIT_QUICKSEARCH_NS = void 0;
+
+/* eslint-disable import/prefer-default-export */
+var ATLASKIT_QUICKSEARCH_NS = 'atlaskit.navigation.quick-search';
+exports.ATLASKIT_QUICKSEARCH_NS = ATLASKIT_QUICKSEARCH_NS;
+var QS_ANALYTICS_EV_CLOSE = "".concat(ATLASKIT_QUICKSEARCH_NS, ".close");
+exports.QS_ANALYTICS_EV_CLOSE = QS_ANALYTICS_EV_CLOSE;
+var QS_ANALYTICS_EV_KB_CTRLS_USED = "".concat(ATLASKIT_QUICKSEARCH_NS, ".keyboard-controls-used");
+exports.QS_ANALYTICS_EV_KB_CTRLS_USED = QS_ANALYTICS_EV_KB_CTRLS_USED;
+var QS_ANALYTICS_EV_OPEN = "".concat(ATLASKIT_QUICKSEARCH_NS, ".open");
+exports.QS_ANALYTICS_EV_OPEN = QS_ANALYTICS_EV_OPEN;
+var QS_ANALYTICS_EV_QUERY_ENTERED = "".concat(ATLASKIT_QUICKSEARCH_NS, ".query-entered");
+exports.QS_ANALYTICS_EV_QUERY_ENTERED = QS_ANALYTICS_EV_QUERY_ENTERED;
+var QS_ANALYTICS_EV_SUBMIT = "".concat(ATLASKIT_QUICKSEARCH_NS, ".submit");
+exports.QS_ANALYTICS_EV_SUBMIT = QS_ANALYTICS_EV_SUBMIT;