@codacy/ui-components 0.64.18 → 0.65.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/lib/Banner/Banner.js +7 -7
  2. package/lib/Banner/Banner.styles.d.ts +2 -1
  3. package/lib/Banner/Banner.styles.js +8 -11
  4. package/lib/Banner/Banner.types.d.ts +4 -2
  5. package/lib/theme/ColorSchemes/codacy.d.ts +58 -14
  6. package/lib/theme/ColorSchemes/codacy.js +47 -24
  7. package/lib/theme/ColorSchemes/pulse.js +4 -4
  8. package/package.json +1 -1
package/lib/Banner/Banner.js CHANGED
@@ -13,9 +13,8 @@ var _Flexbox = require("../Flexbox");
13
13
  var _Icon = require("../Icon");
14
14
  var _Symbols = require("../Icons/Symbols");
15
15
  var _Typography = require("../Typography");
16
- var _react2 = require("@emotion/react");
17
16
  var _jsxRuntime = require("react/jsx-runtime");
18
- var _excluded = ["title", "icon", "description", "onDismiss"];
17
+ var _excluded = ["title", "icon", "description", "onDismiss", "variant"];
19
18
  /**
20
19
  * Description for Banner
21
20
  */
@@ -24,11 +23,12 @@ var Banner = exports.Banner = function Banner(_ref) {
24
23
  icon = _ref.icon,
25
24
  description = _ref.description,
26
25
  onDismiss = _ref.onDismiss,
26
+ _ref$variant = _ref.variant,
27
+ variant = _ref$variant === void 0 ? 'default' : _ref$variant,
27
28
  props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
28
- var theme = (0, _react2.useTheme)();
29
29
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Banner.StyledBanner, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
30
- p: 5,
31
- pl: 6
30
+ variant: variant,
31
+ p: 5
32
32
  }, props), {}, {
33
33
  width: "100%",
34
34
  position: "relative",
@@ -37,7 +37,7 @@ var Banner = exports.Banner = function Banner(_ref) {
37
37
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
38
38
  icon: icon || _Symbols.RocketIcon,
39
39
  size: "lg",
40
- color: "text-secondary"
40
+ color: variant === 'default' ? "icon-info" : "icon-".concat(variant)
41
41
  })
42
42
  }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Flexbox.Box, {
43
43
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.Subheader, {
@@ -45,7 +45,7 @@ var Banner = exports.Banner = function Banner(_ref) {
45
45
  mb: 1,
46
46
  children: title
47
47
  }), description && typeof description === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.Paragraph, {
48
- color: theme.colors['black-400'],
48
+ color: "secondary",
49
49
  children: description
50
50
  }) : description]
51
51
  }), onDismiss && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Banner.StyledCloseButton, {
package/lib/Banner/Banner.styles.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  /// <reference types="react" />
2
+ import { BannerProps } from './Banner.types';
2
3
  export declare const StyledBanner: import("@emotion/styled").StyledComponent<{
3
4
  theme?: import("@emotion/react").Theme | undefined;
4
5
  as?: import("react").ElementType<any> | undefined;
@@ -6,7 +7,7 @@ export declare const StyledBanner: import("@emotion/styled").StyledComponent<{
6
7
  fontWeight?: import("styled-system").ResponsiveValue<number | import("../theme").FontWeights, import("../theme").CodacyTheme> | undefined;
7
8
  } & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
8
9
  theme?: import("@emotion/react").Theme | undefined;
9
- } & import("..").FlexboxProps, {}, {}>;
10
+ } & import("..").FlexboxProps & Pick<BannerProps, "variant">, {}, {}>;
10
11
  export declare const StyledCloseButton: import("@emotion/styled").StyledComponent<import("react").HTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement> & {
11
12
  theme?: import("@emotion/react").Theme | undefined;
12
13
  }, {}, {}>;
