@atlaskit/lozenge 11.12.1 → 11.12.3
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 +15 -0
- package/dist/cjs/compiled/index.compiled.css +0 -12
- package/dist/cjs/compiled/index.js +19 -21
- package/dist/es2019/compiled/index.compiled.css +0 -12
- package/dist/es2019/compiled/index.js +19 -21
- package/dist/esm/compiled/index.compiled.css +0 -12
- package/dist/esm/compiled/index.js +19 -21
- package/package.json +8 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @atlaskit/lozenge
|
|
2
2
|
|
|
3
|
+
## 11.12.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 11.12.2
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#158114](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/158114)
|
|
14
|
+
[`01676a379617b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/01676a379617b) -
|
|
15
|
+
The experimental compiled variant makes use of the compiled Primitives variant.
|
|
16
|
+
- Updated dependencies
|
|
17
|
+
|
|
3
18
|
## 11.12.1
|
|
4
19
|
|
|
5
20
|
### Patch Changes
|
|
@@ -15,24 +15,12 @@
|
|
|
15
15
|
._1reo15vq{overflow-x:hidden}
|
|
16
16
|
._1wyb1skh{font-size:11px}
|
|
17
17
|
._bfhk1366{background-color:#fd9891}
|
|
18
|
-
._bfhk14wj{background-color:var(--ds-background-information-bold,#0c66e4)}
|
|
19
|
-
._bfhk190i{background-color:var(--ds-background-warning-bold,#f5cd47)}
|
|
20
18
|
._bfhk1fkg{background-color:#dddee1}
|
|
21
|
-
._bfhk1gly{background-color:var(--ds-background-danger,#ffeceb)}
|
|
22
|
-
._bfhk1lri{background-color:var(--ds-background-discovery-bold,#6e5dc6)}
|
|
23
|
-
._bfhk1nvp{background-color:var(--ds-background-discovery,#f3f0ff)}
|
|
24
|
-
._bfhk1tzq{background-color:var(--ds-background-warning,#fff7d6)}
|
|
25
19
|
._bfhk1ymo{background-color:#8fb8f6}
|
|
26
|
-
._bfhk33gi{background-color:var(--ds-background-information,#e9f2ff)}
|
|
27
20
|
._bfhk3uhp{background-color:#b3df72}
|
|
28
|
-
._bfhk8emd{background-color:var(--ds-background-success-bold,#1f845a)}
|
|
29
|
-
._bfhkcdhy{background-color:var(--ds-background-neutral-bold,#44546f)}
|
|
30
|
-
._bfhkm7j4{background-color:var(--ds-background-neutral,#091e420f)}
|
|
31
|
-
._bfhkmv6i{background-color:var(--ds-background-success,#dcfff1)}
|
|
32
21
|
._bfhkshej{background-color:#d8a0f7}
|
|
33
22
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
34
23
|
._bfhkxmjf{background-color:#f9c84e}
|
|
35
|
-
._bfhkybec{background-color:var(--ds-background-danger-bold,#c9372c)}
|
|
36
24
|
._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
|
|
37
25
|
._ect41vq6{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif}
|
|
38
26
|
._k48pmoej{font-weight:var(--ds-font-weight-bold,700)}
|
|
@@ -11,24 +11,11 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
11
11
|
var React = _react;
|
|
12
12
|
var _runtime = require("@compiled/react/runtime");
|
|
13
13
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
14
|
-
var
|
|
14
|
+
var _compiled = require("@atlaskit/primitives/compiled");
|
|
15
15
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
16
16
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
17
17
|
var stylesOld = {
|
|
18
18
|
container: "_1e0c116y _2rkoglpi _1kz6184x _kqswpfqs _1reo15vq _18m915vq _18zr1b66 _vchhusvi",
|
|
19
|
-
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c",
|
|
20
|
-
'bg.bold.default': "_bfhkcdhy",
|
|
21
|
-
'bg.bold.inprogress': "_bfhk14wj",
|
|
22
|
-
'bg.bold.moved': "_bfhk190i",
|
|
23
|
-
'bg.bold.new': "_bfhk1lri",
|
|
24
|
-
'bg.bold.removed': "_bfhkybec",
|
|
25
|
-
'bg.bold.success': "_bfhk8emd",
|
|
26
|
-
'bg.subtle.default': "_bfhkm7j4",
|
|
27
|
-
'bg.subtle.inprogress': "_bfhk33gi",
|
|
28
|
-
'bg.subtle.moved': "_bfhk1tzq",
|
|
29
|
-
'bg.subtle.new': "_bfhk1nvp",
|
|
30
|
-
'bg.subtle.removed': "_bfhk1gly",
|
|
31
|
-
'bg.subtle.success': "_bfhkmv6i",
|
|
32
19
|
'text.bold.default': "_syaz15cr",
|
|
33
20
|
'text.bold.inprogress': "_syaz15cr",
|
|
34
21
|
'text.bold.moved': "_syazal3n",
|
|
@@ -42,6 +29,11 @@ var stylesOld = {
|
|
|
42
29
|
'text.subtle.removed': "_syaz1ick",
|
|
43
30
|
'text.subtle.success': "_syaz17fi"
|
|
44
31
|
};
|
|
32
|
+
|
|
33
|
+
// NOTE: This is isolated to avoid breaking the bounded `stylesOld` interface as they do not fall within the Design System.
|
|
34
|
+
var stylesOldUnbounded = {
|
|
35
|
+
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c"
|
|
36
|
+
};
|
|
45
37
|
var backgroundColorsOld = {
|
|
46
38
|
bold: {
|
|
47
39
|
default: 'color.background.neutral.bold',
|
|
@@ -60,6 +52,11 @@ var backgroundColorsOld = {
|
|
|
60
52
|
success: 'color.background.success'
|
|
61
53
|
}
|
|
62
54
|
};
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* TODO: We should be using our bounded `cssMap` here, but most of
|
|
58
|
+
* these styles from the visual refresh are not in the Design System.
|
|
59
|
+
*/
|
|
63
60
|
var stylesNew = {
|
|
64
61
|
container: "_1e0c116y _vchhusvi _kqswpfqs _1kz6184x _2rko1l7b _1reo15vq _18m915vq _bozg1b66 _y4ti1b66",
|
|
65
62
|
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c",
|
|
@@ -128,15 +125,16 @@ var Lozenge = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
128
125
|
className: (0, _runtime.ax)([stylesNew.text, stylesNew["text.".concat(appearanceStyle)]])
|
|
129
126
|
}, children));
|
|
130
127
|
}
|
|
131
|
-
return /*#__PURE__*/React.createElement(
|
|
132
|
-
|
|
133
|
-
|
|
128
|
+
return /*#__PURE__*/React.createElement(_compiled.Box, {
|
|
129
|
+
as: "span",
|
|
130
|
+
backgroundColor: backgroundColorsOld[appearanceStyle][appearanceType],
|
|
134
131
|
style: {
|
|
135
132
|
backgroundColor: style === null || style === void 0 ? void 0 : style.backgroundColor,
|
|
136
133
|
maxWidth: maxWidthIsPc ? maxWidth : '100%'
|
|
137
134
|
},
|
|
138
|
-
"
|
|
139
|
-
|
|
135
|
+
paddingInline: "space.050",
|
|
136
|
+
xcss: stylesOld.container,
|
|
137
|
+
testId: testId
|
|
140
138
|
}, /*#__PURE__*/React.createElement("span", {
|
|
141
139
|
style: {
|
|
142
140
|
color: style === null || style === void 0 ? void 0 : style.color,
|
|
@@ -144,8 +142,8 @@ var Lozenge = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
144
142
|
maxWidth: maxWidthIsPc ? '100%' : "calc(".concat(maxWidthValue, " - ", "var(--ds-space-100, 8px)", ")")
|
|
145
143
|
},
|
|
146
144
|
"data-testid": testId && "".concat(testId, "--text"),
|
|
147
|
-
className: (0, _runtime.ax)([
|
|
148
|
-
}, children))
|
|
145
|
+
className: (0, _runtime.ax)([stylesOldUnbounded.text, stylesOld["text.".concat(appearanceStyle, ".").concat(appearanceType)]])
|
|
146
|
+
}, children));
|
|
149
147
|
});
|
|
150
148
|
Lozenge.displayName = 'Lozenge';
|
|
151
149
|
var _default = exports.default = Lozenge;
|
|
@@ -15,24 +15,12 @@
|
|
|
15
15
|
._1reo15vq{overflow-x:hidden}
|
|
16
16
|
._1wyb1skh{font-size:11px}
|
|
17
17
|
._bfhk1366{background-color:#fd9891}
|
|
18
|
-
._bfhk14wj{background-color:var(--ds-background-information-bold,#0c66e4)}
|
|
19
|
-
._bfhk190i{background-color:var(--ds-background-warning-bold,#f5cd47)}
|
|
20
18
|
._bfhk1fkg{background-color:#dddee1}
|
|
21
|
-
._bfhk1gly{background-color:var(--ds-background-danger,#ffeceb)}
|
|
22
|
-
._bfhk1lri{background-color:var(--ds-background-discovery-bold,#6e5dc6)}
|
|
23
|
-
._bfhk1nvp{background-color:var(--ds-background-discovery,#f3f0ff)}
|
|
24
|
-
._bfhk1tzq{background-color:var(--ds-background-warning,#fff7d6)}
|
|
25
19
|
._bfhk1ymo{background-color:#8fb8f6}
|
|
26
|
-
._bfhk33gi{background-color:var(--ds-background-information,#e9f2ff)}
|
|
27
20
|
._bfhk3uhp{background-color:#b3df72}
|
|
28
|
-
._bfhk8emd{background-color:var(--ds-background-success-bold,#1f845a)}
|
|
29
|
-
._bfhkcdhy{background-color:var(--ds-background-neutral-bold,#44546f)}
|
|
30
|
-
._bfhkm7j4{background-color:var(--ds-background-neutral,#091e420f)}
|
|
31
|
-
._bfhkmv6i{background-color:var(--ds-background-success,#dcfff1)}
|
|
32
21
|
._bfhkshej{background-color:#d8a0f7}
|
|
33
22
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
34
23
|
._bfhkxmjf{background-color:#f9c84e}
|
|
35
|
-
._bfhkybec{background-color:var(--ds-background-danger-bold,#c9372c)}
|
|
36
24
|
._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
|
|
37
25
|
._ect41vq6{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif}
|
|
38
26
|
._k48pmoej{font-weight:var(--ds-font-weight-bold,700)}
|
|
@@ -4,22 +4,9 @@ import * as React from 'react';
|
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
5
|
import { memo, useMemo } from 'react';
|
|
6
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
|
-
import {
|
|
7
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
8
8
|
const stylesOld = {
|
|
9
9
|
container: "_1e0c116y _2rkoglpi _1kz6184x _kqswpfqs _1reo15vq _18m915vq _18zr1b66 _vchhusvi",
|
|
10
|
-
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c",
|
|
11
|
-
'bg.bold.default': "_bfhkcdhy",
|
|
12
|
-
'bg.bold.inprogress': "_bfhk14wj",
|
|
13
|
-
'bg.bold.moved': "_bfhk190i",
|
|
14
|
-
'bg.bold.new': "_bfhk1lri",
|
|
15
|
-
'bg.bold.removed': "_bfhkybec",
|
|
16
|
-
'bg.bold.success': "_bfhk8emd",
|
|
17
|
-
'bg.subtle.default': "_bfhkm7j4",
|
|
18
|
-
'bg.subtle.inprogress': "_bfhk33gi",
|
|
19
|
-
'bg.subtle.moved': "_bfhk1tzq",
|
|
20
|
-
'bg.subtle.new': "_bfhk1nvp",
|
|
21
|
-
'bg.subtle.removed': "_bfhk1gly",
|
|
22
|
-
'bg.subtle.success': "_bfhkmv6i",
|
|
23
10
|
'text.bold.default': "_syaz15cr",
|
|
24
11
|
'text.bold.inprogress': "_syaz15cr",
|
|
25
12
|
'text.bold.moved': "_syazal3n",
|
|
@@ -33,6 +20,11 @@ const stylesOld = {
|
|
|
33
20
|
'text.subtle.removed': "_syaz1ick",
|
|
34
21
|
'text.subtle.success': "_syaz17fi"
|
|
35
22
|
};
|
|
23
|
+
|
|
24
|
+
// NOTE: This is isolated to avoid breaking the bounded `stylesOld` interface as they do not fall within the Design System.
|
|
25
|
+
const stylesOldUnbounded = {
|
|
26
|
+
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c"
|
|
27
|
+
};
|
|
36
28
|
const backgroundColorsOld = {
|
|
37
29
|
bold: {
|
|
38
30
|
default: 'color.background.neutral.bold',
|
|
@@ -51,6 +43,11 @@ const backgroundColorsOld = {
|
|
|
51
43
|
success: 'color.background.success'
|
|
52
44
|
}
|
|
53
45
|
};
|
|
46
|
+
|
|
47
|
+
/**
|
|
48
|
+
* TODO: We should be using our bounded `cssMap` here, but most of
|
|
49
|
+
* these styles from the visual refresh are not in the Design System.
|
|
50
|
+
*/
|
|
54
51
|
const stylesNew = {
|
|
55
52
|
container: "_1e0c116y _vchhusvi _kqswpfqs _1kz6184x _2rko1l7b _1reo15vq _18m915vq _bozg1b66 _y4ti1b66",
|
|
56
53
|
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c",
|
|
@@ -115,15 +112,16 @@ const Lozenge = /*#__PURE__*/memo(({
|
|
|
115
112
|
className: ax([stylesNew.text, stylesNew[`text.${appearanceStyle}`]])
|
|
116
113
|
}, children));
|
|
117
114
|
}
|
|
118
|
-
return /*#__PURE__*/React.createElement(
|
|
119
|
-
|
|
120
|
-
|
|
115
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
116
|
+
as: "span",
|
|
117
|
+
backgroundColor: backgroundColorsOld[appearanceStyle][appearanceType],
|
|
121
118
|
style: {
|
|
122
119
|
backgroundColor: style === null || style === void 0 ? void 0 : style.backgroundColor,
|
|
123
120
|
maxWidth: maxWidthIsPc ? maxWidth : '100%'
|
|
124
121
|
},
|
|
125
|
-
"
|
|
126
|
-
|
|
122
|
+
paddingInline: "space.050",
|
|
123
|
+
xcss: stylesOld.container,
|
|
124
|
+
testId: testId
|
|
127
125
|
}, /*#__PURE__*/React.createElement("span", {
|
|
128
126
|
style: {
|
|
129
127
|
color: style === null || style === void 0 ? void 0 : style.color,
|
|
@@ -131,8 +129,8 @@ const Lozenge = /*#__PURE__*/memo(({
|
|
|
131
129
|
maxWidth: maxWidthIsPc ? '100%' : `calc(${maxWidthValue} - ${"var(--ds-space-100, 8px)"})`
|
|
132
130
|
},
|
|
133
131
|
"data-testid": testId && `${testId}--text`,
|
|
134
|
-
className: ax([
|
|
135
|
-
}, children))
|
|
132
|
+
className: ax([stylesOldUnbounded.text, stylesOld[`text.${appearanceStyle}.${appearanceType}`]])
|
|
133
|
+
}, children));
|
|
136
134
|
});
|
|
137
135
|
Lozenge.displayName = 'Lozenge';
|
|
138
136
|
export default Lozenge;
|
|
@@ -15,24 +15,12 @@
|
|
|
15
15
|
._1reo15vq{overflow-x:hidden}
|
|
16
16
|
._1wyb1skh{font-size:11px}
|
|
17
17
|
._bfhk1366{background-color:#fd9891}
|
|
18
|
-
._bfhk14wj{background-color:var(--ds-background-information-bold,#0c66e4)}
|
|
19
|
-
._bfhk190i{background-color:var(--ds-background-warning-bold,#f5cd47)}
|
|
20
18
|
._bfhk1fkg{background-color:#dddee1}
|
|
21
|
-
._bfhk1gly{background-color:var(--ds-background-danger,#ffeceb)}
|
|
22
|
-
._bfhk1lri{background-color:var(--ds-background-discovery-bold,#6e5dc6)}
|
|
23
|
-
._bfhk1nvp{background-color:var(--ds-background-discovery,#f3f0ff)}
|
|
24
|
-
._bfhk1tzq{background-color:var(--ds-background-warning,#fff7d6)}
|
|
25
19
|
._bfhk1ymo{background-color:#8fb8f6}
|
|
26
|
-
._bfhk33gi{background-color:var(--ds-background-information,#e9f2ff)}
|
|
27
20
|
._bfhk3uhp{background-color:#b3df72}
|
|
28
|
-
._bfhk8emd{background-color:var(--ds-background-success-bold,#1f845a)}
|
|
29
|
-
._bfhkcdhy{background-color:var(--ds-background-neutral-bold,#44546f)}
|
|
30
|
-
._bfhkm7j4{background-color:var(--ds-background-neutral,#091e420f)}
|
|
31
|
-
._bfhkmv6i{background-color:var(--ds-background-success,#dcfff1)}
|
|
32
21
|
._bfhkshej{background-color:#d8a0f7}
|
|
33
22
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
34
23
|
._bfhkxmjf{background-color:#f9c84e}
|
|
35
|
-
._bfhkybec{background-color:var(--ds-background-danger-bold,#c9372c)}
|
|
36
24
|
._bozg1b66{padding-inline-start:var(--ds-space-050,4px)}
|
|
37
25
|
._ect41vq6{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,system-ui,"Helvetica Neue",sans-serif}
|
|
38
26
|
._k48pmoej{font-weight:var(--ds-font-weight-bold,700)}
|
|
@@ -4,22 +4,9 @@ import * as React from 'react';
|
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
5
|
import { memo, useMemo } from 'react';
|
|
6
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
|
-
import {
|
|
7
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
8
8
|
var stylesOld = {
|
|
9
9
|
container: "_1e0c116y _2rkoglpi _1kz6184x _kqswpfqs _1reo15vq _18m915vq _18zr1b66 _vchhusvi",
|
|
10
|
-
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c",
|
|
11
|
-
'bg.bold.default': "_bfhkcdhy",
|
|
12
|
-
'bg.bold.inprogress': "_bfhk14wj",
|
|
13
|
-
'bg.bold.moved': "_bfhk190i",
|
|
14
|
-
'bg.bold.new': "_bfhk1lri",
|
|
15
|
-
'bg.bold.removed': "_bfhkybec",
|
|
16
|
-
'bg.bold.success': "_bfhk8emd",
|
|
17
|
-
'bg.subtle.default': "_bfhkm7j4",
|
|
18
|
-
'bg.subtle.inprogress': "_bfhk33gi",
|
|
19
|
-
'bg.subtle.moved': "_bfhk1tzq",
|
|
20
|
-
'bg.subtle.new': "_bfhk1nvp",
|
|
21
|
-
'bg.subtle.removed': "_bfhk1gly",
|
|
22
|
-
'bg.subtle.success': "_bfhkmv6i",
|
|
23
10
|
'text.bold.default': "_syaz15cr",
|
|
24
11
|
'text.bold.inprogress': "_syaz15cr",
|
|
25
12
|
'text.bold.moved': "_syazal3n",
|
|
@@ -33,6 +20,11 @@ var stylesOld = {
|
|
|
33
20
|
'text.subtle.removed': "_syaz1ick",
|
|
34
21
|
'text.subtle.success': "_syaz17fi"
|
|
35
22
|
};
|
|
23
|
+
|
|
24
|
+
// NOTE: This is isolated to avoid breaking the bounded `stylesOld` interface as they do not fall within the Design System.
|
|
25
|
+
var stylesOldUnbounded = {
|
|
26
|
+
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c"
|
|
27
|
+
};
|
|
36
28
|
var backgroundColorsOld = {
|
|
37
29
|
bold: {
|
|
38
30
|
default: 'color.background.neutral.bold',
|
|
@@ -51,6 +43,11 @@ var backgroundColorsOld = {
|
|
|
51
43
|
success: 'color.background.success'
|
|
52
44
|
}
|
|
53
45
|
};
|
|
46
|
+
|
|
47
|
+
/**
|
|
48
|
+
* TODO: We should be using our bounded `cssMap` here, but most of
|
|
49
|
+
* these styles from the visual refresh are not in the Design System.
|
|
50
|
+
*/
|
|
54
51
|
var stylesNew = {
|
|
55
52
|
container: "_1e0c116y _vchhusvi _kqswpfqs _1kz6184x _2rko1l7b _1reo15vq _18m915vq _bozg1b66 _y4ti1b66",
|
|
56
53
|
text: "_ect41vq6 _1wyb1skh _zg8l4jg8 _k48pmoej _vwz47vkz _1reo15vq _18m915vq _1bto1l2s _1p1dangw _o5721q9c",
|
|
@@ -119,15 +116,16 @@ var Lozenge = /*#__PURE__*/memo(function (_ref) {
|
|
|
119
116
|
className: ax([stylesNew.text, stylesNew["text.".concat(appearanceStyle)]])
|
|
120
117
|
}, children));
|
|
121
118
|
}
|
|
122
|
-
return /*#__PURE__*/React.createElement(
|
|
123
|
-
|
|
124
|
-
|
|
119
|
+
return /*#__PURE__*/React.createElement(Box, {
|
|
120
|
+
as: "span",
|
|
121
|
+
backgroundColor: backgroundColorsOld[appearanceStyle][appearanceType],
|
|
125
122
|
style: {
|
|
126
123
|
backgroundColor: style === null || style === void 0 ? void 0 : style.backgroundColor,
|
|
127
124
|
maxWidth: maxWidthIsPc ? maxWidth : '100%'
|
|
128
125
|
},
|
|
129
|
-
"
|
|
130
|
-
|
|
126
|
+
paddingInline: "space.050",
|
|
127
|
+
xcss: stylesOld.container,
|
|
128
|
+
testId: testId
|
|
131
129
|
}, /*#__PURE__*/React.createElement("span", {
|
|
132
130
|
style: {
|
|
133
131
|
color: style === null || style === void 0 ? void 0 : style.color,
|
|
@@ -135,8 +133,8 @@ var Lozenge = /*#__PURE__*/memo(function (_ref) {
|
|
|
135
133
|
maxWidth: maxWidthIsPc ? '100%' : "calc(".concat(maxWidthValue, " - ", "var(--ds-space-100, 8px)", ")")
|
|
136
134
|
},
|
|
137
135
|
"data-testid": testId && "".concat(testId, "--text"),
|
|
138
|
-
className: ax([
|
|
139
|
-
}, children))
|
|
136
|
+
className: ax([stylesOldUnbounded.text, stylesOld["text.".concat(appearanceStyle, ".").concat(appearanceType)]])
|
|
137
|
+
}, children));
|
|
140
138
|
});
|
|
141
139
|
Lozenge.displayName = 'Lozenge';
|
|
142
140
|
export default Lozenge;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/lozenge",
|
|
3
|
-
"version": "11.12.
|
|
3
|
+
"version": "11.12.3",
|
|
4
4
|
"description": "A lozenge is a visual indicator used to highlight an item's status for quick recognition.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -33,18 +33,19 @@
|
|
|
33
33
|
"team": "Design System Team",
|
|
34
34
|
"website": {
|
|
35
35
|
"name": "Lozenge",
|
|
36
|
-
"category": "
|
|
36
|
+
"category": "Status indicators"
|
|
37
37
|
},
|
|
38
38
|
"runReact18": true
|
|
39
39
|
},
|
|
40
40
|
"dependencies": {
|
|
41
41
|
"@atlaskit/codemod-utils": "^4.2.0",
|
|
42
|
-
"@atlaskit/css": "^0.
|
|
42
|
+
"@atlaskit/css": "^0.7.0",
|
|
43
43
|
"@atlaskit/platform-feature-flags": "^0.3.0",
|
|
44
|
-
"@atlaskit/primitives": "^
|
|
44
|
+
"@atlaskit/primitives": "^13.3.0",
|
|
45
45
|
"@atlaskit/theme": "^14.0.0",
|
|
46
|
-
"@atlaskit/tokens": "^2.
|
|
46
|
+
"@atlaskit/tokens": "^2.4.0",
|
|
47
47
|
"@babel/runtime": "^7.0.0",
|
|
48
|
+
"@compiled/react": "^0.18.1",
|
|
48
49
|
"@emotion/react": "^11.7.1"
|
|
49
50
|
},
|
|
50
51
|
"peerDependencies": {
|
|
@@ -54,8 +55,8 @@
|
|
|
54
55
|
"@af/accessibility-testing": "*",
|
|
55
56
|
"@af/integration-testing": "*",
|
|
56
57
|
"@af/visual-regression": "*",
|
|
57
|
-
"@atlaskit/ds-lib": "^3.
|
|
58
|
-
"@atlaskit/heading": "^
|
|
58
|
+
"@atlaskit/ds-lib": "^3.3.0",
|
|
59
|
+
"@atlaskit/heading": "^4.0.0",
|
|
59
60
|
"@atlaskit/ssr": "*",
|
|
60
61
|
"@atlaskit/visual-regression": "*",
|
|
61
62
|
"@testing-library/react": "^12.1.5",
|