@sandlada/mdc
Version:
@sandlada/mdc is an open source component library that follows the Material Design 3 design specifications.
71 lines • 3.08 kB
TypeScript
/**
* @license
* Copyright 2026 Kai-Orion & Sandlada
* SPDX-License-Identifier: MIT
*/
import { LitElement, type PropertyValues, type TemplateResult } from 'lit';
import { type ButtonGroupOrientation, type ButtonGroupSelectionMode, type ButtonGroupShape, type ButtonGroupSize, type ButtonGroupVariant, type IButtonGroup } from '../button-group.interface';
declare const BaseButtonGroup_base: Omit<typeof LitElement, "prototype"> & (new () => LitElement & object & import("../../../utils/behaviors/element-internals").WithElementInternals);
export declare abstract class BaseButtonGroup extends BaseButtonGroup_base implements IButtonGroup {
static styles: import("lit").CSSResult;
variant: ButtonGroupVariant;
selectionMode: ButtonGroupSelectionMode;
size: ButtonGroupSize;
shape: ButtonGroupShape;
orientation: ButtonGroupOrientation;
disableMorph: boolean;
expandOnActive: boolean;
disabled: boolean;
protected readonly slottedElements: HTMLElement[];
protected items: HTMLElement[];
private mutationObserver;
constructor();
connectedCallback(): void;
disconnectedCallback(): void;
protected updated(changedProperties: PropertyValues<this>): void;
/** Returns all interactive child button items. */
getItems(): HTMLElement[];
/** Returns all currently selected items in the group. */
getSelectedItems(): HTMLElement[];
/** Returns indices of all currently selected items in the group. */
getSelectedIndexes(): number[];
/** Programmatically sets the selection state of a child at a given index. */
setIndexSelected(index: number, selected: boolean): void;
/** Programmatically toggles the selection state of a child at a given index. */
toggleIndexSelected(index: number): void;
/** Sets the disabled state of a child at a given index. */
setIndexDisabled(index: number, disabled: boolean): void;
protected getRenderClasses(): {
[x: string]: boolean;
container: boolean;
'disable-morph': boolean;
'expand-on-active': boolean;
disabled: boolean;
};
protected getAriaRole(): string;
protected render(): TemplateResult;
protected handleSlotChange: () => void;
private syncItems;
private updateRovingTabindex;
private handlePressStart;
private handlePressEnd;
/**
* Per spec, the standard variant morphs the pressed item AND its
* adjacent siblings (width + shape), while the connected variant
* morphs only the pressed item. We apply the flex-grow inline so we
* can avoid the `:has( ::slotted(...) )` selector (silently dropped
* by Chromium) and reliability across attribute-selector specificity.
*/
private applyExpandOnActiveMorph;
private handleClick;
private handleChildChange;
private handleChildInput;
private handleKeyDown;
private findGroupItem;
private isItemSelected;
private setItemSelected;
private isItemDisabled;
private emitSelectionChange;
}
export {};
//# sourceMappingURL=base-button-group.d.ts.map