@atlaskit/editor-common 74.19.2 → 74.21.0

package/dist/cjs/link/LinkPicker/HyperlinkAddToolbar/index.js

@@ -0,0 +1,79 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HyperlinkAddToolbar = HyperlinkAddToolbar;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireDefault(require("react"));
+var _analytics = require("../../../analytics");
+var _providerFactory = require("../../../provider-factory");
+var _EditorLinkPicker = require("../EditorLinkPicker");
+var _HyperlinkAddToolbar = _interopRequireDefault(require("./HyperlinkAddToolbar"));
+/**
+ * Wraps around the editor's onSubmit handler so that the plugin can interface with the link picker
+ */
+var onSubmitInterface = function onSubmitInterface(onSubmit) {
+  return function (_ref, analytic) {
+    var url = _ref.url,
+      title = _ref.title,
+      displayText = _ref.displayText,
+      rawUrl = _ref.rawUrl,
+      meta = _ref.meta;
+    onSubmit(url, title !== null && title !== void 0 ? title : rawUrl, displayText || undefined, meta.inputMethod === 'manual' ? _analytics.INPUT_METHOD.MANUAL : _analytics.INPUT_METHOD.TYPEAHEAD, analytic);
+  };
+};
+function HyperlinkAddToolbar(_ref2) {
+  var _ref2$linkPickerOptio = _ref2.linkPickerOptions,
+    linkPickerOptions = _ref2$linkPickerOptio === void 0 ? {} : _ref2$linkPickerOptio,
+    onSubmit = _ref2.onSubmit,
+    displayText = _ref2.displayText,
+    displayUrl = _ref2.displayUrl,
+    providerFactory = _ref2.providerFactory,
+    view = _ref2.view,
+    onCancel = _ref2.onCancel,
+    invokeMethod = _ref2.invokeMethod,
+    featureFlags = _ref2.featureFlags,
+    onClose = _ref2.onClose,
+    onEscapeCallback = _ref2.onEscapeCallback,
+    onClickAwayCallback = _ref2.onClickAwayCallback,
+    hyperlinkPluginState = _ref2.hyperlinkPluginState;
+  return /*#__PURE__*/_react.default.createElement(_providerFactory.WithProviders, {
+    providers: ['activityProvider', 'searchProvider'],
+    providerFactory: providerFactory,
+    renderNode: function renderNode(_ref3) {
+      var activityProvider = _ref3.activityProvider,
+        searchProvider = _ref3.searchProvider;
+      var lpLinkPicker = featureFlags.lpLinkPicker;
+      if (lpLinkPicker) {
+        return /*#__PURE__*/_react.default.createElement(_EditorLinkPicker.EditorLinkPicker, (0, _extends2.default)({
+          view: view,
+          invokeMethod: // Provide `invokeMethod` prop as preferred value (card plugin passes as prop) otherwise assume this
+          // is being used from inside the hyperlink plugin and use inputMethod from plugin state
+          invokeMethod !== null && invokeMethod !== void 0 ? invokeMethod : hyperlinkPluginState === null || hyperlinkPluginState === void 0 ? void 0 : hyperlinkPluginState.inputMethod,
+          editorAppearance: hyperlinkPluginState === null || hyperlinkPluginState === void 0 ? void 0 : hyperlinkPluginState.editorAppearance
+        }, linkPickerOptions, {
+          url: displayUrl,
+          displayText: displayText,
+          onSubmit: onSubmitInterface(onSubmit),
+          onCancel: onCancel,
+          onClose: onClose,
+          onEscapeCallback: onEscapeCallback,
+          onClickAwayCallback: onClickAwayCallback
+        }));
+      }
+      return /*#__PURE__*/_react.default.createElement(_HyperlinkAddToolbar.default, {
+        activityProvider: activityProvider,
+        searchProvider: searchProvider,
+        onSubmit: onSubmit,
+        displayText: displayText,
+        displayUrl: displayUrl,
+        pluginState: hyperlinkPluginState,
+        view: view,
+        onEscapeCallback: onEscapeCallback,
+        onClickAwayCallback: onClickAwayCallback
+      });
+    }
+  });
+}

