Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface ContextMenuItem<TString, TContext>

Represent a context menu item

Type parameters

  • TString: string

  • TContext = never

Hierarchy

  • ContextMenuItem

Index

Properties

Properties

Optional commandBarSubMenuProperties

commandBarSubMenuProperties: Partial<IContextualMenuProps>

Use this property to pass in Fluent UI ContextMenu property directly. It will overwrite the values of other conflict properties

Optional getSelectedId

getSelectedId: (editor: IEditor, targetNode: Node) => TString

Type declaration

    • (editor: IEditor, targetNode: Node): TString

    • A callback function to verify which subitem ID should have a checkmark

      Parameters

      • editor: IEditor

        The editor object that triggers this event

      • targetNode: Node

        The node that user is clicking onto

      Returns TString

      ID to be shown as selected, null for none

Optional iconProps

iconProps: IIconProps

Icon props for the context menu item

Optional itemClassName

itemClassName: string

CSS class name for drop down menu item

Optional itemRender

itemRender: (item: IContextualMenuItem, onClick: (e: MouseEvent<Element, MouseEvent> | KeyboardEvent<Element>, item: IContextualMenuItem) => void) => ReactNode

Type declaration

    • (item: IContextualMenuItem, onClick: (e: MouseEvent<Element, MouseEvent> | KeyboardEvent<Element>, item: IContextualMenuItem) => void): ReactNode

    • Custom render of drop down item

      Parameters

      • item: IContextualMenuItem

        This menu item

      • onClick: (e: MouseEvent<Element, MouseEvent> | KeyboardEvent<Element>, item: IContextualMenuItem) => void

        click handler of this menu item

          • (e: MouseEvent<Element, MouseEvent> | KeyboardEvent<Element>, item: IContextualMenuItem): void

          • Parameters

            • e: MouseEvent<Element, MouseEvent> | KeyboardEvent<Element>
            • item: IContextualMenuItem

            Returns void

      Returns ReactNode

key

key: TString

key of this button, needs to be unique

onClick

onClick: (key: TString, editor: IEditor, targetNode: Node, strings: LocalizedStrings<TString, string>, uiUtilities: UIUtilities, context?: TContext) => void

Type declaration

    • Click event handler

      Parameters

      • key: TString

        Key of the menu item that is clicked

      • editor: IEditor

        The editor object that triggers this event

      • targetNode: Node

        The node that user is clicking onto

      • strings: LocalizedStrings<TString, string>

        The strings object used by getLocalizedString() function

      • uiUtilities: UIUtilities

        UI Utilities to help render additional react component from this click event

      • Optional context: TContext

        A context object that passed in from context menu provider, can be anything

      Returns void

Optional shouldShow

shouldShow: (editor: IEditor, targetNode: Node, context?: TContext) => boolean

Type declaration

    • (editor: IEditor, targetNode: Node, context?: TContext): boolean

    • A callback function to check whether this menu item should show now

      Parameters

      • editor: IEditor

        The editor object that triggers this event

      • targetNode: Node

        The node that user is clicking onto

      • Optional context: TContext

        A context object that passed in from context menu provider, can be anything

      Returns boolean

Optional subItems

subItems: {[ key in string]: string }

A key-value map for sub menu items, key is the key of menu item, value is unlocalized string When click on a child item, onClick handler will be triggered with the key of the clicked child item passed in as the second parameter

unlocalizedText

unlocalizedText: string

Text of the button. This text is not localized. To show a localized text, pass a dictionary to Ribbon component via RibbonProps.strings.

Generated using TypeDoc