@penaprieto/design-system
Version:
Multi-brand React design system with design tokens from Figma
657 lines (655 loc) • 21.5 kB
TypeScript
/**
* Do not edit directly, this file was auto-generated.
*/
export const BrightBlue100: string;
export const BrightBlue200: string;
export const BrightBlue300: string;
export const BrightBlue400: string;
export const BrightBlue500: string;
export const BrightBlue600: string;
export const BrightBlue700: string;
export const BrightBlue800: string;
export const BrightBlue900: string;
export const BrightBlue1000: string;
export const Indigo100: string;
export const Indigo200: string;
export const Indigo300: string;
export const Indigo400: string;
export const Indigo500: string;
export const Indigo600: string;
export const Indigo700: string;
export const Indigo800: string;
export const Indigo900: string;
export const Indigo1000: string;
export const BlueCorp100: string;
export const BlueCorp200: string;
export const BlueCorp300: string;
export const BlueCorp400: string;
export const BlueCorp500: string;
export const BlueCorp600: string;
export const BlueCorp700: string;
export const BlueCorp800: string;
export const BlueCorp900: string;
export const BlueCorp1000: string;
export const Sky100: string;
export const Sky200: string;
export const Sky300: string;
export const Sky400: string;
export const Sky500: string;
export const Sky600: string;
export const Sky700: string;
export const Sky800: string;
export const Sky900: string;
export const Sky1000: string;
export const Cloud100: string;
export const Cloud200: string;
export const Cloud300: string;
export const Cloud400: string;
export const Cloud500: string;
export const Cloud600: string;
export const Cloud700: string;
export const Cloud800: string;
export const Cloud900: string;
export const Cloud1000: string;
export const Pink100: string;
export const Pink200: string;
export const Pink300: string;
export const Pink400: string;
export const Pink500: string;
export const Pink600: string;
export const Pink700: string;
export const Pink800: string;
export const Pink900: string;
export const Pink1000: string;
export const Green100: string;
export const Green200: string;
export const Green300: string;
export const Green400: string;
export const Green500: string;
export const Green600: string;
export const Green700: string;
export const Green800: string;
export const Green900: string;
export const Green1000: string;
export const AlphaWhite100: string;
export const AlphaWhite90: string;
export const AlphaWhite80: string;
export const AlphaWhite70: string;
export const AlphaWhite60: string;
export const AlphaWhite50: string;
export const AlphaWhite40: string;
export const AlphaWhite30: string;
export const AlphaWhite20: string;
export const AlphaWhite10: string;
export const AlphaWhite5: string;
export const AlphaWhite0: string;
export const AlphaIndigo100: string;
export const AlphaIndigo90: string;
export const AlphaIndigo80: string;
export const AlphaIndigo70: string;
export const AlphaIndigo60: string;
export const AlphaIndigo50: string;
export const AlphaIndigo40: string;
export const AlphaIndigo30: string;
export const AlphaIndigo20: string;
export const AlphaIndigo10: string;
export const AlphaIndigo5: string;
export const AlphaPink100: string;
export const AlphaPink90: string;
export const AlphaPink80: string;
export const AlphaPink70: string;
export const AlphaPink60: string;
export const AlphaPink50: string;
export const AlphaPink40: string;
export const AlphaPink30: string;
export const AlphaPink20: string;
export const AlphaPink10: string;
export const AlphaPink5: string;
export const AlphaCorp100: string;
export const AlphaCorp90: string;
export const AlphaCorp80: string;
export const AlphaCorp70: string;
export const AlphaCorp60: string;
export const AlphaCorp50: string;
export const AlphaCorp40: string;
export const AlphaCorp30: string;
export const AlphaCorp20: string;
export const AlphaCorp10: string;
export const AlphaCorp5: string;
export const AlphaBlack100: string;
export const AlphaBlack90: string;
export const AlphaBlack80: string;
export const AlphaBlack70: string;
export const AlphaBlack60: string;
export const AlphaBlack50: string;
export const AlphaBlack40: string;
export const AlphaBlack30: string;
export const AlphaBlack20: string;
export const AlphaBlack10: string;
export const AlphaBlack5: string;
export const AlphaBlack0: string;
export const Gold100: string;
export const Gold200: string;
export const Gold300: string;
export const Gold400: string;
export const Gold500: string;
export const Gold600: string;
export const Gold700: string;
export const Gold800: string;
export const Gold900: string;
export const Gold1000: string;
export const Red100: string;
export const Red200: string;
export const Red300: string;
export const Red400: string;
export const Red500: string;
export const Red600: string;
export const Red700: string;
export const Red800: string;
export const Red900: string;
export const Red1000: string;
export const DarkGreen100: string;
export const DarkGreen200: string;
export const DarkGreen300: string;
export const DarkGreen400: string;
export const DarkGreen500: string;
export const DarkGreen600: string;
export const DarkGreen700: string;
export const DarkGreen800: string;
export const DarkGreen900: string;
export const DarkGreen1000: string;
export const FontWeightLight: number;
export const FontFamily: string;
export const LineHeightBody: string;
export const LineHeightHeading: string;
export const FontWeightRegular: number;
export const FontWeightMedium: number;
export const FontWeightBold: number;
export const BaseValue: string;
export const BrandPrimaryDefault: string;
export const BrandPrimaryHover: string;
export const BrandPrimaryActive: string;
export const BrandAccentDefault: string;
export const BrandAccentHover: string;
export const BrandAccentActive: string;
export const BrandSuccess: string;
export const BrandError: string;
export const BrandWarning: string;
export const BrandFontFamilyPrimary: string;
export const BrandFontFamilySecondary: string;
export const SemanticBgActionPrimaryDefault: string;
export const SemanticBgActionPrimaryHover: string;
export const SemanticBgActionPrimaryActive: string;
export const SemanticBgActionPrimaryDisabled: string;
export const SemanticBgActionSecondaryDefault: string;
export const SemanticBgActionSecondaryHover: string;
export const SemanticBgActionSecondaryActive: string;
export const SemanticBgActionSecondaryDisabled: string;
export const SemanticBgActionSecondaryInverseDefault: string;
export const SemanticBgActionSecondaryInverseHover: string;
export const SemanticBgActionSecondaryInverseActive: string;
export const SemanticBgActionSecondaryInverseDisabled: string;
export const SemanticBgActionTertiaryHover: string;
export const SemanticBgActionTertiaryActive: string;
export const SemanticBgActionTertiaryInverseHover: string;
export const SemanticBgActionTertiaryInverseActive: string;
export const SemanticBgActionBrandDefault: string;
export const SemanticBgActionBrandHover: string;
export const SemanticBgActionBrandActive: string;
export const SemanticBgActionBrandDisabled: string;
export const SemanticBgActionBrandSubtleDefault: string;
export const SemanticBgActionBrandSubtleHover: string;
export const SemanticBgActionBrandSubtleActive: string;
export const SemanticBgActionGhostHover: string;
export const SemanticBgActionGhostActive: string;
export const SemanticBgDefault: string;
export const SemanticBgSurfaceDefault: string;
export const SemanticBgSurfaceInverse: string;
export const SemanticBgDisabled: string;
export const SemanticBgWarning: string;
export const SemanticBgError: string;
export const SemanticBgSuccess: string;
export const SemanticBgInfo: string;
export const SemanticBgOverlay: string;
export const SemanticBgNeutral: string;
export const SemanticBgDefaultAlt: string;
export const SemanticIconBrandDisabled: string;
export const SemanticIconBrandDefault: string;
export const SemanticIconBrandBold: string;
export const SemanticIconDefaultBold: string;
export const SemanticIconDefaultDefault: string;
export const SemanticIconDefaultDisabled: string;
export const SemanticIconInverseBold: string;
export const SemanticIconInverseDefault: string;
export const SemanticIconInverseDisabled: string;
export const SemanticIconSuccess: string;
export const SemanticIconError: string;
export const SemanticIconWarning: string;
export const SemanticFocusPink: string;
export const SemanticFocusIndigo: string;
export const SemanticFocusBrightBlue: string;
export const SemanticFocusWhite: string;
export const SemanticFocusSky: string;
export const SemanticFocusCorp: string;
export const SemanticElevationElevation1: string;
export const SemanticElevationElevation2: string;
export const SemanticElevationElevation3: string;
export const SemanticElevationElevation4: string;
export const SemanticElevationElevation5: string;
export const SemanticBorderInverseBold: string;
export const SemanticBorderInverseDefault: string;
export const SemanticBorderInverseSubtle: string;
export const SemanticBorderDefaultSubtle: string;
export const SemanticBorderDefaultDefault: string;
export const SemanticBorderDefaultBold: string;
export const SemanticBorderBrandSubtle: string;
export const SemanticBorderBrandDefault: string;
export const SemanticBorderBrandBold: string;
export const SemanticBorderBrandBolder: string;
export const SemanticBorderErrorDefault: string;
export const SemanticBorderErrorSubtle: string;
export const SemanticBorderWarningSubtle: string;
export const SemanticBorderSuccessSubtle: string;
export const SemanticBorderInfoSubtle: string;
export const SemanticBorderAccent: string;
export const SemanticTextCorpPrimary: string;
export const SemanticTextCorpSecondary: string;
export const SemanticTextCorpDisabled: string;
export const SemanticTextIndigoPrimary: string;
export const SemanticTextIndigoSecondary: string;
export const SemanticTextWhitePrimary: string;
export const SemanticTextWhiteSecondary: string;
export const SemanticTextPinkPrimary: string;
export const SemanticTextBrandPrimary: string;
export const SemanticTextWarning: string;
export const SemanticTextError: string;
export const SemanticTextSuccess: string;
export const DisplayDisplayClean: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
letterSpacing: string;
};
export const HeadingH1: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
letterSpacing: string;
};
export const HeadingH2: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const HeadingH3: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
letterSpacing: string;
};
export const HeadingH4: {
fontFamily: string;
fontWeight: number;
fontSize: string;
lineHeight: string;
};
export const HeadingH5: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const HeadingTag: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const BodyXLarge: {
fontFamily: string;
fontWeight: number;
fontSize: string;
lineHeight: string;
};
export const BodyLargeStrong: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const BodyLarge: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const BodyRegularStrong: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const BodyRegular: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const BodySmallStrong: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const BodySmall: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const BodyXSmall: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const MobileDisplayCleanM: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
letterSpacing: string;
};
export const MobileH1M: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
letterSpacing: string;
};
export const MobileH2M: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const MobileH3M: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const MobileH4M: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const Size0: string;
export const Size1: string;
export const Size2: string;
export const Size3: string;
export const Size4: string;
export const Size5: string;
export const Size6: string;
export const Size7: string;
export const Size8: string;
export const Size9: string;
export const Size10: string;
export const Size11: string;
export const Size12: string;
export const BrXs: string;
export const BrSm: string;
export const BrMd: string;
export const BrLg: string;
export const BrXl: string;
export const BrFull: string;
export const ButtonPrimaryBgDefault: string;
export const ButtonPrimaryBgHover: string;
export const ButtonPrimaryBgActive: string;
export const ButtonPrimaryBgDisabled: string;
export const ButtonPrimaryBorderDefault: string;
export const ButtonSecondaryBgDefault: string;
export const ButtonSecondaryBgHover: string;
export const ButtonSecondaryBgActive: string;
export const ButtonSecondaryBgDisabled: string;
export const ButtonSecondaryBgInverseDefault: string;
export const ButtonSecondaryBgInverseHover: string;
export const ButtonSecondaryBgInverseActive: string;
export const ButtonSecondaryBgInverseDisabled: string;
export const ButtonTertiaryBgHover: string;
export const ButtonTertiaryBgActive: string;
export const ButtonTertiaryBgInverseHover: string;
export const ButtonTertiaryBgInverseActive: string;
export const ButtonTertiaryBorderDefault: string;
export const ButtonTertiaryBorderDisabled: string;
export const ButtonTertiaryBorderInverseDefault: string;
export const ButtonTertiaryBorderInverseDisabled: string;
export const ButtonGhostBgHover: string;
export const ButtonGhostBgActive: string;
export const ButtonGhostBgInverseHover: string;
export const ButtonGhostBgInverseActive: string;
export const ButtonLarge: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const ButtonMedium: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const ButtonSmall: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const TextFieldBorderDefault: string;
export const TextFieldBorderHover: string;
export const TextFieldBorderFocus: string;
export const TextFieldBorderError: string;
export const TextFieldBgDefault: string;
export const TextFieldBgDisabled: string;
export const TextFieldLabel: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const TextFieldPlaceholder: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const TextFieldAssistiveText: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const SwitchSelectedBgDefault: string;
export const SwitchSelectedBgHover: string;
export const SwitchBgDisabled: string;
export const SwitchBgDefault: string;
export const SwitchBorderDefault: string;
export const SwitchBorderDisabled: string;
export const SwitchUnselectedBgDefault: string;
export const SwitchUnselectedBgHover: string;
export const RadioSelectedBgDefault: string;
export const RadioSelectedBgHover: string;
export const RadioSelectedBgDisabled: string;
export const RadioSelectedBorderDefault: string;
export const RadioSelectedBorderHover: string;
export const RadioSelectedBorderDisabled: string;
export const RadioBgDefault: string;
export const RadioBgDisabled: string;
export const RadioUnselectedBorderDefault: string;
export const RadioUnselectedBorderHover: string;
export const DropdownBgDefault: string;
export const DropdownBgHover: string;
export const DropdownBgActive: string;
export const CheckboxSelectedBgDefault: string;
export const CheckboxSelectedBgHover: string;
export const CheckboxSelectedBgDisabled: string;
export const CheckboxSelectedBorderDefault: string;
export const CheckboxUnselectedBorderDefault: string;
export const CheckboxUnselectedBorderHover: string;
export const CheckboxUnselectedBgDefault: string;
export const CheckboxUnselectedBgDisabled: string;
export const AlertWarningBg: string;
export const AlertWarningBorder: string;
export const AlertErrorBg: string;
export const AlertErrorBorder: string;
export const AlertSuccessBg: string;
export const AlertSuccessBorder: string;
export const AlertInfoBg: string;
export const AlertInfoBorder: string;
export const AlertNeutralBg: string;
export const AlertNeutralBorder: string;
export const AlertDefault: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const AlertDescription: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
};
export const SliderTrackBgDefault: string;
export const SliderTrackBgHover: string;
export const SliderTrackBgDisabled: string;
export const SliderBorderDefault: string;
export const SliderBgDisabled: string;
export const RadioCardUnselectedBgDefault: string;
export const RadioCardUnselectedBgDisabled: string;
export const RadioCardUnselectedBorderDefault: string;
export const RadioCardUnselectedBorderHover: string;
export const RadioCardSelectedBgDefault: string;
export const RadioCardSelectedBgHover: string;
export const RadioCardSelectedBgDisabled: string;
export const RadioCardSelectedBorderDefault: string;
export const TagSuccessBg: string;
export const TagSuccessBorder: string;
export const TagErrorBg: string;
export const TagErrorBorder: string;
export const TagWarningBg: string;
export const TagWarningBorder: string;
export const TagInfoBg: string;
export const TagInfoBorder: string;
export const TagFeaturedBorder: string;
export const TagFeaturedBg: string;
export const TagPromoBg: string;
export const TagPromoBorder: string;
export const LinkWarningBgHover: string;
export const LinkWarningBgActive: string;
export const LinkErrorBgHover: string;
export const LinkErrorBgActive: string;
export const LinkSuccessBgHover: string;
export const LinkSuccessBgActive: string;
export const LinkBrandBgHover: string;
export const LinkBrandBgActive: string;
export const LinkWhiteBgHover: string;
export const LinkWhiteBgActive: string;
export const LinkLarge: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
textDecoration: string;
};
export const LinkXLarge: {
fontFamily: string;
fontWeight: number;
fontSize: string;
lineHeight: string;
textDecoration: string;
};
export const LinkLargeStrong: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
textDecoration: string;
};
export const LinkRegular: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
textDecoration: string;
};
export const LinkRegularStrong: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
textDecoration: string;
};
export const LinkSmall: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
textDecoration: string;
};
export const LinkSmallStrong: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
textDecoration: string;
};
export const LinkXSmall: {
fontFamily: string;
fontWeight: number;
lineHeight: string;
fontSize: string;
textDecoration: string;
};
export const NavBgInverse: string;
export const NavBgDefault: string;
export const PillSelectedBgDefault: string;
export const PillSelectedBgHover: string;
export const PillSelectedBgActive: string;
export const PillSelectedBgDisabled: string;
export const PillUnselectedBgDefault: string;
export const PillUnselectedBgHover: string;
export const PillUnselectedBgActive: string;
export const PillUnselectedBgDisabled: string;
export const AvatarBgDefault: string;
export const AvatarBgHover: string;
export const AvatarBgActive: string;
export const AvatarBgDisabled: string;
export const AvatarBgOverlayHover: string;
export const AvatarBgOverlayActive: string;
export const SkeletonBgDefaultGradient: string;
export const SkeletonBgDefaultDefault: string;
export const SkeletonBgInverseDefault: string;
export const SkeletonBgInverseGradient: string;
export const StepperIndicatorPendingBg: string;
export const StepperIndicatorPendingBorder: string;
export const StepperIndicatorPendingText: string;
export const StepperIndicatorCurrentBg: string;
export const StepperIndicatorCurrentText: string;
export const StepperIndicatorCompletedBg: string;
export const StepperIndicatorCompletedText: string;
export const StepperIndicatorErrorBg: string;
export const StepperIndicatorErrorBorder: string;
export const StepperIndicatorErrorText: string;
export const StepperConnectorDefault: string;
export const StepperConnectorCompleted: string;
export const StepperLabelDefault: string;
export const StepperLabelPending: string;
export const TimepickerDropdownBg: string;
export const TimepickerDropdownBorder: string;