Skip to content

Vizel API / core/src / VizelCommand

Interface: VizelCommand ​

Defined in: packages/core/src/commands/types.ts:81

Unified runtime-bearing command shared across editor surfaces.

A single VizelCommand defines one user action for the slash item, toolbar action, bubble menu action, block menu action, and shortcut binding at once. Surface-specific builders (buildVizelSlashMenuSpecFromCommands, buildVizelToolbarSpec, buildVizelBubbleMenuSpec, buildVizelBlockMenuSpecFromCommands) consume VizelCommand[] and derive the matching spec shapes; registerVizelShortcuts consumes the same list to wire keyboard bindings.

Example ​

ts
const boldCommand: VizelCommand = {
  id: "format/bold",
  label: (locale) => locale.toolbar.bold,
  icon: "bold",
  shortcut: { mac: "Mod-B", other: "Mod-B" },
  canRun: (editor) => editor.can().toggleBold(),
  isActive: (editor) => editor.isActive("bold"),
  run: (editor) => editor.chain().focus().toggleBold().run(),
  surfaces: {
    toolbar: { priority: 10 },
    bubbleMenu: { priority: 10 },
    shortcut: true,
  },
};

Properties ​

canRun ​

ts
readonly canRun: (editor) => boolean;

Defined in: packages/core/src/commands/types.ts:97

Whether the command can currently run against the editor.

Parameters ​

ParameterType
editorEditor

Returns ​

boolean


description? ​

ts
readonly optional description?: (locale) => string;

Defined in: packages/core/src/commands/types.ts:87

Optional secondary line (slash menu description, tooltip hint).

Parameters ​

ParameterType
localeVizelLocale

Returns ​

string


group? ​

ts
readonly optional group?: string;

Defined in: packages/core/src/commands/types.ts:91

Group key for slash menu sections and other categorized surfaces.


icon? ​

ts
readonly optional icon?: VizelIconName;

Defined in: packages/core/src/commands/types.ts:89

Optional icon identifier resolved by the icon catalog.


id ​

ts
readonly id: string;

Defined in: packages/core/src/commands/types.ts:83

Stable identifier shared across surfaces (e.g. "format/bold").


isActive? ​

ts
readonly optional isActive?: (editor) => boolean;

Defined in: packages/core/src/commands/types.ts:99

Whether the command's mark / node is currently active at the selection.

Parameters ​

ParameterType
editorEditor

Returns ​

boolean


keywords? ​

ts
readonly optional keywords?: readonly string[];

Defined in: packages/core/src/commands/types.ts:93

Fuzzy-match keywords used by slash menu filtering.


label ​

ts
readonly label: (locale) => string;

Defined in: packages/core/src/commands/types.ts:85

Localized display label.

Parameters ​

ParameterType
localeVizelLocale

Returns ​

string


run ​

ts
readonly run: (editor) => boolean;

Defined in: packages/core/src/commands/types.ts:101

Execute the command. Returns whether the command applied.

Parameters ​

ParameterType
editorEditor

Returns ​

boolean


shortcut? ​

ts
readonly optional shortcut?: VizelShortcut;

Defined in: packages/core/src/commands/types.ts:95

Optional keyboard shortcut. Bound only when surfaces.shortcut === true.


surfaces ​

ts
readonly surfaces: VizelCommandSurfaceSet;

Defined in: packages/core/src/commands/types.ts:103

Surfaces the command appears on.

Released under the MIT License.