@sandlada/mdc/build/components/segmented-button/internal/base-segmented-button.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
 *
 * @fileoverview
 * Internal base class for `mdc-segmented-button` — a single selectable segment.
 *
 * A segment is a pure view: it renders a native `<button>` (the focusable,
 * accessible element) holding the optional icon, label and — when selected —
 * an animated checkmark. Selection state is owned by the parent
 * `mdc-segmented-button-set`; on pointer / keyboard activation the segment
 * only reports the `segmented-button-interaction` event and the set decides
 * whether the selection commits.
 *
 * Ripple and focus-ring are wired to the inner button via
 * `mixinRippleOptions` / `mixinFocusRingOptions`.
 */
import { LitElement, type PropertyValues, type TemplateResult } from 'lit';
import { type ISegmentedButton } from '../segmented-button.interface';
declare const BaseSegmentedButton_base: Omit<typeof LitElement, "prototype"> & (new () => LitElement & object & import("../../ripple/ripple-options.mixin").IMixinRippleOptions & import("../../ripple/ripple-options.mixin").IMixinRippleAttributes & import("../../focus-ring/focus-ring-options.mixin").IMixinFocusRingOption);
export declare abstract class BaseSegmentedButton extends BaseSegmentedButton_base implements ISegmentedButton {
    static styles: import("lit").CSSResult[];
    /** Whether this segment is currently selected. */
    selected: boolean;
    /** When `true` the segment is non-interactive and dimmed. */
    disabled: boolean;
    /** When `true` the checkmark is hidden on the selected state. */
    noCheckmark: boolean;
    /** Set when the `icon` slot is populated. */
    hasIcon: boolean;
    /** Set when the default (label) slot is populated. */
    hasLabel: boolean;
    protected readonly buttonElement: HTMLButtonElement | null;
    private readonly assignedIcons;
    private readonly assignedDefaultNodes;
    /** Tracks the checkmark draw-in / icon fade-out animation phase. */
    private animState;
    get rippleControl(): HTMLElement | null;
    get focusRingControl(): HTMLElement | null;
    constructor();
    protected getRenderClasses(): {
        container: boolean;
        selected: boolean;
        unselected: boolean;
        'with-label': boolean;
        'without-label': boolean;
        'with-icon': boolean;
        'without-icon': boolean;
        'with-checkmark': boolean;
        'without-checkmark': boolean;
        selecting: boolean;
        deselecting: boolean;
        disabled: boolean;
    };
    protected willUpdate(changedProperties: PropertyValues<this>): void;
    protected render(): TemplateResult;
    protected renderOutline(): TemplateResult;
    protected renderLeading(): TemplateResult;
    protected renderIcon(): TemplateResult;
    protected renderCheckmark(): TemplateResult;
    protected renderLabel(): TemplateResult;
    protected renderTouchTarget(): TemplateResult;
    focus(): void;
    blur(): void;
    private readonly handleClick;
    private readonly handleIconSlotChange;
    private readonly handleLabelSlotChange;
}
export {};
//# sourceMappingURL=base-segmented-button.d.ts.map