package/dist/cjs/link/LinkPicker/HyperlinkAddToolbar/messages.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.utilMessages = void 0;
+var _reactIntlNext = require("react-intl-next");
+var utilMessages = (0, _reactIntlNext.defineMessages)({
+  hyperlinkIconIssueLabel: {
+    id: 'fabric.editor.headingLink.hyperlinkIconIssueLabel',
+    defaultMessage: 'Issue',
+    description: 'icon label for a jira issue'
+  },
+  hyperlinkIconBugLabel: {
+    id: 'fabric.editor.headingLink.hyperlinkIconBugLabel',
+    defaultMessage: 'Bug',
+    description: 'icon label for a jira bug'
+  },
+  hyperlinkIconStoryLabel: {
+    id: 'fabric.editor.headingLink.hyperlinkIconStoryLabel',
+    defaultMessage: 'Story',
+    description: 'icon label for a jira story'
+  },
+  hyperlinkIconTaskLabel: {
+    id: 'fabric.editor.headingLink.hyperlinkIconTaskLabel',
+    defaultMessage: 'Task',
+    description: 'icon label for a jira task'
+  },
+  hyperlinkIconPageLabel: {
+    id: 'fabric.editor.headingLink.hyperlinkIconPageLabel',
+    defaultMessage: 'Page',
+    description: 'icon label for a confluence page'
+  },
+  hyperlinkIconBlogLabel: {
+    id: 'fabric.editor.headingLink.hyperlinkIconBlogLabel',
+    defaultMessage: 'Blog',
+    description: 'icon label for a confluence blog'
+  }
+});
+exports.utilMessages = utilMessages;

package/dist/cjs/link/LinkPicker/HyperlinkAddToolbar/utils.js

