@codacy/ui-components 0.64.18 → 0.65.0

package/lib/Banner/Banner.js

@@ -13,9 +13,8 @@ var _Flexbox = require("../Flexbox");
 var _Icon = require("../Icon");
 var _Symbols = require("../Icons/Symbols");
 var _Typography = require("../Typography");
-var _react2 = require("@emotion/react");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["title", "icon", "description", "onDismiss"];
+var _excluded = ["title", "icon", "description", "onDismiss", "variant"];
 /**
  * Description for Banner
  */
@@ -24,11 +23,12 @@ var Banner = exports.Banner = function Banner(_ref) {
     icon = _ref.icon,
     description = _ref.description,
     onDismiss = _ref.onDismiss,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
     props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  var theme = (0, _react2.useTheme)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Banner.StyledBanner, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
-    p: 5,
-    pl: 6
+    variant: variant,
+    p: 5
   }, props), {}, {
     width: "100%",
     position: "relative",
@@ -37,7 +37,7 @@ var Banner = exports.Banner = function Banner(_ref) {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
         icon: icon || _Symbols.RocketIcon,
         size: "lg",
-        color: "text-secondary"
+        color: "icon-".concat(variant)
       })
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Flexbox.Box, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.Subheader, {
@@ -45,7 +45,7 @@ var Banner = exports.Banner = function Banner(_ref) {
         mb: 1,
         children: title
       }), description && typeof description === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.Paragraph, {
-        color: theme.colors['black-400'],
+        color: "secondary",
         children: description
       }) : description]
     }), onDismiss && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Banner.StyledCloseButton, {

package/lib/Banner/Banner.styles.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { BannerProps } from './Banner.types';
 export declare const StyledBanner: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
@@ -6,7 +7,7 @@ export declare const StyledBanner: import("@emotion/styled").StyledComponent<{
     fontWeight?: import("styled-system").ResponsiveValue<number | import("../theme").FontWeights, import("../theme").CodacyTheme> | undefined;
 } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & import("..").FlexboxProps, {}, {}>;
+} & import("..").FlexboxProps & Pick<BannerProps, "variant">, {}, {}>;
 export declare const StyledCloseButton: import("@emotion/styled").StyledComponent<import("react").HTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;

package/lib/Banner/Banner.styles.js

@@ -8,23 +8,20 @@ exports.StyledCloseButton = exports.StyledBanner = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _Flexbox = require("../Flexbox");
 var _CloseButton = require("../CloseButton");
