@atlaskit/link-picker 1.9.3 → 1.10.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/link-picker
 
+## 1.10.0
+
+### Minor Changes
+
+- [`7dbc77d866a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7dbc77d866a) - Adds support for plugins providing metadata about resolved links.
+
+## 1.9.4
+
+### Patch Changes
+
+- [`81ac9ce10ff`](https://bitbucket.org/atlassian/atlassian-frontend/commits/81ac9ce10ff) - Update error boundary implementation to replace analytic instrumentation for uncaught errors.
+
 ## 1.9.3
 
 ### Patch Changes

package/dist/cjs/analytics.codegen.js

@@ -10,7 +10,7 @@ exports.default = void 0;
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::e4f7029050ef6edde92cac3d9535cd4a>>
+ * @codegen <<SignedSource::e8a730530bb93e19d0b85114da0581c8>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
 function createEventPayload(eventKey, attributes) {

package/dist/cjs/common/analytics/context.js

@@ -36,6 +36,7 @@ var DEFAULT_CONTEXT_ATTRIBUTES = {
   linkState: 'newLink',
   linkFieldContent: null,
   linkFieldContentInputMethod: null,
+  linkFieldContentInputSource: null,
   displayTextFieldContent: null,
   displayTextFieldContentInputMethod: null
 };

package/dist/cjs/services/use-plugins/index.js

@@ -144,6 +144,7 @@ function usePlugins(state, activeTab, plugins) {
     tabs: tabs,
     items: items,
     isLoading: isLoading,
+    activePlugin: activePlugin,
     isActivePlugin: !!activePlugin,
     error: error,
     retry: handleRetry,

package/dist/cjs/ui/error-boundary/index.js

@@ -0,0 +1,104 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.BaseErrorBoundary = 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 _react = _interopRequireWildcard(require("react"));
+
+var _analyticsNext = require("@atlaskit/analytics-next");
+
+var _analytics = _interopRequireDefault(require("../../analytics.codegen"));
+
+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; } }
+
+// eslint-disable-next-line @repo/internal/react/no-class-components
+var BaseErrorBoundary = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(BaseErrorBoundary, _Component);
+
+  var _super = _createSuper(BaseErrorBoundary);
+
+  function BaseErrorBoundary(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, BaseErrorBoundary);
+    _this = _super.call(this, props);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "fireAnalytics", function (analyticsErrorPayload) {
+      var _window, _window$navigator, _analyticsErrorPayloa, _analyticsErrorPayloa2;
+
+      var _this$props = _this.props,
+          createAnalyticsEvent = _this$props.createAnalyticsEvent,
+          channel = _this$props.channel;
+      createAnalyticsEvent((0, _analytics.default)('ui.linkPicker.unhandledErrorCaught', {
+        browserInfo: ((_window = window) === null || _window === void 0 ? void 0 : (_window$navigator = _window.navigator) === null || _window$navigator === void 0 ? void 0 : _window$navigator.userAgent) || 'unknown',
+        error: analyticsErrorPayload.error.toString(),
+        componentStack: (_analyticsErrorPayloa = (_analyticsErrorPayloa2 = analyticsErrorPayload.info) === null || _analyticsErrorPayloa2 === void 0 ? void 0 : _analyticsErrorPayloa2.componentStack) !== null && _analyticsErrorPayloa !== void 0 ? _analyticsErrorPayloa : ''
+      })).fire(channel);
+    });
+    _this.state = {
+      hasError: false
+    };
+    return _this;
+  }
+
+  (0, _createClass2.default)(BaseErrorBoundary, [{
+    key: "componentDidCatch",
+    value: function componentDidCatch(error, info) {
+      var onError = this.props.onError;
+      var payload = {
+        error: error,
+        info: info
+      };
+      this.fireAnalytics(payload);
+      onError && onError(error, info);
+      this.setState({
+        hasError: true
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+          children = _this$props2.children,
+          ErrorComponent = _this$props2.ErrorComponent;
+      var hasError = this.state.hasError;
+
+      if (hasError && ErrorComponent) {
+        return /*#__PURE__*/_react.default.createElement(ErrorComponent, null);
+      }
+
+      return children;
+    }
+  }]);
+  return BaseErrorBoundary;
+}(_react.Component);
+
+exports.BaseErrorBoundary = BaseErrorBoundary;
+var ErrorBoundary = (0, _analyticsNext.withAnalyticsEvents)()(BaseErrorBoundary);
+var _default = ErrorBoundary;
+exports.default = _default;

package/dist/cjs/ui/index.js

@@ -11,14 +11,16 @@ var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _analyticsNext = require("@atlaskit/analytics-next");
-
 var _reactLooselyLazy = require("react-loosely-lazy");
 
+var _analyticsNext = require("@atlaskit/analytics-next");
+
 var _constants = require("../common/constants");
 
 var _version = require("../version.json");
 
+var _errorBoundary = _interopRequireDefault(require("./error-boundary"));
+
 var _errorBoundaryFallback = require("./error-boundary-fallback");
 
 var _loaderFallback = require("./loader-fallback");
@@ -40,12 +42,13 @@ var LazyLinkPicker = (0, _reactLooselyLazy.lazyForPaint)(function () {
   });
 });
 var ComposedLinkPicker = /*#__PURE__*/(0, _react.memo)(function (props) {
-  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsErrorBoundary, {
+  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+    data: PACKAGE_DATA
+  }, /*#__PURE__*/_react.default.createElement(_errorBoundary.default, {
     channel: _constants.ANALYTICS_CHANNEL,
-    data: PACKAGE_DATA,
     ErrorComponent: _errorBoundaryFallback.ErrorBoundaryFallback
   }, /*#__PURE__*/_react.default.createElement(_reactLooselyLazy.LazySuspense, {
     fallback: _loaderFallback.LoaderFallback
-  }, /*#__PURE__*/_react.default.createElement(LazyLinkPicker, props)));
+  }, /*#__PURE__*/_react.default.createElement(LazyLinkPicker, props))));
 });
 exports.ComposedLinkPicker = ComposedLinkPicker;

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

@@ -61,6 +61,8 @@ var _linkSearchError = _interopRequireWildcard(require("./link-search-error"));
 
 var _formFooter = _interopRequireWildcard(require("./form-footer"));
 
+var _utils = require("./utils");
+
 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; }
@@ -160,6 +162,7 @@ function LinkPicker(_ref) {
       items = _usePlugins.items,
       isLoading = _usePlugins.isLoading,
       isActivePlugin = _usePlugins.isActivePlugin,
+      activePlugin = _usePlugins.activePlugin,
       tabs = _usePlugins.tabs,
       error = _usePlugins.error,
       retry = _usePlugins.retry,
@@ -190,10 +193,12 @@ function LinkPicker(_ref) {
     }
   }, [onContentResize, items, isLoading, isActivePlugin, tabs]);
   var handleChangeUrl = (0, _react.useCallback)(function (e) {
+    /** Any on change event is triggered by manual input or paste, so source is null */
+    trackAttribute('linkFieldContentInputSource', null);
     dispatch({
       url: e.currentTarget.value
     });
-  }, []);
+  }, [trackAttribute]);
   var handleChangeText = (0, _react.useCallback)(function (e) {
     dispatch({
       displayText: e.currentTarget.value
@@ -224,23 +229,30 @@ function LinkPicker(_ref) {
         break;
     }
 
-    if ([KEY_CODE_ARROW_DOWN, KEY_CODE_ARROW_UP].includes(keyCode) && items[updatedIndex]) {
+    var item = items[updatedIndex];
+
+    if ([KEY_CODE_ARROW_DOWN, KEY_CODE_ARROW_UP].includes(keyCode) && item) {
       /**
        * Manually track that the url has been updated using searchResult method
        */
-      trackAttribute('linkFieldContent', getLinkFieldContent(items[updatedIndex].url));
+      trackAttribute('linkFieldContent', getLinkFieldContent(item.url));
       trackAttribute('linkFieldContentInputMethod', 'searchResult');
+      trackAttribute('linkFieldContentInputSource', (0, _utils.getDataSource)(item, activePlugin));
       dispatch({
         activeIndex: updatedIndex,
         selectedIndex: updatedIndex,
-        url: items[updatedIndex].url,
+        url: item.url,
         invalidUrl: false
       });
     }
-  }, [activeIndex, items, trackAttribute]);
+  }, [activeIndex, items, trackAttribute, activePlugin]);
   var handleClear = (0, _react.useCallback)(function (field) {
     dispatch((0, _defineProperty2.default)({}, field, ''));
   }, []);
+  var handleUrlClear = (0, _react.useCallback)(function () {
+    trackAttribute('linkFieldContentInputSource', null);
+    handleClear('url');
+  }, [trackAttribute, handleClear]);
   var handleMouseEnterResultItem = (0, _react.useCallback)(function (objectId) {
     var index = items === null || items === void 0 ? void 0 : items.findIndex(function (item) {
       return item.objectId === objectId;
@@ -291,16 +303,17 @@ function LinkPicker(_ref) {
     if (selectedItem) {
       var _url = selectedItem.url,
           name = selectedItem.name;
-      dispatchEvent(new Event('submit'));
       /**
        * Manually track that the url has been updated using searchResult method
        */
 
+      dispatchEvent(new Event('submit'));
       trackAttribute('linkFieldContent', getLinkFieldContent(_url));
       trackAttribute('linkFieldContentInputMethod', 'searchResult');
+      trackAttribute('linkFieldContentInputSource', (0, _utils.getDataSource)(selectedItem, activePlugin));
       handleInsert(_url, name, 'typeAhead');
     }
-  }, [handleInsert, trackAttribute, items]);
+  }, [handleInsert, trackAttribute, items, activePlugin]);
   var handleSubmit = (0, _react.useCallback)(function (event) {
     event.preventDefault();
 
@@ -361,7 +374,7 @@ function LinkPicker(_ref) {
     "aria-activedescendant": ariaActiveDescendant,
     "aria-describedby": screenReaderDescriptionId,
     error: invalidUrl ? intl.formatMessage(_messages.messages.linkInvalid) : null,
-    onClear: handleClear,
+    onClear: handleUrlClear,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
   }), (0, _react2.jsx)(DisplayTextInputField, {

package/dist/cjs/ui/link-picker/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isUndoEvent = exports.isRedoEvent = void 0;
+exports.isUndoEvent = exports.isRedoEvent = exports.getDataSource = void 0;
 
 var _browser = require("./browser");
 
@@ -23,5 +23,17 @@ var isRedoEvent = function isRedoEvent(e) {
     !_browser.browser.mac && e.ctrlKey && e.keyCode === KeyYCode || _browser.browser.mac && e.metaKey && e.shiftKey && e.keyCode === KeyZCode || e.ctrlKey && e.shiftKey && e.keyCode === KeyZCode
   );
 };
+/**
+ * Retrieve the data source for a link given the item and the plugin that resolved it
+ */
 
-exports.isRedoEvent = isRedoEvent;
+
+exports.isRedoEvent = isRedoEvent;
+
+var getDataSource = function getDataSource(item, plugin) {
+  var _ref, _item$meta$source, _item$meta, _plugin$meta;
+
+  return (_ref = (_item$meta$source = (_item$meta = item.meta) === null || _item$meta === void 0 ? void 0 : _item$meta.source) !== null && _item$meta$source !== void 0 ? _item$meta$source : plugin === null || plugin === void 0 ? void 0 : (_plugin$meta = plugin.meta) === null || _plugin$meta === void 0 ? void 0 : _plugin$meta.source) !== null && _ref !== void 0 ? _ref : 'unknown';
+};
+
+exports.getDataSource = getDataSource;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-picker",
-	"version": "1.9.3",
+	"version": "1.10.0",
 	"sideEffects": false
 }

package/dist/es2019/analytics.codegen.js

@@ -3,7 +3,7 @@
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::e4f7029050ef6edde92cac3d9535cd4a>>
+ * @codegen <<SignedSource::e8a730530bb93e19d0b85114da0581c8>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
 function createEventPayload(eventKey, attributes) {

package/dist/es2019/common/analytics/context.js

@@ -7,6 +7,7 @@ const DEFAULT_CONTEXT_ATTRIBUTES = {
   linkState: 'newLink',
   linkFieldContent: null,
   linkFieldContentInputMethod: null,
+  linkFieldContentInputSource: null,
   displayTextFieldContent: null,
   displayTextFieldContentInputMethod: null
 };

package/dist/es2019/services/use-plugins/index.js

@@ -78,6 +78,7 @@ export function usePlugins(state, activeTab, plugins) {
     tabs,
     items,
     isLoading,
+    activePlugin,
     isActivePlugin: !!activePlugin,
     error,
     retry: handleRetry,

package/dist/es2019/ui/error-boundary/index.js

@@ -0,0 +1,62 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React, { Component } from 'react';
+import { withAnalyticsEvents } from '@atlaskit/analytics-next';
+import createEventPayload from '../../analytics.codegen';
+// eslint-disable-next-line @repo/internal/react/no-class-components
+export class BaseErrorBoundary extends Component {
+  constructor(props) {
+    super(props);
+
+    _defineProperty(this, "fireAnalytics", analyticsErrorPayload => {
+      var _window, _window$navigator, _analyticsErrorPayloa, _analyticsErrorPayloa2;
+
+      const {
+        createAnalyticsEvent,
+        channel
+      } = this.props;
+      createAnalyticsEvent(createEventPayload('ui.linkPicker.unhandledErrorCaught', {
+        browserInfo: ((_window = window) === null || _window === void 0 ? void 0 : (_window$navigator = _window.navigator) === null || _window$navigator === void 0 ? void 0 : _window$navigator.userAgent) || 'unknown',
+        error: analyticsErrorPayload.error.toString(),
+        componentStack: (_analyticsErrorPayloa = (_analyticsErrorPayloa2 = analyticsErrorPayload.info) === null || _analyticsErrorPayloa2 === void 0 ? void 0 : _analyticsErrorPayloa2.componentStack) !== null && _analyticsErrorPayloa !== void 0 ? _analyticsErrorPayloa : ''
+      })).fire(channel);
+    });
+
+    this.state = {
+      hasError: false
+    };
+  }
+
+  componentDidCatch(error, info) {
+    const {
+      onError
+    } = this.props;
+    const payload = {
+      error,
+      info
+    };
+    this.fireAnalytics(payload);
+    onError && onError(error, info);
+    this.setState({
+      hasError: true
+    });
+  }
+
+  render() {
+    const {
+      children,
+      ErrorComponent
+    } = this.props;
+    const {
+      hasError
+    } = this.state;
+
+    if (hasError && ErrorComponent) {
+      return /*#__PURE__*/React.createElement(ErrorComponent, null);
+    }
+
+    return children;
+  }
+
+}
+const ErrorBoundary = withAnalyticsEvents()(BaseErrorBoundary);
+export default ErrorBoundary;

package/dist/es2019/ui/index.js

@@ -1,8 +1,9 @@
 import React, { memo } from 'react';
-import { AnalyticsErrorBoundary } from '@atlaskit/analytics-next';
 import { LazySuspense, lazyForPaint } from 'react-loosely-lazy';
+import { AnalyticsContext } from '@atlaskit/analytics-next';
 import { COMPONENT_NAME, ANALYTICS_CHANNEL } from '../common/constants';
 import { name as packageName, version as packageVersion } from '../version.json';
+import ErrorBoundary from './error-boundary';
 import { ErrorBoundaryFallback } from './error-boundary-fallback';
 import { LoaderFallback } from './loader-fallback';
 export const PACKAGE_DATA = {
@@ -14,10 +15,11 @@ export const PACKAGE_DATA = {
 const LazyLinkPicker = lazyForPaint(() => import(
 /* webpackChunkName: "@atlaskit-internal_link-picker" */
 './link-picker'));
-export const ComposedLinkPicker = /*#__PURE__*/memo(props => /*#__PURE__*/React.createElement(AnalyticsErrorBoundary, {
+export const ComposedLinkPicker = /*#__PURE__*/memo(props => /*#__PURE__*/React.createElement(AnalyticsContext, {
+  data: PACKAGE_DATA
+}, /*#__PURE__*/React.createElement(ErrorBoundary, {
   channel: ANALYTICS_CHANNEL,
-  data: PACKAGE_DATA,
   ErrorComponent: ErrorBoundaryFallback
 }, /*#__PURE__*/React.createElement(LazySuspense, {
   fallback: LoaderFallback
-}, /*#__PURE__*/React.createElement(LazyLinkPicker, props))));
+}, /*#__PURE__*/React.createElement(LazyLinkPicker, props)))));

package/dist/es2019/ui/link-picker/index.js

@@ -24,6 +24,7 @@ import { transformTimeStamp } from './transformTimeStamp';
 import LinkSearchList, { testIds as listTestIds } from './link-search-list';
 import LinkSearchError, { testIds as searchErrorTestIds } from './link-search-error';
 import FormFooter, { testIds as formFooterTestIds } from './form-footer';
+import { getDataSource } from './utils';
 export const RECENT_SEARCH_LIST_SIZE = 5;
 export const CONTACT_SUPPORT_LINK = 'https://support.atlassian.com/contact/';
 export const testIds = {
@@ -110,6 +111,7 @@ function LinkPicker({
     items,
     isLoading,
     isActivePlugin,
+    activePlugin,
     tabs,
     error,
     retry,
@@ -139,10 +141,12 @@ function LinkPicker({
     }
   }, [onContentResize, items, isLoading, isActivePlugin, tabs]);
   const handleChangeUrl = useCallback(e => {
+    /** Any on change event is triggered by manual input or paste, so source is null */
+    trackAttribute('linkFieldContentInputSource', null);
     dispatch({
       url: e.currentTarget.value
     });
-  }, []);
+  }, [trackAttribute]);
   const handleChangeText = useCallback(e => {
     dispatch({
       displayText: e.currentTarget.value
@@ -175,25 +179,32 @@ function LinkPicker({
         break;
     }
 
-    if ([KEY_CODE_ARROW_DOWN, KEY_CODE_ARROW_UP].includes(keyCode) && items[updatedIndex]) {
+    const item = items[updatedIndex];
+
+    if ([KEY_CODE_ARROW_DOWN, KEY_CODE_ARROW_UP].includes(keyCode) && item) {
       /**
        * Manually track that the url has been updated using searchResult method
        */
-      trackAttribute('linkFieldContent', getLinkFieldContent(items[updatedIndex].url));
+      trackAttribute('linkFieldContent', getLinkFieldContent(item.url));
       trackAttribute('linkFieldContentInputMethod', 'searchResult');
+      trackAttribute('linkFieldContentInputSource', getDataSource(item, activePlugin));
       dispatch({
         activeIndex: updatedIndex,
         selectedIndex: updatedIndex,
-        url: items[updatedIndex].url,
+        url: item.url,
         invalidUrl: false
       });
     }
-  }, [activeIndex, items, trackAttribute]);
+  }, [activeIndex, items, trackAttribute, activePlugin]);
   const handleClear = useCallback(field => {
     dispatch({
       [field]: ''
     });
   }, []);
+  const handleUrlClear = useCallback(() => {
+    trackAttribute('linkFieldContentInputSource', null);
+    handleClear('url');
+  }, [trackAttribute, handleClear]);
   const handleMouseEnterResultItem = useCallback(objectId => {
     const index = items === null || items === void 0 ? void 0 : items.findIndex(item => item.objectId === objectId);
     dispatch({
@@ -241,16 +252,17 @@ function LinkPicker({
         url,
         name
       } = selectedItem;
-      dispatchEvent(new Event('submit'));
       /**
        * Manually track that the url has been updated using searchResult method
        */
 
+      dispatchEvent(new Event('submit'));
       trackAttribute('linkFieldContent', getLinkFieldContent(url));
       trackAttribute('linkFieldContentInputMethod', 'searchResult');
+      trackAttribute('linkFieldContentInputSource', getDataSource(selectedItem, activePlugin));
       handleInsert(url, name, 'typeAhead');
     }
-  }, [handleInsert, trackAttribute, items]);
+  }, [handleInsert, trackAttribute, items, activePlugin]);
   const handleSubmit = useCallback(event => {
     event.preventDefault();
 
@@ -311,7 +323,7 @@ function LinkPicker({
     "aria-activedescendant": ariaActiveDescendant,
     "aria-describedby": screenReaderDescriptionId,
     error: invalidUrl ? intl.formatMessage(messages.linkInvalid) : null,
-    onClear: handleClear,
+    onClear: handleUrlClear,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
   }), jsx(DisplayTextInputField, {

package/dist/es2019/ui/link-picker/utils.js

@@ -10,4 +10,13 @@ export const isRedoEvent = e => {
   return (// ctrl + y for non-mac
     !browser.mac && e.ctrlKey && e.keyCode === KeyYCode || browser.mac && e.metaKey && e.shiftKey && e.keyCode === KeyZCode || e.ctrlKey && e.shiftKey && e.keyCode === KeyZCode
   );
+};
+/**
+ * Retrieve the data source for a link given the item and the plugin that resolved it
+ */
+
+export const getDataSource = (item, plugin) => {
+  var _ref, _item$meta$source, _item$meta, _plugin$meta;
+
+  return (_ref = (_item$meta$source = (_item$meta = item.meta) === null || _item$meta === void 0 ? void 0 : _item$meta.source) !== null && _item$meta$source !== void 0 ? _item$meta$source : plugin === null || plugin === void 0 ? void 0 : (_plugin$meta = plugin.meta) === null || _plugin$meta === void 0 ? void 0 : _plugin$meta.source) !== null && _ref !== void 0 ? _ref : 'unknown';
 };

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-picker",
-	"version": "1.9.3",
+	"version": "1.10.0",
 	"sideEffects": false
 }

package/dist/esm/analytics.codegen.js

@@ -3,7 +3,7 @@
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::e4f7029050ef6edde92cac3d9535cd4a>>
+ * @codegen <<SignedSource::e8a730530bb93e19d0b85114da0581c8>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
 function createEventPayload(eventKey, attributes) {

package/dist/esm/common/analytics/context.js

@@ -14,6 +14,7 @@ var DEFAULT_CONTEXT_ATTRIBUTES = {
   linkState: 'newLink',
   linkFieldContent: null,
   linkFieldContentInputMethod: null,
+  linkFieldContentInputSource: null,
   displayTextFieldContent: null,
   displayTextFieldContentInputMethod: null
 };

package/dist/esm/services/use-plugins/index.js

@@ -128,6 +128,7 @@ export function usePlugins(state, activeTab, plugins) {
     tabs: tabs,
     items: items,
     isLoading: isLoading,
+    activePlugin: activePlugin,
     isActivePlugin: !!activePlugin,
     error: error,
     retry: handleRetry,

package/dist/esm/ui/error-boundary/index.js

@@ -0,0 +1,81 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+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, { Component } from 'react';
+import { withAnalyticsEvents } from '@atlaskit/analytics-next';
+import createEventPayload from '../../analytics.codegen';
+// eslint-disable-next-line @repo/internal/react/no-class-components
+export var BaseErrorBoundary = /*#__PURE__*/function (_Component) {
+  _inherits(BaseErrorBoundary, _Component);
+
+  var _super = _createSuper(BaseErrorBoundary);
+
+  function BaseErrorBoundary(props) {
+    var _this;
+
+    _classCallCheck(this, BaseErrorBoundary);
+
+    _this = _super.call(this, props);
+
+    _defineProperty(_assertThisInitialized(_this), "fireAnalytics", function (analyticsErrorPayload) {
+      var _window, _window$navigator, _analyticsErrorPayloa, _analyticsErrorPayloa2;
+
+      var _this$props = _this.props,
+          createAnalyticsEvent = _this$props.createAnalyticsEvent,
+          channel = _this$props.channel;
+      createAnalyticsEvent(createEventPayload('ui.linkPicker.unhandledErrorCaught', {
+        browserInfo: ((_window = window) === null || _window === void 0 ? void 0 : (_window$navigator = _window.navigator) === null || _window$navigator === void 0 ? void 0 : _window$navigator.userAgent) || 'unknown',
+        error: analyticsErrorPayload.error.toString(),
+        componentStack: (_analyticsErrorPayloa = (_analyticsErrorPayloa2 = analyticsErrorPayload.info) === null || _analyticsErrorPayloa2 === void 0 ? void 0 : _analyticsErrorPayloa2.componentStack) !== null && _analyticsErrorPayloa !== void 0 ? _analyticsErrorPayloa : ''
+      })).fire(channel);
+    });
+
+    _this.state = {
+      hasError: false
+    };
+    return _this;
+  }
+
+  _createClass(BaseErrorBoundary, [{
+    key: "componentDidCatch",
+    value: function componentDidCatch(error, info) {
+      var onError = this.props.onError;
+      var payload = {
+        error: error,
+        info: info
+      };
+      this.fireAnalytics(payload);
+      onError && onError(error, info);
+      this.setState({
+        hasError: true
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+          children = _this$props2.children,
+          ErrorComponent = _this$props2.ErrorComponent;
+      var hasError = this.state.hasError;
+
+      if (hasError && ErrorComponent) {
+        return /*#__PURE__*/React.createElement(ErrorComponent, null);
+      }
+
+      return children;
+    }
+  }]);
+
+  return BaseErrorBoundary;
+}(Component);
+var ErrorBoundary = withAnalyticsEvents()(BaseErrorBoundary);
+export default ErrorBoundary;

package/dist/esm/ui/index.js

@@ -1,8 +1,9 @@
 import React, { memo } from 'react';
-import { AnalyticsErrorBoundary } from '@atlaskit/analytics-next';
 import { LazySuspense, lazyForPaint } from 'react-loosely-lazy';
+import { AnalyticsContext } from '@atlaskit/analytics-next';
 import { COMPONENT_NAME, ANALYTICS_CHANNEL } from '../common/constants';
 import { name as packageName, version as packageVersion } from '../version.json';
+import ErrorBoundary from './error-boundary';
 import { ErrorBoundaryFallback } from './error-boundary-fallback';
 import { LoaderFallback } from './loader-fallback';
 export var PACKAGE_DATA = {
@@ -17,11 +18,12 @@ var LazyLinkPicker = lazyForPaint(function () {
   './link-picker');
 });
 export var ComposedLinkPicker = /*#__PURE__*/memo(function (props) {
-  return /*#__PURE__*/React.createElement(AnalyticsErrorBoundary, {
+  return /*#__PURE__*/React.createElement(AnalyticsContext, {
+    data: PACKAGE_DATA
+  }, /*#__PURE__*/React.createElement(ErrorBoundary, {
     channel: ANALYTICS_CHANNEL,
-    data: PACKAGE_DATA,
     ErrorComponent: ErrorBoundaryFallback
   }, /*#__PURE__*/React.createElement(LazySuspense, {
     fallback: LoaderFallback
-  }, /*#__PURE__*/React.createElement(LazyLinkPicker, props)));
+  }, /*#__PURE__*/React.createElement(LazyLinkPicker, props))));
 });

package/dist/esm/ui/link-picker/index.js

@@ -30,6 +30,7 @@ import { transformTimeStamp } from './transformTimeStamp';
 import LinkSearchList, { testIds as listTestIds } from './link-search-list';
 import LinkSearchError, { testIds as searchErrorTestIds } from './link-search-error';
 import FormFooter, { testIds as formFooterTestIds } from './form-footer';
+import { getDataSource } from './utils';
 export var RECENT_SEARCH_LIST_SIZE = 5;
 export var CONTACT_SUPPORT_LINK = 'https://support.atlassian.com/contact/';
 export var testIds = _objectSpread(_objectSpread(_objectSpread(_objectSpread({
@@ -116,6 +117,7 @@ function LinkPicker(_ref) {
       items = _usePlugins.items,
       isLoading = _usePlugins.isLoading,
       isActivePlugin = _usePlugins.isActivePlugin,
+      activePlugin = _usePlugins.activePlugin,
       tabs = _usePlugins.tabs,
       error = _usePlugins.error,
       retry = _usePlugins.retry,
@@ -146,10 +148,12 @@ function LinkPicker(_ref) {
     }
   }, [onContentResize, items, isLoading, isActivePlugin, tabs]);
   var handleChangeUrl = useCallback(function (e) {
+    /** Any on change event is triggered by manual input or paste, so source is null */
+    trackAttribute('linkFieldContentInputSource', null);
     dispatch({
       url: e.currentTarget.value
     });
-  }, []);
+  }, [trackAttribute]);
   var handleChangeText = useCallback(function (e) {
     dispatch({
       displayText: e.currentTarget.value
@@ -180,23 +184,30 @@ function LinkPicker(_ref) {
         break;
     }
 
-    if ([KEY_CODE_ARROW_DOWN, KEY_CODE_ARROW_UP].includes(keyCode) && items[updatedIndex]) {
+    var item = items[updatedIndex];
+
+    if ([KEY_CODE_ARROW_DOWN, KEY_CODE_ARROW_UP].includes(keyCode) && item) {
       /**
        * Manually track that the url has been updated using searchResult method
        */
-      trackAttribute('linkFieldContent', getLinkFieldContent(items[updatedIndex].url));
+      trackAttribute('linkFieldContent', getLinkFieldContent(item.url));
       trackAttribute('linkFieldContentInputMethod', 'searchResult');
+      trackAttribute('linkFieldContentInputSource', getDataSource(item, activePlugin));
       dispatch({
         activeIndex: updatedIndex,
         selectedIndex: updatedIndex,
-        url: items[updatedIndex].url,
+        url: item.url,
         invalidUrl: false
       });
     }
-  }, [activeIndex, items, trackAttribute]);
+  }, [activeIndex, items, trackAttribute, activePlugin]);
   var handleClear = useCallback(function (field) {
     dispatch(_defineProperty({}, field, ''));
   }, []);
+  var handleUrlClear = useCallback(function () {
+    trackAttribute('linkFieldContentInputSource', null);
+    handleClear('url');
+  }, [trackAttribute, handleClear]);
   var handleMouseEnterResultItem = useCallback(function (objectId) {
     var index = items === null || items === void 0 ? void 0 : items.findIndex(function (item) {
       return item.objectId === objectId;
@@ -247,16 +258,17 @@ function LinkPicker(_ref) {
     if (selectedItem) {
       var _url = selectedItem.url,
           name = selectedItem.name;
-      dispatchEvent(new Event('submit'));
       /**
        * Manually track that the url has been updated using searchResult method
        */
 
+      dispatchEvent(new Event('submit'));
       trackAttribute('linkFieldContent', getLinkFieldContent(_url));
       trackAttribute('linkFieldContentInputMethod', 'searchResult');
+      trackAttribute('linkFieldContentInputSource', getDataSource(selectedItem, activePlugin));
       handleInsert(_url, name, 'typeAhead');
     }
-  }, [handleInsert, trackAttribute, items]);
+  }, [handleInsert, trackAttribute, items, activePlugin]);
   var handleSubmit = useCallback(function (event) {
     event.preventDefault();
 
@@ -317,7 +329,7 @@ function LinkPicker(_ref) {
     "aria-activedescendant": ariaActiveDescendant,
     "aria-describedby": screenReaderDescriptionId,
     error: invalidUrl ? intl.formatMessage(messages.linkInvalid) : null,
-    onClear: handleClear,
+    onClear: handleUrlClear,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
   }), jsx(DisplayTextInputField, {

package/dist/esm/ui/link-picker/utils.js

@@ -10,4 +10,13 @@ export var isRedoEvent = function isRedoEvent(e) {
   return (// ctrl + y for non-mac
     !browser.mac && e.ctrlKey && e.keyCode === KeyYCode || browser.mac && e.metaKey && e.shiftKey && e.keyCode === KeyZCode || e.ctrlKey && e.shiftKey && e.keyCode === KeyZCode
   );
+};
+/**
+ * Retrieve the data source for a link given the item and the plugin that resolved it
+ */
+
+export var getDataSource = function getDataSource(item, plugin) {
+  var _ref, _item$meta$source, _item$meta, _plugin$meta;
+
+  return (_ref = (_item$meta$source = (_item$meta = item.meta) === null || _item$meta === void 0 ? void 0 : _item$meta.source) !== null && _item$meta$source !== void 0 ? _item$meta$source : plugin === null || plugin === void 0 ? void 0 : (_plugin$meta = plugin.meta) === null || _plugin$meta === void 0 ? void 0 : _plugin$meta.source) !== null && _ref !== void 0 ? _ref : 'unknown';
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-picker",
-	"version": "1.9.3",
+	"version": "1.10.0",
 	"sideEffects": false
 }

package/dist/types/analytics.codegen.d.ts

@@ -3,13 +3,20 @@
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::e4f7029050ef6edde92cac3d9535cd4a>>
+ * @codegen <<SignedSource::e8a730530bb93e19d0b85114da0581c8>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
+export declare type PackageMetaDataType = {
+    packageName: '@atlaskit/link-picker';
+    packageVersion: string;
+    source: 'linkPicker';
+    componentName: 'linkPicker';
+};
 export declare type LinkPickerAnalyticsContextType = {
     linkState: 'editLink' | 'newLink';
     linkFieldContent: 'url' | 'text_string' | null;
     linkFieldContentInputMethod: 'manual' | 'paste' | 'searchResult' | null;
+    linkFieldContentInputSource: string | null;
     displayTextFieldContent: 'text_string' | null;
     displayTextFieldContentInputMethod: 'manual' | 'paste' | null;
 };
@@ -18,12 +25,18 @@ export declare type InlineDialogViewedLinkPickerAttributesType = {};
 export declare type InlineDialogClosedLinkPickerAttributesType = {};
 export declare type TextFieldUpdatedLinkFieldAttributesType = {};
 export declare type TextFieldUpdatedDisplayTextFieldAttributesType = {};
+export declare type LinkPickerUnhandledErrorCaughtAttributesType = {
+    browserInfo: string;
+    error: string;
+    componentStack: string | null;
+};
 declare type AnalyticsEventAttributes = {
     'ui.form.submitted.linkPicker': FormSubmittedLinkPickerAttributesType;
     'ui.inlineDialog.viewed.linkPicker': InlineDialogViewedLinkPickerAttributesType;
     'ui.inlineDialog.closed.linkPicker': InlineDialogClosedLinkPickerAttributesType;
     'ui.textField.updated.linkField': TextFieldUpdatedLinkFieldAttributesType;
     'ui.textField.updated.displayTextField': TextFieldUpdatedDisplayTextFieldAttributesType;
+    'ui.linkPicker.unhandledErrorCaught': LinkPickerUnhandledErrorCaughtAttributesType;
 };
 declare function createEventPayload<K extends keyof AnalyticsEventAttributes>(eventKey: K, attributes: AnalyticsEventAttributes[K]): {
     eventType: string;

package/dist/types/services/use-plugins/index.d.ts

@@ -3,6 +3,7 @@ export interface LinkPickerPluginsService {
     items: LinkSearchListItemData[] | null;
     isLoading: boolean;
     isActivePlugin: boolean;
+    activePlugin?: LinkPickerPlugin;
     tabs: {
         tabTitle: string;
     }[];

package/dist/types/ui/error-boundary/index.d.ts

@@ -0,0 +1,27 @@
+import React, { Component, ReactNode } from 'react';
+import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+declare type ErrorBoundaryErrorInfo = {
+    componentStack: string;
+};
+export interface ErrorBoundaryProps extends WithAnalyticsEventsProps {
+    children: ReactNode;
+    channel: string;
+    ErrorComponent?: React.ComponentType;
+    onError?: (error: Error, info?: ErrorBoundaryErrorInfo) => void;
+}
+declare type ErrorBoundaryPayload = {
+    error: Error | string;
+    info?: ErrorBoundaryErrorInfo;
+    [key: string]: any;
+};
+declare type ErrorBoundaryState = {
+    hasError: boolean;
+};
+export declare class BaseErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps);
+    fireAnalytics: (analyticsErrorPayload: ErrorBoundaryPayload) => void;
+    componentDidCatch(error: Error, info?: ErrorBoundaryErrorInfo): void;
+    render(): React.ReactNode;
+}
+declare const ErrorBoundary: React.ForwardRefExoticComponent<Omit<ErrorBoundaryProps, keyof WithAnalyticsEventsProps> & React.RefAttributes<any>>;
+export default ErrorBoundary;

package/dist/types/ui/index.d.ts

@@ -1,9 +1,5 @@
 import React from 'react';
+import { PackageMetaDataType } from '../analytics.codegen';
 import { LinkPickerProps } from './link-picker';
-export declare const PACKAGE_DATA: {
-    packageName: any;
-    packageVersion: any;
-    componentName: string;
-    source: string;
-};
+export declare const PACKAGE_DATA: PackageMetaDataType;
 export declare const ComposedLinkPicker: React.MemoExoticComponent<(props: LinkPickerProps) => JSX.Element>;

package/dist/types/ui/link-picker/utils.d.ts

@@ -1,3 +1,8 @@
 import { KeyboardEvent } from 'react';
+import { LinkPickerPlugin, LinkSearchListItemData } from '../types';
 export declare const isUndoEvent: (e: KeyboardEvent<HTMLInputElement>) => boolean;
 export declare const isRedoEvent: (e: KeyboardEvent<HTMLInputElement>) => boolean;
+/**
+ * Retrieve the data source for a link given the item and the plugin that resolved it
+ */
+export declare const getDataSource: (item: LinkSearchListItemData, plugin?: LinkPickerPlugin | undefined) => string;

package/dist/types/ui/types.d.ts

@@ -22,6 +22,11 @@ export interface LinkSearchListItemData {
     lastUpdatedDate?: Date;
     /** Whether the result is pre-fetched from activity provider */
     prefetch?: boolean;
+    /** Metadata about the result */
+    meta?: {
+        /** The data source that provided the result */
+        source?: string;
+    };
 }
 export declare type ListItemTimeStamp = {
     pageAction: string;
@@ -43,5 +48,10 @@ export interface LinkPickerPlugin {
     tabTitle?: string;
     /** Render function to customise the UI that is displayed when an error occurs resolving results */
     errorFallback?: LinkPickerPluginErrorFallback;
+    /** Metadata about the plugin */
+    meta?: {
+        /** The data source that provides all results provided by the plugin */
+        source?: string;
+    };
 }
 export declare type LinkPickerPluginErrorFallback = (error: unknown, retry: () => void) => ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-picker",
-  "version": "1.9.3",
+  "version": "1.10.0",
   "description": "Standalone link picker",
   "author": "Atlassian Pty Ltd",
   "publishConfig": {
@@ -57,15 +57,15 @@
     "@atlaskit/activity-provider": "^2.3.2",
     "@atlaskit/docs": "*",
     "@atlaskit/link-analytics": "^1.1.0",
-    "@atlaskit/link-test-helpers": "^1.4.0",
+    "@atlaskit/link-test-helpers": "^1.5.0",
     "@atlaskit/popup": "^1.4.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/toggle": "^12.5.0",
     "@atlaskit/visual-regression": "*",
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
-    "@atlassian/link-picker-atlassian-plugin": "^19.0.0",
-    "@atlassian/link-picker-plugins": "^6.0.0",
+    "@atlassian/link-picker-atlassian-plugin": "^20.0.0",
+    "@atlassian/link-picker-plugins": "^7.0.0",
     "@atlassian/recent-work-client": "^1.6.0",
     "@atlassian/search-provider": "^2.3.0",
     "@testing-library/dom": "^8.17.1",

package/report.api.md

@@ -28,6 +28,11 @@ export declare interface LinkPickerPlugin {
   tabTitle?: string;
   /** Render function to customise the UI that is displayed when an error occurs resolving results */
   errorFallback?: LinkPickerPluginErrorFallback;
+  /** Metadata about the plugin */
+  meta?: {
+    /** The data source that provides all results provided by the plugin */
+    source?: string;
+  };
 }
 
 export declare type LinkPickerPluginErrorFallback = (
@@ -83,6 +88,11 @@ export declare interface LinkSearchListItemData {
   lastUpdatedDate?: Date;
   /** Whether the result is pre-fetched from activity provider */
   prefetch?: boolean;
+  /** Metadata about the result */
+  meta?: {
+    /** The data source that provided the result */
+    source?: string;
+  };
 }
 
 declare interface Meta {