@atlaskit/editor-common 87.6.1 → 87.6.2

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/editor-common
 
+## 87.6.2
+
+### Patch Changes
+
+- [#128785](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/128785)
+  [`175fd06e412c2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/175fd06e412c2) -
+  [ux] Increase bodied macro padding to account for new editor resize controller future feature
+- [#128413](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/128413)
+  [`2df8a92126a8d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2df8a92126a8d) -
+  [ux] We are testing input behavior change inside of an extension body. Now when attempting to
+  register inputs, like typing, from an element inside an extension body, it should not accidently
+  instead register in the editor body. If this fix is successful it will be available in a later
+  release.
+
 ## 87.6.1
 
 ### Patch Changes

package/dist/cjs/extensibility/Extension/Extension/index.js

@@ -83,7 +83,8 @@ function ExtensionWithPluginState(props) {
     'without-frame': removeBorder
   });
   var newContentClassNames = (0, _classnames2.default)({
-    'with-padding-styles': showMacroInteractionDesignUpdates
+    'with-padding-styles': showMacroInteractionDesignUpdates,
+    'with-bodied-padding-styles': hasBody && showMacroInteractionDesignUpdates
   });
   var contentClassNames = (0, _classnames2.default)('extension-content', 'block', {
     'remove-border': showMacroInteractionDesignUpdates

package/dist/cjs/extensibility/Extension/Extension/styles.js

@@ -74,6 +74,10 @@ var contentWrapper = exports.contentWrapper = (0, _react.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-padding-styles': {
     padding: "var(--ds-space-100, 8px)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '&.with-bodied-padding-styles': {
+    padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-250, 20px)") // account for upcoming editor elements drag & drop feature
   }
 });
 

package/dist/cjs/extensibility/MultiBodiedExtension/styles.js

@@ -44,7 +44,7 @@ var mbeExtensionWrapperCSSStyles = exports.mbeExtensionWrapperCSSStyles = (0, _r
   },
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-padding-background-styles': {
-    padding: "var(--ds-space-100, 8px)",
+    padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-250, 20px)"),
     background: 'transparent'
   }
 });

package/dist/cjs/extensibility/extensionNodeView.js

@@ -12,6 +12,7 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _react = _interopRequireDefault(require("react"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _reactNodeView = _interopRequireDefault(require("../react-node-view"));
 var _Extension = require("./Extension");
 var _ExtensionNodeWrapper = require("./ExtensionNodeWrapper");
@@ -38,6 +39,18 @@ var ExtensionNode = exports.ExtensionNode = /*#__PURE__*/function (_ReactNodeVie
       // children a chance to recalc
       return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
     }
+
+    // When interacting with input elements inside an extension's body, the events
+    // bubble up to the editor and get handled by it. This almost always gets in the way
+    // of being able to actually interact with said input in the extension, i.e.
+    // typing inside a text field (in an extension body) will print the text in the editor
+    // content area instead. This change prevents the editor view from trying to handle these events,
+    // when the target of the event is an input element, so the extension can.
+  }, {
+    key: "stopEvent",
+    value: function stopEvent(event) {
+      return event.target instanceof HTMLInputElement && (0, _platformFeatureFlags.fg)('cc_page_experiences_live_search_wysiwyg');
+    }
   }, {
     key: "getContentDOM",
     value: function getContentDOM() {

package/dist/cjs/monitoring/error.js

@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "87.6.1";
+var packageVersion = "87.6.2";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/cjs/ui/DropList/index.js

@@ -23,7 +23,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "87.6.1";
+var packageVersion = "87.6.2";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/es2019/extensibility/Extension/Extension/index.js

@@ -75,7 +75,8 @@ function ExtensionWithPluginState(props) {
     'without-frame': removeBorder
   });
   const newContentClassNames = classnames({
-    'with-padding-styles': showMacroInteractionDesignUpdates
+    'with-padding-styles': showMacroInteractionDesignUpdates,
+    'with-bodied-padding-styles': hasBody && showMacroInteractionDesignUpdates
   });
   const contentClassNames = classnames('extension-content', 'block', {
     'remove-border': showMacroInteractionDesignUpdates

package/dist/es2019/extensibility/Extension/Extension/styles.js

@@ -67,6 +67,10 @@ export const contentWrapper = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-padding-styles': {
     padding: "var(--ds-space-100, 8px)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '&.with-bodied-padding-styles': {
+    padding: `${"var(--ds-space-100, 8px)"} ${"var(--ds-space-250, 20px)"}` // account for upcoming editor elements drag & drop feature
   }
 });
 

package/dist/es2019/extensibility/MultiBodiedExtension/styles.js

@@ -38,7 +38,7 @@ export const mbeExtensionWrapperCSSStyles = css(wrapperDefault, {
   },
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-padding-background-styles': {
-    padding: "var(--ds-space-100, 8px)",
+    padding: `${"var(--ds-space-100, 8px)"} ${"var(--ds-space-250, 20px)"}`,
     background: 'transparent'
   }
 });

