alfresco-ng2-components/docs/core/info-drawer.component.md
Andy Stark 2a5fe7ad28 [ADF-2596] Fixed inputs with incorrect names (#3166)
* [ADF-2596] Updated prop script to handle names from input decorators

* [ADF-2596] Fixed inputs with accessors

* [ADF-2596] Fixed remaining inputs with wrong names

* [ADF-2596] Updated prop script to handle names from input decorators

* [ADF-2596] Fixed inputs with accessors

* [ADF-2596] Fixed remaining inputs with wrong names
2018-04-10 17:19:15 +01:00

1.5 KiB

Added, Status, Last reviewed
Added Status Last reviewed
v2.0.0 Active 2018-04-10

Info Drawer component

Displays a sidebar-style information panel with tabs.

Info drawer screenshot

Basic usage

<adf-info-drawer title="Activities" (currentTab)="getActiveTab($event)">
    <div info-drawer-buttons>
        <mat-icon (click)="close()">clear</mat-icon>
    </div>

    <adf-info-drawer-tab label="Activity">
        <mycomponent1></mycomponent1>
        <mycomponent2></mycomponent2>
    </adf-info-drawer-tab>

    <adf-info-drawer-tab label="Details">
        <mycomponent3></mycomponent3>
    </adf-info-drawer-tab>

</adf-info-drawer>

Class members

Properties

Name Type Default value Description
selectedIndex number 0 The selected index tab.
title `string null` null

Events

Name Type Description
currentTab EventEmitter<number> Emitted when the currently active tab changes.

Details

This is a variant of the Info Drawer Layout component that displays information in tabs. You can use the adf-info-drawer-tab subcomponent to add tabs (as shown in the example) and the currentTab output property to select the currently active tab.

You can also customize the three regions (title, buttons and content) as with the Info Drawer Layout component.

See also