@atlaskit/emoji 67.0.4 → 67.0.6

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

@@ -9,17 +9,14 @@ import * as styles from './styles';
 export default class Scrollable extends PureComponent {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "scrollableDiv", null);
-
     _defineProperty(this, "reveal", (child, forceToTop) => {
       if (child && this.scrollableDiv) {
-        const childNode = findDOMNode(child); // Not using Element.scrollIntoView as it scrolls even to top/bottom of view even if
+        const childNode = findDOMNode(child);
+        // Not using Element.scrollIntoView as it scrolls even to top/bottom of view even if
         // already visible
-
         const scrollableRect = this.scrollableDiv.getBoundingClientRect();
         const elementRect = childNode.getBoundingClientRect();
-
         if (forceToTop || elementRect.top < scrollableRect.top) {
           this.scrollableDiv.scrollTop += elementRect.top - scrollableRect.top;
         } else if (elementRect.bottom > scrollableRect.bottom) {
@@ -27,32 +24,26 @@ export default class Scrollable extends PureComponent {
         }
       }
     });
-
     _defineProperty(this, "scrollToBottom", () => {
       if (this.scrollableDiv) {
         this.scrollableDiv.scrollTop = this.scrollableDiv.scrollHeight;
       }
     });
-
     _defineProperty(this, "handleScroll", event => {
       const sampleOffset = 10;
       let firstElement;
-
       if (this.scrollableDiv) {
         const scrollableRect = this.scrollableDiv.getBoundingClientRect();
         firstElement = document.elementFromPoint(scrollableRect.left + sampleOffset, scrollableRect.top + sampleOffset);
       }
-
       if (this.props.onScroll && firstElement) {
         this.props.onScroll(firstElement, event);
       }
     });
-
     _defineProperty(this, "handleRef", ref => {
       this.scrollableDiv = ref;
     });
   }
-
   render() {
     const {
       children,
@@ -72,5 +63,4 @@ export default class Scrollable extends PureComponent {
       style: style
     }, children);
   }
-
 }

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

@@ -3,15 +3,12 @@ import EmojiButton from './EmojiButton';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { createAndFireEventInElementsChannel, toneSelectedEvent, toneSelectorOpenedEvent } from '../../util/analytics';
 import { setSkinToneAriaLabelText } from './setSkinToneAriaLabelText';
-
 const extractAllTones = emoji => {
   if (emoji.skinVariations) {
     return [emoji, ...emoji.skinVariations];
   }
-
   return [emoji];
 };
