emoji-picker-react 5.1.1 → 5.1.3

package/dist/data-core/prepare.d.ts

@@ -19,5 +19,11 @@ export declare function __getPrepareCount(): number;
 export declare function __resetPrepareCount(): void;
 export declare function __clearCoreCacheForTest(): void;
 export declare function normalizeUnified(input: string): string;
+/**
+ * Datasets disagree on where U+FE0F (emoji presentation) appears in an ID:
+ * `2764` and `2764-fe0f` are the same heart. IDs are also indexed under
+ * this form, so either spelling finds the dataset's own record.
+ */
+export declare function withoutFe0f(unified: string): string;
 export declare function normalizeQuery(input: string): string;
 export declare function getPreparedCore(emojiData?: EmojiData): PreparedCore;

package/dist/esm/chunks/{chunk-DDDACPJK.mjs → chunk-CEY4YIFR.mjs}

@@ -1,4 +1,4 @@
-import { EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, getPreparedCore, getRegisteredDefaultEmojiData, loadDefaultEmojiData, normalizeQuery, parseNativeEmoji, searchEmojis } from "./chunk-6LOWV5AK.mjs";
+import { EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, getPreparedCore, getRegisteredDefaultEmojiData, loadDefaultEmojiData, normalizeQuery, parseNativeEmoji, searchEmojis, withoutFe0f } from "./chunk-V7DBC3DD.mjs";
 
 // src/primitives/Root.tsx
 import * as React29 from "react";
