@atlaskit/link-picker 1.6.0 → 1.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/analytics.codegen.js +28 -0
  3. package/dist/cjs/common/constants.js +10 -0
  4. package/dist/cjs/{ui/error-boundary-fallback → common}/generic-error-svg/index.js +0 -0
  5. package/dist/cjs/{ui/error-boundary-fallback → common}/generic-error-svg/styled.js +0 -0
  6. package/dist/cjs/services/use-plugins/index.js +32 -35
  7. package/dist/cjs/services/use-search-query/index.js +41 -0
  8. package/dist/cjs/ui/error-boundary-fallback/index.js +1 -1
  9. package/dist/cjs/ui/index.js +4 -4
  10. package/dist/cjs/ui/link-picker/index.js +68 -41
  11. package/dist/cjs/ui/link-picker/link-search-error/index.js +27 -0
  12. package/dist/cjs/ui/link-picker/messages.js +10 -0
  13. package/dist/cjs/ui/link-picker/url.js +0 -5
  14. package/dist/cjs/version.json +1 -1
  15. package/dist/es2019/analytics.codegen.js +20 -0
  16. package/dist/es2019/common/constants.js +2 -0
  17. package/dist/es2019/{ui/error-boundary-fallback → common}/generic-error-svg/index.js +0 -0
  18. package/dist/es2019/{ui/error-boundary-fallback → common}/generic-error-svg/styled.js +0 -0
  19. package/dist/es2019/services/use-plugins/index.js +28 -38
  20. package/dist/es2019/services/use-search-query/index.js +32 -0
  21. package/dist/es2019/ui/error-boundary-fallback/index.js +1 -1
  22. package/dist/es2019/ui/index.js +1 -2
  23. package/dist/es2019/ui/link-picker/index.js +59 -40
  24. package/dist/es2019/ui/link-picker/link-search-error/index.js +10 -0
  25. package/dist/es2019/ui/link-picker/messages.js +10 -0
  26. package/dist/es2019/ui/link-picker/url.js +0 -5
  27. package/dist/es2019/version.json +1 -1
  28. package/dist/esm/analytics.codegen.js +20 -0
  29. package/dist/esm/common/constants.js +2 -0
  30. package/dist/esm/{ui/error-boundary-fallback → common}/generic-error-svg/index.js +0 -0
  31. package/dist/esm/{ui/error-boundary-fallback → common}/generic-error-svg/styled.js +0 -0
  32. package/dist/esm/services/use-plugins/index.js +33 -35
  33. package/dist/esm/services/use-search-query/index.js +32 -0
  34. package/dist/esm/ui/error-boundary-fallback/index.js +1 -1
  35. package/dist/esm/ui/index.js +1 -2
  36. package/dist/esm/ui/link-picker/index.js +61 -40
  37. package/dist/esm/ui/link-picker/link-search-error/index.js +14 -0
  38. package/dist/esm/ui/link-picker/messages.js +10 -0
  39. package/dist/esm/ui/link-picker/url.js +0 -5
  40. package/dist/esm/version.json +1 -1
  41. package/dist/types/analytics.codegen.d.ts +20 -0
  42. package/dist/types/common/constants.d.ts +2 -0
  43. package/dist/types/{ui/error-boundary-fallback → common}/generic-error-svg/index.d.ts +0 -0
  44. package/dist/types/{ui/error-boundary-fallback → common}/generic-error-svg/styled.d.ts +0 -0
  45. package/dist/types/index.d.ts +1 -1
  46. package/dist/types/services/use-plugins/index.d.ts +6 -5
  47. package/dist/types/services/use-search-query/index.d.ts +3 -0
  48. package/dist/types/ui/link-picker/index.d.ts +2 -0
  49. package/dist/types/ui/link-picker/link-search-error/index.d.ts +4 -0
  50. package/dist/types/ui/link-picker/messages.d.ts +10 -0
  51. package/dist/types/ui/types.d.ts +5 -2
  52. package/package.json +12 -6
  53. package/report.api.md +21 -13
