@atlaskit/renderer 110.5.5 → 110.6.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/renderer
 
+## 110.6.0
+
+### Minor Changes
+
+- [#146966](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/146966)
+  [`ee4562a10804e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ee4562a10804e) -
+  cleaned up platform_editor_get_emoji_provider_from_config feature flag
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 110.5.5
 
 ### Patch Changes

package/dist/cjs/react/nodes/emoji.js

@@ -1,20 +1,102 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("@emotion/react");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _element = require("@atlaskit/emoji/element");
 var _react2 = require("react");
-var _emoji = require("@atlaskit/editor-common/emoji");
+var _providerFactory = require("@atlaskit/editor-common/provider-factory");
 var _useInlineAnnotationProps = require("../../ui/annotations/element/useInlineAnnotationProps");
-/**
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
+ */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @repo/internal/react/no-class-components
+var EmojiNode = /*#__PURE__*/function (_PureComponent) {
+  (0, _inherits2.default)(EmojiNode, _PureComponent);
+  var _super = _createSuper(EmojiNode);
+  function EmojiNode(props) {
+    var _this;
+    (0, _classCallCheck2.default)(this, EmojiNode);
+    _this = _super.call(this, props);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderWithProvider", function (providers) {
+      var _resourceConfig$optim;
+      var _this$props = _this.props,
+        allowTextFallback = _this$props.allowTextFallback,
+        shortName = _this$props.shortName,
+        id = _this$props.id,
+        fallback = _this$props.fallback,
+        fitToHeight = _this$props.fitToHeight,
+        showTooltip = _this$props.showTooltip,
+        resourceConfig = _this$props.resourceConfig;
+      if (allowTextFallback && !providers.emojiProvider) {
+        return (0, _react.jsx)("span", {
+          "data-emoji-id": id,
+          "data-emoji-short-name": shortName,
+          "data-emoji-text": fallback || shortName
+        }, fallback || shortName);
+      }
+      if (!providers.emojiProvider) {
+        return null;
+      }
+      return (0, _react.jsx)(_element.ResourcedEmoji, {
+        emojiId: {
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        },
+        emojiProvider: providers.emojiProvider,
+        showTooltip: showTooltip,
+        fitToHeight: fitToHeight,
+        optimistic: true,
+        optimisticImageURL: resourceConfig === null || resourceConfig === void 0 || (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        }),
+        editorEmoji: true
+      });
+    });
+    _this.providerFactory = props.providers || new _providerFactory.ProviderFactory();
+    return _this;
+  }
+  (0, _createClass2.default)(EmojiNode, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      if (!this.props.providers) {
+        // new ProviderFactory is created if no `providers` has been set
+        // in this case when component is unmounted it's safe to destroy this providerFactory
+        this.providerFactory.destroy();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return (0, _react.jsx)(_providerFactory.WithProviders, {
+        providers: ['emojiProvider'],
+        providerFactory: this.providerFactory,
+        renderNode: this.renderWithProvider
+      });
+    }
+  }]);
+  return EmojiNode;
+}(_react2.PureComponent);
+(0, _defineProperty2.default)(EmojiNode, "displayName", 'EmojiNode');
+(0, _defineProperty2.default)(EmojiNode, "defaultProps", {
+  showTooltip: true
+});
 function EmojiItem(props) {
   var id = props.id,
     providers = props.providers,
@@ -24,7 +106,7 @@ function EmojiItem(props) {
     resourceConfig = props.resourceConfig;
   var inlineAnnotationProps = (0, _useInlineAnnotationProps.useInlineAnnotationProps)(props);
   if ((0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes')) {
-    return (0, _react.jsx)("span", inlineAnnotationProps, (0, _react.jsx)(_emoji.Emoji, {
+    return (0, _react.jsx)("span", inlineAnnotationProps, (0, _react.jsx)(EmojiNode, {
       allowTextFallback: true,
       id: id,
       shortName: shortName,
@@ -34,7 +116,7 @@ function EmojiItem(props) {
       resourceConfig: resourceConfig
     }));
   }
-  return (0, _react.jsx)(_emoji.Emoji, {
+  return (0, _react.jsx)(EmojiNode, {
     allowTextFallback: true,
     id: id,
     shortName: shortName,

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

@@ -63,7 +63,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "110.5.5";
+var packageVersion = "110.6.0";
 var defaultNodeComponents = exports.defaultNodeComponents = _nodes.nodeToReact;
 var Renderer = exports.Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);

package/dist/es2019/react/nodes/emoji.js

@@ -1,3 +1,4 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -5,9 +6,74 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { memo } from 'react';
-import { Emoji } from '@atlaskit/editor-common/emoji';
+import { ResourcedEmoji } from '@atlaskit/emoji/element';
+import { PureComponent, memo } from 'react';
+import { ProviderFactory, WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
+// eslint-disable-next-line @repo/internal/react/no-class-components
+class EmojiNode extends PureComponent {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "renderWithProvider", providers => {
+      var _resourceConfig$optim;
+      const {
+        allowTextFallback,
+        shortName,
+        id,
+        fallback,
+        fitToHeight,
+        showTooltip,
+        resourceConfig
+      } = this.props;
+      if (allowTextFallback && !providers.emojiProvider) {
+        return jsx("span", {
+          "data-emoji-id": id,
+          "data-emoji-short-name": shortName,
+          "data-emoji-text": fallback || shortName
+        }, fallback || shortName);
+      }
+      if (!providers.emojiProvider) {
+        return null;
+      }
+      return jsx(ResourcedEmoji, {
+        emojiId: {
+          id,
+          fallback,
+          shortName
+        },
+        emojiProvider: providers.emojiProvider,
+        showTooltip: showTooltip,
+        fitToHeight: fitToHeight,
+        optimistic: true,
+        optimisticImageURL: resourceConfig === null || resourceConfig === void 0 ? void 0 : (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
+          id,
+          fallback,
+          shortName
+        }),
+        editorEmoji: true
+      });
+    });
+    this.providerFactory = props.providers || new ProviderFactory();
+  }
+  componentWillUnmount() {
+    if (!this.props.providers) {
+      // new ProviderFactory is created if no `providers` has been set
+      // in this case when component is unmounted it's safe to destroy this providerFactory
+      this.providerFactory.destroy();
+    }
+  }
+  render() {
+    return jsx(WithProviders, {
+      providers: ['emojiProvider'],
+      providerFactory: this.providerFactory,
+      renderNode: this.renderWithProvider
+    });
+  }
+}
+_defineProperty(EmojiNode, "displayName", 'EmojiNode');
+_defineProperty(EmojiNode, "defaultProps", {
+  showTooltip: true
+});
 function EmojiItem(props) {
   const {
     id,
@@ -19,7 +85,7 @@ function EmojiItem(props) {
   } = props;
   const inlineAnnotationProps = useInlineAnnotationProps(props);
   if (fg('editor_inline_comments_on_inline_nodes')) {
-    return jsx("span", inlineAnnotationProps, jsx(Emoji, {
+    return jsx("span", inlineAnnotationProps, jsx(EmojiNode, {
       allowTextFallback: true,
       id: id,
       shortName: shortName,
@@ -29,7 +95,7 @@ function EmojiItem(props) {
       resourceConfig: resourceConfig
     }));
   }
-  return jsx(Emoji, {
+  return jsx(EmojiNode, {
     allowTextFallback: true,
     id: id,
     shortName: shortName,

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

@@ -45,7 +45,7 @@ import { nodeToReact } from '../../react/nodes';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "110.5.5";
+const packageVersion = "110.6.0";
 export const defaultNodeComponents = nodeToReact;
 export class Renderer extends PureComponent {
   constructor(props) {

package/dist/esm/react/nodes/emoji.js

@@ -1,3 +1,12 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -5,9 +14,84 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { memo } from 'react';
-import { Emoji } from '@atlaskit/editor-common/emoji';
+import { ResourcedEmoji } from '@atlaskit/emoji/element';
+import { PureComponent, memo } from 'react';
+import { ProviderFactory, WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
+// eslint-disable-next-line @repo/internal/react/no-class-components
+var EmojiNode = /*#__PURE__*/function (_PureComponent) {
+  _inherits(EmojiNode, _PureComponent);
+  var _super = _createSuper(EmojiNode);
+  function EmojiNode(props) {
+    var _this;
+    _classCallCheck(this, EmojiNode);
+    _this = _super.call(this, props);
+    _defineProperty(_assertThisInitialized(_this), "renderWithProvider", function (providers) {
+      var _resourceConfig$optim;
+      var _this$props = _this.props,
+        allowTextFallback = _this$props.allowTextFallback,
+        shortName = _this$props.shortName,
+        id = _this$props.id,
+        fallback = _this$props.fallback,
+        fitToHeight = _this$props.fitToHeight,
+        showTooltip = _this$props.showTooltip,
+        resourceConfig = _this$props.resourceConfig;
+      if (allowTextFallback && !providers.emojiProvider) {
+        return jsx("span", {
+          "data-emoji-id": id,
+          "data-emoji-short-name": shortName,
+          "data-emoji-text": fallback || shortName
+        }, fallback || shortName);
+      }
+      if (!providers.emojiProvider) {
+        return null;
+      }
+      return jsx(ResourcedEmoji, {
+        emojiId: {
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        },
+        emojiProvider: providers.emojiProvider,
+        showTooltip: showTooltip,
+        fitToHeight: fitToHeight,
+        optimistic: true,
+        optimisticImageURL: resourceConfig === null || resourceConfig === void 0 || (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        }),
+        editorEmoji: true
+      });
+    });
+    _this.providerFactory = props.providers || new ProviderFactory();
+    return _this;
+  }
+  _createClass(EmojiNode, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      if (!this.props.providers) {
+        // new ProviderFactory is created if no `providers` has been set
+        // in this case when component is unmounted it's safe to destroy this providerFactory
+        this.providerFactory.destroy();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return jsx(WithProviders, {
+        providers: ['emojiProvider'],
+        providerFactory: this.providerFactory,
+        renderNode: this.renderWithProvider
+      });
+    }
+  }]);
+  return EmojiNode;
+}(PureComponent);
+_defineProperty(EmojiNode, "displayName", 'EmojiNode');
+_defineProperty(EmojiNode, "defaultProps", {
+  showTooltip: true
+});
 function EmojiItem(props) {
   var id = props.id,
     providers = props.providers,
@@ -17,7 +101,7 @@ function EmojiItem(props) {
     resourceConfig = props.resourceConfig;
   var inlineAnnotationProps = useInlineAnnotationProps(props);
   if (fg('editor_inline_comments_on_inline_nodes')) {
-    return jsx("span", inlineAnnotationProps, jsx(Emoji, {
+    return jsx("span", inlineAnnotationProps, jsx(EmojiNode, {
       allowTextFallback: true,
       id: id,
       shortName: shortName,
@@ -27,7 +111,7 @@ function EmojiItem(props) {
       resourceConfig: resourceConfig
     }));
   }
-  return jsx(Emoji, {
+  return jsx(EmojiNode, {
     allowTextFallback: true,
     id: id,
     shortName: shortName,

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

@@ -55,7 +55,7 @@ import { nodeToReact } from '../../react/nodes';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "110.5.5";
+var packageVersion = "110.6.0";
 export var defaultNodeComponents = nodeToReact;
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);

package/dist/types/react/nodes/emoji.d.ts

@@ -4,14 +4,17 @@
  * @jsx jsx
  */
 import { jsx } from '@emotion/react';
-import { type EmojiAttributes } from '@atlaskit/adf-schema';
 import { type EmojiResourceConfig } from '@atlaskit/emoji/resource';
-import { type ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { EmojiId } from '@atlaskit/emoji/types';
 import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
-export interface EmojiProps extends EmojiAttributes, MarkDataAttributes {
+import { type EmojiAttributes } from '@atlaskit/adf-schema';
+export interface EmojiProps extends EmojiId, EmojiAttributes, MarkDataAttributes {
+    allowTextFallback?: boolean;
     providers?: ProviderFactory;
-    resourceConfig?: EmojiResourceConfig;
     fitToHeight?: number;
+    showTooltip?: boolean;
+    resourceConfig?: EmojiResourceConfig;
 }
 declare function EmojiItem(props: EmojiProps): jsx.JSX.Element;
 declare namespace EmojiItem {

package/dist/types-ts4.5/react/nodes/emoji.d.ts

@@ -4,14 +4,17 @@
  * @jsx jsx
  */
 import { jsx } from '@emotion/react';
-import { type EmojiAttributes } from '@atlaskit/adf-schema';
 import { type EmojiResourceConfig } from '@atlaskit/emoji/resource';
-import { type ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { EmojiId } from '@atlaskit/emoji/types';
 import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
-export interface EmojiProps extends EmojiAttributes, MarkDataAttributes {
+import { type EmojiAttributes } from '@atlaskit/adf-schema';
+export interface EmojiProps extends EmojiId, EmojiAttributes, MarkDataAttributes {
+    allowTextFallback?: boolean;
     providers?: ProviderFactory;
-    resourceConfig?: EmojiResourceConfig;
     fitToHeight?: number;
+    showTooltip?: boolean;
+    resourceConfig?: EmojiResourceConfig;
 }
 declare function EmojiItem(props: EmojiProps): jsx.JSX.Element;
 declare namespace EmojiItem {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "110.5.5",
+	"version": "110.6.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -46,7 +46,7 @@
 		"@atlaskit/media-ui": "^25.15.0",
 		"@atlaskit/media-viewer": "^48.10.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
-		"@atlaskit/smart-card": "^28.3.0",
+		"@atlaskit/smart-card": "^28.4.0",
 		"@atlaskit/status": "^1.5.0",
 		"@atlaskit/task-decision": "^17.11.0",
 		"@atlaskit/theme": "^13.0.0",