@atlaskit/editor-core 185.1.6 → 185.2.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/editor-core
 
+## 185.2.0
+
+### Minor Changes
+
+- [`66adfa8cd12`](https://bitbucket.org/atlassian/atlassian-frontend/commits/66adfa8cd12) - [ux] Passthru editor feature flags props into the Appearance content area so it's able to setup styles which rely on feature flags
+
 ## 185.1.6
 
 ### Patch Changes

package/dist/cjs/ui/Appearance/Chromeless.js

@@ -58,7 +58,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
         popupsScrollableElement = _this$props.popupsScrollableElement,
         disabled = _this$props.disabled,
         dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
-        pluginHooks = _this$props.pluginHooks;
+        pluginHooks = _this$props.pluginHooks,
+        featureFlags = _this$props.featureFlags;
       var maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
       return (0, _react2.jsx)(_WithFlash.default, {
         animate: maxContentSizeReached
@@ -69,7 +70,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
           return _this.containerElement = _ref2;
         }
       }, (0, _react2.jsx)(ContentArea, {
-        className: "ak-editor-content-area"
+        className: "ak-editor-content-area",
+        featureFlags: featureFlags
       }, customContentComponents, (0, _react2.jsx)(_PluginSlot.default, {
         editorView: editorView,
         editorActions: editorActions,

package/dist/cjs/ui/Appearance/Comment/Comment.js

@@ -93,7 +93,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
         dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
         intl = _this$props.intl,
         useStickyToolbar = _this$props.useStickyToolbar,
-        pluginHooks = _this$props.pluginHooks;
+        pluginHooks = _this$props.pluginHooks,
+        featureFlags = _this$props.featureFlags;
       var maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
       var showSecondaryToolbar = !!onSave || !!onCancel || !!customSecondaryToolbarComponents;
       var isShortcutToFocusToolbar = function isShortcutToFocusToolbar(event) {
@@ -150,7 +151,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
           css: maxHeight ? (0, _react2.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n                            max-height: ", "px;\n                          "])), maxHeight) : null,
           className: (0, _classnames.default)('ak-editor-content-area', {
             'less-margin': width < _editorSharedStyles.akEditorMobileBreakoutPoint
-          })
+          }),
+          featureFlags: featureFlags
         }, customContentComponents, (0, _react2.jsx)(_PluginSlot.default, {
           editorView: editorView,
           editorActions: editorActions,

package/dist/cjs/ui/Appearance/FullPage/FullPage.js

@@ -133,7 +133,8 @@ var FullPageEditor = /*#__PURE__*/function (_React$Component) {
         scrollContainer: this.scrollContainer,
         scrollContainerRef: this.scrollContainerRef,
         wrapperElement: this.wrapperElementRef.current,
-        pluginHooks: props.pluginHooks
+        pluginHooks: props.pluginHooks,
+        featureFlags: this.featureFlags
       })));
     }
   }]);

package/dist/cjs/ui/Appearance/FullPage/FullPageContentArea.js

