import * as CSS from 'csstype'; import { BaseColorsList, ThemeColorsList, WebColorsList } from './constants'; export type DataValue = string | number | DataObject; export type ThemeNode = Record; /** * Объект с произвольным содержанием. */ export interface DataObject { [x: string]: DataValue; } export type CSSProperties = CSS.Properties; /** * Объект с корневыми CSSVariables. */ export type CSSRootTheme = { ':root': CSSProperties; }; /** * Объект с корневыми CSSVariables. */ export type CSSThemeMode = { '.light': CSSProperties; '.dark': CSSProperties; }; export interface CSSObject extends CSSProperties { [key: string]: CSSObject | string | number | undefined; } export type TokenType = string | CSSProperties | Array | Record | Array; /** * Содержимое дата-токена. */ export interface TokenData { value: T; comment?: string; enabled?: boolean; } export type TColor = string; /** * Группа дата-токенов. */ export interface TokenDataGroup { [key: string]: TokenData; } export interface DesignLanguage { colors: Record; typography: Record; } export type BaseColors = TokenDataGroup & Record>; export type ThemeColors = TokenDataGroup & Record>; export type WebColors = TokenDataGroup & Partial>>; export type FullColors = BaseColors & ThemeColors; export interface TypographStyle { color?: string; fontSize: string; fontFamily: string; fontWeight: string | number; fontStyle?: string; lineHeight?: string; letterSpacing: string | number; textAlign?: CSS.Properties['textAlign']; textDecoration?: string; textTransform?: CSS.Properties['textTransform']; } /** * Объект со стилями по их типографическим компонентам. */ export type TypoStyles = { [key in T]: CSSProperties; }; export type TypoSystem = { /** * Все `fontSizes`. */ fontSizes: string[]; /** * Все `fonts`. */ fonts: Record; /** * Все `fontWeights`. */ fontWeights: Record; /** * Все `lineHeights`. */ lineHeights: string[]; /** * Все `letterSpacings`. */ letterSpacings: string[]; /** * Объект со стилями по их типографическим компонентам. */ typoStyles: TypoStyles; /** * Алиас typoStyles. * ToDo: удалить в v2.0. */ text: TypoStyles; styles?: { [key: string]: CSSProperties; }; }; /** * Список с дескрипторами создаваемой файловой системы. */ export type GeneratedFiles = Array<{ file: string; content: string; }>; type OverlayTokensKeys = 'overlaySoft' | 'overlayHard' | 'overlayBlur' | 'darkOverlaySoft' | 'darkOverlayHard' | 'darkOverlayBlur' | 'lightOverlaySoft' | 'lightOverlayHard' | 'lightOverlayBlur' | 'inverseOverlaySoft' | 'inverseOverlayHard' | 'inverseOverlayBlur'; export type OverlayTokens = Record>; export interface ThemeConfig { name: string; accentColor: { light: string; dark: string; }; grayscale: { light: Grayscale; dark: Grayscale; }; } export type TextIconsTokenName = 'textPrimary' | 'textSecondary' | 'textTertiary' | 'textParagraph' | 'textAccent' | 'textAccentGradient' | 'textPositive' | 'textWarning' | 'textNegative' | 'textAccentMinor' | 'textAccentMinorGradient' | 'textPromo' | 'textPromoGradient' | 'textPromoMinor' | 'textPromoMinorGradient' | 'textInfo' | 'textPositiveMinor' | 'textWarningMinor' | 'textNegativeMinor' | 'textInfoMinor'; export type ControlsSurfacesName = 'surfaceSolidDefault' | 'surfaceSolidPrimary' | 'surfaceSolidSecondary' | 'surfaceSolidTertiary' | 'surfaceSolidCard' | 'surfaceTransparentDeep' | 'surfaceTransparentPrimary' | 'surfaceTransparentSecondary' | 'surfaceTransparentTertiary' | 'surfaceTransparentCard' | 'surfaceAccent' | 'surfaceAccentGradient' | 'surfacePositive' | 'surfaceWarning' | 'surfaceNegative' | 'surfaceClear' | 'surfaceTransparentAccent' | 'surfaceTransparentAccentGradient' | 'surfaceTransparentPositive' | 'surfaceTransparentWarning' | 'surfaceTransparentNegative' | 'surfaceAccentMinor' | 'surfaceAccentMinorGradient' | 'surfacePromo' | 'surfacePromoGradient' | 'surfacePromoMinor' | 'surfacePromoMinorGradient' | 'surfaceTransparentPromo' | 'surfaceTransparentPromoGradient' | 'surfaceInfo' | 'surfacePositiveMinor' | 'surfaceWarningMinor' | 'surfaceNegativeMinor' | 'surfaceInfoMinor' | 'surfaceTransparentInfo'; export type OutlineName = 'outlineSolidPrimary' | 'outlineSolidSecondary' | 'outlineSolidTertiary' | 'outlineSolidDefault' | 'outlineTransparentPrimary' | 'outlineTransparentSecondary' | 'outlineTransparentTertiary' | 'outlineAccent' | 'outlineAccentGradient' | 'outlinePositive' | 'outlineWarning' | 'outlineNegative' | 'outlineClear' | 'outlineTransparentAccent' | 'outlineTransparentAccentGradient' | 'outlineTransparentPositive' | 'outlineTransparentWarning' | 'outlineTransparentNegative' | 'outlineAccentMinor' | 'outlineAccentMinorGradient' | 'outlinePromo' | 'outlinePromoGradient' | 'outlinePromoMinor' | 'outlinePromoMinorGradient' | 'outlineInfo' | 'outlinePositiveMinor' | 'outlineWarningMinor' | 'outlineNegativeMinor' | 'outlineInfoMinor' | 'outlineTransparentInfo'; export type BackgroundName = 'backgroundPrimary' | 'backgroundSecondary' | 'backgroundTertiary'; export type OverlayName = 'overlaySoft' | 'overlayHard'; export type DataName = 'dataYellow' | 'dataYellowMinor' | 'dataYellowTransparent'; export declare enum TokenGroup { textIcons = "textIcons", text = "text", controlsSurfaces = "controlsSurfaces", surface = "surface", backgrounds = "backgrounds", background = "background", overlay = "overlay", outline = "outline" } export declare enum TokenMode { default = "default", inverse = "inverse" } export declare enum TokenGenericType { onDark = "onDark", onLight = "onLight" } export declare enum TokenBackgroundType { dark = "dark", light = "light" } export declare enum Grayscale { coolGray = "coolGray", gray = "gray" } export type TokensByType = Record>>; export type TokensBackgroundByType = Record>>; export type ThemeMode = 'dark' | 'light'; export type TokensGetterFn = (config: ThemeConfig) => Record; export interface Shadow { origin: string; ios?: { kind: 'shadow'; color: string; offset: { width: number; height: number; }; opacity: number; radius: number; }; android?: { kind: 'shadow'; color: string; elevation: number; }; } export interface Theme { config: ThemeConfig; dark: { textIcons: TokensByType; controlsSurfaces: TokensByType; backgrounds: TokensBackgroundByType; overlay: TokensByType; outline: TokensByType; data: TokensByType; }; light: { textIcons: TokensByType; controlsSurfaces: TokensByType; backgrounds: TokensBackgroundByType; overlay: TokensByType; outline: TokensByType; data: TokensByType; }; shadow?: Record; borderRadius?: Record; spacing?: Record; } export interface ThemeContent { [themeName: string]: { light: CSSRootTheme; dark: CSSRootTheme; typo: (string | undefined)[]; }; } export declare const ColorMode: { LIGHT: string; DARK: string; }; export type ThemeTokenDataGroups = Record | undefined>; export type GeneratedTokenType = 'value' | 'css'; export type GeneratedTokenMode = 'color' | 'shadow' | 'borderRadius' | 'spacing'; export type ActualTokenNames = TextIconsTokenName | ControlsSurfacesName | BackgroundName | OverlayName | OutlineName | DataName | 'white' | 'black' | 'clear' | 'onDarkTextPrimary' | 'onDarkTextSecondary' | 'onDarkTextTertiary' | 'onLightTextPrimary' | 'onLightTextSecondary' | 'onLightTextTertiary' | 'onLightSurfaceSolidDefault' | 'onLightSurfaceTransparentSecondary' | 'onDarkSurfaceSolidDefault' | 'onDarkSurfaceTransparentSecondary'; export {};