@atlaskit/checkbox 13.0.2 → 13.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 CHANGED
@@ -1,5 +1,15 @@
1
1
  # @atlaskit/checkbox
2
2
 
3
+ ## 13.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
  ## 13.0.2
4
14
 
5
15
  ### Patch Changes
@@ -12,7 +12,6 @@ var _react = require("react");
12
12
  var _react2 = require("@emotion/react");
13
13
  var _usePlatformLeafEventHandler = require("@atlaskit/analytics-next/usePlatformLeafEventHandler");
14
14
  var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
15
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
16
15
  var _colors = require("@atlaskit/theme/colors");
17
16
  var _internal = require("./internal");
18
17
  var _excluded = ["isChecked", "isDisabled", "isInvalid", "defaultChecked", "isIndeterminate", "size", "onChange", "analyticsContext", "label", "name", "value", "isRequired", "testId"];
@@ -47,7 +46,7 @@ var checkboxStyles = (0, _react2.css)({
47
46
  transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
48
47
  'rect:first-of-type': {
49
48
  stroke: 'var(--checkbox-border-color)',
50
- strokeWidth: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-width, 1px)" : 2,
49
+ strokeWidth: "var(--ds-border-width, 1px)",
51
50
  transition: 'stroke 0.2s ease-in-out'
52
51
  }
53
52
  },
@@ -167,7 +166,7 @@ var Checkbox = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
167
166
  analyticsData: analyticsContext,
168
167
  componentName: 'checkbox',
169
168
  packageName: "@atlaskit/checkbox",
170
- packageVersion: "13.0.2"
169
+ packageVersion: "13.1.0"
171
170
  });
172
171
  var internalRef = (0, _react.useRef)(null);
173
172
  var mergedRefs = (0, _mergeRefs.default)([internalRef, ref]);
@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = Label;
7
7
  var _react = require("@emotion/react");
8
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
9
8
  var _colors = require("@atlaskit/theme/colors");
10
9
  var _constants = require("./constants");
11
10
  /** @jsx jsx */