-
 export const ToneSelectorInternal = props => {
   const {
     createAnalyticsEvent,
@@ -22,7 +19,8 @@ export const ToneSelectorInternal = props => {
   const isMounted = useRef(false);
   const firstToneButtonRef = useRef(null);
   const emojiToneCollection = useMemo(() => {
-    return extractAllTones(emoji).map((tone, index) => ({ ...tone,
+    return extractAllTones(emoji).map((tone, index) => ({
+      ...tone,
       focused: tone.id !== previewEmojiId,
       label: setSkinToneAriaLabelText(tone.name),
       toneId: index
@@ -33,13 +31,11 @@ export const ToneSelectorInternal = props => {
       firstToneButtonRef.current.focus();
     }
   }, [firstToneButtonRef]);
-
   const fireAnalyticsEvent = event => {
     if (createAnalyticsEvent) {
       createAndFireEventInElementsChannel(event)(createAnalyticsEvent);
     }
   };
-
   const onToneSelectedHandler = toneValue => () => {
     onToneSelected(toneValue);
     const toneList = ['default', 'light', 'mediumLight', 'medium', 'mediumDark', 'dark'];
@@ -47,11 +43,9 @@ export const ToneSelectorInternal = props => {
       skinToneModifier: toneList[toneValue]
     }));
   };
-
   if (!isMounted.current) {
     fireAnalyticsEvent(toneSelectorOpenedEvent({}));
   }
-
   isMounted.current = true;
   return /*#__PURE__*/React.createElement("div", null, emojiToneCollection.map(tone => {
     return /*#__PURE__*/React.createElement(EmojiButton, {

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

@@ -15,9 +15,7 @@ export class UfoErrorBoundary extends React.Component {
       });
     }
   }
-
   render() {
     return this.props.children;
   }
-
 }

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

@@ -6,7 +6,6 @@ import { extractErrorInfo } from '../../util/analytics/analytics';
 export const uploadEmoji = (upload, emojiProvider, errorSetter, onSuccess, fireAnalytics, retry) => {
   const startTime = Date.now();
   errorSetter(undefined);
-
   if (supportsUploadFeature(emojiProvider)) {
     ufoExperiences['emoji-uploaded'].start();
     emojiProvider.uploadCustomEmoji(upload, retry).then(emojiDescription => {
@@ -16,8 +15,8 @@ export const uploadEmoji = (upload, emojiProvider, errorSetter, onSuccess, fireA
       onSuccess(emojiDescription);
       ufoExperiences['emoji-uploaded'].success();
     }).catch(err => {
-      errorSetter(messages.emojiUploadFailed); // eslint-disable-next-line no-console
-
+      errorSetter(messages.emojiUploadFailed);
+      // eslint-disable-next-line no-console
       console.error('Unable to upload emoji', err);
       fireAnalytics(uploadFailedEvent({
         duration: Date.now() - startTime,

package/dist/es2019/components/common/internal-types.js

@@ -1,5 +1,4 @@
 export let UploadStatus;
-
 (function (UploadStatus) {
   UploadStatus[UploadStatus["Waiting"] = 0] = "Waiting";
   UploadStatus[UploadStatus["Uploading"] = 1] = "Uploading";

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

@@ -100,7 +100,6 @@ export const emojiButton = css({
   border: '0',
   cursor: 'pointer',
   padding: 0,
-
   /* Firefox */
   ['&::-moz-focus-inner']: {
     border: '0 none',
@@ -124,8 +123,9 @@ export const emojiButton = css({
 export const hiddenToneButton = css({
   // Hide currently selected tone that rendered in the ToneSelector to avoid duplication
   display: 'none'
-}); // Emoji Preview
+});
 
+// Emoji Preview
 export const emojiPickerAddEmoji = 'emoji-picker-add-emoji';
 export const previewText = css({
   display: 'flex',
@@ -134,9 +134,7 @@ export const previewText = css({
   marginTop: '-2px',
   marginLeft: '10px',
   maxWidth: '285px',
-  width: '285px'
-  /* IE */
-  ,
+  width: '285px' /* IE */,
   flexGrow: 1,
   flexShrink: 1
 });
@@ -193,7 +191,9 @@ export const previewImg = css({
     padding: 0,
     display: 'block'
   }
-}); // Scrollable
+});
+
+// Scrollable
 
 export const emojiScrollable = css({
   border: `1px solid ${"var(--ds-border, #fff)"}`,
@@ -203,7 +203,9 @@ export const emojiScrollable = css({
   overflowX: 'hidden',
   overflowY: 'auto',
   padding: '0'
-}); // EmojiUpload
+});
+
+// EmojiUpload
 
 export const emojiUpload = css({
   height: '78px',
@@ -293,7 +295,9 @@ export const addCustomEmoji = css({
   alignSelf: 'center',
   marginLeft: '10px',
   marginBottom: '10px'
-}); // Emoji Delete preview
+});
+
+// Emoji Delete preview
 
 export const submitDelete = 'emoji-submit-delete';
 export const deletePreview = css({

package/dist/es2019/components/picker/CategorySelector.js

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';
@@ -10,54 +9,42 @@ import { messages } from '../i18n';
 import { CategoryDescriptionMap } from './categories';
 import { active, categorySelector, disable, categoryStyles } from './styles';
 export const sortCategories = (c1, c2) => CategoryDescriptionMap[c1].order - CategoryDescriptionMap[c2].order;
-
 const addNewCategories = (oldCategories, newCategories) => {
   if (!newCategories) {
     return oldCategories;
   }
-
   return oldCategories.concat(newCategories.filter(category => !!CategoryDescriptionMap[category])).sort(sortCategories);
 };
-
 export const categorySelectorComponentTestId = 'category-selector-component';
 export const categorySelectorCategoryTestId = categoryId => `category-selector-${categoryId}`;
-
 class CategorySelector extends PureComponent {
   constructor(props) {
     super(props);
-
     _defineProperty(this, "onClick", event => {
       const {
         onCategorySelected,
         disableCategories
       } = this.props;
-
       if (disableCategories) {
         event.preventDefault();
         return;
       }
-
       const categoryId = event.currentTarget.getAttribute('data-category-id');
-
       if (onCategorySelected) {
         onCategorySelected(categoryId);
       }
     });
-
     const {
       dynamicCategories
     } = props;
     let categories = defaultCategories;
-
     if (dynamicCategories) {
       categories = addNewCategories(categories, dynamicCategories);
     }
-
     this.state = {
       categories
     };
   }
-
   UNSAFE_componentWillUpdate(nextProps) {
     if (this.props.dynamicCategories !== nextProps.dynamicCategories) {
       this.setState({
@@ -65,7 +52,6 @@ class CategorySelector extends PureComponent {
       });
     }
   }
-
   render() {
     const {
       disableCategories,
@@ -75,7 +61,6 @@ class CategorySelector extends PureComponent {
       categories
     } = this.state;
     let categoriesSection;
-
     if (categories) {
       const {
         formatMessage
@@ -85,15 +70,12 @@ class CategorySelector extends PureComponent {
       }, categories.map(categoryId => {
         const category = CategoryDescriptionMap[categoryId];
         const categoryClasses = [categoryStyles];
-
         if (categoryId === this.props.activeCategoryId) {
           categoryClasses.push(active);
         }
-
         if (disableCategories) {
           categoryClasses.push(disable);
         }
-
         const Icon = category.icon;
         const categoryName = formatMessage(messages[category.name]);
         return jsx("li", {
@@ -112,17 +94,13 @@ class CategorySelector extends PureComponent {
         })));
       }));
     }
-
     return jsx("div", {
       css: categorySelector
     }, categoriesSection);
   }
-
 }
-
 _defineProperty(CategorySelector, "defaultProps", {
   onCategorySelected: () => {},
   dynamicCategories: []
 });
-
 export default injectIntl(CategorySelector);

package/dist/es2019/components/picker/CategoryTracker.js

@@ -8,51 +8,41 @@ export default class CategoryTracker {
   constructor() {
     this.reset();
   }
-
   reset() {
     this.categoryToRow = new Map();
     this.rowToCategory = new Map();
   }
-
   add(category, row) {
     if (!this.categoryToRow.has(category)) {
       this.categoryToRow.set(category, row);
       this.rowToCategory.set(row, category);
     }
   }
-
   getRow(category) {
     return this.categoryToRow.get(category);
   }
-
   findNearestCategoryAbove(startIndex, list) {
     const rows = Array.from(this.rowToCategory.keys()).sort((a, b) => a - b);
-
     if (rows.length === 0) {
       return;
-    } // Return first category if list not yet rendered
-    // or the top row is above the first category
-
+    }
 
+    // Return first category if list not yet rendered
+    // or the top row is above the first category
     if (!list || rows[0] > startIndex) {
       return this.rowToCategory.get(rows[0]);
     }
-
     let bounds = [0, rows.length - 1];
     let index = Math.floor(rows.length / 2);
-
     while (rows[index] !== startIndex && bounds[0] < bounds[1]) {
       if (rows[index] > startIndex) {
         bounds[1] = Math.max(index - 1, 0);
       } else {
         bounds[0] = index + 1;
       }
-
       index = Math.floor((bounds[0] + bounds[1]) / 2);
     }
-
     const headerRow = rows[rows[index] > startIndex ? Math.max(index - 1, 0) : index];
     return this.rowToCategory.get(headerRow);
   }
-
 }

package/dist/es2019/components/picker/EmojiPicker.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
+
 import { jsx } from '@emotion/react';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { ufoExperiences } from '../../util/analytics';
@@ -10,49 +10,38 @@ import { emojiPicker } from './styles';
 import { UfoErrorBoundary } from '../common/UfoErrorBoundary';
 import { defaultEmojiPickerSize } from '../../util/constants';
 import { EmojiCommonProvider } from '../../context/EmojiCommonProvider';
-
-const emojiPickerModuleLoader = () => import(
-/* webpackChunkName:"@atlaskit-internal_emojiPickerComponent" */
-'./EmojiPickerComponent');
-
+const emojiPickerModuleLoader = () => import( /* webpackChunkName:"@atlaskit-internal_emojiPickerComponent" */'./EmojiPickerComponent');
 const emojiPickerLoader = () => emojiPickerModuleLoader().then(module => module.default);
-
 export class EmojiPickerInternal extends LoadingEmojiComponent {
   // state initialised with static component to prevent
   // rerender when the module has already been loaded
+
   constructor(props) {
     super(props, {});
-
     _defineProperty(this, "state", {
       asyncLoadedComponent: EmojiPickerInternal.AsyncLoadedComponent
     });
-
     ufoExperiences['emoji-picker-opened'].start();
   }
-
   asyncLoadComponent() {
     emojiPickerLoader().then(component => {
       EmojiPickerInternal.AsyncLoadedComponent = component;
       this.setAsyncState(component);
     });
   }
-
   renderLoading() {
     const item = new LoadingItem();
-
     const handlePickerRef = ref => {
       if (this.props.onPickerRef) {
         this.props.onPickerRef(ref);
       }
     };
-
     ufoExperiences['emoji-picker-opened'].markFMP();
     return jsx("div", {
       css: emojiPicker(),
       ref: handlePickerRef
     }, item.renderItem());
   }
-
   renderLoaded(loadedEmojiProvider, EmojiPickerComponent) {
     const {
       emojiProvider,
@@ -64,12 +53,9 @@ export class EmojiPickerInternal extends LoadingEmojiComponent {
       emojiProvider: loadedEmojiProvider
     }, jsx(EmojiPickerComponent, otherProps)));
   }
-
 }
-
 _defineProperty(EmojiPickerInternal, "defaultProps", {
   size: defaultEmojiPickerSize
 });
-
 const EmojiPicker = withAnalyticsEvents()(EmojiPickerInternal);
 export default EmojiPicker;

package/dist/es2019/components/picker/EmojiPickerCategoryHeading.js

@@ -1,15 +1,15 @@
 /** @jsx jsx */
+
 import { jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import { isMessagesKey } from '../../util/type-helpers';
 import { messages } from '../i18n';
 import { emojiCategoryTitle } from './styles';
+
 /**
  * Test id for wrapper Emoji Picker List div
  */
-
 export const RENDER_EMOJI_PICKER_CATEGORY_HEADING_TESTID = 'render-emoji-picker-categorty-heading';
-
 const EmojiPickerCategoryHeading = ({
   id,
   title,
@@ -22,5 +22,4 @@ const EmojiPickerCategoryHeading = ({
 }, jsx("div", {
   css: emojiCategoryTitle
 }, isMessagesKey(title) ? jsx(FormattedMessage, messages[title]) : title));
-
 export default EmojiPickerCategoryHeading;