@sandlada/mdc/build/components/chip/chip.d.ts

@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.

/**
 * @license
 * Copyright 2026 Kai-Orion & Sandlada
 * SPDX-License-Identifier: MIT
 */
import { LitElement, type PropertyValues, type TemplateResult } from 'lit';
import { type ChipVariant, type IChip } from './chip.interface';
declare global {
    interface HTMLElementTagNameMap {
        'mdc-chip': MDCChip;
    }
}
declare const MDCChip_base: Omit<typeof LitElement, "prototype"> & (new () => LitElement & object & import("../ripple/ripple-options.mixin").IMixinRippleOptions & import("../ripple/ripple-options.mixin").IMixinRippleAttributes & import("../elevation/elevation-options.mixin").IMixinElevationOptions & import("../focus-ring/focus-ring-options.mixin").IMixinFocusRingOption);
/**
 * @element mdc-chip
 *
 * A compact UI element representing complex entities.
 * Supports 4 variants: assist, filter, input, suggestion.
 *
 * @slot - The chip label text.
 * @slot icon - Leading icon (assist/filter variants).
 * @slot avatar - Avatar element (input variant).
 * @slot trailing-icon - Trailing icon/close button (input variant).
 * @slot selected-icon - Custom checkmark icon when selected (filter variant).
 *
 * @fires chip-toggle - Dispatched when selection changes (filter/input).
 * @fires chip-navigate - Dispatched on assist/suggestion click.
 * @fires chip-close - Dispatched when close icon is clicked (input).
 * @fires update-focus - Dispatched when `disabled` is toggled (bubbles).
 *
 * @cssproperty --mdc-chip-enabled-container-color
 * @cssproperty --mdc-chip-container-shape-start-start
 * @cssproperty --mdc-chip-container-shape-start-end
 * @cssproperty --mdc-chip-container-shape-end-start
 * @cssproperty --mdc-chip-container-shape-end-end
 * @cssproperty --mdc-chip-enabled-label-color
 * @cssproperty --mdc-chip-enabled-outline-color
 * @cssproperty --mdc-chip-icon-size
 * @cssproperty --mdc-chip-enabled-container-color-elevated
 * @cssproperty --mdc-chip-enabled-container-elevation
 * @cssproperty --mdc-chip-enabled-container-shadow-color
 *
 * @version
 * Material Design 3
 *
 * @link
 * https://m3.material.io/components/chips/overview
 */
export declare class MDCChip extends MDCChip_base implements IChip {
    static styles: import("lit").CSSResult;
    variant: ChipVariant;
    selected: boolean;
    disabled: boolean;
    softDisabled: boolean;
    alwaysFocusable: boolean;
    elevated: boolean;
    href: string;
    target: string;
    label: string;
    ariaLabelRemove: string;
    removeOnly: boolean;
    chipTabIndex: number;
    hasIcon: boolean;
    hasAvatar: boolean;
    hasTrailingIcon: boolean;
    hasSelectedIcon: boolean;
    hasLabel: boolean;
    protected readonly chipElement: HTMLElement | null;
    private readonly assignedIcons;
    private readonly assignedAvatars;
    private readonly assignedTrailingIcons;
    private readonly assignedSelectedIcons;
    private readonly assignedDefaultNodes;
    private animState;
    get rippleControl(): HTMLElement | null;
    get focusRingControl(): HTMLElement | null;
    protected willUpdate(changedProperties: PropertyValues<this>): void;
    protected updated(changedProperties: PropertyValues<this>): void;
    protected getRenderClasses(): {
        [x: string]: boolean;
        container: boolean;
        selected: boolean;
        unselected: boolean;
        elevated: boolean;
        'soft-disabled': boolean;
        'remove-only': boolean;
        'has-icon': boolean;
        'has-avatar': boolean;
        'has-trailing-icon': boolean;
        'has-selected-icon': boolean;
        'has-label': boolean;
        selecting: boolean;
        deselecting: boolean;
        disabled: boolean;
    };
    protected getRole(): 'checkbox' | 'button' | 'link';
    protected render(): TemplateResult;
    protected renderLeading(): TemplateResult;
    protected renderIcon(): TemplateResult;
    protected renderAvatar(): TemplateResult;
    protected renderCheckmark(): TemplateResult;
    protected renderLabel(): TemplateResult;
    protected renderTrailing(): TemplateResult;
    protected renderTouchTarget(): TemplateResult;
    focus(): void;
    blur(): void;
    private readonly handleClick;
    private readonly handleKeydown;
    private activate;
    private readonly handleTrailingIconClick;
    private readonly handleIconSlotChange;
    private readonly handleAvatarSlotChange;
    private readonly handleTrailingIconSlotChange;
    private readonly handleSelectedIconSlotChange;
    private readonly handleLabelSlotChange;
}
export {};
//# sourceMappingURL=chip.d.ts.map