@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.
- package/CHANGELOG.md +18 -0
- package/dist/cjs/analytics.codegen.js +28 -0
- package/dist/cjs/common/constants.js +10 -0
- package/dist/cjs/{ui/error-boundary-fallback → common}/generic-error-svg/index.js +0 -0
- package/dist/cjs/{ui/error-boundary-fallback → common}/generic-error-svg/styled.js +0 -0
- package/dist/cjs/services/use-plugins/index.js +32 -35
- package/dist/cjs/services/use-search-query/index.js +41 -0
- package/dist/cjs/ui/error-boundary-fallback/index.js +1 -1
- package/dist/cjs/ui/index.js +4 -4
- package/dist/cjs/ui/link-picker/index.js +68 -41
- package/dist/cjs/ui/link-picker/link-search-error/index.js +27 -0
- package/dist/cjs/ui/link-picker/messages.js +10 -0
- package/dist/cjs/ui/link-picker/url.js +0 -5
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/analytics.codegen.js +20 -0
- package/dist/es2019/common/constants.js +2 -0
- package/dist/es2019/{ui/error-boundary-fallback → common}/generic-error-svg/index.js +0 -0
- package/dist/es2019/{ui/error-boundary-fallback → common}/generic-error-svg/styled.js +0 -0
- package/dist/es2019/services/use-plugins/index.js +28 -38
- package/dist/es2019/services/use-search-query/index.js +32 -0
- package/dist/es2019/ui/error-boundary-fallback/index.js +1 -1
- package/dist/es2019/ui/index.js +1 -2
- package/dist/es2019/ui/link-picker/index.js +59 -40
- package/dist/es2019/ui/link-picker/link-search-error/index.js +10 -0
- package/dist/es2019/ui/link-picker/messages.js +10 -0
- package/dist/es2019/ui/link-picker/url.js +0 -5
- package/dist/es2019/version.json +1 -1
- package/dist/esm/analytics.codegen.js +20 -0
- package/dist/esm/common/constants.js +2 -0
- package/dist/esm/{ui/error-boundary-fallback → common}/generic-error-svg/index.js +0 -0
- package/dist/esm/{ui/error-boundary-fallback → common}/generic-error-svg/styled.js +0 -0
- package/dist/esm/services/use-plugins/index.js +33 -35
- package/dist/esm/services/use-search-query/index.js +32 -0
- package/dist/esm/ui/error-boundary-fallback/index.js +1 -1
- package/dist/esm/ui/index.js +1 -2
- package/dist/esm/ui/link-picker/index.js +61 -40
- package/dist/esm/ui/link-picker/link-search-error/index.js +14 -0
- package/dist/esm/ui/link-picker/messages.js +10 -0
- package/dist/esm/ui/link-picker/url.js +0 -5
- package/dist/esm/version.json +1 -1
- package/dist/types/analytics.codegen.d.ts +20 -0
- package/dist/types/common/constants.d.ts +2 -0
- package/dist/types/{ui/error-boundary-fallback → common}/generic-error-svg/index.d.ts +0 -0
- package/dist/types/{ui/error-boundary-fallback → common}/generic-error-svg/styled.d.ts +0 -0
- package/dist/types/index.d.ts +1 -1
- package/dist/types/services/use-plugins/index.d.ts +6 -5
- package/dist/types/services/use-search-query/index.d.ts +3 -0
- package/dist/types/ui/link-picker/index.d.ts +2 -0
- package/dist/types/ui/link-picker/link-search-error/index.d.ts +4 -0
- package/dist/types/ui/link-picker/messages.d.ts +10 -0
- package/dist/types/ui/types.d.ts +5 -2
- package/package.json +12 -6
- 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 {
|
|
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
|
-
|
|
98
|
+
invalidUrl = state.invalidUrl,
|
|
99
|
+
activeTab = state.activeTab;
|
|
88
100
|
var intl = useIntl();
|
|
101
|
+
var queryState = useSearchQuery(state);
|
|
89
102
|
|
|
90
|
-
var _usePlugins = usePlugins(
|
|
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(
|
|
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(
|
|
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
|
-
|
|
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,
|
|
225
|
+
}, [handleInsert, isSelectedItem, selectedItem, url]);
|
|
208
226
|
var linkPlaceHolder = isActivePlugin ? messages.placeholder : messages.linkPlaceholder;
|
|
209
|
-
var linkListTitle =
|
|
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 =
|
|
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
|
-
}),
|
|
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
|
});
|
package/dist/esm/version.json
CHANGED
|
@@ -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;
|
|
File without changes
|
|
File without changes
|
package/dist/types/index.d.ts
CHANGED
|
@@ -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 {
|
|
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:
|
|
13
|
+
export declare function usePlugins(state: LinkPickerState | null, activeTab: number, plugins?: LinkPickerPlugin[]): LinkPickerPluginsService;
|
|
@@ -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. */
|
|
@@ -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
|
};
|
package/dist/types/ui/types.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
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
|
-
|
|
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.
|
|
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.
|
|
58
|
-
"@atlaskit/popup": "^1.
|
|
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": "^
|
|
65
|
-
"@atlassian/link-picker-plugins": "^
|
|
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.
|
|
3
|
+
> Do not edit this file. This report is auto-generated by [API Extractor](https://api-extractor.com/).
|
|
4
4
|
|
|
5
|
-
|
|
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 {
|
|
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.
|
|
16
|
-
|
|
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. */
|