import { CSSProperties } from 'react'; import { ColorProps, ResponsiveValue, SpaceProps, TypographyProps, Theme as StyledSystemTheme } from 'styled-system'; export declare const theme: { colors: { black: string; canary050: string; canary100: string; canary200: string; canary300: string; canary400: string; canary500: string; canary600: string; canary700: string; canary800: string; canary900: string; cuckoo050: string; cuckoo100: string; cuckoo200: string; cuckoo300: string; cuckoo400: string; cuckoo500: string; cuckoo600: string; cuckoo700: string; cuckoo800: string; cuckoo900: string; cockatoo025: string; cockatoo050: string; cockatoo100: string; cockatoo200: string; cockatoo300: string; cockatoo400: string; cockatoo500: string; cockatoo600: string; cockatoo700: string; cockatoo800: string; dropbox: string; flamingo050: string; flamingo100: string; flamingo200: string; flamingo300: string; flamingo400: string; flamingo500: string; flamingo600: string; flamingo700: string; flamingo800: string; flamingo900: string; focus: string; googleDrive: string; jay020: string; jay050: string; jay100: string; jay150: string; jay200: string; jay250: string; jay300: string; jay350: string; jay400: string; jay450: string; jay500: string; jay600: string; jay700: string; jay800: string; jay900: string; macaw020: string; macaw040: string; macaw060: string; macaw080: string; macaw100: string; macaw200: string; macaw300: string; macaw350: string; macaw400: string; macaw500: string; macaw600: string; parrot025: string; parrot050: string; parrot100: string; parrot200: string; parrot300: string; parrot400: string; parrot500: string; parrot600: string; parrot700: string; parrot800: string; peacock050: string; peacock100: string; peacock200: string; peacock300: string; peacock400: string; peacock500: string; peacock600: string; peacock700: string; peacock800: string; peacock900: string; pigeon025: string; pigeon050: string; pigeon100: string; pigeon200: string; pigeon300: string; pigeon400: string; pigeon500: string; pigeon600: string; pigeon700: string; pigeon800: string; pigeon900: string; robin050: string; robin100: string; robin200: string; robin300: string; robin400: string; transparent: string; white: string; }; fonts: { display: string; copy: string; monospace: string; }; fontSizes: { 8: string; 10: string; 12: string; 14: string; 16: string; 18: string; 20: string; 24: string; 28: string; 32: string; 36: string; 40: string; 48: string; 56: string; 64: string; 72: string; }; fontWeights: { bold: number; medium: number; regular: number; semibold: number; }; radii: { 0: number; 8: number; 10: number; 12: number; 16: number; 2: number; 3: number; 4: number; 6: number; 999: number; }; space: { [x: string]: string | number; 0: string | number; 8: string | number; 12: string | number; 16: string | number; 20: string | number; 24: string | number; 28: string | number; 32: string | number; 36: string | number; 40: string | number; 48: string | number; 56: string | number; 64: string | number; 72: string | number; 4: string | number; 6: string | number; [-64]: string | number; 60: string | number; [-60]: string | number; [-56]: string | number; 52: string | number; [-52]: string | number; [-48]: string | number; 44: string | number; [-44]: string | number; [-40]: string | number; [-36]: string | number; [-32]: string | number; [-28]: string | number; [-24]: string | number; [-20]: string | number; [-16]: string | number; [-12]: string | number; [-8]: string | number; [-4]: string | number; 68: string | number; 76: string | number; 80: string | number; 84: string | number; 88: string | number; 92: string | number; 96: string | number; 100: string | number; 104: string | number; 108: string | number; 112: string | number; 116: string | number; 120: string | number; 124: string | number; 128: string | number; 132: string | number; 136: string | number; 140: string | number; 144: string | number; 148: string | number; 152: string | number; 156: string | number; 160: string | number; 164: string | number; 168: string | number; 172: string | number; 176: string | number; 180: string | number; 184: string | number; 188: string | number; 192: string | number; 196: string | number; 200: string | number; 204: string | number; 208: string | number; 212: string | number; 216: string | number; 220: string | number; 224: string | number; }; variants: any; }; export * from './colors'; export * from './fonts'; export * from './fontSizes'; export * from './fontWeights'; export * from './radii'; export * from './space'; export * from './variants'; export declare type Theme = typeof theme; /** * Our theme, but "variants" is stripped out since we don't want it defined in the "tx" prop. * @see https://styled-system.com/theme-specification */ export declare type ThemeWithoutVariants = Omit; declare type ResponsiveValues = ResponsiveValue; declare type UnusedStyledSystemThemeKeys = { breakpoints: string[]; lineHeights: number[]; letterSpacings: (string | number)[]; borders: string[]; borderStyles: string[]; borderWidths: (string | number)[]; zIndices: number[]; }; declare type TypeSafeStyledSystemTheme = ThemeWithoutVariants & UnusedStyledSystemThemeKeys; interface StyledSystemProps extends ColorProps, SpaceProps, TypographyProps { } /** * The theme prop. You'll be provided with intellisense for theme-relevant values, documentation for every CSS selector, * and bare-minimum typesafety. Think of it as a theme-aware CSS and styled-system props, but in an object. */ export declare type TXProp = (StyledSystemProps & Omit) | { /** Typically meant for CSS keys where we have no prescribed theme values or pseudoselectors */ [whateverTheHellYouWant: string]: TXProp | ResponsiveValues | ((_theme: StyledSystemTheme) => ResponsiveValues); };