Function: ConditionalContents

ConditionalContents(props, context?): ReactNode

A toolbar primitive that allows you to show different contents based on the editor that is in focus. Useful for code editors that have different features and don't support rich text formatting.

Parameters

NameTypeDescription
propsObject-
props.options(ConditionalContentsOption | FallbackOption)[]A set of options that define the contents to show based on the editor that is in focus. Can be either a ConditionalContentsOption or a FallbackOption. See the ConditionalContents documentation for an example.
context?any-

Returns

ReactNode

Example

   <ConditionalContents
     options={[
       { when: (editor) => editor?.editorType === 'codeblock', contents: () => <ChangeCodeMirrorLanguage /> },
       { when: (editor) => editor?.editorType === 'sandpack', contents: () => <ShowSandpackInfo /> },
       {
         fallback: () => (
           <>
             <UndoRedo />
             <BoldItalicUnderlineToggles />
             <InsertCodeBlock />
           </>
         )
       }
     ]}
   />