import OnesySubscription from '@onesy/subscription'; import { IOptionsRule, TDirection, TValue } from './interfaces'; export interface IMethodsPaletteImageOptions { amount?: number; size?: number; allowCrossOrigin?: boolean; } export declare type TTone = number; export declare type TColorVersion = 'light' | 'main' | 'dark'; export declare type TColorValues = 'light' | 'main' | 'dark' | number; export declare type TColorBackgroundVersion = 'primary' | 'secondary' | 'tertiary' | 'quaternary'; export declare type TColorTextVersion = 'primary' | 'secondary' | 'tertiary' | 'quaternary'; export declare type TPaletteVersion = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'info' | 'success' | 'warning' | 'error' | 'neutral'; export declare type IColorBackground = { [key in TColorBackgroundVersion]?: string; }; export declare type IColorText = { [key in TColorTextVersion]?: string; }; export declare type IColor = { [key in TColorValues]?: string; }; export interface IOptions { element?: HTMLElement; rule?: IOptionsRule; updateFontSize?: boolean; motion?: boolean; } export declare type TValueColorValue = { [key in TColorValues]?: string; }; export declare type IPaletteColor = { primary?: TValueColorValue; secondary?: TValueColorValue; tertiary?: TValueColorValue; quaternary?: TValueColorValue; info?: TValueColorValue; success?: TValueColorValue; warning?: TValueColorValue; error?: TValueColorValue; neutral?: TValueColorValue; [p: string]: TValueColorValue; }; export interface IPaletteBackground { default?: IColorBackground; primary?: IColorBackground; secondary?: IColorBackground; tertiary?: IColorBackground; quaternary?: IColorBackground; info?: IColorBackground; success?: IColorBackground; warning?: IColorBackground; error?: IColorBackground; light?: IColorBackground; dark?: IColorBackground; neutral?: IColorBackground; [p: string]: IColorBackground; } export interface IPaletteText { default?: IColorText; primary?: IColorText; secondary?: IColorText; tertiary?: IColorText; quaternary?: IColorText; info?: IColorText; success?: IColorText; warning?: IColorText; error?: IColorText; neutral?: IColorText; light?: IColorText; dark?: IColorText; divider?: string; active?: string; hover?: string; selected?: string; focus?: string; disabled?: string; [p: string]: string | any; } export declare type TVisualContrastItem = 'default' | 'low' | 'regular' | 'high'; export declare type TVisualContrastItemItems = 'primary' | 'secondary' | 'tertiary' | 'quaternary' | 'active' | 'hover' | 'selected' | 'focus' | 'press' | 'drag' | 'disabled' | 'divider'; export declare type TVisualContrast = { [p in TVisualContrastItem]?: { opacity?: { [i in TVisualContrastItemItems]?: number; }; contrast_threshold?: number; }; }; declare type TPreferenceItems = 'visual_contrast' | 'background' | 'text' | 'shadow'; export declare type TPreference = { [key in TPreferenceItems]?: { default?: TPaletteVersion | TVisualContrastItem; }; }; export declare type TAccessibility = 'regular' | 'colorblind' | 'tritanopia'; export interface IPalette { light?: boolean; accessibility?: TAccessibility; visual_contrast?: TVisualContrast; image?: string; color?: IPaletteColor; text?: IPaletteText; background?: IPaletteBackground; } export declare type TRadiusKey = 'xxs' | 'xs' | 'sm' | 'rg' | 'md' | 'lg' | 'xl' | 'xxl'; export interface IRadius { values?: { xxs?: number; xs?: number; sm?: number; rg?: number; md?: number; lg?: number; xl?: number; xxl?: number; round?: string; [p: string]: string | number; }; keys?: string[]; unit?: number; } export interface IShape { radius?: IRadius; } export declare type IBreakpoint = string | number; export interface IBreakpoints { keys?: IBreakpoint[]; media?: { [p: IBreakpoint]: string; }; unit?: string; } export declare type TSpaceKey = 'xxs' | 'xs' | 'sm' | 'rg' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl' | 'round'; export interface ISpace { values?: { xxs?: number; xs?: number; sm?: number; rg?: number; md?: number; lg?: number; xl?: number; xxl?: number; xxxl?: number; [p: string]: string | number; }; keys?: string[]; unit?: number; } export declare type TShadowValues = 0 | 1 | 2 | 3 | 4 | 6 | 8 | 9 | 12 | 16 | 24; export declare type IShadow = { [key in TShadowValues]?: string; }; export interface IShadows { values?: { default?: IShadow; primary?: IShadow; secondary?: IShadow; tertiary?: IShadow; quaternary?: IShadow; info?: IShadow; success?: IShadow; warning?: IShadow; error?: IShadow; neutral?: IShadow; [p: string]: any; }; opacities?: Array; } export declare type TTransitionsTimingFunctionProperties = 'standard' | 'emphasized' | 'decelerated' | 'accelerated'; export interface ITransitionsTimingFunction { standard?: string; emphasized?: string; decelerated?: string; accelerated?: string; [p: string]: string; } export declare type TTransitionsDurationProperties = 'xxs' | 'xs' | 'sm' | 'rg' | 'enter' | 'leave' | 'complex'; export interface ITransitionsDuration { xxs?: number; xs?: number; sm?: number; rg?: number; enter?: number; leave?: number; complex?: number; [p: string]: number; } export interface ITransitions { timing_function?: ITransitionsTimingFunction; duration?: ITransitionsDuration; } export interface IzIndex { tooltip?: number; modal?: number; menu_modal?: number; menu?: number; button_float?: number; app_bar?: number; main?: number; text?: number; [p: string]: number; } export interface ITypographyVersion { fontSize?: string | number; fontFamily?: string; lineHeight?: string | number; letterSpacing?: string | number; fontWeight?: string | number; } export declare type TTypographyItem = 'd1' | 'd2' | 'd3' | 'h1' | 'h2' | 'h3' | 't1' | 't2' | 't3' | 'l1' | 'l2' | 'l3' | 'b1' | 'b2' | 'b3' | 'm1' | 'm2' | 'm3'; export interface ITypography { unit?: string; font_size?: { html?: string | number; }; font_family?: { primary?: string; secondary?: string; tertiary?: string; }; values?: { d1?: ITypographyVersion; d2?: ITypographyVersion; d3?: ITypographyVersion; h1?: ITypographyVersion; h2?: ITypographyVersion; h3?: ITypographyVersion; t1?: ITypographyVersion; t2?: ITypographyVersion; t3?: ITypographyVersion; l1?: ITypographyVersion; l2?: ITypographyVersion; l3?: ITypographyVersion; b1?: ITypographyVersion; b2?: ITypographyVersion; b3?: ITypographyVersion; m1?: ITypographyVersion; m2?: ITypographyVersion; m3?: ITypographyVersion; [p: string]: any; }; } declare type TMode = 'regular' | 'read' | 'print'; export interface IUi { className?: { static?: boolean; }; features?: 'simple' | 'regular' | 'complex'; elements?: { [p: string]: { className?: { static?: boolean; }; style?: { add?: TValue; override?: TValue; }; props?: { default?: Record; }; }; }; } export declare type IElements = Record; export interface IOnesyTheme { preference?: TPreference; mode?: TMode; palette?: IPalette; shape?: IShape; breakpoints?: IBreakpoints; space?: ISpace; shadows?: IShadows; typography?: ITypography; transitions?: ITransitions; z_index?: IzIndex; ui?: IUi; elements?: IElements; [p: string]: any; } declare class OnesyTheme { options: IOptions; id?: string; subscriptions: { update: OnesySubscription; }; element?: HTMLElement; direction: TDirection; preference: TPreference; mode: TMode; palette: IPalette; shape: IShape; breakpoints: IBreakpoints; space: ISpace; shadows: IShadows; typography: ITypography; transitions: ITransitions; z_index: IzIndex; methods: { palette: { image: (image: string, options?: IMethodsPaletteImageOptions) => Promise; color: { value: (version: TPaletteVersion | 'default', tone: TTone, light?: boolean, palette?: IColor) => string; text: (background: string, max?: boolean, prefer?: 'light' | 'dark', maxOpacity?: string) => any; alpha: (value: string, opacity: number) => string; emphasize: (value: string, coefficient?: number) => string; lighten: (value: string, coefficient: number) => string; darken: (value: string, coefficient: number) => string; getLuminance: (value: string) => number; getContrastRatio: (valueA: string, valueB: string) => number; colorToRgb: (value: string, opacity?: number, array?: boolean) => string | number[]; rgbToRgba: (value: string, opacity?: number, array?: boolean) => string | number[]; rgbToHsl: (value: string, opacity?: number, array?: boolean) => string | number[]; rgbToHex: (value: string, opacity_?: number, array?: boolean) => string | number[]; hslToRgb: (value: string, opacity?: number, array?: boolean) => string | number[]; hexToRgb: (value: string, opacity?: number, array?: boolean) => string | number[]; }; }; color: (value: string) => IColor; shadow: (value?: string, opacities?: Array) => IShadow; space: { value: (value: TSpaceKey | number, unit?: string, add?: number) => any; }; shape: { radius: { value: (value: TRadiusKey | number, unit?: string, add?: number) => string | number; }; }; transitions: { make: (properties: string | Array, options?: { duration?: TTransitionsDurationProperties | number; timing_function?: TTransitionsTimingFunctionProperties; delay?: TTransitionsDurationProperties | number; }) => any; }; }; ui: IUi; elements: IElements; [p: string]: any; constructor(value?: IOnesyTheme, options?: IOptions); init(value_?: IOnesyTheme | OnesyTheme): void; image(value_: string, other?: any, options?: IMethodsPaletteImageOptions): Promise; update(value: IOnesyTheme): void; static get onesy_theme(): OnesyTheme; static get make(): { color: (value: string) => IColor; shadow: (value: string, opacities?: Array) => IShadow; }; static attributes: string[]; static get(value: HTMLElement, index?: number): OnesyTheme; static first(value: HTMLElement): OnesyTheme; static last(value: HTMLElement): OnesyTheme; static nearest(value: HTMLElement): OnesyTheme; static furthest(value: HTMLElement): OnesyTheme; static all(value: HTMLElement): Array; } export default OnesyTheme;