modern-cmdk 1.2.2 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +109 -54
- package/dist/codemod/cli.d.mts +16 -1
- package/dist/codemod/cli.mjs +14173 -60921
- package/dist/codemod/transforms/data-attrs.d.mts +1 -3
- package/dist/codemod/transforms/data-attrs.mjs +2 -3
- package/dist/codemod/transforms/forward-ref.d.mts +1 -3
- package/dist/codemod/transforms/forward-ref.mjs +1 -2
- package/dist/codemod/transforms/import-rewrite.d.mts +1 -3
- package/dist/codemod/transforms/import-rewrite.mjs +1 -2
- package/dist/codemod/transforms/should-filter.d.mts +1 -3
- package/dist/codemod/transforms/should-filter.mjs +1 -2
- package/dist/core/index.d.mts +10 -42
- package/dist/core/index.mjs +46 -48
- package/dist/react/index.d.mts +18 -70
- package/dist/react/index.mjs +92 -101
- package/dist/react/styles.css +16 -7
- package/package.json +4 -4
- package/CHANGELOG.md +0 -98
package/dist/react/index.d.mts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
|
|
2
2
|
import { Component, ComponentPropsWithRef, Context, ErrorInfo, ReactNode } from "react";
|
|
3
|
-
//#region src/react/activity.d.ts
|
|
4
3
|
/** Activity mode — maps directly to React's Activity API */
|
|
5
4
|
type ActivityMode = "visible" | "hidden";
|
|
6
5
|
/** Props for the CommandActivity wrapper that controls visibility via React's Activity API. */
|
|
@@ -10,18 +9,16 @@ interface CommandActivityProps {
|
|
|
10
9
|
readonly children: ReactNode;
|
|
11
10
|
}
|
|
12
11
|
/**
|
|
13
|
-
* Wraps content in React
|
|
12
|
+
* Wraps content in React's <Activity> API (React 19.2+).
|
|
14
13
|
* When mode="hidden", the component tree is preserved in memory but not rendered.
|
|
15
14
|
* Falls back to conditional rendering if Activity is unavailable.
|
|
16
15
|
*/
|
|
17
16
|
export declare function CommandActivity({ mode, children }: CommandActivityProps): ReactNode;
|
|
18
|
-
//#endregion
|
|
19
|
-
//#region src/core/search/types.d.ts
|
|
20
17
|
/** Result of scoring a single item against a query */
|
|
21
18
|
interface SearchResult {
|
|
22
19
|
readonly id: ItemId;
|
|
23
20
|
readonly score: number;
|
|
24
|
-
/** Character ranges that matched (for highlighting) — [start, end
|
|
21
|
+
/** Character ranges that matched (for highlighting) — half-open [start, end) tuples, end exclusive */
|
|
25
22
|
readonly matches: ReadonlyArray<readonly [start: number, end: number]>;
|
|
26
23
|
}
|
|
27
24
|
/** Search engine interface — pluggable into the state machine */
|
|
@@ -30,15 +27,13 @@ interface SearchEngine extends Disposable {
|
|
|
30
27
|
index(items: readonly CommandItem$1[]): void;
|
|
31
28
|
/** Search items by query, return ordered results — uses Iterator pipeline */
|
|
32
29
|
search(query: string, items: readonly CommandItem$1[]): IteratorObject<SearchResult>;
|
|
33
|
-
/** Remove items from index
|
|
30
|
+
/** Remove items from index by id */
|
|
34
31
|
remove(ids: ReadonlySet<ItemId>): void;
|
|
35
32
|
/** Clear the entire index */
|
|
36
33
|
clear(): void;
|
|
37
34
|
/** Dispose resources */
|
|
38
35
|
[Symbol.dispose](): void;
|
|
39
36
|
}
|
|
40
|
-
//#endregion
|
|
41
|
-
//#region src/core/types.d.ts
|
|
42
37
|
/**
|
|
43
38
|
* Branded type for command item IDs.
|
|
44
39
|
* Prevents accidental mixing with plain strings at the type level.
|
|
@@ -177,7 +172,7 @@ interface FrecencyStorage extends Disposable {
|
|
|
177
172
|
load(namespace: string): FrecencyData | Promise<FrecencyData>;
|
|
178
173
|
save(namespace: string, data: FrecencyData): void | Promise<void>;
|
|
179
174
|
}
|
|
180
|
-
/** Frecency
|
|
175
|
+
/** Frecency step-weight configuration per recency bucket (hour/day/week/month/older) */
|
|
181
176
|
interface FrecencyDecayConfig {
|
|
182
177
|
readonly hourWeight?: number | undefined;
|
|
183
178
|
readonly dayWeight?: number | undefined;
|
|
@@ -192,7 +187,7 @@ interface FrecencyOptions {
|
|
|
192
187
|
readonly namespace?: string | undefined;
|
|
193
188
|
readonly decayConfig?: FrecencyDecayConfig | undefined;
|
|
194
189
|
}
|
|
195
|
-
/** Options for creating a command machine
|
|
190
|
+
/** Options for creating a command machine */
|
|
196
191
|
interface CommandMachineOptions {
|
|
197
192
|
/** Pre-registered items to populate on creation */
|
|
198
193
|
readonly items?: readonly CommandItem$1[] | undefined;
|
|
@@ -218,11 +213,9 @@ interface CommandMachineOptions {
|
|
|
218
213
|
readonly onSearchChange?: ((query: string) => void) | undefined;
|
|
219
214
|
/** Whether keyboard navigation loops from last to first item (default: true) */
|
|
220
215
|
readonly loop?: boolean | undefined;
|
|
221
|
-
/**
|
|
216
|
+
/** Accepted but not read yet: Command.List uses fixed thresholds (on above 100 matches, off at 50 or fewer) (default: 100) */
|
|
222
217
|
readonly virtualizeThreshold?: number | undefined;
|
|
223
218
|
}
|
|
224
|
-
//#endregion
|
|
225
|
-
//#region src/core/keyboard/parser.d.ts
|
|
226
219
|
/**
|
|
227
220
|
* Structured representation of a keyboard shortcut after parsing.
|
|
228
221
|
* The `normalized` field provides a deterministic string for dedup and comparison.
|
|
@@ -236,8 +229,6 @@ interface ParsedShortcut {
|
|
|
236
229
|
readonly raw: string;
|
|
237
230
|
readonly normalized: string;
|
|
238
231
|
}
|
|
239
|
-
//#endregion
|
|
240
|
-
//#region src/core/keyboard/index.d.ts
|
|
241
232
|
interface ShortcutBinding {
|
|
242
233
|
readonly shortcut: ParsedShortcut;
|
|
243
234
|
readonly itemId: ItemId;
|
|
@@ -246,7 +237,7 @@ interface ShortcutBinding {
|
|
|
246
237
|
/**
|
|
247
238
|
* Manages keyboard shortcut bindings with global keydown listening.
|
|
248
239
|
* Supports `using` for automatic cleanup of both individual bindings and the
|
|
249
|
-
* global document listener. Detects conflicts
|
|
240
|
+
* global document listener. Detects conflicts with the local mapGroupBy helper (core/utils/group-by.ts).
|
|
250
241
|
*/
|
|
251
242
|
declare class KeyboardShortcutRegistry implements Disposable {
|
|
252
243
|
#private;
|
|
@@ -267,8 +258,6 @@ declare class KeyboardShortcutRegistry implements Disposable {
|
|
|
267
258
|
getBindings(): ReadonlyMap<string, ShortcutBinding>;
|
|
268
259
|
[Symbol.dispose](): void;
|
|
269
260
|
}
|
|
270
|
-
//#endregion
|
|
271
|
-
//#region src/core/registry.d.ts
|
|
272
261
|
/**
|
|
273
262
|
* Manages registration and lookup of command items and groups.
|
|
274
263
|
* Uses set operation helpers (union/intersection/difference) for efficient ID operations.
|
|
@@ -322,8 +311,6 @@ declare class CommandRegistry implements Disposable {
|
|
|
322
311
|
clear(): void;
|
|
323
312
|
[Symbol.dispose](): void;
|
|
324
313
|
}
|
|
325
|
-
//#endregion
|
|
326
|
-
//#region src/core/machine.d.ts
|
|
327
314
|
/** Command machine — explicit resource management via `using` */
|
|
328
315
|
interface CommandMachine extends Disposable {
|
|
329
316
|
getState(): CommandState;
|
|
@@ -340,8 +327,6 @@ interface CommandMachine extends Disposable {
|
|
|
340
327
|
getFilteredIdIndex(): ReadonlyMap<ItemId, number>;
|
|
341
328
|
[Symbol.dispose](): void;
|
|
342
329
|
}
|
|
343
|
-
//#endregion
|
|
344
|
-
//#region src/react/async-items.d.ts
|
|
345
330
|
interface CommandAsyncItemsProps {
|
|
346
331
|
/** Promise that resolves to items */
|
|
347
332
|
readonly items: Promise<readonly CommandItem$1[]>;
|
|
@@ -352,13 +337,9 @@ interface CommandAsyncItemsProps {
|
|
|
352
337
|
}
|
|
353
338
|
/** Suspense-based async item loader that resolves a promise of items using React 19 `use()`. */
|
|
354
339
|
export declare function CommandAsyncItems({ items, fallback, children }: CommandAsyncItemsProps): ReactNode;
|
|
355
|
-
//#endregion
|
|
356
|
-
//#region src/react/badge.d.ts
|
|
357
340
|
interface CommandBadgeProps extends ComponentPropsWithRef<"span"> {}
|
|
358
341
|
/** Inline badge for categorization or status indicators on command items. */
|
|
359
342
|
export declare function CommandBadge({ ref, children, ...props }: CommandBadgeProps): ReactNode;
|
|
360
|
-
//#endregion
|
|
361
|
-
//#region src/react/dialog.d.ts
|
|
362
343
|
interface CommandDialogProps extends CommandMachineOptions {
|
|
363
344
|
readonly children?: ReactNode;
|
|
364
345
|
readonly className?: string;
|
|
@@ -374,13 +355,9 @@ interface CommandDialogProps extends CommandMachineOptions {
|
|
|
374
355
|
}
|
|
375
356
|
/** Dialog variant that wraps the command palette in a Radix UI Dialog with focus trap and overlay. */
|
|
376
357
|
export declare function CommandDialog({ children, className, overlayClassName, contentClassName, label, description, open: controlledOpen, onOpenChange, container, ...machineOptions }: CommandDialogProps): ReactNode;
|
|
377
|
-
//#endregion
|
|
378
|
-
//#region src/react/empty.d.ts
|
|
379
358
|
interface CommandEmptyProps extends ComponentPropsWithRef<"div"> {}
|
|
380
359
|
/** Rendered when no items match the current search query. */
|
|
381
360
|
export declare function CommandEmpty({ ref, children, ...props }: CommandEmptyProps): ReactNode;
|
|
382
|
-
//#endregion
|
|
383
|
-
//#region src/react/group.d.ts
|
|
384
361
|
interface CommandGroupProps extends ComponentPropsWithRef<"div"> {
|
|
385
362
|
/** Heading text displayed above the group */
|
|
386
363
|
readonly heading?: string;
|
|
@@ -391,27 +368,21 @@ interface CommandGroupProps extends ComponentPropsWithRef<"div"> {
|
|
|
391
368
|
}
|
|
392
369
|
/** Visual grouping container with an optional heading that hides when no items match. */
|
|
393
370
|
export declare function CommandGroup({ ref, children, heading, priority, forceId, ...props }: CommandGroupProps): ReactNode;
|
|
394
|
-
//#endregion
|
|
395
|
-
//#region src/react/highlight.d.ts
|
|
396
371
|
interface CommandHighlightProps {
|
|
397
372
|
/** The full text to display */
|
|
398
373
|
readonly text: string;
|
|
399
|
-
/** Match ranges from search scorer — [start, end
|
|
374
|
+
/** Match ranges from the search scorer — half-open [start, end) tuples, end exclusive */
|
|
400
375
|
readonly ranges: ReadonlyArray<readonly [start: number, end: number]>;
|
|
401
376
|
/** Custom className for highlighted segments */
|
|
402
377
|
readonly highlightClassName?: string;
|
|
403
378
|
}
|
|
404
379
|
/** Renders search match highlighting by splitting text at scored match ranges. */
|
|
405
380
|
export declare function CommandHighlight({ text, ranges, highlightClassName }: CommandHighlightProps): ReactNode;
|
|
406
|
-
//#endregion
|
|
407
|
-
//#region src/react/input.d.ts
|
|
408
381
|
interface CommandInputProps extends Omit<ComponentPropsWithRef<"input">, "value" | "onChange" | "type" | "role"> {
|
|
409
382
|
readonly onValueChange?: (value: string) => void;
|
|
410
383
|
}
|
|
411
384
|
/** Combobox input that drives the command palette search state. */
|
|
412
385
|
export declare function CommandInput({ ref, placeholder, onValueChange, ...props }: CommandInputProps): ReactNode;
|
|
413
|
-
//#endregion
|
|
414
|
-
//#region src/react/item.d.ts
|
|
415
386
|
interface CommandItemProps extends Omit<ComponentPropsWithRef<"div">, "onSelect" | "value"> {
|
|
416
387
|
readonly value: string;
|
|
417
388
|
readonly keywords?: readonly string[];
|
|
@@ -422,8 +393,6 @@ interface CommandItemProps extends Omit<ComponentPropsWithRef<"div">, "onSelect"
|
|
|
422
393
|
}
|
|
423
394
|
/** Individual selectable item in the command list with keyboard and pointer activation. */
|
|
424
395
|
export declare function CommandItem({ ref, children, value, keywords, onSelect, disabled, shortcut, forceId, ...props }: CommandItemProps): ReactNode;
|
|
425
|
-
//#endregion
|
|
426
|
-
//#region src/react/list.d.ts
|
|
427
396
|
interface CommandListProps extends ComponentPropsWithRef<"div"> {
|
|
428
397
|
/** Override automatic virtualization (default: auto at >100 items, false to opt-out) */
|
|
429
398
|
readonly virtualize?: boolean;
|
|
@@ -436,16 +405,12 @@ interface CommandListProps extends ComponentPropsWithRef<"div"> {
|
|
|
436
405
|
}
|
|
437
406
|
/** Scrollable list container with auto-virtualization and aria-live announcements. */
|
|
438
407
|
export declare function CommandList({ ref, children, virtualize, estimateSize, overscan, announceResults, style, ...props }: CommandListProps): ReactNode;
|
|
439
|
-
//#endregion
|
|
440
|
-
//#region src/react/loading.d.ts
|
|
441
408
|
interface CommandLoadingProps extends ComponentPropsWithRef<"div"> {
|
|
442
409
|
/** Override the loading state detection */
|
|
443
410
|
readonly loading?: boolean;
|
|
444
411
|
}
|
|
445
412
|
/** Shown during async operations, with configurable loading state override. */
|
|
446
413
|
export declare function CommandLoading({ ref, children, loading: loadingOverride, ...props }: CommandLoadingProps): ReactNode;
|
|
447
|
-
//#endregion
|
|
448
|
-
//#region src/react/page.d.ts
|
|
449
414
|
/** Branded page identifier */
|
|
450
415
|
type CommandPageId = string & {
|
|
451
416
|
readonly __brand: "CommandPageId";
|
|
@@ -457,21 +422,15 @@ interface CommandPageProps {
|
|
|
457
422
|
}
|
|
458
423
|
/** Page navigation container that only renders when its ID matches the active page. */
|
|
459
424
|
export declare function CommandPage({ id, children }: CommandPageProps): ReactNode;
|
|
460
|
-
//#endregion
|
|
461
|
-
//#region src/react/separator.d.ts
|
|
462
425
|
interface CommandSeparatorProps extends ComponentPropsWithRef<"div"> {}
|
|
463
426
|
/** Visual divider between items or groups, rendered as a presentational element. */
|
|
464
427
|
export declare function CommandSeparator({ ref, ...props }: CommandSeparatorProps): ReactNode;
|
|
465
|
-
//#endregion
|
|
466
|
-
//#region src/react/shortcut.d.ts
|
|
467
428
|
interface CommandShortcutProps extends ComponentPropsWithRef<"kbd"> {
|
|
468
429
|
/** Shortcut string to display (e.g., "Mod+K"). If not provided, reads from nearest Command.Item. */
|
|
469
430
|
readonly shortcut?: string;
|
|
470
431
|
}
|
|
471
432
|
/** Keyboard shortcut display with platform-aware formatting (e.g., Cmd vs Ctrl). */
|
|
472
433
|
export declare function CommandShortcut({ ref, shortcut, children, ...props }: CommandShortcutProps): ReactNode;
|
|
473
|
-
//#endregion
|
|
474
|
-
//#region src/react/command.d.ts
|
|
475
434
|
interface CommandRootProps extends CommandMachineOptions {
|
|
476
435
|
readonly children?: ReactNode;
|
|
477
436
|
readonly className?: string;
|
|
@@ -496,8 +455,6 @@ export declare const Command: typeof CommandRoot & {
|
|
|
496
455
|
readonly AsyncItems: typeof CommandAsyncItems;
|
|
497
456
|
readonly Activity: typeof CommandActivity;
|
|
498
457
|
};
|
|
499
|
-
//#endregion
|
|
500
|
-
//#region src/react/context.d.ts
|
|
501
458
|
/** Branded newtype for the root instance ID */
|
|
502
459
|
type CommandRootId = string & {
|
|
503
460
|
readonly __brand: "CommandRootId";
|
|
@@ -506,6 +463,7 @@ type CommandRootId = string & {
|
|
|
506
463
|
interface CommandContextValue {
|
|
507
464
|
readonly machine: CommandMachine;
|
|
508
465
|
readonly state: CommandState;
|
|
466
|
+
/** True while an optimistic active-item transition is in flight (search updates never set it). */
|
|
509
467
|
readonly isPending: boolean;
|
|
510
468
|
readonly updateSearch: (query: string) => void;
|
|
511
469
|
readonly setOptimisticActiveId: (id: ItemId | null) => void;
|
|
@@ -533,6 +491,7 @@ interface CommandStableContextValue {
|
|
|
533
491
|
/** State context — values that change on every search/navigation */
|
|
534
492
|
interface CommandStateContextValue {
|
|
535
493
|
readonly state: CommandState;
|
|
494
|
+
/** True while an optimistic active-item transition is in flight (search updates never set it). */
|
|
536
495
|
readonly isPending: boolean;
|
|
537
496
|
readonly filteredIdSet: ReadonlySet<ItemId>;
|
|
538
497
|
/** IDs currently visible in virtual viewport + overscan. null = not virtualizing (render all filtered). */
|
|
@@ -546,8 +505,6 @@ interface CommandGroupContextValue {
|
|
|
546
505
|
readonly groupId: string;
|
|
547
506
|
readonly headingId: string;
|
|
548
507
|
}
|
|
549
|
-
//#endregion
|
|
550
|
-
//#region src/react/error-boundary.d.ts
|
|
551
508
|
interface CommandErrorBoundaryProps {
|
|
552
509
|
readonly children: ReactNode;
|
|
553
510
|
readonly fallback?: ReactNode | ((error: Error) => ReactNode);
|
|
@@ -563,46 +520,40 @@ export declare class CommandErrorBoundary extends Component<CommandErrorBoundary
|
|
|
563
520
|
override componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
|
|
564
521
|
override render(): ReactNode;
|
|
565
522
|
}
|
|
566
|
-
//#endregion
|
|
567
|
-
//#region src/react/hooks/use-command.d.ts
|
|
568
523
|
interface UseCommandReturn {
|
|
569
524
|
readonly state: CommandState;
|
|
525
|
+
/** True while an optimistic active-item transition is in flight. Search updates never set it: the machine applies them on its own scheduler tick, outside React. */
|
|
570
526
|
readonly isPending: boolean;
|
|
527
|
+
/** Queue a search query on the machine. Not a React update: Command.Input owns the urgent input value. */
|
|
571
528
|
readonly updateSearch: (query: string) => void;
|
|
572
529
|
readonly setOptimisticActiveId: (id: ItemId | null) => void;
|
|
573
530
|
/** O(1) membership set for filtered items — used by Item component */
|
|
574
531
|
readonly filteredIdSet: ReadonlySet<ItemId>;
|
|
575
532
|
readonly id: CommandRootId;
|
|
576
533
|
}
|
|
577
|
-
/** Core hook that binds a CommandMachine to React via useSyncExternalStore,
|
|
534
|
+
/** Core hook that binds a CommandMachine to React via useSyncExternalStore, useOptimistic, and a transition for optimistic active-item updates. */
|
|
578
535
|
export declare function useCommand(machine: CommandMachine): UseCommandReturn;
|
|
579
|
-
//#endregion
|
|
580
|
-
//#region src/react/hooks/use-command-state.d.ts
|
|
581
536
|
/** Get the full command state with proper subscription */
|
|
582
537
|
export declare function useCommandState(): CommandState;
|
|
583
538
|
/** Get a selected slice of command state — only re-renders when selected value changes */
|
|
584
539
|
export declare function useCommandState<T>(selector: (state: CommandState) => T): T;
|
|
585
|
-
//#endregion
|
|
586
|
-
//#region src/react/hooks/use-devtools.d.ts
|
|
587
540
|
/**
|
|
588
541
|
* Exposes command palette internals to browser devtools.
|
|
589
|
-
*
|
|
542
|
+
* Development only: the effect is gated on `process.env.NODE_ENV` and returns early in
|
|
543
|
+
* production builds (the hook itself still ships). Call it from a component rendered inside
|
|
544
|
+
* `<Command>`: outside one there is no machine to inspect and the hook does nothing.
|
|
590
545
|
*
|
|
591
546
|
* @example
|
|
592
547
|
* ```tsx
|
|
593
|
-
* function
|
|
548
|
+
* function DevtoolsBridge() {
|
|
594
549
|
* useCommandDevtools('main');
|
|
595
|
-
* return
|
|
550
|
+
* return null;
|
|
596
551
|
* }
|
|
597
552
|
* ```
|
|
598
553
|
*/
|
|
599
554
|
export declare function useCommandDevtools(label?: string): void;
|
|
600
|
-
//#endregion
|
|
601
|
-
//#region src/react/hooks/use-keyboard.d.ts
|
|
602
555
|
/** Create a keydown handler for command palette keyboard navigation */
|
|
603
556
|
export declare function createKeydownHandler(machine: CommandMachine, getState: () => CommandState): (event: KeyboardEvent) => void;
|
|
604
|
-
//#endregion
|
|
605
|
-
//#region src/react/hooks/use-register.d.ts
|
|
606
557
|
/** Options for item registration */
|
|
607
558
|
interface RegisterItemOptions {
|
|
608
559
|
readonly keywords?: readonly string[];
|
|
@@ -622,8 +573,6 @@ interface RegisterGroupOptions {
|
|
|
622
573
|
}
|
|
623
574
|
/** Register a command group with the machine — auto-deregisters on unmount */
|
|
624
575
|
export declare function useRegisterGroup(heading?: string, options?: RegisterGroupOptions): GroupId;
|
|
625
|
-
//#endregion
|
|
626
|
-
//#region src/react/hooks/use-virtualizer.d.ts
|
|
627
576
|
interface VirtualizerOptions {
|
|
628
577
|
readonly count: number;
|
|
629
578
|
readonly estimateSize: number;
|
|
@@ -645,5 +594,4 @@ interface VirtualizerReturn {
|
|
|
645
594
|
}
|
|
646
595
|
/** Lightweight virtualizer for large item lists using ResizeObserver and scroll tracking. */
|
|
647
596
|
export declare function useVirtualizer(options: VirtualizerOptions): VirtualizerReturn;
|
|
648
|
-
//#endregion
|
|
649
597
|
export type { ActivityMode, CommandActivityProps, CommandAsyncItemsProps, CommandBadgeProps, CommandContextValue, CommandDialogProps, CommandEmptyProps, CommandErrorBoundaryProps, CommandGroupContextValue, CommandGroupProps, CommandHighlightProps, CommandInputProps, CommandItemProps, CommandListProps, CommandLoadingProps, CommandPageId, CommandPageProps, CommandRootId, CommandRootProps, CommandSeparatorProps, CommandShortcutProps, CommandStableContextValue, CommandStateContextValue, RegisterGroupOptions, RegisterItemOptions, UseCommandReturn, VirtualItem, VirtualizerOptions, VirtualizerReturn };
|