@atlaskit/renderer 89.0.0 → 92.0.0

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

@@ -15,13 +15,15 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
+/** @jsx jsx */
 import React, { useContext, useLayoutEffect, useRef } from 'react';
+import { jsx } from '@emotion/react';
 import { PureComponent } from 'react';
 import { getSchemaBasedOnStage } from '@atlaskit/adf-schema';
 import { reduce } from '@atlaskit/adf-utils';
 import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import { UnsupportedBlock, BaseTheme, WidthProvider, WithCreateAnalyticsEvent, LegacyToNextIntlProvider, IntlLegacyFallbackProvider, IntlNextErrorBoundary } from '@atlaskit/editor-common/ui';
-import { getAnalyticsAppearance, getAnalyticsEventSeverity, getResponseEndTime, startMeasure, stopMeasure, shouldForceTracking } from '@atlaskit/editor-common/utils';
+import { getAnalyticsAppearance, getAnalyticsEventSeverity, getResponseEndTime, startMeasure, stopMeasure, shouldForceTracking, measureTTI } from '@atlaskit/editor-common/utils';
 import { normalizeFeatureFlags } from '@atlaskit/editor-common/normalize-feature-flags';
 import { akEditorFullPageDefaultFontSize } from '@atlaskit/editor-shared-styles';
 import { IframeWidthObserverFallbackWrapper, IframeWrapperConsumer } from '@atlaskit/width-detector';
@@ -29,7 +31,7 @@ import { FabricChannel } from '@atlaskit/analytics-listeners';
 import { FabricEditorAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
 import uuid from 'uuid/v4';
 import { ReactSerializer, renderDocument } from '../../';
-import { Wrapper } from './style';
+import { DeprecatedWrapper, rendererStyles } from './style';
 import { TruncatedWrapper } from './truncated-wrapper';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../../analytics/enums';
 import { PLATFORM, MODE } from '../../analytics/events';
@@ -102,6 +104,24 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
     _this.editorRef = props.innerRef || /*#__PURE__*/React.createRef();
     _this.id = uuid();
     startMeasure("Renderer Render Time: ".concat(_this.id));
+
+    var _featureFlags = _this.featureFlags(_this.props.featureFlags).featureFlags;
+
+    if (_featureFlags !== null && _featureFlags !== void 0 && _featureFlags.rendererTtiTracking) {
+      measureTTI(function (tti, ttiFromInvocation, canceled) {
+        _this.fireAnalyticsEvent({
+          action: ACTION.RENDERER_TTI,
+          actionSubject: ACTION_SUBJECT.RENDERER,
+          attributes: {
+            tti: tti,
+            ttiFromInvocation: ttiFromInvocation,
+            canceled: canceled
+          },
+          eventType: EVENT_TYPE.OPERATIONAL
+        });
+      });
+    }
+
     return _this;
   }
 
@@ -295,17 +315,17 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
           onComplete(stat);
         }
 