@@ -7,25 +7,31 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
7
7
  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; }
8
8
 
9
9
  /** @jsx jsx */
10
- import { useCallback, useLayoutEffect, useReducer } from 'react';
10
+ import { Fragment, useCallback, useLayoutEffect, useReducer } from 'react';
11
11
  import { jsx } from '@emotion/react';
12
12
  import { useIntl, FormattedMessage } from 'react-intl-next';
13
+ import { useAnalyticsEvents } from '@atlaskit/analytics-next';
13
14
  import Button, { ButtonGroup } from '@atlaskit/button';
14
15
  import { FormFooter } from '@atlaskit/form';
15
16
  import EditorSearchIcon from '@atlaskit/icon/glyph/editor/search';
16
17
  import Tabs, { Tab, TabList } from '@atlaskit/tabs';
17
18
  import VisuallyHidden from '@atlaskit/visually-hidden';
19
+ import createEventPayload from '../../analytics.codegen';
20
+ import { ANALYTICS_CHANNEL } from '../../common/constants';
21
+ import { usePlugins } from '../../services/use-plugins';
22
+ import { useSearchQuery } from '../../services/use-search-query';
18
23
  import { messages } from './messages';
19
24
  import PanelTextInput from './text-input';
20
25
  import LinkSearchList from './link-search-list';
21
26
  import { normalizeUrl, isSafeUrl } from './url';
22
27
  import { rootContainerStyles, searchIconStyles, listTitleStyles, tabsWrapperStyles } from './styled';
23
28
  import { browser } from './browser';
24
- import { transformTimeStamp } from './transformTimeStamp';
25
29
  import Announcer from './announcer';
26
30
  import LinkSearchNoResults from './link-search-no-results';
27
- import { usePlugins } from '../../services/use-plugins';
31
+ import { transformTimeStamp } from './transformTimeStamp';
32
+ import LinkSearchError from './link-search-error';
28
33
  export var RECENT_SEARCH_LIST_SIZE = 5;