@@ -0,0 +1,84 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.filterUniqueItems = filterUniqueItems;
+exports.wordCount = exports.sha1 = exports.mapContentTypeToIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _rusha = _interopRequireDefault(require("rusha"));
+var _ = _interopRequireDefault(require("@atlaskit/icon-object/glyph/blog/16"));
+var _2 = _interopRequireDefault(require("@atlaskit/icon-object/glyph/bug/16"));
+var _3 = _interopRequireDefault(require("@atlaskit/icon-object/glyph/issue/16"));
+var _4 = _interopRequireDefault(require("@atlaskit/icon-object/glyph/page/16"));
+var _5 = _interopRequireDefault(require("@atlaskit/icon-object/glyph/story/16"));
+var _6 = _interopRequireDefault(require("@atlaskit/icon-object/glyph/task/16"));
+var _messages = require("./messages");
+function filterUniqueItems(arr, comparator) {
+  return arr.filter(function (firstItem, index, self) {
+    return self.findIndex(function (secondItem) {
+      return comparator ? comparator(firstItem, secondItem) : firstItem === secondItem;
+    }) === index;
+  });
+}
+var Issue16 = function Issue16(props) {
+  var intl = props.intl;
+  return /*#__PURE__*/_react.default.createElement(_3.default, {
+    label: intl.formatMessage(_messages.utilMessages.hyperlinkIconIssueLabel)
+  });
+};
+var Bug16 = function Bug16(props) {
+  var intl = props.intl;
+  return /*#__PURE__*/_react.default.createElement(_2.default, {
+    label: intl.formatMessage(_messages.utilMessages.hyperlinkIconBugLabel)
+  });
+};
+var Story16 = function Story16(props) {
+  var intl = props.intl;
+  return /*#__PURE__*/_react.default.createElement(_5.default, {
+    label: intl.formatMessage(_messages.utilMessages.hyperlinkIconStoryLabel)
+  });
+};
+var Task16 = function Task16(props) {
+  var intl = props.intl;
+  return /*#__PURE__*/_react.default.createElement(_6.default, {
+    label: intl.formatMessage(_messages.utilMessages.hyperlinkIconTaskLabel)
+  });
+};
+var Page16 = function Page16(props) {
+  var intl = props.intl;
+  return /*#__PURE__*/_react.default.createElement(_4.default, {
+    label: intl.formatMessage(_messages.utilMessages.hyperlinkIconPageLabel)
+  });
+};
+var Blog16 = function Blog16(props) {
+  var intl = props.intl;
+  return /*#__PURE__*/_react.default.createElement(_.default, {
+    label: intl.formatMessage(_messages.utilMessages.hyperlinkIconBlogLabel)
+  });
+};
+var IntlIssue16Icon = (0, _reactIntlNext.injectIntl)(Issue16);
+var IntlBug16Icon = (0, _reactIntlNext.injectIntl)(Bug16);
+var IntlStory16Icon = (0, _reactIntlNext.injectIntl)(Story16);
+var IntlTask16Icon = (0, _reactIntlNext.injectIntl)(Task16);
+var IntlPage16Icon = (0, _reactIntlNext.injectIntl)(Page16);
+var IntlBlog16Icon = (0, _reactIntlNext.injectIntl)(Blog16);
+var mapContentTypeToIcon = {
+  'jira.issue': /*#__PURE__*/_react.default.createElement(IntlIssue16Icon, null),
+  'jira.issue.bug': /*#__PURE__*/_react.default.createElement(IntlBug16Icon, null),
+  'jira.issue.story': /*#__PURE__*/_react.default.createElement(IntlStory16Icon, null),
+  'jira.issue.task': /*#__PURE__*/_react.default.createElement(IntlTask16Icon, null),
+  'confluence.page': /*#__PURE__*/_react.default.createElement(IntlPage16Icon, null),
+  'confluence.blogpost': /*#__PURE__*/_react.default.createElement(IntlBlog16Icon, null)
+};
+exports.mapContentTypeToIcon = mapContentTypeToIcon;
+var sha1 = function sha1(input) {
+  return _rusha.default.createHash().update(input).digest('hex');
+};
+exports.sha1 = sha1;
+var wordCount = function wordCount(input) {
+  return input.split(' ').length;
+};
+exports.wordCount = wordCount;

package/dist/cjs/link/LinkSearch/LinkSearchList.js

@@ -0,0 +1,83 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.linkSearchList = exports.default = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = require("react");
+var _react2 = require("@emotion/react");
+var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
+var _LinkSearchListItem = _interopRequireDefault(require("./LinkSearchListItem"));
+var _templateObject, _templateObject2, _templateObject3;
+/** @jsx jsx */
+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 listContainer = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  padding-top: 0;\n"])));
+var spinnerContainer = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  text-align: center;\n  min-height: 80px;\n  margin-top: 30px;\n"])));
+var linkSearchList = (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  padding: 0;\n  list-style: none;\n"])));
+exports.linkSearchList = linkSearchList;
+var LinkSearchList = /*#__PURE__*/function (_PureComponent) {
+  (0, _inherits2.default)(LinkSearchList, _PureComponent);
+  var _super = _createSuper(LinkSearchList);
+  function LinkSearchList() {
+    (0, _classCallCheck2.default)(this, LinkSearchList);
+    return _super.apply(this, arguments);
+  }
+  (0, _createClass2.default)(LinkSearchList, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        onSelect = _this$props.onSelect,
+        onMouseMove = _this$props.onMouseMove,
+        onMouseEnter = _this$props.onMouseEnter,
+        onMouseLeave = _this$props.onMouseLeave,
+        items = _this$props.items,
+        selectedIndex = _this$props.selectedIndex,
+        isLoading = _this$props.isLoading,
+        ariaControls = _this$props.ariaControls,
+        role = _this$props.role,
+        id = _this$props.id;
+      var itemsContent;
+      var loadingContent;
+      if (items && items.length > 0) {
+        itemsContent = (0, _react2.jsx)("ul", {
+          css: linkSearchList,
+          id: id,
+          role: role,
+          "aria-controls": ariaControls
+        }, items.map(function (item, index) {
+          return (0, _react2.jsx)(_LinkSearchListItem.default, {
+            id: "link-search-list-item-".concat(index),
+            role: role && 'option',
+            item: item,
+            selected: selectedIndex === index,
+            onMouseMove: onMouseMove,
+            onMouseEnter: onMouseEnter,
+            onMouseLeave: onMouseLeave,
+            onSelect: onSelect,
+            key: item.objectId
+          });
+        }));
+      }
+      if (isLoading) {
+        loadingContent = (0, _react2.jsx)("div", {
+          css: spinnerContainer
+        }, (0, _react2.jsx)(_spinner.default, {
+          size: "medium"
+        }));
+      }
+      return (0, _react2.jsx)("div", {
+        css: listContainer
+      }, itemsContent, loadingContent);
+    }
+  }]);
+  return LinkSearchList;
+}(_react.PureComponent);
+exports.default = LinkSearchList;

