@atlaskit/emoji 67.0.3 → 67.0.5

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

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import { Component } from 'react';
 import { jsx } from '@emotion/react';
@@ -12,18 +11,15 @@ import EmojiErrorMessage from './EmojiErrorMessage';
 import RetryableButton from './RetryableButton';
 import { cancelButton, deleteFooter, deletePreview, deleteText, emojiDeleteErrorMessage, previewButtonGroup } from './styles';
 export const emojiDeletePreviewTestId = 'emoji-delete-preview';
-
 class EmojiDeletePreview extends Component {
   constructor(props) {
     super(props);
-
     _defineProperty(this, "onSubmit", () => {
       const {
         emoji,
         onDeleteEmoji,
         onCloseDelete
       } = this.props;
-
       if (!this.state.loading) {
         this.setState({
           loading: true
@@ -33,7 +29,6 @@ class EmojiDeletePreview extends Component {
             onCloseDelete();
             return;
           }
-
           this.setState({
             loading: false,
             error: true
@@ -41,17 +36,14 @@ class EmojiDeletePreview extends Component {
         });
       }
     });
-
     _defineProperty(this, "onCancel", () => {
       this.props.onCloseDelete();
     });
-
     this.state = {
       loading: false,
       error: false
     };
   }
-
   UNSAFE_componentWillUpdate(nextProps) {
     if (nextProps.emoji.id !== this.props.emoji.id) {
       this.setState({
@@ -59,7 +51,6 @@ class EmojiDeletePreview extends Component {
       });
     }
   }
-
   render() {
     const {
       emoji,
@@ -103,7 +94,5 @@ class EmojiDeletePreview extends Component {
       css: cancelButton
     }, jsx(FormattedMessage, messages.cancelLabel)))));
   }
-
 }
-
 export default injectIntl(EmojiDeletePreview);

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

@@ -1,11 +1,11 @@
 /** @jsx jsx */
+
 import { jsx } from '@emotion/react';
 import Tooltip from '@atlaskit/tooltip';
 import ErrorIcon from '@atlaskit/icon/glyph/error';
 export const emojiErrorMessageTestId = 'emoji-error-message';
 export const emojiErrorMessageTooltipTestId = 'emoji-error-message-tooltip';
 export const emojiErrorIconTestId = 'emoji-error-icon';
-
 const EmojiErrorMessage = props => {
   const {
     messageStyles,
@@ -31,5 +31,4 @@ const EmojiErrorMessage = props => {
     size: "small"
   }), " ", message);
 };
-
 export default EmojiErrorMessage;

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

@@ -3,7 +3,6 @@ import { jsx } from '@emotion/react';
 import { defaultEmojiHeight } from '../../util/constants';
 import { placeholder, placeholderContainer, placeholderContainerAnimated } from './styles';
 export const emojiPlaceholderTestId = shortName => `emoji-placeholder-${shortName}`;
