@logo-software/card-button-group
Version:
Buttond Card Group library is a part of Logo Elements Design System which allows developers to group their buttons for charts and graphs.
54 lines (53 loc) • 1.53 kB
TypeScript
import { OnInit, EventEmitter } from '@angular/core';
/**
* Card Button Group is a button container for single or multiple buttons that includes image/icon, title and subtitle. It allows you to group your buttons and allows you to make a highlight animation for selected card.
* Add the below code to your code stack and give initializer parameters.
*
* * <sub>app.component.ts</sub>
*
* ```html
* <logo-card-button-group [buttons]="CardButtonData" ></logo-card-button-group>
* ```
*/
/**
* Data set for card-buttons.
*/
export interface CardButtonData {
/**
* main title of card-button.
*/
name: string;
/**
* id of card-button.
*/
id: string;
/**
* isSelected default value is false. You can change by editing into click function.
*/
isSelected?: boolean;
/**
* add icon as for example 'le-search' and logo elements icon will occur.
*/
icon?: string;
/**
* give path of image. Default width of the image is 50px.
*/
image?: string;
/**
* subtitle of card-button.
*/
subtitle?: string;
}
export declare class CardButtonGroupComponent implements OnInit {
/**
* data set for buttons. Add your list to component.ts file and give that lists name to [buttons] as an input.
*/
buttons: CardButtonData[];
/**
* function that will run when you click the button.
*/
onButtonClick: EventEmitter<string>;
constructor();
ngOnInit(): void;
buttonClicked(data: string): void;
}