import type { Snippet } from 'svelte'; import type { HTMLAnchorAttributes, HTMLAttributes, HTMLButtonAttributes, MouseEventHandler } from 'svelte/elements'; export type ButtonElement = HTMLButtonElement | HTMLAnchorElement; export interface BaseButtonProps extends HTMLAttributes, Omit | 'type'>, Omit | 'type'> { element?: HTMLElement; disabled?: boolean | null; loading?: boolean; loadingAriaLabel?: string; toggle?: boolean; selected?: boolean; shape?: 'round' | 'square'; size?: 'xs' | 's' | 'm' | 'l' | 'xl'; type?: 'submit' | 'reset' | 'button' | (string & {}) | null; } export interface ButtonProps extends BaseButtonProps { variant?: 'text' | 'filled' | 'outlined' | 'elevated' | 'tonal'; start?: Snippet; end?: Snippet; } export interface IconButtonProps extends BaseButtonProps { variant?: 'text' | 'filled' | 'outlined' | 'tonal'; selectedIcon?: Snippet; width?: 'narrow' | 'wide' | 'default'; } export interface ButtonGroupProps extends HTMLAttributes { variant?: 'standard' | 'connected'; expandedRatio?: number; compressionLimit?: number; element?: HTMLElement; } export interface SplitButtonProps extends Omit, 'onclick'> { label?: string; icon?: Snippet; menu?: Snippet<[string]>; variant?: Exclude; size?: BaseButtonProps['size']; disabled?: boolean | null; open?: boolean; menuLabel?: string; onclick?: MouseEventHandler; element?: HTMLElement; } export interface SegmentedButtonProps extends HTMLAttributes { name: string; multiSelect?: boolean; options: { label?: string; labelIcon?: Snippet; selected?: boolean; disabled?: boolean; icon?: Snippet; onclick?: (event: Event) => void; }[]; group?: string | number | (string | number)[] | null; element?: HTMLElement; issues?: { message: string; }[]; }