@atlaskit/link-picker 1.25.4 → 1.25.6

package/dist/esm/ui/link-picker/{link-search-list → search-results/link-search-list}/index.js

@@ -11,7 +11,7 @@ import { defineMessages, FormattedMessage } from 'react-intl-next';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import Spinner from '@atlaskit/spinner';
 import VisuallyHidden from '@atlaskit/visually-hidden';
-import { handleNavKeyDown } from '../../../common/utils/handleNavKeyDown';
+import { handleNavKeyDown } from '../../../../common/utils/handleNavKeyDown';
 import { NoResults, testIds as noResultsTestIds } from './link-search-no-results';
 import { emptyStateNoResultsWrapper } from './link-search-no-results/styled';
 import { LinkSearchListItem, testIds as searchResultItemTestIds } from './list-item';
@@ -76,12 +76,6 @@ export var LinkSearchList = /*#__PURE__*/forwardRef(function (_ref, ref) {
     }
     return -1;
   }, [selectedIndex]);
-  var handleOnFocus = function handleOnFocus() {
-    if (items && items.length > 0 && selectedIndex === -1) {
-      var item = items[0];
-      onChange(item.objectId);
-    }
-  };
   var handleKeyDown = useCallback(function (event) {
     var updatedIndex = activeIndex;
     if (onKeyDown) {
@@ -93,13 +87,12 @@ export var LinkSearchList = /*#__PURE__*/forwardRef(function (_ref, ref) {
     updatedIndex = handleNavKeyDown(event, items.length, activeIndex);
     var item = items === null || items === void 0 ? void 0 : items[updatedIndex];
     if (['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key) && item) {
-      onChange(item.objectId);
       if (itemRefs.current) {
         var _itemRefs$current$ite;
         (_itemRefs$current$ite = itemRefs.current[item.objectId]) === null || _itemRefs$current$ite === void 0 ? void 0 : _itemRefs$current$ite.focus();
       }
     }
-  }, [activeIndex, items, onChange, onKeyDown]);
+  }, [activeIndex, items, onKeyDown]);
   if ((items === null || items === void 0 ? void 0 : items.length) === 0) {
     if (getBooleanFF('platform.linking-platform.link-picker.enable-empty-state')) {
       if (hasSearchTerm) {
@@ -140,7 +133,9 @@ export var LinkSearchList = /*#__PURE__*/forwardRef(function (_ref, ref) {
         item: item,
         selected: selectedIndex === index,
         active: activeIndex === index,
-        onFocus: handleOnFocus,
+        onFocus: function onFocus() {
+          return onChange(item.objectId);
+        },
         onKeyDown: handleKeyDown,
         onSelect: onSelect,
         key: item.objectId,

package/dist/esm/ui/link-picker/{link-search-list → search-results/link-search-list}/list-item/index.js

@@ -3,7 +3,7 @@ import { forwardRef, Fragment } from 'react';
 import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 /* eslint-disable-next-line @atlassian/tangerine/import/no-parent-imports */
-import { transformTimeStamp } from '../../transformTimeStamp';
+import { transformTimeStamp } from '../../../transformTimeStamp';
 import { composeListItemStyles, imgStyles, itemIconStyles, itemNameStyles, listItemContainerInnerStyles, listItemContainerStyles, listItemContextStyles, listItemNameStyles } from './styled';
 export var testIds = {
   searchResultItem: 'link-search-list-item',
@@ -45,7 +45,6 @@ var ListItemIcon = function ListItemIcon(props) {
 export var LinkSearchListItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var item = _ref.item,
     selected = _ref.selected,
-    active = _ref.active,
     id = _ref.id,
     role = _ref.role,
     onSelect = _ref.onSelect,

package/dist/esm/ui/link-picker/{link-search-list → search-results/link-search-list}/list-item/styled.js

@@ -14,7 +14,7 @@ export var relativeFontSizeToBase16 = function relativeFontSizeToBase16(px) {
   }
   return "".concat(px / 16, "rem");
 };
-var listItemBaseStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  padding: ", " ", ";\n  margin: 0 calc(-1 * ", ");\n  cursor: pointer;\n"])), "var(--ds-space-100, 8px)", "var(--ds-space-200, 16px)", "var(--ds-space-200, 16px)");
+var listItemBaseStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  padding: ", " ", ";\n  margin: 0;\n  cursor: pointer;\n"])), "var(--ds-space-100, 8px)", "var(--ds-space-200, 16px)");
 var listItemFocusStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  &:focus {\n    outline: none;\n    box-shadow: 0 0 0 2px ", " inset;\n    text-decoration: none;\n  }\n"])), "var(--ds-border-focused, ".concat(B100, ")"));
 var listItemBoxShadow = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  box-shadow: inset 2px 0px 0px ", ";\n"])), "var(--ds-border-selected, ".concat(B400, ")"));
 var listItemActive = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  &:hover {\n    background-color: ", ";\n    ", ";\n  }\n"])), "var(--ds-background-neutral-subtle-hovered, ".concat(N20, ")"), listItemBoxShadow);
@@ -29,6 +29,6 @@ export var listItemContextStyles = css(_templateObject9 || (_templateObject9 = _
 export var listItemContainerStyles = css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])));
 export var listItemContainerInnerStyles = css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  color: ", ";\n  white-space: nowrap;\n"])), "var(--ds-text-subtlest, ".concat(N200, ")"));
 
-// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage-spacing
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
 export var itemIconStyles = css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  min-width: ", ";\n  margin-top: 3px;\n  margin-right: ", ";\n"])), "var(--ds-space-200, 16px)", "var(--ds-space-150, 12px)");
 export var imgStyles = css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  max-width: ", ";\n"])), "var(--ds-space-200, 16px)");

package/dist/esm/ui/link-picker/{link-search-list → search-results/link-search-list}/styled.js

@@ -7,5 +7,5 @@ import { css } from '@emotion/react';
 import { typography } from '@atlaskit/theme';
 export var listContainerStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding-top: 0;\n  min-height: 80px;\n  margin-top: ", ";\n  margin-bottom: ", ";\n  flex-grow: 1;\n  display: flex;\n  flex-direction: column;\n"])), "var(--ds-space-200, 16px)", "var(--ds-space-200, 16px)");
 export var spinnerContainerStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  text-align: center;\n  min-height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-grow: 1;\n"])));
-export var listStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  padding: 0;\n  margin: 0;\n  list-style: none;\n"])));
+export var listStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  padding: 0;\n  margin: 0 calc(-1 * ", ");\n  list-style: none;\n"])), "var(--ds-space-200, 16px)");
 export var listTitleStyles = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  ", "\n  text-transform: uppercase;\n  margin-top: 0;\n  margin-bottom: ", ";\n"])), typography.h100(), "var(--ds-space-050, 4px)");

package/dist/esm/ui/link-picker/{link-search-list → search-results/link-search-list}/use-track-results-shown/index.js

@@ -2,8 +2,8 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { useEffect, useMemo, useRef } from 'react';
 import { useDebounce } from 'use-debounce';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import { ANALYTICS_CHANNEL } from '../../../../common/constants';
-import createEventPayload from '../../../../common/utils/analytics/analytics.codegen';
+import { ANALYTICS_CHANNEL } from '../../../../../common/constants';
+import createEventPayload from '../../../../../common/utils/analytics/analytics.codegen';
 var DEBOUNCE_MS = 400;
 export var useTrackResultsShown = function useTrackResultsShown(isLoading, items, hasSearchTerm) {
   var _useAnalyticsEvents = useAnalyticsEvents(),

package/dist/esm/ui/link-picker/search-results/styled.js

@@ -0,0 +1,6 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+var _templateObject, _templateObject2, _templateObject3;
+import { css } from '@emotion/react';
+export var tabsWrapperStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin-top: ", ";\n  margin-left: calc(-1 * ", ");\n  margin-right: calc(-1 * ", ");\n"])), "var(--ds-space-150, 12px)", "var(--ds-space-100, 8px)", "var(--ds-space-100, 8px)");
+export var spinnerContainerStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  min-height: 80px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-grow: 1;\n"])));
+export var flexColumnStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));

package/dist/esm/ui/link-picker/{track-tab-viewed → search-results/track-tab-viewed}/index.js

@@ -1,8 +1,8 @@
 /** @jsx jsx */
 import { useLayoutEffect } from 'react';
 import { useAnalyticsEvents } from '@atlaskit/analytics-next';
-import { ANALYTICS_CHANNEL } from '../../../common/constants';
-import createEventPayload from '../../../common/utils/analytics/analytics.codegen';
+import { ANALYTICS_CHANNEL } from '../../../../common/constants';
+import createEventPayload from '../../../../common/utils/analytics/analytics.codegen';
 export function TrackTabViewed(_ref) {
   var activePlugin = _ref.activePlugin;
   var _useAnalyticsEvents = useAnalyticsEvents(),

package/dist/esm/version.json

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

package/dist/types/common/constants.d.ts

@@ -1,3 +1,4 @@
 export declare const ANALYTICS_CHANNEL = "media";
 export declare const COMPONENT_NAME = "linkPicker";
 export declare const RECENT_SEARCH_LIST_SIZE = 5;
+export declare const LINK_PICKER_WIDTH_IN_PX = 342;

package/dist/types/i18n/en.d.ts

@@ -31,5 +31,6 @@ declare const _default: {
     'fabric.linkPicker.time.message.viewed': string;
     'fabric.linkPicker.unhandledError.description': string;
     'fabric.linkPicker.unhandledError.heading': string;
+    foo: string;
 };
 export default _default;

package/dist/types/i18n/en_GB.d.ts

@@ -31,5 +31,6 @@ declare const _default: {
     'fabric.linkPicker.time.message.viewed': string;
     'fabric.linkPicker.unhandledError.description': string;
     'fabric.linkPicker.unhandledError.heading': string;
+    foo: string;
 };
 export default _default;

package/dist/types/i18n/en_ZZ.d.ts

@@ -31,5 +31,6 @@ declare const _default: {
     'fabric.linkPicker.time.message.viewed': string;
     'fabric.linkPicker.unhandledError.description': string;
     'fabric.linkPicker.unhandledError.heading': string;
+    foo: string;
 };
 export default _default;

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

@@ -2,21 +2,21 @@
 import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { LinkInputType, LinkPickerPlugin } from '../../common/types';
 export declare const testIds: {
-    readonly tabList: "link-picker-tabs";
-    readonly tabItem: "link-picker-tab";
     readonly urlError: string;
     readonly clearUrlButton: string;
+    readonly insertButton: "link-picker-insert-button";
+    readonly cancelButton: "link-picker-cancel-button";
+    readonly actionButton: "link-picker-action-button";
+    readonly tabsLoadingIndicator: string;
+    readonly tabList: string;
+    readonly tabItem: string;
     readonly resultListTitle: string;
     readonly searchResultList: string;
     readonly searchResultLoadingIndicator: string;
-    readonly tabsLoadingIndicator: string;
     readonly searchResultItem: string;
     readonly searchResultIcon: string;
     readonly emptyResultPage: string;
     readonly searchError: string;
-    readonly insertButton: "link-picker-insert-button";
-    readonly cancelButton: "link-picker-cancel-button";
-    readonly actionButton: "link-picker-action-button";
     readonly linkPickerRoot: "link-picker-root";
     readonly linkPicker: "link-picker";
     readonly urlInputField: "link-url";

package/dist/types/ui/link-picker/search-results/index.d.ts

@@ -0,0 +1,40 @@
+/** @jsx jsx */
+import { KeyboardEvent } from 'react';
+import { jsx } from '@emotion/react';
+import { LinkPickerPlugin, LinkSearchListItemData } from '../../../common/types';
+export declare const testIds: {
+    tabsLoadingIndicator: string;
+    tabList: string;
+    tabItem: string;
+    resultListTitle: string;
+    searchResultList: string;
+    searchResultLoadingIndicator: string;
+    searchResultItem: string;
+    searchResultIcon: string;
+    emptyResultPage: string;
+    searchError: string;
+};
+export type SearchResultsProps = {
+    activePlugin?: LinkPickerPlugin;
+    tabs: {
+        tabTitle: string;
+    }[];
+    isLoadingPlugins?: boolean;
+    isLoadingResults: boolean;
+    activeTab: number;
+    handleTabChange: (activeTab: number) => void;
+    handleSearchListOnChange: (id: string) => void;
+    featureFlags?: Record<string, unknown>;
+    linkSearchListId: string;
+    queryState?: {
+        query: string;
+    };
+    items?: LinkSearchListItemData[] | null;
+    activeIndex: number;
+    selectedIndex: number;
+    handleSelected: (objectId: string) => void;
+    handleKeyDown: (e: KeyboardEvent<HTMLElement>) => void;
+    error?: unknown;
+    retry: () => void;
+};
+export declare const SearchResults: ({ tabs, activeTab, activePlugin, isLoadingPlugins, isLoadingResults, handleTabChange, handleSearchListOnChange, featureFlags, linkSearchListId, error, queryState, items, activeIndex, selectedIndex, handleSelected, handleKeyDown, retry, }: SearchResultsProps) => jsx.JSX.Element;

package/dist/{types-ts4.5/ui/link-picker → types/ui/link-picker/search-results}/link-search-list/index.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { KeyboardEvent } from 'react';
-import { LinkPickerPlugin, LinkSearchListItemData } from '../../../common/types';
+import { LinkPickerPlugin, LinkSearchListItemData } from '../../../../common/types';
 export declare const messages: {
     titleRecentlyViewed: {
         id: string;

package/dist/{types-ts4.5/ui/link-picker → types/ui/link-picker/search-results}/link-search-list/list-item/index.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { KeyboardEvent } from 'react';
-import { LinkSearchListItemData } from '../../../../common/types';
+import { LinkSearchListItemData } from '../../../../../common/types';
 export declare const testIds: {
     searchResultItem: string;
     searchResultIcon: string;

package/dist/types/ui/link-picker/{link-search-list → search-results/link-search-list}/use-track-results-shown/index.d.ts

@@ -1,2 +1,2 @@
-import { LinkSearchListItemData } from '../../../../common/types';
+import { LinkSearchListItemData } from '../../../../../common/types';
 export declare const useTrackResultsShown: (isLoading: boolean, items?: LinkSearchListItemData[] | null | undefined, hasSearchTerm?: boolean) => void;

package/dist/types/ui/link-picker/search-results/styled.d.ts

@@ -0,0 +1,3 @@
+export declare const tabsWrapperStyles: import("@emotion/react").SerializedStyles;
+export declare const spinnerContainerStyles: import("@emotion/react").SerializedStyles;
+export declare const flexColumnStyles: import("@emotion/react").SerializedStyles;

package/dist/types/ui/link-picker/{track-tab-viewed → search-results/track-tab-viewed}/index.d.ts

@@ -1,4 +1,4 @@
-import { LinkPickerPlugin } from '../../../index';
+import { LinkPickerPlugin } from '../../../../common/types';
 export declare function TrackTabViewed({ activePlugin, }: {
     activePlugin: LinkPickerPlugin | undefined;
 }): null;

package/dist/types-ts4.5/common/constants.d.ts

@@ -1,3 +1,4 @@
 export declare const ANALYTICS_CHANNEL = "media";
 export declare const COMPONENT_NAME = "linkPicker";
 export declare const RECENT_SEARCH_LIST_SIZE = 5;
+export declare const LINK_PICKER_WIDTH_IN_PX = 342;

package/dist/types-ts4.5/i18n/en.d.ts

@@ -31,5 +31,6 @@ declare const _default: {
     'fabric.linkPicker.time.message.viewed': string;
     'fabric.linkPicker.unhandledError.description': string;
     'fabric.linkPicker.unhandledError.heading': string;
+    foo: string;
 };
 export default _default;

package/dist/types-ts4.5/i18n/en_GB.d.ts

@@ -31,5 +31,6 @@ declare const _default: {
     'fabric.linkPicker.time.message.viewed': string;
     'fabric.linkPicker.unhandledError.description': string;
     'fabric.linkPicker.unhandledError.heading': string;
+    foo: string;
 };
 export default _default;

package/dist/types-ts4.5/i18n/en_ZZ.d.ts

@@ -31,5 +31,6 @@ declare const _default: {
     'fabric.linkPicker.time.message.viewed': string;
     'fabric.linkPicker.unhandledError.description': string;
     'fabric.linkPicker.unhandledError.heading': string;
+    foo: string;
 };
 export default _default;

package/dist/types-ts4.5/ui/link-picker/index.d.ts

@@ -2,21 +2,21 @@
 import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { LinkInputType, LinkPickerPlugin } from '../../common/types';
 export declare const testIds: {
-    readonly tabList: "link-picker-tabs";
-    readonly tabItem: "link-picker-tab";
     readonly urlError: string;
     readonly clearUrlButton: string;
+    readonly insertButton: "link-picker-insert-button";
+    readonly cancelButton: "link-picker-cancel-button";
+    readonly actionButton: "link-picker-action-button";
+    readonly tabsLoadingIndicator: string;
+    readonly tabList: string;
+    readonly tabItem: string;
     readonly resultListTitle: string;
     readonly searchResultList: string;
     readonly searchResultLoadingIndicator: string;
-    readonly tabsLoadingIndicator: string;
     readonly searchResultItem: string;
     readonly searchResultIcon: string;
     readonly emptyResultPage: string;
     readonly searchError: string;
-    readonly insertButton: "link-picker-insert-button";
-    readonly cancelButton: "link-picker-cancel-button";
-    readonly actionButton: "link-picker-action-button";
     readonly linkPickerRoot: "link-picker-root";
     readonly linkPicker: "link-picker";
     readonly urlInputField: "link-url";

package/dist/types-ts4.5/ui/link-picker/search-results/index.d.ts

@@ -0,0 +1,40 @@
+/** @jsx jsx */
+import { KeyboardEvent } from 'react';
+import { jsx } from '@emotion/react';
+import { LinkPickerPlugin, LinkSearchListItemData } from '../../../common/types';
+export declare const testIds: {
+    tabsLoadingIndicator: string;
+    tabList: string;
+    tabItem: string;
+    resultListTitle: string;
+    searchResultList: string;
+    searchResultLoadingIndicator: string;
+    searchResultItem: string;
+    searchResultIcon: string;
+    emptyResultPage: string;
+    searchError: string;
+};
+export type SearchResultsProps = {
+    activePlugin?: LinkPickerPlugin;
+    tabs: {
+        tabTitle: string;
+    }[];
+    isLoadingPlugins?: boolean;
+    isLoadingResults: boolean;
+    activeTab: number;
+    handleTabChange: (activeTab: number) => void;
+    handleSearchListOnChange: (id: string) => void;
+    featureFlags?: Record<string, unknown>;
+    linkSearchListId: string;
+    queryState?: {
+        query: string;
+    };
+    items?: LinkSearchListItemData[] | null;
+    activeIndex: number;
+    selectedIndex: number;
+    handleSelected: (objectId: string) => void;
+    handleKeyDown: (e: KeyboardEvent<HTMLElement>) => void;
+    error?: unknown;
+    retry: () => void;
+};
+export declare const SearchResults: ({ tabs, activeTab, activePlugin, isLoadingPlugins, isLoadingResults, handleTabChange, handleSearchListOnChange, featureFlags, linkSearchListId, error, queryState, items, activeIndex, selectedIndex, handleSelected, handleKeyDown, retry, }: SearchResultsProps) => jsx.JSX.Element;

package/dist/{types/ui/link-picker → types-ts4.5/ui/link-picker/search-results}/link-search-list/index.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { KeyboardEvent } from 'react';
-import { LinkPickerPlugin, LinkSearchListItemData } from '../../../common/types';
+import { LinkPickerPlugin, LinkSearchListItemData } from '../../../../common/types';
 export declare const messages: {
     titleRecentlyViewed: {
         id: string;

package/dist/{types/ui/link-picker → types-ts4.5/ui/link-picker/search-results}/link-search-list/list-item/index.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { KeyboardEvent } from 'react';
-import { LinkSearchListItemData } from '../../../../common/types';
+import { LinkSearchListItemData } from '../../../../../common/types';
 export declare const testIds: {
     searchResultItem: string;
     searchResultIcon: string;

package/dist/types-ts4.5/ui/link-picker/{link-search-list → search-results/link-search-list}/use-track-results-shown/index.d.ts

@@ -1,2 +1,2 @@
-import { LinkSearchListItemData } from '../../../../common/types';
+import { LinkSearchListItemData } from '../../../../../common/types';
 export declare const useTrackResultsShown: (isLoading: boolean, items?: LinkSearchListItemData[] | null | undefined, hasSearchTerm?: boolean) => void;

package/dist/types-ts4.5/ui/link-picker/search-results/styled.d.ts

@@ -0,0 +1,3 @@
+export declare const tabsWrapperStyles: import("@emotion/react").SerializedStyles;
+export declare const spinnerContainerStyles: import("@emotion/react").SerializedStyles;
+export declare const flexColumnStyles: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/ui/link-picker/{track-tab-viewed → search-results/track-tab-viewed}/index.d.ts

@@ -1,4 +1,4 @@
-import { LinkPickerPlugin } from '../../../index';
+import { LinkPickerPlugin } from '../../../../common/types';
 export declare function TrackTabViewed({ activePlugin, }: {
     activePlugin: LinkPickerPlugin | undefined;
 }): null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-picker",
-  "version": "1.25.4",
+  "version": "1.25.6",
   "description": "Standalone link picker",
   "author": "Atlassian Pty Ltd",
   "publishConfig": {
@@ -52,14 +52,14 @@
     "@atlaskit/form": "^8.11.0",
     "@atlaskit/frontend-utilities": "^2.7.0",
     "@atlaskit/icon": "^21.12.0",
-    "@atlaskit/linking-common": "^3.1.0",
+    "@atlaskit/linking-common": "^3.2.0",
     "@atlaskit/onboarding": "^10.8.2",
     "@atlaskit/platform-feature-flags": "^0.2.1",
     "@atlaskit/spinner": "^15.5.0",
     "@atlaskit/tabs": "^13.4.0",
     "@atlaskit/textfield": "^5.5.0",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.10.0",
+    "@atlaskit/tokens": "^1.11.0",
     "@atlaskit/tooltip": "^17.8.0",
     "@atlaskit/ufo": "^0.2.0",
     "@atlaskit/visually-hidden": "^1.2.0",
@@ -77,12 +77,13 @@
   },
   "devDependencies": {
     "@af/analytics-codegen": "^0.1.0",
+    "@af/visual-regression": "*",
     "@atlaskit/docs": "*",
     "@atlaskit/dropdown-menu": "^11.10.0",
-    "@atlaskit/link-analytics": "^8.0.0",
+    "@atlaskit/link-analytics": "^8.2.0",
     "@atlaskit/link-provider": "^1.6.0",
     "@atlaskit/link-test-helpers": "^4.1.0",
-    "@atlaskit/linking-common": "^3.1.0",
+    "@atlaskit/linking-common": "^3.2.0",
     "@atlaskit/popup": "^1.8.0",
     "@atlaskit/toggle": "^12.6.0",
     "@atlaskit/visual-regression": "*",