@synerise/ds-badge 0.8.24 → 0.9.0
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.
- package/CHANGELOG.md +19 -0
- package/dist/Badge.d.ts +1 -1
- package/dist/Badge.js +9 -25
- package/dist/Badge.styles.js +0 -2
- package/dist/Badge.types.d.ts +2 -2
- package/dist/modules.d.js +1 -1
- package/dist/style/index.css +1 -1
- package/package.json +8 -8
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,25 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [0.9.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.8.25...@synerise/ds-badge@0.9.0) (2025-01-29)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Features
|
|
10
|
+
|
|
11
|
+
* antd@4.24 react@18 ([d97a667](https://github.com/Synerise/synerise-design/commit/d97a667b1f33aed3177e1851de3b6f60be2d46a6))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
## [0.8.25](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.8.24...@synerise/ds-badge@0.8.25) (2025-01-21)
|
|
18
|
+
|
|
19
|
+
**Note:** Version bump only for package @synerise/ds-badge
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
6
25
|
## [0.8.24](https://github.com/Synerise/synerise-design/compare/@synerise/ds-badge@0.8.23...@synerise/ds-badge@0.8.24) (2025-01-15)
|
|
7
26
|
|
|
8
27
|
**Note:** Version bump only for package @synerise/ds-badge
|
package/dist/Badge.d.ts
CHANGED
|
@@ -2,5 +2,5 @@ import React from 'react';
|
|
|
2
2
|
import '@synerise/ds-core/dist/js/style';
|
|
3
3
|
import './style/index.less';
|
|
4
4
|
import { BadgeProps } from './Badge.types';
|
|
5
|
-
declare const Badge: React.
|
|
5
|
+
declare const Badge: ({ dot, ...props }: BadgeProps) => React.JSX.Element;
|
|
6
6
|
export default Badge;
|
package/dist/Badge.js
CHANGED
|
@@ -1,33 +1,17 @@
|
|
|
1
|
-
var _excluded = ["
|
|
1
|
+
var _excluded = ["dot"];
|
|
2
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
3
3
|
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; }
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import '@synerise/ds-core/dist/js/style';
|
|
6
6
|
import "./style/index.css";
|
|
7
|
-
import
|
|
7
|
+
import StyledBadge from './Badge.styles';
|
|
8
8
|
var Badge = function Badge(_ref) {
|
|
9
|
-
var
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
customColor = _ref.customColor,
|
|
17
|
-
antdProps = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
18
|
-
return (
|
|
19
|
-
/*#__PURE__*/
|
|
20
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
21
|
-
React.createElement(AntdBadge, _extends({
|
|
22
|
-
flag: flag,
|
|
23
|
-
outlined: outlined,
|
|
24
|
-
backgroundColor: backgroundColor,
|
|
25
|
-
textColor: textColor,
|
|
26
|
-
backgroundColorHue: backgroundColorHue,
|
|
27
|
-
textColorHue: textColorHue,
|
|
28
|
-
pulsing: pulsing,
|
|
29
|
-
customColor: customColor
|
|
30
|
-
}, antdProps))
|
|
31
|
-
);
|
|
9
|
+
var dot = _ref.dot,
|
|
10
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
11
|
+
var status = props.status;
|
|
12
|
+
var isDot = dot !== undefined ? dot : status !== undefined;
|
|
13
|
+
return /*#__PURE__*/React.createElement(StyledBadge, _extends({}, props, {
|
|
14
|
+
dot: isDot
|
|
15
|
+
}));
|
|
32
16
|
};
|
|
33
17
|
export default Badge;
|
package/dist/Badge.styles.js
CHANGED
|
@@ -11,8 +11,6 @@ var getBackgroundColor = function getBackgroundColor(props) {
|
|
|
11
11
|
};
|
|
12
12
|
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;}"]);
|
|
13
13
|
export var beforeElementAnimation = keyframes(["0%{transform:translate3d(-2px,-2px,0) scale(0.5);opacity:0.9;}100%{transform:translate3d(-2px,-2px,0) scale(1.5);opacity:0;}"]);
|
|
14
|
-
|
|
15
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
16
14
|
export default styled(function (_ref) {
|
|
17
15
|
var flag = _ref.flag,
|
|
18
16
|
outlined = _ref.outlined,
|
package/dist/Badge.types.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ export declare const color: readonly ["red", "green", "grey", "yellow", "blue",
|
|
|
4
4
|
export type Color = typeof color[number];
|
|
5
5
|
export type ColorHue = '900' | '800' | '700' | '600' | '500' | '400' | '300' | '200' | '100' | '050';
|
|
6
6
|
export type Status = 'active' | 'inactive' | 'blocked' | 'processing' | 'warning' | undefined;
|
|
7
|
-
export
|
|
7
|
+
export type BadgeProps = Omit<AntBadgeProps, 'status'> & {
|
|
8
8
|
flag?: boolean;
|
|
9
9
|
status?: Status;
|
|
10
10
|
outlined?: boolean;
|
|
@@ -14,4 +14,4 @@ export interface BadgeProps extends Omit<AntBadgeProps, 'status'> {
|
|
|
14
14
|
textColorHue?: ColorHue;
|
|
15
15
|
pulsing?: boolean;
|
|
16
16
|
customColor?: Color | DefaultColor;
|
|
17
|
-
}
|
|
17
|
+
};
|
package/dist/modules.d.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import '@testing-library/jest-dom
|
|
1
|
+
import '@testing-library/jest-dom';
|
package/dist/style/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ant-
|
|
1
|
+
.ant-badge{box-sizing:border-box;margin:0;padding:0;color:#6a7580;font-size:13px;font-variant:tabular-nums;line-height:1.38;list-style:none;font-feature-settings:'tnum';position:relative;display:inline-block;line-height:1}.ant-badge-count{z-index:auto;min-width:20px;height:20px;padding:0 6px;color:#fff;font-weight:400;font-size:11px;line-height:20px;white-space:nowrap;text-align:center;background:#ff4d4f;border-radius:10px;box-shadow:0 0 0 1px #fff}.ant-badge-count a,.ant-badge-count a:hover{color:#fff}.ant-badge-count-sm{min-width:14px;height:14px;padding:0;font-size:11px;line-height:14px;border-radius:7px}.ant-badge-multiple-words{padding:0 8px}.ant-badge-dot{z-index:auto;width:6px;min-width:6px;height:6px;background:#ff4d4f;border-radius:100%;box-shadow:0 0 0 1px #fff}.ant-badge-dot.ant-scroll-number{transition:background 1.5s}.ant-badge .ant-scroll-number-custom-component,.ant-badge-count,.ant-badge-dot{position:absolute;top:0;right:0;transform:translate(50%,-50%);transform-origin:100% 0}.ant-badge .ant-scroll-number-custom-component.anticon-spin,.ant-badge-count.anticon-spin,.ant-badge-dot.anticon-spin{animation:antBadgeLoadingCircle 1s infinite linear}.ant-badge-status{line-height:inherit;vertical-align:baseline}.ant-badge-status-dot{position:relative;top:-1px;display:inline-block;width:6px;height:6px;vertical-align:middle;border-radius:50%}.ant-badge-status-success{background-color:#54cb0b}.ant-badge-status-processing{position:relative;background-color:#1890ff}.ant-badge-status-processing::after{position:absolute;top:0;left:0;width:100%;height:100%;border:1px solid #1890ff;border-radius:50%;animation:antStatusProcessing 1.2s infinite ease-in-out;content:''}.ant-badge-status-default{background-color:#d9d9d9}.ant-badge-status-error{background-color:#f52922}.ant-badge-status-warning{background-color:#fab700}.ant-badge-status-pink{background:#eb2f96}.ant-badge-status-magenta{background:#eb2f96}.ant-badge-status-red{background:#f5222d}.ant-badge-status-volcano{background:#fa541c}.ant-badge-status-orange{background:#fa8c16}.ant-badge-status-yellow{background:#fadb14}.ant-badge-status-gold{background:#faad14}.ant-badge-status-cyan{background:#13c2c2}.ant-badge-status-lime{background:#a0d911}.ant-badge-status-green{background:#52c41a}.ant-badge-status-blue{background:#1890ff}.ant-badge-status-geekblue{background:#2f54eb}.ant-badge-status-purple{background:#722ed1}.ant-badge-status-text{margin-left:8px;color:#6a7580;font-size:13px}.ant-badge-zoom-appear,.ant-badge-zoom-enter{animation:antZoomBadgeIn .3s cubic-bezier(.12,.4,.29,1.46);animation-fill-mode:both}.ant-badge-zoom-leave{animation:antZoomBadgeOut .3s cubic-bezier(.71,-.46,.88,.6);animation-fill-mode:both}.ant-badge-not-a-wrapper .ant-badge-zoom-appear,.ant-badge-not-a-wrapper .ant-badge-zoom-enter{animation:antNoWrapperZoomBadgeIn .3s cubic-bezier(.12,.4,.29,1.46)}.ant-badge-not-a-wrapper .ant-badge-zoom-leave{animation:antNoWrapperZoomBadgeOut .3s cubic-bezier(.71,-.46,.88,.6)}.ant-badge-not-a-wrapper:not(.ant-badge-status){vertical-align:middle}.ant-badge-not-a-wrapper .ant-badge-count,.ant-badge-not-a-wrapper .ant-scroll-number-custom-component{transform:none}.ant-badge-not-a-wrapper .ant-scroll-number,.ant-badge-not-a-wrapper .ant-scroll-number-custom-component{position:relative;top:auto;display:block;transform-origin:50% 50%}@keyframes antStatusProcessing{0%{transform:scale(.8);opacity:.5}100%{transform:scale(2.4);opacity:0}}.ant-scroll-number{overflow:hidden;direction:ltr}.ant-scroll-number-only{position:relative;display:inline-block;height:20px;transition:all .3s cubic-bezier(.645,.045,.355,1);-webkit-transform-style:preserve-3d;-webkit-backface-visibility:hidden}.ant-scroll-number-only>p.ant-scroll-number-only-unit{height:20px;margin:0;-webkit-transform-style:preserve-3d;-webkit-backface-visibility:hidden}.ant-scroll-number-symbol{vertical-align:top}@keyframes antZoomBadgeIn{0%{transform:scale(0) translate(50%,-50%);opacity:0}100%{transform:scale(1) translate(50%,-50%)}}@keyframes antZoomBadgeOut{0%{transform:scale(1) translate(50%,-50%)}100%{transform:scale(0) translate(50%,-50%);opacity:0}}@keyframes antNoWrapperZoomBadgeIn{0%{transform:scale(0);opacity:0}100%{transform:scale(1)}}@keyframes antNoWrapperZoomBadgeOut{0%{transform:scale(1)}100%{transform:scale(0);opacity:0}}@keyframes antBadgeLoadingCircle{0%{transform-origin:50%}100%{transform:translate(50%,-50%) rotate(360deg);transform-origin:50%}}.ant-ribbon-wrapper{position:relative}.ant-ribbon{box-sizing:border-box;margin:0;padding:0;color:#6a7580;font-size:13px;font-variant:tabular-nums;line-height:1.38;list-style:none;font-feature-settings:'tnum';position:absolute;top:8px;height:22px;padding:0 8px;color:#fff;line-height:22px;white-space:nowrap;background-color:#0b68ff;border-radius:3px}.ant-ribbon-text{color:#fff}.ant-ribbon-corner{position:absolute;top:100%;width:8px;height:8px;color:currentcolor;border:4px solid;transform:scaleY(.75);transform-origin:top}.ant-ribbon-corner::after{position:absolute;top:-4px;left:-4px;width:inherit;height:inherit;color:rgba(0,0,0,.25);border:inherit;content:''}.ant-ribbon-color-pink{color:#eb2f96;background:#eb2f96}.ant-ribbon-color-magenta{color:#eb2f96;background:#eb2f96}.ant-ribbon-color-red{color:#f5222d;background:#f5222d}.ant-ribbon-color-volcano{color:#fa541c;background:#fa541c}.ant-ribbon-color-orange{color:#fa8c16;background:#fa8c16}.ant-ribbon-color-yellow{color:#fadb14;background:#fadb14}.ant-ribbon-color-gold{color:#faad14;background:#faad14}.ant-ribbon-color-cyan{color:#13c2c2;background:#13c2c2}.ant-ribbon-color-lime{color:#a0d911;background:#a0d911}.ant-ribbon-color-green{color:#52c41a;background:#52c41a}.ant-ribbon-color-blue{color:#1890ff;background:#1890ff}.ant-ribbon-color-geekblue{color:#2f54eb;background:#2f54eb}.ant-ribbon-color-purple{color:#722ed1;background:#722ed1}.ant-ribbon.ant-ribbon-placement-end{right:-8px;border-bottom-right-radius:0}.ant-ribbon.ant-ribbon-placement-end .ant-ribbon-corner{right:0;border-color:currentcolor transparent transparent currentcolor}.ant-ribbon.ant-ribbon-placement-start{left:-8px;border-bottom-left-radius:0}.ant-ribbon.ant-ribbon-placement-start .ant-ribbon-corner{left:0;border-color:currentcolor currentcolor transparent transparent}.ant-badge-rtl{direction:rtl}.ant-badge-rtl.ant-badge:not(.ant-badge-not-a-wrapper) .ant-badge-count,.ant-badge-rtl.ant-badge:not(.ant-badge-not-a-wrapper) .ant-badge-dot,.ant-badge-rtl.ant-badge:not(.ant-badge-not-a-wrapper) .ant-scroll-number-custom-component{right:auto;left:0;direction:ltr;transform:translate(-50%,-50%);transform-origin:0 0}.ant-badge-rtl.ant-badge:not(.ant-badge-not-a-wrapper) .ant-scroll-number-custom-component{right:auto;left:0;transform:translate(-50%,-50%);transform-origin:0 0}.ant-badge-rtl .ant-badge-status-text{margin-right:8px;margin-left:0}.ant-badge:not(.ant-badge-not-a-wrapper).ant-badge-rtl .ant-badge-zoom-appear,.ant-badge:not(.ant-badge-not-a-wrapper).ant-badge-rtl .ant-badge-zoom-enter{animation-name:antZoomBadgeInRtl}.ant-badge:not(.ant-badge-not-a-wrapper).ant-badge-rtl .ant-badge-zoom-leave{animation-name:antZoomBadgeOutRtl}.ant-ribbon-rtl{direction:rtl}.ant-ribbon-rtl.ant-ribbon-placement-end{right:unset;left:-8px;border-bottom-right-radius:3px;border-bottom-left-radius:0}.ant-ribbon-rtl.ant-ribbon-placement-end .ant-ribbon-corner{right:unset;left:0;border-color:currentcolor currentcolor transparent transparent}.ant-ribbon-rtl.ant-ribbon-placement-end .ant-ribbon-corner::after{border-color:currentcolor currentcolor transparent transparent}.ant-ribbon-rtl.ant-ribbon-placement-start{right:-8px;left:unset;border-bottom-right-radius:0;border-bottom-left-radius:3px}.ant-ribbon-rtl.ant-ribbon-placement-start .ant-ribbon-corner{right:0;left:unset;border-color:currentcolor transparent transparent currentcolor}.ant-ribbon-rtl.ant-ribbon-placement-start .ant-ribbon-corner::after{border-color:currentcolor transparent transparent currentcolor}@keyframes antZoomBadgeInRtl{0%{transform:scale(0) translate(-50%,-50%);opacity:0}100%{transform:scale(1) translate(-50%,-50%)}}@keyframes antZoomBadgeOutRtl{0%{transform:scale(1) translate(-50%,-50%)}100%{transform:scale(0) translate(-50%,-50%);opacity:0}}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@synerise/ds-badge",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.9.0",
|
|
4
4
|
"description": "Badge UI Component for the Synerise Design System",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"repository": "Synerise/synerise-design",
|
|
@@ -34,15 +34,15 @@
|
|
|
34
34
|
],
|
|
35
35
|
"types": "dist/index.d.ts",
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@synerise/ds-icon": "^0.
|
|
38
|
-
"@synerise/ds-typography": "^0.
|
|
39
|
-
"@synerise/ds-utils": "^0.
|
|
37
|
+
"@synerise/ds-icon": "^0.71.0",
|
|
38
|
+
"@synerise/ds-typography": "^0.17.0",
|
|
39
|
+
"@synerise/ds-utils": "^0.32.0"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"@synerise/ds-core": "*",
|
|
43
|
-
"antd": "4.
|
|
44
|
-
"react": ">=16.9.0 <=
|
|
45
|
-
"styled-components": "5.
|
|
43
|
+
"antd": "4.24.16",
|
|
44
|
+
"react": ">=16.9.0 <= 18.3.1",
|
|
45
|
+
"styled-components": "^5.3.3"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "fbde34e126b492edaf148e469ab96247a891d6df"
|
|
48
48
|
}
|