igniteui-webcomponents
Version:
Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.
67 lines (66 loc) • 1.81 kB
TypeScript
import { LitElement, type PropertyValues } from 'lit';
import type { BadgeShape, StyleVariant } from '../types.js';
/**
* The badge is a component indicating a status on a related item or an area
* where some active indication is required.
*
* @element igc-badge
*
* @slot - Default slot for the badge content.
*
* @csspart base - The base wrapper of the badge.
* @csspart icon - The icon container, present when an igc-icon element is slotted.
*
* @example
* ```html
* <igc-badge variant="success">New</igc-badge>
* <igc-badge variant="danger" shape="square">5</igc-badge>
* <igc-badge dot></igc-badge>
* ```
*/
export default class IgcBadgeComponent extends LitElement {
static readonly tagName = "igc-badge";
static styles: import("lit").CSSResult[];
static register(): void;
private readonly _internals;
private readonly _slots;
private _hasIcon;
/**
* The type (style variant) of the badge.
*
* @attr variant
* @default 'primary'
*/
variant: StyleVariant;
/**
* Sets whether to draw an outlined version of the badge.
*
* @attr outlined
* @default false
*/
outlined: boolean;
/**
* The shape of the badge.
*
* @attr shape
* @default 'rounded'
*/
shape: BadgeShape;
/**
* Sets whether to render a dot type badge.
* When enabled, the badge appears as a small dot without any content.
*
* @attr dot
* @default false
*/
dot: boolean;
constructor();
protected willUpdate(changedProperties: PropertyValues<this>): void;
protected _handleSlotChange(): void;
protected render(): import("lit-html").TemplateResult<1>;
}
declare global {
interface HTMLElementTagNameMap {
'igc-badge': IgcBadgeComponent;
}
}