@atlaskit/editor-plugin-floating-toolbar 4.0.3 → 4.0.6
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 +25 -0
- package/dist/cjs/ui/Dropdown.js +4 -2
- package/dist/cjs/ui/Toolbar.js +14 -1
- package/dist/es2019/ui/Dropdown.js +4 -2
- package/dist/es2019/ui/Toolbar.js +14 -1
- package/dist/esm/ui/Dropdown.js +4 -2
- package/dist/esm/ui/Toolbar.js +14 -1
- package/dist/types/ui/Dropdown.d.ts +1 -0
- package/dist/types/ui/Toolbar.d.ts +1 -0
- package/dist/types-ts4.5/ui/Dropdown.d.ts +1 -0
- package/dist/types-ts4.5/ui/Toolbar.d.ts +1 -0
- package/package.json +13 -10
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,30 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-floating-toolbar
|
|
2
2
|
|
|
3
|
+
## 4.0.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 4.0.5
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#145321](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/145321)
|
|
14
|
+
[`2798c91b69bd9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2798c91b69bd9) -
|
|
15
|
+
[ux] ED-27537 Update dropdown to take in shouldFitContainer prop to fix dropdown content not
|
|
16
|
+
fitting for layout dropdown and add vr tests
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
19
|
+
## 4.0.4
|
|
20
|
+
|
|
21
|
+
### Patch Changes
|
|
22
|
+
|
|
23
|
+
- [#145307](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/145307)
|
|
24
|
+
[`64c485e3d2d32`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/64c485e3d2d32) -
|
|
25
|
+
[ux] Group AI buttons in Editor floating toolbar
|
|
26
|
+
- Updated dependencies
|
|
27
|
+
|
|
3
28
|
## 4.0.3
|
|
4
29
|
|
|
5
30
|
### Patch Changes
|
package/dist/cjs/ui/Dropdown.js
CHANGED
|
@@ -155,7 +155,8 @@ var Dropdown = exports.default = /*#__PURE__*/function (_Component) {
|
|
|
155
155
|
footer = _this$props2.footer,
|
|
156
156
|
onMount = _this$props2.onMount,
|
|
157
157
|
pulse = _this$props2.pulse,
|
|
158
|
-
spotlightConfig = _this$props2.spotlightConfig
|
|
158
|
+
spotlightConfig = _this$props2.spotlightConfig,
|
|
159
|
+
shouldFitContainer = _this$props2.shouldFitContainer;
|
|
159
160
|
var trigger;
|
|
160
161
|
if (icon) {
|
|
161
162
|
var TriggerIcon = hideExpandIcon ? icon : (0, _react2.jsx)(CompositeIcon, {
|
|
@@ -228,7 +229,8 @@ var Dropdown = exports.default = /*#__PURE__*/function (_Component) {
|
|
|
228
229
|
alignDropdownWithParentElement: alignDropdownWithToolbar,
|
|
229
230
|
arrowKeyNavigationProviderOptions: {
|
|
230
231
|
type: _uiMenu.ArrowKeyNavigationType.MENU
|
|
231
|
-
}
|
|
232
|
+
},
|
|
233
|
+
shouldFitContainer: shouldFitContainer
|
|
232
234
|
}, Array.isArray(options) ? this.renderArrayOptions(options) : typeof options === 'function' ? this.renderArrayOptions(this.makeArrayOptionsFromCallback(options)) : options.render({
|
|
233
235
|
hide: this.hide,
|
|
234
236
|
dispatchCommand: dispatchCommand
|
package/dist/cjs/ui/Toolbar.js
CHANGED
|
@@ -63,6 +63,12 @@ function groupItems(items) {
|
|
|
63
63
|
} else {
|
|
64
64
|
finalOutput.push(item);
|
|
65
65
|
}
|
|
66
|
+
} else if (item.type === 'separator' && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6')) {
|
|
67
|
+
var _items;
|
|
68
|
+
var isLeadingSeparator = i === 0;
|
|
69
|
+
var isTrailingSeparator = i === items.length - 1;
|
|
70
|
+
var isDuplicateSeparator = ((_items = items[i - 1]) === null || _items === void 0 ? void 0 : _items.type) === 'separator';
|
|
71
|
+
!isLeadingSeparator && !isTrailingSeparator && !isDuplicateSeparator && finalOutput.push(item);
|
|
66
72
|
} else {
|
|
67
73
|
finalOutput.push(item);
|
|
68
74
|
}
|
|
@@ -243,7 +249,8 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
|
|
|
243
249
|
footer: item.footer,
|
|
244
250
|
onMount: item.onMount,
|
|
245
251
|
onClick: item.onClick,
|
|
246
|
-
pulse: item.pulse
|
|
252
|
+
pulse: item.pulse,
|
|
253
|
+
shouldFitContainer: item.shouldFitContainer
|
|
247
254
|
});
|
|
248
255
|
case 'select':
|
|
249
256
|
if (item.selectType === 'list') {
|
|
@@ -334,6 +341,12 @@ var ToolbarItems = /*#__PURE__*/_react.default.memo(function (_ref) {
|
|
|
334
341
|
scrollable: scrollable
|
|
335
342
|
});
|
|
336
343
|
case 'separator':
|
|
344
|
+
if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6')) {
|
|
345
|
+
return item.fullHeight ? (0, _react2.jsx)(_ui.FloatingToolbarSeparator, {
|
|
346
|
+
key: idx,
|
|
347
|
+
fullHeight: true
|
|
348
|
+
}) : null;
|
|
349
|
+
}
|
|
337
350
|
return (0, _react2.jsx)(_ui.FloatingToolbarSeparator, {
|
|
338
351
|
key: idx,
|
|
339
352
|
fullHeight: item.fullHeight
|
|
@@ -135,7 +135,8 @@ export default class Dropdown extends Component {
|
|
|
135
135
|
footer,
|
|
136
136
|
onMount,
|
|
137
137
|
pulse,
|
|
138
|
-
spotlightConfig
|
|
138
|
+
spotlightConfig,
|
|
139
|
+
shouldFitContainer
|
|
139
140
|
} = this.props;
|
|
140
141
|
let trigger;
|
|
141
142
|
if (icon) {
|
|
@@ -209,7 +210,8 @@ export default class Dropdown extends Component {
|
|
|
209
210
|
alignDropdownWithParentElement: alignDropdownWithToolbar,
|
|
210
211
|
arrowKeyNavigationProviderOptions: {
|
|
211
212
|
type: ArrowKeyNavigationType.MENU
|
|
212
|
-
}
|
|
213
|
+
},
|
|
214
|
+
shouldFitContainer: shouldFitContainer
|
|
213
215
|
}, Array.isArray(options) ? this.renderArrayOptions(options) : typeof options === 'function' ? this.renderArrayOptions(this.makeArrayOptionsFromCallback(options)) : options.render({
|
|
214
216
|
hide: this.hide,
|
|
215
217
|
dispatchCommand
|
|
@@ -51,6 +51,12 @@ export function groupItems(items) {
|
|
|
51
51
|
} else {
|
|
52
52
|
finalOutput.push(item);
|
|
53
53
|
}
|
|
54
|
+
} else if (item.type === 'separator' && editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
|
|
55
|
+
var _items;
|
|
56
|
+
const isLeadingSeparator = i === 0;
|
|
57
|
+
const isTrailingSeparator = i === items.length - 1;
|
|
58
|
+
const isDuplicateSeparator = ((_items = items[i - 1]) === null || _items === void 0 ? void 0 : _items.type) === 'separator';
|
|
59
|
+
!isLeadingSeparator && !isTrailingSeparator && !isDuplicateSeparator && finalOutput.push(item);
|
|
54
60
|
} else {
|
|
55
61
|
finalOutput.push(item);
|
|
56
62
|
}
|
|
@@ -220,7 +226,8 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
|
|
|
220
226
|
footer: item.footer,
|
|
221
227
|
onMount: item.onMount,
|
|
222
228
|
onClick: item.onClick,
|
|
223
|
-
pulse: item.pulse
|
|
229
|
+
pulse: item.pulse,
|
|
230
|
+
shouldFitContainer: item.shouldFitContainer
|
|
224
231
|
});
|
|
225
232
|
case 'select':
|
|
226
233
|
if (item.selectType === 'list') {
|
|
@@ -307,6 +314,12 @@ const ToolbarItems = /*#__PURE__*/React.memo(({
|
|
|
307
314
|
scrollable: scrollable
|
|
308
315
|
});
|
|
309
316
|
case 'separator':
|
|
317
|
+
if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
|
|
318
|
+
return item.fullHeight ? jsx(Separator, {
|
|
319
|
+
key: idx,
|
|
320
|
+
fullHeight: true
|
|
321
|
+
}) : null;
|
|
322
|
+
}
|
|
310
323
|
return jsx(Separator, {
|
|
311
324
|
key: idx,
|
|
312
325
|
fullHeight: item.fullHeight
|
package/dist/esm/ui/Dropdown.js
CHANGED
|
@@ -150,7 +150,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
|
|
|
150
150
|
footer = _this$props2.footer,
|
|
151
151
|
onMount = _this$props2.onMount,
|
|
152
152
|
pulse = _this$props2.pulse,
|
|
153
|
-
spotlightConfig = _this$props2.spotlightConfig
|
|
153
|
+
spotlightConfig = _this$props2.spotlightConfig,
|
|
154
|
+
shouldFitContainer = _this$props2.shouldFitContainer;
|
|
154
155
|
var trigger;
|
|
155
156
|
if (icon) {
|
|
156
157
|
var TriggerIcon = hideExpandIcon ? icon : jsx(CompositeIcon, {
|
|
@@ -223,7 +224,8 @@ var Dropdown = /*#__PURE__*/function (_Component) {
|
|
|
223
224
|
alignDropdownWithParentElement: alignDropdownWithToolbar,
|
|
224
225
|
arrowKeyNavigationProviderOptions: {
|
|
225
226
|
type: ArrowKeyNavigationType.MENU
|
|
226
|
-
}
|
|
227
|
+
},
|
|
228
|
+
shouldFitContainer: shouldFitContainer
|
|
227
229
|
}, Array.isArray(options) ? this.renderArrayOptions(options) : typeof options === 'function' ? this.renderArrayOptions(this.makeArrayOptionsFromCallback(options)) : options.render({
|
|
228
230
|
hide: this.hide,
|
|
229
231
|
dispatchCommand: dispatchCommand
|
package/dist/esm/ui/Toolbar.js
CHANGED
|
@@ -56,6 +56,12 @@ export function groupItems(items) {
|
|
|
56
56
|
} else {
|
|
57
57
|
finalOutput.push(item);
|
|
58
58
|
}
|
|
59
|
+
} else if (item.type === 'separator' && editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
|
|
60
|
+
var _items;
|
|
61
|
+
var isLeadingSeparator = i === 0;
|
|
62
|
+
var isTrailingSeparator = i === items.length - 1;
|
|
63
|
+
var isDuplicateSeparator = ((_items = items[i - 1]) === null || _items === void 0 ? void 0 : _items.type) === 'separator';
|
|
64
|
+
!isLeadingSeparator && !isTrailingSeparator && !isDuplicateSeparator && finalOutput.push(item);
|
|
59
65
|
} else {
|
|
60
66
|
finalOutput.push(item);
|
|
61
67
|
}
|
|
@@ -236,7 +242,8 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
236
242
|
footer: item.footer,
|
|
237
243
|
onMount: item.onMount,
|
|
238
244
|
onClick: item.onClick,
|
|
239
|
-
pulse: item.pulse
|
|
245
|
+
pulse: item.pulse,
|
|
246
|
+
shouldFitContainer: item.shouldFitContainer
|
|
240
247
|
});
|
|
241
248
|
case 'select':
|
|
242
249
|
if (item.selectType === 'list') {
|
|
@@ -327,6 +334,12 @@ var ToolbarItems = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
327
334
|
scrollable: scrollable
|
|
328
335
|
});
|
|
329
336
|
case 'separator':
|
|
337
|
+
if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
|
|
338
|
+
return item.fullHeight ? jsx(Separator, {
|
|
339
|
+
key: idx,
|
|
340
|
+
fullHeight: true
|
|
341
|
+
}) : null;
|
|
342
|
+
}
|
|
330
343
|
return jsx(Separator, {
|
|
331
344
|
key: idx,
|
|
332
345
|
fullHeight: item.fullHeight
|
|
@@ -35,6 +35,7 @@ export interface Props {
|
|
|
35
35
|
/** If true, the component will have pulse onboarding effect around it. */
|
|
36
36
|
pulse?: boolean;
|
|
37
37
|
spotlightConfig?: FloatingToolbarButtonSpotlightConfig;
|
|
38
|
+
shouldFitContainer?: boolean;
|
|
38
39
|
}
|
|
39
40
|
export interface State {
|
|
40
41
|
isOpen: boolean;
|
|
@@ -30,6 +30,7 @@ export interface Props {
|
|
|
30
30
|
scrollable?: boolean;
|
|
31
31
|
api: ExtractInjectionAPI<FloatingToolbarPlugin> | undefined;
|
|
32
32
|
mediaAssistiveMessage?: string;
|
|
33
|
+
shouldFitContainer?: boolean;
|
|
33
34
|
}
|
|
34
35
|
type GroupedItems = (Item | Item[])[];
|
|
35
36
|
export declare function groupItems(items: Item[]): GroupedItems;
|
|
@@ -35,6 +35,7 @@ export interface Props {
|
|
|
35
35
|
/** If true, the component will have pulse onboarding effect around it. */
|
|
36
36
|
pulse?: boolean;
|
|
37
37
|
spotlightConfig?: FloatingToolbarButtonSpotlightConfig;
|
|
38
|
+
shouldFitContainer?: boolean;
|
|
38
39
|
}
|
|
39
40
|
export interface State {
|
|
40
41
|
isOpen: boolean;
|
|
@@ -30,6 +30,7 @@ export interface Props {
|
|
|
30
30
|
scrollable?: boolean;
|
|
31
31
|
api: ExtractInjectionAPI<FloatingToolbarPlugin> | undefined;
|
|
32
32
|
mediaAssistiveMessage?: string;
|
|
33
|
+
shouldFitContainer?: boolean;
|
|
33
34
|
}
|
|
34
35
|
type GroupedItems = (Item | Item[])[];
|
|
35
36
|
export declare function groupItems(items: Item[]): GroupedItems;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-floating-toolbar",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.6",
|
|
4
4
|
"description": "Floating toolbar plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"@atlaskit/adf-utils": "^19.19.0",
|
|
29
29
|
"@atlaskit/button": "^23.0.0",
|
|
30
|
-
"@atlaskit/checkbox": "^17.
|
|
31
|
-
"@atlaskit/editor-common": "^103.
|
|
30
|
+
"@atlaskit/checkbox": "^17.1.0",
|
|
31
|
+
"@atlaskit/editor-common": "^103.19.0",
|
|
32
32
|
"@atlaskit/editor-palette": "^2.1.0",
|
|
33
33
|
"@atlaskit/editor-plugin-context-panel": "^4.0.0",
|
|
34
34
|
"@atlaskit/editor-plugin-copy-button": "^2.0.0",
|
|
@@ -36,20 +36,20 @@
|
|
|
36
36
|
"@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
|
|
37
37
|
"@atlaskit/editor-plugin-editor-viewmode": "^3.1.0",
|
|
38
38
|
"@atlaskit/editor-plugin-emoji": "^3.6.0",
|
|
39
|
-
"@atlaskit/editor-plugin-extension": "^5.
|
|
39
|
+
"@atlaskit/editor-plugin-extension": "^5.3.0",
|
|
40
40
|
"@atlaskit/editor-plugin-interaction": "^1.0.0",
|
|
41
|
-
"@atlaskit/editor-plugin-table": "^10.
|
|
41
|
+
"@atlaskit/editor-plugin-table": "^10.9.0",
|
|
42
42
|
"@atlaskit/editor-plugin-user-intent": "^0.1.0",
|
|
43
43
|
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
44
|
-
"@atlaskit/emoji": "^69.
|
|
44
|
+
"@atlaskit/emoji": "^69.1.0",
|
|
45
45
|
"@atlaskit/icon": "^25.6.0",
|
|
46
|
-
"@atlaskit/menu": "^
|
|
46
|
+
"@atlaskit/menu": "^4.0.0",
|
|
47
47
|
"@atlaskit/modal-dialog": "^14.1.0",
|
|
48
48
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
49
49
|
"@atlaskit/primitives": "^14.4.0",
|
|
50
|
-
"@atlaskit/select": "^20.
|
|
50
|
+
"@atlaskit/select": "^20.4.0",
|
|
51
51
|
"@atlaskit/theme": "^18.0.0",
|
|
52
|
-
"@atlaskit/tmp-editor-statsig": "^4.
|
|
52
|
+
"@atlaskit/tmp-editor-statsig": "^4.15.0",
|
|
53
53
|
"@atlaskit/tokens": "^4.8.0",
|
|
54
54
|
"@atlaskit/tooltip": "^20.0.0",
|
|
55
55
|
"@babel/runtime": "^7.0.0",
|
|
@@ -65,7 +65,7 @@
|
|
|
65
65
|
"react-dom": "^18.2.0"
|
|
66
66
|
},
|
|
67
67
|
"devDependencies": {
|
|
68
|
-
"@atlaskit/visual-regression": "
|
|
68
|
+
"@atlaskit/visual-regression": "workspace:^",
|
|
69
69
|
"@testing-library/dom": "^10.1.0",
|
|
70
70
|
"@testing-library/react": "^13.4.0",
|
|
71
71
|
"@testing-library/user-event": "^14.4.3",
|
|
@@ -141,6 +141,9 @@
|
|
|
141
141
|
},
|
|
142
142
|
"platform_editor_user_intent_plugin": {
|
|
143
143
|
"type": "boolean"
|
|
144
|
+
},
|
|
145
|
+
"platform_editor_controls_patch_6": {
|
|
146
|
+
"type": "boolean"
|
|
144
147
|
}
|
|
145
148
|
}
|
|
146
149
|
}
|