@synerise/ds-badge 0.5.2 → 0.5.6

package/CHANGELOG.md

@@ -3,6 +3,41 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.5.6](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.5.5...@synerise/ds-badge@0.5.6) (2021-12-29)
+
+**Note:** Version bump only for package @synerise/ds-badge
+
+
+
+
+
+## [0.5.5](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.5.4...@synerise/ds-badge@0.5.5) (2021-12-22)
+
+
+### Bug Fixes
+
+* **badge:** add customColor prop ([60c12d1](https://github.com/Synerise/synerise-design/commit/60c12d1592072dab0e71bcafe50943d934a82103))
+
+
+
+
+
+## [0.5.4](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.5.3...@synerise/ds-badge@0.5.4) (2021-11-23)
+
+**Note:** Version bump only for package @synerise/ds-badge
+
+
+
+
+
+## [0.5.3](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.5.2...@synerise/ds-badge@0.5.3) (2021-11-22)
+
+**Note:** Version bump only for package @synerise/ds-badge
+
+
+
+
+
 ## [0.5.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.5.1...@synerise/ds-badge@0.5.2) (2021-11-16)
 
 **Note:** Version bump only for package @synerise/ds-badge

package/dist/Badge.js

@@ -1,9 +1,7 @@
-var _excluded = ["flag", "outlined", "backgroundColor", "textColor", "backgroundColorHue", "textColorHue", "pulsing"];
+var _excluded = ["flag", "outlined", "backgroundColor", "textColor", "backgroundColorHue", "textColorHue", "pulsing", "customColor"];
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 import * as React from 'react';
@@ -19,7 +17,8 @@ var Badge = function Badge(_ref) {
       backgroundColorHue = _ref.backgroundColorHue,
       textColorHue = _ref.textColorHue,
       pulsing = _ref.pulsing,
-      antdProps = _objectWithoutProperties(_ref, _excluded);
+      customColor = _ref.customColor,
+      antdProps = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return (
     /*#__PURE__*/
@@ -31,7 +30,8 @@ var Badge = function Badge(_ref) {
       textColor: textColor,
       backgroundColorHue: backgroundColorHue,
       textColorHue: textColorHue,
-      pulsing: pulsing
+      pulsing: pulsing,
+      customColor: customColor
     }, antdProps))
   );
 };

package/dist/Badge.styles.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 export declare const afterElementAnimation: import("styled-components").Keyframes;
 export declare const beforeElementAnimation: import("styled-components").Keyframes;
-declare const _default: import("styled-components").StyledComponent<({ flag, outlined, backgroundColor, textColor, backgroundColorHue, textColorHue, pulsing, ...rest }: any) => JSX.Element, any, {}, never>;
+declare const _default: import("styled-components").StyledComponent<({ flag, outlined, backgroundColor, textColor, backgroundColorHue, textColorHue, pulsing, customColor, ...rest }: any) => JSX.Element, any, {}, never>;
 export default _default;

package/dist/Badge.styles.js

@@ -1,6 +1,4 @@
-var _excluded = ["flag", "outlined", "backgroundColor", "textColor", "backgroundColorHue", "textColorHue", "pulsing"];
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+var _excluded = ["flag", "outlined", "backgroundColor", "textColor", "backgroundColorHue", "textColorHue", "pulsing", "customColor"];
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
@@ -12,7 +10,7 @@ import { macro } from '@synerise/ds-typography';
 var getBackgroundColor = function getBackgroundColor(props) {
   if (props.backgroundColor === 'transparent') return 'transparent';
   if (props.backgroundColor === 'white') return props.theme.palette.white;
-  return props.theme.palette["".concat(props.backgroundColor, "-").concat(props.backgroundColorHue)];
+  return props.theme.palette[props.backgroundColor + "-" + props.backgroundColorHue];
 };
 
 export var afterElementAnimation = keyframes(["0%{transform:translate3d(-5px,-5px,0) scale(0.3);opacity:0.9;}100%{transform:translate3d(-5px,-5px,0) scale(1.5);opacity:0;}"]);
