Typed commands

I’d like to add to #1412 and #1511 to propose a type-safe approach.

Problem:

Commands are currently heavily error-prone:

1. You can misspell the type and it will silently never trigger in your app
2. You can misinterpret the types

Part of this problem is caused by the ability to listen to multiple commands at once.

Proposal

Encourage type safety within Lexical core and user-created commands. Make it so that you can only listen to a specific command at once and this command is strictly type safe and provided by Lexical core.

execCommand<T>(type: Command<T>, payload: T): void;
registerCommand<T>(type: Command<T>, payload: (T) => void): void;

class Command<T> {
  type: string;
  constructor(type: string) {
    this.type = type;
  }
}
const formatTextCommand = new Command<string>('formatText');
new LexicalEditor().execCommand(formatTextCommand, 'bold');
new LexicalEditor().registerCommand(formatTextCommand, (format) => {
  // bold
});

The generic type above, while seemingly unused, enables us to offer type safety for the payload.

[Optionally] We can do like transforms where we check for the command reference to ensure that we’re strictly referring to the same command, in which case we don’t even need the type.

class Command<T> {}
const formatTextCommand = new Command<string>();

Trade-offs

(+) It’s type safe (-) It’s more costly, we have to provide an instance for every single command (-) It more verbose, especially for some Lexical core/React. For most internal/real-life usages it should be equivalent though.

[trueadm]

We can’t use enums unfortunately, open source Lexical should work without them (we strip out types) and also I couldn’t get Flow enums working at all!

[amyworrall]

On iOS we do this:

public struct CommandType: RawRepresentable {
  public var rawValue: String
  public init(rawValue: String) {
    self.rawValue = rawValue
  }
  static let selectionChange = CommandType(rawValue: "selectionChange")
  static let click = CommandType(rawValue: "click")
  static let deleteCharacter = CommandType(rawValue: "deleteCharacter")
  static let insertLineBreak = CommandType(rawValue: "insertLineBreak")
  static let insertParagraph = CommandType(rawValue: "insertParagraph")
  ...
}

Then anyone can add their own commands by doing:

extension struct CommandType {
  static let myCommand = CommandType(rawValue: "myCommand")
}

and to use them, the type is CommandType, and the IDE will happily autocomplete .deleteCharacter or whatever.