@atlaskit/link-picker 1.7.1 → 1.8.2

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/link-picker
 
+## 1.8.2
+
+### Patch Changes
+
+- [`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) - Upgrade Typescript from `4.2.4` to `4.3.5`.
+
+## 1.8.1
+
+### Patch Changes
+
+- [`afd2368145a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/afd2368145a) - Added link picker mount/unmount analytic events
+
+## 1.8.0
+
+### Minor Changes
+
+- [`89fffde2a59`](https://bitbucket.org/atlassian/atlassian-frontend/commits/89fffde2a59) - Wrap link picker in native form element
+
 ## 1.7.1
 
 ### Patch Changes

package/dist/cjs/analytics.codegen.js

@@ -10,16 +10,16 @@ exports.default = void 0;
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::0cc1b4d9c22b31491ded3e581114ab2c>>
+ * @codegen <<SignedSource::ffa7ec78cc793f941d06cdb25b07dc8a>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
 function createEventPayload(eventKey, attributes) {
   var event = eventKey.split('.');
   return {
-    eventType: 'ui',
-    actionSubject: event[0],
-    action: event[1],
-    actionSubjectId: event[2],
+    eventType: event[0],
+    actionSubject: event[1],
+    action: event[2],
+    actionSubjectId: event[3],
     attributes: attributes
   };
 }

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

@@ -154,6 +154,16 @@ function LinkPicker(_ref) {
   var isEditing = !!initUrl;
   var selectedItem = items === null || items === void 0 ? void 0 : items[selectedIndex];
   var isSelectedItem = (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.url) === url;
+  (0, _react.useEffect)(function () {
+    // Anything in here is fired on component mount.
+    var event = createAnalyticsEvent((0, _analytics.default)('ui.inlineDialog.viewed.linkPicker', {}));
+    event.fire(_constants.ANALYTICS_CHANNEL);
+    return function () {
+      // Anything in here is fired on component unmount.
+      var event = createAnalyticsEvent((0, _analytics.default)('ui.inlineDialog.closed.linkPicker', {}));
+      event.fire(_constants.ANALYTICS_CHANNEL);
+    };
+  }, [createAnalyticsEvent]);
   (0, _react.useLayoutEffect)(function () {
     if (onContentResize) {
       onContentResize();
@@ -226,7 +236,7 @@ function LinkPicker(_ref) {
     }
   }, [activeIndex, items]);
   var handleInsert = (0, _react.useCallback)(function (url, title, inputType) {
-    var event = createAnalyticsEvent((0, _analytics.default)('form.submitted.linkPicker', {}));
+    var event = createAnalyticsEvent((0, _analytics.default)('ui.form.submitted.linkPicker', {}));
     event.fire(_constants.ANALYTICS_CHANNEL);
     onSubmit(_objectSpread({
       url: url,
@@ -247,10 +257,13 @@ function LinkPicker(_ref) {
     if (selectedItem) {
       var _url = selectedItem.url,
           name = selectedItem.name;
+      dispatchEvent(new Event('submit'));
       handleInsert(_url, name, 'typeAhead');
     }
   }, [handleInsert, items]);
-  var handleSubmit = (0, _react.useCallback)(function () {
+  var handleSubmit = (0, _react.useCallback)(function (event) {
+    event.preventDefault();
+
     if (isSelectedItem && selectedItem) {
       return handleInsert(selectedItem.url, selectedItem.name, 'typeAhead');
     }
@@ -283,9 +296,10 @@ function LinkPicker(_ref) {
     size: "medium",
     label: ''
   }));
-  return (0, _react2.jsx)("div", {
+  return (0, _react2.jsx)("form", {
     "data-testid": testIds.linkPicker,
-    css: _styled.rootContainerStyles
+    css: _styled.rootContainerStyles,
+    onSubmit: handleSubmit
   }, screenReaderText && (0, _react2.jsx)(_announcer.default, {
     ariaLive: "assertive",
     text: screenReaderText,
@@ -311,7 +325,6 @@ function LinkPicker(_ref) {
     "aria-describedby": screenReaderDescriptionId,
     error: invalidUrl ? intl.formatMessage(_messages.messages.linkInvalid) : null,
     onClear: handleClear,
-    onSubmit: handleSubmit,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
   }), (0, _react2.jsx)(_textInput.default, {
@@ -324,7 +337,6 @@ function LinkPicker(_ref) {
     clearLabel: intl.formatMessage(_messages.messages.clearText),
     "aria-label": intl.formatMessage(_messages.messages.linkAriaLabel),
     onClear: handleClear,
-    onSubmit: handleSubmit,
     onKeyDown: handleKeyDown,
     onChange: handleChangeText
   }), queryState && (0, _react2.jsx)(_react.Fragment, null, tabs.length > 0 && (0, _react2.jsx)("div", {
@@ -398,7 +410,6 @@ function LinkPicker(_ref) {
   }, intl.formatMessage(_messages.messages.cancelButton)), (0, _react2.jsx)(_button.default, {
     type: "submit",
     appearance: "primary",
-    onClick: handleSubmit,
     testId: testIds.insertButton
   }, intl.formatMessage(insertButtonMsg)))));
 }

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

@@ -29,13 +29,12 @@ var _styled = require("./styled");
 
 var _ = require("../");
 
-var _excluded = ["name", "label", "autoFocus", "onSubmit", "onRedo", "onUndo", "onChange", "onKeyDown", "onClear", "clearLabel", "error"];
+var _excluded = ["name", "label", "autoFocus", "onRedo", "onUndo", "onChange", "onKeyDown", "onClear", "clearLabel", "error"];
 
 var PanelTextInput = function PanelTextInput(props) {
   var name = props.name,
       label = props.label,
       autoFocus = props.autoFocus,
-      onSubmit = props.onSubmit,
       onRedo = props.onRedo,
       onUndo = props.onUndo,
       onChange = props.onChange,
@@ -61,13 +60,7 @@ var PanelTextInput = function PanelTextInput(props) {
     onChange(e.currentTarget.value);
   }, [onChange]);
   var handleKeydown = (0, _react.useCallback)(function (e) {
-    var value = e.currentTarget.value;
-
-    if (e.keyCode === 13 && onSubmit) {
-      e.preventDefault(); // Prevent from submitting if an editor is inside a form.
-
-      onSubmit(value);
-    } else if (typeof onUndo === 'function' && (0, _utils.isUndoEvent)(e)) {
+    if (typeof onUndo === 'function' && (0, _utils.isUndoEvent)(e)) {
       e.preventDefault();
       onUndo();
     } else if (typeof onRedo === 'function' && (0, _utils.isRedoEvent)(e)) {
@@ -78,7 +71,7 @@ var PanelTextInput = function PanelTextInput(props) {
     if (onKeyDown) {
       onKeyDown(e);
     }
-  }, [onSubmit, onUndo, onRedo, onKeyDown]);
+  }, [onUndo, onRedo, onKeyDown]);
   var handleClear = (0, _react.useCallback)(function () {
     if (inputRef.current && onClear) {
       inputRef.current.focus();
@@ -88,6 +81,7 @@ var PanelTextInput = function PanelTextInput(props) {
   var clearText = restProps.value !== '' && (0, _react2.jsx)(_tooltip.default, {
     content: clearLabel
   }, (0, _react2.jsx)("button", {
+    type: "button",
     css: _styled.clearTextButtonStyles,
     onClick: handleClear,
     "data-testid": _.testIds.clearUrlButton

package/dist/cjs/version.json

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

package/dist/es2019/analytics.codegen.js

@@ -3,16 +3,16 @@
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::0cc1b4d9c22b31491ded3e581114ab2c>>
+ * @codegen <<SignedSource::ffa7ec78cc793f941d06cdb25b07dc8a>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
 function createEventPayload(eventKey, attributes) {
   const event = eventKey.split('.');
   return {
-    eventType: 'ui',
-    actionSubject: event[0],
-    action: event[1],
-    actionSubjectId: event[2],
+    eventType: event[0],
+    actionSubject: event[1],
+    action: event[2],
+    actionSubjectId: event[3],
     attributes: attributes
   };
 }

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

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 
 /** @jsx jsx */
-import { Fragment, useCallback, useLayoutEffect, useReducer } from 'react';
+import { Fragment, useCallback, useEffect, useLayoutEffect, useReducer } from 'react';
 import { jsx } from '@emotion/react';
 import { useIntl, FormattedMessage } from 'react-intl-next';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -106,6 +106,16 @@ function LinkPicker({
   const isEditing = !!initUrl;
   const selectedItem = items === null || items === void 0 ? void 0 : items[selectedIndex];
   const isSelectedItem = (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.url) === url;
+  useEffect(() => {
+    // Anything in here is fired on component mount.
+    const event = createAnalyticsEvent(createEventPayload('ui.inlineDialog.viewed.linkPicker', {}));
+    event.fire(ANALYTICS_CHANNEL);
+    return () => {
+      // Anything in here is fired on component unmount.
+      const event = createAnalyticsEvent(createEventPayload('ui.inlineDialog.closed.linkPicker', {}));
+      event.fire(ANALYTICS_CHANNEL);
+    };
+  }, [createAnalyticsEvent]);
   useLayoutEffect(() => {
     if (onContentResize) {
       onContentResize();
@@ -178,7 +188,7 @@ function LinkPicker({
     }
   }, [activeIndex, items]);
   const handleInsert = useCallback((url, title, inputType) => {
-    const event = createAnalyticsEvent(createEventPayload('form.submitted.linkPicker', {}));
+    const event = createAnalyticsEvent(createEventPayload('ui.form.submitted.linkPicker', {}));
     event.fire(ANALYTICS_CHANNEL);
     onSubmit({
       url,
@@ -200,10 +210,13 @@ function LinkPicker({
         url,
         name
       } = selectedItem;
+      dispatchEvent(new Event('submit'));
       handleInsert(url, name, 'typeAhead');
     }
   }, [handleInsert, items]);
-  const handleSubmit = useCallback(() => {
+  const handleSubmit = useCallback(event => {
+    event.preventDefault();
+
     if (isSelectedItem && selectedItem) {
       return handleInsert(selectedItem.url, selectedItem.name, 'typeAhead');
     }
@@ -236,9 +249,10 @@ function LinkPicker({
     size: "medium",
     label: ''
   }));
-  return jsx("div", {
+  return jsx("form", {
     "data-testid": testIds.linkPicker,
-    css: rootContainerStyles
+    css: rootContainerStyles,
+    onSubmit: handleSubmit
   }, screenReaderText && jsx(Announcer, {
     ariaLive: "assertive",
     text: screenReaderText,
@@ -264,7 +278,6 @@ function LinkPicker({
     "aria-describedby": screenReaderDescriptionId,
     error: invalidUrl ? intl.formatMessage(messages.linkInvalid) : null,
     onClear: handleClear,
-    onSubmit: handleSubmit,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
   }), jsx(PanelTextInput, {
@@ -277,7 +290,6 @@ function LinkPicker({
     clearLabel: intl.formatMessage(messages.clearText),
     "aria-label": intl.formatMessage(messages.linkAriaLabel),
     onClear: handleClear,
-    onSubmit: handleSubmit,
     onKeyDown: handleKeyDown,
     onChange: handleChangeText
   }), queryState && jsx(Fragment, null, tabs.length > 0 && jsx("div", {
@@ -345,7 +357,6 @@ function LinkPicker({
   }, intl.formatMessage(messages.cancelButton)), jsx(Button, {
     type: "submit",
     appearance: "primary",
-    onClick: handleSubmit,
     testId: testIds.insertButton
   }, intl.formatMessage(insertButtonMsg)))));
 }

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

@@ -16,7 +16,6 @@ const PanelTextInput = props => {
     name,
     label,
     autoFocus,
-    onSubmit,
     onRedo,
     onUndo,
     onChange,
@@ -43,13 +42,7 @@ const PanelTextInput = props => {
     onChange(e.currentTarget.value);
   }, [onChange]);
   const handleKeydown = useCallback(e => {
-    const value = e.currentTarget.value;
-
-    if (e.keyCode === 13 && onSubmit) {
-      e.preventDefault(); // Prevent from submitting if an editor is inside a form.
-
-      onSubmit(value);
-    } else if (typeof onUndo === 'function' && isUndoEvent(e)) {
+    if (typeof onUndo === 'function' && isUndoEvent(e)) {
       e.preventDefault();
       onUndo();
     } else if (typeof onRedo === 'function' && isRedoEvent(e)) {
@@ -60,7 +53,7 @@ const PanelTextInput = props => {
     if (onKeyDown) {
       onKeyDown(e);
     }
-  }, [onSubmit, onUndo, onRedo, onKeyDown]);
+  }, [onUndo, onRedo, onKeyDown]);
   const handleClear = useCallback(() => {
     if (inputRef.current && onClear) {
       inputRef.current.focus();
@@ -70,6 +63,7 @@ const PanelTextInput = props => {
   const clearText = restProps.value !== '' && jsx(Tooltip, {
     content: clearLabel
   }, jsx("button", {
+    type: "button",
     css: clearTextButtonStyles,
     onClick: handleClear,
     "data-testid": testIds.clearUrlButton

package/dist/es2019/version.json

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

package/dist/esm/analytics.codegen.js

@@ -3,16 +3,16 @@
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::0cc1b4d9c22b31491ded3e581114ab2c>>
+ * @codegen <<SignedSource::ffa7ec78cc793f941d06cdb25b07dc8a>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
 function createEventPayload(eventKey, attributes) {
   var event = eventKey.split('.');
   return {
-    eventType: 'ui',
-    actionSubject: event[0],
-    action: event[1],
-    actionSubjectId: event[2],
+    eventType: event[0],
+    actionSubject: event[1],
+    action: event[2],
+    actionSubjectId: event[3],
     attributes: attributes
   };
 }

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

@@ -7,7 +7,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 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; }
 
 /** @jsx jsx */
-import { Fragment, useCallback, useLayoutEffect, useReducer } from 'react';
+import { Fragment, useCallback, useEffect, useLayoutEffect, useReducer } from 'react';
 import { jsx } from '@emotion/react';
 import { useIntl, FormattedMessage } from 'react-intl-next';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -112,6 +112,16 @@ function LinkPicker(_ref) {
   var isEditing = !!initUrl;
   var selectedItem = items === null || items === void 0 ? void 0 : items[selectedIndex];
   var isSelectedItem = (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.url) === url;
+  useEffect(function () {
+    // Anything in here is fired on component mount.
+    var event = createAnalyticsEvent(createEventPayload('ui.inlineDialog.viewed.linkPicker', {}));
+    event.fire(ANALYTICS_CHANNEL);
+    return function () {
+      // Anything in here is fired on component unmount.
+      var event = createAnalyticsEvent(createEventPayload('ui.inlineDialog.closed.linkPicker', {}));
+      event.fire(ANALYTICS_CHANNEL);
+    };
+  }, [createAnalyticsEvent]);
   useLayoutEffect(function () {
     if (onContentResize) {
       onContentResize();
@@ -184,7 +194,7 @@ function LinkPicker(_ref) {
     }
   }, [activeIndex, items]);
   var handleInsert = useCallback(function (url, title, inputType) {
-    var event = createAnalyticsEvent(createEventPayload('form.submitted.linkPicker', {}));
+    var event = createAnalyticsEvent(createEventPayload('ui.form.submitted.linkPicker', {}));
     event.fire(ANALYTICS_CHANNEL);
     onSubmit(_objectSpread({
       url: url,
@@ -205,10 +215,13 @@ function LinkPicker(_ref) {
     if (selectedItem) {
       var _url = selectedItem.url,
           name = selectedItem.name;
+      dispatchEvent(new Event('submit'));
       handleInsert(_url, name, 'typeAhead');
     }
   }, [handleInsert, items]);
-  var handleSubmit = useCallback(function () {
+  var handleSubmit = useCallback(function (event) {
+    event.preventDefault();
+
     if (isSelectedItem && selectedItem) {
       return handleInsert(selectedItem.url, selectedItem.name, 'typeAhead');
     }
@@ -241,9 +254,10 @@ function LinkPicker(_ref) {
     size: "medium",
     label: ''
   }));
-  return jsx("div", {
+  return jsx("form", {
     "data-testid": testIds.linkPicker,
-    css: rootContainerStyles
+    css: rootContainerStyles,
+    onSubmit: handleSubmit
   }, screenReaderText && jsx(Announcer, {
     ariaLive: "assertive",
     text: screenReaderText,
@@ -269,7 +283,6 @@ function LinkPicker(_ref) {
     "aria-describedby": screenReaderDescriptionId,
     error: invalidUrl ? intl.formatMessage(messages.linkInvalid) : null,
     onClear: handleClear,
-    onSubmit: handleSubmit,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
   }), jsx(PanelTextInput, {
@@ -282,7 +295,6 @@ function LinkPicker(_ref) {
     clearLabel: intl.formatMessage(messages.clearText),
     "aria-label": intl.formatMessage(messages.linkAriaLabel),
     onClear: handleClear,
-    onSubmit: handleSubmit,
     onKeyDown: handleKeyDown,
     onChange: handleChangeText
   }), queryState && jsx(Fragment, null, tabs.length > 0 && jsx("div", {
@@ -356,7 +368,6 @@ function LinkPicker(_ref) {
   }, intl.formatMessage(messages.cancelButton)), jsx(Button, {
     type: "submit",
     appearance: "primary",
-    onClick: handleSubmit,
     testId: testIds.insertButton
   }, intl.formatMessage(insertButtonMsg)))));
 }

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

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["name", "label", "autoFocus", "onSubmit", "onRedo", "onUndo", "onChange", "onKeyDown", "onClear", "clearLabel", "error"];
+var _excluded = ["name", "label", "autoFocus", "onRedo", "onUndo", "onChange", "onKeyDown", "onClear", "clearLabel", "error"];
 
 /** @jsx jsx */
 import { useCallback, useRef, Fragment } from 'react';
@@ -17,7 +17,6 @@ var PanelTextInput = function PanelTextInput(props) {
   var name = props.name,
       label = props.label,
       autoFocus = props.autoFocus,
-      onSubmit = props.onSubmit,
       onRedo = props.onRedo,
       onUndo = props.onUndo,
       onChange = props.onChange,
@@ -44,13 +43,7 @@ var PanelTextInput = function PanelTextInput(props) {
     onChange(e.currentTarget.value);
   }, [onChange]);
   var handleKeydown = useCallback(function (e) {
-    var value = e.currentTarget.value;
-
-    if (e.keyCode === 13 && onSubmit) {
-      e.preventDefault(); // Prevent from submitting if an editor is inside a form.
-
-      onSubmit(value);
-    } else if (typeof onUndo === 'function' && isUndoEvent(e)) {
+    if (typeof onUndo === 'function' && isUndoEvent(e)) {
       e.preventDefault();
       onUndo();
     } else if (typeof onRedo === 'function' && isRedoEvent(e)) {
@@ -61,7 +54,7 @@ var PanelTextInput = function PanelTextInput(props) {
     if (onKeyDown) {
       onKeyDown(e);
     }
-  }, [onSubmit, onUndo, onRedo, onKeyDown]);
+  }, [onUndo, onRedo, onKeyDown]);
   var handleClear = useCallback(function () {
     if (inputRef.current && onClear) {
       inputRef.current.focus();
@@ -71,6 +64,7 @@ var PanelTextInput = function PanelTextInput(props) {
   var clearText = restProps.value !== '' && jsx(Tooltip, {
     content: clearLabel
   }, jsx("button", {
+    type: "button",
     css: clearTextButtonStyles,
     onClick: handleClear,
     "data-testid": testIds.clearUrlButton

package/dist/esm/version.json

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

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

@@ -3,12 +3,16 @@
  *
  * Generates analytics utilities from the package analytics spec yaml
  *
- * @codegen <<SignedSource::0cc1b4d9c22b31491ded3e581114ab2c>>
+ * @codegen <<SignedSource::ffa7ec78cc793f941d06cdb25b07dc8a>>
  * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
  */
 declare type FormSubmittedLinkPickerAttributesType = {};
+declare type InlineDialogViewedLinkPickerAttributesType = {};
+declare type InlineDialogClosedLinkPickerAttributesType = {};
 declare type AnalyticsEventAttributes = {
-    'form.submitted.linkPicker': FormSubmittedLinkPickerAttributesType;
+    'ui.form.submitted.linkPicker': FormSubmittedLinkPickerAttributesType;
+    'ui.inlineDialog.viewed.linkPicker': InlineDialogViewedLinkPickerAttributesType;
+    'ui.inlineDialog.closed.linkPicker': InlineDialogClosedLinkPickerAttributesType;
 };
 declare function createEventPayload<K extends keyof AnalyticsEventAttributes>(eventKey: K, attributes: AnalyticsEventAttributes[K]): {
     eventType: string;

package/dist/types/ui/link-picker/text-input/index.d.ts

@@ -6,7 +6,6 @@ export interface Props extends Omit<TextFieldProps, 'value' | 'onChange' | 'auto
     autoFocus?: boolean;
     value: string;
     onChange: (value: string) => void;
-    onSubmit?: (value: string) => void;
     onUndo?: Function;
     onRedo?: Function;
     onClear?: Function;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-picker",
-  "version": "1.7.1",
+  "version": "1.8.2",
   "description": "Standalone link picker",
   "author": "Atlassian Pty Ltd",
   "publishConfig": {
@@ -63,9 +63,9 @@
     "@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": "^17.0.0",
-    "@atlassian/link-picker-plugins": "^4.0.0",
-    "@atlassian/recent-work-client": "^1.5.0",
+    "@atlassian/link-picker-atlassian-plugin": "^18.0.0",
+    "@atlassian/link-picker-plugins": "^5.1.0",
+    "@atlassian/recent-work-client": "^1.6.0",
     "@atlassian/search-provider": "^2.3.0",
     "@testing-library/dom": "^7.7.3",
     "@testing-library/jest-dom": "^4.1.0",
@@ -76,11 +76,12 @@
     "enzyme": "^3.10.0",
     "fetch-mock": "^8.0.0",
     "js-yaml": "^3.13.1",
+    "lodash": "^4.17.21",
     "mockdate": "^3.0.2",
     "prettier": "^2.1.1",
     "react-dom": "^16.8.0",
     "sinon": "^2.2.0",
-    "typescript": "4.2.4"
+    "typescript": "4.3.5"
   },
   "techstack": {
     "@repo/internal": {