vuetify
Version:
Vue Material Component Framework
77 lines (75 loc) • 2.47 kB
TypeScript
import type { App, DeepReadonly, InjectionKey, Ref } from 'vue';
type DeepPartial<T> = T extends object ? {
[P in keyof T]?: DeepPartial<T[P]>;
} : T;
export type ThemeOptions = false | {
cspNonce?: string;
defaultTheme?: string;
variations?: false | VariationsOptions;
themes?: Record<string, ThemeDefinition>;
stylesheetId?: string;
scope?: string;
};
export type ThemeDefinition = DeepPartial<InternalThemeDefinition>;
interface VariationsOptions {
colors: string[];
lighten: number;
darken: number;
}
interface InternalThemeDefinition {
dark: boolean;
colors: Colors;
variables: Record<string, string | number>;
}
export interface Colors extends BaseColors, OnColors {
[key: string]: string;
}
interface BaseColors {
background: string;
surface: string;
primary: string;
secondary: string;
success: string;
warning: string;
error: string;
info: string;
}
interface OnColors {
'on-background': string;
'on-surface': string;
'on-primary': string;
'on-secondary': string;
'on-success': string;
'on-warning': string;
'on-error': string;
'on-info': string;
}
export interface ThemeInstance {
readonly isDisabled: boolean;
readonly themes: Ref<Record<string, InternalThemeDefinition>>;
readonly name: Readonly<Ref<string>>;
readonly current: DeepReadonly<Ref<InternalThemeDefinition>>;
readonly computedThemes: DeepReadonly<Ref<Record<string, InternalThemeDefinition>>>;
readonly themeClasses: Readonly<Ref<string | undefined>>;
readonly styles: Readonly<Ref<string>>;
readonly global: {
readonly name: Ref<string>;
readonly current: DeepReadonly<Ref<InternalThemeDefinition>>;
};
}
export declare const ThemeSymbol: InjectionKey<ThemeInstance>;
export declare const makeThemeProps: <Defaults extends {
theme?: unknown;
} = {}>(defaults?: Defaults | undefined) => {
theme: unknown extends Defaults["theme"] ? StringConstructor : {
type: import("vue").PropType<unknown extends Defaults["theme"] ? string : string | Defaults["theme"]>;
default: unknown extends Defaults["theme"] ? string : string | Defaults["theme"];
};
};
export declare function createTheme(options?: ThemeOptions): ThemeInstance & {
install: (app: App) => void;
};
export declare function provideTheme(props: {
theme?: string;
}): ThemeInstance;
export declare function useTheme(): ThemeInstance;