@@ -1100,13 +1100,22 @@ var useIsomorphicLayoutEffect = "undefined" != typeof window ? React.useLayoutEf
 
 // src/Stylesheet/DedupedStyle.tsx
 function DedupedStyle({css, nonce}) {
-    const styleRef = React2.useRef(null), rootRef = React2.useRef(void 0), [owner, setOwner] = React2.useState(!0), syncRef = React2.useRef(void 0);
+    const kept = "undefined" != typeof document && css.startsWith("@layer"), styleRef = React2.useRef(null), rootRef = React2.useRef(void 0), [owner, setOwner] = React2.useState(!0), syncRef = React2.useRef(void 0);
     return useIsomorphicLayoutEffect((() => {
         const style = styleRef.current, root = rootRef.current = rootRef.current || (style ? style.getRootNode() : void 0);
         if (!root) return;
         const byKey = claimsByRoot.get(root) || {};
         claimsByRoot.set(root, byKey);
-        const key = nonce + css, claims = byKey[key] = byKey[key] || [], claim = {
+        const key = nonce + css;
+        if (kept) {
+            if (!byKey[key]) {
+                byKey[key] = [];
+                const sheet = style.cloneNode();
+                sheet.textContent = css, (root.head || root).appendChild(sheet);
+            }
+            return;
+        }
+        const claims = byKey[key] = byKey[key] || [], claim = {
             update: () => setOwner(claims[0] === claim),
             detached: () => !!styleRef.current && !styleRef.current.isConnected
         }, sync = syncRef.current = () => {
@@ -1122,7 +1131,7 @@ function DedupedStyle({css, nonce}) {
         nonce,
         suppressHydrationWarning: !0,
         dangerouslySetInnerHTML: {
-            __html: css
+            __html: kept ? "" : css
         }
     }) : null;
 }
@@ -1614,7 +1623,7 @@ function getBaseConfigByCategory(category, modifier = {}) {
 }
 
 // src/config/config.ts
-var KNOWN_FAILING_EMOJIS = [ "2640-fe0f", "2642-fe0f", "2695-fe0f" ], DEFAULT_SEARCH_PLACEHOLDER = "Search", DEFAULT_PICKER_WIDTH = 350, DEFAULT_PICKER_HEIGHT = 450, DEFAULT_SEARCH_CLEAR_BUTTON_LABEL = "Clear", DEFAULT_LABELS = {
+var KNOWN_FAILING_EMOJIS = [ "2640", "2642", "2695" ], DEFAULT_SEARCH_PLACEHOLDER = "Search", DEFAULT_PICKER_WIDTH = 350, DEFAULT_PICKER_HEIGHT = 450, DEFAULT_SEARCH_CLEAR_BUTTON_LABEL = "Clear", DEFAULT_LABELS = {
     searchPlaceholder: DEFAULT_SEARCH_PLACEHOLDER,
     searchLabel: "Type to search for an emoji",
     searchClear: DEFAULT_SEARCH_CLEAR_BUTTON_LABEL,
@@ -1664,7 +1673,7 @@ function mergeConfig(rawUserConfig = {}) {
         suggestionMode: config.suggestedEmojisMode
     }, userConfig.emojiData, userConfig.customEmojis);
     config.hiddenEmojis.forEach((emoji => {
-        const id = String(emoji).trim().toLowerCase();
+        const id = withoutFe0f(String(emoji).trim().toLowerCase());
         id && config.unicodeToHide.add(id);
     }));
     const skinTonePickerLocation = resolveSkinTonePickerLocation(config.skinTonePickerLocation, config.searchDisabled, previewConfig.showPreview);
@@ -2330,9 +2339,9 @@ function getPickerDataSnapshot(genericEmojiData, customEmojis) {
         emojis: nextEmojis
     }, customGroups = customLayer.groups, allEmojis = Object.values(nextEmojis).concat(Object.values(customGroups)).flat(), allEmojisByUnified2 = /* @__PURE__ */ Object.create(null);
     allEmojis.forEach((emoji => {
-        const unified = emoji.u;
-        allEmojisByUnified2[unified] = emoji, emoji.v && emoji.v?.forEach((variation => {
-            allEmojisByUnified2[variation] = emoji;
+        [ emoji.u, ...emoji.v || [] ].forEach((id => {
+            var _a;
+            allEmojisByUnified2[id] = emoji, allEmojisByUnified2[_a = withoutFe0f(id)] || (allEmojisByUnified2[_a] = emoji);
         }));
     }));
     const snapshot = {
@@ -2383,20 +2392,12 @@ function resolveSuggestedRenderIds(entries, lookup) {
 }
 
 function resolveEntryId(id, lookup) {
-    if (id) {
-        if (isKnownRenderId(id, lookup)) return id;
-        if (!Array.from(id).every((char => char.codePointAt(0) < 128))) return nativeToUnifiedCandidates(id).find((candidate => isKnownRenderId(candidate, lookup)));
-    }
-}
-
-function nativeToUnifiedCandidates(native) {
-    const codePoints = Array.from(native).map((char => char.codePointAt(0).toString(16).padStart(4, "0"))), exact = codePoints.join("-"), bare = codePoints.filter((codePoint => "fe0f" !== codePoint)), withPresentation = [ bare[0], "fe0f", ...bare.slice(1) ];
-    return [ exact, bare.join("-"), withPresentation.join("-") ];
-}
-
-function isKnownRenderId(id, lookup) {
-    const record = lookup(id);
-    return !!record && (record.u === id || (record.v ?? []).includes(id));
+    if (!id) return;
+    let unified = id, record = lookup(id);
+    if (!record && /[^\0-\x7f]/.test(id) && (unified = Array.from(id).map((char => char.codePointAt(0).toString(16).padStart(4, "0"))).join("-"), 
+    record = lookup(unified)), !record) return;
+    const known = [ record.u, ...record.v ?? [] ];
+    return known.includes(unified) ? unified : known.find((each => withoutFe0f(each) === withoutFe0f(unified)));
 }
 
 // src/hooks/useDataIdentityStabilityWarning.ts
@@ -2453,7 +2454,7 @@ function PickerDataProvider({children}) {
     const {customEmojis, emojiData: genericEmojiData} = usePickerConfig();
     useDataIdentityStabilityWarning(genericEmojiData, customEmojis);
     const data = React10.useMemo((() => getPickerDataSnapshot(genericEmojiData, customEmojis)), [ genericEmojiData, customEmojis ]), emojiByUnified2 = React10.useCallback((unified => {
-        if (unified) return data.allEmojisByUnified[unified] ?? data.allEmojisByUnified[unifiedWithoutSkinTone(unified)];
+        if (unified) return data.allEmojisByUnified[unified] ?? data.allEmojisByUnified[withoutFe0f(unified)] ?? data.allEmojisByUnified[unifiedWithoutSkinTone(unified)];
     }), [ data.allEmojisByUnified ]), allCustomEmojis = React10.useMemo((() => [ ...data.emojiData.emojis?.custom ?? [], ...Object.values(data.customGroups).flat() ]), [ data.emojiData, data.customGroups ]), queryFilterDict = React10.useCallback((query => {
         const normalized = normalizeQuery(query), dict = /* @__PURE__ */ Object.create(null);
         if (!normalized) return dict;
@@ -4812,7 +4813,7 @@ import { useCallback as useCallback10 } from "react";
 function useIsEmojiDisallowed() {
     const configured = parseFloat(useEmojiVersionConfig() || ""), nativeSupport = useNativeEmojiSupport(), cap = Number.isNaN(configured) ? 1 / 0 : configured, unicodeToHide = useUnicodeToHide(), [activeSkinTone] = useActiveSkinToneState();
     return useCallback10((function isEmojiDisallowed(emoji, renderedUnified = emojiUnified(emoji, activeSkinTone)) {
-        if (unicodeToHide.has(unifiedWithoutSkinTone(emojiUnified(emoji)))) return !0;
+        if (unicodeToHide.has(withoutFe0f(unifiedWithoutSkinTone(emojiUnified(emoji))))) return !0;
         if (isCustomEmoji(emoji)) return !1;
         const version = addedIn(emoji);
         return version > cap || !isNativeEmojiSupported(nativeSupport, renderedUnified, version);
@@ -5640,23 +5641,24 @@ var SKIN_TONE_LABEL_KEYS = {
         ":focus": {
             boxShadow: "0 0 0 3px var(--epr-focus-bg-color)"
         },
+        // Swatch colors are themeable; the fallbacks are the defaults.
         "&.epr-tone-neutral": {
-            backgroundColor: "#ffd225"
+            backgroundColor: "var(--epr-skin-tone-neutral-color, #ffd225)"
         },
         "&.epr-tone-1f3fb": {
-            backgroundColor: "#ffdfbd"
+            backgroundColor: "var(--epr-skin-tone-light-color, #ffdfbd)"
         },
         "&.epr-tone-1f3fc": {
-            backgroundColor: "#e9c197"
+            backgroundColor: "var(--epr-skin-tone-medium-light-color, #e9c197)"
         },
         "&.epr-tone-1f3fd": {
-            backgroundColor: "#c88e62"
+            backgroundColor: "var(--epr-skin-tone-medium-color, #c88e62)"
         },
         "&.epr-tone-1f3fe": {
-            backgroundColor: "#a86637"
+            backgroundColor: "var(--epr-skin-tone-medium-dark-color, #a86637)"
         },
         "&.epr-tone-1f3ff": {
-            backgroundColor: "#60463a"
+            backgroundColor: "var(--epr-skin-tone-dark-color, #60463a)"
         }
     }
 }))();
@@ -6525,7 +6527,7 @@ function useEmojiVirtualization({categoryEmojis, topOffset, onHeightReady, scrol
         })), accumulator;
     }), []) : [];
     return useEffect26((() => requestNativeProbe(probe2))), useEffect26((() => {
-        preloads.forEach((emoji => preloadEmoji(getEmojiUrl, emoji, emojiStyle, variationsDisabled ? emojiUnified(emoji, activeSkinTone) : void 0)));
+        preloads.forEach((emoji => preloadEmoji(getEmojiUrl, emoji, emojiStyle, emojiUnified(emoji, activeSkinTone))));
     })), {
         virtualizedCounter: emojisToPush.length - emojis.length,
         emojis,

package/dist/esm/chunks/{chunk-G75AG4FD.mjs → chunk-GZYF2CX5.mjs}

@@ -1,4 +1,4 @@
-import { registerDefaultEmojiData } from "./chunk-6LOWV5AK.mjs";
+import { registerDefaultEmojiData } from "./chunk-V7DBC3DD.mjs";
 
 import { emojis_default } from "./chunk-ZOAKI5M6.mjs";
 

package/dist/esm/chunks/{chunk-6LOWV5AK.mjs → chunk-V7DBC3DD.mjs}

@@ -41,6 +41,10 @@ function normalizeUnified(input) {
     return input.trim().toLowerCase();
 }
 
+function withoutFe0f(unified) {
+    return unified.replace(/-fe0f/g, "");
+}
+
 function normalizeQuery(input) {
     return input && "string" == typeof input ? input.trim().toLowerCase() : "";
 }
@@ -63,7 +67,8 @@ function appendEntry(byUnified, byCharMutable, records, entry) {
         addedIn
     });
     records.push(info), byUnified.set(unified, info);
-    for (const variation of info.variations) byUnified.has(variation) || byUnified.set(variation, info);
+    for (const id of [ unified, ...info.variations ]) byUnified.has(id) || byUnified.set(id, info), 
+    byUnified.has(withoutFe0f(id)) || byUnified.set(withoutFe0f(id), info);
     indexCharBucket(byCharMutable, names, info);
 }
 
@@ -118,7 +123,9 @@ function smallestCandidateBucket(core, normalized) {
 function getEmojiByUnified(unified, options) {
     if (!unified || "string" != typeof unified) return;
     const normalized = normalizeUnified(unified);
-    return normalized ? getPreparedCore(options?.emojiData).byUnified.get(normalized) : void 0;
+    if (!normalized) return;
+    const core = getPreparedCore(options?.emojiData);
+    return core.byUnified.get(normalized) ?? core.byUnified.get(withoutFe0f(normalized));
 }
 
 function searchEmojis(query, options) {
@@ -141,4 +148,4 @@ function searchEmojis(query, options) {
     return memoizeQuery(core, normalized, matches), Object.freeze([ ...matches ]);
 }
 
-export { registerDefaultEmojiData, getRegisteredDefaultEmojiData, EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, loadDefaultEmojiData, parseNativeEmoji, normalizeQuery, getPreparedCore, getEmojiByUnified, searchEmojis };
+export { registerDefaultEmojiData, getRegisteredDefaultEmojiData, EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, loadDefaultEmojiData, parseNativeEmoji, withoutFe0f, normalizeQuery, getPreparedCore, getEmojiByUnified, searchEmojis };

package/dist/esm/data.mjs

@@ -1,6 +1,6 @@
-import "./chunks/chunk-G75AG4FD.mjs";
+import "./chunks/chunk-GZYF2CX5.mjs";
 
-import { getEmojiByUnified, searchEmojis } from "./chunks/chunk-6LOWV5AK.mjs";
+import { getEmojiByUnified, searchEmojis } from "./chunks/chunk-V7DBC3DD.mjs";
 
 import "./chunks/chunk-ZOAKI5M6.mjs";
 

package/dist/esm/index.mjs

@@ -1,9 +1,9 @@
 "use client";
-import { Categories, CategoryNav, DEFAULT_PICKER_HEIGHT, DEFAULT_PICKER_WIDTH, DefaultPickerConfiguration, EmojiStyle, Empty, List, LoadError, Loading, MutableConfigProvider, Panel, Preview, Reactions, Relative, Root, Search, SkinTone, SkinTonePickerLocation, SkinTones, SuggestionMode, Theme, ViewOnlyEmoji, Viewport, commonInteractionStyles, compareConfig, cx, defaultPickerTokens, emojiByUnified, isPickerBehaviorProp, resolveEmojiStyle, resolveSkinTonePickerLocation, stylesheet, useDefaultAppearance, useDefineMutableConfig, usePreviewConfig, useSearchDisabledConfig, useSkinTonePickerLocationConfig, useSkinTonesDisabledConfig, validColumns } from "./chunks/chunk-DDDACPJK.mjs";
+import { Categories, CategoryNav, DEFAULT_PICKER_HEIGHT, DEFAULT_PICKER_WIDTH, DefaultPickerConfiguration, EmojiStyle, Empty, List, LoadError, Loading, MutableConfigProvider, Panel, Preview, Reactions, Relative, Root, Search, SkinTone, SkinTonePickerLocation, SkinTones, SuggestionMode, Theme, ViewOnlyEmoji, Viewport, commonInteractionStyles, compareConfig, cx, defaultPickerTokens, emojiByUnified, isPickerBehaviorProp, resolveEmojiStyle, resolveSkinTonePickerLocation, stylesheet, useDefaultAppearance, useDefineMutableConfig, usePreviewConfig, useSearchDisabledConfig, useSkinTonePickerLocationConfig, useSkinTonesDisabledConfig, validColumns } from "./chunks/chunk-CEY4YIFR.mjs";
 
-import "./chunks/chunk-G75AG4FD.mjs";
+import "./chunks/chunk-GZYF2CX5.mjs";
 
-import "./chunks/chunk-6LOWV5AK.mjs";
+import "./chunks/chunk-V7DBC3DD.mjs";
 
 import "./chunks/chunk-ZOAKI5M6.mjs";
 

package/dist/esm/primitives/index.mjs

@@ -1,6 +1,6 @@
 "use client";
-import { Categories, CategoryNav, EmojiStyle, Empty, List, LoadError, Loading, Panel, Preview, Reactions, Root, Search, SearchInput, SkinTone, SkinTonePickerLocation, SkinTones, SuggestionMode, Theme, Viewport, darkPickerTokens, defaultPickerTokens, lightPickerTokens, structuralPickerTokens, useActiveEmoji, useCategoryNavigation, useEmojiDataState, usePickerMode, useSearchActions, useSearchState, useSkinTone } from "../chunks/chunk-DDDACPJK.mjs";
+import { Categories, CategoryNav, EmojiStyle, Empty, List, LoadError, Loading, Panel, Preview, Reactions, Root, Search, SearchInput, SkinTone, SkinTonePickerLocation, SkinTones, SuggestionMode, Theme, Viewport, darkPickerTokens, defaultPickerTokens, lightPickerTokens, structuralPickerTokens, useActiveEmoji, useCategoryNavigation, useEmojiDataState, usePickerMode, useSearchActions, useSearchState, useSkinTone } from "../chunks/chunk-CEY4YIFR.mjs";
 
-import "../chunks/chunk-6LOWV5AK.mjs";
+import "../chunks/chunk-V7DBC3DD.mjs";
 
 export { Categories, CategoryNav, EmojiStyle, Empty, List, LoadError, Loading, Panel, Preview, Reactions, Root, Search, SearchInput, SkinTone, SkinTonePickerLocation, SkinTones, SuggestionMode, Theme, Viewport, darkPickerTokens, defaultPickerTokens, lightPickerTokens, structuralPickerTokens, useActiveEmoji, useCategoryNavigation, useEmojiDataState, usePickerMode, useSearchActions, useSearchState, useSkinTone };