FxEditorMasthead

Type: React component

How to get FxEditorMasthead?

JavaScript

import FxEditorMasthead from 'fontoxml-fx/src/FxEditorMasthead.jsx'

The main component to configure a masthead with. Use this component to register the toolbar tabs.

The FxEditorMasthead component comes with a few cool feaures, such as being able to show/hide/highlight tabs basd on the cursor position (see also the isHighlightedTabQuery and isVisibleTabQuery properties of objects passed to the tabs, and automatic compatibility with use-embedded-mode.

The FxEditorMasthead component is really just a convenient wrapper around a number of FDS masthead components. This means that you can alternatively create your own masthead component when needed.

Props

  1. clientLogo

    (Optional)

    Type: React element

    Use this to show a custom logo in the top right corner of the masthead.

    Default value

  2. mastheadAlignRightContent

    (Optional)

    Type: React element

    Use this to place a React component in the right-hand side of the masthead. The component is visible for every toolbar in the masthead.

    Default value

  3. tabs

    (Required)

    Type: Object

    Properties

  4. showFontoLogo

    (Optional)

    Type: Boolean

    Determines if the fontoxml logo will be shown in the top left corner of the masthead.

    Default value

  5. quickAccessButtons

    (Optional)

    Type: React element

    Use this to add buttons in the top left corner of the masthead next to the Fonto logo. For example a Button or FxOperationButton.

    Default value