Addons

Structure

Addons are used to attach controls together.

  • <Addons>
    • <Addon>

To define addon location you have to set the AddonType attribute:

  • .Start will place addon on the left side.
  • .Body will place it in the middle.
  • .End will place it at the right side.

Static addon

<Addons>
    <Addon AddonType="AddonType.Start">
        <AddonLabel>@@</AddonLabel>
    </Addon>
    <Addon AddonType="AddonType.Body">
        <TextEdit Placeholder="Username" />
    </Addon>
</Addons>

With multiple addons

Addons are used to attach controls together.

<Addons>
    <Addon AddonType="AddonType.Start">
        <AddonLabel>Start</AddonLabel>
    </Addon>
    <Addon AddonType="AddonType.Body">
        <TextEdit Placeholder="Placeholder" />
    </Addon>
    <Addon AddonType="AddonType.End">
        <AddonLabel>End</AddonLabel>
    </Addon>
</Addons>

Button addon

<Addons>
    <Addon AddonType="AddonType.Body">
        <TextEdit Placeholder="Recipient's username" />
    </Addon>
    <Addon AddonType="AddonType.End">
        <Button Color="Color.Secondary">Button</Button>
    </Addon>
</Addons>

<Addons>
    <Addon AddonType="AddonType.Start">
        <Dropdown>
            <DropdownToggle Color="Color.Primary">Dropdown</DropdownToggle>
            <DropdownMenu>
                <DropdownItem>Action</DropdownItem>
                <DropdownItem>Another action</DropdownItem>
                <DropdownItem>Something else here</DropdownItem>
                <DropdownDivider />
                <DropdownItem>Separated link</DropdownItem>
            </DropdownMenu>
        </Dropdown>
    </Addon>
    <Addon AddonType="AddonType.Body">
        <TextEdit />
    </Addon>
</Addons>

Attributes

Addons

Name Type Default Description
Size Size None Addons size variations.

Addon

Name Type Default Description
AddonType AddonType Body Defines the location and behavior of addon container.