-
 const EmojiPlaceholder = props => {
   const {
     shortName,
@@ -14,17 +13,14 @@ const EmojiPlaceholder = props => {
   } = props;
   let scaledWidth;
   let scaledHeight;
-
   if (representation && size) {
     const width = representation.width;
     const height = representation.height;
-
     if (width && height) {
       scaledWidth = size / height * width;
       scaledHeight = size;
     }
   }
-
   const width = scaledWidth || size;
   const height = scaledHeight || size;
   const style = {
@@ -43,5 +39,4 @@ const EmojiPlaceholder = props => {
     title: showTooltip ? shortName : ''
   });
 };
-
 export default EmojiPlaceholder;

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

@@ -1,4 +1,5 @@
 /** @jsx jsx */
+
 import { jsx } from '@emotion/react';
 import CachingEmoji from './CachingEmoji';
 import { emojiName, emojiShortName, preview, previewImg, previewText } from './styles';

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

@@ -15,7 +15,6 @@ import { UploadStatus } from './internal-types';
 import { closeEmojiUploadButton, emojiChooseFileErrorMessage, emojiUpload, emojiUploadBottom, emojiUploadTop, uploadChooseFileBrowse, uploadChooseFileEmojiName, uploadChooseFileMessage, uploadChooseFileRow } from './styles';
 export const uploadEmojiNameInputTestId = 'upload-emoji-name-input';
 const disallowedReplacementsMap = new Map([[':', ''], ['!', ''], ['@', ''], ['#', ''], ['%', ''], ['^', ''], ['&', ''], ['*', ''], ['(', ''], [')', ''], [' ', '_']]);
-
 const sanitizeName = name => {
   // prevent / replace certain characters, allow others
   disallowedReplacementsMap.forEach((replaceWith, exclude) => {
@@ -23,14 +22,11 @@ const sanitizeName = name => {
   });
   return name;
 };
-
 const maxNameLength = 50;
-
 const toEmojiName = uploadName => {
   const name = uploadName.split('_').join(' ');
   return `${name.substr(0, 1).toLocaleUpperCase()}${name.substr(1)}`;
 };
-
 const ChooseEmojiFile = props => {
   const {
     name = '',
@@ -46,13 +42,11 @@ const ChooseEmojiFile = props => {
   } = intl;
   const disableChooser = !name;
   const fileChooserButtonDescriptionId = 'choose.emoji.file.button.screen.reader.description.id';
-
   const onKeyDownHandler = event => {
     if (event.key === 'Escape') {
       onUploadCancelled();
     }
   };
-
   return jsx("div", {
     css: emojiUpload
   }, jsx("div", {
@@ -103,7 +97,6 @@ const ChooseEmojiFile = props => {
     message: errorMessage
   })));
 };
-
 const EmojiUploadPicker = props => {
   const {
     errorMessage,
@@ -133,20 +126,16 @@ const EmojiUploadPicker = props => {
       setName(sanitizeName(initialUploadName));
     }
   }, [initialUploadName]);
-
   const onNameChange = event => {
     let newName = sanitizeName(event.target.value);
-
     if (name !== newName) {
       setName(newName);
     }
   };
-
   const onAddEmoji = () => {
     if (uploadStatus === UploadStatus.Uploading) {
       return;
     }
-
     if (filename && name && previewImage) {
       const notifyUpload = size => {
         const {
@@ -163,13 +152,12 @@ const EmojiUploadPicker = props => {
           height
         }, uploadStatus === UploadStatus.Error, clearUploadPicker);
       };
-
       ImageUtil.getNaturalImageSize(previewImage).then(size => {
         notifyUpload(size);
       }).catch(error => {
-        debug('getNaturalImageSize error', error); // Just set arbitrary size, worse case is it may render
+        debug('getNaturalImageSize error', error);
+        // Just set arbitrary size, worse case is it may render
         // in wrong aspect ratio in some circumstances.
-
         notifyUpload({
           width: 32,
           height: 32
@@ -177,13 +165,11 @@ const EmojiUploadPicker = props => {
       });
     }
   };
-
   const errorOnUpload = event => {
     debug('File load error: ', event);
     setChooseEmojiErrorMessage(messages.emojiUploadFailed);
     cancelChooseFile();
   };
-
   const onFileLoad = file => async f => {
     try {
       setFilename(file.name);
@@ -194,24 +180,19 @@ const EmojiUploadPicker = props => {
       cancelChooseFile();
     }
   };
-
   const cancelChooseFile = () => {
     setPreviewImage(undefined);
   };
-
   const onChooseFile = event => {
     const files = event.target.files;
-
     if (files.length) {
       const reader = new FileReader();
       const file = files[0];
-
       if (ImageUtil.hasFileExceededSize(file)) {
         setChooseEmojiErrorMessage(messages.emojiImageTooBig);
         cancelChooseFile();
         return;
       }
-
       reader.addEventListener('load', onFileLoad(file));
       reader.addEventListener('abort', errorOnUpload);
       reader.addEventListener('error', errorOnUpload);
@@ -220,18 +201,15 @@ const EmojiUploadPicker = props => {
       cancelChooseFile();
     }
   };
-
   const clearUploadPicker = () => {
     setName(undefined);
     setPreviewImage(undefined);
     setUploadStatus(UploadStatus.Waiting);
   };
-
   const cancelUpload = () => {
     clearUploadPicker();
     onUploadCancelled();
   };
-
   return jsx(React.Fragment, null, name && previewImage ? jsx(EmojiUploadPreview, {
     errorMessage: errorMessage,
     name: name,
@@ -249,5 +227,4 @@ const EmojiUploadPicker = props => {
     intl: intl
   }));
 };
-
 export default injectIntl(EmojiUploadPicker);

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

@@ -1,5 +1,4 @@
 import _extends from "@babel/runtime/helpers/extends";
-
 /** @jsx jsx */
 import { PureComponent } from 'react';
 import { jsx } from '@emotion/react';
@@ -14,7 +13,6 @@ import RetryableButton from './RetryableButton';
 import { bigEmojiPreview, cancelButton, emojiPreviewErrorMessage, uploadAddRow, uploadPreview, uploadPreviewFooter, uploadPreviewText } from './styles';
 export const uploadPreviewTestId = 'upload-preview';
 export const cancelUploadButtonTestId = 'cancel-upload-button';
-
 class EmojiUploadPreview extends PureComponent {
   render() {
     const {
@@ -30,7 +28,6 @@ class EmojiUploadPreview extends PureComponent {
       formatMessage
     } = intl;
     let emojiComponent;
-
     if (previewImage) {
       const emoji = {
         shortName: `:${name}:`,
@@ -47,7 +44,6 @@ class EmojiUploadPreview extends PureComponent {
         emoji: emoji
       });
     }
-
     const uploading = uploadStatus === UploadStatus.Uploading;
     return jsx("div", {
       css: uploadPreviewFooter
@@ -82,7 +78,5 @@ class EmojiUploadPreview extends PureComponent {
       testId: cancelUploadButtonTestId
     }, jsx(FormattedMessage, messages.cancelLabel))));
   }
-
 }
-
 export default injectIntl(EmojiUploadPreview);

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

@@ -2,7 +2,6 @@ import React, { useRef } from 'react';
 import AkButton from '@atlaskit/button/custom-theme-button';
 export const chooseFileButtonTestId = 'choose-file-button';
 export const fileUploadInputTestId = 'file-upload';
-
 const FileChooser = props => {
   const {
     accept,
@@ -13,19 +12,15 @@ const FileChooser = props => {
     onClick
   } = props;
   const filePickerRef = useRef(null);
-
   const handleOnChooseFile = () => {
     if (!filePickerRef.current) {
       return;
     }
-
     if (onClick) {
       onClick();
     }
-
     filePickerRef.current.click();
   };
-
   return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(AkButton, {
     onClick: handleOnChooseFile,
     isDisabled: isDisabled,
@@ -43,5 +38,4 @@ const FileChooser = props => {
     "data-testid": fileUploadInputTestId
   }));
 };
-
 export default FileChooser;

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

@@ -1,6 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { Component } from 'react';
-
 /**
  * A base class for components that don't want to start rendering
  * until the EmojiProvider is resolved.
@@ -10,17 +9,14 @@ import { Component } from 'react';
 export default class LoadingEmojiComponent extends Component {
   constructor(props, _state) {
     super(props);
-
     _defineProperty(this, "isUnmounted", false);
-
     _defineProperty(this, "loaded", state => !!state.asyncLoadedComponent && !!state.loadedEmojiProvider);
+    this.state = _state;
 
-    this.state = _state; // initializing here instead of componentDidMount to avoid needless
+    // initializing here instead of componentDidMount to avoid needless
     // rerendering if emojiProvider resolves immediately.
-
     this.loadEmojiProvider(this.props.emojiProvider);
   }
-
   componentDidMount() {
     // check for the module has not yet been loaded
     // state.asyncLoadedComponent should be initialised
@@ -29,15 +25,12 @@ export default class LoadingEmojiComponent extends Component {
       this.asyncLoadComponent();
     }
   }
-
   UNSAFE_componentWillReceiveProps(nextProps) {
     this.loadEmojiProvider(nextProps.emojiProvider);
   }
-
   componentWillUnmount() {
     this.isUnmounted = true;
   }
-
   loadEmojiProvider(futureEmojiProvider) {
     futureEmojiProvider.then(loadedEmojiProvider => {
       if (!this.isUnmounted) {
@@ -53,7 +46,6 @@ export default class LoadingEmojiComponent extends Component {
       }
     });
   }
-
   setAsyncState(asyncLoadedComponent) {
     if (!this.isUnmounted) {
       this.setState({
@@ -61,11 +53,9 @@ export default class LoadingEmojiComponent extends Component {
       });
     }
   }
-
   renderLoading() {
     return null;
   }
-
   render() {
     if (this.loaded(this.state)) {
       const {
@@ -74,8 +64,6 @@ export default class LoadingEmojiComponent extends Component {
       } = this.state;
       return this.renderLoaded(loadedEmojiProvider, asyncLoadedComponent);
     }
-
     return this.renderLoading();
   }
-
 }

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

@@ -1,15 +1,12 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import ReactDOM from 'react-dom';
-
 const getTargetNode = target => {
   if (typeof target === 'string') {
     return document.querySelector(target);
-  } // Expect to be an element
-
-
+  }
+  // Expect to be an element
   return target;
 };
-
 const Popup = props => {
   const {
     relativePosition = 'auto',
@@ -23,7 +20,6 @@ const Popup = props => {
   const [debounced, setDebounced] = useState(null);
   const applyBelowPosition = useCallback(() => {
     const targetNode = getTargetNode(target);
-
     if (targetNode && popup.current) {
       const box = targetNode.getBoundingClientRect();
       const top = box.bottom + (offsetY || 0);
@@ -37,9 +33,7 @@ const Popup = props => {
     if (typeof window === 'undefined') {
       return;
     }
-
     const targetNode = getTargetNode(target);
-
     if (targetNode && popup.current) {
       const box = targetNode.getBoundingClientRect();
       const bottom = window.innerHeight - box.top + (offsetY || 0);
@@ -53,18 +47,15 @@ const Popup = props => {
     if (typeof window === 'undefined') {
       return;
     }
-
     if (relativePosition === 'above') {
       applyAbovePosition();
     } else if (relativePosition === 'below') {
       applyBelowPosition();
     } else {
       const targetNode = getTargetNode(target);
-
       if (targetNode) {
         const box = targetNode.getBoundingClientRect();
         const viewPortHeight = window.innerHeight;
-
         if (box.top < viewPortHeight / 2) {
           applyBelowPosition();
         } else {
@@ -72,7 +63,6 @@ const Popup = props => {
         }
       }
     }
-
     if (zIndex && popup.current) {
       popup.current.style.zIndex = `${zIndex}`;
     }
@@ -82,12 +72,10 @@ const Popup = props => {
       clearTimeout(debounced);
       setDebounced(null);
     }
-
     if (typeof window === 'undefined') {
       return;
-    } // Timeout set to 30ms as to not throttle IE11
-
-
+    }
+    // Timeout set to 30ms as to not throttle IE11
     const debounceId = window.setTimeout(() => {
       applyAbsolutePosition();
       setDebounced(null);
@@ -98,27 +86,22 @@ const Popup = props => {
     if (!popup.current) {
       return;
     }
-
     ReactDOM.render(children, popup.current);
   }, [children]);
   useEffect(() => {
     popup.current = document.createElement('div');
     document.body.appendChild(popup.current);
     popup.current.style.position = 'absolute';
-
     if (typeof window !== 'undefined') {
       window.addEventListener('resize', handleResize);
     }
-
     applyAbsolutePosition();
     renderPopup();
     return () => {
       if (typeof window === 'undefined') {
         return;
       }
-
       window.removeEventListener('resize', handleResize);
-
       if (popup.current) {
         ReactDOM.unmountComponentAtNode(popup.current);
         document.body.removeChild(popup.current);
@@ -127,5 +110,4 @@ const Popup = props => {
   }, [applyAbsolutePosition, handleResize, renderPopup]);
   return /*#__PURE__*/React.createElement("div", null);
 };
-
 export default Popup;

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

@@ -1,5 +1,6 @@
 import { recordFailed, recordSucceeded, ufoExperiences } from '../../util/analytics';
 import { extractErrorInfo } from '../../util/analytics/analytics';
+
 /**
  * A function that will wrap any configured Emoji 'onSelection' function to ensure recordSelection is always
  * called.
@@ -8,7 +9,6 @@ import { extractErrorInfo } from '../../util/analytics/analytics';
  * @param onSelect the onSelect function that is explicitly configured on the Emoji component.
  * @param fireAnalytics a function used to fire analytics events.
  */
-
 export const createRecordSelectionDefault = (provider, onSelect, fireAnalytics) => {
   return (emojiId, emoji, event) => {
     try {

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

@@ -4,12 +4,9 @@ import { UfoErrorBoundary } from './UfoErrorBoundary';
 import { sampledUfoRenderedEmoji, ufoExperiences } from '../../util/analytics';
 import { SAMPLING_RATE_EMOJI_RENDERED_EXP } from '../../util/constants';
 const ResourcedEmojiComponent = Loadable({
-  loader: () => import(
-  /* webpackChunkName: "@atlaskit-internal_resourcedEmojiComponent" */
-  './ResourcedEmojiComponent').then(component => component.ResourcedEmojiComponent),
+  loader: () => import( /* webpackChunkName: "@atlaskit-internal_resourcedEmojiComponent" */'./ResourcedEmojiComponent').then(component => component.ResourcedEmojiComponent),
   loading: () => null
 });
-
 const ResourcedEmoji = props => {
   const {
     emojiId
@@ -18,7 +15,6 @@ const ResourcedEmoji = props => {
     if (!emojiId) {
       return;
     }
-
     sampledUfoRenderedEmoji(emojiId).start({
       samplingRate: SAMPLING_RATE_EMOJI_RENDERED_EXP
     });
@@ -39,5 +35,4 @@ const ResourcedEmoji = props => {
     experiences: [ufoExperiences['emoji-rendered'].getInstance(props.emojiId.id || props.emojiId.shortName)]
   }, /*#__PURE__*/React.createElement(ResourcedEmojiComponent, props));
 };
-
 export default ResourcedEmoji;

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

@@ -8,13 +8,11 @@ import { sampledUfoRenderedEmoji } from '../../util/analytics';
 import { EmojiCommonProvider } from '../../context/EmojiCommonProvider';
 import { hasUfoMarked } from '../../util/analytics/ufoExperiences';
 var ResourcedEmojiComponentRenderStatesEnum;
-
 (function (ResourcedEmojiComponentRenderStatesEnum) {
   ResourcedEmojiComponentRenderStatesEnum["INITIAL"] = "INITIAL";
   ResourcedEmojiComponentRenderStatesEnum["FALLBACK"] = "FALLBACK";
   ResourcedEmojiComponentRenderStatesEnum["EMOJI"] = "EMOJI";
 })(ResourcedEmojiComponentRenderStatesEnum || (ResourcedEmojiComponentRenderStatesEnum = {}));
-
 export const ResourcedEmojiComponent = props => {
   const {
     emojiProvider,
@@ -44,16 +42,12 @@ export const ResourcedEmojiComponent = props => {
         }
       });
     }
-
     const foundEmoji = _emojiProvider.fetchByEmojiId(emojiId, optimisticFetch);
-
     sampledUfoRenderedEmoji(emojiId).mark(UfoEmojiTimings.METADATA_START);
-
     if (isPromise(foundEmoji)) {
       setLoaded(false);
       foundEmoji.then(emoji => {
         setEmoji(emoji);
-
         if (!emoji) {
           // emoji is undefined
           sampledUfoRenderedEmoji(emojiId).failure({
@@ -97,7 +91,6 @@ export const ResourcedEmojiComponent = props => {
     if (!emojiId) {
       return;
     }
-
     if (!hasUfoMarked(sampledUfoRenderedEmoji(emojiId), UfoEmojiTimings.FMP_END)) {
       sampledUfoRenderedEmoji(emojiId).markFMP();
     }
@@ -106,7 +99,6 @@ export const ResourcedEmojiComponent = props => {
     if (!resolvedEmojiProvider || !emojiId) {
       return;
     }
-
     fetchOrGetEmoji(resolvedEmojiProvider, emojiId, optimistic);
   }, [resolvedEmojiProvider, emojiId, optimistic, fetchOrGetEmoji]);
   useEffect(() => {
@@ -120,7 +112,6 @@ export const ResourcedEmojiComponent = props => {
     } else if (!emoji && loaded || imageLoadError) {
       return ResourcedEmojiComponentRenderStatesEnum.FALLBACK;
     }
-
     return ResourcedEmojiComponentRenderStatesEnum.EMOJI;
   }, [emoji, loaded, optimisticImageURL, imageLoadError]);
   const optimisticEmojiDescription = useMemo(() => {
@@ -130,7 +121,8 @@ export const ResourcedEmojiComponent = props => {
           width,
           height
         } = emoji.representation;
-        return { ...emoji,
+        return {
+          ...emoji,
           representation: {
             width,
             height,
@@ -153,10 +145,8 @@ export const ResourcedEmojiComponent = props => {
         };
       }
     }
-
     return emoji;
   }, [emoji, optimisticImageURL, fallback, fitToHeight, id, shortName]);
-
   const handleOnLoadError = emojiId => {
     setImageLoadError(true);
     sampledUfoRenderedEmoji(emojiId).failure({
@@ -167,7 +157,6 @@ export const ResourcedEmojiComponent = props => {
       }
     });
   };
-
   return /*#__PURE__*/React.createElement(EmojiCommonProvider, {
     emojiProvider: resolvedEmojiProvider
   }, /*#__PURE__*/React.createElement("span", {

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

@@ -1,4 +1,5 @@
 /** @jsx jsx */
+
 import { FormattedMessage } from 'react-intl-next';
 import { jsx } from '@emotion/react';
 import AkButton from '@atlaskit/button/custom-theme-button';
@@ -7,13 +8,11 @@ import { messages } from '../i18n';
 import { buttonSpinner, uploadEmojiButton, uploadRetryButton } from './styles';
 export const retryUploadButtonTestId = 'retry-upload-button';
 export const uploadEmojiButtonTestId = 'upload-emoji-button';
-
 const LoadingSpinner = () => {
   return jsx("span", {
     css: buttonSpinner
   }, jsx(Spinner, null));
 };
-
 const RetryButton = props => {
   const {
     onSubmit
@@ -25,7 +24,6 @@ const RetryButton = props => {
     testId: retryUploadButtonTestId
   }, retryLabel));
 };
-
 const UploadButton = props => {
   const {
     appearance,
@@ -39,22 +37,17 @@ const UploadButton = props => {
     testId: uploadEmojiButtonTestId
   }, label);
 };
-
 const RetryableButton = props => {
   const {
     loading,
     error
   } = props;
-
   if (loading) {
     return jsx(LoadingSpinner, null);
   }
-
   if (error) {
     return jsx(RetryButton, props);
   }
-
   return jsx(UploadButton, props);
 };
-
 export default RetryableButton;