import React from 'react'; import { FontStyleTypeModel, ThemeTypesModel } from '../../Themes/theme_types'; import { Color, Size, stickerOptions } from '../../types'; import { TabItemProps } from '../HorizontalTabs/types'; type kindInteraction = 'mouse' | 'keyboard'; type availableSize = Size.s | Size.m | Size.l; type availableColor = Color.green | Color.dark | Color.blue; interface HorizontalTabItemProps { tabItem: TabItemProps; size?: availableSize; color?: availableColor; highlight?: 'fill' | 'border'; label: string; isActive?: boolean; tabActive: string; tabIndex?: number; aria: React.AriaAttributes; isDisabled?: boolean; isInverse?: boolean; icon?: string; isResponsive?: boolean; stickerOptions?: stickerOptions; rightIcon?: string; counter?: string; className?: string; theme?: ThemeTypesModel; activated?: (obj: tabCore) => void; } interface tabCore { id: string; label: string; } interface IconPlaceProps { theme: ThemeTypesModel; size: availableSize; styled: ModelView; } interface TextProps { theme: ThemeTypesModel; styled: ModelView; rightOffset?: boolean; size: availableSize; } interface CounterPlaceProps { theme: ThemeTypesModel; styled: ModelView; size: availableSize; } interface TabElementProps { theme: ThemeTypesModel; styled: ModelView; size: availableSize; color: availableColor; highlight: 'fill' | 'border'; isActive?: boolean; isFocused?: boolean; dayTime: 'day' | 'night'; showHoverOnActive?: boolean; } interface ChevronPlaceProps { theme: ThemeTypesModel; styled: ModelView; size: availableSize; } interface tabItemProps { paddingTop: number; paddingBottom: number; paddingLeft: number; paddingRight: number; } interface iconProps { width: number; height: number; } interface iconContainerProps { width: number; height: number; marginRight: number; } interface counterProps { marginRight: number; } interface textProps { height: number; top: number; marginRight: number; } interface chevronIconProps { width: number; height: number; left: number; } interface chevronContainer { width: number; height: number; } interface sizeElements { iconSize: iconProps; iconContainer: iconContainerProps; tabItem: tabItemProps; counter: counterProps; chevronIcon: chevronIconProps; text: textProps; chevronContainer: chevronContainer; font: FontStyleTypeModel; } interface colorParams { fill: typeStateParams; border: typeStateParams; } interface typeStateParams { default: styleParams; hover: styleParams; active: styleParams; } interface styleParams { fontColor: string; backgroundColor: string; borderColor: string; } interface dayTimeParams { green: colorParams; dark: colorParams; blue: colorParams; } interface ModelView { style: { day: dayTimeParams; night: dayTimeParams; }; size: { s: sizeElements; m: sizeElements; l: sizeElements; }; } export type { tabCore, kindInteraction, HorizontalTabItemProps, IconPlaceProps, TextProps, CounterPlaceProps, TabElementProps, ChevronPlaceProps, ModelView, };