@atlaskit/editor-common 93.5.2 → 93.6.0

package/dist/es2019/media-single/CommentBadgeNext.js

@@ -1,6 +1,7 @@
 import React, { useMemo } from 'react';
 import { useIntl } from 'react-intl-next';
-import CommentIcon from '@atlaskit/icon/glyph/comment';
+import CommentIcon from '@atlaskit/icon/core/comment';
+import LegacyCommentIcon from '@atlaskit/icon/glyph/comment';
 import { Pressable, xcss } from '@atlaskit/primitives';
 import Tooltip from '@atlaskit/tooltip';
 import { commentMessages as messages } from '../media';
@@ -46,6 +47,9 @@ export const CommentBadgeNext = ({
     backgroundColor: colourToken
   }, /*#__PURE__*/React.createElement(CommentIcon, {
     label: title,
-    size: badgeSize
+    spacing: "spacious",
+    color: "currentColor",
+    LEGACY_size: badgeSize,
+    LEGACY_fallbackIcon: LegacyCommentIcon
   })));
 };

package/dist/es2019/messages/insert-block.js

@@ -165,6 +165,26 @@ export const toolbarInsertBlockMessages = defineMessages({
     defaultMessage: 'Layouts',
     description: 'Create a multi column section or layout'
   },
+  twoColumns: {
+    id: 'fabric.editor.twoColumns',
+    defaultMessage: '2 columns layout',
+    description: 'Create a section or layout with two columns'
+  },
+  threeColumns: {
+    id: 'fabric.editor.threeColumns',
+    defaultMessage: '3 columns layout',
+    description: 'Create a section or layout with three columns'
+  },
+  fourColumns: {
+    id: 'fabric.editor.fourColumns',
+    defaultMessage: '4 columns layout',
+    description: 'Create a section or layout with four columns'
+  },
+  fiveColumns: {
+    id: 'fabric.editor.fiveColumns',
+    defaultMessage: '5 columns layout',
+    description: 'Create a section or layout with five columns'
+  },
   columnsDescription: {
     id: 'fabric.editor.columns.description',
     defaultMessage: 'Structure your page using sections',

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 = "93.5.2";
+const packageVersion = "93.6.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/es2019/provider-factory/provider-factory.js

@@ -46,6 +46,7 @@ export default class ProviderFactory {
     if (provider) {
       handler(name, provider);
     }
+    return provider;
   }
   unsubscribe(name, handler) {
     const handlers = this.subscribers.get(name);

package/dist/es2019/provider-factory/with-providers.js

@@ -1,8 +1,17 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+/* eslint-disable @repo/internal/react/no-class-components */
 import { PureComponent } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 export class WithProviders extends PureComponent {
   constructor(props) {
     super(props);
+    _defineProperty(this, "mounted", false);
+    _defineProperty(this, "handleProviderIfMounted", (name, provider) => {
+      if (!this.mounted) {
+        return;
+      }
+      this.handleProvider(name, provider);
+    });
     _defineProperty(this, "handleProvider", (name, provider) => {
       this.setState(({
         providers
@@ -15,22 +24,33 @@ export class WithProviders extends PureComponent {
         };
       });
     });
+    this.mounted = false;
     const _providers = {};
     this.props.providers.forEach(name => {
-      _providers[name] = undefined;
+      if (fg('platform_editor_react18_phase2')) {
+        const providerPromise = props.providerFactory.subscribe(name, this.handleProviderIfMounted);
+        _providers[name] = providerPromise;
+      } else {
+        _providers[name] = undefined;
+      }
     });
     this.state = {
       providers: _providers
     };
   }
+  componentDidMount() {
+    this.mounted = true;
+  }
   UNSAFE_componentWillMount() {
-    const {
-      providers,
-      providerFactory
-    } = this.props;
-    providers.forEach(name => {
-      providerFactory.subscribe(name, this.handleProvider);
-    });
+    if (!fg('platform_editor_react18_phase2')) {
+      const {
+        providers,
+        providerFactory
+      } = this.props;
+      providers.forEach(name => {
+        providerFactory.subscribe(name, this.handleProvider);
+      });
+    }
   }
   componentWillUnmount() {
     const {

package/dist/es2019/quick-insert/assets/five-column-layout.js

@@ -0,0 +1,167 @@
+import React from 'react';
+import { useIconThemed } from '../use-icon-themed';
+export default function OneColumnLayoutIcon() {
+  const {
+    iconThemed
+  } = useIconThemed();
+  return /*#__PURE__*/React.createElement("svg", {
+    focusable: "false",
+    "aria-hidden": true,
+    width: "40",
+    height: "40",
+    viewBox: "0 0 40 40",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("g", {
+    clipPath: "url(#clip0_5808_5176)"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "0.5",
+    y: "0.5",
+    width: "39",
+    height: "39",
+    rx: "2.5",
+    stroke: "var(--ds-border, #091E42)",
+    strokeOpacity: "0.14"
+  })), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "6",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "10",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "29",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "33",
+    width: "16",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "12.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "18.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "24.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "30.25",
+    y: "14.25",
+    width: "3.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "clip0_5808_5176"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }))));
+}

package/dist/es2019/quick-insert/assets/four-column-layout.js

@@ -0,0 +1,152 @@
+import React from 'react';
+import { useIconThemed } from '../use-icon-themed';
+export default function OneColumnLayoutIcon() {
+  const {
+    iconThemed
+  } = useIconThemed();
+  return /*#__PURE__*/React.createElement("svg", {
+    focusable: "false",
+    "aria-hidden": true,
+    width: "40",
+    height: "40",
+    viewBox: "0 0 40 40",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React.createElement("g", {
+    clipPath: "url(#clip0_5808_7157)"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "0.5",
+    y: "0.5",
+    width: "39",
+    height: "39",
+    rx: "2.5",
+    stroke: "var(--ds-border, #091E42)",
+    strokeOpacity: "0.14"
+  })), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "6",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "10",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "29",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "33",
+    width: "16",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6.25",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "13.75",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "21.25",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "28.75",
+    y: "14.25",
+    width: "5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "clip0_5808_7157"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }))));
+}

package/dist/es2019/quick-insert/assets/index.js

@@ -78,6 +78,26 @@ export const IconStatus = Loadable({
   loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-icon-status" */'./status').then(module => module.default),
   loading: () => null
 });
+export const IconOneColumnLayout = Loadable({
+  loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-icon-one-column-layout" */'./one-column-layout').then(module => module.default),
+  loading: () => null
+});
+export const IconTwoColumnLayout = Loadable({
+  loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-icon-two-column-layout" */'./two-column-layout').then(module => module.default),
+  loading: () => null
+});
+export const IconThreeColumnLayout = Loadable({
+  loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-icon-three-column-layout" */'./three-column-layout').then(module => module.default),
+  loading: () => null
+});
+export const IconFourColumnLayout = Loadable({
+  loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-icon-four-column-layout" */'./four-column-layout').then(module => module.default),
+  loading: () => null
+});
+export const IconFiveColumnLayout = Loadable({
+  loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-icon-five-column-layout" */'./five-column-layout').then(module => module.default),
+  loading: () => null
+});
 function importHeading(level) {
   switch (level) {
     case 1:

package/dist/es2019/quick-insert/assets/one-column-layout.js

@@ -0,0 +1,103 @@
+import React from 'react';
+import { useIconThemed } from '../use-icon-themed';
+export default function OneColumnLayoutIcon() {
+  const {
+    iconThemed
+  } = useIconThemed();
+  return /*#__PURE__*/React.createElement("svg", {
+    focusable: "false",
+    "aria-hidden": true,
+    width: 40,
+    height: 40,
+    viewBox: "0 0 40 40",
+    fill: "none"
+  }, /*#__PURE__*/React.createElement("g", {
+    clipPath: "url(#clip0_5808_9744)"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "0.5",
+    y: "0.5",
+    width: "39",
+    height: "39",
+    rx: "2.5",
+    stroke: "var(--ds-border, #091E42)",
+    strokeOpacity: "0.14"
+  })), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "6",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: "#CCE0FF"
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "10",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "29",
+    width: "28",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6",
+    y: "33",
+    width: "16",
+    height: "1",
+    rx: "0.5",
+    fill: iconThemed({
+      light: '#A5ADBA',
+      dark: '#738496'
+    })
+  }), /*#__PURE__*/React.createElement("rect", {
+    x: "6.25",
+    y: "14.25",
+    width: "27.5",
+    height: "11.5",
+    rx: "0.75",
+    fill: iconThemed({
+      light: '#DEEBFF',
+      dark: '#09326C'
+    }),
+    stroke: iconThemed({
+      light: '#4C9AFF',
+      dark: '#0C66E4'
+    }),
+    strokeWidth: "0.5"
+  }), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "clip0_5808_9744"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "40",
+    height: "40",
+    rx: "3",
+    fill: iconThemed({
+      light: '#FFF',
+      dark: '#161A1D'
+    })
+  }))));
+}