@aws-amplify/ui/dist/types/theme/components/utils.d.ts

`@aws-amplify/ui` contains low-level logic & styles for stand-alone usage or re-use in framework-specific implementations.

import type * as CSS from 'csstype';
import type { DesignToken } from '../types';
import type { WebTokens } from '../tokens';
import type { Breakpoints } from '../breakpoints';
export type ColorTheme = 'info' | 'warning' | 'success' | 'error';
export type Size = 'small' | 'large';
export type Orientation = 'horizontal' | 'vertical';
export type FieldControlModifiers = Size | 'error' | 'quiet';
export type CSSProperties = {
    [Key in keyof CSS.Properties]: DesignToken<CSS.Properties[Key] | (string & {})> | CSS.Properties[Key];
};
export type Selectors = {
    [key in CSS.HtmlAttributes | CSS.Pseudos]?: CSSProperties;
};
export interface ComponentStyles extends CSSProperties, Selectors {
    _vars?: Record<string, DesignToken | string>;
}
export type Modifiers<Keys extends string = string, Required extends boolean = false> = Required extends true ? {
    _modifiers: Record<Keys, ComponentStyles>;
} : {
    _modifiers?: Partial<Record<Keys, ComponentStyles>>;
};
export type Elements<Properties extends Record<string, ComponentStyles & {
    _modifiers?: Record<string, ComponentStyles>;
}>, Required extends boolean = false> = Required extends true ? {
    _element: Properties;
} : {
    _element?: Properties;
};
export interface BaseTheme extends ComponentStyles {
    _modifiers?: Record<string, ComponentStyles>;
    _element?: Record<string, ComponentStyles & {
        _modifiers?: Record<string, ComponentStyles>;
    }>;
}
export type ComponentTheme<ThemeType extends BaseTheme = BaseTheme, TokensType extends WebTokens = WebTokens> = ThemeType | ((tokens: TokensType) => ThemeType);
export type ComponentThemeOverride<ThemeType> = {
    theme: ThemeType;
    colorMode?: 'light' | 'dark';
    breakpoint?: keyof Breakpoints['values'];
    mediaQuery?: string;
    selector?: string;
};
export type BaseComponentTheme<ThemeType extends BaseTheme = BaseTheme, NameType extends string = string, TokensType extends WebTokens = WebTokens> = {
    name: NameType;
    theme: ComponentTheme<ThemeType, TokensType>;
    overrides?: Array<ComponentThemeOverride<ComponentTheme<ThemeType, TokensType>>>;
};