@scania/tegel
Version:
Tegel Design System
54 lines (53 loc) • 1.83 kB
TypeScript
import { EventEmitter } from '../../stencil-public-runtime';
/**
* @slot header - Slot for the Card header.
* @slot subheader - Slot for the Card subheader.
* @slot thumbnail - Slot for the Card thumbnail.
* @slot body - Slot for the body section of the Card.
* @slot body-image - Slot for the body section of the Card, used for image.
* @slot actions - Slot for the bottom section of the Card, used for buttons .
*/
export declare class TdsCard {
host: HTMLElement;
/** Variant of the Card based on the theme used. */
modeVariant: 'primary' | 'secondary' | null;
/** Placement of the header */
imagePlacement: 'above-header' | 'below-header';
/** Text in the header */
header?: string;
/** Subheader text in the header */
subheader?: string;
/** Body image src */
bodyImg?: string;
/** Alt text for the body image */
bodyImgAlt?: string;
/** Divider for the body */
bodyDivider: boolean;
/** Makes the Card clickable. */
clickable: boolean;
stretch: boolean;
/** ID for the Card, must be unique.
*
* **NOTE**: If you're listening for Card events, you need to set this ID yourself to identify the Card,
* as the default ID is random and will be different every time.
*/
cardId: string;
/**
* Enables expandable behaviour.
* When true, clicking the header toggles content visibility.
*/
expandable: boolean;
/**
* Tracks the current expanded state when expandable is enabled.
*/
expanded: boolean;
/** Sends unique Card identifier when the Card is clicked, if clickable=true */
tdsClick: EventEmitter<{
cardId: string;
}>;
private toggleExpand;
handleClick: () => void;
getCardHeader: () => any;
getCardContent: () => any;
render(): any;
}