@atlaskit/emoji 71.5.3 → 71.5.5

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/emoji
 
+## 71.5.5
+
+### Patch Changes
+
+- [`1388b698b0ad1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1388b698b0ad1) -
+  Add a public entry point for rendering unicode emoji to image URLs.
+
+## 71.5.4
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 71.5.3
 
 ### Patch Changes

package/dist/cjs/components/common/Emoji.js

@@ -10,9 +10,7 @@ exports.default = exports.UnicodeEmoji = exports.SpriteEmoji = exports.ImageEmoj
 require("./Emoji.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
@@ -35,6 +33,7 @@ var _browserApis = require("@atlaskit/browser-apis");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _i18n = require("../i18n");
 var _isSsr = require("../../util/is-ssr");
+var _renderUnicodeEmojiToImagePath = require("../../util/renderUnicodeEmojiToImagePath");
 var _EmojiPlaceholder = _interopRequireDefault(require("./EmojiPlaceholder"));
 var _excluded = ["emoji", "fitToHeight", "selected", "selectOnHover", "className", "showTooltip", "showDelete", "shouldBeInteractive", "tabIndex", "onSelected", "onMouseMove", "onFocus", "onDelete", "onLoadError", "onLoadSuccess", "disableLazyLoad", "autoWidth", "children", "type", "editorEmoji", "renderUnicodeEmojiAsImage"];
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -46,6 +45,7 @@ var emojiImageContainer = null;
 // Unicode emojis render as text inside a <span>, not an <img>, so they do not need
 // borderRadius (which would clip a background on hover) or the img { display: block } rule.
 var emojiUnicodeContainer = null;
+var unicodeEmojiCanvasSize = 128;
 var handleMouseDown = function handleMouseDown(props, event) {
   // Clicked emoji delete button
   if (event.target instanceof Element && event.target.getAttribute('aria-label') === _constants.deleteEmojiLabel) {
@@ -158,52 +158,6 @@ var SpriteEmoji = exports.SpriteEmoji = function SpriteEmoji(props) {
     }))
   );
 };
-var unicodeEmojiCanvasSize = 128;
-var unicodeEmojiCanvasFontSize = 124;
-var unicodeEmojiCanvasTopPadding = 8;
-var renderUnicodeEmojiToImagePath = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(unicodeEmoji) {
-    var OffscreenCanvasCtor, canvas, context, blob;
-    return _regenerator.default.wrap(function (_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          OffscreenCanvasCtor = globalThis['OffscreenCanvas'];
-          if (!((0, _isSsr.isSSR)() || !OffscreenCanvasCtor || typeof URL === 'undefined')) {
-            _context.next = 1;
-            break;
-          }
-          return _context.abrupt("return", undefined);
-        case 1:
-          canvas = new OffscreenCanvasCtor(unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
-          context = canvas.getContext('2d');
-          if (context) {
-            _context.next = 2;
-            break;
-          }
-          return _context.abrupt("return", undefined);
-        case 2:
-          context.clearRect(0, 0, unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
-          context.textAlign = 'center';
-          context.textBaseline = 'middle';
-          context.font = "".concat(unicodeEmojiCanvasFontSize, "px sans-serif");
-          context.fillText(unicodeEmoji, unicodeEmojiCanvasSize / 2, unicodeEmojiCanvasSize / 2 + unicodeEmojiCanvasTopPadding);
-          _context.next = 3;
-          return canvas.convertToBlob({
-            type: 'image/png'
-          });
-        case 3:
-          blob = _context.sent;
-          return _context.abrupt("return", URL.createObjectURL(blob));
-        case 4:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee);
-  }));
-  return function renderUnicodeEmojiToImagePath(_x) {
-    return _ref.apply(this, arguments);
-  };
-}();
 var useUnicodeEmojiImage = function useUnicodeEmojiImage(unicodeEmoji) {
   var _useState = (0, _react.useState)({
       status: 'loading'
@@ -218,7 +172,7 @@ var useUnicodeEmojiImage = function useUnicodeEmojiImage(unicodeEmoji) {
       status: 'loading',
       unicodeEmoji: unicodeEmoji
     });
-    void renderUnicodeEmojiToImagePath(unicodeEmoji).then(function (imagePath) {
+    void (0, _renderUnicodeEmojiToImagePath.renderUnicodeEmojiToImagePath)(unicodeEmoji).then(function (imagePath) {
       if (cancelled) {
         if (imagePath) {
           URL.revokeObjectURL(imagePath);

package/dist/cjs/util/analytics/analytics.js

@@ -20,7 +20,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread({
       packageName: "@atlaskit/emoji",
-      packageVersion: "71.5.2"
+      packageVersion: "71.5.4"
     }, attributes)
   };
 };

package/dist/cjs/util/renderUnicodeEmojiToImagePath.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.renderUnicodeEmojiToImagePath = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _isSsr = require("./is-ssr");
+var unicodeEmojiCanvasSize = 128;
+var unicodeEmojiCanvasFontSize = 124;
+var unicodeEmojiCanvasTopPadding = 8;
+var renderUnicodeEmojiToImagePath = exports.renderUnicodeEmojiToImagePath = /*#__PURE__*/function () {
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(unicodeEmoji) {
+    var OffscreenCanvasCtor, canvas, context, blob;
+    return _regenerator.default.wrap(function (_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          OffscreenCanvasCtor = globalThis['OffscreenCanvas'];
+          if (!((0, _isSsr.isSSR)() || !OffscreenCanvasCtor || typeof URL === 'undefined')) {
+            _context.next = 1;
+            break;
+          }
+          return _context.abrupt("return", undefined);
+        case 1:
+          canvas = new OffscreenCanvasCtor(unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
+          context = canvas.getContext('2d');
+          if (context) {
+            _context.next = 2;
+            break;
+          }
+          return _context.abrupt("return", undefined);
+        case 2:
+          context.clearRect(0, 0, unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
+          context.textAlign = 'center';
+          context.textBaseline = 'middle';
+          context.font = "".concat(unicodeEmojiCanvasFontSize, "px sans-serif");
+          context.fillText(unicodeEmoji, unicodeEmojiCanvasSize / 2, unicodeEmojiCanvasSize / 2 + unicodeEmojiCanvasTopPadding);
+          _context.next = 3;
+          return canvas.convertToBlob({
+            type: 'image/png'
+          });
+        case 3:
+          blob = _context.sent;
+          return _context.abrupt("return", URL.createObjectURL(blob));
+        case 4:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return function renderUnicodeEmojiToImagePath(_x) {
+    return _ref.apply(this, arguments);
+  };
+}();

package/dist/es2019/components/common/Emoji.js

@@ -22,6 +22,7 @@ import { getDocument } from '@atlaskit/browser-apis';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { messages } from '../i18n';
 import { isSSR } from '../../util/is-ssr';
+import { renderUnicodeEmojiToImagePath } from '../../util/renderUnicodeEmojiToImagePath';
 import EmojiPlaceholder from './EmojiPlaceholder';
 const emojiSpriteContainer = null;
 const emojiImageContainer = null;
@@ -29,6 +30,7 @@ const emojiImageContainer = null;
 // Unicode emojis render as text inside a <span>, not an <img>, so they do not need
 // borderRadius (which would clip a background on hover) or the img { display: block } rule.
 const emojiUnicodeContainer = null;
+const unicodeEmojiCanvasSize = 128;
 const handleMouseDown = (props, event) => {
   // Clicked emoji delete button
   if (event.target instanceof Element && event.target.getAttribute('aria-label') === deleteEmojiLabel) {
@@ -156,29 +158,6 @@ export const SpriteEmoji = props => {
     }))
   );
 };
-const unicodeEmojiCanvasSize = 128;
-const unicodeEmojiCanvasFontSize = 124;
-const unicodeEmojiCanvasTopPadding = 8;
-const renderUnicodeEmojiToImagePath = async unicodeEmoji => {
-  const OffscreenCanvasCtor = globalThis['OffscreenCanvas'];
-  if (isSSR() || !OffscreenCanvasCtor || typeof URL === 'undefined') {
-    return undefined;
-  }
-  const canvas = new OffscreenCanvasCtor(unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
-  const context = canvas.getContext('2d');
-  if (!context) {
-    return undefined;
-  }
-  context.clearRect(0, 0, unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
-  context.textAlign = 'center';
-  context.textBaseline = 'middle';
-  context.font = `${unicodeEmojiCanvasFontSize}px sans-serif`;
-  context.fillText(unicodeEmoji, unicodeEmojiCanvasSize / 2, unicodeEmojiCanvasSize / 2 + unicodeEmojiCanvasTopPadding);
-  const blob = await canvas.convertToBlob({
-    type: 'image/png'
-  });
-  return URL.createObjectURL(blob);
-};
 const useUnicodeEmojiImage = unicodeEmoji => {
   const [state, setState] = useState({
     status: 'loading'

package/dist/es2019/util/analytics/analytics.js

@@ -9,7 +9,7 @@ const createEvent = (eventType, action, actionSubject, actionSubjectId, attribut
   actionSubjectId,
   attributes: {
     packageName: "@atlaskit/emoji",
-    packageVersion: "71.5.2",
+    packageVersion: "71.5.4",
     ...attributes
   }
 });

package/dist/es2019/util/renderUnicodeEmojiToImagePath.js

@@ -0,0 +1,24 @@
+import { isSSR } from './is-ssr';
+const unicodeEmojiCanvasSize = 128;
+const unicodeEmojiCanvasFontSize = 124;
+const unicodeEmojiCanvasTopPadding = 8;
+export const renderUnicodeEmojiToImagePath = async unicodeEmoji => {
+  const OffscreenCanvasCtor = globalThis['OffscreenCanvas'];
+  if (isSSR() || !OffscreenCanvasCtor || typeof URL === 'undefined') {
+    return undefined;
+  }
+  const canvas = new OffscreenCanvasCtor(unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
+  const context = canvas.getContext('2d');
+  if (!context) {
+    return undefined;
+  }
+  context.clearRect(0, 0, unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
+  context.textAlign = 'center';
+  context.textBaseline = 'middle';
+  context.font = `${unicodeEmojiCanvasFontSize}px sans-serif`;
+  context.fillText(unicodeEmoji, unicodeEmojiCanvasSize / 2, unicodeEmojiCanvasSize / 2 + unicodeEmojiCanvasTopPadding);
+  const blob = await canvas.convertToBlob({
+    type: 'image/png'
+  });
+  return URL.createObjectURL(blob);
+};

package/dist/esm/components/common/Emoji.js

@@ -1,13 +1,11 @@
 /* Emoji.tsx generated by @compiled/babel-plugin v0.39.1 */
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["emoji", "fitToHeight", "selected", "selectOnHover", "className", "showTooltip", "showDelete", "shouldBeInteractive", "tabIndex", "onSelected", "onMouseMove", "onFocus", "onDelete", "onLoadError", "onLoadSuccess", "disableLazyLoad", "autoWidth", "children", "type", "editorEmoji", "renderUnicodeEmojiAsImage"];
 import "./Emoji.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React, { useEffect, useCallback, useContext, useMemo, useState, forwardRef } from 'react';
@@ -30,6 +28,7 @@ import { getDocument } from '@atlaskit/browser-apis';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { messages } from '../i18n';
 import { isSSR } from '../../util/is-ssr';
+import { renderUnicodeEmojiToImagePath } from '../../util/renderUnicodeEmojiToImagePath';
 import EmojiPlaceholder from './EmojiPlaceholder';
 var emojiSpriteContainer = null;
 var emojiImageContainer = null;
@@ -37,6 +36,7 @@ var emojiImageContainer = null;
 // Unicode emojis render as text inside a <span>, not an <img>, so they do not need
 // borderRadius (which would clip a background on hover) or the img { display: block } rule.
 var emojiUnicodeContainer = null;
+var unicodeEmojiCanvasSize = 128;
 var handleMouseDown = function handleMouseDown(props, event) {
   // Clicked emoji delete button
   if (event.target instanceof Element && event.target.getAttribute('aria-label') === deleteEmojiLabel) {
@@ -149,52 +149,6 @@ export var SpriteEmoji = function SpriteEmoji(props) {
     }))
   );
 };
-var unicodeEmojiCanvasSize = 128;
-var unicodeEmojiCanvasFontSize = 124;
-var unicodeEmojiCanvasTopPadding = 8;
-var renderUnicodeEmojiToImagePath = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(unicodeEmoji) {
-    var OffscreenCanvasCtor, canvas, context, blob;
-    return _regeneratorRuntime.wrap(function (_context) {
-      while (1) switch (_context.prev = _context.next) {
-        case 0:
-          OffscreenCanvasCtor = globalThis['OffscreenCanvas'];
-          if (!(isSSR() || !OffscreenCanvasCtor || typeof URL === 'undefined')) {
-            _context.next = 1;
-            break;
-          }
-          return _context.abrupt("return", undefined);
-        case 1:
-          canvas = new OffscreenCanvasCtor(unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
-          context = canvas.getContext('2d');
-          if (context) {
-            _context.next = 2;
-            break;
-          }
-          return _context.abrupt("return", undefined);
-        case 2:
-          context.clearRect(0, 0, unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
-          context.textAlign = 'center';
-          context.textBaseline = 'middle';
-          context.font = "".concat(unicodeEmojiCanvasFontSize, "px sans-serif");
-          context.fillText(unicodeEmoji, unicodeEmojiCanvasSize / 2, unicodeEmojiCanvasSize / 2 + unicodeEmojiCanvasTopPadding);
-          _context.next = 3;
-          return canvas.convertToBlob({
-            type: 'image/png'
-          });
-        case 3:
-          blob = _context.sent;
-          return _context.abrupt("return", URL.createObjectURL(blob));
-        case 4:
-        case "end":
-          return _context.stop();
-      }
-    }, _callee);
-  }));
-  return function renderUnicodeEmojiToImagePath(_x) {
-    return _ref.apply(this, arguments);
-  };
-}();
 var useUnicodeEmojiImage = function useUnicodeEmojiImage(unicodeEmoji) {
   var _useState = useState({
       status: 'loading'

package/dist/esm/util/analytics/analytics.js

@@ -14,7 +14,7 @@ var createEvent = function createEvent(eventType, action, actionSubject, actionS
     actionSubjectId: actionSubjectId,
     attributes: _objectSpread({
       packageName: "@atlaskit/emoji",
-      packageVersion: "71.5.2"
+      packageVersion: "71.5.4"
     }, attributes)
   };
 };

package/dist/esm/util/renderUnicodeEmojiToImagePath.js

@@ -0,0 +1,49 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import { isSSR } from './is-ssr';
+var unicodeEmojiCanvasSize = 128;
+var unicodeEmojiCanvasFontSize = 124;
+var unicodeEmojiCanvasTopPadding = 8;
+export var renderUnicodeEmojiToImagePath = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(unicodeEmoji) {
+    var OffscreenCanvasCtor, canvas, context, blob;
+    return _regeneratorRuntime.wrap(function (_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          OffscreenCanvasCtor = globalThis['OffscreenCanvas'];
+          if (!(isSSR() || !OffscreenCanvasCtor || typeof URL === 'undefined')) {
+            _context.next = 1;
+            break;
+          }
+          return _context.abrupt("return", undefined);
+        case 1:
+          canvas = new OffscreenCanvasCtor(unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
+          context = canvas.getContext('2d');
+          if (context) {
+            _context.next = 2;
+            break;
+          }
+          return _context.abrupt("return", undefined);
+        case 2:
+          context.clearRect(0, 0, unicodeEmojiCanvasSize, unicodeEmojiCanvasSize);
+          context.textAlign = 'center';
+          context.textBaseline = 'middle';
+          context.font = "".concat(unicodeEmojiCanvasFontSize, "px sans-serif");
+          context.fillText(unicodeEmoji, unicodeEmojiCanvasSize / 2, unicodeEmojiCanvasSize / 2 + unicodeEmojiCanvasTopPadding);
+          _context.next = 3;
+          return canvas.convertToBlob({
+            type: 'image/png'
+          });
+        case 3:
+          blob = _context.sent;
+          return _context.abrupt("return", URL.createObjectURL(blob));
+        case 4:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return function renderUnicodeEmojiToImagePath(_x) {
+    return _ref.apply(this, arguments);
+  };
+}();

package/dist/types/util/renderUnicodeEmojiToImagePath.d.ts

@@ -0,0 +1 @@
+export declare const renderUnicodeEmojiToImagePath: (unicodeEmoji: string) => Promise<string | undefined>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/emoji",
-	"version": "71.5.3",
+	"version": "71.5.5",
 	"description": "Fabric emoji React components",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -49,7 +49,7 @@
 		"@atlaskit/spinner": "^20.0.0",
 		"@atlaskit/textfield": "^9.0.0",
 		"@atlaskit/theme": "^26.0.0",
-		"@atlaskit/tmp-editor-statsig": "^113.0.0",
+		"@atlaskit/tmp-editor-statsig": "^114.0.0",
 		"@atlaskit/tokens": "^15.0.0",
 		"@atlaskit/tooltip": "^23.0.0",
 		"@atlaskit/ufo": "^1.0.0",

package/unicode-emoji-image/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@atlaskit/emoji/unicode-emoji-image",
+  "main": "../dist/cjs/util/renderUnicodeEmojiToImagePath.js",
+  "module": "../dist/esm/util/renderUnicodeEmojiToImagePath.js",
+  "module:es2019": "../dist/es2019/util/renderUnicodeEmojiToImagePath.js",
+  "sideEffects": [
+    "*.compiled.css"
+  ],
+  "types": "../dist/types/util/renderUnicodeEmojiToImagePath.d.ts"
+}