emoji-picker-react 4.5.8 → 4.5.10

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

@@ -1,4 +1,4 @@
-import React__default, { useRef, createElement, createContext, createRef, useContext, useState, useMemo, useEffect, useCallback, Fragment, memo, Component } from 'react';
+import React__default, { useRef, createElement, createContext, createRef, useContext, useState, useEffect, useMemo, useCallback, Fragment, memo, Component } from 'react';
 
 var ClassNames;
 
@@ -16845,7 +16845,8 @@ function emojiByUnified(unified) {
   return allEmojisByUnified[withoutSkinTone];
 }
 var allEmojis = /*#__PURE__*/Object.values(emojis).flat();
-function addCustomEmojis(customEmojis) {
+function setCustomEmojis(customEmojis) {
+  emojis[Categories.CUSTOM] = [];
   customEmojis.forEach(function (emoji) {
     var emojiData = customToRegularEmoji(emoji);
 
@@ -16908,7 +16909,7 @@ function mergeConfig(userConfig) {
   var categories = mergeCategoriesConfig(userConfig.categories, {
     suggestionMode: config.suggestedEmojisMode
   });
-  addCustomEmojis((_config$customEmojis = config.customEmojis) != null ? _config$customEmojis : []);
+  setCustomEmojis((_config$customEmojis = config.customEmojis) != null ? _config$customEmojis : []);
   var skinTonePickerLocation = config.searchDisabled ? SkinTonePickerLocation.PREVIEW : config.skinTonePickerLocation;
   return _extends({}, config, {
     categories: categories,
@@ -16951,14 +16952,30 @@ function PickerConfigProvider(_ref) {
   var children = _ref.children,
       config = _objectWithoutPropertiesLoose(_ref, _excluded);
 
+  var mergedConfig = useSetConfig(config);
+  return createElement(ConfigContext.Provider, {
+    value: mergedConfig
+  }, children);
+}
+function useSetConfig(config) {
+  var _config$customEmojis2;
+
   var _React$useState = useState(function () {
     return mergeConfig(config);
   }),
-      mergedConfig = _React$useState[0];
+      mergedConfig = _React$useState[0],
+      setMergedConfig = _React$useState[1];
 
-  return createElement(ConfigContext.Provider, {
-    value: mergedConfig
-  }, children);
+  useEffect(function () {
+    var _config$customEmojis, _mergedConfig$customE;
+
+    if (((_config$customEmojis = config.customEmojis) == null ? void 0 : _config$customEmojis.length) !== ((_mergedConfig$customE = mergedConfig.customEmojis) == null ? void 0 : _mergedConfig$customE.length)) {
+      setMergedConfig(mergeConfig(config));
+    } // not gonna...
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  }, [(_config$customEmojis2 = config.customEmojis) == null ? void 0 : _config$customEmojis2.length]);
+  return mergedConfig;
 }
 function usePickerConfig() {
   return useContext(ConfigContext);
@@ -19886,7 +19903,11 @@ function EmojiPicker(props) {
 
 
 var EmojiPickerReact = /*#__PURE__*/memo(EmojiPicker, function (prev, next) {
-  return prev.emojiVersion === next.emojiVersion && prev.searchPlaceHolder === next.searchPlaceHolder && prev.searchPlaceholder === next.searchPlaceholder && prev.defaultSkinTone === next.defaultSkinTone && prev.skinTonesDisabled === next.skinTonesDisabled && prev.autoFocusSearch === next.autoFocusSearch && prev.emojiStyle === next.emojiStyle && prev.theme === next.theme && prev.suggestedEmojisMode === next.suggestedEmojisMode && prev.lazyLoadEmojis === next.lazyLoadEmojis && prev.height === next.height && prev.width === next.width && prev.searchDisabled === next.searchDisabled && prev.skinTonePickerLocation === next.skinTonePickerLocation;
+  var _prev$customEmojis, _next$customEmojis;
+
+  var prevCustomEmojis = (_prev$customEmojis = prev.customEmojis) != null ? _prev$customEmojis : [];
+  var nextCustomEmojis = (_next$customEmojis = next.customEmojis) != null ? _next$customEmojis : [];
+  return prev.emojiVersion === next.emojiVersion && prev.searchPlaceHolder === next.searchPlaceHolder && prev.searchPlaceholder === next.searchPlaceholder && prev.defaultSkinTone === next.defaultSkinTone && prev.skinTonesDisabled === next.skinTonesDisabled && prev.autoFocusSearch === next.autoFocusSearch && prev.emojiStyle === next.emojiStyle && prev.theme === next.theme && prev.suggestedEmojisMode === next.suggestedEmojisMode && prev.lazyLoadEmojis === next.lazyLoadEmojis && prev.height === next.height && prev.width === next.width && prev.searchDisabled === next.searchDisabled && prev.skinTonePickerLocation === next.skinTonePickerLocation && prevCustomEmojis.length === nextCustomEmojis.length;
 });
 
 var ErrorBoundary = /*#__PURE__*/function (_React$Component) {