import { CSSObject } from 'styled-components'; import { PopoverV2Size } from './popoverV2.types'; import { FoundationTokenType } from '../../tokens/theme.token'; import { BreakpointType } from '../../breakpoints/breakPoints'; export type PopoverV2TokenType = { background: CSSObject['backgroundColor']; border: CSSObject['border']; shadow: FoundationTokenType['shadows']; gap: { [key in PopoverV2Size]: CSSObject['gap']; }; zIndex: CSSObject['zIndex']; borderRadius: { [key in PopoverV2Size]: CSSObject['borderRadius']; }; padding: { left: { [key in PopoverV2Size]: CSSObject['paddingLeft']; }; right: { [key in PopoverV2Size]: CSSObject['paddingRight']; }; top: { [key in PopoverV2Size]: CSSObject['paddingTop']; }; bottom: { [key in PopoverV2Size]: CSSObject['paddingBottom']; }; }; TopContainer: { gap: { [key in PopoverV2Size]: CSSObject['gap']; }; heading: { color: CSSObject['color']; fontSize: { [key in PopoverV2Size]: CSSObject['fontSize']; }; fontWeight: { [key in PopoverV2Size]: CSSObject['fontWeight']; }; lineHeight: { [key in PopoverV2Size]: CSSObject['lineHeight']; }; IconSize: { [key in PopoverV2Size]: CSSObject['size']; }; }; description: { color: CSSObject['color']; fontSize: { [key in PopoverV2Size]: CSSObject['fontSize']; }; fontWeight: { [key in PopoverV2Size]: CSSObject['fontWeight']; }; lineHeight: { [key in PopoverV2Size]: CSSObject['lineHeight']; }; }; }; bottomContainer: { gap: { [key in PopoverV2Size]: CSSObject['gap']; }; }; }; export type ResponsivePopoverV2Tokens = { [key in keyof BreakpointType]: PopoverV2TokenType; };