@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 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 = props.selectProps.menuListProps,
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 _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
16
- var _board = _interopRequireDefault(require("@atlaskit/icon/glyph/board"));
17
- var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
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
- "aria-label": "Search for fields",
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)(_standardButton.default, (0, _extends2.default)({}, tooltipProps, triggerProps, {
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
- } = props.selectProps.menuListProps;
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/standard-button';
12
- import BoardIcon from '@atlaskit/icon/glyph/board';
13
- import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
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
- "aria-label": "Search for fields",
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
- iconBefore: jsx("div", null, jsx(BoardIcon, {
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
- size: "medium"
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
- size: "medium"
135
- })),
136
- spacing: "compact",
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 = props.selectProps.menuListProps,
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/standard-button';
16
- import BoardIcon from '@atlaskit/icon/glyph/board';
17
- import ChevronDownIcon from '@atlaskit/icon/glyph/chevron-down';
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
- "aria-label": "Search for fields",
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.0",
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": "^17.19.0",
74
+ "@atlaskit/select": "^18.0.0",
75
75
  "@atlaskit/smart-card": "^29.0.0",
76
- "@atlaskit/smart-user-picker": "6.10.2",
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.2",
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",