@atlaskit/editor-plugin-block-controls 6.3.2 → 6.3.3

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 6.3.3
+
+### Patch Changes
+
+- [`6b6eca9cee16d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6b6eca9cee16d) -
+  Switch to use editorExperiment to use productKey for responsive preview panel changes.
+- Updated dependencies
+
 ## 6.3.2
 
 ### Patch Changes

package/dist/cjs/ui/drag-handle.js

@@ -238,7 +238,7 @@ var selectedStyles = (0, _react2.css)({
 // icon span receives dragStart event, instead of button, and since it is not registered as a draggable element
 // with pragmatic DnD and pragmatic DnD is not triggered
 var handleIconDragStart = function handleIconDragStart(e) {
-  if (!_browser.browser.chrome || !(0, _platformFeatureFlags.fg)('platform_editor_dnd_update_drag_start_target')) {
+  if (!_browser.browser.chrome) {
     return;
   }
   // prevent dragStart handler triggered by icon
@@ -881,7 +881,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
         css: [(0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? dragHandleButtonStyles : dragHandleButtonStylesOld, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && dragHandleColor,
         // ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
         // See https://product-fabric.atlassian.net/browse/ED-26266
-        _browser.browser.gecko && dragHandleMultiLineSelectionFixFirefox, (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) && (0, _experiments.editorExperiment)('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles],
+        _browser.browser.gecko && dragHandleMultiLineSelectionFixFirefox, (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true) && (0, _experiments.editorExperiment)('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles],
         ref: buttonRef
         // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         ,

package/dist/cjs/ui/global-styles.js

@@ -404,6 +404,8 @@ var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWra
     disabled: !(0, _expValEquals.expValEquals)('platform_editor_block_controls_perf_optimization', 'isEnabled', true)
   });
   return (0, _react.jsx)(_react.Global, {
-    styles: [globalStyles(), globalDnDStyle, (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedHoverZoneNext() : extendedHoverZone(), isDragging && ((0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedDragZoneNext : extendedDragZone), (0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? extendHoverZoneReducedNext : extendHoverZoneReduced : undefined, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? undefined : withInlineNodeStyle, (0, _experiments.editorExperiment)('platform_editor_block_control_optimise_render', true) ? quickInsertStyles : undefined, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, (0, _experiments.editorExperiment)('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? withRelativePosStyleNext : withRelativePosStyle, topLevelNodeMarginStyles, (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? withAnchorNameZindexStyleNext : withAnchorNameZindexStyle]
+    styles: [globalStyles(), globalDnDStyle, (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedHoverZoneNext() : extendedHoverZone(), isDragging && ((0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedDragZoneNext : extendedDragZone), (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
+      exposure: true
+    }) ? (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? extendHoverZoneReducedNext : extendHoverZoneReduced : undefined, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? undefined : withInlineNodeStyle, (0, _experiments.editorExperiment)('platform_editor_block_control_optimise_render', true) ? quickInsertStyles : undefined, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, (0, _experiments.editorExperiment)('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? withRelativePosStyleNext : withRelativePosStyle, topLevelNodeMarginStyles, (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ? withAnchorNameZindexStyleNext : withAnchorNameZindexStyle]
   });
 };

package/dist/cjs/ui/visibility-container.js

@@ -11,7 +11,7 @@ var _react2 = require("@emotion/react");
 var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _primitives = require("@atlaskit/primitives");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -53,7 +53,9 @@ var VisibilityContainer = exports.VisibilityContainer = function VisibilityConta
   var isEditing = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockControls.isEditing');
   var isMouseOut = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockControls.isMouseOut');
   var shouldHide = isTypeAheadOpen || isEditing || isMouseOut;
-  if ((0, _expValEquals.expValEquals)('platform_editor_preview_panel_responsiveness', 'isEnabled', true)) {
+  if ((0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true, {
+    exposure: true
+  })) {
     return (0, _react2.jsx)("div", {
       css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS]
     }, children);

package/dist/es2019/ui/drag-handle.js

@@ -233,7 +233,7 @@ const selectedStyles = css({
 // icon span receives dragStart event, instead of button, and since it is not registered as a draggable element
 // with pragmatic DnD and pragmatic DnD is not triggered
 const handleIconDragStart = e => {
-  if (!browser.chrome || !fg('platform_editor_dnd_update_drag_start_target')) {
+  if (!browser.chrome) {
     return;
   }
   // prevent dragStart handler triggered by icon
@@ -870,7 +870,7 @@ export const DragHandle = ({
     css: [editorExperiment('platform_editor_controls', 'variant1') ? dragHandleButtonStyles : dragHandleButtonStylesOld, editorExperiment('platform_editor_controls', 'variant1') && dragHandleColor,
     // ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
     // See https://product-fabric.atlassian.net/browse/ED-26266
-    browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, expValEqualsNoExposure('platform_editor_preview_panel_responsiveness', 'isEnabled', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles],
+    browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, editorExperiment('platform_editor_preview_panel_responsiveness', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles],
     ref: buttonRef
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,

package/dist/es2019/ui/global-styles.js

@@ -475,6 +475,8 @@ export const GlobalStylesWrapper = ({
     disabled: !expValEquals('platform_editor_block_controls_perf_optimization', 'isEnabled', true)
   });
   return jsx(Global, {
-    styles: [globalStyles(), globalDnDStyle, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedHoverZoneNext() : extendedHoverZone(), isDragging && (expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedDragZoneNext : extendedDragZone), expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendHoverZoneReducedNext : extendHoverZoneReduced : undefined, editorExperiment('platform_editor_controls', 'variant1') ? undefined : withInlineNodeStyle, editorExperiment('platform_editor_block_control_optimise_render', true) ? quickInsertStyles : undefined, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withRelativePosStyleNext : withRelativePosStyle, topLevelNodeMarginStyles, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withAnchorNameZindexStyleNext : withAnchorNameZindexStyle]
+    styles: [globalStyles(), globalDnDStyle, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedHoverZoneNext() : extendedHoverZone(), isDragging && (expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedDragZoneNext : extendedDragZone), editorExperiment('platform_editor_preview_panel_responsiveness', true, {
+      exposure: true
+    }) ? expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendHoverZoneReducedNext : extendHoverZoneReduced : undefined, editorExperiment('platform_editor_controls', 'variant1') ? undefined : withInlineNodeStyle, editorExperiment('platform_editor_block_control_optimise_render', true) ? quickInsertStyles : undefined, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withRelativePosStyleNext : withRelativePosStyle, topLevelNodeMarginStyles, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withAnchorNameZindexStyleNext : withAnchorNameZindexStyle]
   });
 };

package/dist/es2019/ui/visibility-container.js

@@ -10,7 +10,7 @@ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared
 import { akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 const baseStyles = xcss({
   transition: 'opacity 0.1s ease-in-out, visibility 0.1s ease-in-out'
 });
@@ -46,7 +46,9 @@ export const VisibilityContainer = ({
   const isEditing = useSharedPluginStateSelector(api, 'blockControls.isEditing');
   const isMouseOut = useSharedPluginStateSelector(api, 'blockControls.isMouseOut');
   const shouldHide = isTypeAheadOpen || isEditing || isMouseOut;
-  if (expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true)) {
+  if (editorExperiment('platform_editor_preview_panel_responsiveness', true, {
+    exposure: true
+  })) {
     return jsx("div", {
       css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS]
     }, children);

package/dist/esm/ui/drag-handle.js

@@ -235,7 +235,7 @@ var selectedStyles = css({
 // icon span receives dragStart event, instead of button, and since it is not registered as a draggable element
 // with pragmatic DnD and pragmatic DnD is not triggered
 var handleIconDragStart = function handleIconDragStart(e) {
-  if (!browser.chrome || !fg('platform_editor_dnd_update_drag_start_target')) {
+  if (!browser.chrome) {
     return;
   }
   // prevent dragStart handler triggered by icon
@@ -878,7 +878,7 @@ export var DragHandle = function DragHandle(_ref) {
         css: [editorExperiment('platform_editor_controls', 'variant1') ? dragHandleButtonStyles : dragHandleButtonStylesOld, editorExperiment('platform_editor_controls', 'variant1') && dragHandleColor,
         // ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
         // See https://product-fabric.atlassian.net/browse/ED-26266
-        browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, expValEqualsNoExposure('platform_editor_preview_panel_responsiveness', 'isEnabled', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles],
+        browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, editorExperiment('platform_editor_preview_panel_responsiveness', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles],
         ref: buttonRef
         // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
         ,

package/dist/esm/ui/global-styles.js

@@ -397,6 +397,8 @@ export var GlobalStylesWrapper = function GlobalStylesWrapper(_ref) {
     disabled: !expValEquals('platform_editor_block_controls_perf_optimization', 'isEnabled', true)
   });
   return jsx(Global, {
-    styles: [globalStyles(), globalDnDStyle, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedHoverZoneNext() : extendedHoverZone(), isDragging && (expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedDragZoneNext : extendedDragZone), expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true) ? expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendHoverZoneReducedNext : extendHoverZoneReduced : undefined, editorExperiment('platform_editor_controls', 'variant1') ? undefined : withInlineNodeStyle, editorExperiment('platform_editor_block_control_optimise_render', true) ? quickInsertStyles : undefined, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withRelativePosStyleNext : withRelativePosStyle, topLevelNodeMarginStyles, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withAnchorNameZindexStyleNext : withAnchorNameZindexStyle]
+    styles: [globalStyles(), globalDnDStyle, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedHoverZoneNext() : extendedHoverZone(), isDragging && (expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendedDragZoneNext : extendedDragZone), editorExperiment('platform_editor_preview_panel_responsiveness', true, {
+      exposure: true
+    }) ? expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? extendHoverZoneReducedNext : extendHoverZoneReduced : undefined, editorExperiment('platform_editor_controls', 'variant1') ? undefined : withInlineNodeStyle, editorExperiment('platform_editor_block_control_optimise_render', true) ? quickInsertStyles : undefined, withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, headingWithIndentationInLayoutStyleFix, editorExperiment('advanced_layouts', true) ? blockCardWithoutLayout : undefined, withDividerInPanelStyleFix, withFormatInLayoutStyleFix, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withRelativePosStyleNext : withRelativePosStyle, topLevelNodeMarginStyles, expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ? withAnchorNameZindexStyleNext : withAnchorNameZindexStyle]
   });
 };

package/dist/esm/ui/visibility-container.js

@@ -11,7 +11,7 @@ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared
 import { akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
 // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
 import { Box, xcss } from '@atlaskit/primitives';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 var baseStyles = xcss({
   transition: 'opacity 0.1s ease-in-out, visibility 0.1s ease-in-out'
 });
@@ -44,7 +44,9 @@ export var VisibilityContainer = function VisibilityContainer(_ref) {
   var isEditing = useSharedPluginStateSelector(api, 'blockControls.isEditing');
   var isMouseOut = useSharedPluginStateSelector(api, 'blockControls.isMouseOut');
   var shouldHide = isTypeAheadOpen || isEditing || isMouseOut;
-  if (expValEquals('platform_editor_preview_panel_responsiveness', 'isEnabled', true)) {
+  if (editorExperiment('platform_editor_preview_panel_responsiveness', true, {
+    exposure: true
+  })) {
     return jsx("div", {
       css: [baseStylesCSS, shouldHide ? hiddenStylesCSS : visibleStylesCSS]
     }, children);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "6.3.2",
+	"version": "6.3.3",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -52,7 +52,7 @@
 		"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
 		"@atlaskit/primitives": "^14.14.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^12.24.0",
+		"@atlaskit/tmp-editor-statsig": "^12.25.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@atlaskit/tooltip": "^20.4.0",
 		"@babel/runtime": "^7.0.0",
@@ -64,7 +64,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^109.8.0",
+		"@atlaskit/editor-common": "^109.10.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
@@ -114,9 +114,6 @@
 		"platform_editor_use_nested_table_pm_nodes": {
 			"type": "boolean"
 		},
-		"platform_editor_dnd_update_drag_start_target": {
-			"type": "boolean"
-		},
 		"platform_editor_track_node_types": {
 			"type": "boolean"
 		},