-        var rendererOutput = /*#__PURE__*/React.createElement(RendererContextProvider, {
+        var rendererOutput = jsx(RendererContextProvider, {
           value: this.featureFlags(this.props.featureFlags)
-        }, /*#__PURE__*/React.createElement(CopyTextProvider, null, /*#__PURE__*/React.createElement(ActiveHeaderIdProvider, {
+        }, jsx(CopyTextProvider, null, jsx(ActiveHeaderIdProvider, {
           value: getActiveHeadingId(allowHeadingAnchorLinks)
-        }, /*#__PURE__*/React.createElement(LegacyToNextIntlProvider, null, /*#__PURE__*/React.createElement(IntlLegacyFallbackProvider, null, /*#__PURE__*/React.createElement(AnalyticsContext.Provider, {
+        }, jsx(LegacyToNextIntlProvider, null, jsx(IntlLegacyFallbackProvider, null, jsx(AnalyticsContext.Provider, {
           value: {
             fireAnalyticsEvent: function fireAnalyticsEvent(event) {
               return _this3.fireAnalyticsEvent(event);
             }
           }
-        }, /*#__PURE__*/React.createElement(SmartCardStorageProvider, null, /*#__PURE__*/React.createElement(RendererWrapper, {
+        }, jsx(SmartCardStorageProvider, null, jsx(RendererWrapper, {
           appearance: appearance,
           dynamicTextSizing: !!allowDynamicTextSizing,
           allowNestedHeaderLinks: allowNestedHeaderLinks,
@@ -316,14 +336,14 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
           innerRef: this.editorRef,
           onClick: handleWrapperOnClick,
           onMouseDown: this.onMouseDownEditView
-        }, enableSsrInlineScripts ? /*#__PURE__*/React.createElement(BreakoutSSRInlineScript, {
+        }, enableSsrInlineScripts ? jsx(BreakoutSSRInlineScript, {
           allowDynamicTextSizing: !!allowDynamicTextSizing
-        }) : null, /*#__PURE__*/React.createElement(RendererActionsInternalUpdater, {
+        }) : null, jsx(RendererActionsInternalUpdater, {
           doc: pmDoc,
           schema: schema,
           onAnalyticsEvent: this.fireAnalyticsEvent
         }, result)))))))));
-        return truncated ? /*#__PURE__*/React.createElement(TruncatedWrapper, {
+        return truncated ? jsx(TruncatedWrapper, {
           height: maxHeight,
           fadeHeight: fadeOutHeight
         }, rendererOutput) : rendererOutput;
@@ -332,7 +352,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
           onError(e);
         }
 
-        return /*#__PURE__*/React.createElement(RendererWrapper, {
+        return jsx(RendererWrapper, {
           appearance: appearance,
           dynamicTextSizing: !!allowDynamicTextSizing,
           allowCopyToClipboard: allowCopyToClipboard,
@@ -340,7 +360,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
           allowColumnSorting: allowColumnSorting,
           allowNestedHeaderLinks: allowNestedHeaderLinks,
           onClick: handleWrapperOnClick
-        }, /*#__PURE__*/React.createElement(UnsupportedBlock, null));
+        }, jsx(UnsupportedBlock, null));
       }
     }
   }, {
@@ -363,7 +383,7 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
   return Renderer;
 }(PureComponent);
 var RendererWithAnalytics = /*#__PURE__*/React.memo(function (props) {
-  return /*#__PURE__*/React.createElement(FabricEditorAnalyticsContext, {
+  return jsx(FabricEditorAnalyticsContext, {
     data: {
       appearance: getAnalyticsAppearance(props.appearance),
       packageName: name,
@@ -371,15 +391,15 @@ var RendererWithAnalytics = /*#__PURE__*/React.memo(function (props) {
       componentName: 'renderer',
       editorSessionId: uuid()
     }
-  }, /*#__PURE__*/React.createElement(WithCreateAnalyticsEvent, {
+  }, jsx(WithCreateAnalyticsEvent, {
     render: function render(createAnalyticsEvent) {
       // `IntlNextErrorBoundary` only captures Internationalisation errors, leaving others for `ErrorBoundary`.
-      return /*#__PURE__*/React.createElement(ErrorBoundary, {
+      return jsx(ErrorBoundary, {
         component: ACTION_SUBJECT.RENDERER,
         rethrowError: true,
         fallbackComponent: null,
         createAnalyticsEvent: createAnalyticsEvent
-      }, /*#__PURE__*/React.createElement(IntlNextErrorBoundary, null, /*#__PURE__*/React.createElement(Renderer, _extends({}, props, {
+      }, jsx(IntlNextErrorBoundary, null, jsx(Renderer, _extends({}, props, {
         createAnalyticsEvent: createAnalyticsEvent
       }))));
     }
@@ -395,22 +415,23 @@ var RendererWithIframeFallbackWrapper = /*#__PURE__*/React.memo(function (props)
       subscribe = props.subscribe,
       onClick = props.onClick,
       onMouseDown = props.onMouseDown;
-  var renderer = /*#__PURE__*/React.createElement(WidthProvider, {
+  var renderer = jsx(WidthProvider, {
     className: "ak-renderer-wrapper"
-  }, /*#__PURE__*/React.createElement(BaseTheme, {
+  }, jsx(BaseTheme, {
     dynamicTextSizing: dynamicTextSizing,
     baseFontSize: !dynamicTextSizing && appearance && appearance !== 'comment' ? akEditorFullPageDefaultFontSize : undefined
-  }, /*#__PURE__*/React.createElement(Wrapper, {
+  }, jsx(DeprecatedWrapper, {
     innerRef: innerRef,
     appearance: appearance,
     allowNestedHeaderLinks: allowNestedHeaderLinks,
     allowColumnSorting: !!allowColumnSorting,
     onClick: onClick,
-    onMouseDown: onMouseDown
+    onMouseDown: onMouseDown,
+    css: rendererStyles
   }, children)));
 
   if (!subscribe) {
-    return /*#__PURE__*/React.createElement(IframeWidthObserverFallbackWrapper, null, renderer);
+    return jsx(IframeWidthObserverFallbackWrapper, null, renderer);
   }
 
   return renderer;
@@ -424,9 +445,9 @@ var RendererWithIframeFallbackWrapper = /*#__PURE__*/React.memo(function (props)
  */
 
 export function RendererWrapper(props) {
-  return /*#__PURE__*/React.createElement(IframeWrapperConsumer, null, function (_ref) {
+  return jsx(IframeWrapperConsumer, null, function (_ref) {
     var subscribe = _ref.subscribe;
-    return /*#__PURE__*/React.createElement(RendererWithIframeFallbackWrapper, _extends({}, props, {
+    return jsx(RendererWithIframeFallbackWrapper, _extends({}, props, {
       subscribe: subscribe
     }));
   });
@@ -460,16 +481,16 @@ var RendererWithAnnotationSelection = function RendererWithAnnotationSelection(p
   var innerRef = props.innerRef || localRef;
 
   if (!allowAnnotations) {
-    return /*#__PURE__*/React.createElement(RendererWithAnalytics, _extends({
+    return jsx(RendererWithAnalytics, _extends({
       innerRef: innerRef
     }, props));
   }
 
-  return /*#__PURE__*/React.createElement(RendererActionsContext, null, /*#__PURE__*/React.createElement(AnnotationsWrapper, {
+  return jsx(RendererActionsContext, null, jsx(AnnotationsWrapper, {
     rendererRef: innerRef,
     adfDocument: adfDocument,
     annotationProvider: props.annotationProvider
-  }, /*#__PURE__*/React.createElement(RendererWithAnalytics, _extends({
+  }, jsx(RendererWithAnalytics, _extends({
     innerRef: innerRef
   }, props))));
 };

package/dist/esm/ui/Renderer/style.js

@@ -1,8 +1,9 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 
-var _templateObject, _templateObject2;
+var _templateObject, _templateObject2, _templateObject3;
 
-import styled, { css } from 'styled-components';
+import styled, { css as deprecatedCss } from 'styled-components';
+import { css } from '@emotion/react';
 import { themed } from '@atlaskit/theme/components';
 import { gridSize, fontFamily, fontSize, borderRadius } from '@atlaskit/theme/constants';
 import * as colors from '@atlaskit/theme/colors';
@@ -40,7 +41,7 @@ export var headingSizes = {
 };
 
 var headingAnchorStyle = function headingAnchorStyle(headingTag) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    /**\n     * The copy link button doesn't reserve space in the DOM so that\n     * the text alignment isn't impacted by the button/icon's space.\n     */\n    .", " {\n      position: absolute;\n      height: ", "em;\n\n      margin-left: 6px;\n\n      button {\n        padding-left: 0;\n        padding-right: 0;\n      }\n    }\n\n    /**\n     * Applies hover effects to the heading anchor link button\n     * to fade in when the user rolls over the heading.\n     *\n     * The link is persistent on mobile, so we use feature detection\n     * to enable hover effects for systems that support it (desktop).\n     *\n     * @see https://caniuse.com/mdn-css_at-rules_media_hover\n     */\n    @media (hover: hover) and (pointer: fine) {\n      .", " {\n        > button {\n          opacity: 0;\n          transform: translate(-8px, 0px);\n          transition: opacity 0.2s ease 0s, transform 0.2s ease 0s;\n        }\n      }\n\n      &:hover {\n        .", " > button {\n          opacity: 1;\n          transform: none !important;\n        }\n      }\n    }\n  "])), HeadingAnchorWrapperClassName, headingSizes[headingTag].lineHeight, HeadingAnchorWrapperClassName, HeadingAnchorWrapperClassName);
+  return deprecatedCss(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    /**\n     * The copy link button doesn't reserve space in the DOM so that\n     * the text alignment isn't impacted by the button/icon's space.\n     */\n    .", " {\n      position: absolute;\n      height: ", "em;\n\n      margin-left: 6px;\n\n      button {\n        padding-left: 0;\n        padding-right: 0;\n      }\n    }\n\n    /**\n     * Applies hover effects to the heading anchor link button\n     * to fade in when the user rolls over the heading.\n     *\n     * The link is persistent on mobile, so we use feature detection\n     * to enable hover effects for systems that support it (desktop).\n     *\n     * @see https://caniuse.com/mdn-css_at-rules_media_hover\n     */\n    @media (hover: hover) and (pointer: fine) {\n      .", " {\n        > button {\n          opacity: 0;\n          transform: translate(-8px, 0px);\n          transition: opacity 0.2s ease 0s, transform 0.2s ease 0s;\n        }\n      }\n\n      &:hover {\n        .", " > button {\n          opacity: 1;\n          transform: none !important;\n        }\n      }\n    }\n  "])), HeadingAnchorWrapperClassName, headingSizes[headingTag].lineHeight, HeadingAnchorWrapperClassName, HeadingAnchorWrapperClassName);
 };
 
 var alignedHeadingAnchorStyle = function alignedHeadingAnchorStyle(_ref) {
@@ -89,19 +90,26 @@ var fullWidthStyles = function fullWidthStyles(_ref4) {
   }
 
   return "\n  max-width: ".concat(akEditorFullWidthLayoutWidth, "px;\n  margin: 0 auto;\n\n  .fabric-editor-breakout-mark,\n  .pm-table-container,\n  .ak-renderer-extension {\n    width: 100% !important;\n  }\n  ");
-}; // prettier-ignore
+};
 
+export var rendererStyles = function rendererStyles(theme) {
+  // This is required to be compatible with styled-components prop structure.
+  var props = {
+    theme: theme
+  };
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    ", "\n\n    ", ";\n    ", ";\n    ", ";\n\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", "\n\n    /* plugin styles*/\n    ", " &\n    div[class^='image-wrap-'] + div[class^='image-wrap-'] {\n      margin-left: 0;\n      margin-right: 0;\n    }\n\n    ", ";\n  "])), tableSharedStyle(props), whitespaceSharedStyles, blockquoteSharedStyles, headingsSharedStyles(props), paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, codeMarkSharedStyles(props), shadowSharedStyle, dateSharedStyle, textColorStyles, tasksAndDecisionsStyles, smartCardSharedStyles, mediaSingleSharedStyle, columnLayoutSharedStyle);
+}; // prettier-ignore
 
-export var Wrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-size: ", "px;\n  line-height: 1.5rem;\n  color: ", ";\n\n  ", "\n  ", "\n\n  & h1 {\n    ", "\n  }\n\n  & h2 {\n    ", "\n  }\n\n  & h3 {\n    ", "\n  }\n\n  & h4 {\n    ", "\n  }\n\n  & h5 {\n    ", "\n  }\n\n  & h6 {\n    ", "\n  }\n\n  & span.akActionMark {\n    color: ", ";\n    text-decoration: none;\n\n    &:hover {\n      color: ", ";\n      text-decoration: underline;\n    }\n  }\n\n  & span.akActionMark {\n    cursor: pointer;\n  }\n\n  & span[data-placeholder] {\n    color: ", ";\n  }\n\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n  ", "\n\n  & .UnknownBlock {\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: 400;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n  }\n\n  & span.date-node {\n    background: ", ";\n    border-radius: ", "px;\n    color: ", ";\n    padding: 2px 4px;\n    margin: 0 1px;\n    transition: background 0.3s;\n  }\n\n  & span.date-node-highlighted {\n    background: ", ";\n    color: ", ";\n  }\n\n  & .renderer-image {\n    max-width: 100%;\n    display: block;\n    margin: ", "px 0;\n  }\n\n  .", ".rich-media-wrapped + .", ":not(.rich-media-wrapped) {\n    clear: both;\n  }\n\n  & .code-block,\n  & blockquote,\n  & hr,\n  & > div > div:not(.rich-media-wrapped),\n  .", ".rich-media-wrapped + .rich-media-wrapped + *:not(.rich-media-wrapped),\n  .", ".rich-media-wrapped + div:not(.rich-media-wrapped),\n  .", ".image-align-start,\n  .", ".image-center,\n  .", ".image-align-end {\n    clear: both;\n  }\n\n  & .rich-media-wrapped {\n    & + h1,\n    & + h2,\n    & + h3,\n    & + h4,\n    & + h5,\n    & + h6 {\n      margin-top: 8px;\n    }\n  }\n\n  ", "\n\n  ", " &\n  div[class^='image-wrap-'] + div[class^='image-wrap-'] {\n    margin-left: 0;\n    margin-right: 0;\n  }\n\n  /* Breakout for tables and extensions */\n  .", " > {\n    * .", " {\n      width: 100% !important;\n      left: 0 !important;\n    }\n\n    * .", " {\n      overflow-x: auto;\n    }\n\n    & .", ":first-child {\n      margin-top: 0;\n    }\n  }\n\n  .", " {\n    margin-top: ", ";\n  }\n\n  .", " {\n      margin-left: 50%;\n      transform: translateX(-50%);\n  }\n\n  .", " {\n    overflow-x: auto;\n  }\n\n  ", "\n\n  .", " {\n    z-index: 0;\n    transition: all 0.1s linear;\n    display: flex; /* needed to avoid position: fixed jumpiness in Chrome */\n\n    /** Shadow overrides */\n    &.", "::after, &.", "::before {\n      top: ", "px;\n      height: calc(100% - ", "px);\n      z-index: ", ";\n    }\n\n    /**\n     * A hack for making all the <th /> heights equal in case some have shorter\n     * content than others.\n     *\n     * This is done to make sort buttons fill entire <th />.\n     */\n    table {\n      height: 1px; /* will be ignored */\n      ", ";\n      margin-left: 0;\n      margin-right: 0;\n    }\n\n    table tr:first-child {\n      height: 100%;\n\n      td, th {\n        position: relative;\n      }\n    }\n\n    table[data-number-column='true'] {\n      .", " {\n        background-color: ", ";\n        border-right: 1px solid ", ";\n        width: ", "px;\n        text-align: center;\n        color: ", ";\n        font-size: ", ";\n      }\n\n      .fixed .", " {\n        border-right: 0px none;\n      }\n    }\n  }\n\n  tr[data-header-row].fixed {\n    position: fixed !important;\n    display: flex;\n    overflow: hidden;\n    z-index: ", ";\n\n    border-right: 1px solid ", ";\n    border-bottom: 1px solid ", ";\n\n    /* this is to compensate for the table border */\n    transform: translateX(-1px);\n  }\n\n  .sticky > th {\n    z-index: ", ";\n    position: sticky !important;\n    top: 0;\n  }\n\n  /* Make the number column header sticky */\n  .sticky > td {\n    position: sticky !important;\n    top: 0;\n  }\n\n  /* add border for position: sticky\n     and work around background-clip: padding-box\n     bug for FF causing box-shadow bug in Chrome */\n  .sticky th, .sticky td {\n    box-shadow: 0px 1px ", ", 0px -0.5px ", ", inset -1px 0px ", ", 0px -1px ", ";\n  }\n\n   /* this will remove jumpiness caused in Chrome for sticky headers */\n  .fixed + tr {\n    min-height: 0px;\n  }\n\n  /*\n   * We wrap CodeBlock in a grid to prevent it from overflowing the container of the renderer.\n   * See ED-4159.\n   */\n  & .code-block {\n    max-width: 100%;\n    /* -ms- properties are necessary until MS supports the latest version of the grid spec */\n    /* stylelint-disable value-no-vendor-prefix, declaration-block-no-duplicate-properties */\n    display: -ms-grid;\n    display: grid;\n    -ms-grid-columns: auto 1fr;\n    /* stylelint-enable */\n\n    grid-template-columns: minmax(0, 1fr);\n    position: relative;\n    border-radius: ", "px;\n\n    /*\n     * The overall renderer has word-wrap: break; which causes issues with\n     * code block line numbers in Safari / iOS.\n     */\n    word-wrap: normal;\n\n    & > span {\n      /* stylelint-disable value-no-vendor-prefix */\n      -ms-grid-row: 1;\n      -ms-grid-column: 2;\n      /* stylelint-enable */\n      grid-column: 1;\n    }\n  }\n\n  & .MediaGroup,\n  & .code-block {\n    margin-top: ", ";\n\n    &:first-child {\n      margin-top: 0;\n    }\n\n    &:hover button.copy-to-clipboard, .copy-to-clipboard:focus{\n      opacity: 1;\n      position: absolute;\n      height: 32px;\n      width: 32px;\n      right: 6px;\n      top: 4px;\n      padding: 2px;\n    }\n  }\n\n  ", ";\n  & [data-layout-section] {\n    margin-top: ", "px;\n    & > div + div {\n      margin-left: ", "px;\n    }\n\n    @media screen and (max-width: ", "px) {\n      & > div + div {\n        margin-left: 0;\n      }\n    }\n  }\n"])), editorFontSize, themed({
+export var DeprecatedWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  font-size: ", "px;\n  line-height: 1.5rem;\n  color: ", ";\n\n  ", "\n  ", "\n\n  & h1 {\n    ", "\n  }\n\n  & h2 {\n    ", "\n  }\n\n  & h3 {\n    ", "\n  }\n\n  & h4 {\n    ", "\n  }\n\n  & h5 {\n    ", "\n  }\n\n  & h6 {\n    ", "\n  }\n\n  & span.akActionMark {\n    color: ", ";\n    text-decoration: none;\n\n    &:hover {\n      color: ", ";\n      text-decoration: underline;\n    }\n  }\n\n  & span.akActionMark {\n    cursor: pointer;\n  }\n\n  & span[data-placeholder] {\n    color: ", ";\n  }\n\n  ", ";\n  ", ";\n\n  & .UnknownBlock {\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: 400;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n  }\n\n  & span.date-node {\n    background: ", ";\n    border-radius: ", "px;\n    color: ", ";\n    padding: 2px 4px;\n    margin: 0 1px;\n    transition: background 0.3s;\n  }\n\n  & span.date-node-highlighted {\n    background: ", ";\n    color: ", ";\n  }\n\n  & .renderer-image {\n    max-width: 100%;\n    display: block;\n    margin: ", "px 0;\n  }\n\n  .", ".rich-media-wrapped + .", ":not(.rich-media-wrapped) {\n    clear: both;\n  }\n\n  & .code-block,\n  & blockquote,\n  & hr,\n  & > div > div:not(.rich-media-wrapped),\n  .", ".rich-media-wrapped + .rich-media-wrapped + *:not(.rich-media-wrapped),\n  .", ".rich-media-wrapped + div:not(.rich-media-wrapped),\n  .", ".image-align-start,\n  .", ".image-center,\n  .", ".image-align-end {\n    clear: both;\n  }\n\n  & .rich-media-wrapped {\n    & + h1,\n    & + h2,\n    & + h3,\n    & + h4,\n    & + h5,\n    & + h6 {\n      margin-top: 8px;\n    }\n  }\n\n  ", "\n\n\n\n  /* Breakout for tables and extensions */\n  .", " > {\n    * .", " {\n      width: 100% !important;\n      left: 0 !important;\n    }\n\n    * .", " {\n      overflow-x: auto;\n    }\n\n    & .", ":first-child {\n      margin-top: 0;\n    }\n  }\n\n  .", " {\n    margin-top: ", ";\n  }\n\n  .", " {\n      margin-left: 50%;\n      transform: translateX(-50%);\n  }\n\n  .", " {\n    overflow-x: auto;\n  }\n\n\n\n  .", " {\n    z-index: 0;\n    transition: all 0.1s linear;\n    display: flex; /* needed to avoid position: fixed jumpiness in Chrome */\n\n    /** Shadow overrides */\n    &.", "::after, &.", "::before {\n      top: ", "px;\n      height: calc(100% - ", "px);\n      z-index: ", ";\n    }\n\n    /**\n     * A hack for making all the <th /> heights equal in case some have shorter\n     * content than others.\n     *\n     * This is done to make sort buttons fill entire <th />.\n     */\n    table {\n      height: 1px; /* will be ignored */\n      ", ";\n      margin-left: 0;\n      margin-right: 0;\n    }\n\n    table tr:first-child {\n      height: 100%;\n\n      td, th {\n        position: relative;\n      }\n    }\n\n    table[data-number-column='true'] {\n      .", " {\n        background-color: ", ";\n        border-right: 1px solid ", ";\n        width: ", "px;\n        text-align: center;\n        color: ", ";\n        font-size: ", ";\n      }\n\n      .fixed .", " {\n        border-right: 0px none;\n      }\n    }\n  }\n\n  tr[data-header-row].fixed {\n    position: fixed !important;\n    display: flex;\n    overflow: hidden;\n    z-index: ", ";\n\n    border-right: 1px solid ", ";\n    border-bottom: 1px solid ", ";\n\n    /* this is to compensate for the table border */\n    transform: translateX(-1px);\n  }\n\n  .sticky > th {\n    z-index: ", ";\n    position: sticky !important;\n    top: 0;\n  }\n\n  /* Make the number column header sticky */\n  .sticky > td {\n    position: sticky !important;\n    top: 0;\n  }\n\n  /* add border for position: sticky\n     and work around background-clip: padding-box\n     bug for FF causing box-shadow bug in Chrome */\n  .sticky th, .sticky td {\n    box-shadow: 0px 1px ", ", 0px -0.5px ", ", inset -1px 0px ", ", 0px -1px ", ";\n  }\n\n   /* this will remove jumpiness caused in Chrome for sticky headers */\n  .fixed + tr {\n    min-height: 0px;\n  }\n\n  /*\n   * We wrap CodeBlock in a grid to prevent it from overflowing the container of the renderer.\n   * See ED-4159.\n   */\n  & .code-block {\n    max-width: 100%;\n    /* -ms- properties are necessary until MS supports the latest version of the grid spec */\n    /* stylelint-disable value-no-vendor-prefix, declaration-block-no-duplicate-properties */\n    display: -ms-grid;\n    display: grid;\n    -ms-grid-columns: auto 1fr;\n    /* stylelint-enable */\n\n    grid-template-columns: minmax(0, 1fr);\n    position: relative;\n    border-radius: ", "px;\n\n    /*\n     * The overall renderer has word-wrap: break; which causes issues with\n     * code block line numbers in Safari / iOS.\n     */\n    word-wrap: normal;\n\n    & > span {\n      /* stylelint-disable value-no-vendor-prefix */\n      -ms-grid-row: 1;\n      -ms-grid-column: 2;\n      /* stylelint-enable */\n      grid-column: 1;\n    }\n  }\n\n  & .MediaGroup,\n  & .code-block {\n    margin-top: ", ";\n\n    &:first-child {\n      margin-top: 0;\n    }\n\n    &:hover button.copy-to-clipboard, .copy-to-clipboard:focus{\n      opacity: 1;\n      position: absolute;\n      height: 32px;\n      width: 32px;\n      right: 6px;\n      top: 4px;\n      padding: 2px;\n    }\n  }\n\n  & [data-layout-section] {\n    margin-top: ", "px;\n    & > div + div {\n      margin-left: ", "px;\n    }\n\n    @media screen and (max-width: ", "px) {\n      & > div + div {\n        margin-left: 0;\n      }\n    }\n  }\n"])), editorFontSize, themed({
   light: colors.N800,
   dark: '#B8C7E0'
-}), fullPageStyles, fullWidthStyles, headingAnchorStyle('h1'), headingAnchorStyle('h2'), headingAnchorStyle('h3'), headingAnchorStyle('h4'), headingAnchorStyle('h5'), headingAnchorStyle('h6'), colors.B400, colors.B300, colors.placeholderText, whitespaceSharedStyles, blockquoteSharedStyles, headingsSharedStyles, panelSharedStyles, ruleSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, codeMarkSharedStyles, shadowSharedStyle, dateSharedStyle, textColorStyles, tasksAndDecisionsStyles, smartCardSharedStyles, fontFamily(), relativeFontSizeToBase16(fontSize()), themed({
+}), fullPageStyles, fullWidthStyles, headingAnchorStyle('h1'), headingAnchorStyle('h2'), headingAnchorStyle('h3'), headingAnchorStyle('h4'), headingAnchorStyle('h5'), headingAnchorStyle('h6'), colors.B400, colors.B300, colors.placeholderText, panelSharedStyles, ruleSharedStyles, fontFamily(), relativeFontSizeToBase16(fontSize()), themed({
   light: colors.N30A,
   dark: colors.DN70
 }), borderRadius(), themed({
   light: colors.N800,
   dark: colors.DN600
-}), colors.R50, colors.R500, gridSize() * 3, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, alignedHeadingAnchorStyle, mediaSingleSharedStyle, RendererCssClassName.DOCUMENT, TableSharedCssClassName.TABLE_CONTAINER, RendererCssClassName.EXTENSION_OVERFLOW_CONTAINER, RendererCssClassName.EXTENSION, RendererCssClassName.EXTENSION, blockNodesVerticalMargin, RendererCssClassName.EXTENSION_CENTER_ALIGN, TableSharedCssClassName.TABLE_NODE_WRAPPER, tableSharedStyle, TableSharedCssClassName.TABLE_CONTAINER, shadowClassNames.RIGHT_SHADOW, shadowClassNames.LEFT_SHADOW, tableMarginTop - 1, tableMarginTop, akEditorStickyHeaderZIndex, tableSortableColumnStyle, RendererCssClassName.NUMBER_COLUMN, themed({
+}), colors.R50, colors.R500, gridSize() * 3, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, richMediaClassName, alignedHeadingAnchorStyle, RendererCssClassName.DOCUMENT, TableSharedCssClassName.TABLE_CONTAINER, RendererCssClassName.EXTENSION_OVERFLOW_CONTAINER, RendererCssClassName.EXTENSION, RendererCssClassName.EXTENSION, blockNodesVerticalMargin, RendererCssClassName.EXTENSION_CENTER_ALIGN, TableSharedCssClassName.TABLE_NODE_WRAPPER, TableSharedCssClassName.TABLE_CONTAINER, shadowClassNames.RIGHT_SHADOW, shadowClassNames.LEFT_SHADOW, tableMarginTop - 1, tableMarginTop, akEditorStickyHeaderZIndex, tableSortableColumnStyle, RendererCssClassName.NUMBER_COLUMN, themed({
   light: akEditorTableToolbar,
   dark: akEditorTableToolbarDark
 }), themed({
@@ -128,4 +136,4 @@ export var Wrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedT
 }), themed({
   light: akEditorTableToolbar,
   dark: akEditorTableToolbarDark
-}), borderRadius(), blockNodesVerticalMargin, columnLayoutSharedStyle, gridSize() * 2.5, gridSize() * 4, gridMediumMaxWidth);
+}), borderRadius(), blockNodesVerticalMargin, gridSize() * 2.5, gridSize() * 4, gridMediumMaxWidth);

package/dist/esm/ui/annotations/draft/component.js

@@ -3,21 +3,28 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
 
 var _templateObject;
 
-import React from 'react';
+/** @jsx jsx */
+import React, { Fragment } from 'react';
+import { css, jsx } from '@emotion/react';
 import { InsertDraftPosition } from '../types';
 import { AnnotationsDraftContext } from '../context';
 import { splitText, calcTextSplitOffset } from './text';
 import { calcInsertDraftPositionOnText } from './position';
 import { dataAttributes } from './dom';
-import styled from 'styled-components';
 import { AnnotationSharedCSSByState } from '@atlaskit/editor-common/styles';
-var DraftAnnotation = styled.mark(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: inherit;\n  background-color: unset;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n  ", ";\n"])), AnnotationSharedCSSByState.focus);
+
+var markStyles = function markStyles(props) {
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: inherit;\n  background-color: unset;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n  ", ";\n"])), AnnotationSharedCSSByState(props).focus);
+};
+
 export var AnnotationDraft = function AnnotationDraft(_ref) {
   var draftPosition = _ref.draftPosition,
       children = _ref.children;
-  return /*#__PURE__*/React.createElement(DraftAnnotation, _extends({
+  return jsx("mark", _extends({
     "data-renderer-mark": true
-  }, dataAttributes(draftPosition)), children);
+  }, dataAttributes(draftPosition), {
+    css: markStyles
+  }), children);
 };
 export var getAnnotationIndex = function getAnnotationIndex(annotationPosition, fragmentCount) {
   if (annotationPosition === InsertDraftPosition.START) {
@@ -41,13 +48,13 @@ export var applyAnnotationOnText = function applyAnnotationOnText(_ref2) {
   var annotateIndex = getAnnotationIndex(shouldApplyAnnotationAt, texts.length);
   return texts.map(function (value, index) {
     if (annotateIndex === index) {
-      return /*#__PURE__*/React.createElement(AnnotationDraft, {
+      return jsx(AnnotationDraft, {
         key: index,
         draftPosition: draftPosition
       }, value);
     }
 
-    return /*#__PURE__*/React.createElement(React.Fragment, {
+    return jsx(React.Fragment, {
       key: index
     }, value);
   });
@@ -72,11 +79,11 @@ export var TextWithAnnotationDraft = function TextWithAnnotationDraft(_ref3) {
   }, [nextDraftPosition, textPosition]);
 
   if (shouldApplyAnnotationAt === false || !nextDraftPosition) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+    return jsx(Fragment, null, children);
   }
 
   if (shouldApplyAnnotationAt === InsertDraftPosition.AROUND_TEXT) {
-    return /*#__PURE__*/React.createElement(AnnotationDraft, {
+    return jsx(AnnotationDraft, {
       key: 0,
       draftPosition: nextDraftPosition
     }, children);
@@ -86,7 +93,7 @@ export var TextWithAnnotationDraft = function TextWithAnnotationDraft(_ref3) {
   var texts = splitText(children, offsets);
 
   if (!texts) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+    return jsx(Fragment, null, children);
   }
 
   var components = applyAnnotationOnText({
@@ -94,5 +101,5 @@ export var TextWithAnnotationDraft = function TextWithAnnotationDraft(_ref3) {
     shouldApplyAnnotationAt: shouldApplyAnnotationAt,
     draftPosition: nextDraftPosition
   });
-  return /*#__PURE__*/React.createElement(React.Fragment, null, components);
+  return jsx(Fragment, null, components);
 };

package/dist/esm/ui/annotations/element/mark.js

@@ -9,11 +9,16 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
+/** @jsx jsx */
 import React, { useMemo, useCallback } from 'react';
+import { css, jsx } from '@emotion/react';
 import { AnnotationSharedCSSByState } from '@atlaskit/editor-common/styles';
 import { AnnotationMarkStates } from '@atlaskit/adf-schema';
-import styled from 'styled-components';
-var MarkStyled = styled.mark(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: inherit;\n  background-color: unset;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n  &[data-mark-annotation-state='", "'] {\n    ", ";\n\n    &:focus,\n    &[data-has-focus='true'] {\n      ", ";\n    }\n  }\n"])), AnnotationMarkStates.ACTIVE, AnnotationSharedCSSByState.blur, AnnotationSharedCSSByState.focus);
+
+var markStyles = function markStyles(props) {
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: inherit;\n  background-color: unset;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n\n  &[data-mark-annotation-state='", "'] {\n    ", ";\n\n    &:focus,\n    &[data-has-focus='true'] {\n      ", ";\n    }\n  }\n"])), AnnotationMarkStates.ACTIVE, AnnotationSharedCSSByState(props).blur, AnnotationSharedCSSByState(props).focus);
+};
+
 export var MarkComponent = function MarkComponent(_ref) {
   var annotationParentIds = _ref.annotationParentIds,
       children = _ref.children,
@@ -47,8 +52,10 @@ export var MarkComponent = function MarkComponent(_ref) {
   } : {
     'aria-details': annotationIds.join(', ')
   };
-  return /*#__PURE__*/React.createElement(MarkStyled, _extends({
+  return jsx("mark", _extends({
     id: id,
     onClick: onMarkClick
-  }, accessibility, overriddenData), children);
+  }, accessibility, overriddenData, {
+    css: markStyles
+  }), children);
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "89.0.0",
+	"version": "92.0.0",
 	"sideEffects": false
 }

package/dist/types/analytics/enums.d.ts

@@ -7,6 +7,7 @@ export declare enum EVENT_TYPE {
 export declare enum ACTION {
     STARTED = "started",
     RENDERED = "rendered",
+    RENDERER_TTI = "tti",
     CRASHED = "unhandledErrorCaught",
     INVALID_PROSEMIRROR_DOCUMENT = "invalidProsemirrorDocument",
     SELECT_ALL_CAUGHT = "selectAllCaught",

package/dist/types/analytics/events.d.ts

@@ -97,5 +97,10 @@ export declare enum RESOLVE_METHOD {
 }
 export declare type AnnotationAEP = AEP<AnnotationActionType, ACTION_SUBJECT.ANNOTATION, ACTION_SUBJECT_ID.INLINE_COMMENT, AnnotationAEPAttributes, undefined>;
 declare type MediaLnkTransformedAEP = AEP<ACTION.MEDIA_LINK_TRANSFORMED, ACTION_SUBJECT.RENDERER, undefined, undefined, EVENT_TYPE.OPERATIONAL>;
-export declare type AnalyticsEventPayload = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | HeadingAnchorLinkButtonAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP;
+declare type RendererTTIAEP = AEP<ACTION.RENDERER_TTI, ACTION_SUBJECT.RENDERER, undefined, {
+    tti: number;
+    ttiFromInvocation: number;
+    canceled: boolean;
+}, EVENT_TYPE.OPERATIONAL>;
+export declare type AnalyticsEventPayload = RendererStartAEP | RendererRenderedAEP | ComponentCrashErrorAEP | RendererUnsupportedContentLevelsTrackingSucceeded | RendererUnsupportedContentLevelsTrackingErrored | RendererSelectAllCaughtAEP | RendererSelectAllEscapedAEP | HeadingAnchorLinkButtonAEP | AnchorLinkAEP | TableSortColumnNotAllowedAEP | TableSortColumnAEP | VisitLinkAEP | VisitMediaLinkAEP | ExpandAEP | UnsupportedContentPayload | UnsupportedContentTooltipPayload | AnnotationAEP | AnnotationDeleteAEP | MediaLnkTransformedAEP | InvalidProsemirrorDocumentErrorAEP | RendererTTIAEP;
 export {};

package/dist/types/i18n/cs.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;

package/dist/types/i18n/da.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;

package/dist/types/i18n/de.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;

package/dist/types/i18n/en_ZZ.d.ts

@@ -0,0 +1,20 @@
+declare const _default: {
+    'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
+    'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
+    'fabric.editor.headingLink.copied': string;
+    'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
+    'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
+};
+/**
+ * NOTE:
+ *
+ * This file is automatically generated by Traduki 2.0.
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ */
+export default _default;

package/dist/types/i18n/es.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;

package/dist/types/i18n/fi.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;

package/dist/types/i18n/fr.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;

package/dist/types/i18n/hu.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;

package/dist/types/i18n/it.d.ts

@@ -1,14 +1,20 @@
 declare const _default: {
     'fabric.editor.codeBlockCopyButton.copiedToClipboard': string;
     'fabric.editor.codeBlockCopyButton.copyToClipboard': string;
+    'fabric.editor.headingLink.ascOrderLabel': string;
+    'fabric.editor.headingLink.ascSortingLabel': string;
     'fabric.editor.headingLink.copied': string;
     'fabric.editor.headingLink.copyAnchorLink': string;
+    'fabric.editor.headingLink.copyAriaLabel': string;
+    'fabric.editor.headingLink.descOrderLabel': string;
     'fabric.editor.headingLink.failedToCopy': string;
+    'fabric.editor.headingLink.noOrderLabel': string;
+    'fabric.editor.headingLink.noneSortingLabel': string;
 };
 /**
  * NOTE:
  *
- * This file is automatically generated by i18n-tools.
+ * This file is automatically generated by Traduki 2.0.
  * DO NOT CHANGE IT BY HAND or your changes will be lost.
  */
 export default _default;