@emoji-components/core 1.0.0-alpha.2 → 1.0.0-alpha.3

package/README.md

@@ -21,9 +21,9 @@ const picker = createEmojiPicker(store, { frequent: 16 });
 picker.subscribe(() => console.log(picker.getSnapshot().sections));
 picker.setQuery("cat");
 
-const typeahead = createEmojiSuggestions(store, { onChoose: (s) => console.log(typeahead.textFor(s)) });
-input.addEventListener("keydown", (e) => typeahead.keydown(e));
-const stop = typeahead.syncCombobox(input);
+const suggestions = createEmojiSuggestions(store, { onChoose: (s) => console.log(suggestions.textFor(s)) });
+input.addEventListener("keydown", (e) => suggestions.keydown(e));
+const stop = suggestions.syncCombobox(input);
 ```
 
 `data` defaults to the English dataset of [`@emoji-components/data`](../data/README.md) on jsDelivr, pinned to this version. Uncontrolled frequently used emoji and skin tone persist to `localStorage`; `store.customEmojiErrors()` reports a custom emoji loader that failed, and `store.load()` runs it again.
@@ -32,7 +32,7 @@ const stop = typeahead.syncCombobox(input);
 
 | Import | Contents |
 |---|---|
-| `@emoji-components/core` | `createEmojiStore`, `createEmojiPicker`, `createEmojiSuggestions`, `createSearch`, `lexicalSearch`, `resolveEmoji`, `findShortcodeTrigger`, `isComposingKey`, `localeData`, `twemojiUrl`, unified-code helpers |
+| `@emoji-components/core` | `createEmojiStore`, `createEmojiPicker`, `createEmojiSuggestions`, `createEmojiSearch`, `lexicalSearch`, `resolveEmoji`, `findShortcodeTrigger`, `isComposingKey`, `localeData`, `twemojiUrl`, unified-code helpers |
 | `/grid` | Grid layout and keyboard moves, for your own virtualizer |
 | `/native` | Whether the system font draws an emoji |
 | `/build` | `buildDataset` from `emojibase-data` (install it alongside), also as the `npx @emoji-components/core build-data <locale>` CLI |

package/dist/build.js

@@ -3,7 +3,7 @@ import {
   defaultShortcodeSets,
   emojibaseLocales,
   findEmojibase
-} from "./chunk-UG4NPOXS.js";
+} from "./chunk-MJPQEHGK.js";
 export {
   buildDataset,
   defaultShortcodeSets,

package/dist/{chunk-UG4NPOXS.js → chunk-MJPQEHGK.js}

@@ -5,6 +5,7 @@ import path from "path";
 
 // ../../node_modules/emojibase/esm/index.js
 var SEQUENCE_REMOVAL_PATTERN = /200D|FE0E|FE0F/g;
+var GROUP_KEY_SMILEYS_EMOTION = "smileys-emotion";
 var GROUP_KEY_PEOPLE_BODY = "people-body";
 var GROUP_KEY_ANIMALS_NATURE = "animals-nature";
 var GROUP_KEY_FOOD_DRINK = "food-drink";
@@ -57,7 +58,7 @@ var isEnglish = (locale) => locale.split("-")[0] === "en";
 var defaultShortcodeSets = (locale) => isEnglish(locale) ? ["iamcal"] : ["iamcal", "cldr"];
 var GROUP_OF = { 0: 0, 1: 0, 3: 1, 4: 2, 5: 3, 6: 4, 7: 5, 8: 6, 9: 7 };
 var MESSAGE_KEY = {
-  "smileys-people": GROUP_KEY_PEOPLE_BODY,
+  "smileys-people": [GROUP_KEY_SMILEYS_EMOTION, GROUP_KEY_PEOPLE_BODY],
   "animals-nature": GROUP_KEY_ANIMALS_NATURE,
   "food-drink": GROUP_KEY_FOOD_DRINK,
   "travel-places": GROUP_KEY_TRAVEL_PLACES,
@@ -108,7 +109,9 @@ function buildDataset({ locale, shortcodes: sets = defaultShortcodeSets(locale),
     emojis.push([unified, lower(r.label), [...new Set(tags)], joinShortcodesToEmoji({ ...r, skins: void 0 }, shortcodes).shortcodes ?? [], group, r.version, hasTones]);
   }
   const capitalize = (s) => s.charAt(0).toLocaleUpperCase(locale) + s.slice(1);
-  const groups = isEnglish(locale) ? ENGLISH_GROUPS : GROUPS.map((key) => capitalize(messages.groups.find((g) => g.key === MESSAGE_KEY[key])?.message ?? key));
+  const message = (key) => messages.groups.find((g) => g.key === key)?.message ?? key;
+  const list = new Intl.ListFormat(locale, { type: "conjunction" });
+  const groups = isEnglish(locale) ? ENGLISH_GROUPS : GROUPS.map((key) => capitalize(list.format(toArray(MESSAGE_KEY[key]).map(message))));
   return {
     dataset: { format: 1, locale, emojibase: version, groups, emojis, toneExceptions },
     stats: { emoji: emojis.length, withShortcodes: emojis.filter((e) => e[3].length).length, computedTones, toneExceptions: Object.keys(toneExceptions).length }

package/dist/cli.js

@@ -4,7 +4,7 @@ import {
   defaultShortcodeSets,
   emojibaseLocales,
   findEmojibase
-} from "./chunk-UG4NPOXS.js";
+} from "./chunk-MJPQEHGK.js";
 
 // scripts/cli.ts
 import fs from "fs";

package/dist/frequents.js

@@ -3,7 +3,6 @@ import { controllable, createChangeDetails } from "./change.js";
 import { cached, createStore } from "./reactive.js";
 var HALF_LIFE = 14 * 864e5;
 var MAX = 64;
-var DEFAULTS = Object.fromEntries(["2764-fe0f", "1f44d", "1f44e", "1f602", "203c-fe0f", "2753"].map((u, i) => [u, { count: 0, lastUsed: -i }]));
 var NONE = {};
 var decayed = ({ count, lastUsed }, now) => count * 0.5 ** ((now - lastUsed) / HALF_LIFE);
 var ranked = (entries, now) => Object.entries(entries).sort((a, b) => decayed(b[1], now) - decayed(a[1], now) || b[1].lastUsed - a[1].lastUsed);
@@ -31,7 +30,7 @@ function reduceFrequents(entries, action) {
 var reduce = (state, action) => action.type === "own" ? action.entries === state.own ? state : { ...state, own: action.entries } : action.entries === state.controlled ? state : { ...state, controlled: action.entries };
 function createFrequencyStore({
   frequents,
-  defaultFrequents = DEFAULTS,
+  defaultFrequents = NONE,
   onFrequentsChange,
   deferStorage
 } = {}) {

package/dist/frequents.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/frequents.ts"],"sourcesContent":["import { controllable, createChangeDetails, type ChangeDetails } from \"./change\";\nimport { cached, createStore } from \"./reactive\";\n\n// count is the use count decayed by half every 14 days, as of lastUsed\nexport type FrequentEntry = { count: number; lastUsed: number };\nexport type Frequents = Readonly<Record<string, FrequentEntry>>;\nexport type FrequentsChangeDetails = ChangeDetails<\"pick\" | \"remove\" | \"clear\"> & { emoji?: string };\n\nexport interface FrequencyStore {\n  pick(unified: string): void;\n  remove(unified: string): void;\n  clear(): void;\n  top(n: number): readonly string[];\n  score(unified: string): number;\n  entries(): Frequents;\n  subscribe(listener: () => void): () => void;\n}\n\ntype FrequencyStoreOptions = {\n  frequents?: Frequents;\n  defaultFrequents?: Frequents;\n  onFrequentsChange?: (frequents: Frequents, details: FrequentsChangeDetails) => void;\n  deferStorage?: boolean;\n};\n\nconst HALF_LIFE = 14 * 864e5;\nconst MAX = 64;\n\n// Real entries that were never used: remove() takes them out and any pick ranks above them\nconst DEFAULTS: Frequents = Object.fromEntries([\"2764-fe0f\", \"1f44d\", \"1f44e\", \"1f602\", \"203c-fe0f\", \"2753\"].map((u, i) => [u, { count: 0, lastUsed: -i }]));\nconst NONE: Frequents = {};\n\nconst decayed = ({ count, lastUsed }: FrequentEntry, now: number) => count * 0.5 ** ((now - lastUsed) / HALF_LIFE);\n// Ties go to the later use: digit-only keys such as \"2753\" would otherwise sort first by object key order\nconst ranked = (entries: Frequents, now: number) => Object.entries(entries).sort((a, b) => decayed(b[1], now) - decayed(a[1], now) || b[1].lastUsed - a[1].lastUsed);\n// The new pick stays: it would rank last against a full list of older uses and never build up a count\nconst capped = (entries: Frequents, now: number, keep: string): Frequents => {\n  const top = ranked(entries, now).slice(0, MAX);\n  return Object.fromEntries(top.some(([u]) => u === keep) ? top : [...top.slice(0, -1), [keep, entries[keep]!]]);\n};\n\ntype FrequentsAction = { type: \"pick\"; emoji: string; now: number } | { type: \"remove\"; emoji: string } | { type: \"clear\" };\n\nfunction reduceFrequents(entries: Frequents, action: FrequentsAction): Frequents {\n  switch (action.type) {\n    case \"pick\": {\n      const prev = entries[action.emoji];\n      return capped({ ...entries, [action.emoji]: { count: (prev ? decayed(prev, action.now) : 0) + 1, lastUsed: action.now } }, action.now, action.emoji);\n    }\n    case \"remove\": {\n      if (!(action.emoji in entries)) return entries;\n      const { [action.emoji]: _, ...rest } = entries;\n      return rest;\n    }\n    case \"clear\":\n      return NONE;\n    default:\n      return action satisfies never;\n  }\n}\n\ntype FrequencyState = { own: Frequents; controlled: Frequents | undefined };\ntype FrequencyAction = { type: \"own\"; entries: Frequents } | { type: \"control\"; entries: Frequents | undefined };\n\nconst reduce = (state: FrequencyState, action: FrequencyAction): FrequencyState =>\n  action.type === \"own\" ? (action.entries === state.own ? state : { ...state, own: action.entries }) : action.entries === state.controlled ? state : { ...state, controlled: action.entries };\n\nexport function createFrequencyStore({\n  frequents,\n  defaultFrequents = DEFAULTS,\n  onFrequentsChange,\n  deferStorage,\n}: FrequencyStoreOptions = {}): FrequencyStore & { control(value: Frequents | undefined, onChange: FrequencyStoreOptions[\"onFrequentsChange\"]): void } {\n  const storage = persisted(\"emoji-components:frequents\");\n  const read = () => parse(storage.read()) ?? defaultFrequents;\n  const store = createStore<FrequencyState, FrequencyAction>({ own: deferStorage ? defaultFrequents : read(), controlled: frequents }, reduce);\n  let onChange = onFrequentsChange;\n  const tops = new WeakMap<Frequents, Map<number, readonly string[]>>();\n  const value = controllable<Frequents, FrequentsChangeDetails>({\n    controlled: () => store.getSnapshot().controlled,\n    own: () => store.getSnapshot().own,\n    onChange: () => onChange,\n    write(next) {\n      storage.write(JSON.stringify(next));\n      store.dispatch({ type: \"own\", entries: next });\n    },\n  });\n  const entries = value.value;\n  const change = (action: FrequentsAction) => value.set(reduceFrequents(entries(), action), Object.assign(createChangeDetails(action.type), { emoji: action.type === \"clear\" ? undefined : action.emoji }));\n\n  return {\n    pick: (emoji) => void change({ type: \"pick\", emoji, now: Date.now() }),\n    remove: (emoji) => void change({ type: \"remove\", emoji }),\n    clear: () => void change({ type: \"clear\" }),\n    top(n) {\n      const state = entries();\n      return cached(\n        cached(tops, state, () => new Map()),\n        n,\n        // Decay keeps the order at any reference time; the newest use avoids reading the clock during render\n        () =>\n          ranked(state, Math.max(0, ...Object.values(state).map((e) => e.lastUsed)))\n            .slice(0, n)\n            .map(([u]) => u),\n      );\n    },\n    score(unified) {\n      const entry = entries()[unified];\n      return entry ? decayed(entry, Date.now()) : 0;\n    },\n    entries,\n    subscribe: readOnFirstSubscribe(store.subscribe, () => store.dispatch({ type: \"own\", entries: read() })),\n    control(next, handler) {\n      onChange = handler;\n      store.dispatch({ type: \"control\", entries: next });\n    },\n  };\n}\n\n// A server-rendered page hydrates with the defaults; storage is read once something subscribes after mount\nexport function readOnFirstSubscribe(subscribe: (listener: () => void) => () => void, sync: () => void) {\n  let synced = false;\n  return (listener: () => void) => {\n    const unsubscribe = subscribe(listener);\n    if (!synced) {\n      synced = true;\n      sync();\n    }\n    return unsubscribe;\n  };\n}\n\nconst isEntry = (value: unknown): value is FrequentEntry => typeof (value as FrequentEntry)?.count === \"number\" && typeof (value as FrequentEntry).lastUsed === \"number\";\n\nfunction parse(raw: string | null): Frequents | undefined {\n  try {\n    const value: unknown = raw ? JSON.parse(raw) : undefined;\n    return value && typeof value === \"object\" ? Object.fromEntries(Object.entries(value).filter(([, entry]) => isEntry(entry))) : undefined;\n  } catch {\n    return undefined;\n  }\n}\n\n// Node 25+ defines a localStorage global (a warning, or a file shared by every request); only a browser's is per user\nconst browserStorage = () => (typeof window === \"undefined\" ? undefined : window.localStorage);\n\nexport function persisted(key: string): { read(): string | null; write(value: string): void } {\n  let memory: string | null = null;\n  return {\n    read() {\n      try {\n        return browserStorage()?.getItem(key) ?? memory;\n      } catch {\n        return memory;\n      }\n    },\n    write(value) {\n      memory = value;\n      try {\n        browserStorage()?.setItem(key, value);\n      } catch {}\n    },\n  };\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/frequents.ts"],"sourcesContent":["import { controllable, createChangeDetails, type ChangeDetails } from \"./change\";\nimport { cached, createStore } from \"./reactive\";\n\n// count is the use count decayed by half every 14 days, as of lastUsed\nexport type FrequentEntry = { count: number; lastUsed: number };\nexport type Frequents = Readonly<Record<string, FrequentEntry>>;\nexport type FrequentsChangeDetails = ChangeDetails<\"pick\" | \"remove\" | \"clear\"> & { emoji?: string };\n\nexport interface FrequencyStore {\n  pick(unified: string): void;\n  remove(unified: string): void;\n  clear(): void;\n  top(n: number): readonly string[];\n  score(unified: string): number;\n  entries(): Frequents;\n  subscribe(listener: () => void): () => void;\n}\n\ntype FrequencyStoreOptions = {\n  frequents?: Frequents;\n  defaultFrequents?: Frequents;\n  onFrequentsChange?: (frequents: Frequents, details: FrequentsChangeDetails) => void;\n  deferStorage?: boolean;\n};\n\nconst HALF_LIFE = 14 * 864e5;\nconst MAX = 64;\n\nconst NONE: Frequents = {};\n\nconst decayed = ({ count, lastUsed }: FrequentEntry, now: number) => count * 0.5 ** ((now - lastUsed) / HALF_LIFE);\n// Ties go to the later use: digit-only keys such as \"2753\" would otherwise sort first by object key order\nconst ranked = (entries: Frequents, now: number) => Object.entries(entries).sort((a, b) => decayed(b[1], now) - decayed(a[1], now) || b[1].lastUsed - a[1].lastUsed);\n// The new pick stays: it would rank last against a full list of older uses and never build up a count\nconst capped = (entries: Frequents, now: number, keep: string): Frequents => {\n  const top = ranked(entries, now).slice(0, MAX);\n  return Object.fromEntries(top.some(([u]) => u === keep) ? top : [...top.slice(0, -1), [keep, entries[keep]!]]);\n};\n\ntype FrequentsAction = { type: \"pick\"; emoji: string; now: number } | { type: \"remove\"; emoji: string } | { type: \"clear\" };\n\nfunction reduceFrequents(entries: Frequents, action: FrequentsAction): Frequents {\n  switch (action.type) {\n    case \"pick\": {\n      const prev = entries[action.emoji];\n      return capped({ ...entries, [action.emoji]: { count: (prev ? decayed(prev, action.now) : 0) + 1, lastUsed: action.now } }, action.now, action.emoji);\n    }\n    case \"remove\": {\n      if (!(action.emoji in entries)) return entries;\n      const { [action.emoji]: _, ...rest } = entries;\n      return rest;\n    }\n    case \"clear\":\n      return NONE;\n    default:\n      return action satisfies never;\n  }\n}\n\ntype FrequencyState = { own: Frequents; controlled: Frequents | undefined };\ntype FrequencyAction = { type: \"own\"; entries: Frequents } | { type: \"control\"; entries: Frequents | undefined };\n\nconst reduce = (state: FrequencyState, action: FrequencyAction): FrequencyState =>\n  action.type === \"own\" ? (action.entries === state.own ? state : { ...state, own: action.entries }) : action.entries === state.controlled ? state : { ...state, controlled: action.entries };\n\nexport function createFrequencyStore({\n  frequents,\n  defaultFrequents = NONE,\n  onFrequentsChange,\n  deferStorage,\n}: FrequencyStoreOptions = {}): FrequencyStore & { control(value: Frequents | undefined, onChange: FrequencyStoreOptions[\"onFrequentsChange\"]): void } {\n  const storage = persisted(\"emoji-components:frequents\");\n  const read = () => parse(storage.read()) ?? defaultFrequents;\n  const store = createStore<FrequencyState, FrequencyAction>({ own: deferStorage ? defaultFrequents : read(), controlled: frequents }, reduce);\n  let onChange = onFrequentsChange;\n  const tops = new WeakMap<Frequents, Map<number, readonly string[]>>();\n  const value = controllable<Frequents, FrequentsChangeDetails>({\n    controlled: () => store.getSnapshot().controlled,\n    own: () => store.getSnapshot().own,\n    onChange: () => onChange,\n    write(next) {\n      storage.write(JSON.stringify(next));\n      store.dispatch({ type: \"own\", entries: next });\n    },\n  });\n  const entries = value.value;\n  const change = (action: FrequentsAction) => value.set(reduceFrequents(entries(), action), Object.assign(createChangeDetails(action.type), { emoji: action.type === \"clear\" ? undefined : action.emoji }));\n\n  return {\n    pick: (emoji) => void change({ type: \"pick\", emoji, now: Date.now() }),\n    remove: (emoji) => void change({ type: \"remove\", emoji }),\n    clear: () => void change({ type: \"clear\" }),\n    top(n) {\n      const state = entries();\n      return cached(\n        cached(tops, state, () => new Map()),\n        n,\n        // Decay keeps the order at any reference time; the newest use avoids reading the clock during render\n        () =>\n          ranked(state, Math.max(0, ...Object.values(state).map((e) => e.lastUsed)))\n            .slice(0, n)\n            .map(([u]) => u),\n      );\n    },\n    score(unified) {\n      const entry = entries()[unified];\n      return entry ? decayed(entry, Date.now()) : 0;\n    },\n    entries,\n    subscribe: readOnFirstSubscribe(store.subscribe, () => store.dispatch({ type: \"own\", entries: read() })),\n    control(next, handler) {\n      onChange = handler;\n      store.dispatch({ type: \"control\", entries: next });\n    },\n  };\n}\n\n// A server-rendered page hydrates with the defaults; storage is read once something subscribes after mount\nexport function readOnFirstSubscribe(subscribe: (listener: () => void) => () => void, sync: () => void) {\n  let synced = false;\n  return (listener: () => void) => {\n    const unsubscribe = subscribe(listener);\n    if (!synced) {\n      synced = true;\n      sync();\n    }\n    return unsubscribe;\n  };\n}\n\nconst isEntry = (value: unknown): value is FrequentEntry => typeof (value as FrequentEntry)?.count === \"number\" && typeof (value as FrequentEntry).lastUsed === \"number\";\n\nfunction parse(raw: string | null): Frequents | undefined {\n  try {\n    const value: unknown = raw ? JSON.parse(raw) : undefined;\n    return value && typeof value === \"object\" ? Object.fromEntries(Object.entries(value).filter(([, entry]) => isEntry(entry))) : undefined;\n  } catch {\n    return undefined;\n  }\n}\n\n// Node 25+ defines a localStorage global (a warning, or a file shared by every request); only a browser's is per user\nconst browserStorage = () => (typeof window === \"undefined\" ? undefined : window.localStorage);\n\nexport function persisted(key: string): { read(): string | null; write(value: string): void } {\n  let memory: string | null = null;\n  return {\n    read() {\n      try {\n        return browserStorage()?.getItem(key) ?? memory;\n      } catch {\n        return memory;\n      }\n    },\n    write(value) {\n      memory = value;\n      try {\n        browserStorage()?.setItem(key, value);\n      } catch {}\n    },\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/index.d.ts

@@ -1,6 +1,6 @@
-import { E as EmojiStore, C as CompletionOrder, a as ShortcodeCompletion, b as EmojiSelection, c as ChangeDetails, d as EmojiLabels, e as CategoryOption, f as SearchResultsMode, g as Category, h as EmojiSection, i as EmojiItem } from './sections-Bwe4sMgE.js';
+import { E as EmojiStore, C as CompletionOrder, a as ShortcodeCompletion, b as EmojiSelection, c as ChangeDetails, d as EmojiLabels, e as CategoryOption, f as SearchResultsMode, g as Category, h as EmojiSection, i as EmojiItem } from './sections-D7PEWAVf.js';
 import { Subscribe } from './internal.js';
-export { j as CustomEmoji, k as CustomEmojiLoader, l as CustomEmojiSource, m as EmojiDataSource, n as EmojiInput, o as EmojiSearch, p as EmojiStoreOptions, q as EmojiStoreStatus, F as Frequents, r as FrequentsChangeDetails, R as Renderer, s as ResolvedEmoji, t as SkinToneChangeDetails, u as createEmojiStore, v as findShortcodeTrigger, w as isComposingKey, x as lexicalSearch, y as localeData, z as resolveEmoji, A as twemojiUrl } from './sections-Bwe4sMgE.js';
+export { j as CustomEmoji, k as CustomEmojiLoader, l as CustomEmojiSource, m as EmojiDataSource, n as EmojiInput, o as EmojiSearch, p as EmojiStoreOptions, q as EmojiStoreStatus, F as Frequents, r as FrequentsChangeDetails, R as Renderer, s as ResolvedEmoji, t as SkinToneChangeDetails, u as createEmojiStore, v as findShortcodeTrigger, w as isComposingKey, x as lexicalSearch, y as localeData, z as resolveEmoji, A as twemojiUrl } from './sections-D7PEWAVf.js';
 import { E as EmojiRecord, S as SkinToneValue } from './dataset-BQY5KQKL.js';
 export { D as Dataset, a as EmojiDataInput, n as nativeToUnified, u as unifiedToNative, w as withTone, b as withoutTone } from './dataset-BQY5KQKL.js';
 
@@ -13,13 +13,13 @@ interface EmojiSearchQuery {
     query: string;
     limit: number;
 }
-interface EmojiSearchRunner {
+interface EmojiSearchStore {
     getSnapshot(): EmojiSearchState;
     subscribe: Subscribe;
     setQuery(query: string, limit: number): void;
     abort(): void;
 }
-declare function createSearch(store: EmojiStore, initial?: EmojiSearchQuery): EmojiSearchRunner;
+declare function createEmojiSearch(store: EmojiStore, initial?: EmojiSearchQuery): EmojiSearchStore;
 
 interface KeyLike {
     key: string;
@@ -97,6 +97,8 @@ type HighlightChangeDetails = ChangeDetails<"keyboard" | "pointer" | "imperative
 };
 type QueryChangeDetails = ChangeDetails<"input-change" | "clear-press" | "escape-key" | "imperative-action" | "none">;
 type CollapsedCategoriesChangeDetails = ChangeDetails<"trigger-press" | "none">;
+type ValueChangeDetails = ChangeDetails<"item-press" | "imperative-action">;
+type ReactionsOpenChangeDetails = ChangeDetails<"trigger-press" | "item-press" | "escape-key" | "none">;
 interface ChangeSource<D extends ChangeDetails> {
     reason?: D["reason"];
     event?: Event;
@@ -104,8 +106,7 @@ interface ChangeSource<D extends ChangeDetails> {
 interface EmojiPickerOptions<Icon = unknown> {
     labels?: EmojiLabels;
     categories?: readonly CategoryOption<Icon>[];
-    frequent?: number | false;
-    suggested?: readonly string[];
+    frequent?: number | false | readonly string[];
     emojiVersion?: number;
     drawable?: (record: EmojiRecord, unified: string) => boolean;
     searchResults?: SearchResultsMode;
@@ -119,8 +120,15 @@ interface EmojiPickerOptions<Icon = unknown> {
     highlight?: string | null;
     defaultHighlight?: string | null;
     onHighlightChange?: (unified: string | null, details: HighlightChangeDetails) => void;
+    value?: string | null;
+    defaultValue?: string | null;
+    onValueChange?: (unified: string | null, details: ValueChangeDetails) => void;
+    onSelect?: (selection: EmojiSelection, details: ValueChangeDetails) => void;
     disableVariations?: boolean;
     reactions?: readonly string[] | number;
+    reactionsOpen?: boolean;
+    defaultReactionsOpen?: boolean;
+    onReactionsOpenChange?: (open: boolean, details: ReactionsOpenChangeDetails) => void;
 }
 type FocusMode = "virtual" | "roving";
 interface EmojiPickerSnapshot<Icon = unknown> {
@@ -141,6 +149,8 @@ interface EmojiPickerSnapshot<Icon = unknown> {
     activeSection: string | null;
     variations: string | null;
     reactions: readonly string[] | undefined;
+    reactionsOpen: boolean;
+    value: string | null | undefined;
     tabStop: string | null;
     pressed: string | null;
 }
@@ -160,6 +170,8 @@ interface EmojiPickerStore<Icon = unknown> {
     setTabStop(id: string | null): void;
     press(id: string | null): void;
     choose(id?: string | null): EmojiSelection | undefined;
+    pick(id?: string | null, source?: ChangeSource<ValueChangeDetails>): EmojiSelection | undefined;
+    setReactionsOpen(open: boolean, source?: ChangeSource<ReactionsOpenChangeDetails>): ReactionsOpenChangeDetails | undefined;
     openVariations(id: string | null): boolean;
     closeVariations(): void;
     registerInput(): () => void;
@@ -169,5 +181,5 @@ interface EmojiPickerStore<Icon = unknown> {
 }
 declare function createEmojiPicker<Icon = unknown>(store: EmojiStore, options?: EmojiPickerOptions<Icon>): EmojiPickerStore<Icon>;
 
-export { Category, CategoryOption, ChangeDetails, CompletionOrder, EmojiItem, EmojiLabels, EmojiRecord, EmojiSection, EmojiSelection, EmojiStore, SearchResultsMode, ShortcodeCompletion, SkinToneValue, createEmojiPicker, createEmojiSuggestions, createSearch };
-export type { CollapsedCategoriesChangeDetails, EmojiPickerOptions, EmojiPickerSnapshot, EmojiPickerStore, EmojiSearchState, EmojiSuggestionsOptions, EmojiSuggestionsStore, EmojiTrigger, HighlightChangeDetails, KeyLike, QueryChangeDetails };
+export { Category, CategoryOption, ChangeDetails, CompletionOrder, EmojiItem, EmojiLabels, EmojiRecord, EmojiSection, EmojiSelection, EmojiStore, SearchResultsMode, ShortcodeCompletion, SkinToneValue, createEmojiPicker, createEmojiSearch, createEmojiSuggestions };
+export type { CollapsedCategoriesChangeDetails, EmojiPickerOptions, EmojiPickerSnapshot, EmojiPickerStore, EmojiSearchState, EmojiSearchStore, EmojiSuggestionsOptions, EmojiSuggestionsStore, EmojiTrigger, HighlightChangeDetails, KeyLike, QueryChangeDetails, ReactionsOpenChangeDetails, ValueChangeDetails };

package/dist/index.js

@@ -3,16 +3,16 @@ import { createEmojiStore } from "./store.js";
 import { localeData, twemojiUrl } from "./platform.js";
 import { nativeToUnified, unifiedToNative, withTone, withoutTone } from "./dataset.js";
 import { lexicalSearch } from "./search/search.js";
-import { createSearch } from "./search/query.js";
+import { createEmojiSearch } from "./search/query.js";
 import { resolveEmoji } from "./resolve.js";
 import { findShortcodeTrigger, isComposingKey } from "./shortcodes.js";
 import { createEmojiSuggestions } from "./suggestions.js";
 import { createEmojiPicker } from "./picker/picker.js";
 export {
   createEmojiPicker,
+  createEmojiSearch,
   createEmojiStore,
   createEmojiSuggestions,
-  createSearch,
   findShortcodeTrigger,
   isComposingKey,
   lexicalSearch,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { createEmojiStore } from \"./store\";\nexport type { CustomEmoji, CustomEmojiLoader, CustomEmojiSource, EmojiDataSource, EmojiSelection, EmojiStore, EmojiStoreOptions, EmojiStoreStatus, SkinToneChangeDetails } from \"./store\";\nexport type { ChangeDetails } from \"./change\";\nexport type { Frequents, FrequentsChangeDetails } from \"./frequents\";\nexport { localeData, twemojiUrl } from \"./platform\";\nexport type { Renderer } from \"./platform\";\nexport { nativeToUnified, unifiedToNative, withTone, withoutTone } from \"./dataset\";\nexport type { Dataset, EmojiDataInput, EmojiRecord, SkinToneValue } from \"./dataset\";\nexport { lexicalSearch } from \"./search/search\";\nexport type { EmojiSearch } from \"./search/search\";\nexport type { CompletionOrder, ShortcodeCompletion } from \"./search/search-index\";\nexport { createSearch } from \"./search/query\";\nexport type { EmojiSearchState } from \"./search/query\";\nexport type { EmojiLabels } from \"./labels\";\nexport { resolveEmoji } from \"./resolve\";\nexport type { EmojiInput, ResolvedEmoji } from \"./resolve\";\nexport { findShortcodeTrigger, isComposingKey } from \"./shortcodes\";\nexport { createEmojiSuggestions } from \"./suggestions\";\nexport type { EmojiSuggestionsStore, EmojiSuggestionsOptions, EmojiTrigger, KeyLike } from \"./suggestions\";\nexport { createEmojiPicker } from \"./picker/picker\";\nexport type { CollapsedCategoriesChangeDetails, EmojiPickerStore, EmojiPickerOptions, EmojiPickerSnapshot, HighlightChangeDetails, QueryChangeDetails } from \"./picker/picker\";\nexport type { Category, CategoryOption, EmojiItem, EmojiSection, SearchResultsMode } from \"./picker/sections\";\n"],"mappings":";AAAA,SAAS,wBAAwB;AAIjC,SAAS,YAAY,kBAAkB;AAEvC,SAAS,iBAAiB,iBAAiB,UAAU,mBAAmB;AAExE,SAAS,qBAAqB;AAG9B,SAAS,oBAAoB;AAG7B,SAAS,oBAAoB;AAE7B,SAAS,sBAAsB,sBAAsB;AACrD,SAAS,8BAA8B;AAEvC,SAAS,yBAAyB;","names":[]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { createEmojiStore } from \"./store\";\nexport type { CustomEmoji, CustomEmojiLoader, CustomEmojiSource, EmojiDataSource, EmojiSelection, EmojiStore, EmojiStoreOptions, EmojiStoreStatus, SkinToneChangeDetails } from \"./store\";\nexport type { ChangeDetails } from \"./change\";\nexport type { Frequents, FrequentsChangeDetails } from \"./frequents\";\nexport { localeData, twemojiUrl } from \"./platform\";\nexport type { Renderer } from \"./platform\";\nexport { nativeToUnified, unifiedToNative, withTone, withoutTone } from \"./dataset\";\nexport type { Dataset, EmojiDataInput, EmojiRecord, SkinToneValue } from \"./dataset\";\nexport { lexicalSearch } from \"./search/search\";\nexport type { EmojiSearch } from \"./search/search\";\nexport type { CompletionOrder, ShortcodeCompletion } from \"./search/search-index\";\nexport { createEmojiSearch } from \"./search/query\";\nexport type { EmojiSearchState, EmojiSearchStore } from \"./search/query\";\nexport type { EmojiLabels } from \"./labels\";\nexport { resolveEmoji } from \"./resolve\";\nexport type { EmojiInput, ResolvedEmoji } from \"./resolve\";\nexport { findShortcodeTrigger, isComposingKey } from \"./shortcodes\";\nexport { createEmojiSuggestions } from \"./suggestions\";\nexport type { EmojiSuggestionsStore, EmojiSuggestionsOptions, EmojiTrigger, KeyLike } from \"./suggestions\";\nexport { createEmojiPicker } from \"./picker/picker\";\nexport type { CollapsedCategoriesChangeDetails, EmojiPickerStore, EmojiPickerOptions, EmojiPickerSnapshot, HighlightChangeDetails, QueryChangeDetails, ReactionsOpenChangeDetails, ValueChangeDetails } from \"./picker/picker\";\nexport type { Category, CategoryOption, EmojiItem, EmojiSection, SearchResultsMode } from \"./picker/sections\";\n"],"mappings":";AAAA,SAAS,wBAAwB;AAIjC,SAAS,YAAY,kBAAkB;AAEvC,SAAS,iBAAiB,iBAAiB,UAAU,mBAAmB;AAExE,SAAS,qBAAqB;AAG9B,SAAS,yBAAyB;AAGlC,SAAS,oBAAoB;AAE7B,SAAS,sBAAsB,sBAAsB;AACrD,SAAS,8BAA8B;AAEvC,SAAS,yBAAyB;","names":[]}

package/dist/internal.d.ts

@@ -1,6 +1,6 @@
-import { S as Subscribe } from './sections-Bwe4sMgE.js';
+import { S as Subscribe } from './sections-D7PEWAVf.js';
 import { EmojiSection } from './index.js';
-export { T as TWEMOJI_EMOJI_VERSION, B as createChangeDetails, D as customRecord, G as isCustomEmoji, H as localizeLabels, I as missingEmojiText, J as nameWithTone, K as shallowEqual, L as subscribeAll } from './sections-Bwe4sMgE.js';
+export { T as TWEMOJI_EMOJI_VERSION, B as createChangeDetails, D as customRecord, G as isCustomEmoji, H as localizeLabels, I as missingEmojiText, J as nameWithTone, K as shallowEqual, L as subscribeAll } from './sections-D7PEWAVf.js';
 export { c as SKIN_TONE_VALUES, i as isUnified } from './dataset-BQY5KQKL.js';
 import { EmojiGrid, EmojiGridMove } from './grid.js';
 export { P as PROBE_BATCH, o as onNativeSupportChange } from './native-B0Oa7IDL.js';

package/dist/labels.js

@@ -21,11 +21,12 @@ var defaultLabels = {
   emojiList: "Emoji",
   resultCount: plural("en", COUNT),
   categoryNavigation: "Category navigation",
-  suggested: "Frequently used",
+  frequent: "Frequently used",
   custom: "Custom",
+  suggestions: "Emoji suggestions",
   reactions: "Reactions",
   expandReactions: "More emoji",
-  previewCaption: "What's your mood?",
+  previewCaption: "Pick an emoji",
   skinTone: "Skin tone",
   skinTones: ["Default skin tone", "Light skin tone", "Medium-light skin tone", "Medium skin tone", "Medium-dark skin tone", "Dark skin tone"],
   withSkinTone: (name, tone) => `${name}: ${TONE_SUFFIXES[tone - 1]}`

package/dist/labels.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/labels.ts"],"sourcesContent":["type PluralForms = { other: string } & Partial<Record<Intl.LDMLPluralRule | `=${number}`, string>>;\n\n// The default resultCount; apps plug their own i18n library into labels.resultCount\nexport function plural(locale: string, forms: PluralForms): (count: number) => string {\n  const rules = new Intl.PluralRules(locale);\n  const number = new Intl.NumberFormat(locale);\n  return (count) => {\n    const form = forms[`=${count}`] ?? forms[rules.select(count)] ?? forms.other;\n    return form.replaceAll(\"#\", number.format(count));\n  };\n}\n\nexport type SkinToneNames = readonly [string, string, string, string, string, string];\n\nexport type EmojiLabels = {\n  picker: string;\n  searchPlaceholder: string;\n  searchLabel: string;\n  searchClear: string;\n  searchResults: string;\n  emojiList: string;\n  resultCount: (count: number) => string;\n  categoryNavigation: string;\n  suggested: string;\n  custom: string;\n  reactions: string;\n  expandReactions: string;\n  previewCaption: string;\n  skinTone: string;\n  skinTones: SkinToneNames;\n  withSkinTone: (name: string, tone: number) => string;\n};\n\nconst COUNT: PluralForms = { \"=0\": \"No results\", one: \"# result\", other: \"# results\" };\n\n// English, with the app's overrides: a locale alone doesn't translate the strings, so it doesn't change their plural rules either\nexport function localizeLabels(overrides?: Partial<EmojiLabels>): EmojiLabels {\n  return overrides ? { ...defaultLabels, ...overrides } : defaultLabels;\n}\n\nconst TONE_SUFFIXES = [\"light skin tone\", \"medium-light skin tone\", \"medium skin tone\", \"medium-dark skin tone\", \"dark skin tone\"];\n\nexport const defaultLabels: EmojiLabels = {\n  picker: \"Emoji picker\",\n  searchPlaceholder: \"Search\",\n  searchLabel: \"Type to search for an emoji\",\n  searchClear: \"Clear\",\n  searchResults: \"Search results\",\n  emojiList: \"Emoji\",\n  resultCount: plural(\"en\", COUNT),\n  categoryNavigation: \"Category navigation\",\n  suggested: \"Frequently used\",\n  custom: \"Custom\",\n  reactions: \"Reactions\",\n  expandReactions: \"More emoji\",\n  previewCaption: \"What's your mood?\",\n  skinTone: \"Skin tone\",\n  skinTones: [\"Default skin tone\", \"Light skin tone\", \"Medium-light skin tone\", \"Medium skin tone\", \"Medium-dark skin tone\", \"Dark skin tone\"],\n  withSkinTone: (name, tone) => `${name}: ${TONE_SUFFIXES[tone - 1]}`,\n};\n"],"mappings":";AAGO,SAAS,OAAO,QAAgB,OAA+C;AACpF,QAAM,QAAQ,IAAI,KAAK,YAAY,MAAM;AACzC,QAAM,SAAS,IAAI,KAAK,aAAa,MAAM;AAC3C,SAAO,CAAC,UAAU;AAChB,UAAM,OAAO,MAAM,IAAI,KAAK,EAAE,KAAK,MAAM,MAAM,OAAO,KAAK,CAAC,KAAK,MAAM;AACvE,WAAO,KAAK,WAAW,KAAK,OAAO,OAAO,KAAK,CAAC;AAAA,EAClD;AACF;AAuBA,IAAM,QAAqB,EAAE,MAAM,cAAc,KAAK,YAAY,OAAO,YAAY;AAG9E,SAAS,eAAe,WAA+C;AAC5E,SAAO,YAAY,EAAE,GAAG,eAAe,GAAG,UAAU,IAAI;AAC1D;AAEA,IAAM,gBAAgB,CAAC,mBAAmB,0BAA0B,oBAAoB,yBAAyB,gBAAgB;AAE1H,IAAM,gBAA6B;AAAA,EACxC,QAAQ;AAAA,EACR,mBAAmB;AAAA,EACnB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,eAAe;AAAA,EACf,WAAW;AAAA,EACX,aAAa,OAAO,MAAM,KAAK;AAAA,EAC/B,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,WAAW,CAAC,qBAAqB,mBAAmB,0BAA0B,oBAAoB,yBAAyB,gBAAgB;AAAA,EAC3I,cAAc,CAAC,MAAM,SAAS,GAAG,IAAI,KAAK,cAAc,OAAO,CAAC,CAAC;AACnE;","names":[]}
+{"version":3,"sources":["../src/labels.ts"],"sourcesContent":["type PluralForms = { other: string } & Partial<Record<Intl.LDMLPluralRule | `=${number}`, string>>;\n\n// The default resultCount; apps plug their own i18n library into labels.resultCount\nexport function plural(locale: string, forms: PluralForms): (count: number) => string {\n  const rules = new Intl.PluralRules(locale);\n  const number = new Intl.NumberFormat(locale);\n  return (count) => {\n    const form = forms[`=${count}`] ?? forms[rules.select(count)] ?? forms.other;\n    return form.replaceAll(\"#\", number.format(count));\n  };\n}\n\nexport type SkinToneNames = readonly [string, string, string, string, string, string];\n\nexport type EmojiLabels = {\n  picker: string;\n  searchPlaceholder: string;\n  searchLabel: string;\n  searchClear: string;\n  searchResults: string;\n  emojiList: string;\n  resultCount: (count: number) => string;\n  categoryNavigation: string;\n  frequent: string;\n  custom: string;\n  suggestions: string;\n  reactions: string;\n  expandReactions: string;\n  previewCaption: string;\n  skinTone: string;\n  skinTones: SkinToneNames;\n  withSkinTone: (name: string, tone: number) => string;\n};\n\nconst COUNT: PluralForms = { \"=0\": \"No results\", one: \"# result\", other: \"# results\" };\n\n// English, with the app's overrides: a locale alone doesn't translate the strings, so it doesn't change their plural rules either\nexport function localizeLabels(overrides?: Partial<EmojiLabels>): EmojiLabels {\n  return overrides ? { ...defaultLabels, ...overrides } : defaultLabels;\n}\n\nconst TONE_SUFFIXES = [\"light skin tone\", \"medium-light skin tone\", \"medium skin tone\", \"medium-dark skin tone\", \"dark skin tone\"];\n\nexport const defaultLabels: EmojiLabels = {\n  picker: \"Emoji picker\",\n  searchPlaceholder: \"Search\",\n  searchLabel: \"Type to search for an emoji\",\n  searchClear: \"Clear\",\n  searchResults: \"Search results\",\n  emojiList: \"Emoji\",\n  resultCount: plural(\"en\", COUNT),\n  categoryNavigation: \"Category navigation\",\n  frequent: \"Frequently used\",\n  custom: \"Custom\",\n  suggestions: \"Emoji suggestions\",\n  reactions: \"Reactions\",\n  expandReactions: \"More emoji\",\n  previewCaption: \"Pick an emoji\",\n  skinTone: \"Skin tone\",\n  skinTones: [\"Default skin tone\", \"Light skin tone\", \"Medium-light skin tone\", \"Medium skin tone\", \"Medium-dark skin tone\", \"Dark skin tone\"],\n  withSkinTone: (name, tone) => `${name}: ${TONE_SUFFIXES[tone - 1]}`,\n};\n"],"mappings":";AAGO,SAAS,OAAO,QAAgB,OAA+C;AACpF,QAAM,QAAQ,IAAI,KAAK,YAAY,MAAM;AACzC,QAAM,SAAS,IAAI,KAAK,aAAa,MAAM;AAC3C,SAAO,CAAC,UAAU;AAChB,UAAM,OAAO,MAAM,IAAI,KAAK,EAAE,KAAK,MAAM,MAAM,OAAO,KAAK,CAAC,KAAK,MAAM;AACvE,WAAO,KAAK,WAAW,KAAK,OAAO,OAAO,KAAK,CAAC;AAAA,EAClD;AACF;AAwBA,IAAM,QAAqB,EAAE,MAAM,cAAc,KAAK,YAAY,OAAO,YAAY;AAG9E,SAAS,eAAe,WAA+C;AAC5E,SAAO,YAAY,EAAE,GAAG,eAAe,GAAG,UAAU,IAAI;AAC1D;AAEA,IAAM,gBAAgB,CAAC,mBAAmB,0BAA0B,oBAAoB,yBAAyB,gBAAgB;AAE1H,IAAM,gBAA6B;AAAA,EACxC,QAAQ;AAAA,EACR,mBAAmB;AAAA,EACnB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,eAAe;AAAA,EACf,WAAW;AAAA,EACX,aAAa,OAAO,MAAM,KAAK;AAAA,EAC/B,oBAAoB;AAAA,EACpB,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,WAAW;AAAA,EACX,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,WAAW,CAAC,qBAAqB,mBAAmB,0BAA0B,oBAAoB,yBAAyB,gBAAgB;AAAA,EAC3I,cAAc,CAAC,MAAM,SAAS,GAAG,IAAI,KAAK,cAAc,OAAO,CAAC,CAAC;AACnE;","names":[]}

package/dist/picker/picker.js

@@ -2,7 +2,7 @@
 import { controllable, createChangeDetails } from "../change.js";
 import { withoutTone } from "../dataset.js";
 import { createStore, memo, patch, shallowEqual, stable, subscribeAll } from "../reactive.js";
-import { createSearch } from "../search/query.js";
+import { createEmojiSearch } from "../search/query.js";
 import {
   categoryList,
   categorySections,
@@ -58,7 +58,9 @@ function createEmojiPicker(store, options = {}) {
       domFocus: false,
       held: null,
       tabStop: null,
-      pressed: null
+      pressed: null,
+      value: options.defaultValue ?? null,
+      reactionsOpen: options.defaultReactionsOpen ?? true
     },
     patch
   );
@@ -66,12 +68,13 @@ function createEmojiPicker(store, options = {}) {
   const opts = () => input.getSnapshot().options;
   const searchOf = (state, current) => ({ query: queryOf(state, current), limit: current.searchLimit ?? DEFAULT_SEARCH_LIMIT });
   const initial = searchOf(ui.getSnapshot(), options);
-  const search = createSearch(store, initial);
+  const search = createEmojiSearch(store, initial);
   const syncSearch = () => {
     const { query: query2, limit } = searchOf(ui.getSnapshot(), opts());
     search.setQuery(query2, limit);
   };
   let kept = { query: "" };
+  const tracks = (current) => options.defaultValue !== void 0 || current.value !== void 0 || current.onValueChange !== void 0;
   const items = memo(itemFactory);
   const categoriesOf = memo(
     (groupNames, customGroups, categories, labels) => categoryList(
@@ -82,7 +85,7 @@ function createEmojiPicker(store, options = {}) {
     )
   );
   const sectionsOf = memo(
-    (records, customGroups, ready, categories, suggested, collapsed2, emojiVersion, tone, item) => ready ? categorySections({ categories, records, suggested, customGroup: (u) => customGroups.get(u), collapsed: collapsed2, emojiVersion, get: store.get, tone, item }) : NO_SECTIONS
+    (records, customGroups, ready, categories, frequent, collapsed2, emojiVersion, tone, item) => ready ? categorySections({ categories, records, frequent, customGroup: (u) => customGroups.get(u), collapsed: collapsed2, emojiVersion, get: store.get, tone, item }) : NO_SECTIONS
   );
   const resultsOf = memo((results, emojiVersion, drawable, tone) => {
     const shown = emojiVersion == null ? results : results.filter(shownIn(emojiVersion));
@@ -94,7 +97,10 @@ function createEmojiPicker(store, options = {}) {
   });
   const activeOf = memo(findItem);
   const keep = stable();
-  const frequentCount = () => (opts().frequent ?? DEFAULT_FREQUENT) || 1;
+  const frequentCount = () => {
+    const { frequent = DEFAULT_FREQUENT } = opts();
+    return typeof frequent === "number" ? frequent || 1 : 1;
+  };
   const reactionsOf = (reactions) => typeof reactions === "number" ? store.frequent(reactions) : reactions;
   const select = memo(
     (state, current, ready, records, tone, frequent, found, storeLabels) => {
@@ -106,12 +112,13 @@ function createEmojiPicker(store, options = {}) {
       const searching = query2.trim().length > 0;
       const results = resultsOf(found.results, current.emojiVersion, current.drawable, tone);
       const categories = categoriesOf(groupNames, customGroups, current.categories, labels);
-      const suggested = current.suggested ?? (current.frequent === false ? NO_IDS : frequent);
+      const shownFrequent = Array.isArray(current.frequent) ? current.frequent : current.frequent === false ? NO_IDS : frequent;
       const collapsed2 = collapsedOf(state, current);
-      const categorySections2 = sectionsOf(records, customGroups, ready, categories, suggested, collapsed2, current.emojiVersion, tone, item);
+      const categorySections2 = sectionsOf(records, customGroups, ready, categories, shownFrequent, collapsed2, current.emojiVersion, tone, item);
       const sections = searching ? resultSectionsOf(results, current.searchResults ?? "ranked", categories, labels, groupNames, tone, item) : categorySections2;
       const highlighted2 = resolveKey(sections, current.highlight === void 0 ? state.highlighted : current.highlight, state.highlighted);
       const virtual = (state.inputs > 0 || !state.mounted) && !state.domFocus;
+      const reactions = state.held && typeof current.reactions === "number" ? state.held.reactions : reactionsOf(current.reactions);
       return keep({
         query: query2,
         searching,
@@ -129,7 +136,10 @@ function createEmojiPicker(store, options = {}) {
         active: activeOf(sections, highlighted2 ?? state.hovered),
         activeSection: state.activeSection,
         variations: state.variations,
-        reactions: state.held ? state.held.reactions : reactionsOf(current.reactions),
+        reactions,
+        // An empty row, such as frequently used before any pick, shows the picker instead
+        reactionsOpen: Boolean(reactions?.length) && (current.reactionsOpen ?? state.reactionsOpen),
+        value: tracks(current) ? current.value === void 0 ? state.value : current.value : void 0,
         tabStop: state.tabStop,
         pressed: state.pressed
       });
@@ -137,14 +147,14 @@ function createEmojiPicker(store, options = {}) {
   );
   function getSnapshot() {
     const state = ui.getSnapshot();
-    return select(state, opts(), store.status() === "ready", store.records(), store.skinTone(), state.held?.suggested ?? store.frequent(frequentCount()), search.getSnapshot(), store.labels());
+    return select(state, opts(), store.status() === "ready", store.records(), store.skinTone(), state.held?.frequent ?? store.frequent(frequentCount()), search.getSnapshot(), store.labels());
   }
   const set = (fields) => ui.dispatch(fields);
   const query = controllable({
     controlled: () => opts().query,
     own: () => ui.getSnapshot().query,
     onChange: () => opts().onQueryChange,
-    write: (value) => set({ query: value })
+    write: (value2) => set({ query: value2 })
   });
   const collapsed = controllable({
     controlled: () => input.getSnapshot().draft ?? opts().collapsedCategories,
@@ -163,21 +173,33 @@ function createEmojiPicker(store, options = {}) {
     },
     write: (key) => set({ highlighted: key })
   });
-  const changeCollapsed = (id, value, { reason = "none", event }) => void collapsed.set(setCategoryCollapsed(collapsed.value(), id, value), createChangeDetails(reason, event));
-  return {
+  const value = controllable({
+    controlled: () => opts().value,
+    own: () => ui.getSnapshot().value,
+    onChange: () => opts().onValueChange,
+    write: (unified) => set({ value: unified })
+  });
+  const reactionsOpen = controllable({
+    controlled: () => opts().reactionsOpen,
+    own: () => ui.getSnapshot().reactionsOpen,
+    onChange: () => opts().onReactionsOpenChange,
+    write: (open) => set({ reactionsOpen: open })
+  });
+  const changeCollapsed = (id, value2, { reason = "none", event }) => void collapsed.set(setCategoryCollapsed(collapsed.value(), id, value2), createChangeDetails(reason, event));
+  const self = {
     getSnapshot,
     subscribe: subscribeAll(ui.subscribe, input.subscribe, store.subscribe, (listener) => store.frequents.subscribe(() => !ui.getSnapshot().held && listener()), search.subscribe),
     setOptions(next) {
       input.dispatch({ type: "options", options: next });
       syncSearch();
     },
-    setQuery(value, { reason = "none", event } = {}) {
-      const details = query.set(value, createChangeDetails(reason, event));
+    setQuery(value2, { reason = "none", event } = {}) {
+      const details = query.set(value2, createChangeDetails(reason, event));
       syncSearch();
       return details;
     },
     toggleCollapsed: (id, source = {}) => changeCollapsed(id, void 0, source),
-    setCollapsed: (id, value, source = {}) => changeCollapsed(id, value, source),
+    setCollapsed: (id, value2, source = {}) => changeCollapsed(id, value2, source),
     highlight(emoji, { reason = "none", event } = {}) {
       const { sections, highlighted: current, searching } = getSnapshot();
       const key = resolveKey(sections, emoji, current);
@@ -200,6 +222,21 @@ function createEmojiPicker(store, options = {}) {
     setTabStop: (id) => set({ tabStop: id }),
     press: (id) => set({ pressed: id }),
     choose: (id = getSnapshot().highlighted) => id == null ? void 0 : store.select(findItem(getSnapshot().sections, id)?.unified ?? id),
+    pick(id, { reason = "item-press", event } = {}) {
+      const selection = self.choose(id);
+      if (!selection) return void 0;
+      const details = createChangeDetails(reason, event);
+      opts().onSelect?.(selection, details);
+      if (details.isCanceled) return selection;
+      if (tracks(opts())) value.set(selection.unified, createChangeDetails(reason, event));
+      if (opts().reactions && !reactionsOpen.value()) self.setReactionsOpen(true, { reason: "item-press", event });
+      return selection;
+    },
+    setReactionsOpen(open, { reason = "none", event } = {}) {
+      const details = reactionsOpen.set(open, createChangeDetails(reason, event));
+      if (open && details && !details.isCanceled) self.setQuery("");
+      return details;
+    },
     openVariations(id) {
       const record = findItem(getSnapshot().sections, id)?.record;
       if (!record?.tones.length || record.imageUrl || opts().disableVariations) return false;
@@ -212,12 +249,13 @@ function createEmojiPicker(store, options = {}) {
       return () => set({ inputs: ui.getSnapshot().inputs - 1 });
     },
     mount: () => set({ mounted: true }),
-    setDomFocus: (value) => set({ domFocus: value }),
-    hold(value) {
-      if (Boolean(ui.getSnapshot().held) === value) return;
-      set({ held: value ? { suggested: store.frequent(frequentCount()), reactions: reactionsOf(opts().reactions) } : null });
+    setDomFocus: (value2) => set({ domFocus: value2 }),
+    hold(value2) {
+      if (Boolean(ui.getSnapshot().held) === value2) return;
+      set({ held: value2 ? { frequent: store.frequent(frequentCount()), reactions: reactionsOf(opts().reactions) } : null });
     }
   };
+  return self;
 }
 export {
   createEmojiPicker