@@ -39,14 +38,14 @@ var labelStyles = (0, _react.css)({
39
38
  /**
40
39
  * Border
41
40
  */
42
- '--local-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, ")"),
41
+ '--local-border': "var(--ds-border-input, ".concat(_colors.N100, ")"),
43
42
  '--local-border-active': "var(--ds-border, ".concat(_colors.B50, ")"),
44
43
  '--local-border-checked': "var(--ds-background-selected-bold, ".concat(_colors.B400, ")"),
45
44
  '--local-border-checked-hover': "var(--ds-background-selected-bold-hovered, ".concat(_colors.B300, ")"),
46
45
  '--local-border-checked-invalid': "var(--ds-border-danger, ".concat(_colors.R300, ")"),
47
46
  '--local-border-disabled': "var(--ds-background-disabled, ".concat(_colors.N20, ")"),
48
47
  '--local-border-focus': "var(--ds-border-focused, ".concat(_colors.B200, ")"),
49
- '--local-border-hover': (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, ")"),
48
+ '--local-border-hover': "var(--ds-border-input, ".concat(_colors.N100, ")"),
50
49
  '--local-border-invalid': "var(--ds-border-danger, ".concat(_colors.R300, ")"),
51
50
  /**
52
51
  * Tick
@@ -4,7 +4,6 @@ import { forwardRef, memo, useCallback, useRef, useState } from 'react';
4
4
  import { css, jsx } from '@emotion/react';
5
5
  import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
6
6
  import mergeRefs from '@atlaskit/ds-lib/merge-refs';
7
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
8
7
  import { B200 } from '@atlaskit/theme/colors';
9
8
  import { CheckboxIcon, Label, LabelText, RequiredIndicator } from './internal';
10
9
  /* eslint-disable @atlaskit/design-system/no-nested-styles */
@@ -37,7 +36,7 @@ const checkboxStyles = css({
37
36
  transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
38
37
  'rect:first-of-type': {
39
38
  stroke: 'var(--checkbox-border-color)',
40
- strokeWidth: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-width, 1px)" : 2,
39
+ strokeWidth: "var(--ds-border-width, 1px)",
41
40
  transition: 'stroke 0.2s ease-in-out'
42
41
  }
43
42
  },
@@ -151,7 +150,7 @@ const Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Checkbox(pr
151
150
  analyticsData: analyticsContext,
152
151
  componentName: 'checkbox',
153
152
  packageName: "@atlaskit/checkbox",
154
- packageVersion: "13.0.2"
153
+ packageVersion: "13.1.0"
155
154
  });
156
155
  const internalRef = useRef(null);
157
156
  const mergedRefs = mergeRefs([internalRef, ref]);
@@ -1,7 +1,6 @@
1
1
  /** @jsx jsx */
2
2
  import { css, jsx } from '@emotion/react';
3
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
4
- import { B200, B300, B400, B50, N10, N100, N20, N30, N40, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
3
+ import { B200, B300, B400, B50, N10, N100, N20, N30, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
5
4
  import { fontFamily } from './constants';
6
5
  const baseStyles = css({
7
6
  display: 'grid',
@@ -32,14 +31,14 @@ const labelStyles = css({
32
31
  /**
33
32
  * Border
34
33
  */
35
- '--local-border': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${N100})` : `var(--ds-border-input, ${N40})`,
34
+ '--local-border': `var(--ds-border-input, ${N100})`,
36
35
  '--local-border-active': `var(--ds-border, ${B50})`,
37
36
  '--local-border-checked': `var(--ds-background-selected-bold, ${B400})`,
38
37
  '--local-border-checked-hover': `var(--ds-background-selected-bold-hovered, ${B300})`,
39
38
  '--local-border-checked-invalid': `var(--ds-border-danger, ${R300})`,
40
39
  '--local-border-disabled': `var(--ds-background-disabled, ${N20})`,
41
40
  '--local-border-focus': `var(--ds-border-focused, ${B200})`,
42
- '--local-border-hover': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? `var(--ds-border-bold, ${N100})` : `var(--ds-border-input, ${N40})`,
41
+ '--local-border-hover': `var(--ds-border-input, ${N100})`,
43
42
  '--local-border-invalid': `var(--ds-border-danger, ${R300})`,
44
43
  /**
45
44
  * Tick
@@ -7,7 +7,6 @@ import { forwardRef, memo, useCallback, useRef, useState } from 'react';
7
7
  import { css, jsx } from '@emotion/react';
8
8
  import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
9
9
  import mergeRefs from '@atlaskit/ds-lib/merge-refs';
10
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
11
10
  import { B200 } from '@atlaskit/theme/colors';
12
11
  import { CheckboxIcon, Label, LabelText, RequiredIndicator } from './internal';
13
12
  /* eslint-disable @atlaskit/design-system/no-nested-styles */
@@ -40,7 +39,7 @@ var checkboxStyles = css({
40
39
  transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
41
40
  'rect:first-of-type': {
42
41
  stroke: 'var(--checkbox-border-color)',
43
- strokeWidth: getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-width, 1px)" : 2,
42
+ strokeWidth: "var(--ds-border-width, 1px)",
44
43
  transition: 'stroke 0.2s ease-in-out'
45
44
  }
46
45
  },
@@ -160,7 +159,7 @@ var Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Checkbox(prop
160
159
  analyticsData: analyticsContext,
161
160
  componentName: 'checkbox',
162
161
  packageName: "@atlaskit/checkbox",
163
- packageVersion: "13.0.2"
162
+ packageVersion: "13.1.0"
164
163
  });
165
164
  var internalRef = useRef(null);
166
165
  var mergedRefs = mergeRefs([internalRef, ref]);
@@ -1,7 +1,6 @@
1
1
  /** @jsx jsx */
2
2
  import { css, jsx } from '@emotion/react';
3
- import { getBooleanFF } from '@atlaskit/platform-feature-flags';
4
- import { B200, B300, B400, B50, N10, N100, N20, N30, N40, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
3
+ import { B200, B300, B400, B50, N10, N100, N20, N30, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
5
4
  import { fontFamily } from './constants';
6
5
  var baseStyles = css({
7
6
  display: 'grid',
@@ -32,14 +31,14 @@ var labelStyles = css({
32
31
  /**
33
32
  * Border
34
33
  */
35
- '--local-border': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(N100, ")") : "var(--ds-border-input, ".concat(N40, ")"),
34
+ '--local-border': "var(--ds-border-input, ".concat(N100, ")"),
36
35
  '--local-border-active': "var(--ds-border, ".concat(B50, ")"),
37
36
  '--local-border-checked': "var(--ds-background-selected-bold, ".concat(B400, ")"),
38
37
  '--local-border-checked-hover': "var(--ds-background-selected-bold-hovered, ".concat(B300, ")"),
39
38
  '--local-border-checked-invalid': "var(--ds-border-danger, ".concat(R300, ")"),
40
39
  '--local-border-disabled': "var(--ds-background-disabled, ".concat(N20, ")"),
41
40
  '--local-border-focus': "var(--ds-border-focused, ".concat(B200, ")"),
42
- '--local-border-hover': getBooleanFF('platform.design-system-team.update-border-radio-checkbox_7askv') ? "var(--ds-border-bold, ".concat(N100, ")") : "var(--ds-border-input, ".concat(N40, ")"),
41
+ '--local-border-hover': "var(--ds-border-input, ".concat(N100, ")"),
43
42
  '--local-border-invalid': "var(--ds-border-danger, ".concat(R300, ")"),
44
43
  /**
45
44
  * Tick
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/checkbox",
3
- "version": "13.0.2",
3
+ "version": "13.1.0",
4
4
  "description": "A checkbox is an input control that allows a user to select one or more options from a number of choices.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -40,9 +40,8 @@
40
40
  "@atlaskit/analytics-next": "^9.2.0",
41
41
  "@atlaskit/ds-lib": "^2.2.0",
42
42
  "@atlaskit/icon": "^22.1.0",
43
- "@atlaskit/platform-feature-flags": "^0.2.0",
44
43
  "@atlaskit/theme": "^12.6.0",
45
- "@atlaskit/tokens": "^1.39.0",
44
+ "@atlaskit/tokens": "^1.41.0",
46
45
  "@babel/runtime": "^7.0.0",
47
46
  "@emotion/react": "^11.7.1"
48
47
  },
@@ -89,11 +88,6 @@
89
88
  ]
90
89
  }
91
90
  },
92
- "platform-feature-flags": {
93
- "platform.design-system-team.update-border-radio-checkbox_7askv": {
94
- "type": "boolean"
95
- }
96
- },
97
91
  "homepage": "https://atlassian.design/components/checkbox/",
98
92
  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
99
- }
93
+ }