@atlaskit/link-picker 1.8.3 → 1.9.0

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

@@ -1,24 +1,25 @@
 /// <reference types="react" />
+import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { LinkInputType, LinkPickerPlugin } from '../types';
 export declare const RECENT_SEARCH_LIST_SIZE = 5;
 export declare const CONTACT_SUPPORT_LINK = "https://support.atlassian.com/contact/";
 export declare const testIds: {
-    linkPicker: string;
-    urlInputField: string;
-    textInputField: string;
-    searchIcon: string;
-    insertButton: string;
-    cancelButton: string;
-    clearUrlButton: string;
-    resultListTitle: string;
-    emptyResultPage: string;
-    searchResultList: string;
-    searchResultItem: string;
-    searchResultLoadingIndicator: string;
-    urlError: string;
-    tabList: string;
-    tabItem: string;
-    searchError: string;
+    readonly clearUrlButton: "clear-text";
+    readonly urlError: "link-error";
+    readonly tabList: "link-picker-tabs";
+    readonly tabItem: "link-picker-tab";
+    readonly resultListTitle: string;
+    readonly searchResultItem: string;
+    readonly searchResultList: string;
+    readonly searchResultLoadingIndicator: string;
+    readonly emptyResultPage: string;
+    readonly searchError: string;
+    readonly insertButton: "link-picker-insert-button";
+    readonly cancelButton: "link-picker-cancel-button";
+    readonly linkPicker: "link-picker";
+    readonly urlInputField: "link-url";
+    readonly textInputField: "link-text";
+    readonly searchIcon: "link-picker-search-icon";
 };
 interface Meta {
     /** Indicates how the link was picked. */
@@ -42,8 +43,10 @@ interface OnSubmitParameter {
     rawUrl?: string;
 }
 export interface LinkPickerProps {
-    /** Callback to fire on form submission. */
-    onSubmit: (arg: OnSubmitParameter) => void;
+    /**
+     * Callback to fire on form submission.
+     */
+    onSubmit: (arg: OnSubmitParameter, analytic?: UIAnalyticsEvent | null) => void;
     /** Callback to fire when the cancel button is clicked. */
     onCancel: () => void;
     /** Callback to fire when content is changed inside the link picker e.g. items, when loading, tabs */

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

@@ -1,4 +1,20 @@
-/// <reference types="react" />
-import { EmptyStateProps } from '@atlaskit/empty-state';
-declare const LinkSearchError: (props: EmptyStateProps) => JSX.Element;
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+export declare const CONTACT_SUPPORT_LINK = "https://support.atlassian.com/contact/";
+export declare const messages: {
+    searchErrorHeader: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    searchErrorDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export declare const testIds: {
+    searchError: string;
+};
+declare const LinkSearchError: () => jsx.JSX.Element;
 export default LinkSearchError;

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

@@ -1,8 +1,31 @@
-/** @jsx jsx */
-import { jsx } from '@emotion/react';
+/// <reference types="react" />
 import { LinkSearchListItemData } from '../../types';
-export interface LinkSearchListProps {
-    items?: LinkSearchListItemData[];
+export declare const messages: {
+    titleRecentlyViewed: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    titleResults: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    searchLinkResults: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export declare const testIds: {
+    resultListTitle: string;
+    searchResultItem: string;
+    searchResultList: string;
+    searchResultLoadingIndicator: string;
+    emptyResultPage: string;
+};
+export interface LinkSearchListProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect' | 'onMouseEnter' | 'onMouseLeave'> {
+    items?: LinkSearchListItemData[] | null;
     isLoading: boolean;
     selectedIndex: number;
     activeIndex: number;
@@ -13,6 +36,8 @@ export interface LinkSearchListProps {
     ariaLabelledBy?: string;
     role?: string;
     id?: string;
+    error?: unknown;
+    hasSearchTerm?: boolean;
 }
-declare const LinkSearchList: ({ onSelect, onMouseEnter, onMouseLeave, items, activeIndex, selectedIndex, isLoading, ariaControls, ariaLabelledBy, role, id, }: LinkSearchListProps) => jsx.JSX.Element;
+declare const LinkSearchList: import("react").ForwardRefExoticComponent<LinkSearchListProps & import("react").RefAttributes<HTMLDivElement>>;
 export default LinkSearchList;

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

@@ -0,0 +1,19 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+export declare const messages: {
+    noResults: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    noResultsDescription: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export declare const testIds: {
+    emptyResultPage: string;
+};
+declare const NoResults: () => jsx.JSX.Element;
+export default NoResults;

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

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

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

@@ -1,3 +1,4 @@
 export declare const listContainerStyles: import("@emotion/react").SerializedStyles;
 export declare const spinnerContainerStyles: import("@emotion/react").SerializedStyles;
 export declare const listStyles: import("@emotion/react").SerializedStyles;
+export declare const listTitleStyles: import("@emotion/react").SerializedStyles;

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

@@ -44,11 +44,6 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
-    searchLinkResults: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
     linkAriaLabel: {
         id: string;
         defaultMessage: string;
@@ -69,49 +64,4 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
-    titleRecentlyViewed: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    titleResults: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    cancelButton: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    insertButton: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    noResults: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    noResultsDescription: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    saveButton: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    searchErrorHeader: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
-    searchErrorDescription: {
-        id: string;
-        defaultMessage: string;
-        description: string;
-    };
 };

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

@@ -1,5 +1,9 @@
+/**
+ * Half padding on the top as the form field has a `gridSize()` margin top that cannot be overridden
+ */
 export declare const rootContainerStyles: import("@emotion/react").SerializedStyles;
 export declare const rootContainerStylesForLoader: import("@emotion/react").SerializedStyles;
 export declare const searchIconStyles: import("@emotion/react").SerializedStyles;
-export declare const listTitleStyles: import("@emotion/react").SerializedStyles;
 export declare const tabsWrapperStyles: import("@emotion/react").SerializedStyles;
+export declare const flexColumnStyles: import("@emotion/react").SerializedStyles;
+export declare const formFooterMargin: import("@emotion/react").SerializedStyles;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-picker",
-  "version": "1.8.3",
+  "version": "1.9.0",
   "description": "Standalone link picker",
   "author": "Atlassian Pty Ltd",
   "publishConfig": {
@@ -32,16 +32,16 @@
   "dependencies": {
     "@atlaskit/analytics-next": "^8.3.1",
     "@atlaskit/button": "^16.2.0",
-    "@atlaskit/empty-state": "^7.3.0",
+    "@atlaskit/empty-state": "^7.4.0",
     "@atlaskit/form": "^8.5.1",
     "@atlaskit/icon": "^21.10.0",
     "@atlaskit/spinner": "^15.1.0",
-    "@atlaskit/tabs": "^13.2.11",
-    "@atlaskit/textfield": "^5.1.7",
-    "@atlaskit/theme": "^12.1.0",
+    "@atlaskit/tabs": "^13.3.0",
+    "@atlaskit/textfield": "^5.2.0",
+    "@atlaskit/theme": "^12.2.0",
     "@atlaskit/tokens": "^0.10.0",
     "@atlaskit/tooltip": "^17.5.0",
-    "@atlaskit/visually-hidden": "^1.0.0",
+    "@atlaskit/visually-hidden": "^1.1.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "date-fns": "^2.17.0",
@@ -56,22 +56,23 @@
     "@af/codegen": "*",
     "@atlaskit/activity-provider": "^2.3.2",
     "@atlaskit/docs": "*",
+    "@atlaskit/link-analytics": "^1.0.0",
     "@atlaskit/link-test-helpers": "^1.4.0",
     "@atlaskit/popup": "^1.4.0",
     "@atlaskit/ssr": "*",
-    "@atlaskit/toggle": "^12.4.0",
+    "@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": "^18.0.0",
-    "@atlassian/link-picker-plugins": "^5.1.0",
+    "@atlassian/link-picker-atlassian-plugin": "^19.0.0",
+    "@atlassian/link-picker-plugins": "^6.0.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",
-    "@testing-library/react": "^8.0.1",
-    "@testing-library/react-hooks": "^1.0.4",
-    "@testing-library/user-event": "10.4.0",
+    "@testing-library/dom": "^8.17.1",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^12.1.5",
+    "@testing-library/react-hooks": "^1.1.0",
+    "@testing-library/user-event": "^13.5.0",
     "@types/js-yaml": "^3.12.5",
     "enzyme": "^3.10.0",
     "fetch-mock": "^8.0.0",

package/report.api.md

@@ -10,6 +10,7 @@
 import { MessageDescriptor } from 'react-intl-next';
 import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
+import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 
 export declare type LinkInputType = 'manual' | 'typeAhead';
 
@@ -35,8 +36,13 @@ export declare type LinkPickerPluginErrorFallback = (
 ) => ReactNode;
 
 export declare interface LinkPickerProps {
-  /** Callback to fire on form submission. */
-  onSubmit: (arg: OnSubmitParameter) => void;
+  /**
+   * Callback to fire on form submission.
+   */
+  onSubmit: (
+    arg: OnSubmitParameter,
+    analytic?: UIAnalyticsEvent | null,
+  ) => void;
   /** Callback to fire when the cancel button is clicked. */
   onCancel: () => void;
   /** Callback to fire when content is changed inside the link picker e.g. items, when loading, tabs */

package/dist/cjs/ui/link-picker/link-search-no-results/index.js

@@ -1,27 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _emptyState = _interopRequireDefault(require("@atlaskit/empty-state"));
-
-var _noResultsSvg = _interopRequireDefault(require("./no-results-svg"));
-
-var NoResults = function NoResults(props) {
-  return /*#__PURE__*/_react.default.createElement(_emptyState.default, (0, _extends2.default)({}, props, {
-    renderImage: function renderImage() {
-      return /*#__PURE__*/_react.default.createElement(_noResultsSvg.default, null);
-    }
-  }));
-};
-
-var _default = NoResults;
-exports.default = _default;

package/dist/es2019/ui/link-picker/link-search-no-results/index.js

@@ -1,10 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import EmptyState from '@atlaskit/empty-state';
-import NoResultsSVG from './no-results-svg';
-
-const NoResults = props => /*#__PURE__*/React.createElement(EmptyState, _extends({}, props, {
-  renderImage: () => /*#__PURE__*/React.createElement(NoResultsSVG, null)
-}));
-
-export default NoResults;

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

@@ -1,14 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import EmptyState from '@atlaskit/empty-state';
-import NoResultsSVG from './no-results-svg';
-
-var NoResults = function NoResults(props) {
-  return /*#__PURE__*/React.createElement(EmptyState, _extends({}, props, {
-    renderImage: function renderImage() {
-      return /*#__PURE__*/React.createElement(NoResultsSVG, null);
-    }
-  }));
-};
-
-export default NoResults;

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

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import { EmptyStateProps } from '@atlaskit/empty-state';
-declare const NoResults: (props: EmptyStateProps) => JSX.Element;
-export default NoResults;