emoji-picker-react 4.20.1 → 4.20.4

package/dist/emoji-picker-react.esm.js

@@ -1,5 +1,5 @@
-import React__default, { memo, createElement, useState, useEffect, useContext, createContext, useRef, useMemo, createRef, useCallback, Fragment, useLayoutEffect, Suspense, Component } from 'react';
-import { createSheet, cx } from 'flairup';
+import React__default, { memo, createElement, useState, useEffect, useContext, createContext, useRef, useMemo, createRef, useCallback, Fragment, useLayoutEffect, Component } from 'react';
+import { createSheet, cx } from 'shipstyles';
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -26743,15 +26743,57 @@ var defaultEmojiData = {
 	emojis: emojis
 };
 
-function useIsMounted() {
-  var _React$useState = useState(false),
-    isMounted = _React$useState[0],
-    setIsMounted = _React$useState[1];
-  useEffect(function () {
-    setIsMounted(true);
-  }, []);
-  return isMounted;
+// Pure data helpers plus the legacy global registry. This module intentionally
+function unifiedWithoutSkinTone$1(unified) {
+  var splat = unified.split('-');
+  var _splat$splice = splat.splice(1, 1),
+    skinTone = _splat$splice[0];
+  if (skinTonesMapped[skinTone]) {
+    return splat.join('-');
+  }
+  return unified;
 }
+function emojiUnified$1(emoji, skinTone) {
+  var _emojiVariationUnifie;
+  var unified = emoji[EmojiProperties.unified];
+  if (!skinTone || !emojiHasVariations$1(emoji)) {
+    return unified;
+  }
+  return (_emojiVariationUnifie = emojiVariationUnified$1(emoji, skinTone)) != null ? _emojiVariationUnifie : unified;
+}
+function emojiVariations$1(emoji) {
+  var _emoji$EmojiPropertie2;
+  return (_emoji$EmojiPropertie2 = emoji[EmojiProperties.variations]) != null ? _emoji$EmojiPropertie2 : [];
+}
+function emojiHasVariations$1(emoji) {
+  return emojiVariations$1(emoji).length > 0;
+}
+function emojiVariationUnified$1(emoji, skinTone) {
+  return skinTone ? emojiVariations$1(emoji).find(function (variation) {
+    return variation.includes(skinTone);
+  }) : emojiUnified$1(emoji);
+}
+function emojiByUnified(unified) {
+  if (!unified) {
+    return;
+  }
+  if (allEmojisByUnified[unified]) {
+    return allEmojisByUnified[unified];
+  }
+  var withoutSkinTone = unifiedWithoutSkinTone$1(unified);
+  return allEmojisByUnified[withoutSkinTone];
+}
+var allEmojis = /*#__PURE__*/Object.values(defaultEmojiData.emojis).flat();
+var allEmojisByUnified = {};
+allEmojis.reduce(function (allEmojis, Emoji) {
+  allEmojis[emojiUnified$1(Emoji)] = Emoji;
+  if (emojiHasVariations$1(Emoji)) {
+    emojiVariations$1(Emoji).forEach(function (variation) {
+      allEmojis[variation] = Emoji;
+    });
+  }
+  return allEmojis;
+}, allEmojisByUnified);
 
 var SUGGESTED_LS_KEY = 'epr_suggested';
 function getSuggested(mode) {
@@ -26773,8 +26815,8 @@ function getSuggested(mode) {
 }
 function setSuggested(emoji, skinTone) {
   var recent = getSuggested();
-  var unified = emojiUnified$1(emoji, skinTone);
-  var originalUnified = emojiUnified$1(emoji);
+  var unified = emojiUnified(emoji, skinTone);
+  var originalUnified = emojiUnified(emoji);
   var existing = recent.find(function (_ref) {
     var u = _ref.unified;
     return u === unified;
@@ -26805,99 +26847,14 @@ function setSuggested(emoji, skinTone) {
   }
 }
 
-function emojiNames$1(emoji) {
-  var _emoji$EmojiPropertie;
-  return (_emoji$EmojiPropertie = emoji[EmojiProperties.name]) != null ? _emoji$EmojiPropertie : [];
-}
-function emojiName$1(emoji) {
-  if (!emoji) {
-    return '';
-  }
-  var names = emojiNames$1(emoji);
-  return names[names.length - 1];
-}
-function unifiedWithoutSkinTone$1(unified) {
-  var splat = unified.split('-');
-  var _splat$splice = splat.splice(1, 1),
-    skinTone = _splat$splice[0];
-  if (skinTonesMapped[skinTone]) {
-    return splat.join('-');
-  }
-  return unified;
-}
-function emojiUnified$1(emoji, skinTone) {
-  var _emojiVariationUnifie;
-  var unified = emoji[EmojiProperties.unified];
-  if (!skinTone || !emojiHasVariations$1(emoji)) {
-    return unified;
-  }
-  return (_emojiVariationUnifie = emojiVariationUnified$1(emoji, skinTone)) != null ? _emojiVariationUnifie : unified;
-}
-function useGetEmojisByCategory() {
-  var suggestedEmojisModeConfig = useSuggestedEmojisModeConfig();
-  var _useUpdateSuggested = useUpdateSuggested(),
-    suggestedUpdated = _useUpdateSuggested[0];
-  // Suggestions come from localStorage, which doesn't exist during SSR.
-  // Read them only after mount so the first client render matches the server.
-  var isMounted = useIsMounted();
-  var suggested = React__default.useMemo(function () {
-    var _getSuggested;
-    if (!isMounted) {
-      return [];
-    }
-    var suggested = (_getSuggested = getSuggested(suggestedEmojisModeConfig)) != null ? _getSuggested : [];
-    return suggested.map(function (s) {
-      return emojiByUnified(s.unified);
-    }).filter(Boolean);
-  },
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [isMounted, suggestedUpdated, suggestedEmojisModeConfig]);
-  return function getEmojisByCategory(category) {
-    var _emojis$emojis$catego;
-    if (category === Categories.SUGGESTED) {
-      return suggested;
-    }
-    // @ts-ignore
-    return (_emojis$emojis$catego = defaultEmojiData.emojis[category]) != null ? _emojis$emojis$catego : [];
-  };
-}
-function emojiVariations$1(emoji) {
-  var _emoji$EmojiPropertie2;
-  return (_emoji$EmojiPropertie2 = emoji[EmojiProperties.variations]) != null ? _emoji$EmojiPropertie2 : [];
-}
-function emojiHasVariations$1(emoji) {
-  return emojiVariations$1(emoji).length > 0;
-}
-function emojiVariationUnified$1(emoji, skinTone) {
-  return skinTone ? emojiVariations$1(emoji).find(function (variation) {
-    return variation.includes(skinTone);
-  }) : emojiUnified$1(emoji);
-}
-function emojiByUnified(unified) {
-  if (!unified) {
-    return;
-  }
-  if (allEmojisByUnified[unified]) {
-    return allEmojisByUnified[unified];
-  }
-  var withoutSkinTone = unifiedWithoutSkinTone$1(unified);
-  return allEmojisByUnified[withoutSkinTone];
-}
-var allEmojis = /*#__PURE__*/Object.values(defaultEmojiData.emojis).flat();
-var allEmojisByUnified = {};
-allEmojis.reduce(function (allEmojis, Emoji) {
-  allEmojis[emojiUnified$1(Emoji)] = Emoji;
-  if (emojiHasVariations$1(Emoji)) {
-    emojiVariations$1(Emoji).forEach(function (variation) {
-      allEmojis[variation] = Emoji;
-    });
-  }
-  return allEmojis;
-}, allEmojisByUnified);
-function activeVariationFromUnified$1(unified) {
-  var _unified$split = unified.split('-'),
-    suspectedSkinTone = _unified$split[1];
-  return skinToneVariations.includes(suspectedSkinTone) ? suspectedSkinTone : null;
+function useIsMounted() {
+  var _React$useState = useState(false),
+    isMounted = _React$useState[0],
+    setIsMounted = _React$useState[1];
+  useEffect(function () {
+    setIsMounted(true);
+  }, []);
+  return isMounted;
 }
 
 var PickerDataContext = /*#__PURE__*/React__default.createContext({
@@ -26967,7 +26924,7 @@ function PickerDataProvider(_ref) {
 function usePickerDataContext() {
   return React__default.useContext(PickerDataContext);
 }
-function useGetEmojisByCategory$1() {
+function useGetEmojisByCategory() {
   var _usePickerDataContext = usePickerDataContext(),
     emojiData = _usePickerDataContext.emojiData,
     emojiByUnified = _usePickerDataContext.emojiByUnified;
@@ -28339,7 +28296,7 @@ function useOnFocus() {
       if (!emoji) {
         return;
       }
-      if (emojiHasVariations$1(emoji)) {
+      if (emojiHasVariations(emoji)) {
         preloadEmoji(getEmojiUrl, emoji, emojiStyle);
       }
     }
@@ -28816,7 +28773,7 @@ function useMouseDownHandlers(ContainerRef, mouseEventSource) {
     if (!emoji || !unified) {
       return;
     }
-    var skinToneToUse = activeVariationFromUnified$1(unified) || activeSkinTone;
+    var skinToneToUse = activeVariationFromUnified(unified) || activeSkinTone;
     updateSuggested();
     setSuggested(emoji, skinToneToUse);
     onEmojiClick(emojiClickOutput(emoji, skinToneToUse, activeEmojiStyle, getEmojiUrl), event);
@@ -28827,7 +28784,7 @@ function useMouseDownHandlers(ContainerRef, mouseEventSource) {
     }
     var _emojiFromEvent2 = emojiFromEvent(event, emojiByUnified),
       emoji = _emojiFromEvent2[0];
-    if (!emoji || !emojiHasVariations$1(emoji)) {
+    if (!emoji || !emojiHasVariations(emoji)) {
       return;
     }
     mouseDownTimerRef.current = setTimeout(function () {
@@ -28893,9 +28850,9 @@ function emojiFromEvent(event, lookupEmojiByUnified) {
   return [emoji, unified != null ? unified : resolvedUnified];
 }
 function emojiClickOutput(emoji, activeSkinTone, activeEmojiStyle, getEmojiUrl) {
-  var names = emojiNames$1(emoji);
+  var names = emojiNames(emoji);
   if (isCustomEmoji(emoji)) {
-    var _unified = emojiUnified$1(emoji);
+    var _unified = emojiUnified(emoji);
     return {
       activeSkinTone: activeSkinTone,
       emoji: _unified,
@@ -28909,7 +28866,7 @@ function emojiClickOutput(emoji, activeSkinTone, activeEmojiStyle, getEmojiUrl)
       unifiedWithoutSkinTone: _unified
     };
   }
-  var unified = emojiUnified$1(emoji, activeSkinTone);
+  var unified = emojiUnified(emoji, activeSkinTone);
   return {
     activeSkinTone: activeSkinTone,
     emoji: parseNativeEmoji(unified),
@@ -28923,7 +28880,7 @@ function emojiClickOutput(emoji, activeSkinTone, activeEmojiStyle, getEmojiUrl)
     isCustom: false,
     names: names,
     unified: unified,
-    unifiedWithoutSkinTone: emojiUnified$1(emoji)
+    unifiedWithoutSkinTone: emojiUnified(emoji)
   };
 }
 
@@ -29165,13 +29122,13 @@ function ClickableEmoji(_ref) {
     _ref$noBackground = _ref.noBackground,
     noBackground = _ref$noBackground === void 0 ? false : _ref$noBackground,
     style = _ref.style;
-  var hasVariations = emojiHasVariations$1(emoji);
+  var hasVariations = emojiHasVariations(emoji);
   return createElement(ClickableEmojiButton, {
     hasVariations: hasVariations,
     showVariations: showVariations,
     hidden: hidden,
     hiddenOnSearch: hiddenOnSearch,
-    emojiNames: emojiNames$1(emoji),
+    emojiNames: emojiNames(emoji),
     unified: unified,
     noBackground: noBackground,
     style: style
@@ -29594,7 +29551,7 @@ function MeasureEmoji() {
   }
   var firstCategory = categories[0];
   var dummyEmoji = getEmojisByCategory(categoryFromCategoryConfig(firstCategory))[0];
-  var unified = dummyEmoji ? emojiUnified$1(dummyEmoji, activeSkinTone) : '';
+  var unified = dummyEmoji ? emojiUnified(dummyEmoji, activeSkinTone) : '';
   if (!dummyEmoji) {
     return null;
   }
@@ -29628,7 +29585,7 @@ function EmojiList(_ref) {
     categoryHeights = _React$useState[0],
     setCategoryHeights = _React$useState[1];
   var EmojiListRef = useEmojiListRef();
-  var getEmojisByCategory = useGetEmojisByCategory$1();
+  var getEmojisByCategory = useGetEmojisByCategory();
   var labelHeight = getLabelHeight(EmojiListRef.current);
   var topOffset = 0;
   return createElement("ul", {
@@ -29641,9 +29598,8 @@ function EmojiList(_ref) {
     if (categoryHeight) {
       topOffset += categoryHeight + labelHeight;
     }
-    return createElement(Suspense, {
-      key: category
-    }, createElement(RenderCategory, {
+    return createElement(RenderCategory, {
+      key: category,
       categoryEmojis: getEmojisByCategory(category),
       categoryConfig: categoryConfig,
       topOffset: currentOffset,
@@ -29656,7 +29612,7 @@ function EmojiList(_ref) {
         }
       },
       scrollTop: scrollTop
-    }));
+    });
   }));
 }
 function RenderCategory(_ref2) {
@@ -29715,7 +29671,7 @@ function EmojiVariationPicker() {
   var getPointerStyle = usePointerStyle(VariationPickerRef);
   var getEmojiUrl = useGetEmojiUrlConfig();
   var button = buttonFromTarget(AnchoredEmojiRef.current);
-  var visible = Boolean(emoji && button && emojiHasVariations$1(emoji) && button.classList.contains(ClassNames.emojiHasVariations));
+  var visible = Boolean(emoji && button && emojiHasVariations(emoji) && button.classList.contains(ClassNames.emojiHasVariations));
   useEffect(function () {
     if (!visible) {
       return;
@@ -29735,7 +29691,7 @@ function EmojiVariationPicker() {
     style: {
       top: top
     }
-  }, visible && emoji ? [emojiUnified$1(emoji)].concat(emojiVariations$1(emoji)).slice(0, 6).map(function (unified) {
+  }, visible && emoji ? [emojiUnified(emoji)].concat(emojiVariations(emoji)).slice(0, 6).map(function (unified) {
     return createElement(ClickableEmoji, {
       key: unified,
       emoji: emoji,
@@ -30251,7 +30207,7 @@ function PreviewBody() {
     if (!defaultEmoji) {
       return null;
     }
-    var defaultText = variationPickerEmoji ? emojiName$1(variationPickerEmoji) : previewConfig.defaultCaption;
+    var defaultText = variationPickerEmoji ? emojiName(variationPickerEmoji) : previewConfig.defaultCaption;
     return createElement(Fragment, null, createElement("div", null, show ? createElement(ViewOnlyEmoji, {
       unified: previewEmoji == null ? void 0 : previewEmoji.unified,
       emoji: emoji,
@@ -30260,7 +30216,7 @@ function PreviewBody() {
       getEmojiUrl: getEmojiUrl,
       className: cx(styles$e.emoji)
     }) : defaultEmoji ? createElement(ViewOnlyEmoji, {
-      unified: emojiUnified$1(defaultEmoji),
+      unified: emojiUnified(defaultEmoji),
       emoji: defaultEmoji,
       emojiStyle: emojiStyle,
       size: 45,
@@ -30268,7 +30224,7 @@ function PreviewBody() {
       className: cx(styles$e.emoji)
     }) : null), createElement("div", {
       className: cx(styles$e.label)
-    }, show ? emojiName$1(emoji) : defaultText));
+    }, show ? emojiName(emoji) : defaultText));
   }
 }
 var styles$e = /*#__PURE__*/stylesheet.create({