emoji-picker-react 4.7.9 → 4.7.11

package/dist/Stylesheet/stylesheet.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
 import { Styles } from 'flairup';
+import * as React from 'react';
 export declare const stylesheet: {
     create: <K extends string>(styles: Partial<{ [k in K]: Partial<Partial<CSSStyleDeclaration> & Partial<{
         '.'?: string | string[] | undefined;
@@ -9,7 +9,7 @@ export declare const stylesheet: {
     isApplied: () => boolean;
 };
 export declare const commonStyles: Record<never, Set<string>>;
-export declare function PickerStyleTag(): JSX.Element | null;
+export declare const PickerStyleTag: React.NamedExoticComponent<object>;
 export declare const commonInteractionStyles: Record<never, Set<string>>;
 export declare function darkMode(key: string, value: Styles): {
     '.epr-dark-theme': {

package/dist/emoji-picker-react.cjs.development.js

@@ -110,19 +110,7 @@ function asSelectors() {
   }).join('');
 }
 
-var isEverMounted = false;
-function useIsEverMounted() {
-  var _React$useState = React.useState(isEverMounted),
-    isMounted = _React$useState[0],
-    setIsMounted = _React$useState[1];
-  React.useEffect(function () {
-    setIsMounted(true);
-    isEverMounted = true;
-  }, []);
-  return isMounted || isEverMounted;
-}
-
-var stylesheet = /*#__PURE__*/flairup.createSheet('epr');
+var stylesheet = /*#__PURE__*/flairup.createSheet('epr', null);
 var hidden = {
   display: 'none',
   opacity: '0',
@@ -135,18 +123,14 @@ var commonStyles = /*#__PURE__*/stylesheet.create({
     '.': ClassNames.hidden
   }, hidden)
 });
-function PickerStyleTag() {
-  var isMounted = useIsEverMounted();
-  if (stylesheet.isApplied() && isMounted) {
-    return null;
-  }
+var PickerStyleTag = /*#__PURE__*/React.memo(function PickerStyleTag() {
   return React.createElement("style", {
     suppressHydrationWarning: true,
     dangerouslySetInnerHTML: {
       __html: stylesheet.getStyle()
     }
   });
-}
+});
 var commonInteractionStyles = /*#__PURE__*/stylesheet.create({
   '.epr-main': {
     ':has(input:not(:placeholder-shown))': {
@@ -18525,6 +18509,18 @@ var styles$6 = /*#__PURE__*/stylesheet.create({
   }
 });
 
+var isEverMounted = false;
+function useIsEverMounted() {
+  var _React$useState = React.useState(isEverMounted),
+    isMounted = _React$useState[0],
+    setIsMounted = _React$useState[1];
+  React.useEffect(function () {
+    setIsMounted(true);
+    isEverMounted = true;
+  }, []);
+  return isMounted || isEverMounted;
+}
+
 function Suggested(_ref) {
   var categoryConfig = _ref.categoryConfig;
   var _useUpdateSuggested = useUpdateSuggested(),
@@ -19423,7 +19419,7 @@ var DarkInactivePosition = {
     }
   }
 };
-var styles$e = /*#__PURE__*/stylesheet.create({
+var styles$e = /*#__PURE__*/stylesheet.create( /*#__PURE__*/_extends({
   catBtn: {
     '.': 'epr-cat-btn',
     display: 'inline-block',
@@ -19476,16 +19472,11 @@ var styles$e = /*#__PURE__*/stylesheet.create({
     '&.epr-icn-travel_places': {
       backgroundPositionX: 'calc(var(--epr-category-navigation-button-size) * -3)'
     }
-  },
-  '.epr-dark-theme': /*#__PURE__*/_extends({
-    catBtn: DarkPositionY
-  }, DarkInactivePosition),
-  '.epr-auto-theme': /*#__PURE__*/_extends({
-    catBtn: {
-      '@media (prefers-color-scheme: dark)': DarkPositionY
-    }
-  }, DarkInactivePosition)
-});
+  }
+}, /*#__PURE__*/darkMode('catBtn', DarkPositionY), {
+  '.epr-dark-theme': /*#__PURE__*/_extends({}, DarkInactivePosition),
+  '.epr-auto-theme': /*#__PURE__*/_extends({}, DarkInactivePosition)
+}));
 
 function CategoryNavigation() {
   var _useState = React.useState(null),
@@ -19567,7 +19558,7 @@ var HoverDark = {
     }
   }
 };
-var styles$g = /*#__PURE__*/stylesheet.create({
+var styles$g = /*#__PURE__*/stylesheet.create( /*#__PURE__*/_extends({
   btnClearSearch: {
     '.': 'epr-btn-clear-search',
     position: 'absolute',
@@ -19602,24 +19593,10 @@ var styles$g = /*#__PURE__*/stylesheet.create({
     ':focus': {
       backgroundPositionY: '-20px'
     }
-  },
-  '.epr-dark-theme': {
-    icnClearnSearch: {
-      backgroundPositionY: '-40px'
-    },
-    btnClearSearch: HoverDark
-  },
-  '.epr-auto-theme': {
-    icnClearnSearch: {
-      '@media (prefers-color-scheme: dark)': {
-        backgroundPositionY: '-40px'
-      }
-    },
-    btnClearSearch: {
-      '@media (prefers-color-scheme: dark)': HoverDark
-    }
   }
-});
+}, /*#__PURE__*/darkMode('icnClearnSearch', {
+  backgroundPositionY: '-40px'
+}), /*#__PURE__*/darkMode('btnClearSearch', HoverDark)));
 
 var SCOPE = /*#__PURE__*/asSelectors(ClassNames.emojiPicker) + " " + /*#__PURE__*/asSelectors(ClassNames.emojiList);
 var EMOJI_BUTTON = /*#__PURE__*/['button', asSelectors(ClassNames.emoji)].join('');
@@ -19715,7 +19692,7 @@ function Search() {
     "aria-atomic": "true"
   }, statusSearchResults) : null, React.createElement(IcnSearch, null), React.createElement(BtnClearSearch, null));
 }
-var styles$i = /*#__PURE__*/stylesheet.create({
+var styles$i = /*#__PURE__*/stylesheet.create( /*#__PURE__*/_extends({
   overlay: {
     padding: 'var(--epr-header-padding)',
     zIndex: 'var(--epr-header-overlay-z-index)'
@@ -19787,33 +19764,14 @@ var styles$i = /*#__PURE__*/stylesheet.create({
     ':focus': {
       backgroundPositionY: '-20px'
     }
-  },
-  '.epr-dark-theme': {
-    icnClearnSearch: {
-      backgroundPositionY: '-40px'
-    },
-    btnClearSearch: {
-      ':hover > .epr-icn-clear-search': {
-        backgroundPositionY: '-60px'
-      }
-    }
-  },
-  '.epr-auto-theme': {
-    icnClearnSearch: {
-      '@media (prefers-color-scheme: dark)': {
-        backgroundPositionY: '-40px'
-      }
-    },
-    btnClearSearch: {
-      '@media (prefers-color-scheme: dark)': {
-        // @ts-ignore
-        ':hover > .epr-icn-clear-search': {
-          backgroundPositionY: '-60px'
-        }
-      }
-    }
   }
-});
+}, /*#__PURE__*/darkMode('icnClearnSearch', {
+  backgroundPositionY: '-40px'
+}), /*#__PURE__*/darkMode('btnClearSearch', {
+  ':hover > .epr-icn-clear-search': {
+    backgroundPositionY: '-60px'
+  }
+})));
 
 function Header() {
   return React.createElement(Relative, {