@atlaskit/progress-bar 3.0.1 → 3.1.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 +18 -0
- package/dist/cjs/components/progress-bar.compiled.css +8 -8
- package/dist/cjs/components/progress-bar.js +11 -11
- package/dist/es2019/components/progress-bar.compiled.css +7 -7
- package/dist/es2019/components/progress-bar.js +11 -11
- package/dist/esm/components/progress-bar.compiled.css +8 -8
- package/dist/esm/components/progress-bar.js +11 -11
- package/package.json +7 -6
- package/__perf__/default.tsx +0 -5
- package/__perf__/success.tsx +0 -5
- package/__perf__/transparent.tsx +0 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,23 @@
|
|
|
1
1
|
# @atlaskit/progress-bar
|
|
2
2
|
|
|
3
|
+
## 3.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#109060](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/109060)
|
|
8
|
+
[`4660ec858a305`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4660ec858a305) -
|
|
9
|
+
Update `React` from v16 to v18
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- Updated dependencies
|
|
14
|
+
|
|
15
|
+
## 3.0.2
|
|
16
|
+
|
|
17
|
+
### Patch Changes
|
|
18
|
+
|
|
19
|
+
- Updated dependencies
|
|
20
|
+
|
|
3
21
|
## 3.0.1
|
|
4
22
|
|
|
5
23
|
### Patch Changes
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
._11q71bh5{background:var(--ds-background-success-bold,#36b37e)}
|
|
3
|
-
._11q71jmj{background:var(--_1j2n3rv)}
|
|
4
|
-
._11q71vi8{background:var(--ds-background-neutral,rgba(9,30,66,.13))}
|
|
5
|
-
._11q71wby{background:var(--ds-background-neutral-bold,#42526e)}
|
|
6
|
-
._11q7vuon{background:var(--ds-surface,#fff)}
|
|
1
|
+
|
|
7
2
|
._2rko1sit{border-radius:var(--ds-border-radius,3px)}
|
|
8
3
|
._v564calv{transition:width .2s}
|
|
9
4
|
._y44v17o4{animation:var(--_1i6k0rf)}
|
|
10
|
-
._y44vr5uu{animation:var(--_1jqnm6n)}
|
|
11
|
-
._18m915vq{overflow-y:hidden}
|
|
5
|
+
._y44vr5uu{animation:var(--_1jqnm6n)}._18m915vq{overflow-y:hidden}
|
|
12
6
|
._1bsb1osq{width:100%}
|
|
13
7
|
._1e0c1ule{display:block}
|
|
14
8
|
._1reo15vq{overflow-x:hidden}
|
|
15
9
|
._4t3ii2wt{height:6px}
|
|
10
|
+
._bfhk18ht{background-color:var(--ds-background-inverse-subtle,hsla(0,0%,100%,.5))}
|
|
11
|
+
._bfhk1bh5{background-color:var(--ds-background-success-bold,#36b37e)}
|
|
12
|
+
._bfhk1jmj{background-color:var(--_1j2n3rv)}
|
|
13
|
+
._bfhk1vi8{background-color:var(--ds-background-neutral,rgba(9,30,66,.13))}
|
|
14
|
+
._bfhk1wby{background-color:var(--ds-background-neutral-bold,#42526e)}
|
|
15
|
+
._bfhkvuon{background-color:var(--ds-surface,#fff)}
|
|
16
16
|
._kqswh2mm{position:relative}
|
|
17
17
|
._kqswstnw{position:absolute}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* progress-bar.tsx generated by @compiled/babel-plugin v0.
|
|
1
|
+
/* progress-bar.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
2
2
|
"use strict";
|
|
3
3
|
|
|
4
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
@@ -16,14 +16,14 @@ var increasingBarAnimation = null;
|
|
|
16
16
|
var decreasingBarAnimation = null;
|
|
17
17
|
var containerStyles = null;
|
|
18
18
|
var containerAppearance = {
|
|
19
|
-
default: "
|
|
20
|
-
success: "
|
|
21
|
-
inverse: "
|
|
19
|
+
default: "_bfhk1vi8",
|
|
20
|
+
success: "_bfhk1vi8",
|
|
21
|
+
inverse: "_bfhk18ht"
|
|
22
22
|
};
|
|
23
23
|
var barAppearance = {
|
|
24
|
-
default: "
|
|
25
|
-
success: "
|
|
26
|
-
inverse: "
|
|
24
|
+
default: "_bfhk1wby",
|
|
25
|
+
success: "_bfhk1bh5",
|
|
26
|
+
inverse: "_bfhkvuon"
|
|
27
27
|
};
|
|
28
28
|
var barStyles = null;
|
|
29
29
|
var determinateBarStyles = null;
|
|
@@ -58,17 +58,17 @@ var ProgressBar = function ProgressBar(_ref) {
|
|
|
58
58
|
"aria-valuemax": MAX_VALUE,
|
|
59
59
|
tabIndex: 0,
|
|
60
60
|
"data-testid": testId,
|
|
61
|
-
className: (0, _runtime.ax)(["_1bsb1osq _4t3ii2wt _kqswh2mm
|
|
61
|
+
className: (0, _runtime.ax)(["_2rko1sit _1reo15vq _18m915vq _1bsb1osq _4t3ii2wt _kqswh2mm _bfhk1jmj", containerAppearance[appearance]]),
|
|
62
62
|
style: {
|
|
63
63
|
"--_1j2n3rv": (0, _runtime.ix)("var(--ds-background-neutral, ".concat(_colors.N40A, ")"))
|
|
64
64
|
}
|
|
65
65
|
}, isIndeterminate ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
|
|
66
|
-
className: (0, _runtime.ax)(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
66
|
+
className: (0, _runtime.ax)(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_y44vr5uu"]),
|
|
67
67
|
style: {
|
|
68
68
|
"--_1jqnm6n": (0, _runtime.ix)("".concat(increasingBarAnimation, " 2s infinite"))
|
|
69
69
|
}
|
|
70
70
|
}), /*#__PURE__*/_react.default.createElement("span", {
|
|
71
|
-
className: (0, _runtime.ax)(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
71
|
+
className: (0, _runtime.ax)(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_y44v17o4"]),
|
|
72
72
|
style: {
|
|
73
73
|
"--_1i6k0rf": (0, _runtime.ix)("".concat(decreasingBarAnimation, " 2s 0.5s infinite"))
|
|
74
74
|
}
|
|
@@ -76,7 +76,7 @@ var ProgressBar = function ProgressBar(_ref) {
|
|
|
76
76
|
style: {
|
|
77
77
|
width: "".concat(Number(value) * 100, "%")
|
|
78
78
|
},
|
|
79
|
-
className: (0, _runtime.ax)(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
79
|
+
className: (0, _runtime.ax)(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_v564calv"])
|
|
80
80
|
}));
|
|
81
81
|
};
|
|
82
82
|
var _default = exports.default = ProgressBar;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
._11q71bh5{background:var(--ds-background-success-bold,#36b37e)}
|
|
3
|
-
._11q71vi8{background:var(--ds-background-neutral,rgba(9,30,66,.13))}
|
|
4
|
-
._11q71wby{background:var(--ds-background-neutral-bold,#42526e)}
|
|
5
|
-
._11q7vuon{background:var(--ds-surface,#fff)}
|
|
1
|
+
|
|
6
2
|
._2rko1sit{border-radius:var(--ds-border-radius,3px)}
|
|
7
3
|
._v564calv{transition:width .2s}
|
|
8
4
|
._y44v1ud3{animation:kxdgi55 2s infinite}
|
|
9
|
-
._y44voiec{animation:k1h7rxld 2s .5s infinite}
|
|
10
|
-
._18m915vq{overflow-y:hidden}
|
|
5
|
+
._y44voiec{animation:k1h7rxld 2s .5s infinite}._18m915vq{overflow-y:hidden}
|
|
11
6
|
._1bsb1osq{width:100%}
|
|
12
7
|
._1e0c1ule{display:block}
|
|
13
8
|
._1reo15vq{overflow-x:hidden}
|
|
14
9
|
._4t3ii2wt{height:6px}
|
|
10
|
+
._bfhk18ht{background-color:var(--ds-background-inverse-subtle,hsla(0,0%,100%,.5))}
|
|
11
|
+
._bfhk1bh5{background-color:var(--ds-background-success-bold,#36b37e)}
|
|
12
|
+
._bfhk1vi8{background-color:var(--ds-background-neutral,rgba(9,30,66,.13))}
|
|
13
|
+
._bfhk1wby{background-color:var(--ds-background-neutral-bold,#42526e)}
|
|
14
|
+
._bfhkvuon{background-color:var(--ds-surface,#fff)}
|
|
15
15
|
._kqswh2mm{position:relative}
|
|
16
16
|
._kqswstnw{position:absolute}
|
|
17
17
|
@keyframes k1h7rxld{0%{left:-80%;width:80%}to{left:110%;width:10%}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* progress-bar.tsx generated by @compiled/babel-plugin v0.
|
|
1
|
+
/* progress-bar.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
2
2
|
import "./progress-bar.compiled.css";
|
|
3
3
|
import { ax, ix } from "@compiled/react/runtime";
|
|
4
4
|
import React from 'react';
|
|
@@ -9,14 +9,14 @@ const increasingBarAnimation = null;
|
|
|
9
9
|
const decreasingBarAnimation = null;
|
|
10
10
|
const containerStyles = null;
|
|
11
11
|
const containerAppearance = {
|
|
12
|
-
default: "
|
|
13
|
-
success: "
|
|
14
|
-
inverse: "
|
|
12
|
+
default: "_bfhk1vi8",
|
|
13
|
+
success: "_bfhk1vi8",
|
|
14
|
+
inverse: "_bfhk18ht"
|
|
15
15
|
};
|
|
16
16
|
const barAppearance = {
|
|
17
|
-
default: "
|
|
18
|
-
success: "
|
|
19
|
-
inverse: "
|
|
17
|
+
default: "_bfhk1wby",
|
|
18
|
+
success: "_bfhk1bh5",
|
|
19
|
+
inverse: "_bfhkvuon"
|
|
20
20
|
};
|
|
21
21
|
const barStyles = null;
|
|
22
22
|
const determinateBarStyles = null;
|
|
@@ -48,16 +48,16 @@ const ProgressBar = ({
|
|
|
48
48
|
"aria-valuemax": MAX_VALUE,
|
|
49
49
|
tabIndex: 0,
|
|
50
50
|
"data-testid": testId,
|
|
51
|
-
className: ax(["_1bsb1osq _4t3ii2wt _kqswh2mm
|
|
51
|
+
className: ax(["_2rko1sit _1reo15vq _18m915vq _1bsb1osq _4t3ii2wt _kqswh2mm _bfhk1vi8", containerAppearance[appearance]])
|
|
52
52
|
}, isIndeterminate ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
53
|
-
className: ax(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
53
|
+
className: ax(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_y44v1ud3"])
|
|
54
54
|
}), /*#__PURE__*/React.createElement("span", {
|
|
55
|
-
className: ax(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
55
|
+
className: ax(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_y44voiec"])
|
|
56
56
|
})) : /*#__PURE__*/React.createElement("span", {
|
|
57
57
|
style: {
|
|
58
58
|
width: `${Number(value) * 100}%`
|
|
59
59
|
},
|
|
60
|
-
className: ax(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
60
|
+
className: ax(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_v564calv"])
|
|
61
61
|
}));
|
|
62
62
|
};
|
|
63
63
|
export default ProgressBar;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
._11q71bh5{background:var(--ds-background-success-bold,#36b37e)}
|
|
3
|
-
._11q71jmj{background:var(--_1j2n3rv)}
|
|
4
|
-
._11q71vi8{background:var(--ds-background-neutral,rgba(9,30,66,.13))}
|
|
5
|
-
._11q71wby{background:var(--ds-background-neutral-bold,#42526e)}
|
|
6
|
-
._11q7vuon{background:var(--ds-surface,#fff)}
|
|
1
|
+
|
|
7
2
|
._2rko1sit{border-radius:var(--ds-border-radius,3px)}
|
|
8
3
|
._v564calv{transition:width .2s}
|
|
9
4
|
._y44v17o4{animation:var(--_1i6k0rf)}
|
|
10
|
-
._y44vr5uu{animation:var(--_1jqnm6n)}
|
|
11
|
-
._18m915vq{overflow-y:hidden}
|
|
5
|
+
._y44vr5uu{animation:var(--_1jqnm6n)}._18m915vq{overflow-y:hidden}
|
|
12
6
|
._1bsb1osq{width:100%}
|
|
13
7
|
._1e0c1ule{display:block}
|
|
14
8
|
._1reo15vq{overflow-x:hidden}
|
|
15
9
|
._4t3ii2wt{height:6px}
|
|
10
|
+
._bfhk18ht{background-color:var(--ds-background-inverse-subtle,hsla(0,0%,100%,.5))}
|
|
11
|
+
._bfhk1bh5{background-color:var(--ds-background-success-bold,#36b37e)}
|
|
12
|
+
._bfhk1jmj{background-color:var(--_1j2n3rv)}
|
|
13
|
+
._bfhk1vi8{background-color:var(--ds-background-neutral,rgba(9,30,66,.13))}
|
|
14
|
+
._bfhk1wby{background-color:var(--ds-background-neutral-bold,#42526e)}
|
|
15
|
+
._bfhkvuon{background-color:var(--ds-surface,#fff)}
|
|
16
16
|
._kqswh2mm{position:relative}
|
|
17
17
|
._kqswstnw{position:absolute}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* progress-bar.tsx generated by @compiled/babel-plugin v0.
|
|
1
|
+
/* progress-bar.tsx generated by @compiled/babel-plugin v0.36.0 */
|
|
2
2
|
import "./progress-bar.compiled.css";
|
|
3
3
|
import { ax, ix } from "@compiled/react/runtime";
|
|
4
4
|
import React from 'react';
|
|
@@ -9,14 +9,14 @@ var increasingBarAnimation = null;
|
|
|
9
9
|
var decreasingBarAnimation = null;
|
|
10
10
|
var containerStyles = null;
|
|
11
11
|
var containerAppearance = {
|
|
12
|
-
default: "
|
|
13
|
-
success: "
|
|
14
|
-
inverse: "
|
|
12
|
+
default: "_bfhk1vi8",
|
|
13
|
+
success: "_bfhk1vi8",
|
|
14
|
+
inverse: "_bfhk18ht"
|
|
15
15
|
};
|
|
16
16
|
var barAppearance = {
|
|
17
|
-
default: "
|
|
18
|
-
success: "
|
|
19
|
-
inverse: "
|
|
17
|
+
default: "_bfhk1wby",
|
|
18
|
+
success: "_bfhk1bh5",
|
|
19
|
+
inverse: "_bfhkvuon"
|
|
20
20
|
};
|
|
21
21
|
var barStyles = null;
|
|
22
22
|
var determinateBarStyles = null;
|
|
@@ -51,17 +51,17 @@ var ProgressBar = function ProgressBar(_ref) {
|
|
|
51
51
|
"aria-valuemax": MAX_VALUE,
|
|
52
52
|
tabIndex: 0,
|
|
53
53
|
"data-testid": testId,
|
|
54
|
-
className: ax(["_1bsb1osq _4t3ii2wt _kqswh2mm
|
|
54
|
+
className: ax(["_2rko1sit _1reo15vq _18m915vq _1bsb1osq _4t3ii2wt _kqswh2mm _bfhk1jmj", containerAppearance[appearance]]),
|
|
55
55
|
style: {
|
|
56
56
|
"--_1j2n3rv": ix("var(--ds-background-neutral, ".concat(N40A, ")"))
|
|
57
57
|
}
|
|
58
58
|
}, isIndeterminate ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
59
|
-
className: ax(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
59
|
+
className: ax(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_y44vr5uu"]),
|
|
60
60
|
style: {
|
|
61
61
|
"--_1jqnm6n": ix("".concat(increasingBarAnimation, " 2s infinite"))
|
|
62
62
|
}
|
|
63
63
|
}), /*#__PURE__*/React.createElement("span", {
|
|
64
|
-
className: ax(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
64
|
+
className: ax(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_y44v17o4"]),
|
|
65
65
|
style: {
|
|
66
66
|
"--_1i6k0rf": ix("".concat(decreasingBarAnimation, " 2s 0.5s infinite"))
|
|
67
67
|
}
|
|
@@ -69,7 +69,7 @@ var ProgressBar = function ProgressBar(_ref) {
|
|
|
69
69
|
style: {
|
|
70
70
|
width: "".concat(Number(value) * 100, "%")
|
|
71
71
|
},
|
|
72
|
-
className: ax(["_1e0c1ule _4t3ii2wt _kqswstnw
|
|
72
|
+
className: ax(["_2rko1sit _1e0c1ule _4t3ii2wt _kqswstnw", barAppearance[appearance], "_v564calv"])
|
|
73
73
|
}));
|
|
74
74
|
};
|
|
75
75
|
export default ProgressBar;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/progress-bar",
|
|
3
|
-
"version": "3.0
|
|
3
|
+
"version": "3.1.0",
|
|
4
4
|
"description": "A progress bar communicates the status of a system process.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -25,12 +25,12 @@
|
|
|
25
25
|
"runReact18": true,
|
|
26
26
|
"website": {
|
|
27
27
|
"name": "Progress bar",
|
|
28
|
-
"category": "
|
|
28
|
+
"category": "Loading"
|
|
29
29
|
}
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@atlaskit/theme": "^14.
|
|
33
|
-
"@atlaskit/tokens": "^
|
|
32
|
+
"@atlaskit/theme": "^14.1.0",
|
|
33
|
+
"@atlaskit/tokens": "^3.3.0",
|
|
34
34
|
"@babel/runtime": "^7.0.0",
|
|
35
35
|
"@compiled/react": "^0.18.1"
|
|
36
36
|
},
|
|
@@ -39,10 +39,11 @@
|
|
|
39
39
|
},
|
|
40
40
|
"devDependencies": {
|
|
41
41
|
"@af/accessibility-testing": "*",
|
|
42
|
+
"@af/integration-testing": "*",
|
|
42
43
|
"@af/visual-regression": "*",
|
|
43
44
|
"@atlaskit/visual-regression": "*",
|
|
44
|
-
"@testing-library/react": "^
|
|
45
|
-
"react-dom": "^
|
|
45
|
+
"@testing-library/react": "^13.4.0",
|
|
46
|
+
"react-dom": "^18.2.0",
|
|
46
47
|
"typescript": "~5.4.2"
|
|
47
48
|
},
|
|
48
49
|
"keywords": [
|
package/__perf__/default.tsx
DELETED
package/__perf__/success.tsx
DELETED