@atlaskit/link-datasource 3.3.0 → 3.4.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 +20 -0
- package/dist/cjs/ui/common/modal/popup-select/index.js +3 -1
- package/dist/cjs/ui/common/modal/popup-select/menu-list/index.js +3 -1
- package/dist/cjs/ui/issue-like-table/column-picker/index.js +31 -15
- package/dist/es2019/ui/common/modal/popup-select/index.js +3 -1
- package/dist/es2019/ui/common/modal/popup-select/menu-list/index.js +3 -1
- package/dist/es2019/ui/issue-like-table/column-picker/index.js +27 -13
- package/dist/esm/ui/common/modal/popup-select/index.js +3 -1
- package/dist/esm/ui/common/modal/popup-select/menu-list/index.js +3 -1
- package/dist/esm/ui/issue-like-table/column-picker/index.js +30 -14
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,25 @@
|
|
|
1
1
|
# @atlaskit/link-datasource
|
|
2
2
|
|
|
3
|
+
## 3.4.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#143559](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/143559)
|
|
8
|
+
[`56dfbfe361f96`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/56dfbfe361f96) -
|
|
9
|
+
Upgrade react-select from 5.4 to 5.8 and replace it with internal atlaskit/react-select
|
|
10
|
+
- [#143559](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/143559)
|
|
11
|
+
[`56dfbfe361f96`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/56dfbfe361f96) -
|
|
12
|
+
Upgrade react-select from 5.4 to 5.8 and replace it with internal atlaskit/react-select
|
|
13
|
+
- Updated dependencies
|
|
14
|
+
|
|
15
|
+
## 3.4.0
|
|
16
|
+
|
|
17
|
+
### Minor Changes
|
|
18
|
+
|
|
19
|
+
- [#142758](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/142758)
|
|
20
|
+
[`3d186abad34e4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3d186abad34e4) -
|
|
21
|
+
Enable new icons behind a feature flag.
|
|
22
|
+
|
|
3
23
|
## 3.3.0
|
|
4
24
|
|
|
5
25
|
### Minor Changes
|
|
@@ -184,7 +184,9 @@ var FilterPopupSelect = exports.FilterPopupSelect = function FilterPopupSelect(_
|
|
|
184
184
|
shouldCloseMenuOnTab: false,
|
|
185
185
|
hideSelectedOptions: false,
|
|
186
186
|
isLoading: showLoading,
|
|
187
|
-
placeholder: formatMessage(_messages.asyncPopupSelectMessages.selectPlaceholder)
|
|
187
|
+
placeholder: formatMessage(_messages.asyncPopupSelectMessages.selectPlaceholder)
|
|
188
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
189
|
+
,
|
|
188
190
|
menuListProps: menuListProps,
|
|
189
191
|
components: {
|
|
190
192
|
Option: _select.CheckboxOption,
|
|
@@ -25,7 +25,9 @@ var showMoreButtonBoxStyles = (0, _primitives.xcss)({
|
|
|
25
25
|
var CustomMenuList = function CustomMenuList(_ref) {
|
|
26
26
|
var children = _ref.children,
|
|
27
27
|
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
28
|
-
var _props$selectProps$me =
|
|
28
|
+
var _props$selectProps$me =
|
|
29
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
30
|
+
props.selectProps.menuListProps,
|
|
29
31
|
filterName = _props$selectProps$me.filterName,
|
|
30
32
|
isLoading = _props$selectProps$me.isLoading,
|
|
31
33
|
isLoadingMore = _props$selectProps$me.isLoadingMore,
|
|
@@ -12,9 +12,10 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
12
12
|
var _react = require("react");
|
|
13
13
|
var _react2 = require("@emotion/react");
|
|
14
14
|
var _reactIntlNext = require("react-intl-next");
|
|
15
|
-
var
|
|
16
|
-
var _board = _interopRequireDefault(require("@atlaskit/icon/
|
|
17
|
-
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/
|
|
15
|
+
var _new = _interopRequireDefault(require("@atlaskit/button/new"));
|
|
16
|
+
var _board = _interopRequireDefault(require("@atlaskit/icon/core/migration/board"));
|
|
17
|
+
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
|
|
18
|
+
var _primitives = require("@atlaskit/primitives");
|
|
18
19
|
var _select = require("@atlaskit/select");
|
|
19
20
|
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
20
21
|
var _ufoExperiences = require("../../../analytics/ufoExperiences");
|
|
@@ -27,6 +28,10 @@ var _excluded = ["isOpen"];
|
|
|
27
28
|
* @jsx jsx
|
|
28
29
|
*/
|
|
29
30
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
31
|
+
var chevronIconStyles = (0, _primitives.xcss)({
|
|
32
|
+
display: 'flex',
|
|
33
|
+
alignItems: 'center'
|
|
34
|
+
});
|
|
30
35
|
var ColumnPicker = exports.ColumnPicker = function ColumnPicker(_ref) {
|
|
31
36
|
var columns = _ref.columns,
|
|
32
37
|
selectedColumnKeys = _ref.selectedColumnKeys,
|
|
@@ -130,7 +135,9 @@ var ColumnPicker = exports.ColumnPicker = function ColumnPicker(_ref) {
|
|
|
130
135
|
ignoreAccents: false
|
|
131
136
|
}),
|
|
132
137
|
options: allOptions,
|
|
133
|
-
value: selectedOptions
|
|
138
|
+
value: selectedOptions
|
|
139
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
140
|
+
,
|
|
134
141
|
onOpen: handleOpen,
|
|
135
142
|
closeMenuOnSelect: false,
|
|
136
143
|
hideSelectedOptions: false,
|
|
@@ -140,7 +147,7 @@ var ColumnPicker = exports.ColumnPicker = function ColumnPicker(_ref) {
|
|
|
140
147
|
isOptionDisabled: handleIsOptionDisabled,
|
|
141
148
|
placeholder: intl.formatMessage(_messages.columnPickerMessages.search),
|
|
142
149
|
onKeyDown: stopEscapePropagationWhenOpen,
|
|
143
|
-
|
|
150
|
+
label: "Search for fields",
|
|
144
151
|
onChange: handleChange,
|
|
145
152
|
isLoading: allOptions.length === 0,
|
|
146
153
|
target: function target(_ref8) {
|
|
@@ -149,19 +156,28 @@ var ColumnPicker = exports.ColumnPicker = function ColumnPicker(_ref) {
|
|
|
149
156
|
return (0, _react2.jsx)(_tooltip.default, {
|
|
150
157
|
content: intl.formatMessage(_messages.columnPickerMessages.tooltip)
|
|
151
158
|
}, function (tooltipProps) {
|
|
152
|
-
return (0, _react2.jsx)(
|
|
159
|
+
return (0, _react2.jsx)(_new.default, (0, _extends2.default)({}, tooltipProps, triggerProps, {
|
|
153
160
|
isSelected: isOpen,
|
|
154
|
-
iconBefore: (0, _react2.jsx)("div", null, (0, _react2.jsx)(_board.default, {
|
|
155
|
-
label: "board",
|
|
156
|
-
size: "medium"
|
|
157
|
-
}), (0, _react2.jsx)(_chevronDown.default, {
|
|
158
|
-
label: "down",
|
|
159
|
-
size: "medium"
|
|
160
|
-
})),
|
|
161
161
|
spacing: "compact",
|
|
162
162
|
appearance: "subtle",
|
|
163
|
-
testId: "column-picker-trigger-button"
|
|
164
|
-
|
|
163
|
+
testId: "column-picker-trigger-button",
|
|
164
|
+
iconBefore: function iconBefore() {
|
|
165
|
+
return (0, _react2.jsx)(_primitives.Box, {
|
|
166
|
+
as: "span",
|
|
167
|
+
xcss: chevronIconStyles
|
|
168
|
+
}, (0, _react2.jsx)(_board.default, {
|
|
169
|
+
color: "currentColor",
|
|
170
|
+
label: "board",
|
|
171
|
+
LEGACY_size: "medium",
|
|
172
|
+
spacing: "spacious",
|
|
173
|
+
LEGACY_margin: "0 0 0 4px"
|
|
174
|
+
}), (0, _react2.jsx)(_chevronDown.default, {
|
|
175
|
+
color: "currentColor",
|
|
176
|
+
label: "down",
|
|
177
|
+
LEGACY_size: "medium"
|
|
178
|
+
}));
|
|
179
|
+
}
|
|
180
|
+
}), '');
|
|
165
181
|
});
|
|
166
182
|
}
|
|
167
183
|
});
|
|
@@ -137,7 +137,9 @@ export const FilterPopupSelect = ({
|
|
|
137
137
|
shouldCloseMenuOnTab: false,
|
|
138
138
|
hideSelectedOptions: false,
|
|
139
139
|
isLoading: showLoading,
|
|
140
|
-
placeholder: formatMessage(asyncPopupSelectMessages.selectPlaceholder)
|
|
140
|
+
placeholder: formatMessage(asyncPopupSelectMessages.selectPlaceholder)
|
|
141
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
142
|
+
,
|
|
141
143
|
menuListProps: menuListProps,
|
|
142
144
|
components: {
|
|
143
145
|
Option: CheckboxOption,
|
|
@@ -26,7 +26,9 @@ const CustomMenuList = ({
|
|
|
26
26
|
errors,
|
|
27
27
|
showMore,
|
|
28
28
|
handleShowMore
|
|
29
|
-
} =
|
|
29
|
+
} =
|
|
30
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
31
|
+
props.selectProps.menuListProps;
|
|
30
32
|
const shouldDisplayShowMore = showMore && !isLoadingMore;
|
|
31
33
|
const isLoadingMoreData = !shouldDisplayShowMore && isLoadingMore;
|
|
32
34
|
const InlineSpinner = () => /*#__PURE__*/React.createElement(Flex, {
|
|
@@ -8,15 +8,20 @@ import { useCallback, useEffect, useRef, useState } from 'react';
|
|
|
8
8
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
9
9
|
import { jsx } from '@emotion/react';
|
|
10
10
|
import { useIntl } from 'react-intl-next';
|
|
11
|
-
import Button from '@atlaskit/button/
|
|
12
|
-
import BoardIcon from '@atlaskit/icon/
|
|
13
|
-
import ChevronDownIcon from '@atlaskit/icon/
|
|
11
|
+
import Button from '@atlaskit/button/new';
|
|
12
|
+
import BoardIcon from '@atlaskit/icon/core/migration/board';
|
|
13
|
+
import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
|
|
14
|
+
import { Box, xcss } from '@atlaskit/primitives';
|
|
14
15
|
import { CheckboxOption, createFilter, PopupSelect } from '@atlaskit/select';
|
|
15
16
|
import Tooltip from '@atlaskit/tooltip';
|
|
16
17
|
import { succeedUfoExperience } from '../../../analytics/ufoExperiences';
|
|
17
18
|
import { useDatasourceExperienceId } from '../../../contexts/datasource-experience-id';
|
|
18
19
|
import { ConcatenatedMenuList } from './concatenated-menu-list';
|
|
19
20
|
import { columnPickerMessages } from './messages';
|
|
21
|
+
const chevronIconStyles = xcss({
|
|
22
|
+
display: 'flex',
|
|
23
|
+
alignItems: 'center'
|
|
24
|
+
});
|
|
20
25
|
export const ColumnPicker = ({
|
|
21
26
|
columns,
|
|
22
27
|
selectedColumnKeys,
|
|
@@ -106,7 +111,9 @@ export const ColumnPicker = ({
|
|
|
106
111
|
ignoreAccents: false
|
|
107
112
|
}),
|
|
108
113
|
options: allOptions,
|
|
109
|
-
value: selectedOptions
|
|
114
|
+
value: selectedOptions
|
|
115
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
116
|
+
,
|
|
110
117
|
onOpen: handleOpen,
|
|
111
118
|
closeMenuOnSelect: false,
|
|
112
119
|
hideSelectedOptions: false,
|
|
@@ -116,7 +123,7 @@ export const ColumnPicker = ({
|
|
|
116
123
|
isOptionDisabled: handleIsOptionDisabled,
|
|
117
124
|
placeholder: intl.formatMessage(columnPickerMessages.search),
|
|
118
125
|
onKeyDown: stopEscapePropagationWhenOpen,
|
|
119
|
-
|
|
126
|
+
label: "Search for fields",
|
|
120
127
|
onChange: handleChange,
|
|
121
128
|
isLoading: allOptions.length === 0,
|
|
122
129
|
target: ({
|
|
@@ -126,16 +133,23 @@ export const ColumnPicker = ({
|
|
|
126
133
|
content: intl.formatMessage(columnPickerMessages.tooltip)
|
|
127
134
|
}, tooltipProps => jsx(Button, _extends({}, tooltipProps, triggerProps, {
|
|
128
135
|
isSelected: isOpen,
|
|
129
|
-
|
|
136
|
+
spacing: "compact",
|
|
137
|
+
appearance: "subtle",
|
|
138
|
+
testId: "column-picker-trigger-button",
|
|
139
|
+
iconBefore: () => jsx(Box, {
|
|
140
|
+
as: "span",
|
|
141
|
+
xcss: chevronIconStyles
|
|
142
|
+
}, jsx(BoardIcon, {
|
|
143
|
+
color: "currentColor",
|
|
130
144
|
label: "board",
|
|
131
|
-
|
|
145
|
+
LEGACY_size: "medium",
|
|
146
|
+
spacing: "spacious",
|
|
147
|
+
LEGACY_margin: "0 0 0 4px"
|
|
132
148
|
}), jsx(ChevronDownIcon, {
|
|
149
|
+
color: "currentColor",
|
|
133
150
|
label: "down",
|
|
134
|
-
|
|
135
|
-
}))
|
|
136
|
-
|
|
137
|
-
appearance: "subtle",
|
|
138
|
-
testId: "column-picker-trigger-button"
|
|
139
|
-
})))
|
|
151
|
+
LEGACY_size: "medium"
|
|
152
|
+
}))
|
|
153
|
+
}), ''))
|
|
140
154
|
});
|
|
141
155
|
};
|
|
@@ -174,7 +174,9 @@ export var FilterPopupSelect = function FilterPopupSelect(_ref) {
|
|
|
174
174
|
shouldCloseMenuOnTab: false,
|
|
175
175
|
hideSelectedOptions: false,
|
|
176
176
|
isLoading: showLoading,
|
|
177
|
-
placeholder: formatMessage(asyncPopupSelectMessages.selectPlaceholder)
|
|
177
|
+
placeholder: formatMessage(asyncPopupSelectMessages.selectPlaceholder)
|
|
178
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
179
|
+
,
|
|
178
180
|
menuListProps: menuListProps,
|
|
179
181
|
components: {
|
|
180
182
|
Option: CheckboxOption,
|
|
@@ -18,7 +18,9 @@ var showMoreButtonBoxStyles = xcss({
|
|
|
18
18
|
var CustomMenuList = function CustomMenuList(_ref) {
|
|
19
19
|
var children = _ref.children,
|
|
20
20
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
21
|
-
var _props$selectProps$me =
|
|
21
|
+
var _props$selectProps$me =
|
|
22
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
23
|
+
props.selectProps.menuListProps,
|
|
22
24
|
filterName = _props$selectProps$me.filterName,
|
|
23
25
|
isLoading = _props$selectProps$me.isLoading,
|
|
24
26
|
isLoadingMore = _props$selectProps$me.isLoadingMore,
|
|
@@ -12,15 +12,20 @@ import { useCallback, useEffect, useRef, useState } from 'react';
|
|
|
12
12
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
13
13
|
import { jsx } from '@emotion/react';
|
|
14
14
|
import { useIntl } from 'react-intl-next';
|
|
15
|
-
import Button from '@atlaskit/button/
|
|
16
|
-
import BoardIcon from '@atlaskit/icon/
|
|
17
|
-
import ChevronDownIcon from '@atlaskit/icon/
|
|
15
|
+
import Button from '@atlaskit/button/new';
|
|
16
|
+
import BoardIcon from '@atlaskit/icon/core/migration/board';
|
|
17
|
+
import ChevronDownIcon from '@atlaskit/icon/utility/migration/chevron-down';
|
|
18
|
+
import { Box, xcss } from '@atlaskit/primitives';
|
|
18
19
|
import { CheckboxOption, createFilter, PopupSelect } from '@atlaskit/select';
|
|
19
20
|
import Tooltip from '@atlaskit/tooltip';
|
|
20
21
|
import { succeedUfoExperience } from '../../../analytics/ufoExperiences';
|
|
21
22
|
import { useDatasourceExperienceId } from '../../../contexts/datasource-experience-id';
|
|
22
23
|
import { ConcatenatedMenuList } from './concatenated-menu-list';
|
|
23
24
|
import { columnPickerMessages } from './messages';
|
|
25
|
+
var chevronIconStyles = xcss({
|
|
26
|
+
display: 'flex',
|
|
27
|
+
alignItems: 'center'
|
|
28
|
+
});
|
|
24
29
|
export var ColumnPicker = function ColumnPicker(_ref) {
|
|
25
30
|
var columns = _ref.columns,
|
|
26
31
|
selectedColumnKeys = _ref.selectedColumnKeys,
|
|
@@ -124,7 +129,9 @@ export var ColumnPicker = function ColumnPicker(_ref) {
|
|
|
124
129
|
ignoreAccents: false
|
|
125
130
|
}),
|
|
126
131
|
options: allOptions,
|
|
127
|
-
value: selectedOptions
|
|
132
|
+
value: selectedOptions
|
|
133
|
+
// @ts-ignore - https://product-fabric.atlassian.net/browse/DSP-21000
|
|
134
|
+
,
|
|
128
135
|
onOpen: handleOpen,
|
|
129
136
|
closeMenuOnSelect: false,
|
|
130
137
|
hideSelectedOptions: false,
|
|
@@ -134,7 +141,7 @@ export var ColumnPicker = function ColumnPicker(_ref) {
|
|
|
134
141
|
isOptionDisabled: handleIsOptionDisabled,
|
|
135
142
|
placeholder: intl.formatMessage(columnPickerMessages.search),
|
|
136
143
|
onKeyDown: stopEscapePropagationWhenOpen,
|
|
137
|
-
|
|
144
|
+
label: "Search for fields",
|
|
138
145
|
onChange: handleChange,
|
|
139
146
|
isLoading: allOptions.length === 0,
|
|
140
147
|
target: function target(_ref8) {
|
|
@@ -145,17 +152,26 @@ export var ColumnPicker = function ColumnPicker(_ref) {
|
|
|
145
152
|
}, function (tooltipProps) {
|
|
146
153
|
return jsx(Button, _extends({}, tooltipProps, triggerProps, {
|
|
147
154
|
isSelected: isOpen,
|
|
148
|
-
iconBefore: jsx("div", null, jsx(BoardIcon, {
|
|
149
|
-
label: "board",
|
|
150
|
-
size: "medium"
|
|
151
|
-
}), jsx(ChevronDownIcon, {
|
|
152
|
-
label: "down",
|
|
153
|
-
size: "medium"
|
|
154
|
-
})),
|
|
155
155
|
spacing: "compact",
|
|
156
156
|
appearance: "subtle",
|
|
157
|
-
testId: "column-picker-trigger-button"
|
|
158
|
-
|
|
157
|
+
testId: "column-picker-trigger-button",
|
|
158
|
+
iconBefore: function iconBefore() {
|
|
159
|
+
return jsx(Box, {
|
|
160
|
+
as: "span",
|
|
161
|
+
xcss: chevronIconStyles
|
|
162
|
+
}, jsx(BoardIcon, {
|
|
163
|
+
color: "currentColor",
|
|
164
|
+
label: "board",
|
|
165
|
+
LEGACY_size: "medium",
|
|
166
|
+
spacing: "spacious",
|
|
167
|
+
LEGACY_margin: "0 0 0 4px"
|
|
168
|
+
}), jsx(ChevronDownIcon, {
|
|
169
|
+
color: "currentColor",
|
|
170
|
+
label: "down",
|
|
171
|
+
LEGACY_size: "medium"
|
|
172
|
+
}));
|
|
173
|
+
}
|
|
174
|
+
}), '');
|
|
159
175
|
});
|
|
160
176
|
}
|
|
161
177
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/link-datasource",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.4.1",
|
|
4
4
|
"description": "UI Components to support linking platform dataset feature",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -71,12 +71,12 @@
|
|
|
71
71
|
"@atlaskit/pragmatic-drag-and-drop-react-beautiful-dnd-autoscroll": "^1.2.0",
|
|
72
72
|
"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^1.1.0",
|
|
73
73
|
"@atlaskit/primitives": "^12.2.0",
|
|
74
|
-
"@atlaskit/select": "^
|
|
74
|
+
"@atlaskit/select": "^18.0.0",
|
|
75
75
|
"@atlaskit/smart-card": "^29.0.0",
|
|
76
|
-
"@atlaskit/smart-user-picker": "6.10.
|
|
76
|
+
"@atlaskit/smart-user-picker": "6.10.3",
|
|
77
77
|
"@atlaskit/spinner": "^16.3.0",
|
|
78
78
|
"@atlaskit/tag": "^12.6.0",
|
|
79
|
-
"@atlaskit/textfield": "6.5.
|
|
79
|
+
"@atlaskit/textfield": "6.5.3",
|
|
80
80
|
"@atlaskit/theme": "^13.0.0",
|
|
81
81
|
"@atlaskit/tokens": "^2.0.0",
|
|
82
82
|
"@atlaskit/tooltip": "^18.8.0",
|