@atlaskit/editor-core 178.1.1 → 178.1.2

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

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import React from 'react';
 import { css, jsx } from '@emotion/react';
@@ -77,30 +76,24 @@ const secondaryToolbarStyle = css`
   display: flex;
   padding: 12px 1px;
 `;
-
 class Editor extends React.Component {
   // Wrapper container for toolbar and content area
+
   constructor(props) {
     super(props);
-
     _defineProperty(this, "appearance", 'comment');
-
     _defineProperty(this, "containerElement", null);
-
     _defineProperty(this, "wrapperElementRef", /*#__PURE__*/React.createRef());
-
     _defineProperty(this, "handleSave", () => {
       if (this.props.editorView && this.props.onSave) {
         this.props.onSave(this.props.editorView);
       }
     });
-
     _defineProperty(this, "handleCancel", () => {
       if (this.props.editorView && this.props.onCancel) {
         this.props.onCancel(this.props.editorView);
       }
     });
-
     _defineProperty(this, "renderChrome", ({
       maxContentSize,
       mediaState
@@ -204,12 +197,10 @@ class Editor extends React.Component {
         }
       }), customSecondaryToolbarComponents));
     });
-
     if (props.innerRef) {
       this.wrapperElementRef = props.innerRef;
     }
   }
-
   render() {
     return jsx(WithPluginState, {
       plugins: {
@@ -219,9 +210,6 @@ class Editor extends React.Component {
       render: this.renderChrome
     });
   }
-
 }
-
 _defineProperty(Editor, "displayName", 'CommentEditorAppearance');
-
 export const CommentEditorWithIntl = injectIntl(Editor);

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

@@ -39,12 +39,10 @@ const stickyToolbarWrapperStyle = css`
       ${`var(--ds-border, ${N30})`};
   }
 `;
-
 const StickyToolbar = props => {
   const [top, setTop] = useState(0);
   useEffect(() => {
     var _props$externalToolba, _props$externalToolba2;
-
     setTop(((_props$externalToolba = props.externalToolbarRef) === null || _props$externalToolba === void 0 ? void 0 : (_props$externalToolba2 = _props$externalToolba.current) === null || _props$externalToolba2 === void 0 ? void 0 : _props$externalToolba2.clientHeight) || 0);
   }, [setTop, props.externalToolbarRef]);
   return jsx("div", {
@@ -55,12 +53,10 @@ const StickyToolbar = props => {
     className: 'show-keyline'
   }, props.children);
 };
-
 const FixedToolbar = props => jsx("div", {
   css: mainToolbarWrapperStyle,
   "data-testid": "ak-editor-main-toolbar"
 }, props.children);
-
 export const MainToolbar = ({
   useStickyToolbar,
   children
@@ -70,7 +66,6 @@ export const MainToolbar = ({
       externalToolbarRef: typeof useStickyToolbar === 'boolean' ? undefined : useStickyToolbar
     }, children);
   }
-
   return jsx(FixedToolbar, null, children);
 };
 export const mainToolbarCustomComponentsSlotStyle = css`

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

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';
@@ -12,76 +11,61 @@ import { FullPageToolbar } from './FullPageToolbar';
 import { getFeatureFlags } from '../../../plugins/feature-flags-context';
 export class FullPageEditor extends React.Component {
   // Wrapper container for toolbar and content area
+
   constructor(props) {
     super(props);
-
     _defineProperty(this, "state", {
       showKeyline: false
     });
-
     _defineProperty(this, "scrollContainer", null);
-
     _defineProperty(this, "wrapperElementRef", /*#__PURE__*/React.createRef());
-
     _defineProperty(this, "contentAreaRef", contentArea => {
       this.contentArea = contentArea;
     });
-
     _defineProperty(this, "scrollContainerRef", ref => {
-      const previousScrollContainer = this.scrollContainer; // remove existing handler
+      const previousScrollContainer = this.scrollContainer;
 
+      // remove existing handler
       if (previousScrollContainer) {
         previousScrollContainer.removeEventListener('scroll', this.updateToolbarKeyline);
       }
-
       this.scrollContainer = ref ? ref : null;
-
       if (this.scrollContainer) {
         this.scrollContainer.addEventListener('scroll', this.updateToolbarKeyline, false);
         this.updateToolbarKeyline();
       }
     });
-
     _defineProperty(this, "updateToolbarKeyline", rafSchedule(() => {
       if (!this.scrollContainer) {
         return false;
       }
-
       const {
         scrollTop
       } = this.scrollContainer;
       const showKeyline = scrollTop > akEditorToolbarKeylineHeight;
-
       if (showKeyline !== this.state.showKeyline) {
         this.setState({
           showKeyline
         });
       }
-
       return false;
     }));
-
     _defineProperty(this, "handleResize", () => {
       this.updateToolbarKeyline();
     });
-
     if (props.innerRef) {
       this.wrapperElementRef = props.innerRef;
     }
   }
-
   componentDidMount() {
     window.addEventListener('resize', this.handleResize, false);
   }
-
   componentWillUnmount() {
     window.removeEventListener('resize', this.handleResize);
     this.updateToolbarKeyline.cancel();
   }
-
   render() {
     var _props$editorView;
-
     const {
       props
     } = this;
@@ -135,7 +119,5 @@ export class FullPageEditor extends React.Component {
       wrapperElement: this.wrapperElementRef.current
     })));
   }
-
 }
-
 _defineProperty(FullPageEditor, "displayName", 'FullPageEditor');

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

@@ -12,7 +12,6 @@ import messages from './messages';
 import { ToolbarArrowKeyNavigationProvider } from '../../ToolbarArrowKeyNavigationProvider';
 export const EditorToolbar = /*#__PURE__*/React.memo(props => {
   var _props$featureFlags, _props$featureFlags2, _props$featureFlags3, _props$featureFlags4, _props$collabEdit, _props$collabEdit2, _props$collabEdit3, _props$featureFlags5, _props$featureFlags6;
-
   const [shouldSplitToolbar, setShouldSplitToolbar] = useState(false);
   const nonCustomToolbar = jsx("div", {
     css: nonCustomToolbarWrapperStyle
@@ -54,38 +53,30 @@ export const EditorToolbar = /*#__PURE__*/React.memo(props => {
   }) : null, !!props.customPrimaryToolbarComponents && 'after' in props.customPrimaryToolbarComponents ? props.customPrimaryToolbarComponents.after : props.customPrimaryToolbarComponents);
   useEffect(() => {
     var _props$featureFlags7;
-
     if ((_props$featureFlags7 = props.featureFlags) !== null && _props$featureFlags7 !== void 0 && _props$featureFlags7.twoLineEditorToolbar) {
       const updateOnResize = () => {
         setShouldSplitToolbar(window.innerWidth <= MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT);
       };
-
       window.addEventListener('resize', updateOnResize);
       updateOnResize();
       return () => window.removeEventListener('resize', updateOnResize);
     }
   });
-
   const isShortcutToFocusToolbar = event => {
     //Alt + F9 to reach first element in this main toolbar
     return event.altKey && (event.key === 'F9' || event.keyCode === 120);
   };
-
   const handleEscape = event => {
     var _props$editorView;
-
     if (!((_props$editorView = props.editorView) !== null && _props$editorView !== void 0 && _props$editorView.hasFocus())) {
       var _props$editorView2;
-
       (_props$editorView2 = props.editorView) === null || _props$editorView2 === void 0 ? void 0 : _props$editorView2.focus();
     }
   };
-
   return jsx(ContextPanelConsumer, null, ({
     width: contextPanelWidth
   }) => {
     var _props$featureFlags8, _props$featureFlags9, _props$featureFlags10;
-
     return jsx(ToolbarArrowKeyNavigationProvider, {
       editorView: props.editorView,
       childComponentSelector: "[data-testid='ak-editor-main-toolbar']",

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

@@ -3,8 +3,9 @@ import { N30 } from '@atlaskit/theme/colors';
 import { gridSize } from '@atlaskit/theme/constants';
 import { akEditorMenuZIndex, akEditorSwoopCubicBezier, akEditorToolbarKeylineHeight, akEditorMobileMaxWidth } from '@atlaskit/editor-shared-styles';
 export const MAXIMUM_TWO_LINE_TOOLBAR_BREAKPOINT = 868;
-const toolbarLineHeight = 56; // box-shadow is overriden by the mainToolbar
+const toolbarLineHeight = 56;
 
+// box-shadow is overriden by the mainToolbar
 const mainToolbarWithKeyline = css`
   box-shadow: 0 ${akEditorToolbarKeylineHeight}px 0 0
     ${`var(--ds-border, ${N30})`};

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

@@ -25,9 +25,10 @@ const scrollStyles = css`
   ${scrollbarStyles};
 `;
 export const ScrollContainer = createEditorContentStyle(scrollStyles);
-ScrollContainer.displayName = 'ScrollContainer'; // transition used to match scrollbar with config panel opening animation
-// only use animation when opening as there is a bug with floating toolbars.
+ScrollContainer.displayName = 'ScrollContainer';
 
+// transition used to match scrollbar with config panel opening animation
+// only use animation when opening as there is a bug with floating toolbars.
 export const positionedOverEditorStyle = css`
   padding: 0 ${akEditorContextPanelWidth}px;
   transition: padding 500ms ${akEditorSwoopCubicBezier};
@@ -45,9 +46,10 @@ export const sidebarArea = css`
   height: 100%;
   box-sizing: border-box;
   align-self: flex-end;
-`; // initially hide until we have a containerWidth and can properly size them,
-// otherwise they can cause the editor width to extend which is non-recoverable
+`;
 
+// initially hide until we have a containerWidth and can properly size them,
+// otherwise they can cause the editor width to extend which is non-recoverable
 export const editorContentAreaHideContainer = css`
   .fabric-editor--full-width-mode {
     .pm-table-container,
@@ -57,8 +59,8 @@ export const editorContentAreaHideContainer = css`
     }
   }
 `;
-/* Prevent horizontal scroll on page in full width mode */
 
+/* Prevent horizontal scroll on page in full width mode */
 const editorContentAreaContainerStyle = containerWidth => css`
   .fabric-editor--full-width-mode {
     .pm-table-container,
@@ -72,17 +74,14 @@ const editorContentAreaContainerStyle = containerWidth => css`
     }
   }
 `;
-
 export const editorContentAreaStyle = ({
   layoutMaxWidth,
   fullWidthMode,
   containerWidth
 }) => [editorContentArea, !fullWidthMode && editorContentAreaWithLayoutWith(layoutMaxWidth), containerWidth ? editorContentAreaContainerStyle(containerWidth) : editorContentAreaHideContainer];
-
 const editorContentAreaWithLayoutWith = layoutMaxWidth => css`
   max-width: ${layoutMaxWidth + TOTAL_PADDING}px;
 `;
-
 const editorContentArea = css`
   line-height: 24px;
   padding-top: 50px;

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

@@ -36,7 +36,6 @@ export function MobileAppearance({
     const maxContentSizeReached = Boolean(maxContentSize === null || maxContentSize === void 0 ? void 0 : maxContentSize.maxContentSizeReached);
     let minHeight = 100;
     let currentIsExpanded = true; // isExpanded prop should always be true for Hybrid Editor
-
     if (mobileDimensions) {
       const {
         keyboardHeight,
@@ -57,12 +56,11 @@ export function MobileAppearance({
         minHeight = windowHeight - keyboardHeight - 2 * mobilePaddingTop;
       } else {
         // in iOS Compact Editor windowHeight excludes keyboardHeight
-        minHeight = windowHeight - mobilePaddingTop; // isExpanded can be true of false for Compact editor
-
+        minHeight = windowHeight - mobilePaddingTop;
+        // isExpanded can be true of false for Compact editor
         currentIsExpanded = isExpanded;
       }
     }
-
     return jsx(WithFlash, {
       animate: maxContentSizeReached
     }, jsx("div", {

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

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';
@@ -7,11 +6,9 @@ import { PureComponent } from 'react';
 import { inputStyle } from './styles';
 import { injectIntl } from 'react-intl-next';
 import { messages } from './messages';
-
 class ChromeCollapsed extends PureComponent {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "focusHandler", evt => {
       /**
        * We need this magic for FireFox.
@@ -22,17 +19,14 @@ class ChromeCollapsed extends PureComponent {
       if (this.input) {
         this.input.blur();
       }
-
       if (this.props.onFocus) {
         this.props.onFocus(evt);
       }
     });
-
     _defineProperty(this, "handleInputRef", ref => {
       this.input = ref;
     });
   }
-
   render() {
     const placeholder = this.props.text || this.props.intl.formatMessage(messages.chromeCollapsedPlaceholder);
     return jsx("input", {
@@ -42,7 +36,5 @@ class ChromeCollapsed extends PureComponent {
       placeholder: placeholder
     });
   }
-
 }
-
 export default injectIntl(ChromeCollapsed);

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

@@ -7,49 +7,39 @@ import ChromeCollapsed from '../ChromeCollapsed';
 export default class CollapsedEditor extends React.Component {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "handleEditorRef", (editorRef, editorRefCallback) => {
       if (editorRefCallback && typeof editorRefCallback === 'function') {
         editorRefCallback(editorRef);
       }
-
       this.editorComponent = editorRef;
     });
   }
-
   UNSAFE_componentWillReceiveProps(nextProps) {
     if (!this.props.isExpanded && nextProps.isExpanded) {
       this.shouldTriggerExpandEvent = true;
     }
   }
-
   componentDidUpdate() {
     if (this.shouldTriggerExpandEvent && this.editorComponent) {
       this.shouldTriggerExpandEvent = false;
-
       if (this.props.onExpand) {
         this.props.onExpand();
       }
     }
   }
-
   render() {
     const child = React.Children.only(this.props.children);
-
     if (child.type !== Editor && child.type !== EditorWithActions) {
       throw new Error('Expected child to be of type `Editor`');
     }
-
     if (!this.props.isExpanded) {
       return /*#__PURE__*/React.createElement(IntlProviderIfMissingWrapper, null, /*#__PURE__*/React.createElement(ChromeCollapsed, {
         onFocus: this.props.onFocus,
         text: this.props.placeholder
       }));
     }
-
     return /*#__PURE__*/React.cloneElement(child, {
       ref: editorComponent => this.handleEditorRef(editorComponent, child.ref)
     });
   }
-
 }

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

@@ -14,11 +14,11 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '../../plu
 // helps adjusts position of popup
 const colorPickerButtonWrapper = css`
   position: relative;
-`; // Control the size of color picker buttons and preview
-// TODO: https://product-fabric.atlassian.net/browse/DSP-4134
+`;
 
+// Control the size of color picker buttons and preview
+// TODO: https://product-fabric.atlassian.net/browse/DSP-4134
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
-
 const colorPickerWrapper = css`
   border-radius: ${borderRadius()}px;
   background-color: white;
@@ -29,25 +29,20 @@ const colorPickerWrapper = css`
 
 const ColorPickerButton = props => {
   var _props$size, _props$size2;
-
   const buttonRef = React.useRef(null);
   const [isPopupOpen, setIsPopupOpen] = React.useState(false);
-
   const togglePopup = () => {
     setIsPopupOpen(!isPopupOpen);
   };
-
   React.useEffect(() => {
     if (props.setDisableParentScroll) {
       props.setDisableParentScroll(isPopupOpen);
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isPopupOpen]);
   const ColorPaletteWithListeners = withOuterListeners(ColorPalette);
-
   const onColorSelected = (color, label) => {
     setIsPopupOpen(false);
-
     if (props.onChange) {
       if (props.createAnalyticsEvent) {
         // fire analytics
@@ -64,24 +59,22 @@ const ColorPickerButton = props => {
         };
         props.createAnalyticsEvent(payload).fire(editorAnalyticsChannel);
       }
-
       const newPalette = props.colorPalette.find(colorPalette => colorPalette.value === color);
       newPalette && props.onChange(newPalette);
     }
   };
-
   const renderPopup = () => {
     if (!isPopupOpen || !buttonRef.current) {
       return;
     }
-
     return jsx(Popup, {
       target: buttonRef.current,
       fitHeight: 350,
       fitWidth: 350,
       offset: [0, 10],
       alignX: props.alignX,
-      mountTo: props.setDisableParentScroll ? props.mountPoint : undefined // Confluence inline comment editor has z-index: 500
+      mountTo: props.setDisableParentScroll ? props.mountPoint : undefined
+      // Confluence inline comment editor has z-index: 500
       // if the toolbar is scrollable, this will be mounted in the root editor
       // we need an index of > 500 to display over it
       ,
@@ -98,7 +91,6 @@ const ColorPickerButton = props => {
       handleClickOutside: togglePopup
     })));
   };
-
   const title = props.title || '';
   const buttonStyle = css`
     padding: 6px;
@@ -130,7 +122,6 @@ const ColorPickerButton = props => {
     css: buttonStyle
   })), renderPopup());
 };
-
 export default withAnalyticsContext({
   source: 'ConfigPanel'
 })(withAnalyticsEvents()(ColorPickerButton));