@atlaskit/radio 6.0.3 → 6.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.
Files changed (6) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/cjs/radio-group.js +2 -2
  3. package/dist/cjs/radio.js +5 -6
  4. package/dist/es2019/radio.js +6 -7
  5. package/dist/esm/radio.js +6 -7
  6. package/package.json +3 -9
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/radio
2
2
 
3
+ ## 6.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#80805](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/80805) [`427c2dd9e0d6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/427c2dd9e0d6) - [ux] update border with from 2px to 1px with darker color to meet 3:1 color contrast for accessibility improvement
8
+
9
+ ### Patch Changes
10
+
11
+ - Updated dependencies
12
+
3
13
  ## 6.0.3
4
14
 
5
15
  ### Patch Changes
package/dist/cjs/radio-group.js CHANGED
@@ -12,8 +12,8 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
12
12
  var _react = _interopRequireWildcard(require("react"));
13
13
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
14
14
  var _radio = _interopRequireDefault(require("./radio"));
15
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
16
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
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
+ 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 && Object.prototype.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 noOptions = [];
18
18
  function RadioGroup(props) {
19
19
  var onChange = props.onChange,
package/dist/cjs/radio.js CHANGED
@@ -11,13 +11,12 @@ var _react = require("react");
11
11
  var _react2 = require("@emotion/react");
12
12
  var _usePlatformLeafEventHandler = require("@atlaskit/analytics-next/usePlatformLeafEventHandler");
13
13
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
14
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
14
  var _colors = require("@atlaskit/theme/colors");
16
15
  var _constants = require("@atlaskit/theme/constants");
17
16
  var _excluded = ["ariaLabel", "isDisabled", "isRequired", "isInvalid", "isChecked", "label", "name", "onChange", "value", "testId", "analyticsContext"];
18
17
  /** @jsx jsx */
19
18
  var packageName = "@atlaskit/radio";
20
- var packageVersion = "6.0.3";
19
+ var packageVersion = "6.1.0";
21
20
  var fontFamily = (0, _constants.fontFamily)();
22
21
  var noop = _noop.default;
23
22
  var labelPaddingStyles = (0, _react2.css)({
@@ -56,7 +55,7 @@ var radioStyles = (0, _react2.css)({
56
55
  backgroundColor: 'var(--radio-background-color)',
57
56
  /* Border should multiply by 24/14 to offset scale, a scale of 12 / 7 is to fix a Chrome bug that makes the circle become an oval and the
58
57
  inner circle not be centred at various zoom levels */
59
- border: "".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-width, 1px)" : 'calc(2px * 12 / 7)', " solid var(--radio-border-color)"),
58
+ border: "var(--ds-border-width, 1px)".concat(" solid var(--radio-border-color)"),
60
59
  borderRadius: "var(--ds-border-radius-circle, 50%)",
61
60
  MozAppearance: 'none',
62
61
  outline: 'none',
@@ -66,7 +65,7 @@ var radioStyles = (0, _react2.css)({
66
65
  All other variables are constant
67
66
  */
68
67
  '--radio-background-color': "var(--ds-background-input, ".concat(_colors.N10, ")"),
69
- '--radio-border-color': (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(_colors.N100, ")") : "var(--ds-border-input, ".concat(_colors.N40, ")"),
68
+ '--radio-border-color': "var(--ds-border-input, ".concat(_colors.N100, ")"),
70
69
  '--radio-dot-color': "var(--ds-icon-inverse, ".concat(_colors.N10, ")"),
71
70
  '--radio-dot-opacity': 0,
72
71
  /* 24px * 7 / 12 === 14px height and width */
@@ -88,7 +87,7 @@ var radioStyles = (0, _react2.css)({
88
87
  },
89
88
  '&:hover': {
90
89
  '--radio-background-color': "var(--ds-background-input-hovered, ".concat(_colors.N30, ")"),
91
- '--radio-border-color': (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(_colors.N100, ")") : "var(--ds-border-input, ".concat(_colors.N40, ")")
90
+ '--radio-border-color': "var(--ds-border-input, ".concat(_colors.N100, ")")
92
91
  },
93
92
  '&:active': {
94
93
  '--radio-background-color': "var(--ds-background-input-pressed, ".concat(_colors.N30, ")")
@@ -108,7 +107,7 @@ var radioStyles = (0, _react2.css)({
108
107
  },
109
108
  '&:checked:active': {
110
109
  '--radio-background-color': "var(--ds-background-selected-bold-pressed, ".concat(_colors.B50, ")"),
111
- '--radio-border-color': (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(_colors.N100, ")") : "var(--ds-border-input, ".concat(_colors.N40, ")"),
110
+ '--radio-border-color': "var(--ds-border-input, ".concat(_colors.N100, ")"),
112
111
  '--radio-dot-color': "var(--ds-icon-inverse, ".concat(_colors.B400, ")")
113
112
  },
114
113
  '&:checked:focus': {
package/dist/es2019/radio.js CHANGED
@@ -4,11 +4,10 @@ import { forwardRef, memo } from 'react';
4
4
  import { css, jsx } from '@emotion/react';
5
5
  import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
6
6
  import __noop from '@atlaskit/ds-lib/noop';
7
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
8
- import { B200, B300, B400, B50, N10, N100, N20, N30, N40, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
7
+ import { B200, B300, B400, B50, N10, N100, N20, N30, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
9
8
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
10
9
  const packageName = "@atlaskit/radio";
11
- const packageVersion = "6.0.3";
10
+ const packageVersion = "6.1.0";
12
11
  const fontFamily = getFontFamily();
13
12
  const noop = __noop;
14
13
  const labelPaddingStyles = css({
@@ -47,7 +46,7 @@ const radioStyles = css({
47
46
  backgroundColor: 'var(--radio-background-color)',
48
47
  /* Border should multiply by 24/14 to offset scale, a scale of 12 / 7 is to fix a Chrome bug that makes the circle become an oval and the
49
48
  inner circle not be centred at various zoom levels */
50
- border: `${getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-width, 1px)" : 'calc(2px * 12 / 7)'} solid var(--radio-border-color)`,
49
+ border: `${"var(--ds-border-width, 1px)"} solid var(--radio-border-color)`,
51
50
  borderRadius: "var(--ds-border-radius-circle, 50%)",
52
51
  MozAppearance: 'none',
53
52
  outline: 'none',
@@ -57,7 +56,7 @@ const radioStyles = css({
57
56
  All other variables are constant
58
57
  */
59
58
  '--radio-background-color': `var(--ds-background-input, ${N10})`,
60
- '--radio-border-color': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${N100})` : `var(--ds-border-input, ${N40})`,
59
+ '--radio-border-color': `var(--ds-border-input, ${N100})`,
61
60
  '--radio-dot-color': `var(--ds-icon-inverse, ${N10})`,
62
61
  '--radio-dot-opacity': 0,
63
62
  /* 24px * 7 / 12 === 14px height and width */
@@ -79,7 +78,7 @@ const radioStyles = css({
79
78
  },
80
79
  '&:hover': {
81
80
  '--radio-background-color': `var(--ds-background-input-hovered, ${N30})`,
82
- '--radio-border-color': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${N100})` : `var(--ds-border-input, ${N40})`
81
+ '--radio-border-color': `var(--ds-border-input, ${N100})`
83
82
  },
84
83
  '&:active': {
85
84
  '--radio-background-color': `var(--ds-background-input-pressed, ${N30})`
@@ -99,7 +98,7 @@ const radioStyles = css({
99
98
  },
100
99
  '&:checked:active': {
101
100
  '--radio-background-color': `var(--ds-background-selected-bold-pressed, ${B50})`,
102
- '--radio-border-color': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${N100})` : `var(--ds-border-input, ${N40})`,
101
+ '--radio-border-color': `var(--ds-border-input, ${N100})`,
103
102
  '--radio-dot-color': `var(--ds-icon-inverse, ${B400})`
104
103
  },
105
104
  '&:checked:focus': {
package/dist/esm/radio.js CHANGED
@@ -6,11 +6,10 @@ import { forwardRef, memo } from 'react';
6
6
  import { css, jsx } from '@emotion/react';
7
7
  import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
8
8
  import __noop from '@atlaskit/ds-lib/noop';
9
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
10
- import { B200, B300, B400, B50, N10, N100, N20, N30, N40, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
9
+ import { B200, B300, B400, B50, N10, N100, N20, N30, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
11
10
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
12
11
  var packageName = "@atlaskit/radio";
13
- var packageVersion = "6.0.3";
12
+ var packageVersion = "6.1.0";
14
13
  var fontFamily = getFontFamily();
15
14
  var noop = __noop;
16
15
  var labelPaddingStyles = css({
@@ -49,7 +48,7 @@ var radioStyles = css({
49
48
  backgroundColor: 'var(--radio-background-color)',
50
49
  /* Border should multiply by 24/14 to offset scale, a scale of 12 / 7 is to fix a Chrome bug that makes the circle become an oval and the
51
50
  inner circle not be centred at various zoom levels */
52
- border: "".concat(getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-width, 1px)" : 'calc(2px * 12 / 7)', " solid var(--radio-border-color)"),
51
+ border: "var(--ds-border-width, 1px)".concat(" solid var(--radio-border-color)"),
53
52
  borderRadius: "var(--ds-border-radius-circle, 50%)",
54
53
  MozAppearance: 'none',
55
54
  outline: 'none',
@@ -59,7 +58,7 @@ var radioStyles = css({
59
58
  All other variables are constant
60
59
  */
61
60
  '--radio-background-color': "var(--ds-background-input, ".concat(N10, ")"),
62
- '--radio-border-color': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(N100, ")") : "var(--ds-border-input, ".concat(N40, ")"),
61
+ '--radio-border-color': "var(--ds-border-input, ".concat(N100, ")"),
63
62
  '--radio-dot-color': "var(--ds-icon-inverse, ".concat(N10, ")"),
64
63
  '--radio-dot-opacity': 0,
65
64
  /* 24px * 7 / 12 === 14px height and width */
@@ -81,7 +80,7 @@ var radioStyles = css({
81
80
  },
82
81
  '&:hover': {
83
82
  '--radio-background-color': "var(--ds-background-input-hovered, ".concat(N30, ")"),
84
- '--radio-border-color': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(N100, ")") : "var(--ds-border-input, ".concat(N40, ")")
83
+ '--radio-border-color': "var(--ds-border-input, ".concat(N100, ")")
85
84
  },
86
85
  '&:active': {
87
86
  '--radio-background-color': "var(--ds-background-input-pressed, ".concat(N30, ")")
@@ -101,7 +100,7 @@ var radioStyles = css({
101
100
  },
102
101
  '&:checked:active': {
103
102
  '--radio-background-color': "var(--ds-background-selected-bold-pressed, ".concat(B50, ")"),
104
- '--radio-border-color': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(N100, ")") : "var(--ds-border-input, ".concat(N40, ")"),
103
+ '--radio-border-color': "var(--ds-border-input, ".concat(N100, ")"),
105
104
  '--radio-dot-color': "var(--ds-icon-inverse, ".concat(B400, ")")
106
105
  },
107
106
  '&:checked:focus': {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "6.0.3",
3
+ "version": "6.1.0",
4
4
  "description": "A radio input allows users to select only one option from a number of choices. Radio is generally displayed in a radio group.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -42,9 +42,8 @@
42
42
  "dependencies": {
43
43
  "@atlaskit/analytics-next": "^9.2.0",
44
44
  "@atlaskit/ds-lib": "^2.2.0",
45
- "@atlaskit/platform-feature-flags": "^0.2.0",
46
45
  "@atlaskit/theme": "^12.6.0",
47
- "@atlaskit/tokens": "^1.39.0",
46
+ "@atlaskit/tokens": "^1.41.0",
48
47
  "@babel/runtime": "^7.0.0",
49
48
  "@emotion/react": "^11.7.1"
50
49
  },
@@ -88,11 +87,6 @@
88
87
  "deprecation": "no-deprecated-imports"
89
88
  }
90
89
  },
91
- "platform-feature-flags": {
92
- "platform.design-system-team.update-border-radio-checkbox_7askv": {
93
- "type": "boolean"
94
- }
95
- },
96
90
  "homepage": "https://atlassian.design/components/radio/",
97
91
  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
98
- }
92
+ }