+var _Link = require("../Link");
+var _react = require("@emotion/react");
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 var StyledBanner = exports.StyledBanner = /*#__PURE__*/(0, _base["default"])(_Flexbox.Flex, process.env.NODE_ENV === "production" ? {
   target: "e1opnk9v1"
 } : {
   target: "e1opnk9v1",
   label: "codacy"
-})("background:", function (_ref) {
+})(function (_ref) {
   var theme = _ref.theme,
-    backgroundColor = _ref.backgroundColor;
-  return theme.colors[backgroundColor || 'black-50'];
-}, ";border:1px solid ", function (_ref2) {
-  var theme = _ref2.theme;
-  return theme.colors['ui-border'];
-}, ";border-radius:", function (_ref3) {
-  var theme = _ref3.theme;
-  return theme.radii[1];
-}, ";position:relative;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLbUQiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCwgRmxleFByb3BzIH0gZnJvbSAnLi4vRmxleGJveCdcbmltcG9ydCB7IENsb3NlQnV0dG9uIH0gZnJvbSAnLi4vQ2xvc2VCdXR0b24nXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8RmxleFByb3BzPmBcbiAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSwgYmFja2dyb3VuZENvbG9yIH0pID0+IHRoZW1lLmNvbG9yc1soYmFja2dyb3VuZENvbG9yIHx8ICdibGFjay01MCcpIGFzIENvbG9yXX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzWyd1aS1ib3JkZXInXX07XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUucmFkaWlbMV19O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG5gXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDbG9zZUJ1dHRvbiA9IHN0eWxlZChDbG9zZUJ1dHRvbilgXG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxcmVtO1xuICByaWdodDogMXJlbTtcbmBcbiJdfQ== */"));
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'primary' : _ref$variant;
+  return /*#__PURE__*/(0, _react.css)("background:", theme.colors["background-".concat(variant)], ";border:1px solid ", theme.colors[variant === 'primary' ? "border-brand-primary" : "border-".concat(variant)], ";border-radius:", theme.radii[1], ";position:relative;", _Link.StyledLink, "{color:", theme.colors["accent-".concat(variant)], ";font-weight:", theme.fontWeights.bold, ";&:hover{color:", theme.colors['accent-primary-active'], ";}}" + (process.env.NODE_ENV === "production" ? "" : ";label:codacy;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTMkMiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uL0ZsZXhib3gnXG5pbXBvcnQgeyBDbG9zZUJ1dHRvbiB9IGZyb20gJy4uL0Nsb3NlQnV0dG9uJ1xuaW1wb3J0IHsgQmFubmVyUHJvcHMgfSBmcm9tICcuL0Jhbm5lci50eXBlcydcbmltcG9ydCB7IFN0eWxlZExpbmsgfSBmcm9tICcuLi9MaW5rJ1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8UGljazxCYW5uZXJQcm9wcywgJ3ZhcmlhbnQnPj5gXG4gICR7KHsgdGhlbWUsIHZhcmlhbnQgPSAncHJpbWFyeScgfSkgPT4gY3NzYFxuICAgIGJhY2tncm91bmQ6ICR7dGhlbWUuY29sb3JzW2BiYWNrZ3JvdW5kLSR7dmFyaWFudH1gXX07XG4gICAgYm9yZGVyOiAxcHggc29saWQgJHt0aGVtZS5jb2xvcnNbdmFyaWFudCA9PT0gJ3ByaW1hcnknID8gYGJvcmRlci1icmFuZC1wcmltYXJ5YCA6IChgYm9yZGVyLSR7dmFyaWFudH1gIGFzIENvbG9yKV19O1xuICAgIGJvcmRlci1yYWRpdXM6ICR7dGhlbWUucmFkaWlbMV19O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuICAgICR7U3R5bGVkTGlua30ge1xuICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzW2BhY2NlbnQtJHt2YXJpYW50fWBdfTtcbiAgICAgIGZvbnQtd2VpZ2h0OiAke3RoZW1lLmZvbnRXZWlnaHRzLmJvbGR9O1xuXG4gICAgICAmOmhvdmVyIHtcbiAgICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzWydhY2NlbnQtcHJpbWFyeS1hY3RpdmUnXX07XG4gICAgICB9XG4gICAgfVxuICBgfVxuYFxuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2xvc2VCdXR0b24gPSBzdHlsZWQoQ2xvc2VCdXR0b24pYFxuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMXJlbTtcbiAgcmlnaHQ6IDFyZW07XG5gXG4iXX0= */");
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRc0UiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uL0ZsZXhib3gnXG5pbXBvcnQgeyBDbG9zZUJ1dHRvbiB9IGZyb20gJy4uL0Nsb3NlQnV0dG9uJ1xuaW1wb3J0IHsgQmFubmVyUHJvcHMgfSBmcm9tICcuL0Jhbm5lci50eXBlcydcbmltcG9ydCB7IFN0eWxlZExpbmsgfSBmcm9tICcuLi9MaW5rJ1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8UGljazxCYW5uZXJQcm9wcywgJ3ZhcmlhbnQnPj5gXG4gICR7KHsgdGhlbWUsIHZhcmlhbnQgPSAncHJpbWFyeScgfSkgPT4gY3NzYFxuICAgIGJhY2tncm91bmQ6ICR7dGhlbWUuY29sb3JzW2BiYWNrZ3JvdW5kLSR7dmFyaWFudH1gXX07XG4gICAgYm9yZGVyOiAxcHggc29saWQgJHt0aGVtZS5jb2xvcnNbdmFyaWFudCA9PT0gJ3ByaW1hcnknID8gYGJvcmRlci1icmFuZC1wcmltYXJ5YCA6IChgYm9yZGVyLSR7dmFyaWFudH1gIGFzIENvbG9yKV19O1xuICAgIGJvcmRlci1yYWRpdXM6ICR7dGhlbWUucmFkaWlbMV19O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuICAgICR7U3R5bGVkTGlua30ge1xuICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzW2BhY2NlbnQtJHt2YXJpYW50fWBdfTtcbiAgICAgIGZvbnQtd2VpZ2h0OiAke3RoZW1lLmZvbnRXZWlnaHRzLmJvbGR9O1xuXG4gICAgICAmOmhvdmVyIHtcbiAgICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzWydhY2NlbnQtcHJpbWFyeS1hY3RpdmUnXX07XG4gICAgICB9XG4gICAgfVxuICBgfVxuYFxuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2xvc2VCdXR0b24gPSBzdHlsZWQoQ2xvc2VCdXR0b24pYFxuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMXJlbTtcbiAgcmlnaHQ6IDFyZW07XG5gXG4iXX0= */"));
 var StyledCloseButton = exports.StyledCloseButton = /*#__PURE__*/(0, _base["default"])(_CloseButton.CloseButton, process.env.NODE_ENV === "production" ? {
   target: "e1opnk9v0"
 } : {
@@ -36,6 +33,6 @@ var StyledCloseButton = exports.StyledCloseButton = /*#__PURE__*/(0, _base["defa
 } : {
   name: "nd2ame",
   styles: "position:absolute;top:1rem;right:1rem",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZb0QiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCwgRmxleFByb3BzIH0gZnJvbSAnLi4vRmxleGJveCdcbmltcG9ydCB7IENsb3NlQnV0dG9uIH0gZnJvbSAnLi4vQ2xvc2VCdXR0b24nXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8RmxleFByb3BzPmBcbiAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSwgYmFja2dyb3VuZENvbG9yIH0pID0+IHRoZW1lLmNvbG9yc1soYmFja2dyb3VuZENvbG9yIHx8ICdibGFjay01MCcpIGFzIENvbG9yXX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzWyd1aS1ib3JkZXInXX07XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUucmFkaWlbMV19O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG5gXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDbG9zZUJ1dHRvbiA9IHN0eWxlZChDbG9zZUJ1dHRvbilgXG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxcmVtO1xuICByaWdodDogMXJlbTtcbmBcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQm9EIiwiZmlsZSI6Ii4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHsgQ29sb3IgfSBmcm9tICcuLi90aGVtZSdcbmltcG9ydCB7IEZsZXggfSBmcm9tICcuLi9GbGV4Ym94J1xuaW1wb3J0IHsgQ2xvc2VCdXR0b24gfSBmcm9tICcuLi9DbG9zZUJ1dHRvbidcbmltcG9ydCB7IEJhbm5lclByb3BzIH0gZnJvbSAnLi9CYW5uZXIudHlwZXMnXG5pbXBvcnQgeyBTdHlsZWRMaW5rIH0gZnJvbSAnLi4vTGluaydcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFubmVyID0gc3R5bGVkKEZsZXgpPFBpY2s8QmFubmVyUHJvcHMsICd2YXJpYW50Jz4+YFxuICAkeyh7IHRoZW1lLCB2YXJpYW50ID0gJ3ByaW1hcnknIH0pID0+IGNzc2BcbiAgICBiYWNrZ3JvdW5kOiAke3RoZW1lLmNvbG9yc1tgYmFja2dyb3VuZC0ke3ZhcmlhbnR9YF19O1xuICAgIGJvcmRlcjogMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzW3ZhcmlhbnQgPT09ICdwcmltYXJ5JyA/IGBib3JkZXItYnJhbmQtcHJpbWFyeWAgOiAoYGJvcmRlci0ke3ZhcmlhbnR9YCBhcyBDb2xvcildfTtcbiAgICBib3JkZXItcmFkaXVzOiAke3RoZW1lLnJhZGlpWzFdfTtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG5cbiAgICAke1N0eWxlZExpbmt9IHtcbiAgICAgIGNvbG9yOiAke3RoZW1lLmNvbG9yc1tgYWNjZW50LSR7dmFyaWFudH1gXX07XG4gICAgICBmb250LXdlaWdodDogJHt0aGVtZS5mb250V2VpZ2h0cy5ib2xkfTtcblxuICAgICAgJjpob3ZlciB7XG4gICAgICAgIGNvbG9yOiAke3RoZW1lLmNvbG9yc1snYWNjZW50LXByaW1hcnktYWN0aXZlJ119O1xuICAgICAgfVxuICAgIH1cbiAgYH1cbmBcblxuZXhwb3J0IGNvbnN0IFN0eWxlZENsb3NlQnV0dG9uID0gc3R5bGVkKENsb3NlQnV0dG9uKWBcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDFyZW07XG4gIHJpZ2h0OiAxcmVtO1xuYFxuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });

package/lib/Banner/Banner.types.d.ts

@@ -1,10 +1,12 @@
 import React from 'react';
-import { BoxProps } from '../Flexbox';
 import { ContainerComponentProps } from '../types';
 import { IconFile } from '../Icon/Icon.types';
-export interface BannerProps extends BoxProps, ContainerComponentProps {
+import { FlexProps } from '../Flexbox';
+export declare type BannerVariant = 'primary' | 'danger' | 'attention';
+export interface BannerProps extends FlexProps, ContainerComponentProps {
     title: string;
     description?: React.ReactNode;
     icon?: IconFile;
     onDismiss?: () => void;
+    variant?: BannerVariant;
 }

package/lib/theme/ColorSchemes/codacy.d.ts

@@ -48,11 +48,17 @@ export declare const baseColors: {
     'turquoise-200': string;
     'turquoise-100': string;
     'turquoise-80': string;
-    'red-400': string;
-    'red-300': string;
-    'red-200': string;
-    'red-100': string;
+    'red-99': string;
+    'red-95': string;
+    'red-90': string;
+    'red-80': string;
+    'red-70': string;
+    'red-60': string;
     'red-50': string;
+    'red-40': string;
+    'red-30': string;
+    'red-20': string;
+    'red-10': string;
     'green-300': string;
     'green-200': string;
     'green-100': string;
@@ -112,11 +118,17 @@ export declare const functionalColorsFx: (colors: {
     "turquoise-200": string;
     "turquoise-100": string;
     "turquoise-80": string;
-    "red-400": string;
-    "red-300": string;
-    "red-200": string;
-    "red-100": string;
+    "red-99": string;
+    "red-95": string;
+    "red-90": string;
+    "red-80": string;
+    "red-70": string;
+    "red-60": string;
     "red-50": string;
+    "red-40": string;
+    "red-30": string;
+    "red-20": string;
+    "red-10": string;
     "green-300": string;
     "green-200": string;
     "green-100": string;
@@ -177,11 +189,15 @@ export declare const functionalColorsFx: (colors: {
     'ui-border': string;
     'ui-navbar': string;
     'ui-navbar-text': string;
+    'border-brand-primary': string;
+    'border-danger': string;
+    'border-attention': string;
     'icon-primary': string;
     'icon-info': string;
     'icon-success': string;
     'icon-warning': string;
     'icon-danger': string;
+    'icon-attention': string;
     'neutral-900': string;
     'neutral-800': string;
     'neutral-700': string;
@@ -246,11 +262,15 @@ declare const functionalColors: {
     'ui-border': string;
     'ui-navbar': string;
     'ui-navbar-text': string;
+    'border-brand-primary': string;
+    'border-danger': string;
+    'border-attention': string;
     'icon-primary': string;
     'icon-info': string;
     'icon-success': string;
     'icon-warning': string;
     'icon-danger': string;
+    'icon-attention': string;
     'neutral-900': string;
     'neutral-800': string;
     'neutral-700': string;

package/lib/theme/ColorSchemes/codacy.js

@@ -63,11 +63,17 @@ var baseColors = exports.baseColors = {
   'turquoise-100': '#EAF6F6',
   'turquoise-80': '#F7F8FA',
   // REDS
-  'red-400': '#C92C22',
-  'red-300': '#E04440',
-  'red-200': '#EF5454',
-  'red-100': '#F58B8B',
-  'red-50': '#FFE6E6',
+  'red-99': '#FFF6F5',
+  'red-95': '#FFEDEB',
+  'red-90': '#FFDAD6',
+  'red-80': '#FFB3AD',
+  'red-70': '#FF8980',
+  'red-60': '#FB5851',
+  'red-50': '#D52E2A',
+  'red-40': '#CC292B',
+  'red-30': '#960311',
+  'red-20': '#680008',
+  'red-10': '#410003',
   // GREENS
   'green-300': '#1B7E37',
   'green-200': '#25B14D',
@@ -97,11 +103,11 @@ var functionalColorsFx = exports.functionalColorsFx = function functionalColorsF
     'accent-success-focus': colors['green-200'],
     'accent-success-active': colors['green-300'],
     'accent-success-disabled': colors['green-80'],
-    'accent-danger': colors['red-200'],
-    'accent-danger-hover': colors['red-300'],
-    'accent-danger-focus': colors['red-300'],
-    'accent-danger-active': colors['red-400'],
-    'accent-danger-disabled': colors['red-100'],
+    'accent-danger': colors['red-40'],
+    'accent-danger-hover': colors['red-30'],
+    'accent-danger-focus': colors['red-30'],
+    'accent-danger-active': colors['red-20'],
+    'accent-danger-disabled': colors['red-80'],
     'accent-warning': colors['orange-100'],
     'accent-info': colors['blue-600'],
     'accent-attention': colors['purple-400'],
@@ -113,30 +119,34 @@ var functionalColorsFx = exports.functionalColorsFx = function functionalColorsF
     'text-info': colors['blue-800'],
     'text-success': colors['green-300'],
     'text-warning': colors['orange-200'],
-    'text-danger': colors['red-400'],
+    'text-danger': colors['red-40'],
     'text-attention': colors['purple-600'],
     'background-primary': colors['white'],
     'background-secondary': colors['black-50'],
     'background-info': colors['blue-50'],
     'background-success': colors['green-50'],
     'background-warning': colors['orange-50'],
-    'background-danger': colors['red-50'],
+    'background-danger': colors['red-95'],
     'background-attention': colors['purple-100'],
     'background-neutral': colors['black-80'],
     'control-border': colors['blue-300'],
     'control-background': colors['white'],
     'control-active-background': colors['black-60'],
     'control-active-border': colors['blue-700'],
-    'control-invalid-border': colors['red-200'],
+    'control-invalid-border': colors['red-40'],
     'control-disabled': colors['blue-100'],
     'ui-border': colors['black-80'],
     'ui-navbar': colors['black-700'],
     'ui-navbar-text': colors['black-100'],
+    'border-brand-primary': colors['blue-400'],
+    'border-danger': colors['red-40'],
+    'border-attention': colors['purple-400'],
     'icon-primary': colors['black-200'],
     'icon-info': colors['blue-700'],
     'icon-success': colors['green-200'],
     'icon-warning': colors['orange-100'],
-    'icon-danger': colors['red-200'],
+    'icon-danger': colors['red-40'],
+    'icon-attention': colors['purple-500'],
     // NEUTRAL
     'neutral-900': colors['black-700'],
     'neutral-800': colors['black-600'],

package/lib/theme/ColorSchemes/pulse.js

@@ -32,7 +32,7 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
   'text-info': baseColors['turquoise-600'],
   // 'text-success': baseColors['green-300'],
   // 'text-warning': baseColors['orange-200'],
-  // 'text-danger': baseColors['red-400'],
+  // 'text-danger': baseColors['red-40'],
   // 'text-attention': baseColors['purple-600'],
 
   // 'background-primary': baseColors['white'],
@@ -40,7 +40,7 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
   'background-info': baseColors['turquoise-80'],
   // 'background-success': baseColors['green-50'],
   // 'background-warning': baseColors['orange-50'],
-  // 'background-danger': baseColors['red-50'],
+  // 'background-danger': baseColors['red-90'],
   // 'background-attention': baseColors['purple-100'],
   // 'background-neutral': baseColors['black-80'],
 
@@ -48,7 +48,7 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
   //'control-background': baseColors['white'],
   'control-active-background': baseColors['white'],
   'control-active-border': baseColors['turquoise-400'],
-  'control-invalid-border': baseColors['red-300'],
+  'control-invalid-border': baseColors['red-90'],
   'control-disabled': baseColors['black-80'],
   //'ui-border': baseColors['black-80'],
   'ui-navbar': baseColors['turquoise-80'],
@@ -57,6 +57,6 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
   'icon-info': baseColors['turquoise-400']
   // 'icon-success': baseColors['green-200'],
   // 'icon-warning': baseColors['orange-100'],
-  // 'icon-danger': baseColors['red-200'],
+  // 'icon-danger': baseColors['red-40'],
 });
 var pulseThemeColors = exports.pulseThemeColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, baseColors), functionalColors);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codacy/ui-components",
-  "version": "0.64.18",
+  "version": "0.65.0",
   "description": "",
   "license": "ISC",
   "author": "",