@atlaskit/dropdown-menu 16.3.21 → 16.3.22
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 +8 -0
- package/dist/cjs/internal/components/checkbox-icon.compiled.css +4 -0
- package/dist/cjs/internal/components/checkbox-icon.js +47 -0
- package/dist/cjs/internal/components/radio-icon.compiled.css +4 -0
- package/dist/cjs/internal/components/radio-icon.js +46 -0
- package/dist/es2019/internal/components/checkbox-icon.compiled.css +4 -0
- package/dist/es2019/internal/components/checkbox-icon.js +47 -0
- package/dist/es2019/internal/components/radio-icon.compiled.css +4 -0
- package/dist/es2019/internal/components/radio-icon.js +46 -0
- package/dist/esm/internal/components/checkbox-icon.compiled.css +4 -0
- package/dist/esm/internal/components/checkbox-icon.js +47 -0
- package/dist/esm/internal/components/radio-icon.compiled.css +4 -0
- package/dist/esm/internal/components/radio-icon.js +46 -0
- package/dist/types/internal/components/checkbox-icon.d.ts +5 -0
- package/dist/types/internal/components/radio-icon.d.ts +5 -0
- package/dist/types-ts4.5/internal/components/checkbox-icon.d.ts +5 -0
- package/dist/types-ts4.5/internal/components/radio-icon.d.ts +5 -0
- package/package.json +7 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/dropdown-menu
|
|
2
2
|
|
|
3
|
+
## 16.3.22
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`3ab827e6c6df2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3ab827e6c6df2) -
|
|
8
|
+
Changing internal use of SVG icons behind a feature flag.
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
3
11
|
## 16.3.21
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/* checkbox-icon.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
@@ -5,10 +6,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
require("./checkbox-icon.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
8
11
|
var _react = _interopRequireDefault(require("react"));
|
|
9
12
|
var _svg = _interopRequireDefault(require("@atlaskit/icon/svg"));
|
|
10
13
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
11
14
|
var _colors = require("@atlaskit/theme/colors");
|
|
15
|
+
var svgStyles = null;
|
|
16
|
+
|
|
12
17
|
/**
|
|
13
18
|
* __Checkbox icon__
|
|
14
19
|
*
|
|
@@ -18,6 +23,48 @@ var _colors = require("@atlaskit/theme/colors");
|
|
|
18
23
|
*/
|
|
19
24
|
var CheckboxIcon = function CheckboxIcon(_ref) {
|
|
20
25
|
var checked = _ref.checked;
|
|
26
|
+
if ((0, _platformFeatureFlags.fg)('platform-custom-icon-migration')) {
|
|
27
|
+
return /*#__PURE__*/_react.default.createElement("svg", {
|
|
28
|
+
width: 24,
|
|
29
|
+
height: 24,
|
|
30
|
+
viewBox: "0 0 24 24",
|
|
31
|
+
style: {
|
|
32
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
33
|
+
color: checked ? "var(--ds-background-selected-bold, ".concat(_colors.B400, ")") : "var(--ds-background-input, ".concat(_colors.N10, ")"),
|
|
34
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
35
|
+
fill: checked ? "var(--ds-icon-inverse, ".concat(_colors.N10, ")") : 'transparent'
|
|
36
|
+
},
|
|
37
|
+
role: "presentation",
|
|
38
|
+
className: (0, _runtime.ax)(["_1reo15vq _18m915vq _lswuvuon _lcxvglyw"])
|
|
39
|
+
}, /*#__PURE__*/_react.default.createElement("g", {
|
|
40
|
+
fillRule: "evenodd"
|
|
41
|
+
}, (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("rect", {
|
|
42
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(_colors.B400, ")") : "var(--ds-border-input, ".concat(_colors.N100, ")"),
|
|
43
|
+
x: "5.5",
|
|
44
|
+
y: "5.5",
|
|
45
|
+
width: "13",
|
|
46
|
+
height: "13",
|
|
47
|
+
rx: "1.5",
|
|
48
|
+
fill: "currentColor"
|
|
49
|
+
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
50
|
+
fillRule: "evenodd",
|
|
51
|
+
clipRule: "evenodd",
|
|
52
|
+
d: "M16.3262 9.48011L15.1738 8.51984L10.75 13.8284L8.82616 11.5198L7.67383 12.4801L10.1738 15.4801C10.3163 15.6511 10.5274 15.75 10.75 15.75C10.9726 15.75 11.1837 15.6511 11.3262 15.4801L16.3262 9.48011Z",
|
|
53
|
+
fill: "inherit"
|
|
54
|
+
})) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("rect", {
|
|
55
|
+
fill: "currentColor",
|
|
56
|
+
x: "6",
|
|
57
|
+
y: "6",
|
|
58
|
+
width: "12",
|
|
59
|
+
height: "12",
|
|
60
|
+
rx: "2",
|
|
61
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(_colors.B400, ")") : "var(--ds-border-input, ".concat(_colors.N100, ")"),
|
|
62
|
+
strokeWidth: 1
|
|
63
|
+
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
64
|
+
d: "M9.707 11.293a1 1 0 10-1.414 1.414l2 2a1 1 0 001.414 0l4-4a1 1 0 10-1.414-1.414L11 12.586l-1.293-1.293z",
|
|
65
|
+
fill: "inherit"
|
|
66
|
+
}))));
|
|
67
|
+
}
|
|
21
68
|
return /*#__PURE__*/_react.default.createElement(_svg.default, {
|
|
22
69
|
label: "",
|
|
23
70
|
size: "medium",
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/* radio-icon.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
@@ -5,10 +6,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
require("./radio-icon.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
8
11
|
var _react = _interopRequireDefault(require("react"));
|
|
9
12
|
var _svg = _interopRequireDefault(require("@atlaskit/icon/svg"));
|
|
10
13
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
11
14
|
var _colors = require("@atlaskit/theme/colors");
|
|
15
|
+
var svgStyles = null;
|
|
16
|
+
|
|
12
17
|
/**
|
|
13
18
|
* __Radio icon__
|
|
14
19
|
*
|
|
@@ -18,6 +23,47 @@ var _colors = require("@atlaskit/theme/colors");
|
|
|
18
23
|
*/
|
|
19
24
|
var RadioIcon = function RadioIcon(_ref) {
|
|
20
25
|
var checked = _ref.checked;
|
|
26
|
+
if ((0, _platformFeatureFlags.fg)('platform-custom-icon-migration')) {
|
|
27
|
+
return /*#__PURE__*/_react.default.createElement("svg", {
|
|
28
|
+
width: 24,
|
|
29
|
+
height: 24,
|
|
30
|
+
viewBox: "0 0 24 24",
|
|
31
|
+
style: {
|
|
32
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
33
|
+
color: checked ? "var(--ds-background-selected-bold, ".concat(_colors.B400, ")") : "var(--ds-background-input, ".concat(_colors.N10, ")"),
|
|
34
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
35
|
+
fill: checked ? "var(--ds-icon-inverse, ".concat(_colors.N10, ")") : 'transparent'
|
|
36
|
+
},
|
|
37
|
+
role: "presentation",
|
|
38
|
+
className: (0, _runtime.ax)(["_1reo15vq _18m915vq _lswuvuon _lcxvglyw"])
|
|
39
|
+
}, /*#__PURE__*/_react.default.createElement("g", {
|
|
40
|
+
fillRule: "evenodd"
|
|
41
|
+
}, (0, _platformFeatureFlags.fg)('platform-visual-refresh-icons') ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("circle", {
|
|
42
|
+
cx: "12",
|
|
43
|
+
cy: "12",
|
|
44
|
+
r: "7.5",
|
|
45
|
+
fill: "currentColor",
|
|
46
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(_colors.B400, ")") : "var(--ds-border-input, ".concat(_colors.N100, ")"),
|
|
47
|
+
strokeWidth: "1"
|
|
48
|
+
}), /*#__PURE__*/_react.default.createElement("circle", {
|
|
49
|
+
cx: "12",
|
|
50
|
+
cy: "12",
|
|
51
|
+
r: "3",
|
|
52
|
+
fill: "inherit"
|
|
53
|
+
})) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("circle", {
|
|
54
|
+
fill: "currentColor",
|
|
55
|
+
cx: "12",
|
|
56
|
+
cy: "12",
|
|
57
|
+
r: "6",
|
|
58
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(_colors.B400, ")") : "var(--ds-border-input, ".concat(_colors.N100, ")"),
|
|
59
|
+
strokeWidth: 1
|
|
60
|
+
}), /*#__PURE__*/_react.default.createElement("circle", {
|
|
61
|
+
fill: "inherit",
|
|
62
|
+
cx: "12",
|
|
63
|
+
cy: "12",
|
|
64
|
+
r: "2"
|
|
65
|
+
}))));
|
|
66
|
+
}
|
|
21
67
|
return /*#__PURE__*/_react.default.createElement(_svg.default, {
|
|
22
68
|
label: "",
|
|
23
69
|
size: "medium",
|
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
/* checkbox-icon.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import "./checkbox-icon.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
4
|
import React from 'react';
|
|
2
5
|
import SVGIcon from '@atlaskit/icon/svg';
|
|
3
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
4
7
|
import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
8
|
+
const svgStyles = null;
|
|
9
|
+
|
|
5
10
|
/**
|
|
6
11
|
* __Checkbox icon__
|
|
7
12
|
*
|
|
@@ -12,6 +17,48 @@ import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
|
12
17
|
const CheckboxIcon = ({
|
|
13
18
|
checked
|
|
14
19
|
}) => {
|
|
20
|
+
if (fg('platform-custom-icon-migration')) {
|
|
21
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
22
|
+
width: 24,
|
|
23
|
+
height: 24,
|
|
24
|
+
viewBox: "0 0 24 24",
|
|
25
|
+
style: {
|
|
26
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
27
|
+
color: checked ? `var(--ds-background-selected-bold, ${B400})` : `var(--ds-background-input, ${N10})`,
|
|
28
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
29
|
+
fill: checked ? `var(--ds-icon-inverse, ${N10})` : 'transparent'
|
|
30
|
+
},
|
|
31
|
+
role: "presentation",
|
|
32
|
+
className: ax(["_1reo15vq _18m915vq _lswuvuon _lcxvglyw"])
|
|
33
|
+
}, /*#__PURE__*/React.createElement("g", {
|
|
34
|
+
fillRule: "evenodd"
|
|
35
|
+
}, fg('platform-visual-refresh-icons') ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("rect", {
|
|
36
|
+
stroke: checked ? `var(--ds-border-selected, ${B400})` : `var(--ds-border-input, ${N100})`,
|
|
37
|
+
x: "5.5",
|
|
38
|
+
y: "5.5",
|
|
39
|
+
width: "13",
|
|
40
|
+
height: "13",
|
|
41
|
+
rx: "1.5",
|
|
42
|
+
fill: "currentColor"
|
|
43
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
44
|
+
fillRule: "evenodd",
|
|
45
|
+
clipRule: "evenodd",
|
|
46
|
+
d: "M16.3262 9.48011L15.1738 8.51984L10.75 13.8284L8.82616 11.5198L7.67383 12.4801L10.1738 15.4801C10.3163 15.6511 10.5274 15.75 10.75 15.75C10.9726 15.75 11.1837 15.6511 11.3262 15.4801L16.3262 9.48011Z",
|
|
47
|
+
fill: "inherit"
|
|
48
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("rect", {
|
|
49
|
+
fill: "currentColor",
|
|
50
|
+
x: "6",
|
|
51
|
+
y: "6",
|
|
52
|
+
width: "12",
|
|
53
|
+
height: "12",
|
|
54
|
+
rx: "2",
|
|
55
|
+
stroke: checked ? `var(--ds-border-selected, ${B400})` : `var(--ds-border-input, ${N100})`,
|
|
56
|
+
strokeWidth: 1
|
|
57
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
58
|
+
d: "M9.707 11.293a1 1 0 10-1.414 1.414l2 2a1 1 0 001.414 0l4-4a1 1 0 10-1.414-1.414L11 12.586l-1.293-1.293z",
|
|
59
|
+
fill: "inherit"
|
|
60
|
+
}))));
|
|
61
|
+
}
|
|
15
62
|
return /*#__PURE__*/React.createElement(SVGIcon, {
|
|
16
63
|
label: "",
|
|
17
64
|
size: "medium",
|
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
/* radio-icon.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import "./radio-icon.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
4
|
import React from 'react';
|
|
2
5
|
import SVGIcon from '@atlaskit/icon/svg';
|
|
3
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
4
7
|
import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
8
|
+
const svgStyles = null;
|
|
9
|
+
|
|
5
10
|
/**
|
|
6
11
|
* __Radio icon__
|
|
7
12
|
*
|
|
@@ -12,6 +17,47 @@ import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
|
12
17
|
const RadioIcon = ({
|
|
13
18
|
checked
|
|
14
19
|
}) => {
|
|
20
|
+
if (fg('platform-custom-icon-migration')) {
|
|
21
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
22
|
+
width: 24,
|
|
23
|
+
height: 24,
|
|
24
|
+
viewBox: "0 0 24 24",
|
|
25
|
+
style: {
|
|
26
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
27
|
+
color: checked ? `var(--ds-background-selected-bold, ${B400})` : `var(--ds-background-input, ${N10})`,
|
|
28
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
29
|
+
fill: checked ? `var(--ds-icon-inverse, ${N10})` : 'transparent'
|
|
30
|
+
},
|
|
31
|
+
role: "presentation",
|
|
32
|
+
className: ax(["_1reo15vq _18m915vq _lswuvuon _lcxvglyw"])
|
|
33
|
+
}, /*#__PURE__*/React.createElement("g", {
|
|
34
|
+
fillRule: "evenodd"
|
|
35
|
+
}, fg('platform-visual-refresh-icons') ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("circle", {
|
|
36
|
+
cx: "12",
|
|
37
|
+
cy: "12",
|
|
38
|
+
r: "7.5",
|
|
39
|
+
fill: "currentColor",
|
|
40
|
+
stroke: checked ? `var(--ds-border-selected, ${B400})` : `var(--ds-border-input, ${N100})`,
|
|
41
|
+
strokeWidth: "1"
|
|
42
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
43
|
+
cx: "12",
|
|
44
|
+
cy: "12",
|
|
45
|
+
r: "3",
|
|
46
|
+
fill: "inherit"
|
|
47
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("circle", {
|
|
48
|
+
fill: "currentColor",
|
|
49
|
+
cx: "12",
|
|
50
|
+
cy: "12",
|
|
51
|
+
r: "6",
|
|
52
|
+
stroke: checked ? `var(--ds-border-selected, ${B400})` : `var(--ds-border-input, ${N100})`,
|
|
53
|
+
strokeWidth: 1
|
|
54
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
55
|
+
fill: "inherit",
|
|
56
|
+
cx: "12",
|
|
57
|
+
cy: "12",
|
|
58
|
+
r: "2"
|
|
59
|
+
}))));
|
|
60
|
+
}
|
|
15
61
|
return /*#__PURE__*/React.createElement(SVGIcon, {
|
|
16
62
|
label: "",
|
|
17
63
|
size: "medium",
|
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
/* checkbox-icon.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import "./checkbox-icon.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
4
|
import React from 'react';
|
|
2
5
|
import SVGIcon from '@atlaskit/icon/svg';
|
|
3
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
4
7
|
import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
8
|
+
var svgStyles = null;
|
|
9
|
+
|
|
5
10
|
/**
|
|
6
11
|
* __Checkbox icon__
|
|
7
12
|
*
|
|
@@ -11,6 +16,48 @@ import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
|
11
16
|
*/
|
|
12
17
|
var CheckboxIcon = function CheckboxIcon(_ref) {
|
|
13
18
|
var checked = _ref.checked;
|
|
19
|
+
if (fg('platform-custom-icon-migration')) {
|
|
20
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
21
|
+
width: 24,
|
|
22
|
+
height: 24,
|
|
23
|
+
viewBox: "0 0 24 24",
|
|
24
|
+
style: {
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
26
|
+
color: checked ? "var(--ds-background-selected-bold, ".concat(B400, ")") : "var(--ds-background-input, ".concat(N10, ")"),
|
|
27
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
28
|
+
fill: checked ? "var(--ds-icon-inverse, ".concat(N10, ")") : 'transparent'
|
|
29
|
+
},
|
|
30
|
+
role: "presentation",
|
|
31
|
+
className: ax(["_1reo15vq _18m915vq _lswuvuon _lcxvglyw"])
|
|
32
|
+
}, /*#__PURE__*/React.createElement("g", {
|
|
33
|
+
fillRule: "evenodd"
|
|
34
|
+
}, fg('platform-visual-refresh-icons') ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("rect", {
|
|
35
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(B400, ")") : "var(--ds-border-input, ".concat(N100, ")"),
|
|
36
|
+
x: "5.5",
|
|
37
|
+
y: "5.5",
|
|
38
|
+
width: "13",
|
|
39
|
+
height: "13",
|
|
40
|
+
rx: "1.5",
|
|
41
|
+
fill: "currentColor"
|
|
42
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
43
|
+
fillRule: "evenodd",
|
|
44
|
+
clipRule: "evenodd",
|
|
45
|
+
d: "M16.3262 9.48011L15.1738 8.51984L10.75 13.8284L8.82616 11.5198L7.67383 12.4801L10.1738 15.4801C10.3163 15.6511 10.5274 15.75 10.75 15.75C10.9726 15.75 11.1837 15.6511 11.3262 15.4801L16.3262 9.48011Z",
|
|
46
|
+
fill: "inherit"
|
|
47
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("rect", {
|
|
48
|
+
fill: "currentColor",
|
|
49
|
+
x: "6",
|
|
50
|
+
y: "6",
|
|
51
|
+
width: "12",
|
|
52
|
+
height: "12",
|
|
53
|
+
rx: "2",
|
|
54
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(B400, ")") : "var(--ds-border-input, ".concat(N100, ")"),
|
|
55
|
+
strokeWidth: 1
|
|
56
|
+
}), /*#__PURE__*/React.createElement("path", {
|
|
57
|
+
d: "M9.707 11.293a1 1 0 10-1.414 1.414l2 2a1 1 0 001.414 0l4-4a1 1 0 10-1.414-1.414L11 12.586l-1.293-1.293z",
|
|
58
|
+
fill: "inherit"
|
|
59
|
+
}))));
|
|
60
|
+
}
|
|
14
61
|
return /*#__PURE__*/React.createElement(SVGIcon, {
|
|
15
62
|
label: "",
|
|
16
63
|
size: "medium",
|
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
/* radio-icon.tsx generated by @compiled/babel-plugin v0.38.1 */
|
|
2
|
+
import "./radio-icon.compiled.css";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
4
|
import React from 'react';
|
|
2
5
|
import SVGIcon from '@atlaskit/icon/svg';
|
|
3
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
4
7
|
import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
8
|
+
var svgStyles = null;
|
|
9
|
+
|
|
5
10
|
/**
|
|
6
11
|
* __Radio icon__
|
|
7
12
|
*
|
|
@@ -11,6 +16,47 @@ import { B400, N10, N100 } from '@atlaskit/theme/colors';
|
|
|
11
16
|
*/
|
|
12
17
|
var RadioIcon = function RadioIcon(_ref) {
|
|
13
18
|
var checked = _ref.checked;
|
|
19
|
+
if (fg('platform-custom-icon-migration')) {
|
|
20
|
+
return /*#__PURE__*/React.createElement("svg", {
|
|
21
|
+
width: 24,
|
|
22
|
+
height: 24,
|
|
23
|
+
viewBox: "0 0 24 24",
|
|
24
|
+
style: {
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
26
|
+
color: checked ? "var(--ds-background-selected-bold, ".concat(B400, ")") : "var(--ds-background-input, ".concat(N10, ")"),
|
|
27
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
28
|
+
fill: checked ? "var(--ds-icon-inverse, ".concat(N10, ")") : 'transparent'
|
|
29
|
+
},
|
|
30
|
+
role: "presentation",
|
|
31
|
+
className: ax(["_1reo15vq _18m915vq _lswuvuon _lcxvglyw"])
|
|
32
|
+
}, /*#__PURE__*/React.createElement("g", {
|
|
33
|
+
fillRule: "evenodd"
|
|
34
|
+
}, fg('platform-visual-refresh-icons') ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("circle", {
|
|
35
|
+
cx: "12",
|
|
36
|
+
cy: "12",
|
|
37
|
+
r: "7.5",
|
|
38
|
+
fill: "currentColor",
|
|
39
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(B400, ")") : "var(--ds-border-input, ".concat(N100, ")"),
|
|
40
|
+
strokeWidth: "1"
|
|
41
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
42
|
+
cx: "12",
|
|
43
|
+
cy: "12",
|
|
44
|
+
r: "3",
|
|
45
|
+
fill: "inherit"
|
|
46
|
+
})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("circle", {
|
|
47
|
+
fill: "currentColor",
|
|
48
|
+
cx: "12",
|
|
49
|
+
cy: "12",
|
|
50
|
+
r: "6",
|
|
51
|
+
stroke: checked ? "var(--ds-border-selected, ".concat(B400, ")") : "var(--ds-border-input, ".concat(N100, ")"),
|
|
52
|
+
strokeWidth: 1
|
|
53
|
+
}), /*#__PURE__*/React.createElement("circle", {
|
|
54
|
+
fill: "inherit",
|
|
55
|
+
cx: "12",
|
|
56
|
+
cy: "12",
|
|
57
|
+
r: "2"
|
|
58
|
+
}))));
|
|
59
|
+
}
|
|
14
60
|
return /*#__PURE__*/React.createElement(SVGIcon, {
|
|
15
61
|
label: "",
|
|
16
62
|
size: "medium",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/dropdown-menu",
|
|
3
|
-
"version": "16.3.
|
|
3
|
+
"version": "16.3.22",
|
|
4
4
|
"description": "A dropdown menu displays a list of actions or options to a user.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -32,10 +32,10 @@
|
|
|
32
32
|
"@atlaskit/menu": "^8.4.0",
|
|
33
33
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
34
34
|
"@atlaskit/popup": "^4.6.0",
|
|
35
|
-
"@atlaskit/primitives": "^16.
|
|
35
|
+
"@atlaskit/primitives": "^16.4.0",
|
|
36
36
|
"@atlaskit/spinner": "^19.0.0",
|
|
37
37
|
"@atlaskit/theme": "^21.0.0",
|
|
38
|
-
"@atlaskit/tokens": "^8.
|
|
38
|
+
"@atlaskit/tokens": "^8.4.0",
|
|
39
39
|
"@atlaskit/visually-hidden": "^3.0.0",
|
|
40
40
|
"@babel/runtime": "^7.0.0",
|
|
41
41
|
"bind-event-listener": "^3.0.0"
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"@af/integration-testing": "workspace:^",
|
|
50
50
|
"@af/visual-regression": "workspace:^",
|
|
51
51
|
"@atlaskit/app-provider": "^3.2.0",
|
|
52
|
-
"@atlaskit/atlassian-navigation": "^5.
|
|
52
|
+
"@atlaskit/atlassian-navigation": "^5.5.0",
|
|
53
53
|
"@atlaskit/avatar": "^25.5.0",
|
|
54
54
|
"@atlaskit/checkbox": "^17.1.0",
|
|
55
55
|
"@atlaskit/docs": "^11.2.0",
|
|
@@ -93,6 +93,9 @@
|
|
|
93
93
|
},
|
|
94
94
|
"platform-dst-nested-dropdown-menu-role": {
|
|
95
95
|
"type": "boolean"
|
|
96
|
+
},
|
|
97
|
+
"platform-custom-icon-migration": {
|
|
98
|
+
"type": "boolean"
|
|
96
99
|
}
|
|
97
100
|
},
|
|
98
101
|
"techstack": {
|