@@ -30,7 +30,8 @@ var Content = /*#__PURE__*/_react2.default.memo(function (props) {
         "data-testid": CONTENT_AREA_TEST_ID
       }, (0, _react.jsx)(_StyledComponents.ScrollContainer, {
         ref: props.scrollContainerRef,
-        className: "fabric-editor-popup-scroll-parent"
+        className: "fabric-editor-popup-scroll-parent",
+        featureFlags: props.featureFlags
       }, (0, _react.jsx)(_Addon.ClickAreaBlock, {
         editorView: props.editorView,
         editorDisabled: props.disabled

package/dist/cjs/ui/Appearance/Mobile.js

@@ -25,13 +25,15 @@ function Mobile(_ref) {
     popupsBoundariesElement = _ref.popupsBoundariesElement,
     popupsScrollableElement = _ref.popupsScrollableElement,
     innerRef = _ref.innerRef,
-    pluginHooks = _ref.pluginHooks;
+    pluginHooks = _ref.pluginHooks,
+    featureFlags = _ref.featureFlags;
   return /*#__PURE__*/_react.default.createElement(_Mobile.MobileAppearance, {
     ref: innerRef,
     editorView: editorView || null,
     maxHeight: maxHeight,
     persistScrollGutter: persistScrollGutter,
-    editorDisabled: disabled
+    editorDisabled: disabled,
+    featureFlags: featureFlags
   }, editorDOMElement, /*#__PURE__*/_react.default.createElement(_PluginSlot.default, {
     editorView: editorView,
     editorActions: editorActions,

package/dist/cjs/ui/AppearanceComponents/Mobile.js

@@ -26,7 +26,8 @@ var MobileAppearance = /*#__PURE__*/(0, _react.forwardRef)(function MobileAppear
   var editorView = _ref.editorView,
     persistScrollGutter = _ref.persistScrollGutter,
     children = _ref.children,
-    editorDisabled = _ref.editorDisabled;
+    editorDisabled = _ref.editorDisabled,
+    featureFlags = _ref.featureFlags;
   var render = (0, _react.useCallback)(function (_ref2) {
     var maxContentSize = _ref2.maxContentSize,
       mobileDimensions = _ref2.mobileDimensions;
@@ -67,10 +68,12 @@ var MobileAppearance = /*#__PURE__*/(0, _react.forwardRef)(function MobileAppear
       persistScrollGutter: persistScrollGutter,
       isExpanded: currentIsExpanded,
       editorDisabled: editorDisabled
-    }, (0, _react2.jsx)(ContentArea, null, (0, _react2.jsx)("div", {
+    }, (0, _react2.jsx)(ContentArea, {
+      featureFlags: featureFlags
+    }, (0, _react2.jsx)("div", {
       className: "ak-editor-content-area"
     }, children)))));
-  }, [children, editorView, persistScrollGutter, editorDisabled, ref]);
+  }, [children, editorView, persistScrollGutter, editorDisabled, ref, featureFlags]);
   return (0, _react2.jsx)(_WithPluginState.default, {
     plugins: {
       maxContentSize: _maxContentSize.pluginKey,

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

@@ -51,13 +51,15 @@ var contentStyles = function contentStyles(props) {
 var createEditorContentStyle = function createEditorContentStyle(styles) {
   return /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     var className = props.className,
-      children = props.children;
+      children = props.children,
+      featureFlags = props.featureFlags;
     var theme = (0, _react2.useTheme)();
     var memoizedStyle = (0, _react.useMemo)(function () {
       return contentStyles({
-        theme: theme
+        theme: theme,
+        featureFlags: featureFlags
       });
-    }, [theme]);
+    }, [theme, featureFlags]);
     return (0, _react2.jsx)("div", {
       className: className,
       ref: ref,

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "185.1.6";
+var version = "185.2.0";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.1.6",
+	"version": "185.2.0",
 	"sideEffects": false
 }

package/dist/es2019/ui/Appearance/Chromeless.js

@@ -55,7 +55,8 @@ export default class Editor extends React.Component {
         popupsScrollableElement,
         disabled,
         dispatchAnalyticsEvent,
-        pluginHooks
+        pluginHooks,
+        featureFlags
       } = this.props;
       const maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
       return jsx(WithFlash, {
@@ -69,7 +70,8 @@ export default class Editor extends React.Component {
         "data-testid": "chromeless-editor",
         ref: ref => this.containerElement = ref
       }, jsx(ContentArea, {
-        className: "ak-editor-content-area"
+        className: "ak-editor-content-area",
+        featureFlags: featureFlags
       }, customContentComponents, jsx(PluginSlot, {
         editorView: editorView,
         editorActions: editorActions,

package/dist/es2019/ui/Appearance/Comment/Comment.js

@@ -119,7 +119,8 @@ class Editor extends React.Component {
         dispatchAnalyticsEvent,
         intl,
         useStickyToolbar,
-        pluginHooks
+        pluginHooks,
+        featureFlags
       } = this.props;
       const maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
       const showSecondaryToolbar = !!onSave || !!onCancel || !!customSecondaryToolbarComponents;
@@ -180,7 +181,8 @@ class Editor extends React.Component {
                           ` : null,
           className: classnames('ak-editor-content-area', {
             'less-margin': width < akEditorMobileBreakoutPoint
-          })
+          }),
+          featureFlags: featureFlags
         }, customContentComponents, jsx(PluginSlot, {
           editorView: editorView,
           editorActions: editorActions,

package/dist/es2019/ui/Appearance/FullPage/FullPage.js

@@ -114,7 +114,8 @@ export class FullPageEditor extends React.Component {
       scrollContainer: this.scrollContainer,
       scrollContainerRef: this.scrollContainerRef,
       wrapperElement: this.wrapperElementRef.current,
-      pluginHooks: props.pluginHooks
+      pluginHooks: props.pluginHooks,
+      featureFlags: this.featureFlags
     })));
   }
 }

package/dist/es2019/ui/Appearance/FullPage/FullPageContentArea.js

@@ -22,7 +22,8 @@ const Content = /*#__PURE__*/React.memo(props => {
     "data-testid": CONTENT_AREA_TEST_ID
   }, jsx(ScrollContainer, {
     ref: props.scrollContainerRef,
-    className: "fabric-editor-popup-scroll-parent"
+    className: "fabric-editor-popup-scroll-parent",
+    featureFlags: props.featureFlags
   }, jsx(ClickAreaBlock, {
     editorView: props.editorView,
     editorDisabled: props.disabled

package/dist/es2019/ui/Appearance/Mobile.js

@@ -17,7 +17,8 @@ export default function Mobile({
   popupsBoundariesElement,
   popupsScrollableElement,
   innerRef,
-  pluginHooks
+  pluginHooks,
+  featureFlags
 }) {
   var _innerRef$current;
   return /*#__PURE__*/React.createElement(MobileAppearance, {
@@ -25,7 +26,8 @@ export default function Mobile({
     editorView: editorView || null,
     maxHeight: maxHeight,
     persistScrollGutter: persistScrollGutter,
-    editorDisabled: disabled
+    editorDisabled: disabled,
+    featureFlags: featureFlags
   }, editorDOMElement, /*#__PURE__*/React.createElement(PluginSlot, {
     editorView: editorView,
     editorActions: editorActions,

package/dist/es2019/ui/AppearanceComponents/Mobile.js

@@ -27,7 +27,8 @@ export const MobileAppearance = /*#__PURE__*/forwardRef(function MobileAppearanc
   editorView,
   persistScrollGutter,
   children,
-  editorDisabled
+  editorDisabled,
+  featureFlags
 }, ref) {
   const render = useCallback(({
     maxContentSize,
@@ -72,10 +73,12 @@ export const MobileAppearance = /*#__PURE__*/forwardRef(function MobileAppearanc
       persistScrollGutter: persistScrollGutter,
       isExpanded: currentIsExpanded,
       editorDisabled: editorDisabled
-    }, jsx(ContentArea, null, jsx("div", {
+    }, jsx(ContentArea, {
+      featureFlags: featureFlags
+    }, jsx("div", {
       className: "ak-editor-content-area"
     }, children)))));
-  }, [children, editorView, persistScrollGutter, editorDisabled, ref]);
+  }, [children, editorView, persistScrollGutter, editorDisabled, ref, featureFlags]);
   return jsx(WithPluginState, {
     plugins: {
       maxContentSize: maxContentSizePluginKey,

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

@@ -161,12 +161,14 @@ export const createEditorContentStyle = styles => {
   return /*#__PURE__*/React.forwardRef((props, ref) => {
     const {
       className,
-      children
+      children,
+      featureFlags
     } = props;
     const theme = useTheme();
     const memoizedStyle = useMemo(() => contentStyles({
-      theme
-    }), [theme]);
+      theme,
+      featureFlags
+    }), [theme, featureFlags]);
     return jsx("div", {
       className: className,
       ref: ref,

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "185.1.6";
+export const version = "185.2.0";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.1.6",
+	"version": "185.2.0",
 	"sideEffects": false
 }

package/dist/esm/ui/Appearance/Chromeless.js

@@ -51,7 +51,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
         popupsScrollableElement = _this$props.popupsScrollableElement,
         disabled = _this$props.disabled,
         dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
-        pluginHooks = _this$props.pluginHooks;
+        pluginHooks = _this$props.pluginHooks,
+        featureFlags = _this$props.featureFlags;
       var maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
       return jsx(WithFlash, {
         animate: maxContentSizeReached
@@ -62,7 +63,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
           return _this.containerElement = _ref2;
         }
       }, jsx(ContentArea, {
-        className: "ak-editor-content-area"
+        className: "ak-editor-content-area",
+        featureFlags: featureFlags
       }, customContentComponents, jsx(PluginSlot, {
         editorView: editorView,
         editorActions: editorActions,

package/dist/esm/ui/Appearance/Comment/Comment.js

@@ -86,7 +86,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
         dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
         intl = _this$props.intl,
         useStickyToolbar = _this$props.useStickyToolbar,
-        pluginHooks = _this$props.pluginHooks;
+        pluginHooks = _this$props.pluginHooks,
+        featureFlags = _this$props.featureFlags;
       var maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
       var showSecondaryToolbar = !!onSave || !!onCancel || !!customSecondaryToolbarComponents;
       var isShortcutToFocusToolbar = function isShortcutToFocusToolbar(event) {
@@ -143,7 +144,8 @@ var Editor = /*#__PURE__*/function (_React$Component) {
           css: maxHeight ? css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n                            max-height: ", "px;\n                          "])), maxHeight) : null,
           className: classnames('ak-editor-content-area', {
             'less-margin': width < akEditorMobileBreakoutPoint
-          })
+          }),
+          featureFlags: featureFlags
         }, customContentComponents, jsx(PluginSlot, {
           editorView: editorView,
           editorActions: editorActions,

package/dist/esm/ui/Appearance/FullPage/FullPage.js

@@ -127,7 +127,8 @@ export var FullPageEditor = /*#__PURE__*/function (_React$Component) {
         scrollContainer: this.scrollContainer,
         scrollContainerRef: this.scrollContainerRef,
         wrapperElement: this.wrapperElementRef.current,
-        pluginHooks: props.pluginHooks
+        pluginHooks: props.pluginHooks,
+        featureFlags: this.featureFlags
       })));
     }
   }]);

package/dist/esm/ui/Appearance/FullPage/FullPageContentArea.js

@@ -22,7 +22,8 @@ var Content = /*#__PURE__*/React.memo(function (props) {
         "data-testid": CONTENT_AREA_TEST_ID
       }, jsx(ScrollContainer, {
         ref: props.scrollContainerRef,
-        className: "fabric-editor-popup-scroll-parent"
+        className: "fabric-editor-popup-scroll-parent",
+        featureFlags: props.featureFlags
       }, jsx(ClickAreaBlock, {
         editorView: props.editorView,
         editorDisabled: props.disabled

package/dist/esm/ui/Appearance/Mobile.js

@@ -18,13 +18,15 @@ export default function Mobile(_ref) {
     popupsBoundariesElement = _ref.popupsBoundariesElement,
     popupsScrollableElement = _ref.popupsScrollableElement,
     innerRef = _ref.innerRef,
-    pluginHooks = _ref.pluginHooks;
+    pluginHooks = _ref.pluginHooks,
+    featureFlags = _ref.featureFlags;
   return /*#__PURE__*/React.createElement(MobileAppearance, {
     ref: innerRef,
     editorView: editorView || null,
     maxHeight: maxHeight,
     persistScrollGutter: persistScrollGutter,
-    editorDisabled: disabled
+    editorDisabled: disabled,
+    featureFlags: featureFlags
   }, editorDOMElement, /*#__PURE__*/React.createElement(PluginSlot, {
     editorView: editorView,
     editorActions: editorActions,

package/dist/esm/ui/AppearanceComponents/Mobile.js

@@ -16,7 +16,8 @@ export var MobileAppearance = /*#__PURE__*/forwardRef(function MobileAppearance(
   var editorView = _ref.editorView,
     persistScrollGutter = _ref.persistScrollGutter,
     children = _ref.children,
-    editorDisabled = _ref.editorDisabled;
+    editorDisabled = _ref.editorDisabled,
+    featureFlags = _ref.featureFlags;
   var render = useCallback(function (_ref2) {
     var maxContentSize = _ref2.maxContentSize,
       mobileDimensions = _ref2.mobileDimensions;
@@ -57,10 +58,12 @@ export var MobileAppearance = /*#__PURE__*/forwardRef(function MobileAppearance(
       persistScrollGutter: persistScrollGutter,
       isExpanded: currentIsExpanded,
       editorDisabled: editorDisabled
-    }, jsx(ContentArea, null, jsx("div", {
+    }, jsx(ContentArea, {
+      featureFlags: featureFlags
+    }, jsx("div", {
       className: "ak-editor-content-area"
     }, children)))));
-  }, [children, editorView, persistScrollGutter, editorDisabled, ref]);
+  }, [children, editorView, persistScrollGutter, editorDisabled, ref, featureFlags]);
   return jsx(WithPluginState, {
     plugins: {
       maxContentSize: maxContentSizePluginKey,

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

@@ -41,13 +41,15 @@ var contentStyles = function contentStyles(props) {
 export var createEditorContentStyle = function createEditorContentStyle(styles) {
   return /*#__PURE__*/React.forwardRef(function (props, ref) {
     var className = props.className,
-      children = props.children;
+      children = props.children,
+      featureFlags = props.featureFlags;
     var theme = useTheme();
     var memoizedStyle = useMemo(function () {
       return contentStyles({
-        theme: theme
+        theme: theme,
+        featureFlags: featureFlags
       });
-    }, [theme]);
+    }, [theme, featureFlags]);
     return jsx("div", {
       className: className,
       ref: ref,

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "185.1.6";
+export var version = "185.2.0";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.1.6",
+	"version": "185.2.0",
 	"sideEffects": false
 }

package/dist/types/ui/Appearance/FullPage/FullPageContentArea.d.ts

@@ -7,6 +7,7 @@ import { EventDispatcher } from '../../../event-dispatcher';
 import { ReactComponents, EditorAppearance, UIComponentFactory } from '../../../types';
 import { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { ReactHookFactory } from '@atlaskit/editor-common/types';
+import type { FeatureFlags } from '../../../types/feature-flags';
 interface FullPageEditorContentAreaProps {
     appearance: EditorAppearance | undefined;
     contentArea: HTMLElement | undefined;
@@ -28,6 +29,7 @@ interface FullPageEditorContentAreaProps {
     contentAreaRef(ref: HTMLElement | null): void;
     scrollContainerRef(ref: HTMLElement | null): void;
     wrapperElement: HTMLElement | null;
+    featureFlags?: FeatureFlags;
 }
 export declare const CONTENT_AREA_TEST_ID = "ak-editor-fp-content-area";
 export declare const FullPageContentArea: React.FC<import("react-intl-next").WithIntlProps<FullPageEditorContentAreaProps & WrappedComponentProps<"intl">>> & {