@@ -26,7 +24,8 @@ export default styled(function (_ref) {
       backgroundColorHue = _ref.backgroundColorHue,
       textColorHue = _ref.textColorHue,
       pulsing = _ref.pulsing,
-      rest = _objectWithoutProperties(_ref, _excluded);
+      customColor = _ref.customColor,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   return /*#__PURE__*/React.createElement(Badge, rest);
 }).withConfig({
@@ -35,7 +34,7 @@ export default styled(function (_ref) {
 })(["&&{.ant-scroll-number-only{height:16px;&:last-of-type:not(:first-of-type) > p{padding-right:1px;}& > p{", ";color:inherit;line-height:16px;height:16px;font-weight:400;}}.ant-badge-count{box-shadow:none;height:16px;padding:0 3px;line-height:16px;min-width:16px;font-size:13px;background-color:", ";color:", ";}", ""], macro.h200, function (props) {
   return getBackgroundColor(props);
 }, function (props) {
-  return props.theme.palette["".concat(props.textColor, "-").concat(props.textColorHue)];
+  return props.theme.palette[props.textColor + "-" + props.textColorHue];
 }, function (props) {
-  return css(["", " ", " ", " ", " ", " ", ";"], props.status === 'active' && css([".ant-badge-status-active{background-color:", ";}"], props.theme.palette['green-600']), props.status === 'inactive' && css([".ant-badge-status-inactive{background-color:", ";}"], props.theme.palette['grey-400']), props.status === 'blocked' && css([".ant-badge-status-blocked{background-color:", ";}"], props.theme.palette['red-600']), props.status === 'processing' && css([".ant-badge-status-processing{background-color:", ";}"], props.theme.palette['blue-600']), props.outlined && css([".ant-badge-count{box-shadow:0 0 0 1px ", ";}"], props.theme.palette.white), (!!props.flag || !!props.status) && css([".ant-badge-dot{box-shadow:none;&.ant-badge-status-processing{display:inline-block;position:absolute;}}.ant-badge-dot,.ant-badge-status-dot{overflow:visible;border:2px solid ", ";width:10px;height:10px;&::before{display:flex;content:", ";transform:translate3d(-2px,-2px,0);", " transform-origin:center;}&::after{display:flex;content:", ";transform:translate3d(-5px,-5px,0);", " transform-origin:center;}}"], props.theme.palette.white, props.flag ? '""' : 'none', props.pulsing && css(["animation:", " 2s infinite;position:absolute;top:0;left:0;width:10px;height:10px;background-color:inherit;border-radius:50%;"], beforeElementAnimation), props.flag ? '""' : 'none', props.pulsing && css(["animation:", " 2s infinite;position:absolute;top:0;left:0;width:16px;height:16px;background-color:inherit;border-radius:50%;"], afterElementAnimation)));
+  return css(["", " ", " ", " ", " ", " ", " ", ";"], props.status === 'active' && !props.customColor && css([".ant-badge-status-active{background-color:", ";}"], props.theme.palette['green-600']), props.customColor && css([".ant-badge-dot,.ant-badge-status-dot{background-color:", ";}"], props.theme.palette[props.customColor + "-600"]), props.status === 'inactive' && !props.customColor && css([".ant-badge-status-inactive{background-color:", ";}"], props.theme.palette['grey-400']), props.status === 'blocked' && !props.customColor && css([".ant-badge-status-blocked{background-color:", ";}"], props.theme.palette['red-600']), props.status === 'processing' && !props.customColor && css([".ant-badge-status-processing{background-color:", ";}"], props.theme.palette['blue-600']), props.outlined && css([".ant-badge-count{box-shadow:0 0 0 1px ", ";}"], props.theme.palette.white), (!!props.flag || !!props.status) && css([".ant-badge-dot{box-shadow:none;&.ant-badge-status-processing{display:inline-block;position:absolute;}}.ant-badge-dot,.ant-badge-status-dot{overflow:visible;border:2px solid ", ";width:10px;height:10px;&::before{display:flex;content:", ";transform:translate3d(-2px,-2px,0);", " transform-origin:center;}&::after{display:flex;content:", ";transform:translate3d(-5px,-5px,0);", " transform-origin:center;}}"], props.theme.palette.white, props.flag ? '""' : 'none', props.pulsing && css(["animation:", " 2s infinite;position:absolute;top:0;left:0;width:10px;height:10px;background-color:inherit;border-radius:50%;"], beforeElementAnimation), props.flag ? '""' : 'none', props.pulsing && css(["animation:", " 2s infinite;position:absolute;top:0;left:0;width:16px;height:16px;background-color:inherit;border-radius:50%;"], afterElementAnimation)));
 });

package/dist/Badge.types.d.ts

@@ -11,4 +11,5 @@ export interface BadgeProps extends Omit<AntBadgeProps, 'status'> {
     backgroundColorHue?: ColorHue;
     textColorHue?: ColorHue;
     pulsing?: boolean;
+    customColor?: Color;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-badge",
-  "version": "0.5.2",
+  "version": "0.5.6",
   "description": "Badge UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -32,7 +32,7 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-typography": "^0.12.1"
+    "@synerise/ds-typography": "^0.12.2"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
@@ -40,7 +40,7 @@
     "react": ">=16.9.0 < 17.0.0"
   },
   "devDependencies": {
-    "@synerise/ds-utils": "^0.21.2"
+    "@synerise/ds-utils": "^0.21.5"
   },
-  "gitHead": "8e667a88a48d774c550ff4766de71c4aab01f5a9"
+  "gitHead": "7ddae11318ca2906145c9f48e74df41ca5f15d49"
 }