Configuration for a single alternate control button.

AltButton

interface AltButton {
    name?: string;
    icon?: string;
    alternateIcon?: string;
    onPress?: (() => void);
    backgroundColor?: {
        default?: string;
        pressed?: string;
    };
    active?: boolean;
    alternateIconComponent?: Element;
    iconComponent?: Element;
    customComponent?: Element;
    color?: string;
    inActiveColor?: string;
    show?: boolean;
}

Properties

name?: string

Button label/name

icon?: string

Icon name (FontAwesome5)

alternateIcon?: string

Alternate icon name (shown when active)

onPress?: (() => void)

Click handler

backgroundColor?: {
    default?: string;
    pressed?: string;
}

Background colors with default and pressed states

active?: boolean

Whether button is in active state

alternateIconComponent?: Element

Custom alternate icon component

iconComponent?: Element

Custom icon component

customComponent?: Element

Completely custom button component

color?: string

Icon color

inActiveColor?: string

Icon color when inactive

show?: boolean

Whether to show the button