emoji-picker-react 5.0.1 → 5.0.2

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-F2KS7DCA.mjs → chunk-56D5WCOZ.mjs}

@@ -1,4 +1,4 @@
-import { EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, getPreparedCore, getRegisteredDefaultEmojiData, init_defaultEmojiData, loadDefaultEmojiData, normalizeQuery, parseNativeEmoji, searchEmojis } from "./chunk-ACXAQEKG.mjs";
+import { EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, getPreparedCore, getRegisteredDefaultEmojiData, init_defaultEmojiData, loadDefaultEmojiData, normalizeQuery, parseNativeEmoji, searchEmojis, withoutFe0f } from "./chunk-RU7G34WK.mjs";
 
 // src/primitives/Root.tsx
 import * as React29 from "react";
@@ -1617,7 +1617,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,
@@ -1667,7 +1667,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);
@@ -2325,9 +2325,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 = {
@@ -2378,20 +2378,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
@@ -2450,7 +2442,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;
@@ -4158,10 +4150,11 @@ function hasModifier(event) {
 import { useEffect as useEffect14 } from "react";
 
 // src/hooks/preloadEmoji.ts
-function preloadEmoji(getEmojiUrl, emoji, emojiStyle) {
+function preloadEmoji(getEmojiUrl, emoji, emojiStyle, rendered) {
     if (!emoji) return;
-    const unified = emojiUnified(emoji);
-    preloadedEmojs.has(unified) || (preloadedEmojs.add(unified), emojiVariations(emoji).concat(unified).forEach((variation => {
+    const unified = emojiUnified(emoji), key = rendered ? rendered + "/only" : unified;
+    preloadedEmojs.has(unified) || preloadedEmojs.has(key) || (preloadedEmojs.add(key), 
+    (rendered ? [ rendered ] : emojiVariations(emoji).concat(unified)).forEach((variation => {
         preloadImage(getEmojiUrl(variation, emojiStyle));
     })));
 }
@@ -4735,7 +4728,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);
@@ -5556,23 +5549,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)"
         }
     }
 }))();
@@ -6435,7 +6429,7 @@ function useEmojiVirtualization({categoryEmojis, topOffset, onHeightReady, scrol
         })), accumulator;
     }), []) : [];
     return useEffect26((() => requestNativeProbe(probe2))), useEffect26((() => {
-        preloads.forEach((emoji => preloadEmoji(getEmojiUrl, emoji, emojiStyle)));
+        preloads.forEach((emoji => preloadEmoji(getEmojiUrl, emoji, emojiStyle, emojiUnified(emoji, activeSkinTone))));
     })), {
         virtualizedCounter: emojisToPush.length - emojis.length,
         emojis,

package/dist/esm/chunks/{chunk-L5W4PFRJ.mjs → chunk-IODYR4CR.mjs}

@@ -1,4 +1,4 @@
-import { init_defaultEmojiData, registerDefaultEmojiData } from "./chunk-ACXAQEKG.mjs";
+import { init_defaultEmojiData, registerDefaultEmojiData } from "./chunk-RU7G34WK.mjs";
 
 import { emojis_default, init_emojis } from "./chunk-7ZGTUZFB.mjs";
 

package/dist/esm/chunks/{chunk-ACXAQEKG.mjs → chunk-RU7G34WK.mjs}

@@ -46,6 +46,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() : "";
 }
@@ -68,7 +72,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);
 }
 
@@ -123,7 +128,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) {
@@ -146,4 +153,4 @@ function searchEmojis(query, options) {
     return memoizeQuery(core, normalized, matches), Object.freeze([ ...matches ]);
 }
 
-export { registerDefaultEmojiData, getRegisteredDefaultEmojiData, EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, loadDefaultEmojiData, init_defaultEmojiData, parseNativeEmoji, normalizeQuery, getPreparedCore, getEmojiByUnified, searchEmojis };
+export { registerDefaultEmojiData, getRegisteredDefaultEmojiData, EMPTY_EMOJI_DATA, defaultEmojiDataOrEmpty, loadDefaultEmojiData, init_defaultEmojiData, parseNativeEmoji, withoutFe0f, normalizeQuery, getPreparedCore, getEmojiByUnified, searchEmojis };

package/dist/esm/data.mjs

@@ -1,6 +1,6 @@
-import { require_registerDefaultEmojiData } from "./chunks/chunk-L5W4PFRJ.mjs";
+import { require_registerDefaultEmojiData } from "./chunks/chunk-IODYR4CR.mjs";
 
-import { getEmojiByUnified, searchEmojis } from "./chunks/chunk-ACXAQEKG.mjs";
+import { getEmojiByUnified, searchEmojis } from "./chunks/chunk-RU7G34WK.mjs";
 
 import "./chunks/chunk-7ZGTUZFB.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-F2KS7DCA.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-56D5WCOZ.mjs";
 
-import { require_registerDefaultEmojiData } from "./chunks/chunk-L5W4PFRJ.mjs";
+import { require_registerDefaultEmojiData } from "./chunks/chunk-IODYR4CR.mjs";
 
-import "./chunks/chunk-ACXAQEKG.mjs";
+import "./chunks/chunk-RU7G34WK.mjs";
 
 import "./chunks/chunk-7ZGTUZFB.mjs";
 

package/dist/esm/primitives/index.mjs

@@ -1,7 +1,7 @@
 "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-F2KS7DCA.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-56D5WCOZ.mjs";
 
-import "../chunks/chunk-ACXAQEKG.mjs";
+import "../chunks/chunk-RU7G34WK.mjs";
 
 import "../chunks/chunk-LO4TPPLH.mjs";
 

package/dist/hooks/preloadEmoji.d.ts

@@ -1,5 +1,5 @@
 import { GetEmojiUrl } from '../components/emoji/BaseEmojiProps';
 import { DataEmoji } from '../dataUtils/DataTypes';
 import { EmojiStyleValue } from '../types/exposedTypes';
-export declare function preloadEmoji(getEmojiUrl: GetEmojiUrl, emoji: undefined | DataEmoji, emojiStyle: EmojiStyleValue): void;
+export declare function preloadEmoji(getEmojiUrl: GetEmojiUrl, emoji: undefined | DataEmoji, emojiStyle: EmojiStyleValue, rendered?: string): void;
 export declare const preloadedEmojs: Set<string>;