Types and constants ​

// Allowed values: 'default', 'progressive', 'destructive'
type ButtonAction = typeof ButtonActions[ number ];

interface ButtonGroupItem {
	/** Button value or unique identifier */
	value: string | number,
	/**
	 * Display label for the button, or null to show no label (for icon-only buttons).
	 * If the label property is missing, the value property is used as the label.
	 */
	label?: string|null,
	/** Icon to display before the label */
	icon?: Icon,
	/** ARIA label for the button. Used for accessibility for icon-only buttons. */
	ariaLabel?: string,
	/** Whether the button is disabled */
	disabled?: boolean
}

// Allowed values: 'medium', 'large'
type ButtonSize = typeof ButtonSizes[ number ];

// Allowed values: 'button', 'submit', 'reset'
type ButtonType = typeof ButtonTypes[ number ];

// Allowed values: 'normal', 'primary', 'quiet'
type ButtonWeight = typeof ButtonWeights[ number ];

interface ChipInputItem {
	value: string,
	icon?: Icon
}

interface DialogAction {
	label: string,
	disabled?: boolean
}

type HTMLDirection = 'ltr' | 'rtl';

type Icon = SimpleIcon | IconFlipForRtl | IconVariedByDir | IconVariedByLang;

interface PathIcon {
	/**
	 * An SVG path string, e.g. 'M3 3H1v16h18v-2H3z'
	 */
	path: string
}

/**
 * An SVG string, e.g. '<path d="M3 3H1v16h18v-2H3z"/>'. An SVG string may contain multiple tags,
 * e.g. '<circle x="..." y="..." r="..."/><path d="..."/>'. SVG strings should not contain an
 * <?xml ...?> tag or a wrapping <svg> tag.
 */
type SvgIcon = string;

type SimpleIcon = PathIcon | SvgIcon;

// Allowed values: 'medium', 'small', 'x-small'
type IconSize = typeof IconSizes[ number ];

export interface IconFlipForRtl {
	/** LTR version of the icon. */
	ltr: SimpleIcon,
	/** Indicates that the icon should be flipped via CSS in RTL mode. */
	shouldFlip: true,
	/**
	 * Language codes that are exceptions to the above property (e.g. the help
	 * icon should flip in RTL mode, but not for Hebrew or Yiddish).
	 */
	shouldFlipExceptions?: string[]
}

interface IconVariedByDir {
	/** Icon for RTL */
	rtl: SimpleIcon,
	/** Icon for LTR */
	ltr: SimpleIcon
}

interface IconVariedByLang {
	/** HTMLElement.lang code with corresponding icon. */
	langCodeMap: Record<string, SimpleIcon | IconFlipForRtl>,
	/** The default icon. */
	default: SimpleIcon | IconFlipForRtl
}

interface MenuConfig {
	/** The maximum number of items visible in an expanded menu. */
	visibleItemLimit?: number | null
	/** Whether to show thumbnails (or placeholder). */
	showThumbnail?: boolean,
	/** Whether to bold menu item labels. */
	boldLabel?: boolean,
	/** Whether to hide description text overflow via an ellipsis. */
	hideDescriptionOverflow?: boolean
}

interface MenuItemData {
	/** Item value or unique identifier. */
	value: string | number,
	/** Display label for the menu item. */
	label?: string,
	/** Text to be appended to the result's label, e.g. text matching a search query. */
	match?: string,
	description?: string | null,
	/** Lang attributes of text properties. */
	language?: MenuItemLanguageData,
	icon?: Icon,
	thumbnail?: Thumbnail | null,
	/** If URL is included, menu item will be wrapped in an anchor element. */
	url?: string,
	disabled?: boolean
}

interface MenuItemDataWithId extends MenuItemData {
	id: string
}

interface MenuItemLanguageData {
	/** lang attribute of the label. */
	label?: string,
	/** lang attribute of the match. */
	match?: string,
	/** lang attribute of the description. */
	description?: string
}

// Allowed values: 'selected', 'highlighted', 'active'
type MenuState = typeof MenuStates[ number ];

interface PrimaryDialogAction extends DialogAction {
	actionType: 'progressive' | 'destructive'
}

interface SearchResult extends MenuItemData {
	/** Result link. */
	url: string
}

interface SearchResultClickEvent {
	/** Search result that was clicked. */
	searchResult: SearchResult|null,
	/** Index of the search result within the array of results. */
	index: number,
	/** Number of search results. */
	numberOfResults: number
}

// Allowed values: 'notice', 'warning', 'error', 'success'
type StatusType = typeof StatusTypes[ number ];

export type TableSort<K extends string = string> = { [P in K]?: TableSortOption };

export type TableSortOption = 'none' | 'asc' | 'desc';

interface TableColumn {
	id: string,
	label?: string,
	// Allowed values: 'start' (default), 'center', 'end'
	textAlign?: typeof TableTextAlignments[ number ]
	// Value with units.
	width?: string,
	// Value with units.
	minWidth?: string,
	allowSort?: boolean
}

type TableRow = Record<string, any>;

// Allowed values: 'text', 'search', 'number', 'email', 'password', 'tel', 'url', 'week', 'month', 'date', 'datetime-local', 'time'
type TextInputType = typeof TextInputTypes[ number ];

interface ValidationMessages {
	error?: string
}

// Allowed values: 'default', 'error'
type ValidationStatusType = typeof ValidationStatusTypes[ number ];

interface Thumbnail {
	url: string;
	/** Image width in pixels. */
	width?: number | null;
	/** Image height in pixels. */
	height?: number | null;
}

const ButtonActions = [
	'default',
	'progressive',
	'destructive'
];

const ButtonSizes = [
	'medium',
	'large'
];

const ButtonTypes = [
	'button',
	'submit',
	'reset'
];

const ButtonWeights = [
	'normal',
	'primary',
	'quiet'
];

const IconSizes = [
	'x-small',
	'small',
	'medium'
];

const MenuStates = [
	'selected',
	'highlighted',
	'active'
];

const StatusTypes = [
	'notice',
	'warning',
	'error',
	'success'
];

const TableTextAlignments = [
	'start',
	'center',
	'end'
];

const TextInputTypes = [
	'text',
	'search',
	'number',
	'email',
	'password',
	'tel',
	'url',
	'week',
	'month',
	'date',
	'datetime-local',
	'time'
];

const ValidationStatusTypes = [
	'default',
	'warning',
	'error',
	'success'
];

const DebounceInterval = 120;

const PendingDelay = 500;