package/dist/cjs/link/LinkSearch/LinkSearchListItem.js

@@ -0,0 +1,146 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.nameStyle = exports.default = exports.containerSelected = exports.containerName = exports.container = 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 = _interopRequireWildcard(require("react"));
+var _react2 = require("@emotion/react");
+var _reactIntlNext = require("react-intl-next");
+var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _colors = require("@atlaskit/theme/colors");
+var _constants = require("@atlaskit/theme/constants");
+var _listItemAlts = require("./listItemAlts");
+var _transformTimeStamp = require("./transformTimeStamp");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+/** @jsx jsx */
+// AFP-2532 TODO: Fix automatic suppressions below
+// eslint-disable-next-line @atlassian/tangerine/import/entry-points
+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; }
+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 container = (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  background-color: transparent;\n  padding: 8px 12px;\n  cursor: pointer;\n  display: flex;\n  margin-top: 0;\n"])));
+exports.container = container;
+var containerSelected = (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  background-color: ", ";\n"])), "var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N20, ")"));
+exports.containerSelected = containerSelected;
+var nameWrapper = (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  overflow: hidden;\n"])));
+var nameStyle = (0, _react2.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  line-height: 20px;\n"])), "var(--ds-text, ".concat(_colors.N800, ")"));
+exports.nameStyle = nameStyle;
+var containerName = (0, _react2.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  color: ", ";\n  line-height: 14px;\n  font-size: ", ";\n"])), "var(--ds-text-subtlest, ".concat(_colors.N300, ")"), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSizeSmall)()));
+exports.containerName = containerName;
+var iconStyle = (0, _react2.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  min-width: 16px;\n  margin-top: 3px;\n  margin-right: 12px;\n\n  img {\n    max-width: 16px;\n  }\n"])));
+var LinkSearchListItem = /*#__PURE__*/function (_React$PureComponent) {
+  (0, _inherits2.default)(LinkSearchListItem, _React$PureComponent);
+  var _super = _createSuper(LinkSearchListItem);
+  function LinkSearchListItem() {
+    var _this;
+    (0, _classCallCheck2.default)(this, LinkSearchListItem);
+    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), "handleSelect", function (e) {
+      e.preventDefault(); // don't let editor lose focus
+      var _this$props = _this.props,
+        item = _this$props.item,
+        onSelect = _this$props.onSelect;
+      onSelect(item.url, item.name);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseMove", function () {
+      var _this$props2 = _this.props,
+        onMouseMove = _this$props2.onMouseMove,
+        item = _this$props2.item;
+      onMouseMove && onMouseMove(item.objectId);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseEnter", function () {
+      var _this$props3 = _this.props,
+        onMouseEnter = _this$props3.onMouseEnter,
+        item = _this$props3.item;
+      onMouseEnter && onMouseEnter(item.objectId);
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseLeave", function () {
+      var _this$props4 = _this.props,
+        onMouseLeave = _this$props4.onMouseLeave,
+        item = _this$props4.item;
+      onMouseLeave && onMouseLeave(item.objectId);
+    });
+    return _this;
+  }
+  (0, _createClass2.default)(LinkSearchListItem, [{
+    key: "renderIcon",
+    value: function renderIcon() {
+      var _this$props5 = this.props,
+        _this$props5$item = _this$props5.item,
+        icon = _this$props5$item.icon,
+        iconUrl = _this$props5$item.iconUrl,
+        intl = _this$props5.intl;
+      if (icon) {
+        return (0, _react2.jsx)("span", {
+          css: iconStyle
+        }, icon);
+      }
+      if (iconUrl) {
+        return (0, _react2.jsx)("span", {
+          css: iconStyle
+        }, (0, _react2.jsx)("img", {
+          src: iconUrl,
+          alt: (0, _listItemAlts.getCorrectAltByIconUrl)(iconUrl, intl)
+        }));
+      }
+      return null;
+    }
+  }, {
+    key: "renderTimeStamp",
+    value: function renderTimeStamp() {
+      var _this$props6 = this.props,
+        item = _this$props6.item,
+        intl = _this$props6.intl;
+      var date = (0, _transformTimeStamp.transformTimeStamp)(intl, item.lastViewedDate, item.lastUpdatedDate);
+      return date && (0, _react2.jsx)(_react.Fragment, null, "\xA0 \u2022", (0, _react2.jsx)("span", {
+        className: "link-search-timestamp",
+        "data-test-id": "link-search-timestamp"
+      }, "\xA0 ", date.pageAction, " ", date.dateString, " ", date.timeSince || ''));
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props7 = this.props,
+        item = _this$props7.item,
+        selected = _this$props7.selected,
+        id = _this$props7.id,
+        role = _this$props7.role;
+      return (0, _react2.jsx)("li", {
+        css: [container, selected && containerSelected],
+        role: role,
+        id: id,
+        "aria-selected": selected,
+        "data-testid": "link-search-list-item",
+        onMouseMove: this.handleMouseMove,
+        onMouseEnter: this.handleMouseEnter,
+        onMouseLeave: this.handleMouseLeave,
+        onClick: this.handleSelect
+      }, this.renderIcon(), (0, _react2.jsx)("span", {
+        css: nameWrapper
+      }, (0, _react2.jsx)("div", {
+        css: nameStyle
+      }, item.name), (0, _react2.jsx)("div", {
+        "data-testid": "link-search-list-item-container",
+        css: containerName
+      }, item.container, this.renderTimeStamp())));
+    }
+  }]);
+  return LinkSearchListItem;
+}(_react.default.PureComponent);
+var _default = (0, _reactIntlNext.injectIntl)(LinkSearchListItem);
+exports.default = _default;

package/dist/cjs/link/LinkSearch/ToolbarComponents.js

@@ -0,0 +1,17 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.inputWrapper = exports.containerWithProvider = exports.container = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = require("@emotion/react");
+var _ui = require("../../ui");
+var _templateObject, _templateObject2, _templateObject3;
+var inputWrapper = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  line-height: 0;\n  padding: 5px 0;\n  align-items: center;\n"])));
+exports.inputWrapper = inputWrapper;
+var container = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  padding: 0;\n\n  width: ", "px;\n  line-height: initial;\n"])), _ui.RECENT_SEARCH_WIDTH_WITHOUT_ITEMS_IN_PX);
+exports.container = container;
+var containerWithProvider = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  width: ", "px;\n"])), _ui.RECENT_SEARCH_WIDTH_IN_PX);
+exports.containerWithProvider = containerWithProvider;