package/dist/es2019/extensibility/extensionNodeView.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import ReactNodeView from '../react-node-view';
 import { Extension } from './Extension';
 import { ExtensionNodeWrapper } from './ExtensionNodeWrapper';
@@ -15,6 +16,16 @@ export class ExtensionNode extends ReactNodeView {
     // children a chance to recalc
     return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
   }
+
+  // When interacting with input elements inside an extension's body, the events
+  // bubble up to the editor and get handled by it. This almost always gets in the way
+  // of being able to actually interact with said input in the extension, i.e.
+  // typing inside a text field (in an extension body) will print the text in the editor
+  // content area instead. This change prevents the editor view from trying to handle these events,
+  // when the target of the event is an input element, so the extension can.
+  stopEvent(event) {
+    return event.target instanceof HTMLInputElement && fg('cc_page_experiences_live_search_wysiwyg');
+  }
   getContentDOM() {
     if (this.node.isInline) {
       return;

package/dist/es2019/monitoring/error.js

@@ -1,7 +1,7 @@
 import { isFedRamp } from './environment';
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "87.6.1";
+const packageVersion = "87.6.2";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/es2019/ui/DropList/index.js

@@ -12,7 +12,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "87.6.1";
+const packageVersion = "87.6.2";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/esm/extensibility/Extension/Extension/index.js

@@ -75,7 +75,8 @@ function ExtensionWithPluginState(props) {
     'without-frame': removeBorder
   });
   var newContentClassNames = classnames({
-    'with-padding-styles': showMacroInteractionDesignUpdates
+    'with-padding-styles': showMacroInteractionDesignUpdates,
+    'with-bodied-padding-styles': hasBody && showMacroInteractionDesignUpdates
   });
   var contentClassNames = classnames('extension-content', 'block', {
     'remove-border': showMacroInteractionDesignUpdates

package/dist/esm/extensibility/Extension/Extension/styles.js

@@ -67,6 +67,10 @@ export var contentWrapper = css({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-padding-styles': {
     padding: "var(--ds-space-100, 8px)"
+  },
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
+  '&.with-bodied-padding-styles': {
+    padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-250, 20px)") // account for upcoming editor elements drag & drop feature
   }
 });
 

package/dist/esm/extensibility/MultiBodiedExtension/styles.js

@@ -38,7 +38,7 @@ export var mbeExtensionWrapperCSSStyles = css(wrapperDefault, {
   },
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '&.with-padding-background-styles': {
-    padding: "var(--ds-space-100, 8px)",
+    padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-250, 20px)"),
     background: 'transparent'
   }
 });

package/dist/esm/extensibility/extensionNodeView.js

@@ -6,6 +6,7 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 import React from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import ReactNodeView from '../react-node-view';
 import { Extension } from './Extension';
 import { ExtensionNodeWrapper } from './ExtensionNodeWrapper';
@@ -30,6 +31,18 @@ export var ExtensionNode = /*#__PURE__*/function (_ReactNodeView) {
       // children a chance to recalc
       return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
     }
+
+    // When interacting with input elements inside an extension's body, the events
+    // bubble up to the editor and get handled by it. This almost always gets in the way
+    // of being able to actually interact with said input in the extension, i.e.
+    // typing inside a text field (in an extension body) will print the text in the editor
+    // content area instead. This change prevents the editor view from trying to handle these events,
+    // when the target of the event is an input element, so the extension can.
+  }, {
+    key: "stopEvent",
+    value: function stopEvent(event) {
+      return event.target instanceof HTMLInputElement && fg('cc_page_experiences_live_search_wysiwyg');
+    }
   }, {
     key: "getContentDOM",
     value: function getContentDOM() {

package/dist/esm/monitoring/error.js

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { isFedRamp } from './environment';
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "87.6.1";
+var packageVersion = "87.6.2";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/esm/ui/DropList/index.js

@@ -20,7 +20,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "87.6.1";
+var packageVersion = "87.6.2";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var DropList = /*#__PURE__*/function (_Component) {

package/dist/types/extensibility/extensionNodeView.d.ts

@@ -17,6 +17,7 @@ export declare class ExtensionNode extends ReactNodeView {
         type: 'selection';
         target: Element;
     }): boolean;
+    stopEvent(event: Event): boolean;
     getContentDOM(): {
         dom: HTMLDivElement;
     } | undefined;

package/dist/types-ts4.5/extensibility/extensionNodeView.d.ts

@@ -17,6 +17,7 @@ export declare class ExtensionNode extends ReactNodeView {
         type: 'selection';
         target: Element;
     }): boolean;
+    stopEvent(event: Event): boolean;
     getContentDOM(): {
         dom: HTMLDivElement;
     } | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "87.6.1",
+	"version": "87.6.2",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -268,6 +268,9 @@
 		},
 		"platform_editor_migration_icon_and_typography": {
 			"type": "boolean"
+		},
+		"cc_page_experiences_live_search_wysiwyg": {
+			"type": "boolean"
 		}
 	}
 }