OptionalclassUseful to set a custom CSS class name on the item.
For default document editor toolbar items the className is appended to the default
item ones.
OptionaldisabledWhether the item is disabled or not.
The property can be used to force a default item to be
disabled by setting it to true.
OptionaliconIcon for the item.
The icon should either be an URL, a base64 encoded image or the HTML for an inline SVG. This property can override the default items' ones.
OptionalidUnique identifier for the item.
This is useful to identify items whose type is custom.
// In your JavaScript
const documentEditorToolbarItems = NutrientViewer.defaultDocumentEditorToolbarItems
documentEditorToolbarItems.push({ type: 'custom', id: 'my-button', ... })
NutrientViewer.load({
...otherOptions,
documentEditorToolbarItems
});
Note: It is ***not*** possible to override this option for built-in document editor toolbar items.
OptionalnodeOptionally custom tool items can define a DOM node.
NutrientViewer renders this node instead of a standard tool button.
In this case the tool item is rendered inside of a container
which gets the title and className attributes set.
The icon property is ignored.
The selected and disabled are used just to toggle the
PSPDFKit-Tool-Node-active and PSPDFKit-Tool-Node-disabled
class names but making the node effectively selected or disabled is up to
the implementation of the item.
The onPress event is registered and fires any time the item is either clicked
or selected with keyboard (if part of a dropdownGroup).
OptionalonOptionalselectedWhether a custom item is selected or not.
The selected status of default items cannot be altered.
Note: It is not possible to override this option for built-in document editor toolbar items.
OptionaltitleTitle for the tool items.
It is shown on hover or when the item doesn't have an icon.
Describes the properties of a Document Editor Toolbar Item.
Check out our guides for more examples.
See
Replace With
export interface DocumentEditorToolbarItem extends DocumentEditorBuiltinToolbarItem, DocumentEditorCustomToolbarItem { type: BuiltInDocumentEditorToolbarItemType | 'custom' }