emoji-picker-react 5.0.0 → 5.0.1

package/dist/virtualization/virtualizationHelpers.d.ts

@@ -1,3 +1,5 @@
+export declare const OVERSCAN_ROWS = 2;
+export declare function isJustBelowViewport(top: number, bottom: number, size: number): boolean;
 export declare function shouldVirtualize({ scrollTop, clientHeight, topOffset, style, dimensions, }: {
     scrollTop: number;
     clientHeight: number;

package/llms-full.txt

@@ -227,7 +227,7 @@ Per-library snippets (plain CSS, CSS Modules, Tailwind, shadcn/ui, Emotion, styl
 
 Locale datasets translate emoji names and category names. `labels` translates controls and announcements; `previewConfig.defaultCaption` sets the preview caption. Complete localization covers every visible and announced string in your composition: see [INTERNATIONALIZATION.md](../../INTERNATIONALIZATION.md).
 
-Keep the managed ARIA props. Test keyboard selection, search and IME input, focus restoration and nested Escape inside the real host popover or dialog: Escape closes an open variation or tone menu before reaching the host. Custom emojis with duplicate names share an accessible name; scope test queries to a category.
+Keep the managed ARIA props. Test keyboard selection, search and IME input, focus restoration and nested Escape inside the real host popover or dialog: Escape closes an open variation or tone menu, or clears a non-empty search, before reaching the host. Custom emojis with duplicate names share an accessible name; scope test queries to a category.
 
 <!-- source: docs/v5/PROMPTS.md -->
 
@@ -1406,7 +1406,7 @@ The registry item depends on `emoji-picker-react@^5.0.0`. The registry component
 </Popover>
 ```
 
-The host owns insertion and dismissal. The Popover restores trigger focus. Escape first closes an open variation/tone menu, then a subsequent Escape reaches the host. The light/dark Storybook examples import the registry component itself; browser checks exercise search, keyboard insertion, dismissal, focus restoration and WCAG-tagged axe rules.
+The host owns insertion and dismissal. The Popover restores trigger focus. Escape first closes an open variation/tone menu or clears a non-empty search, then a subsequent Escape reaches the host. The light/dark Storybook examples import the registry component itself; browser checks exercise search, keyboard insertion, dismissal, focus restoration and WCAG-tagged axe rules.
 
 ## Working starter sources
 
@@ -1636,7 +1636,7 @@ For standard emoji IDs:
 - a valid variation remains that exact variation for rendering rather than collapsing to the neutral base emoji;
 - duplicates are removed by canonical normalized ID, first occurrence wins.
 
-Custom emoji IDs use the same case-insensitive rule — `customEmojis` are already lowercased when indexed, so there is no separate exact-match pass.
+Custom emoji IDs use the same case-insensitive rule: IDs are lowercased when indexed. Custom display names retain the supplied capitalization; search still matches them case-insensitively.
 
 Entries may be unified IDs, custom emoji IDs, or the emoji characters themselves (`'🧠'`, `'❤️'`), so recents stored as inserted text can be passed through unchanged; unknown entries are ignored.
 
@@ -1891,6 +1891,8 @@ Styling is opt-in in both directions:
 
 `columns` sets the emojis per row on EmojiPicker and Root. The picker's width then fits those columns plus a stable scrollbar gutter, unless the consumer sets a width (`width`, `style` or any class). A container narrower than the columns renders fewer columns instead of clipping. Without `columns`, the width decides the column count, as in v4.
 
+The intrinsic grid width remains present during an empty search, data loading or a load error.
+
 ## 12. Data API
 
 The data entry point is defined in [DATA_API.md](./DATA_API.md):
@@ -2362,6 +2364,7 @@ The following variables are already documented public customization surface and
 - `--epr-preview-text-color`
 
 ### Native emoji font
+- `--epr-font-family` — font for picker text (`sans-serif` by default). Set it to `inherit` on the picker to use the surrounding application's font. Native emoji glyphs keep their separate font stack.
 - `--epr-emoji-font-family` (v5) — font stack for native emojis, e.g. a country-flag polyfill font; native support detection measures this same font.
 
 ### Skin tone

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "5.0.0",
+  "version": "5.0.1",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/DomUtils/classNames.ts

@@ -21,7 +21,3 @@ export enum ClassNames {
   darkTheme = 'epr-dark-theme',
   autoTheme = 'epr-auto-theme',
 }
-
-export function asSelectors(...classNames: ClassNames[]): string {
-  return classNames.map((c) => `.${c}`).join('');
-}

package/src/DomUtils/elementPositionInRow.ts

@@ -1,6 +1,6 @@
 import { DEFAULT_LABEL_HEIGHT } from '../components/main/labelHeight';
 
-import { ClassNames, asSelectors } from './classNames';
+import { ClassNames } from './classNames';
 import { NullableElement } from './selectors';
 
 export function elementCountInRow(
@@ -74,7 +74,7 @@ export function getLabelHeight(parentNode: NullableElement) {
     return DEFAULT_LABEL_HEIGHT;
   }
 
-  const label = parentNode.querySelector(asSelectors(ClassNames.label));
+  const label = parentNode.querySelector(`.${ClassNames.label}`);
 
   if (label) {
     const height = label.getBoundingClientRect().height;

package/src/DomUtils/keyboardNavigation.ts

@@ -38,12 +38,45 @@ function categoryGeometry(category: HTMLElement) {
   return { content, count, columns };
 }
 
+export type MoveOptions = {
+  shouldFocus?: () => boolean;
+  /** Called when an upward move leaves the grid. */
+  exitUp?: () => void;
+  /** Receives the destination cell; focuses it by default. */
+  moveTo?: (emoji: HTMLElement) => void;
+  /** Source cell while a virtualized destination is being materialized. */
+  origin?: HTMLElement;
+};
+
+/** Move to the first filtered result, including a cell outside the viewport. */
+export function focusFirstEmoji(
+  body: NullableElement,
+  options: MoveOptions,
+): boolean {
+  const category = body?.querySelector<HTMLElement>(
+    '[data-epr-part="category-content"]:not([data-epr-emoji-count="0"])',
+  )?.parentElement;
+  if (category) focusLogicalEmoji(category, 0, options);
+  return !!category;
+}
+
+const pendingMoves = new WeakMap<
+  HTMLElement,
+  {
+    category: HTMLElement;
+    index: number;
+    origin?: HTMLElement;
+    valid: () => boolean;
+  }
+>();
+
 export function focusAdjacentEmoji(
   element: NullableElement,
   direction: number,
   row: boolean,
-  { shouldFocus, exitUp }: { shouldFocus?: () => boolean; exitUp?: () => void },
+  options: MoveOptions,
 ) {
+  const { shouldFocus, exitUp } = options;
   if (!element || (shouldFocus && !shouldFocus())) return;
   const category = closestCategory(element);
   if (!category || element.dataset.eprIndex === undefined) {
@@ -55,15 +88,34 @@ export function focusAdjacentEmoji(
     );
     return;
   }
-  const destination = logicalDestination(category, element, direction, row);
+  const cursor = gridCursor(category, element);
+  const destination = logicalDestination(
+    cursor.category,
+    cursor.index,
+    direction,
+    row,
+  );
   if (destination)
-    focusLogicalEmoji(destination.category, destination.index, shouldFocus);
+    focusLogicalEmoji(destination.category, destination.index, {
+      ...options,
+      origin: element,
+    });
   else if (direction < 0) exitUp?.();
 }
 
+// A key pressed before the previous move mounted its destination continues
+// from that destination, not from the still-focused source cell.
+function gridCursor(category: HTMLElement, element: HTMLElement) {
+  const body = closestScrollBody(category);
+  const pending = body && pendingMoves.get(body);
+  return pending?.origin === element && pending.valid()
+    ? pending
+    : { category, index: Number(element.dataset.eprIndex) };
+}
+
 function logicalDestination(
   category: HTMLElement,
-  element: HTMLElement,
+  currentIndex: number,
   direction: number,
   row: boolean,
 ) {
@@ -71,7 +123,6 @@ function logicalDestination(
   const columns = geometry.columns;
   let count = geometry.count;
   if (count <= 0) return null;
-  const currentIndex = Number(element.dataset.eprIndex);
   const column = row ? currentIndex % columns : 0;
   let index = row
     ? (Math.floor(currentIndex / columns) + direction) * columns
@@ -105,23 +156,30 @@ function adjacentDestination(
 function focusLogicalEmoji(
   category: HTMLElement,
   index: number,
-  shouldFocus?: () => boolean,
+  { shouldFocus, moveTo = (emoji) => emoji.focus(), origin }: MoveOptions,
 ) {
   const { content, columns, count } = categoryGeometry(category);
   const body = closestScrollBody(category);
   if (!body || !content || !columns) return;
   const size = content.clientHeight / Math.ceil(count / columns);
   let frames = 60;
-  const valid = () =>
-    (!shouldFocus || shouldFocus()) && body.contains(category);
+  const pending = { category, index, origin, valid: () => valid() };
+  pendingMoves.set(body, pending);
+  const valid = (): boolean =>
+    pendingMoves.get(body) === pending &&
+    (!shouldFocus || shouldFocus()) &&
+    body.contains(category);
   const attempt = () => {
     if (!valid()) return;
     const emoji = category.querySelector<HTMLElement>(
       `${VisibleEmojiSelector}[data-epr-index="${index}"]`,
     );
     if (emoji) {
-      emoji.focus();
+      moveTo(emoji);
       scrollEmojiAboveLabel(emoji, valid);
+      // Keep the scroll guard valid until a later navigation replaces it,
+      // but only unfinished moves supply a logical cursor to another key.
+      pending.origin = undefined;
       return;
     }
     if (!size || --frames <= 0) return;
@@ -133,5 +191,11 @@ function focusLogicalEmoji(
         categoryLabelHeight(category);
     requestAnimationFrame(attempt);
   };
-  requestAnimationFrame(attempt);
+  // Mounted cells can move immediately, so a second key in this frame
+  // reads the new position. Only unmounted destinations need a frame.
+  if (
+    category.querySelector(`${VisibleEmojiSelector}[data-epr-index="${index}"]`)
+  )
+    attempt();
+  else requestAnimationFrame(attempt);
 }

package/src/DomUtils/scrollTo.ts

@@ -2,7 +2,7 @@ import { useCallback } from 'react';
 
 import { useBodyRef } from '../components/context/ElementRefContext';
 
-import { asSelectors, ClassNames } from './classNames';
+import { ClassNames } from './classNames';
 import {
   categoryLabelHeight,
   closestCategory,
@@ -53,7 +53,7 @@ export function scrollEmojiAboveLabel(
     return;
   }
 
-  if (emoji.closest(asSelectors(ClassNames.variationPicker))) {
+  if (emoji.closest(`.${ClassNames.variationPicker}`)) {
     return;
   }
 

package/src/DomUtils/selectors.ts

@@ -1,16 +1,12 @@
 import { unifiedWithoutSkinTone } from '../dataUtils/emojiSelectors';
 
-import { asSelectors, ClassNames } from './classNames';
+import { ClassNames } from './classNames';
 import { firstVisibleElementInContainer } from './elementPositionInRow';
 
 export type NullableElement = HTMLElement | null;
 
-export const EmojiButtonSelector = `button${asSelectors(ClassNames.emoji)}`;
-export const VisibleEmojiSelector = [
-  EmojiButtonSelector,
-  asSelectors(ClassNames.visible),
-  `:not(${asSelectors(ClassNames.hidden)})`,
-].join('');
+export const EmojiButtonSelector = `button.${ClassNames.emoji}`;
+export const VisibleEmojiSelector = `${EmojiButtonSelector}.${ClassNames.visible}:not(.${ClassNames.hidden})`;
 
 export function buttonFromTarget(
   emojiElement: NullableElement,
@@ -35,7 +31,7 @@ export function isEmojiElement(element: NullableElement): boolean {
 export function categoryLabelFromCategory(
   category: NullableElement,
 ): NullableElement {
-  return category?.querySelector(asSelectors(ClassNames.label)) ?? null;
+  return category?.querySelector(`.${ClassNames.label}`) ?? null;
 }
 
 export function closestCategoryLabel(
@@ -74,7 +70,7 @@ export function categoryLabelHeight(category: NullableElement): number {
   }
 
   const categoryWithoutLabel = category.querySelector(
-    asSelectors(ClassNames.categoryContent),
+    `.${ClassNames.categoryContent}`,
   );
 
   return (
@@ -96,9 +92,9 @@ export function isEmojiBehindLabel(emoji: NullableElement): boolean {
 export function queryScrollBody(root: NullableElement): NullableElement {
   if (!root) return null;
 
-  return root.matches(asSelectors(ClassNames.scrollBody))
+  return root.matches(`.${ClassNames.scrollBody}`)
     ? root
-    : root.querySelector(asSelectors(ClassNames.scrollBody));
+    : root.querySelector(`.${ClassNames.scrollBody}`);
 }
 
 export function emojiDistanceFromScrollTop(emoji: NullableElement): number {
@@ -114,7 +110,7 @@ export function closestScrollBody(element: NullableElement): NullableElement {
     return null;
   }
 
-  return element.closest(asSelectors(ClassNames.scrollBody)) ?? null;
+  return element.closest(`.${ClassNames.scrollBody}`) ?? null;
 }
 
 export function emojiTruOffsetLeft(element: NullableElement): number {
@@ -221,14 +217,12 @@ export function closestCategory(element: NullableElement) {
   if (!element) {
     return null;
   }
-  return element.closest(asSelectors(ClassNames.category)) as HTMLElement;
+  return element.closest(`.${ClassNames.category}`) as HTMLElement;
 }
 
 export function closestCategoryContent(element: NullableElement) {
   if (!element) {
     return null;
   }
-  return element.closest(
-    asSelectors(ClassNames.categoryContent),
-  ) as HTMLElement;
+  return element.closest(`.${ClassNames.categoryContent}`) as HTMLElement;
 }

package/src/components/body/EmojiCategory.tsx

@@ -55,7 +55,7 @@ export function EmojiCategory({
     >
       {CategoryHeader ? (
         <CategoryHeader
-          className={cx(styles.label)}
+          className={cx(styles.label, appearance && styles.labelAppearance)}
           aria-hidden
           data-epr-part="category-label"
           category={{ id: categoryId, name: categoryName }}

package/src/components/body/EmojiList.tsx

@@ -15,8 +15,12 @@ import { useEmojiVirtualization } from '../../hooks/useEmojiVirtualization';
 import { useRegisterRegion } from '../../hooks/useRegisterRegion';
 import { useMergedRefs } from '../../primitives/nativeProps';
 import { CategoryConfig } from '../../types/exposedTypes';
-import { useEmojiListRef } from '../context/ElementRefContext';
-import { useVisibleCategoriesState } from '../context/PickerContext';
+import { OVERSCAN_ROWS } from '../../virtualization/virtualizationHelpers';
+import { useBodyRef, useEmojiListRef } from '../context/ElementRefContext';
+import {
+  useEmojiSizeState,
+  useVisibleCategoriesState,
+} from '../context/PickerContext';
 import { useGetEmojisByCategory } from '../context/PickerDataContext';
 
 import { EmojiCategory } from './EmojiCategory';
@@ -41,6 +45,22 @@ export function EmojiList({
     [key: string]: number;
   }>({});
   const EmojiListRef = useEmojiListRef();
+  const BodyRef = useBodyRef();
+  const [emojiSize] = useEmojiSizeState();
+  const [visibleCategories] = useVisibleCategoriesState();
+  const onHeightReady = React.useCallback(
+    (categoryId: string, height: number) => {
+      setCategoryHeights((previous) =>
+        previous[categoryId] === height
+          ? previous
+          : {
+              ...previous,
+              [categoryId]: height,
+            },
+      );
+    },
+    [],
+  );
   const mergedRef = useMergedRefs(EmojiListRef, outerRef);
   const getEmojisByCategory = useGetEmojisByCategory();
   useRegisterRegion('grid', EmojiListRef);
@@ -87,17 +107,28 @@ export function EmojiList({
             categoryEmojis={getEmojisByCategory(category, group)}
             categoryConfig={categoryConfig}
             topOffset={currentOffset}
-            isFirstCategory={index === 0}
+            isCategoryVisible={
+              index === 0 || visibleCategories.includes(categoryId)
+            }
             positioned={isPositioned}
-            onHeightReady={(height) => {
-              if (categoryHeights[categoryId] !== height) {
-                setCategoryHeights((prev) => ({
-                  ...prev,
-                  [categoryId]: height,
-                }));
-              }
-            }}
-            scrollTop={scrollTop}
+            onHeightReady={onHeightReady}
+            // Outside a section's rendering/preload margin, scrolling
+            // cannot change its cells. Keep its prop stable so it can bail.
+            scrollTop={
+              categoryHeight === undefined
+                ? scrollTop
+                : Math.max(
+                    currentOffset -
+                      (BodyRef.current?.clientHeight ?? 0) -
+                      (emojiSize || 40) * (OVERSCAN_ROWS + 1),
+                    Math.min(
+                      scrollTop,
+                      currentOffset +
+                        categoryHeight +
+                        (emojiSize || 40) * (OVERSCAN_ROWS + 1),
+                    ),
+                  )
+            }
           />
         );
       })}
@@ -105,24 +136,28 @@ export function EmojiList({
   );
 }
 
-function RenderCategory({
+const RenderCategory = /* @__PURE__ */ React.memo(function RenderCategory({
   categoryEmojis,
   categoryConfig,
   topOffset,
   onHeightReady,
   scrollTop,
-  isFirstCategory,
+  isCategoryVisible,
   positioned,
 }: {
   categoryEmojis: DataEmojis;
   categoryConfig: CategoryConfig;
   topOffset: number;
-  onHeightReady: (height: number) => void;
+  onHeightReady: (categoryId: string, height: number) => void;
   scrollTop: number;
-  isFirstCategory: boolean;
+  isCategoryVisible: boolean;
   positioned: boolean;
 }) {
-  const [visibleCategories] = useVisibleCategoriesState();
+  const categoryId = categoryIdFromCategoryConfig(categoryConfig);
+  const reportHeight = React.useCallback(
+    (height: number) => onHeightReady(categoryId, height),
+    [categoryId, onHeightReady],
+  );
 
   // The observer is the only writer of visibleCategories. When it never
   // fires (zero-height container at mount, hidden modal), no category
@@ -130,15 +165,11 @@ function RenderCategory({
   // the deadlock; the observer takes over from there.
   // https://github.com/ealush/emoji-picker-react/issues/469
   // https://github.com/ealush/emoji-picker-react/issues/475
-  const isCategoryVisible =
-    isFirstCategory ||
-    visibleCategories.includes(categoryIdFromCategoryConfig(categoryConfig));
-
   const { virtualizedCounter, emojis, dimensions, emojiCount } =
     useEmojiVirtualization({
       categoryEmojis,
       topOffset,
-      onHeightReady,
+      onHeightReady: reportHeight,
       scrollTop,
       isCategoryVisible,
       positioned,
@@ -157,7 +188,7 @@ function RenderCategory({
       {emojis}
     </EmojiCategory>
   );
-}
+});
 
 const styles = /* @__PURE__ */ (() =>
   stylesheet.create({

package/src/components/context/PickerDataContext.tsx

@@ -109,7 +109,11 @@ export function PickerDataProvider({
         }
       }
       for (const custom of allCustomEmojis) {
-        if (emojiNames(custom).some((name) => name.includes(normalized))) {
+        if (
+          emojiNames(custom).some((name) =>
+            name.toLowerCase().includes(normalized),
+          )
+        ) {
           dict[custom[Keys.unified]] = custom;
         }
       }

package/src/components/header/Search/Search.tsx

@@ -96,10 +96,12 @@ const styles = /* @__PURE__ */ (() =>
       border: '1px solid var(--epr-search-border-color)',
       ':focus': {
         backgroundColor: 'var(--epr-search-input-bg-color-active)',
-        border: '1px solid var(--epr-search-border-color-active)',
+        border:
+          '1px solid var(--epr-search-border-color-active, var(--epr-highlight-color, Highlight))',
       },
       '::placeholder': {
-        color: 'var(--epr-search-input-placeholder-color)',
+        color:
+          'var(--epr-search-input-placeholder-color, var(--epr-text-color, GrayText))',
       },
     },
   }))();

package/src/components/main/defaultAppearance.tsx

@@ -157,10 +157,11 @@ const styles = /* @__PURE__ */ (() =>
       backgroundColor: 'var(--epr-bg-color)',
       overflow: 'hidden',
       transition: 'height 0.3s ease-in-out, background-color 0.1s ease-in-out',
+      fontFamily: 'var(--epr-font-family, inherit)',
       '*': {
         boxSizing: 'border-box',
         // Overridable without a specificity fight (v4 hard-coded sans-serif).
-        fontFamily: 'var(--epr-font-family, sans-serif)',
+        fontFamily: 'inherit',
       },
     },
     baseVariables: {

package/src/data/skinToneVariations.ts

@@ -9,13 +9,14 @@ const skinToneVariations = [
   SkinTones.DARK,
 ];
 
-export const skinTonesNamed = Object.entries(SkinTones).reduce(
-  (acc, [key, value]) => {
-    acc[value] = key;
-    return acc;
-  },
-  {} as Record<string, string>,
-);
+export const skinTonesNamed = /* @__PURE__ */ (() =>
+  Object.entries(SkinTones).reduce(
+    (acc, [key, value]) => {
+      acc[value] = key;
+      return acc;
+    },
+    {} as Record<string, string>,
+  ))();
 
 export const skinTonesMapped: Record<string, string> =
   skinToneVariations.reduce(

package/src/data-core/pickerData.ts

@@ -49,9 +49,7 @@ const NO_CUSTOM: object = {};
 
 function customToRegularEmoji(emoji: CustomEmoji): DataEmoji {
   return {
-    [EmojiProperties.name]: emoji.names.map((name: string) =>
-      name.toLowerCase(),
-    ),
+    [EmojiProperties.name]: [...emoji.names],
     [EmojiProperties.unified]: emoji.id.toLowerCase(),
     [EmojiProperties.added_in]: '0',
     [EmojiProperties.imgUrl]: emoji.imgUrl,

package/src/data-core/prepare.ts

@@ -62,28 +62,10 @@ export function normalizeQuery(input: string): string {
   return input.trim().toLowerCase();
 }
 
-function toEmojiInfo(
-  unified: string,
-  names: readonly string[],
-  variations: readonly string[] | undefined,
-  addedIn: string,
-): EmojiInfo {
-  return Object.freeze({
-    unified,
-    emoji: parseNativeEmoji(unified),
-    name: names[names.length - 1] || '',
-    names: Object.freeze([...names]),
-    variations: Object.freeze([...(variations ?? [])]),
-    addedIn,
-  });
-}
-
 function readStringArray(raw: unknown): string[] {
-  if (!Array.isArray(raw)) {
-    return [];
-  }
-  return (raw.filter((n) => typeof n === 'string') as string[]).map((n) =>
-    n.toLowerCase(),
+  if (!Array.isArray(raw)) return [];
+  return (raw.filter((value) => typeof value === 'string') as string[]).map(
+    (value) => value.toLowerCase(),
   );
 }
 
@@ -106,11 +88,18 @@ function appendEntry(
   const names = readStringArray((entry as { n?: unknown }).n);
   const variations = readStringArray((entry as { v?: unknown }).v);
 
-  const rawAddedIn = (entry as { a?: unknown }).a;
-  const addedIn =
-    typeof rawAddedIn === 'string' ? rawAddedIn : String(rawAddedIn ?? '');
+  const addedIn = String((entry as { a?: unknown }).a ?? '');
 
-  const info = toEmojiInfo(unified, names, variations, addedIn);
+  // Freeze the arrays readStringArray owns directly, without copying them
+  // a second time. Caller arrays are never mutated or frozen.
+  const info: EmojiInfo = Object.freeze({
+    unified,
+    emoji: parseNativeEmoji(unified),
+    name: names[names.length - 1] || '',
+    names: Object.freeze(names),
+    variations: Object.freeze(variations),
+    addedIn,
+  });
   records.push(info);
   byUnified.set(unified, info);
   for (const variation of info.variations) {
@@ -121,18 +110,17 @@ function appendEntry(
   indexCharBucket(byCharMutable, names, info);
 }
 
-// One bucket entry per distinct character keeps the per-record cost
-// proportional to name length, not name length squared.
+// Records are indexed in order. A bucket already ending in this record
+// has seen the character, avoiding a temporary Set for every emoji.
 function indexCharBucket(
   byCharMutable: Map<string, EmojiInfo[]>,
   names: readonly string[],
   info: EmojiInfo,
 ): void {
-  const distinctChars = Array.from(new Set(names.join('')));
-  for (const char of distinctChars) {
+  for (const char of names.join('')) {
     const bucket = byCharMutable.get(char);
     if (bucket) {
-      bucket.push(info);
+      if (bucket[bucket.length - 1] !== info) bucket.push(info);
     } else {
       byCharMutable.set(char, [info]);
     }
@@ -161,15 +149,12 @@ export function getPreparedCore(emojiData?: EmojiData): PreparedCore {
     }
   }
 
-  const byChar = new Map<string, readonly EmojiInfo[]>();
-  byCharMutable.forEach((bucket, char) => {
-    byChar.set(char, Object.freeze(bucket));
-  });
+  byCharMutable.forEach(Object.freeze);
 
   const core: PreparedCore = {
     records,
     byUnified,
-    byChar,
+    byChar: byCharMutable,
     queryMemo: new Map<string, readonly EmojiInfo[]>(),
   };
 

package/src/dataUtils/emojiSelectors.ts

@@ -82,7 +82,8 @@ export function emojiVariationUnified(
 // only if the registered dataset changes, so importing this module costs
 // nothing and does not pull the dataset into a bundle.
 let indexedSource: EmojiData | null = null;
-let allEmojisByUnified: Record<string, DataEmoji> = Object.create(null);
+let allEmojisByUnified: Record<string, DataEmoji> =
+  /* @__PURE__ */ Object.create(null);
 
 function registryIndex(): Record<string, DataEmoji> {
   const source = getRegisteredDefaultEmojiData();

package/src/dataUtils/parseNativeEmoji.ts

@@ -1,6 +1,5 @@
 export function parseNativeEmoji(unified: string): string {
-  return unified
-    .split('-')
-    .map((hex) => String.fromCodePoint(parseInt(hex, 16)))
-    .join('');
+  return String.fromCodePoint(
+    ...unified.split('-').map((hex) => parseInt(hex, 16)),
+  );
 }