package/lib/Banner/Banner.styles.js CHANGED
@@ -8,23 +8,20 @@ exports.StyledCloseButton = exports.StyledBanner = void 0;
8
8
  var _base = _interopRequireDefault(require("@emotion/styled/base"));
9
9
  var _Flexbox = require("../Flexbox");
10
10
  var _CloseButton = require("../CloseButton");
11
+ var _Link = require("../Link");
12
+ var _react = require("@emotion/react");
11
13
  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)."; }
12
14
  var StyledBanner = exports.StyledBanner = /*#__PURE__*/(0, _base["default"])(_Flexbox.Flex, process.env.NODE_ENV === "production" ? {
13
15
  target: "e1opnk9v1"
14
16
  } : {
15
17
  target: "e1opnk9v1",
16
18
  label: "codacy"
17
- })("background:", function (_ref) {
19
+ })(function (_ref) {
18
20
  var theme = _ref.theme,
19
- backgroundColor = _ref.backgroundColor;
20
- return theme.colors[backgroundColor || 'black-50'];
21
- }, ";border:1px solid ", function (_ref2) {
22
- var theme = _ref2.theme;
23
- return theme.colors['ui-border'];
24
- }, ";border-radius:", function (_ref3) {
25
- var theme = _ref3.theme;
26
- return theme.radii[1];
27
- }, ";position:relative;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLbUQiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCwgRmxleFByb3BzIH0gZnJvbSAnLi4vRmxleGJveCdcbmltcG9ydCB7IENsb3NlQnV0dG9uIH0gZnJvbSAnLi4vQ2xvc2VCdXR0b24nXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8RmxleFByb3BzPmBcbiAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSwgYmFja2dyb3VuZENvbG9yIH0pID0+IHRoZW1lLmNvbG9yc1soYmFja2dyb3VuZENvbG9yIHx8ICdibGFjay01MCcpIGFzIENvbG9yXX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzWyd1aS1ib3JkZXInXX07XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUucmFkaWlbMV19O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG5gXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDbG9zZUJ1dHRvbiA9IHN0eWxlZChDbG9zZUJ1dHRvbilgXG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxcmVtO1xuICByaWdodDogMXJlbTtcbmBcbiJdfQ== */"));
21
+ _ref$variant = _ref.variant,
22
+ variant = _ref$variant === void 0 ? 'default' : _ref$variant;
23
+ return /*#__PURE__*/(0, _react.css)("background:", theme.colors[variant === 'default' ? 'background-secondary' : "background-".concat(variant)], ";border:1px solid ", theme.colors[variant === 'default' ? "border-brand-primary" : "border-".concat(variant)], ";border-radius:", theme.radii[1], ";box-shadow:", theme.shadows[0], ";position:relative;", _Link.StyledLink, "{color:", theme.colors[variant === 'default' ? 'accent-primary' : "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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTMkMiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uL0ZsZXhib3gnXG5pbXBvcnQgeyBDbG9zZUJ1dHRvbiB9IGZyb20gJy4uL0Nsb3NlQnV0dG9uJ1xuaW1wb3J0IHsgQmFubmVyUHJvcHMgfSBmcm9tICcuL0Jhbm5lci50eXBlcydcbmltcG9ydCB7IFN0eWxlZExpbmsgfSBmcm9tICcuLi9MaW5rJ1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8UGljazxCYW5uZXJQcm9wcywgJ3ZhcmlhbnQnPj5gXG4gICR7KHsgdGhlbWUsIHZhcmlhbnQgPSAnZGVmYXVsdCcgfSkgPT4gY3NzYFxuICAgIGJhY2tncm91bmQ6ICR7dGhlbWUuY29sb3JzW3ZhcmlhbnQgPT09ICdkZWZhdWx0JyA/ICdiYWNrZ3JvdW5kLXNlY29uZGFyeScgOiAoYGJhY2tncm91bmQtJHt2YXJpYW50fWAgYXMgQ29sb3IpXX07XG4gICAgYm9yZGVyOiAxcHggc29saWQgJHt0aGVtZS5jb2xvcnNbdmFyaWFudCA9PT0gJ2RlZmF1bHQnID8gYGJvcmRlci1icmFuZC1wcmltYXJ5YCA6IChgYm9yZGVyLSR7dmFyaWFudH1gIGFzIENvbG9yKV19O1xuICAgIGJvcmRlci1yYWRpdXM6ICR7dGhlbWUucmFkaWlbMV19O1xuICAgIGJveC1zaGFkb3c6ICR7dGhlbWUuc2hhZG93c1swXX07XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuXG4gICAgJHtTdHlsZWRMaW5rfSB7XG4gICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnNbdmFyaWFudCA9PT0gJ2RlZmF1bHQnID8gJ2FjY2VudC1wcmltYXJ5JyA6IChgYWNjZW50LSR7dmFyaWFudH1gIGFzIENvbG9yKV19O1xuICAgICAgZm9udC13ZWlnaHQ6ICR7dGhlbWUuZm9udFdlaWdodHMuYm9sZH07XG5cbiAgICAgICY6aG92ZXIge1xuICAgICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnNbJ2FjY2VudC1wcmltYXJ5LWFjdGl2ZSddfTtcbiAgICAgIH1cbiAgICB9XG4gIGB9XG5gXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDbG9zZUJ1dHRvbiA9IHN0eWxlZChDbG9zZUJ1dHRvbilgXG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxcmVtO1xuICByaWdodDogMXJlbTtcbmBcbiJdfQ== */");
24
+ }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRc0UiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uL0ZsZXhib3gnXG5pbXBvcnQgeyBDbG9zZUJ1dHRvbiB9IGZyb20gJy4uL0Nsb3NlQnV0dG9uJ1xuaW1wb3J0IHsgQmFubmVyUHJvcHMgfSBmcm9tICcuL0Jhbm5lci50eXBlcydcbmltcG9ydCB7IFN0eWxlZExpbmsgfSBmcm9tICcuLi9MaW5rJ1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8UGljazxCYW5uZXJQcm9wcywgJ3ZhcmlhbnQnPj5gXG4gICR7KHsgdGhlbWUsIHZhcmlhbnQgPSAnZGVmYXVsdCcgfSkgPT4gY3NzYFxuICAgIGJhY2tncm91bmQ6ICR7dGhlbWUuY29sb3JzW3ZhcmlhbnQgPT09ICdkZWZhdWx0JyA/ICdiYWNrZ3JvdW5kLXNlY29uZGFyeScgOiAoYGJhY2tncm91bmQtJHt2YXJpYW50fWAgYXMgQ29sb3IpXX07XG4gICAgYm9yZGVyOiAxcHggc29saWQgJHt0aGVtZS5jb2xvcnNbdmFyaWFudCA9PT0gJ2RlZmF1bHQnID8gYGJvcmRlci1icmFuZC1wcmltYXJ5YCA6IChgYm9yZGVyLSR7dmFyaWFudH1gIGFzIENvbG9yKV19O1xuICAgIGJvcmRlci1yYWRpdXM6ICR7dGhlbWUucmFkaWlbMV19O1xuICAgIGJveC1zaGFkb3c6ICR7dGhlbWUuc2hhZG93c1swXX07XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuXG4gICAgJHtTdHlsZWRMaW5rfSB7XG4gICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnNbdmFyaWFudCA9PT0gJ2RlZmF1bHQnID8gJ2FjY2VudC1wcmltYXJ5JyA6IChgYWNjZW50LSR7dmFyaWFudH1gIGFzIENvbG9yKV19O1xuICAgICAgZm9udC13ZWlnaHQ6ICR7dGhlbWUuZm9udFdlaWdodHMuYm9sZH07XG5cbiAgICAgICY6aG92ZXIge1xuICAgICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnNbJ2FjY2VudC1wcmltYXJ5LWFjdGl2ZSddfTtcbiAgICAgIH1cbiAgICB9XG4gIGB9XG5gXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDbG9zZUJ1dHRvbiA9IHN0eWxlZChDbG9zZUJ1dHRvbilgXG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxcmVtO1xuICByaWdodDogMXJlbTtcbmBcbiJdfQ== */"));
28
25
  var StyledCloseButton = exports.StyledCloseButton = /*#__PURE__*/(0, _base["default"])(_CloseButton.CloseButton, process.env.NODE_ENV === "production" ? {
29
26
  target: "e1opnk9v0"
30
27
  } : {
@@ -36,6 +33,6 @@ var StyledCloseButton = exports.StyledCloseButton = /*#__PURE__*/(0, _base["defa
36
33
  } : {
37
34
  name: "nd2ame",
38
35
  styles: "position:absolute;top:1rem;right:1rem",
39
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZb0QiLCJmaWxlIjoiLi4vLi4vc3JjL0Jhbm5lci9CYW5uZXIuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBDb2xvciB9IGZyb20gJy4uL3RoZW1lJ1xuaW1wb3J0IHsgRmxleCwgRmxleFByb3BzIH0gZnJvbSAnLi4vRmxleGJveCdcbmltcG9ydCB7IENsb3NlQnV0dG9uIH0gZnJvbSAnLi4vQ2xvc2VCdXR0b24nXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRCYW5uZXIgPSBzdHlsZWQoRmxleCk8RmxleFByb3BzPmBcbiAgYmFja2dyb3VuZDogJHsoeyB0aGVtZSwgYmFja2dyb3VuZENvbG9yIH0pID0+IHRoZW1lLmNvbG9yc1soYmFja2dyb3VuZENvbG9yIHx8ICdibGFjay01MCcpIGFzIENvbG9yXX07XG4gIGJvcmRlcjogMXB4IHNvbGlkICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzWyd1aS1ib3JkZXInXX07XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUucmFkaWlbMV19O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG5gXG5cbmV4cG9ydCBjb25zdCBTdHlsZWRDbG9zZUJ1dHRvbiA9IHN0eWxlZChDbG9zZUJ1dHRvbilgXG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxcmVtO1xuICByaWdodDogMXJlbTtcbmBcbiJdfQ== */",
36
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQm9EIiwiZmlsZSI6Ii4uLy4uL3NyYy9CYW5uZXIvQmFubmVyLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHsgQ29sb3IgfSBmcm9tICcuLi90aGVtZSdcbmltcG9ydCB7IEZsZXggfSBmcm9tICcuLi9GbGV4Ym94J1xuaW1wb3J0IHsgQ2xvc2VCdXR0b24gfSBmcm9tICcuLi9DbG9zZUJ1dHRvbidcbmltcG9ydCB7IEJhbm5lclByb3BzIH0gZnJvbSAnLi9CYW5uZXIudHlwZXMnXG5pbXBvcnQgeyBTdHlsZWRMaW5rIH0gZnJvbSAnLi4vTGluaydcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQmFubmVyID0gc3R5bGVkKEZsZXgpPFBpY2s8QmFubmVyUHJvcHMsICd2YXJpYW50Jz4+YFxuICAkeyh7IHRoZW1lLCB2YXJpYW50ID0gJ2RlZmF1bHQnIH0pID0+IGNzc2BcbiAgICBiYWNrZ3JvdW5kOiAke3RoZW1lLmNvbG9yc1t2YXJpYW50ID09PSAnZGVmYXVsdCcgPyAnYmFja2dyb3VuZC1zZWNvbmRhcnknIDogKGBiYWNrZ3JvdW5kLSR7dmFyaWFudH1gIGFzIENvbG9yKV19O1xuICAgIGJvcmRlcjogMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzW3ZhcmlhbnQgPT09ICdkZWZhdWx0JyA/IGBib3JkZXItYnJhbmQtcHJpbWFyeWAgOiAoYGJvcmRlci0ke3ZhcmlhbnR9YCBhcyBDb2xvcildfTtcbiAgICBib3JkZXItcmFkaXVzOiAke3RoZW1lLnJhZGlpWzFdfTtcbiAgICBib3gtc2hhZG93OiAke3RoZW1lLnNoYWRvd3NbMF19O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcblxuICAgICR7U3R5bGVkTGlua30ge1xuICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzW3ZhcmlhbnQgPT09ICdkZWZhdWx0JyA/ICdhY2NlbnQtcHJpbWFyeScgOiAoYGFjY2VudC0ke3ZhcmlhbnR9YCBhcyBDb2xvcildfTtcbiAgICAgIGZvbnQtd2VpZ2h0OiAke3RoZW1lLmZvbnRXZWlnaHRzLmJvbGR9O1xuXG4gICAgICAmOmhvdmVyIHtcbiAgICAgICAgY29sb3I6ICR7dGhlbWUuY29sb3JzWydhY2NlbnQtcHJpbWFyeS1hY3RpdmUnXX07XG4gICAgICB9XG4gICAgfVxuICBgfVxuYFxuXG5leHBvcnQgY29uc3QgU3R5bGVkQ2xvc2VCdXR0b24gPSBzdHlsZWQoQ2xvc2VCdXR0b24pYFxuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMXJlbTtcbiAgcmlnaHQ6IDFyZW07XG5gXG4iXX0= */",
40
37
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
41
38
  });
package/lib/Banner/Banner.types.d.ts CHANGED
@@ -1,10 +1,12 @@
1
1
  import React from 'react';
2
- import { BoxProps } from '../Flexbox';
3
2
  import { ContainerComponentProps } from '../types';
4
3
  import { IconFile } from '../Icon/Icon.types';
5
- export interface BannerProps extends BoxProps, ContainerComponentProps {
4
+ import { FlexProps } from '../Flexbox';
5
+ export declare type BannerVariant = 'default' | 'warning';
6
+ export interface BannerProps extends FlexProps, ContainerComponentProps {
6
7
  title: string;
7
8
  description?: React.ReactNode;
8
9
  icon?: IconFile;
9
10
  onDismiss?: () => void;
11
+ variant?: BannerVariant;
10
12
  }
package/lib/theme/ColorSchemes/codacy.d.ts CHANGED
@@ -40,6 +40,9 @@ export declare const baseColors: {
40
40
  'magenta-30': string;
41
41
  'magenta-20': string;
42
42
  'magenta-10': string;
43
+ 'orange-200': string;
44
+ 'orange-100': string;
45
+ 'orange-50': string;
43
46
  'turquoise-700': string;
44
47
  'turquoise-600': string;
45
48
  'turquoise-500': string;
@@ -48,19 +51,33 @@ export declare const baseColors: {
48
51
  'turquoise-200': string;
49
52
  'turquoise-100': string;
50
53
  'turquoise-80': string;
51
- 'red-400': string;
52
- 'red-300': string;
53
- 'red-200': string;
54
- 'red-100': string;
54
+ 'red-99': string;
55
+ 'red-95': string;
56
+ 'red-90': string;
57
+ 'red-80': string;
58
+ 'red-70': string;
59
+ 'red-60': string;
55
60
  'red-50': string;
61
+ 'red-40': string;
62
+ 'red-30': string;
63
+ 'red-20': string;
64
+ 'red-10': string;
56
65
  'green-300': string;
57
66
  'green-200': string;
58
67
  'green-100': string;
59
68
  'green-80': string;
60
69
  'green-50': string;
61
- 'orange-200': string;
62
- 'orange-100': string;
63
- 'orange-50': string;
70
+ 'yellow-99': string;
71
+ 'yellow-95': string;
72
+ 'yellow-90': string;
73
+ 'yellow-80': string;
74
+ 'yellow-70': string;
75
+ 'yellow-60': string;
76
+ 'yellow-50': string;
77
+ 'yellow-40': string;
78
+ 'yellow-30': string;
79
+ 'yellow-20': string;
80
+ 'yellow-10': string;
64
81
  };
65
82
  export declare const functionalColorsFx: (colors: {
66
83
  white: string;
@@ -104,6 +121,9 @@ export declare const functionalColorsFx: (colors: {
104
121
  "magenta-30": string;
105
122
  "magenta-20": string;
106
123
  "magenta-10": string;
124
+ "orange-200": string;
125
+ "orange-100": string;
126
+ "orange-50": string;
107
127
  "turquoise-700": string;
108
128
  "turquoise-600": string;
109
129
  "turquoise-500": string;
@@ -112,19 +132,33 @@ export declare const functionalColorsFx: (colors: {
112
132
  "turquoise-200": string;
113
133
  "turquoise-100": string;
114
134
  "turquoise-80": string;
115
- "red-400": string;
116
- "red-300": string;
117
- "red-200": string;
118
- "red-100": string;
135
+ "red-99": string;
136
+ "red-95": string;
137
+ "red-90": string;
138
+ "red-80": string;
139
+ "red-70": string;
140
+ "red-60": string;
119
141
  "red-50": string;
142
+ "red-40": string;
143
+ "red-30": string;
144
+ "red-20": string;
145
+ "red-10": string;
120
146
  "green-300": string;
121
147
  "green-200": string;
122
148
  "green-100": string;
123
149
  "green-80": string;
124
150
  "green-50": string;
125
- "orange-200": string;
126
- "orange-100": string;
127
- "orange-50": string;
151
+ "yellow-99": string;
152
+ "yellow-95": string;
153
+ "yellow-90": string;
154
+ "yellow-80": string;
155
+ "yellow-70": string;
156
+ "yellow-60": string;
157
+ "yellow-50": string;
158
+ "yellow-40": string;
159
+ "yellow-30": string;
160
+ "yellow-20": string;
161
+ "yellow-10": string;
128
162
  }) => {
129
163
  'brand-primary': string;
130
164
  'accent-primary': string;
@@ -177,11 +211,16 @@ export declare const functionalColorsFx: (colors: {
177
211
  'ui-border': string;
178
212
  'ui-navbar': string;
179
213
  'ui-navbar-text': string;
214
+ 'border-brand-primary': string;
215
+ 'border-warning': string;
216
+ 'border-danger': string;
217
+ 'border-attention': string;
180
218
  'icon-primary': string;
181
219
  'icon-info': string;
182
220
  'icon-success': string;
183
221
  'icon-warning': string;
184
222
  'icon-danger': string;
223
+ 'icon-attention': string;
185
224
  'neutral-900': string;
186
225
  'neutral-800': string;
187
226
  'neutral-700': string;
@@ -246,11 +285,16 @@ declare const functionalColors: {
246
285
  'ui-border': string;
247
286
  'ui-navbar': string;
248
287
  'ui-navbar-text': string;
288
+ 'border-brand-primary': string;
289
+ 'border-warning': string;
290
+ 'border-danger': string;
291
+ 'border-attention': string;
249
292
  'icon-primary': string;
250
293
  'icon-info': string;
251
294
  'icon-success': string;
252
295
  'icon-warning': string;
253
296
  'icon-danger': string;
297
+ 'icon-attention': string;
254
298
  'neutral-900': string;
255
299
  'neutral-800': string;
256
300
  'neutral-700': string;
package/lib/theme/ColorSchemes/codacy.js CHANGED
@@ -53,6 +53,10 @@ var baseColors = exports.baseColors = {
53
53
  'magenta-30': '#4e122e',
54
54
  'magenta-20': '#2a0b19',
55
55
  'magenta-10': '#17060d',
56
+ // ORANGE
57
+ 'orange-200': '#EE6002',
58
+ 'orange-100': '#FFA101',
59
+ 'orange-50': '#FFF2DF',
56
60
  // TURQUOISE
57
61
  'turquoise-700': '#176267',
58
62
  'turquoise-600': '#2E7D82',
@@ -62,22 +66,36 @@ var baseColors = exports.baseColors = {
62
66
  'turquoise-200': '#B6E4E7',
63
67
  'turquoise-100': '#EAF6F6',
64
68
  'turquoise-80': '#F7F8FA',
65
- // REDS
66
- 'red-400': '#C92C22',
67
- 'red-300': '#E04440',
68
- 'red-200': '#EF5454',
69
- 'red-100': '#F58B8B',
70
- 'red-50': '#FFE6E6',
71
- // GREENS
69
+ // RED
70
+ 'red-99': '#FFF6F5',
71
+ 'red-95': '#FFEDEB',
72
+ 'red-90': '#FFDAD6',
73
+ 'red-80': '#FFB3AD',
74
+ 'red-70': '#FF8980',
75
+ 'red-60': '#FB5851',
76
+ 'red-50': '#D52E2A',
77
+ 'red-40': '#CC292B',
78
+ 'red-30': '#960311',
79
+ 'red-20': '#680008',
80
+ 'red-10': '#410003',
81
+ // GREEN
72
82
  'green-300': '#1B7E37',
73
83
  'green-200': '#25B14D',
74
84
  'green-100': '#4CBE6C',
75
85
  'green-80': '#92D8A6',
76
86
  'green-50': '#E6F4EA',
77
- // ORANGES
78
- 'orange-200': '#EE6002',
79
- 'orange-100': '#FFA101',
80
- 'orange-50': '#FFF2DF'
87
+ // YELLOW
88
+ 'yellow-99': '#FFFDFA',
89
+ 'yellow-95': '#FFF6E5',
90
+ 'yellow-90': '#FFECCC',
91
+ 'yellow-80': '#FFD999',
92
+ 'yellow-70': '#FFC666',
93
+ 'yellow-60': '#FFB433',
94
+ 'yellow-50': '#FFA101',
95
+ 'yellow-40': '#EB9400',
96
+ 'yellow-30': '#996000',
97
+ 'yellow-20': '#664000',
98
+ 'yellow-10': '#332000'
81
99
  };
82
100
  var functionalColorsFx = exports.functionalColorsFx = function functionalColorsFx(colors) {
83
101
  return {
@@ -97,12 +115,12 @@ var functionalColorsFx = exports.functionalColorsFx = function functionalColorsF
97
115
  'accent-success-focus': colors['green-200'],
98
116
  'accent-success-active': colors['green-300'],
99
117
  'accent-success-disabled': colors['green-80'],
100
- 'accent-danger': colors['red-200'],
101
- 'accent-danger-hover': colors['red-300'],
102
- 'accent-danger-focus': colors['red-300'],
103
- 'accent-danger-active': colors['red-400'],
104
- 'accent-danger-disabled': colors['red-100'],
105
- 'accent-warning': colors['orange-100'],
118
+ 'accent-danger': colors['red-40'],
119
+ 'accent-danger-hover': colors['red-30'],
120
+ 'accent-danger-focus': colors['red-30'],
121
+ 'accent-danger-active': colors['red-20'],
122
+ 'accent-danger-disabled': colors['red-80'],
123
+ 'accent-warning': colors['yellow-40'],
106
124
  'accent-info': colors['blue-600'],
107
125
  'accent-attention': colors['purple-400'],
108
126
  'text-primary': colors['black-700'],
@@ -112,31 +130,36 @@ var functionalColorsFx = exports.functionalColorsFx = function functionalColorsF
112
130
  'text-placeholder': colors['black-200'],
113
131
  'text-info': colors['blue-800'],
114
132
  'text-success': colors['green-300'],
115
- 'text-warning': colors['orange-200'],
116
- 'text-danger': colors['red-400'],
133
+ 'text-warning': colors['yellow-40'],
134
+ 'text-danger': colors['red-40'],
117
135
  'text-attention': colors['purple-600'],
118
136
  'background-primary': colors['white'],
119
137
  'background-secondary': colors['black-50'],
120
138
  'background-info': colors['blue-50'],
121
139
  'background-success': colors['green-50'],
122
- 'background-warning': colors['orange-50'],
123
- 'background-danger': colors['red-50'],
140
+ 'background-warning': colors['yellow-95'],
141
+ 'background-danger': colors['red-95'],
124
142
  'background-attention': colors['purple-100'],
125
143
  'background-neutral': colors['black-80'],
126
144
  'control-border': colors['blue-300'],
127
145
  'control-background': colors['white'],
128
146
  'control-active-background': colors['black-60'],
129
147
  'control-active-border': colors['blue-700'],
130
- 'control-invalid-border': colors['red-200'],
148
+ 'control-invalid-border': colors['red-40'],
131
149
  'control-disabled': colors['blue-100'],
132
150
  'ui-border': colors['black-80'],
133
151
  'ui-navbar': colors['black-700'],
134
152
  'ui-navbar-text': colors['black-100'],
153
+ 'border-brand-primary': colors['blue-400'],
154
+ 'border-warning': colors['yellow-40'],
155
+ 'border-danger': colors['red-40'],
156
+ 'border-attention': colors['purple-400'],
135
157
  'icon-primary': colors['black-200'],
136
158
  'icon-info': colors['blue-700'],
137
159
  'icon-success': colors['green-200'],
138
- 'icon-warning': colors['orange-100'],
139
- 'icon-danger': colors['red-200'],
160
+ 'icon-warning': colors['yellow-40'],
161
+ 'icon-danger': colors['red-40'],
162
+ 'icon-attention': colors['purple-500'],
140
163
  // NEUTRAL
141
164
  'neutral-900': colors['black-700'],
142
165
  'neutral-800': colors['black-600'],
package/lib/theme/ColorSchemes/pulse.js CHANGED
@@ -32,7 +32,7 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
32
32
  'text-info': baseColors['turquoise-600'],
33
33
  // 'text-success': baseColors['green-300'],
34
34
  // 'text-warning': baseColors['orange-200'],
35
- // 'text-danger': baseColors['red-400'],
35
+ // 'text-danger': baseColors['red-40'],
36
36
  // 'text-attention': baseColors['purple-600'],
37
37
 
38
38
  // 'background-primary': baseColors['white'],
@@ -40,7 +40,7 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
40
40
  'background-info': baseColors['turquoise-80'],
41
41
  // 'background-success': baseColors['green-50'],
42
42
  // 'background-warning': baseColors['orange-50'],
43
- // 'background-danger': baseColors['red-50'],
43
+ // 'background-danger': baseColors['red-90'],
44
44
  // 'background-attention': baseColors['purple-100'],
45
45
  // 'background-neutral': baseColors['black-80'],
46
46
 
@@ -48,7 +48,7 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
48
48
  //'control-background': baseColors['white'],
49
49
  'control-active-background': baseColors['white'],
50
50
  'control-active-border': baseColors['turquoise-400'],
51
- 'control-invalid-border': baseColors['red-300'],
51
+ 'control-invalid-border': baseColors['red-90'],
52
52
  'control-disabled': baseColors['black-80'],
53
53
  //'ui-border': baseColors['black-80'],
54
54
  'ui-navbar': baseColors['turquoise-80'],
@@ -57,6 +57,6 @@ var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["defaul
57
57
  'icon-info': baseColors['turquoise-400']
58
58
  // 'icon-success': baseColors['green-200'],
59
59
  // 'icon-warning': baseColors['orange-100'],
60
- // 'icon-danger': baseColors['red-200'],
60
+ // 'icon-danger': baseColors['red-40'],
61
61
  });
62
62
  var pulseThemeColors = exports.pulseThemeColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, baseColors), functionalColors);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@codacy/ui-components",
3
- "version": "0.64.18",
3
+ "version": "0.65.1",
4
4
  "description": "",
5
5
  "license": "ISC",
6
6
  "author": "",