34
+ export var CONTACT_SUPPORT_LINK = 'https://support.atlassian.com/contact/';
29
35
  export var testIds = {
30
36
  linkPicker: 'link-picker',
31
37
  urlInputField: 'link-url',
@@ -41,7 +47,8 @@ export var testIds = {
41
47
  searchResultLoadingIndicator: 'link-picker.results-loading-indicator',
42
48
  urlError: 'link-error',
43
49
  tabList: 'link-picker-tabs',
44
- tabItem: 'link-picker-tab'
50
+ tabItem: 'link-picker-tab',
51
+ searchError: 'link-search-error'
45
52
  };
46
53
  var initState = {
47
54
  url: '',
@@ -64,6 +71,8 @@ function reducer(state, payload) {
64
71
  }
65
72
 
66
73
  function LinkPicker(_ref) {
74
+ var _queryState$query, _items$length, _errorFallback;
75
+
67
76
  var onSubmit = _ref.onSubmit,
68
77
  onCancel = _ref.onCancel,
69
78
  onContentResize = _ref.onContentResize,
@@ -71,6 +80,9 @@ function LinkPicker(_ref) {
71
80
  initUrl = _ref.url,
72
81
  initDisplayText = _ref.displayText;
73
82
 
83
+ var _useAnalyticsEvents = useAnalyticsEvents(),
84
+ createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
85
+
74
86
  var _useReducer = useReducer(reducer, _objectSpread(_objectSpread({}, initState), {}, {
75
87
  url: normalizeUrl(initUrl) || '',
76
88
  displayText: initDisplayText || ''
@@ -83,17 +95,23 @@ function LinkPicker(_ref) {
83
95
  selectedIndex = state.selectedIndex,
84
96
  url = state.url,
85
97
  displayText = state.displayText,
86
- invalidUrl = state.invalidUrl;
87
- var isEditing = !!initUrl;
98
+ invalidUrl = state.invalidUrl,
99
+ activeTab = state.activeTab;
88
100
  var intl = useIntl();
101
+ var queryState = useSearchQuery(state);
89
102
 
90
- var _usePlugins = usePlugins(state, plugins),
103
+ var _usePlugins = usePlugins(queryState, activeTab, plugins),
91
104
  items = _usePlugins.items,
92
105
  isLoading = _usePlugins.isLoading,
93
- isSelectedItem = _usePlugins.isSelectedItem,
94
106
  isActivePlugin = _usePlugins.isActivePlugin,
95
- tabs = _usePlugins.tabs;
107
+ tabs = _usePlugins.tabs,
108
+ error = _usePlugins.error,
109
+ retry = _usePlugins.retry,
110
+ errorFallback = _usePlugins.errorFallback;
96
111
 
112
+ var isEditing = !!initUrl;
113
+ var selectedItem = items === null || items === void 0 ? void 0 : items[selectedIndex];
114
+ var isSelectedItem = (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.url) === url;
97
115
  useLayoutEffect(function () {
98
116
  if (onContentResize) {
99
117
  onContentResize();
@@ -147,15 +165,15 @@ function LinkPicker(_ref) {
147
165
  dispatch(_defineProperty({}, field, ''));
148
166
  }, []);
149
167
  var handleMouseEnterResultItem = useCallback(function (objectId) {
150
- var index = findIndex(items, function (item) {
168
+ var index = items === null || items === void 0 ? void 0 : items.findIndex(function (item) {
151
169
  return item.objectId === objectId;
152
170
  });
153
171
  dispatch({
154
- activeIndex: index
172
+ activeIndex: index !== null && index !== void 0 ? index : -1
155
173
  });
156
174
  }, [items]);
157
175
  var handleMouseLeaveResultItem = useCallback(function (objectId) {
158
- var index = findIndex(items, function (item) {
176
+ var index = items === null || items === void 0 ? void 0 : items.findIndex(function (item) {
159
177
  return item.objectId === objectId;
160
178
  }); // This is to avoid updating index that was set by other mouseenter event
161
179
 
@@ -166,6 +184,8 @@ function LinkPicker(_ref) {
166
184
  }
167
185
  }, [activeIndex, items]);
168
186
  var handleInsert = useCallback(function (url, title, inputType) {
187
+ var event = createAnalyticsEvent(createEventPayload('form.submitted.linkPicker', {}));
188
+ event.fire(ANALYTICS_CHANNEL);
169
189
  onSubmit(_objectSpread({
170
190
  url: url,
171
191
  displayText: displayText || null,
@@ -176,9 +196,9 @@ function LinkPicker(_ref) {
176
196
  }, inputType === 'manual' ? {
177
197
  rawUrl: state.url
178
198
  } : {}));
179
- }, [displayText, onSubmit, state.url]);
199
+ }, [displayText, onSubmit, state.url, createAnalyticsEvent]);
180
200
  var handleSelected = useCallback(function (objectId) {
181
- var selectedItem = items.find(function (item) {
201
+ var selectedItem = items === null || items === void 0 ? void 0 : items.find(function (item) {
182
202
  return item.objectId === objectId;
183
203
  });
184
204
 
@@ -189,9 +209,7 @@ function LinkPicker(_ref) {
189
209
  }
190
210
  }, [handleInsert, items]);
191
211
  var handleSubmit = useCallback(function () {
192
- var selectedItem = items[selectedIndex];
193
-
194
- if (isSelectedItem) {
212
+ if (isSelectedItem && selectedItem) {
195
213
  return handleInsert(selectedItem.url, selectedItem.name, 'typeAhead');
196
214
  }
197
215
 
@@ -204,18 +222,18 @@ function LinkPicker(_ref) {
204
222
  return dispatch({
205
223
  invalidUrl: true
206
224
  });
207
- }, [handleInsert, isSelectedItem, items, selectedIndex, url]);
225
+ }, [handleInsert, isSelectedItem, selectedItem, url]);
208
226
  var linkPlaceHolder = isActivePlugin ? messages.placeholder : messages.linkPlaceholder;
209
- var linkListTitle = url ? messages.titleResults : messages.titleRecentlyViewed;
227
+ var linkListTitle = (queryState === null || queryState === void 0 ? void 0 : (_queryState$query = queryState.query) === null || _queryState$query === void 0 ? void 0 : _queryState$query.length) !== 0 ? messages.titleResults : messages.titleRecentlyViewed;
210
228
  var insertButtonMsg = isEditing ? messages.saveButton : messages.insertButton;
211
- var noResults = isActivePlugin && !isLoading && !items.length && !isSafeUrl(url);
229
+ var noResults = (items === null || items === void 0 ? void 0 : items.length) === 0 && !error;
212
230
  var screenReaderDescriptionId = 'search-recent-links-field-description';
213
231
  var linkSearchListId = 'link-picker-search-list';
214
232
  var ariaActiveDescendant = selectedIndex > -1 ? "link-search-list-item-".concat(selectedIndex) : ''; // Added workaround with a screen reader Announcer specifically for VoiceOver + Safari
215
233
  // as the Aria design pattern for combobox does not work in this case
216
234
  // for details: https://a11y-internal.atlassian.net/browse/AK-740
217
235
 
218
- var screenReaderText = browser.safari && getScreenReaderText(items, selectedIndex, intl);
236
+ var screenReaderText = browser.safari && getScreenReaderText(items !== null && items !== void 0 ? items : [], selectedIndex, intl);
219
237
  var searchIcon = isActivePlugin && jsx("span", {
220
238
  css: searchIconStyles,
221
239
  "data-testid": testIds.searchIcon
@@ -267,7 +285,7 @@ function LinkPicker(_ref) {
267
285
  onSubmit: handleSubmit,
268
286
  onKeyDown: handleKeyDown,
269
287
  onChange: handleChangeText
270
- }), tabs.length > 0 && jsx("div", {
288
+ }), queryState && jsx(Fragment, null, tabs.length > 0 && jsx("div", {
271
289
  css: tabsWrapperStyles
272
290
  }, jsx(Tabs, {
273
291
  id: testIds.tabList,
@@ -285,7 +303,7 @@ function LinkPicker(_ref) {
285
303
  key: tab.tabTitle,
286
304
  testId: testIds.tabItem
287
305
  }, tab.tabTitle);
288
- })))), !!items.length && jsx("div", {
306
+ })))), !!(items !== null && items !== void 0 && items.length) && jsx("div", {
289
307
  css: listTitleStyles,
290
308
  id: testIds.resultListTitle,
291
309
  "data-testid": testIds.resultListTitle
@@ -293,7 +311,7 @@ function LinkPicker(_ref) {
293
311
  id: "fabric.smartcard.linkpicker.suggested.results"
294
312
  }, url && jsx(FormattedMessage, _extends({}, messages.searchLinkResults, {
295
313
  values: {
296
- count: items.length
314
+ count: (_items$length = items === null || items === void 0 ? void 0 : items.length) !== null && _items$length !== void 0 ? _items$length : 0
297
315
  },
298
316
  "aria-live": "polite",
299
317
  "aria-atomic": "true"
@@ -302,18 +320,34 @@ function LinkPicker(_ref) {
302
320
  ariaControls: "fabric.smartcard.linkpicker.suggested.results",
303
321
  id: linkSearchListId,
304
322
  role: "listbox",
305
- items: items,
323
+ items: items !== null && items !== void 0 ? items : [],
306
324
  isLoading: isLoading,
307
325
  selectedIndex: selectedIndex,
308
326
  activeIndex: activeIndex,
309
327
  onSelect: handleSelected,
310
328
  onMouseEnter: handleMouseEnterResultItem,
311
329
  onMouseLeave: handleMouseLeaveResultItem
312
- }), noResults && jsx(LinkSearchNoResults, {
330
+ }), error && ((_errorFallback = errorFallback === null || errorFallback === void 0 ? void 0 : errorFallback(error, retry)) !== null && _errorFallback !== void 0 ? _errorFallback : jsx(LinkSearchError, {
331
+ testId: testIds.searchError,
332
+ header: intl.formatMessage(messages.searchErrorHeader),
333
+ description: jsx(FormattedMessage, _extends({}, messages.searchErrorDescription, {
334
+ values: {
335
+ a: function a(label) {
336
+ return jsx(Button, {
337
+ appearance: "link",
338
+ spacing: "none",
339
+ href: CONTACT_SUPPORT_LINK,
340
+ target: "_blank",
341
+ rel: "noopener noreferrer"
342
+ }, label);
343
+ }
344
+ }
345
+ }))
346
+ })), noResults && jsx(LinkSearchNoResults, {
313
347
  testId: testIds.emptyResultPage,
314
348
  header: intl.formatMessage(messages.noResults),
315
349
  description: intl.formatMessage(messages.noResultsDescription)
316
- }), jsx(FormFooter, {
350
+ })), jsx(FormFooter, {
317
351
  align: "end"
318
352
  }, jsx(ButtonGroup, null, jsx(Button, {
319
353
  appearance: "default",
@@ -340,17 +374,4 @@ function getScreenReaderText(items, selectedIndex, intl) {
340
374
  var formattedDate = [date === null || date === void 0 ? void 0 : date.pageAction, date === null || date === void 0 ? void 0 : date.dateString, date === null || date === void 0 ? void 0 : date.timeSince].filter(Boolean).join(' ');
341
375
  return [name, container, formattedDate].filter(Boolean).join(', ');
342
376
  }
343
- }
344
-
345
- function findIndex(array, predicate) {
346
- var index = -1;
347
- array.some(function (item, i) {
348
- if (predicate(item)) {
349
- index = i;
350
- return true;
351
- }
352
-
353
- return false;
354
- });
355
- return index;
356
377
  }
@@ -0,0 +1,14 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import React from 'react';
3
+ import EmptyState from '@atlaskit/empty-state';
4
+ import GenericErrorSVG from '../../../common/generic-error-svg';
5
+
6
+ var LinkSearchError = function LinkSearchError(props) {
7
+ return /*#__PURE__*/React.createElement(EmptyState, _extends({}, props, {
8
+ renderImage: function renderImage() {
9
+ return /*#__PURE__*/React.createElement(GenericErrorSVG, null);
10
+ }
11
+ }));
12
+ };
13
+
14
+ export default LinkSearchError;
@@ -104,5 +104,15 @@ export var messages = defineMessages({
104
104
  id: 'fabric.linkPicker.button.save',
105
105
  defaultMessage: 'Save',
106
106
  description: 'Button to save edited link'
107
+ },
108
+ searchErrorHeader: {
109
+ id: 'fabric.linkPicker.search.error.heading',
110
+ defaultMessage: 'We’re having trouble loading data.',
111
+ description: 'Heading message shown when a search throws an error'
112
+ },
113
+ searchErrorDescription: {
114
+ id: 'fabric.linkPicker.search.error.description',
115
+ defaultMessage: 'Refresh the page, or contact <a>Atlassian Support</a> if this keeps happening.',
116
+ description: 'Describes possible actions when search throws an error'
107
117
  }
108
118
  });
@@ -64,11 +64,6 @@ var linkifyMatch = function linkifyMatch(text) {
64
64
 
65
65
  export var isSafeUrl = function isSafeUrl(url) {
66
66
  var urlTrimmed = url.trim();
67
-
68
- if (urlTrimmed.length === 0) {
69
- return true;
70
- }
71
-
72
67
  return whitelistedURLPatterns.some(function (p) {
73
68
  return p.test(urlTrimmed);
74
69
  });
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/link-picker",
3
- "version": "1.6.0",
3
+ "version": "1.7.1",
4
4
  "sideEffects": false
5
5
  }
@@ -0,0 +1,20 @@
1
+ /**
2
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
+ *
4
+ * Generates analytics utilities from the package analytics spec yaml
5
+ *
6
+ * @codegen <<SignedSource::0cc1b4d9c22b31491ded3e581114ab2c>>
7
+ * @codegenCommand yarn workspace @atlaskit/link-picker run codegen-analytics
8
+ */
9
+ declare type FormSubmittedLinkPickerAttributesType = {};
10
+ declare type AnalyticsEventAttributes = {
11
+ 'form.submitted.linkPicker': FormSubmittedLinkPickerAttributesType;
12
+ };
13
+ declare function createEventPayload<K extends keyof AnalyticsEventAttributes>(eventKey: K, attributes: AnalyticsEventAttributes[K]): {
14
+ eventType: string;
15
+ actionSubject: string;
16
+ action: string;
17
+ actionSubjectId: string;
18
+ attributes: AnalyticsEventAttributes[K];
19
+ };
20
+ export default createEventPayload;
@@ -0,0 +1,2 @@
1
+ export declare const ANALYTICS_CHANNEL = "media";
2
+ export declare const COMPONENT_NAME = "LinkPicker";
@@ -1,3 +1,3 @@
1
1
  export { ComposedLinkPicker as LinkPicker } from './ui';
2
2
  export type { LinkPickerProps } from './ui/link-picker';
3
- export type { LinkInputType, LinkPickerPlugin, LinkPickerState, LinkSearchListItemData, } from './ui/types';
3
+ export type { LinkInputType, LinkPickerPlugin, LinkPickerState, LinkSearchListItemData, LinkPickerPluginErrorFallback, } from './ui/types';
@@ -1,12 +1,13 @@
1
- import { PickerState } from '../../ui/link-picker';
2
- import { LinkPickerPlugin, LinkSearchListItemData } from '../../ui/types';
1
+ import { LinkPickerPlugin, LinkPickerPluginErrorFallback, LinkPickerState, LinkSearchListItemData } from '../../ui/types';
3
2
  export interface LinkPickerPluginsService {
4
- items: LinkSearchListItemData[];
3
+ items: LinkSearchListItemData[] | null;
5
4
  isLoading: boolean;
6
- isSelectedItem: boolean;
7
5
  isActivePlugin: boolean;
8
6
  tabs: {
9
7
  tabTitle: string;
10
8
  }[];
9
+ error: unknown | null;
10
+ retry: () => void;
11
+ errorFallback?: LinkPickerPluginErrorFallback;
11
12
  }
12
- export declare function usePlugins(state: PickerState, plugins?: LinkPickerPlugin[]): LinkPickerPluginsService;
13
+ export declare function usePlugins(state: LinkPickerState | null, activeTab: number, plugins?: LinkPickerPlugin[]): LinkPickerPluginsService;
@@ -0,0 +1,3 @@
1
+ import { LinkPickerState } from '../../ui/types';
2
+ import { PickerState } from '../../ui/link-picker';
3
+ export declare function useSearchQuery(state: PickerState): LinkPickerState | null;
@@ -1,6 +1,7 @@
1
1
  import { jsx } from '@emotion/react';
2
2
  import { LinkInputType, LinkPickerPlugin } from '../types';
3
3
  export declare const RECENT_SEARCH_LIST_SIZE = 5;
4
+ export declare const CONTACT_SUPPORT_LINK = "https://support.atlassian.com/contact/";
4
5
  export declare const testIds: {
5
6
  linkPicker: string;
6
7
  urlInputField: string;
@@ -17,6 +18,7 @@ export declare const testIds: {
17
18
  urlError: string;
18
19
  tabList: string;
19
20
  tabItem: string;
21
+ searchError: string;
20
22
  };
21
23
  interface Meta {
22
24
  /** Indicates how the link was picked. */
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { EmptyStateProps } from '@atlaskit/empty-state';
3
+ declare const LinkSearchError: (props: EmptyStateProps) => JSX.Element;
4
+ export default LinkSearchError;
@@ -104,4 +104,14 @@ export declare const messages: {
104
104
  defaultMessage: string;
105
105
  description: string;
106
106
  };
107
+ searchErrorHeader: {
108
+ id: string;
109
+ defaultMessage: string;
110
+ description: string;
111
+ };
112
+ searchErrorDescription: {
113
+ id: string;
114
+ defaultMessage: string;
115
+ description: string;
116
+ };
107
117
  };
@@ -1,4 +1,4 @@
1
- /// <reference types="react" />
1
+ import { ReactNode } from 'react';
2
2
  import { MessageDescriptor } from 'react-intl-next';
3
3
  export declare type LinkInputType = 'manual' | 'typeAhead';
4
4
  export interface LinkSearchListItemData {
@@ -36,9 +36,12 @@ export interface ResolveResult {
36
36
  data: LinkSearchListItemData[];
37
37
  }
38
38
  export interface LinkPickerPlugin {
39
+ resolve: (state: LinkPickerState) => Promise<ResolveResult> | AsyncGenerator<ResolveResult, ResolveResult>;
39
40
  /** Uniquely identify the tab */
40
41
  tabKey?: string;
41
42
  /** Human-readable label for the plugin */
42
43
  tabTitle?: string;
43
- resolve: (state: LinkPickerState) => Promise<ResolveResult> | AsyncGenerator<ResolveResult, ResolveResult>;
44
+ /** Render function to customise the UI that is displayed when an error occurs resolving results */
45
+ errorFallback?: LinkPickerPluginErrorFallback;
44
46
  }
47
+ export declare type LinkPickerPluginErrorFallback = (error: unknown, retry: () => void) => ReactNode;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/link-picker",
3
- "version": "1.6.0",
3
+ "version": "1.7.1",
4
4
  "description": "Standalone link picker",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "publishConfig": {
@@ -26,7 +26,8 @@
26
26
  ".": "./src/index.ts"
27
27
  },
28
28
  "scripts": {
29
- "ak-postbuild": "ls -d dist/* | grep -v dist/types | xargs -n 1 copyfiles -u 1 -V src/**/*.svg"
29
+ "ak-postbuild": "ls -d dist/* | grep -v dist/types | xargs -n 1 copyfiles -u 1 -V src/**/*.svg",
30
+ "codegen-analytics": "ts-node --project ../../../tsconfig.node.json ./scripts/build/codegen-analytics"
30
31
  },
31
32
  "dependencies": {
32
33
  "@atlaskit/analytics-next": "^8.3.1",
@@ -52,26 +53,31 @@
52
53
  "react-intl-next": "npm:react-intl@^5.18.1"
53
54
  },
54
55
  "devDependencies": {
56
+ "@af/codegen": "*",
55
57
  "@atlaskit/activity-provider": "^2.3.2",
56
58
  "@atlaskit/docs": "*",
57
- "@atlaskit/link-test-helpers": "^1.3.0",
58
- "@atlaskit/popup": "^1.3.5",
59
+ "@atlaskit/link-test-helpers": "^1.4.0",
60
+ "@atlaskit/popup": "^1.4.0",
59
61
  "@atlaskit/ssr": "*",
60
62
  "@atlaskit/toggle": "^12.4.0",
61
63
  "@atlaskit/visual-regression": "*",
62
64
  "@atlaskit/webdriver-runner": "*",
63
65
  "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
64
- "@atlassian/link-picker-atlassian-plugin": "^16.0.0",
65
- "@atlassian/link-picker-plugins": "^3.0.0",
66
+ "@atlassian/link-picker-atlassian-plugin": "^17.0.0",
67
+ "@atlassian/link-picker-plugins": "^4.0.0",
68
+ "@atlassian/recent-work-client": "^1.5.0",
66
69
  "@atlassian/search-provider": "^2.3.0",
67
70
  "@testing-library/dom": "^7.7.3",
68
71
  "@testing-library/jest-dom": "^4.1.0",
69
72
  "@testing-library/react": "^8.0.1",
70
73
  "@testing-library/react-hooks": "^1.0.4",
71
74
  "@testing-library/user-event": "10.4.0",
75
+ "@types/js-yaml": "^3.12.5",
72
76
  "enzyme": "^3.10.0",
73
77
  "fetch-mock": "^8.0.0",
78
+ "js-yaml": "^3.13.1",
74
79
  "mockdate": "^3.0.2",
80
+ "prettier": "^2.1.1",
75
81
  "react-dom": "^16.8.0",
76
82
  "sinon": "^2.2.0",
77
83
  "typescript": "4.2.4"
package/report.api.md CHANGED
@@ -1,36 +1,44 @@
1
- ## API Report File for "@atlaskit/link-picker"
1
+ ## API Report File for "@atlaskit/link-picker".
2
2
 
3
- > Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
3
+ > Do not edit this file. This report is auto-generated by [API Extractor](https://api-extractor.com/).
4
4
 
5
- ```ts
6
- /// <reference types="react" />
5
+ [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
7
6
 
7
+ ```ts
8
8
  import { MessageDescriptor } from 'react-intl-next';
9
9
  import { default as React_2 } from 'react';
10
- import { WithIntlProps } from 'react-intl-next';
11
- import { WrappedComponentProps } from 'react-intl-next';
10
+ import { ReactNode } from 'react';
12
11
 
13
12
  export declare type LinkInputType = 'manual' | 'typeAhead';
14
13
 
15
- export declare const LinkPicker: React_2.FC<
16
- WithIntlProps<WrappedComponentProps<'intl'> & LinkPickerProps>
17
- > & {
18
- WrappedComponent: React_2.ComponentType<
19
- WrappedComponentProps<'intl'> & LinkPickerProps
20
- >;
21
- };
14
+ export declare const LinkPicker: React_2.MemoExoticComponent<(
15
+ props: LinkPickerProps,
16
+ ) => JSX.Element>;
22
17
 
23
18
  export declare interface LinkPickerPlugin {
24
19
  resolve: (
25
20
  state: LinkPickerState,
26
21
  ) => Promise<ResolveResult> | AsyncGenerator<ResolveResult, ResolveResult>;
22
+ /** Uniquely identify the tab */
23
+ tabKey?: string;
24
+ /** Human-readable label for the plugin */
25
+ tabTitle?: string;
26
+ /** Render function to customise the UI that is displayed when an error occurs resolving results */
27
+ errorFallback?: LinkPickerPluginErrorFallback;
27
28
  }
28
29
 
30
+ export declare type LinkPickerPluginErrorFallback = (
31
+ error: unknown,
32
+ retry: () => void,
33
+ ) => ReactNode;
34
+
29
35
  export declare interface LinkPickerProps {
30
36
  /** Callback to fire on form submission. */
31
37
  onSubmit: (arg: OnSubmitParameter) => void;
32
38
  /** Callback to fire when the cancel button is clicked. */
33
39
  onCancel: () => void;
40
+ /** Callback to fire when content is changed inside the link picker e.g. items, when loading, tabs */
41
+ onContentResize?: () => void;
34
42
  /** The url of the linked resource for editing. */
35
43
  url?: string;
36
44
  /** The desired text to be displayed alternatively to the title of the linked resource for editing. */