@atlaskit/radio 5.6.7 → 5.6.8

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/radio
 
+## 5.6.8
+
+### Patch Changes
+
+- [`931210a5b65`](https://bitbucket.org/atlassian/atlassian-frontend/commits/931210a5b65) - use new feature flag for border contrast update
+
 ## 5.6.7
 
 ### Patch Changes

package/dist/cjs/radio.js

@@ -19,7 +19,7 @@ var _styles = _interopRequireDefault(require("./styles"));
 var _excluded = ["ariaLabel", "isDisabled", "isRequired", "isInvalid", "isChecked", "label", "mode", "name", "onChange", "value", "testId", "analyticsContext"];
 /** @jsx jsx */
 var packageName = "@atlaskit/radio";
-var packageVersion = "5.6.7";
+var packageVersion = "5.6.8";
 var fontFamily = (0, _constants.fontFamily)();
 var noop = _noop.default;
 var labelPaddingStyles = (0, _react2.css)({
@@ -31,7 +31,7 @@ var labelStyles = (0, _react2.css)({
   position: 'relative',
   alignItems: 'flex-start',
   fontFamily: fontFamily,
-  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
+  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
   '&[data-disabled]': {
     color: "var(--ds-text-disabled, ".concat(_colors.N80, ")"),
     cursor: 'not-allowed'
@@ -63,7 +63,7 @@ var radioStyles = (0, _react2.css)({
   backgroundColor: 'var(--radio-background-color)',
   /* 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
     inner circle not be centred at various zoom levels */
-  border: "".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? "var(--ds-border-width, 1px)" : 'calc(2px * 12 / 7)', " solid var(--radio-border-color)"),
+  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)"),
   borderRadius: "var(--ds-border-radius-circle, 50%)",
   MozAppearance: 'none',
   outline: 'none',
@@ -120,7 +120,7 @@ var radioStyles = (0, _react2.css)({
   '&:checked:focus': {
     '--radio-border-color': 'var(--local-border-focus)'
   },
-  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
+  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
   '&[data-invalid], &:checked[data-invalid]': {
     '--radio-border-color': 'var(--local-invalid)'
   },
@@ -160,36 +160,32 @@ var RadioWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Radio(props, re
   var radioCustomProperties = (0, _react.useMemo)(function () {
     return (0, _react2.css)((0, _styles.default)(mode));
   }, [mode]);
-  return (
-    // https://product-fabric.atlassian.net/browse/DST-1971
-    // eslint-disable-next-line jsx-a11y/label-has-associated-control,jsx-a11y/label-has-for
-    (0, _react2.jsx)("label", {
-      "data-testid": testId && "".concat(testId, "--radio-label"),
-      "data-disabled": isDisabled ? 'true' : undefined,
-      css: [labelStyles, mode === 'light' ? lightLabelStyles : darkLabelStyles]
-    }, (0, _react2.jsx)("input", (0, _extends2.default)({}, rest, {
-      "aria-label": ariaLabel,
-      checked: isChecked,
-      disabled: isDisabled,
-      name: name,
-      onChange: onChangeAnalytics,
-      required: isRequired,
-      type: "radio",
-      value: value,
-      "data-testid": testId && "".concat(testId, "--radio-input")
-      // isInvalid is used in a nonstandard way so cannot
-      // use :invalid selector
-      ,
-      "data-invalid": isInvalid ? 'true' : undefined
-      // TODO radioCustomProperties can be defined at top of file when legacy theming removed
-      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
-      ,
-      css: [radioStyles, radioCustomProperties],
-      ref: ref
-    })), label ? (0, _react2.jsx)("span", {
-      css: labelPaddingStyles
-    }, label) : null)
-  );
+  return (0, _react2.jsx)("label", {
+    "data-testid": testId && "".concat(testId, "--radio-label"),
+    "data-disabled": isDisabled ? 'true' : undefined,
+    css: [labelStyles, mode === 'light' ? lightLabelStyles : darkLabelStyles]
+  }, (0, _react2.jsx)("input", (0, _extends2.default)({}, rest, {
+    "aria-label": ariaLabel,
+    checked: isChecked,
+    disabled: isDisabled,
+    name: name,
+    onChange: onChangeAnalytics,
+    required: isRequired,
+    type: "radio",
+    value: value,
+    "data-testid": testId && "".concat(testId, "--radio-input")
+    // isInvalid is used in a nonstandard way so cannot
+    // use :invalid selector
+    ,
+    "data-invalid": isInvalid ? 'true' : undefined
+    // TODO radioCustomProperties can be defined at top of file when legacy theming removed
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    ,
+    css: [radioStyles, radioCustomProperties],
+    ref: ref
+  })), label ? (0, _react2.jsx)("span", {
+    css: labelPaddingStyles
+  }, label) : null);
 });
 
 /**

package/dist/cjs/styles.js

@@ -18,8 +18,8 @@ var radioThemeColors = {
     dotChecked: "var(--ds-icon-inverse, ".concat(_colors.N10, ")"),
     dotDisabled: "var(--ds-icon-disabled, ".concat(_colors.N70, ")"),
     dotActive: "var(--ds-icon-inverse, ".concat(_colors.B400, ")"),
-    border: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.N100 : _colors.N40, ")"),
-    borderHover: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.N100 : _colors.N40, ")"),
+    border: (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, ")"),
+    borderHover: (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, ")"),
     borderDisabled: "var(--ds-border-disabled, ".concat(_colors.N20, ")"),
     borderFocus: "var(--ds-border-focused, ".concat(_colors.B100, ")")
   },
@@ -34,7 +34,7 @@ var radioThemeColors = {
     dotChecked: "var(--ds-icon-inverse, ".concat(_colors.DN10, ")"),
     dotDisabled: "var(--ds-icon-disabled, ".concat(_colors.DN90, ")"),
     dotActive: "var(--ds-icon-inverse, ".concat(_colors.DN10, ")"),
-    border: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.DN200 : _colors.DN80, ")"),
+    border: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(_colors.DN200, ")") : "var(--ds-border-input, ".concat(_colors.DN80, ")"),
     borderHover: "var(--ds-border-input, ".concat(_colors.DN200, ")"),
     borderDisabled: "var(--ds-border-disabled, ".concat(_colors.DN10, ")"),
     borderFocus: "var(--ds-border-focused, ".concat(_colors.B75, ")")

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/radio",
-	"version": "5.6.7",
+	"version": "5.6.8",
 	"sideEffects": false
 }

package/dist/es2019/radio.js

@@ -10,7 +10,7 @@ import GlobalTheme from '@atlaskit/theme/components';
 import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
 import getRadioCustomProperties from './styles';
 const packageName = "@atlaskit/radio";
-const packageVersion = "5.6.7";
+const packageVersion = "5.6.8";
 const fontFamily = getFontFamily();
 const noop = __noop;
 const labelPaddingStyles = css({
@@ -22,7 +22,7 @@ const labelStyles = css({
   position: 'relative',
   alignItems: 'flex-start',
   fontFamily: fontFamily,
-  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
+  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
   '&[data-disabled]': {
     color: `var(--ds-text-disabled, ${N80})`,
     cursor: 'not-allowed'
@@ -54,7 +54,7 @@ const radioStyles = css({
   backgroundColor: 'var(--radio-background-color)',
   /* 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
     inner circle not be centred at various zoom levels */
-  border: `${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? "var(--ds-border-width, 1px)" : 'calc(2px * 12 / 7)'} solid var(--radio-border-color)`,
+  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)`,
   borderRadius: "var(--ds-border-radius-circle, 50%)",
   MozAppearance: 'none',
   outline: 'none',
@@ -111,7 +111,7 @@ const radioStyles = css({
   '&:checked:focus': {
     '--radio-border-color': 'var(--local-border-focus)'
   },
-  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
+  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
   '&[data-invalid], &:checked[data-invalid]': {
     '--radio-border-color': 'var(--local-invalid)'
   },
@@ -148,36 +148,32 @@ const RadioWithMode = /*#__PURE__*/forwardRef(function Radio(props, ref) {
     packageVersion
   });
   const radioCustomProperties = useMemo(() => css(getRadioCustomProperties(mode)), [mode]);
-  return (
-    // https://product-fabric.atlassian.net/browse/DST-1971
-    // eslint-disable-next-line jsx-a11y/label-has-associated-control,jsx-a11y/label-has-for
-    jsx("label", {
-      "data-testid": testId && `${testId}--radio-label`,
-      "data-disabled": isDisabled ? 'true' : undefined,
-      css: [labelStyles, mode === 'light' ? lightLabelStyles : darkLabelStyles]
-    }, jsx("input", _extends({}, rest, {
-      "aria-label": ariaLabel,
-      checked: isChecked,
-      disabled: isDisabled,
-      name: name,
-      onChange: onChangeAnalytics,
-      required: isRequired,
-      type: "radio",
-      value: value,
-      "data-testid": testId && `${testId}--radio-input`
-      // isInvalid is used in a nonstandard way so cannot
-      // use :invalid selector
-      ,
-      "data-invalid": isInvalid ? 'true' : undefined
-      // TODO radioCustomProperties can be defined at top of file when legacy theming removed
-      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
-      ,
-      css: [radioStyles, radioCustomProperties],
-      ref: ref
-    })), label ? jsx("span", {
-      css: labelPaddingStyles
-    }, label) : null)
-  );
+  return jsx("label", {
+    "data-testid": testId && `${testId}--radio-label`,
+    "data-disabled": isDisabled ? 'true' : undefined,
+    css: [labelStyles, mode === 'light' ? lightLabelStyles : darkLabelStyles]
+  }, jsx("input", _extends({}, rest, {
+    "aria-label": ariaLabel,
+    checked: isChecked,
+    disabled: isDisabled,
+    name: name,
+    onChange: onChangeAnalytics,
+    required: isRequired,
+    type: "radio",
+    value: value,
+    "data-testid": testId && `${testId}--radio-input`
+    // isInvalid is used in a nonstandard way so cannot
+    // use :invalid selector
+    ,
+    "data-invalid": isInvalid ? 'true' : undefined
+    // TODO radioCustomProperties can be defined at top of file when legacy theming removed
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    ,
+    css: [radioStyles, radioCustomProperties],
+    ref: ref
+  })), label ? jsx("span", {
+    css: labelPaddingStyles
+  }, label) : null);
 });
 
 /**

package/dist/es2019/styles.js

@@ -12,8 +12,8 @@ const radioThemeColors = {
     dotChecked: `var(--ds-icon-inverse, ${N10})`,
     dotDisabled: `var(--ds-icon-disabled, ${N70})`,
     dotActive: `var(--ds-icon-inverse, ${B400})`,
-    border: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40})`,
-    borderHover: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40})`,
+    border: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${N100})` : `var(--ds-border-input, ${N40})`,
+    borderHover: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${N100})` : `var(--ds-border-input, ${N40})`,
     borderDisabled: `var(--ds-border-disabled, ${N20})`,
     borderFocus: `var(--ds-border-focused, ${B100})`
   },
@@ -28,7 +28,7 @@ const radioThemeColors = {
     dotChecked: `var(--ds-icon-inverse, ${DN10})`,
     dotDisabled: `var(--ds-icon-disabled, ${DN90})`,
     dotActive: `var(--ds-icon-inverse, ${DN10})`,
-    border: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? DN200 : DN80})`,
+    border: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${DN200})` : `var(--ds-border-input, ${DN80})`,
     borderHover: `var(--ds-border-input, ${DN200})`,
     borderDisabled: `var(--ds-border-disabled, ${DN10})`,
     borderFocus: `var(--ds-border-focused, ${B75})`

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/radio",
-	"version": "5.6.7",
+	"version": "5.6.8",
 	"sideEffects": false
 }

package/dist/esm/radio.js

@@ -12,7 +12,7 @@ import GlobalTheme from '@atlaskit/theme/components';
 import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
 import getRadioCustomProperties from './styles';
 var packageName = "@atlaskit/radio";
-var packageVersion = "5.6.7";
+var packageVersion = "5.6.8";
 var fontFamily = getFontFamily();
 var noop = __noop;
 var labelPaddingStyles = css({
@@ -24,7 +24,7 @@ var labelStyles = css({
   position: 'relative',
   alignItems: 'flex-start',
   fontFamily: fontFamily,
-  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
+  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
   '&[data-disabled]': {
     color: "var(--ds-text-disabled, ".concat(N80, ")"),
     cursor: 'not-allowed'
@@ -56,7 +56,7 @@ var radioStyles = css({
   backgroundColor: 'var(--radio-background-color)',
   /* 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
     inner circle not be centred at various zoom levels */
-  border: "".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? "var(--ds-border-width, 1px)" : 'calc(2px * 12 / 7)', " solid var(--radio-border-color)"),
+  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)"),
   borderRadius: "var(--ds-border-radius-circle, 50%)",
   MozAppearance: 'none',
   outline: 'none',
@@ -113,7 +113,7 @@ var radioStyles = css({
   '&:checked:focus': {
     '--radio-border-color': 'var(--local-border-focus)'
   },
-  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
+  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
   '&[data-invalid], &:checked[data-invalid]': {
     '--radio-border-color': 'var(--local-invalid)'
   },
@@ -153,36 +153,32 @@ var RadioWithMode = /*#__PURE__*/forwardRef(function Radio(props, ref) {
   var radioCustomProperties = useMemo(function () {
     return css(getRadioCustomProperties(mode));
   }, [mode]);
-  return (
-    // https://product-fabric.atlassian.net/browse/DST-1971
-    // eslint-disable-next-line jsx-a11y/label-has-associated-control,jsx-a11y/label-has-for
-    jsx("label", {
-      "data-testid": testId && "".concat(testId, "--radio-label"),
-      "data-disabled": isDisabled ? 'true' : undefined,
-      css: [labelStyles, mode === 'light' ? lightLabelStyles : darkLabelStyles]
-    }, jsx("input", _extends({}, rest, {
-      "aria-label": ariaLabel,
-      checked: isChecked,
-      disabled: isDisabled,
-      name: name,
-      onChange: onChangeAnalytics,
-      required: isRequired,
-      type: "radio",
-      value: value,
-      "data-testid": testId && "".concat(testId, "--radio-input")
-      // isInvalid is used in a nonstandard way so cannot
-      // use :invalid selector
-      ,
-      "data-invalid": isInvalid ? 'true' : undefined
-      // TODO radioCustomProperties can be defined at top of file when legacy theming removed
-      // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
-      ,
-      css: [radioStyles, radioCustomProperties],
-      ref: ref
-    })), label ? jsx("span", {
-      css: labelPaddingStyles
-    }, label) : null)
-  );
+  return jsx("label", {
+    "data-testid": testId && "".concat(testId, "--radio-label"),
+    "data-disabled": isDisabled ? 'true' : undefined,
+    css: [labelStyles, mode === 'light' ? lightLabelStyles : darkLabelStyles]
+  }, jsx("input", _extends({}, rest, {
+    "aria-label": ariaLabel,
+    checked: isChecked,
+    disabled: isDisabled,
+    name: name,
+    onChange: onChangeAnalytics,
+    required: isRequired,
+    type: "radio",
+    value: value,
+    "data-testid": testId && "".concat(testId, "--radio-input")
+    // isInvalid is used in a nonstandard way so cannot
+    // use :invalid selector
+    ,
+    "data-invalid": isInvalid ? 'true' : undefined
+    // TODO radioCustomProperties can be defined at top of file when legacy theming removed
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    ,
+    css: [radioStyles, radioCustomProperties],
+    ref: ref
+  })), label ? jsx("span", {
+    css: labelPaddingStyles
+  }, label) : null);
 });
 
 /**

package/dist/esm/styles.js

@@ -12,8 +12,8 @@ var radioThemeColors = {
     dotChecked: "var(--ds-icon-inverse, ".concat(N10, ")"),
     dotDisabled: "var(--ds-icon-disabled, ".concat(N70, ")"),
     dotActive: "var(--ds-icon-inverse, ".concat(B400, ")"),
-    border: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40, ")"),
-    borderHover: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40, ")"),
+    border: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(N100, ")") : "var(--ds-border-input, ".concat(N40, ")"),
+    borderHover: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(N100, ")") : "var(--ds-border-input, ".concat(N40, ")"),
     borderDisabled: "var(--ds-border-disabled, ".concat(N20, ")"),
     borderFocus: "var(--ds-border-focused, ".concat(B100, ")")
   },
@@ -28,7 +28,7 @@ var radioThemeColors = {
     dotChecked: "var(--ds-icon-inverse, ".concat(DN10, ")"),
     dotDisabled: "var(--ds-icon-disabled, ".concat(DN90, ")"),
     dotActive: "var(--ds-icon-inverse, ".concat(DN10, ")"),
-    border: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? DN200 : DN80, ")"),
+    border: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(DN200, ")") : "var(--ds-border-input, ".concat(DN80, ")"),
     borderHover: "var(--ds-border-input, ".concat(DN200, ")"),
     borderDisabled: "var(--ds-border-disabled, ".concat(DN10, ")"),
     borderFocus: "var(--ds-border-focused, ".concat(B75, ")")

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/radio",
-	"version": "5.6.7",
+	"version": "5.6.8",
 	"sideEffects": false
 }

package/dist/types/styles.d.ts

@@ -7,9 +7,9 @@ export default function getRadioCustomProperties(mode: ThemeModes): {
     '--local-background-checked-hover': "var(--ds-background-selected-bold-hovered)";
     '--local-background-disabled': "var(--ds-background-disabled)";
     '--local-background-hover': "var(--ds-background-input-hovered)";
-    '--local-border': "var(--ds-border-input)";
+    '--local-border': "var(--ds-border-bold)" | "var(--ds-border-input)";
     '--local-border-disabled': "var(--ds-border-disabled)";
-    '--local-border-hover': "var(--ds-border-input)";
+    '--local-border-hover': "var(--ds-border-bold)" | "var(--ds-border-input)";
     '--local-border-focus': "var(--ds-border-focused)";
     '--local-dot-active': "var(--ds-icon-inverse)";
     '--local-dot-checked': "var(--ds-icon-inverse)";

package/dist/types-ts4.5/styles.d.ts

@@ -7,9 +7,9 @@ export default function getRadioCustomProperties(mode: ThemeModes): {
     '--local-background-checked-hover': "var(--ds-background-selected-bold-hovered)";
     '--local-background-disabled': "var(--ds-background-disabled)";
     '--local-background-hover': "var(--ds-background-input-hovered)";
-    '--local-border': "var(--ds-border-input)";
+    '--local-border': "var(--ds-border-bold)" | "var(--ds-border-input)";
     '--local-border-disabled': "var(--ds-border-disabled)";
-    '--local-border-hover': "var(--ds-border-input)";
+    '--local-border-hover': "var(--ds-border-bold)" | "var(--ds-border-input)";
     '--local-border-focus': "var(--ds-border-focused)";
     '--local-dot-active': "var(--ds-icon-inverse)";
     '--local-dot-checked': "var(--ds-icon-inverse)";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/radio",
-  "version": "5.6.7",
+  "version": "5.6.8",
   "description": "A radio input allows users to select only one option from a number of choices. Radio is generally displayed in a radio group.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -23,7 +23,7 @@
   "sideEffects": false,
   "atlaskit:src": "src/index.tsx",
   "atlassian": {
-    "team": "Design System Team",
+    "team": "Design System Maker Experience",
     "releaseModel": "continuous",
     "productPushConsumption": [
       "jira"
@@ -44,7 +44,7 @@
     "@atlaskit/ds-lib": "^2.2.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.11.0",
+    "@atlaskit/tokens": "^1.13.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
   },
@@ -89,7 +89,7 @@
     }
   },
   "platform-feature-flags": {
-    "platform.design-system-team.border-checkbox_nyoiu": {
+    "platform.design-system-team.update-border-radio-checkbox_7askv": {
       "type": "boolean"
     }
   },

package/tmp/api-report-tmp.d.ts

@@ -0,0 +1,91 @@
+## API Report File for "@atlaskit/radio"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+/// <reference types="react" />
+
+import { ChangeEvent } from 'react';
+import { ForwardRefExoticComponent } from 'react';
+import { InputHTMLAttributes } from 'react';
+import { MemoExoticComponent } from 'react';
+import { default as React_2 } from 'react';
+import { ReactNode } from 'react';
+import { RefAttributes } from 'react';
+import { SyntheticEvent } from 'react';
+import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
+import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+
+// @public (undocumented)
+type OptionPropType = {
+    isDisabled?: boolean;
+    label?: ReactNode;
+    name?: string;
+    value?: RadioValue;
+    testId?: string;
+};
+
+// @public (undocumented)
+type OptionsPropType = Array<OptionPropType>;
+
+// @public
+export const Radio: MemoExoticComponent<ForwardRefExoticComponent<Pick<Omit<Omit<InputHTMLAttributes<HTMLInputElement>, "aria-label" | "checked" | "disabled" | "required" | "value">, keyof {
+ariaLabel?: string | undefined;
+isDisabled?: boolean | undefined;
+isRequired?: boolean | undefined;
+isInvalid?: boolean | undefined;
+isChecked?: boolean | undefined;
+label?: ReactNode;
+onChange?: ((e: ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void) | undefined;
+value?: string | undefined;
+testId?: string | undefined;
+analyticsContext?: Record<string, any> | undefined;
+}> & {
+ariaLabel?: string | undefined;
+isDisabled?: boolean | undefined;
+isRequired?: boolean | undefined;
+isInvalid?: boolean | undefined;
+isChecked?: boolean | undefined;
+label?: ReactNode;
+onChange?: ((e: ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void) | undefined;
+value?: string | undefined;
+testId?: string | undefined;
+analyticsContext?: Record<string, any> | undefined;
+} & WithAnalyticsEventsProps, "about" | "accept" | "accessKey" | "alt" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "autoCapitalize" | "autoComplete" | "autoCorrect" | "autoFocus" | "autoSave" | "capture" | "children" | "className" | "color" | "contentEditable" | "contextMenu" | "createAnalyticsEvent" | "crossOrigin" | "dangerouslySetInnerHTML" | "datatype" | "defaultChecked" | "defaultValue" | "dir" | "draggable" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "hidden" | "id" | "inlist" | "inputMode" | "is" | "itemID" | "itemProp" | "itemRef" | "itemScope" | "itemType" | "lang" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "onAbort" | "onAbortCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAuxClick" | "onAuxClickCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onBlur" | "onBlurCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onChangeCapture" | "onClick" | "onClickCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onContextMenu" | "onContextMenuCapture" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onError" | "onErrorCapture" | "onFocus" | "onFocusCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onInput" | "onInputCapture" | "onInvalid" | "onInvalidCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onLoad" | "onLoadCapture" | "onLoadStart" | "onLoadStartCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onPaste" | "onPasteCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerOut" | "onPointerOutCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerUp" | "onPointerUpCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onReset" | "onResetCapture" | "onScroll" | "onScrollCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onSelect" | "onSelectCapture" | "onStalled" | "onStalledCapture" | "onSubmit" | "onSubmitCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onWheel" | "onWheelCapture" | "pattern" | "placeholder" | "prefix" | "property" | "radioGroup" | "readOnly" | "resource" | "results" | "role" | "security" | "size" | "slot" | "spellCheck" | "src" | "step" | "style" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "tabIndex" | "title" | "type" | "typeof" | "unselectable" | "vocab" | "width" | keyof {
+ariaLabel?: string | undefined;
+isDisabled?: boolean | undefined;
+isRequired?: boolean | undefined;
+isInvalid?: boolean | undefined;
+isChecked?: boolean | undefined;
+label?: ReactNode;
+onChange?: ((e: ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void) | undefined;
+value?: string | undefined;
+testId?: string | undefined;
+analyticsContext?: Record<string, any> | undefined;
+}> & RefAttributes<HTMLInputElement>>>;
+
+// @public (undocumented)
+export function RadioGroup(props: RadioGroupProps): JSX.Element;
+
+// @public (undocumented)
+interface RadioGroupProps {
+    'aria-labelledby'?: string;
+    analyticsContext?: Record<string, any>;
+    defaultValue?: RadioValue | null;
+    isDisabled?: boolean;
+    isInvalid?: boolean;
+    isRequired?: boolean;
+    name?: string;
+    onChange?: (e: React_2.ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void;
+    onInvalid?: (event: SyntheticEvent<any>) => void;
+    options: OptionsPropType;
+    value?: RadioValue | null;
+}
+
+// @public (undocumented)
+type RadioValue = string;
+
+// (No @packageDocumentation comment for this package)
+
+```