@atlaskit/editor-plugin-block-controls 13.2.15 → 13.2.17

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 (9) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/cjs/ui/drag-handle.js +4 -2
  3. package/dist/cjs/ui/visibility-container.js +12 -5
  4. package/dist/es2019/ui/drag-handle.js +4 -2
  5. package/dist/es2019/ui/visibility-container.js +12 -5
  6. package/dist/esm/ui/drag-handle.js +4 -2
  7. package/dist/esm/ui/visibility-container.js +12 -5
  8. package/dist/types/ui/visibility-container.d.ts +5 -1
  9. package/package.json +11 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 13.2.17
4
+
5
+ ### Patch Changes
6
+
7
+ - [`161922d5b8cee`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/161922d5b8cee) -
8
+ Fix editor tooltips affected by inline top-layer rendering. Table cell menu tooltips are no longer
9
+ constrained by the button background selector, and layout column drag handles now own their
10
+ wrapper layout without flattening the tooltip's visual surface.
11
+ - Updated dependencies
12
+
13
+ ## 13.2.16
14
+
15
+ ### Patch Changes
16
+
17
+ - Updated dependencies
18
+
3
19
  ## 13.2.15
4
20
 
5
21
  ### Patch Changes
package/dist/cjs/ui/drag-handle.js CHANGED
@@ -1177,7 +1177,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
1177
1177
  }, (0, _react2.jsx)(_tooltip.default, {
1178
1178
  content: tooltipContent,
1179
1179
  ignoreTooltipPointerEvents: true,
1180
- position: 'top'
1180
+ position: 'top',
1181
+ tag: (0, _platformFeatureFlags.fg)('platform-dst-top-layer-tooltip') ? 'span' : 'div'
1181
1182
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
1182
1183
  ,
1183
1184
  onShow: function onShow() {
@@ -1264,7 +1265,8 @@ var DragHandleWithVisibility = exports.DragHandleWithVisibility = function DragH
1264
1265
  return (0, _react2.jsx)(_visibilityContainer.VisibilityContainer, {
1265
1266
  api: api,
1266
1267
  controlSide: !isLayoutColumn && !skipControlSideRestriction && rightSideControlsEnabled ? 'left' : undefined,
1267
- forceVisibleOnMouseOut: (0, _expValEquals.expValEquals)('platform_editor_drag_handle_keyboard_a11y', 'isEnabled', true) && !!(handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused)
1268
+ forceVisibleOnMouseOut: (0, _expValEquals.expValEquals)('platform_editor_drag_handle_keyboard_a11y', 'isEnabled', true) && !!(handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused),
1269
+ shouldUseDisplayContents: isLayoutColumn && (0, _platformFeatureFlags.fg)('platform-dst-top-layer-tooltip')
1268
1270
  }, (0, _react2.jsx)(DragHandle, {
1269
1271
  view: view,
1270
1272
  api: api,
package/dist/cjs/ui/visibility-container.js CHANGED
@@ -37,6 +37,9 @@ var hiddenStyles = (0, _primitives.xcss)({
37
37
  opacity: 0,
38
38
  visibility: 'hidden'
39
39
  });
40
+ var displayContentsStyles = (0, _primitives.xcss)({
41
+ display: 'contents'
42
+ });
40
43
  var baseStylesCSS = (0, _react2.css)((0, _defineProperty2.default)({
41
44
  transition: 'opacity 0.1s ease-in-out, visibility 0.1s ease-in-out'
42
45
  }, "@container editor-area (max-width: ".concat(_editorSharedStyles.akEditorFullPageNarrowBreakout, "px)"), {
@@ -51,11 +54,15 @@ var hiddenStylesCSS = (0, _react2.css)({
51
54
  opacity: 0,
52
55
  visibility: 'hidden'
53
56
  });
57
+ var displayContentsStylesCSS = (0, _react2.css)({
58
+ display: 'contents'
59
+ });
54
60
  var VisibilityContainer = exports.VisibilityContainer = function VisibilityContainer(_ref) {
55
61
  var api = _ref.api,
56
62
  children = _ref.children,
57
63
  controlSide = _ref.controlSide,
58
- forceVisibleOnMouseOut = _ref.forceVisibleOnMouseOut;
64
+ forceVisibleOnMouseOut = _ref.forceVisibleOnMouseOut,
65
+ shouldUseDisplayContents = _ref.shouldUseDisplayContents;
59
66
  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['typeAhead', 'blockControls', 'editorViewMode', 'userIntent'], function (states) {
60
67
  var _states$typeAheadStat, _states$blockControls, _states$blockControls2, _states$blockControls3, _states$editorViewMod, _states$userIntentSta, _states$blockControls4;
61
68
  return {
@@ -128,12 +135,12 @@ var VisibilityContainer = exports.VisibilityContainer = function VisibilityConta
128
135
  exposure: true
129
136
  })) {
130
137
  return (0, _react2.jsx)("div", {
131
- css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS]
138
+ css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS, shouldUseDisplayContents && displayContentsStylesCSS]
132
139
  }, children);
133
140
  }
134
-
141
+ return (0, _react2.jsx)(_primitives.Box
135
142
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
136
- return (0, _react2.jsx)(_primitives.Box, {
137
- xcss: [baseStyles, shouldHide ? hiddenStyles : visibleStyles]
143
+ , {
144
+ xcss: [baseStyles, shouldHide ? hiddenStyles : visibleStyles, shouldUseDisplayContents && displayContentsStyles]
138
145
  }, children);
139
146
  };
package/dist/es2019/ui/drag-handle.js CHANGED
@@ -1154,7 +1154,8 @@ export const DragHandle = ({
1154
1154
  }, jsx(Tooltip, {
1155
1155
  content: tooltipContent,
1156
1156
  ignoreTooltipPointerEvents: true,
1157
- position: 'top'
1157
+ position: 'top',
1158
+ tag: fg('platform-dst-top-layer-tooltip') ? 'span' : 'div'
1158
1159
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
1159
1160
  ,
1160
1161
  onShow: () => {
@@ -1237,7 +1238,8 @@ export const DragHandleWithVisibility = ({
1237
1238
  return jsx(VisibilityContainer, {
1238
1239
  api: api,
1239
1240
  controlSide: !isLayoutColumn && !skipControlSideRestriction && rightSideControlsEnabled ? 'left' : undefined,
1240
- forceVisibleOnMouseOut: expValEquals('platform_editor_drag_handle_keyboard_a11y', 'isEnabled', true) && !!(handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused)
1241
+ forceVisibleOnMouseOut: expValEquals('platform_editor_drag_handle_keyboard_a11y', 'isEnabled', true) && !!(handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused),
1242
+ shouldUseDisplayContents: isLayoutColumn && fg('platform-dst-top-layer-tooltip')
1241
1243
  }, jsx(DragHandle, {
1242
1244
  view: view,
1243
1245
  api: api,
package/dist/es2019/ui/visibility-container.js CHANGED
@@ -24,6 +24,9 @@ const hiddenStyles = xcss({
24
24
  opacity: 0,
25
25
  visibility: 'hidden'
26
26
  });
27
+ const displayContentsStyles = xcss({
28
+ display: 'contents'
29
+ });
27
30
  const baseStylesCSS = css({
28
31
  transition: 'opacity 0.1s ease-in-out, visibility 0.1s ease-in-out',
29
32
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-container-queries, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
@@ -40,11 +43,15 @@ const hiddenStylesCSS = css({
40
43
  opacity: 0,
41
44
  visibility: 'hidden'
42
45
  });
46
+ const displayContentsStylesCSS = css({
47
+ display: 'contents'
48
+ });
43
49
  export const VisibilityContainer = ({
44
50
  api,
45
51
  children,
46
52
  controlSide,
47
- forceVisibleOnMouseOut
53
+ forceVisibleOnMouseOut,
54
+ shouldUseDisplayContents
48
55
  }) => {
49
56
  const {
50
57
  isTypeAheadOpen,
@@ -116,12 +123,12 @@ export const VisibilityContainer = ({
116
123
  exposure: true
117
124
  })) {
118
125
  return jsx("div", {
119
- css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS]
126
+ css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS, shouldUseDisplayContents && displayContentsStylesCSS]
120
127
  }, children);
121
128
  }
122
-
129
+ return jsx(Box
123
130
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
124
- return jsx(Box, {
125
- xcss: [baseStyles, shouldHide ? hiddenStyles : visibleStyles]
131
+ , {
132
+ xcss: [baseStyles, shouldHide ? hiddenStyles : visibleStyles, shouldUseDisplayContents && displayContentsStyles]
126
133
  }, children);
127
134
  };
package/dist/esm/ui/drag-handle.js CHANGED
@@ -1173,7 +1173,8 @@ export var DragHandle = function DragHandle(_ref) {
1173
1173
  }, jsx(Tooltip, {
1174
1174
  content: tooltipContent,
1175
1175
  ignoreTooltipPointerEvents: true,
1176
- position: 'top'
1176
+ position: 'top',
1177
+ tag: fg('platform-dst-top-layer-tooltip') ? 'span' : 'div'
1177
1178
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
1178
1179
  ,
1179
1180
  onShow: function onShow() {
@@ -1260,7 +1261,8 @@ export var DragHandleWithVisibility = function DragHandleWithVisibility(_ref1) {
1260
1261
  return jsx(VisibilityContainer, {
1261
1262
  api: api,
1262
1263
  controlSide: !isLayoutColumn && !skipControlSideRestriction && rightSideControlsEnabled ? 'left' : undefined,
1263
- forceVisibleOnMouseOut: expValEquals('platform_editor_drag_handle_keyboard_a11y', 'isEnabled', true) && !!(handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused)
1264
+ forceVisibleOnMouseOut: expValEquals('platform_editor_drag_handle_keyboard_a11y', 'isEnabled', true) && !!(handleOptions !== null && handleOptions !== void 0 && handleOptions.isFocused),
1265
+ shouldUseDisplayContents: isLayoutColumn && fg('platform-dst-top-layer-tooltip')
1264
1266
  }, jsx(DragHandle, {
1265
1267
  view: view,
1266
1268
  api: api,
package/dist/esm/ui/visibility-container.js CHANGED
@@ -26,6 +26,9 @@ var hiddenStyles = xcss({
26
26
  opacity: 0,
27
27
  visibility: 'hidden'
28
28
  });
29
+ var displayContentsStyles = xcss({
30
+ display: 'contents'
31
+ });
29
32
  var baseStylesCSS = css(_defineProperty({
30
33
  transition: 'opacity 0.1s ease-in-out, visibility 0.1s ease-in-out'
31
34
  }, "@container editor-area (max-width: ".concat(akEditorFullPageNarrowBreakout, "px)"), {
@@ -40,11 +43,15 @@ var hiddenStylesCSS = css({
40
43
  opacity: 0,
41
44
  visibility: 'hidden'
42
45
  });
46
+ var displayContentsStylesCSS = css({
47
+ display: 'contents'
48
+ });
43
49
  export var VisibilityContainer = function VisibilityContainer(_ref) {
44
50
  var api = _ref.api,
45
51
  children = _ref.children,
46
52
  controlSide = _ref.controlSide,
47
- forceVisibleOnMouseOut = _ref.forceVisibleOnMouseOut;
53
+ forceVisibleOnMouseOut = _ref.forceVisibleOnMouseOut,
54
+ shouldUseDisplayContents = _ref.shouldUseDisplayContents;
48
55
  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['typeAhead', 'blockControls', 'editorViewMode', 'userIntent'], function (states) {
49
56
  var _states$typeAheadStat, _states$blockControls, _states$blockControls2, _states$blockControls3, _states$editorViewMod, _states$userIntentSta, _states$blockControls4;
50
57
  return {
@@ -117,12 +124,12 @@ export var VisibilityContainer = function VisibilityContainer(_ref) {
117
124
  exposure: true
118
125
  })) {
119
126
  return jsx("div", {
120
- css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS]
127
+ css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS, shouldUseDisplayContents && displayContentsStylesCSS]
121
128
  }, children);
122
129
  }
123
-
130
+ return jsx(Box
124
131
  // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
125
- return jsx(Box, {
126
- xcss: [baseStyles, shouldHide ? hiddenStyles : visibleStyles]
132
+ , {
133
+ xcss: [baseStyles, shouldHide ? hiddenStyles : visibleStyles, shouldUseDisplayContents && displayContentsStyles]
127
134
  }, children);
128
135
  };
package/dist/types/ui/visibility-container.d.ts CHANGED
@@ -11,6 +11,10 @@ interface VisibilityContainerProps {
11
11
  children: React.ReactNode;
12
12
  controlSide?: 'left' | 'right';
13
13
  forceVisibleOnMouseOut?: boolean;
14
+ /**
15
+ * Set when the container should not create its own layout box while its descendants retain theirs.
16
+ */
17
+ shouldUseDisplayContents?: boolean;
14
18
  }
15
- export declare const VisibilityContainer: ({ api, children, controlSide, forceVisibleOnMouseOut, }: VisibilityContainerProps) => jsx.JSX.Element;
19
+ export declare const VisibilityContainer: ({ api, children, controlSide, forceVisibleOnMouseOut, shouldUseDisplayContents, }: VisibilityContainerProps) => jsx.JSX.Element;
16
20
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "13.2.15",
3
+ "version": "13.2.17",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -20,7 +20,7 @@
20
20
  ],
21
21
  "atlaskit:src": "src/index.ts",
22
22
  "dependencies": {
23
- "@atlaskit/browser-apis": "^1.1.0",
23
+ "@atlaskit/browser-apis": "^1.2.0",
24
24
  "@atlaskit/button": "^24.3.0",
25
25
  "@atlaskit/editor-plugin-accessibility-utils": "^12.0.0",
26
26
  "@atlaskit/editor-plugin-analytics": "^12.0.0",
@@ -42,14 +42,14 @@
42
42
  "@atlaskit/icon": "^37.1.0",
43
43
  "@atlaskit/icon-lab": "^7.4.0",
44
44
  "@atlaskit/link": "^4.3.0",
45
- "@atlaskit/platform-feature-flags": "^2.0.0",
45
+ "@atlaskit/platform-feature-flags": "^2.1.0",
46
46
  "@atlaskit/pragmatic-drag-and-drop": "^2.0.0",
47
47
  "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^3.0.0",
48
48
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^4.1.0",
49
- "@atlaskit/primitives": "^22.0.0",
49
+ "@atlaskit/primitives": "^22.1.0",
50
50
  "@atlaskit/theme": "^26.1.0",
51
- "@atlaskit/tmp-editor-statsig": "^130.0.0",
52
- "@atlaskit/tokens": "^16.1.0",
51
+ "@atlaskit/tmp-editor-statsig": "^132.0.0",
52
+ "@atlaskit/tokens": "^16.2.0",
53
53
  "@atlaskit/tooltip": "^23.1.0",
54
54
  "@babel/runtime": "^7.0.0",
55
55
  "@emotion/react": "^11.7.1",
@@ -59,7 +59,7 @@
59
59
  "uuid": "^3.1.0"
60
60
  },
61
61
  "peerDependencies": {
62
- "@atlaskit/editor-common": "^116.33.0",
62
+ "@atlaskit/editor-common": "^116.35.0",
63
63
  "react": "^18.2.0",
64
64
  "react-dom": "^18.2.0",
65
65
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
@@ -133,6 +133,10 @@
133
133
  "platform_editor_layout_column_menu_kill_switch_1": {
134
134
  "type": "boolean",
135
135
  "referenceOnly": true
136
+ },
137
+ "platform-dst-top-layer-tooltip": {
138
+ "type": "boolean",
139
+ "referenceOnly": true
136
140
  }
137
141
  },
138
142
  "devDependencies": {