Reference

CBlockNoteView

type Props = {
  /** Main properties for the BlockNote editor */
  editorProps: Omit<
    BlockNoteViewWrapperProps,
    "content" | "linkEditionCtx" | "macroAstToReactJsxConverter" | "macros"
  >;

  /** Set to `false` to disable macros entirely */
  macros:
    | {
        list: MacroWithUnknownParamsType[];
        ctx: ContextForMacros;
      }
    | false;

  /** Content to initialize the editor with */
  editorContent: UniAst | Error;

  /** Collaboration initialization method */
  collaborationProvider?: () => CollaborationInitializer;

  /** InversifyJS container to inject dependencies from */
  container: Container;
};

/**
 * Properties for the BlockNote editor component.
 *
 * @since 0.16
 * @beta
 */
type BlockNoteViewWrapperProps = {
  /**
   * Options to forward to the BlockNote editor
   */
  blockNoteOptions?: Partial<
    Omit<DefaultBlockNoteEditorOptions, "schema" | "collaboration">
  >;

  /**
   * The display theme to use
   */
  theme?: "light" | "dark";

  /**
   * The editor's language
   */
  lang: EditorLanguage;

  /**
   * The editor's initial content
   * If realtime is enabled, this content may be replaced by the other users' own editor content
   */
  content: BlockType[];

  /**
   * Macros to show in the editor
   *
   * @since 18.0.0RC1
   * @beta
   */
  macros:
    | {
        /**
         * List of buildable macros
         *
         * @since 18.0.0RC1
         * @beta
         */
        list: MacroWithUnknownParamsType[];

        /**
         * Context for macros
         *
         * @since 18.0.0RC1
         * @beta
         */
        ctx: ContextForMacros;
      }
    | false;

  /**
   * Realtime options
   */
  realtime?: {
    collaborationProvider: () => CollaborationInitializer;
    user: { name: string; color: string };
  };

  /**
   * Run a function when the document's content change
   * WARN: this function may be fired at a rapid rate if the user types rapidly. Debouncing may be required on your end.
   */
  onChange?: (editor: EditorType) => void;

  /**
   * Link edition utilities
   */
  linkEditionCtx: LinkEditionContext;

  /**
   * Overrides for default behavior
   *
   * @since 0.26
   */
  overrides?: {
    /**
     * Intercept image edition mechanism (i.e. clicking on the edition icon in images' toolbar)
     */
    imageEdition?: ImageEditionOverrideFn;
  };

  /**
   * Make the wrapper forward some data through references
   */
  refs?: {
    setEditor?: (editor: EditorType) => void;
  };
};

Vue Events

{
  // Emitted as soon as a user-triggered change happens into the editor
  // The event won't be triggered when the editor is filled with its initial content,
  // or when the editor's content changes due to modifications made by other players in the realtime session
  "instant-change": [];

  // Emitted in the same context as "instant-change", but debounced
  "debounced-change": [content: UniAst];
}

Vue Expose

{
  // Get the editor's content
  getContent(): UniAst | Error
}

Related

Cristal Blocknote Headless