Inline Composition

Inline Editor has no preset layer. The default toolbar is comment-like:

{
  undoRedo: true,
  textFormat: true,
  link: true,
}

For detailed control, pass toolbar.

vue

<YanivInlineEditor
  v-model:content="html"
  mode="edit"
  :toolbar="{ undoRedo: true, textFormat: true, link: true, list: true }"
/>

The toolbar config is also the ability source for Inline Editor extension registration. For example, toolbar.link !== true means the link button is hidden and the link extension is not registered.

You can also build your own inline shell:

import { buildExtensions, resolveInlineGates, CAPABILITIES } from "@yanivjs/yaniv-editor/inline";

const toolbar = { undoRedo: true, textFormat: true, link: true };
const gates = resolveInlineGates(toolbar, CAPABILITIES);

const extensions = await buildExtensions("inline", {
  gates,
  locale: {
    /* resolved locale messages */
  },
  isEditable: () => true,
});

buildExtensions and resolveInlineGates are the single source of truth for Inline extension registration. Do not use the removed buildInlineExtensions or resolveInlineExtensionGates APIs.

Inline Composition ​

Inline Composition