@atlaskit/checkbox 12.6.2 → 12.6.4
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 +12 -0
- package/dist/cjs/checkbox.js +2 -2
- package/dist/cjs/internal/constants.js +2 -4
- package/dist/cjs/internal/theme.js +3 -3
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/checkbox.js +2 -2
- package/dist/es2019/internal/constants.js +2 -3
- package/dist/es2019/internal/theme.js +3 -3
- package/dist/es2019/version.json +1 -1
- package/dist/esm/checkbox.js +2 -2
- package/dist/esm/internal/constants.js +2 -3
- package/dist/esm/internal/theme.js +3 -3
- package/dist/esm/version.json +1 -1
- package/dist/types/internal/constants.d.ts +0 -1
- package/dist/types-ts4.5/internal/constants.d.ts +0 -1
- package/package.json +5 -5
- package/tmp/api-report-tmp.d.ts +62 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @atlaskit/checkbox
|
|
2
2
|
|
|
3
|
+
## 12.6.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`8f436f0c301`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8f436f0c301) - extend border contrast feature flag to support confluence
|
|
8
|
+
|
|
9
|
+
## 12.6.3
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`49b08bfdf5f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/49b08bfdf5f) - Migrated use of `gridSize` to space tokens where possible. There is no expected visual or behaviour change.
|
|
14
|
+
|
|
3
15
|
## 12.6.2
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
package/dist/cjs/checkbox.js
CHANGED
|
@@ -43,7 +43,7 @@ var checkboxStyles = (0, _react2.css)({
|
|
|
43
43
|
transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
|
|
44
44
|
'rect:first-of-type': {
|
|
45
45
|
stroke: 'var(--checkbox-border-color)',
|
|
46
|
-
strokeWidth: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.
|
|
46
|
+
strokeWidth: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? 1 : 2,
|
|
47
47
|
transition: 'stroke 0.2s ease-in-out'
|
|
48
48
|
}
|
|
49
49
|
},
|
|
@@ -161,7 +161,7 @@ var Checkbox = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
|
|
|
161
161
|
analyticsData: analyticsContext,
|
|
162
162
|
componentName: 'checkbox',
|
|
163
163
|
packageName: "@atlaskit/checkbox",
|
|
164
|
-
packageVersion: "12.6.
|
|
164
|
+
packageVersion: "12.6.4"
|
|
165
165
|
});
|
|
166
166
|
var internalRef = (0, _react.useRef)(null);
|
|
167
167
|
var mergedRefs = (0, _mergeRefs.default)([internalRef, ref]);
|
|
@@ -3,9 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.fontFamily = void 0;
|
|
7
7
|
var _constants = require("@atlaskit/theme/constants");
|
|
8
8
|
var fontFamily = (0, _constants.fontFamily)();
|
|
9
|
-
exports.fontFamily = fontFamily;
|
|
10
|
-
var gridSize = (0, _constants.gridSize)();
|
|
11
|
-
exports.gridSize = gridSize;
|
|
9
|
+
exports.fontFamily = fontFamily;
|
|
@@ -9,8 +9,8 @@ var _colors = require("@atlaskit/theme/colors");
|
|
|
9
9
|
var theme = {
|
|
10
10
|
light: {
|
|
11
11
|
borderColor: {
|
|
12
|
-
rest: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.
|
|
13
|
-
hovered: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.
|
|
12
|
+
rest: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.N100 : _colors.N40, ")"),
|
|
13
|
+
hovered: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.N100 : _colors.N40, ")"),
|
|
14
14
|
disabled: "var(--ds-background-disabled, ".concat(_colors.N20, ")"),
|
|
15
15
|
checked: "var(--ds-background-selected-bold, ".concat(_colors.B400, ")"),
|
|
16
16
|
active: "var(--ds-border, ".concat(_colors.B50, ")"),
|
|
@@ -35,7 +35,7 @@ var theme = {
|
|
|
35
35
|
},
|
|
36
36
|
dark: {
|
|
37
37
|
borderColor: {
|
|
38
|
-
rest: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.
|
|
38
|
+
rest: "var(--ds-border-input, ".concat((0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.border-checkbox_nyoiu') ? _colors.DN200 : _colors.DN80, ")"),
|
|
39
39
|
hovered: "var(--ds-border-input, ".concat(_colors.DN200, ")"),
|
|
40
40
|
disabled: "var(--ds-background-disabled, ".concat(_colors.DN10, ")"),
|
|
41
41
|
checked: "var(--ds-background-selected-bold, ".concat(_colors.B400, ")"),
|
package/dist/cjs/version.json
CHANGED
package/dist/es2019/checkbox.js
CHANGED
|
@@ -33,7 +33,7 @@ const checkboxStyles = css({
|
|
|
33
33
|
transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
|
|
34
34
|
'rect:first-of-type': {
|
|
35
35
|
stroke: 'var(--checkbox-border-color)',
|
|
36
|
-
strokeWidth: getBooleanFF('platform.design-system-team.
|
|
36
|
+
strokeWidth: getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? 1 : 2,
|
|
37
37
|
transition: 'stroke 0.2s ease-in-out'
|
|
38
38
|
}
|
|
39
39
|
},
|
|
@@ -145,7 +145,7 @@ const Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Checkbox(pr
|
|
|
145
145
|
analyticsData: analyticsContext,
|
|
146
146
|
componentName: 'checkbox',
|
|
147
147
|
packageName: "@atlaskit/checkbox",
|
|
148
|
-
packageVersion: "12.6.
|
|
148
|
+
packageVersion: "12.6.4"
|
|
149
149
|
});
|
|
150
150
|
const internalRef = useRef(null);
|
|
151
151
|
const mergedRefs = mergeRefs([internalRef, ref]);
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import { fontFamily as getFontFamily
|
|
2
|
-
export const fontFamily = getFontFamily();
|
|
3
|
-
export const gridSize = getGridSize();
|
|
1
|
+
import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
|
|
2
|
+
export const fontFamily = getFontFamily();
|
|
@@ -3,8 +3,8 @@ import { B100, B200, B300, B400, B50, B75, DN10, DN200, DN30, DN80, DN90, N10, N
|
|
|
3
3
|
const theme = {
|
|
4
4
|
light: {
|
|
5
5
|
borderColor: {
|
|
6
|
-
rest: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.
|
|
7
|
-
hovered: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.
|
|
6
|
+
rest: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40})`,
|
|
7
|
+
hovered: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40})`,
|
|
8
8
|
disabled: `var(--ds-background-disabled, ${N20})`,
|
|
9
9
|
checked: `var(--ds-background-selected-bold, ${B400})`,
|
|
10
10
|
active: `var(--ds-border, ${B50})`,
|
|
@@ -29,7 +29,7 @@ const theme = {
|
|
|
29
29
|
},
|
|
30
30
|
dark: {
|
|
31
31
|
borderColor: {
|
|
32
|
-
rest: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.
|
|
32
|
+
rest: `var(--ds-border-input, ${getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? DN200 : DN80})`,
|
|
33
33
|
hovered: `var(--ds-border-input, ${DN200})`,
|
|
34
34
|
disabled: `var(--ds-background-disabled, ${DN10})`,
|
|
35
35
|
checked: `var(--ds-background-selected-bold, ${B400})`,
|
package/dist/es2019/version.json
CHANGED
package/dist/esm/checkbox.js
CHANGED
|
@@ -36,7 +36,7 @@ var checkboxStyles = css({
|
|
|
36
36
|
transition: 'color 0.2s ease-in-out, fill 0.2s ease-in-out',
|
|
37
37
|
'rect:first-of-type': {
|
|
38
38
|
stroke: 'var(--checkbox-border-color)',
|
|
39
|
-
strokeWidth: getBooleanFF('platform.design-system-team.
|
|
39
|
+
strokeWidth: getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? 1 : 2,
|
|
40
40
|
transition: 'stroke 0.2s ease-in-out'
|
|
41
41
|
}
|
|
42
42
|
},
|
|
@@ -154,7 +154,7 @@ var Checkbox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Checkbox(prop
|
|
|
154
154
|
analyticsData: analyticsContext,
|
|
155
155
|
componentName: 'checkbox',
|
|
156
156
|
packageName: "@atlaskit/checkbox",
|
|
157
|
-
packageVersion: "12.6.
|
|
157
|
+
packageVersion: "12.6.4"
|
|
158
158
|
});
|
|
159
159
|
var internalRef = useRef(null);
|
|
160
160
|
var mergedRefs = mergeRefs([internalRef, ref]);
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import { fontFamily as getFontFamily
|
|
2
|
-
export var fontFamily = getFontFamily();
|
|
3
|
-
export var gridSize = getGridSize();
|
|
1
|
+
import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
|
|
2
|
+
export var fontFamily = getFontFamily();
|
|
@@ -3,8 +3,8 @@ import { B100, B200, B300, B400, B50, B75, DN10, DN200, DN30, DN80, DN90, N10, N
|
|
|
3
3
|
var theme = {
|
|
4
4
|
light: {
|
|
5
5
|
borderColor: {
|
|
6
|
-
rest: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.
|
|
7
|
-
hovered: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.
|
|
6
|
+
rest: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40, ")"),
|
|
7
|
+
hovered: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? N100 : N40, ")"),
|
|
8
8
|
disabled: "var(--ds-background-disabled, ".concat(N20, ")"),
|
|
9
9
|
checked: "var(--ds-background-selected-bold, ".concat(B400, ")"),
|
|
10
10
|
active: "var(--ds-border, ".concat(B50, ")"),
|
|
@@ -29,7 +29,7 @@ var theme = {
|
|
|
29
29
|
},
|
|
30
30
|
dark: {
|
|
31
31
|
borderColor: {
|
|
32
|
-
rest: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.
|
|
32
|
+
rest: "var(--ds-border-input, ".concat(getBooleanFF('platform.design-system-team.border-checkbox_nyoiu') ? DN200 : DN80, ")"),
|
|
33
33
|
hovered: "var(--ds-border-input, ".concat(DN200, ")"),
|
|
34
34
|
disabled: "var(--ds-background-disabled, ".concat(DN10, ")"),
|
|
35
35
|
checked: "var(--ds-background-selected-bold, ".concat(B400, ")"),
|
package/dist/esm/version.json
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/checkbox",
|
|
3
|
-
"version": "12.6.
|
|
3
|
+
"version": "12.6.4",
|
|
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/"
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"atlaskit:src": "src/index.tsx",
|
|
25
25
|
"atlassian": {
|
|
26
26
|
"team": "Design System Team",
|
|
27
|
-
"releaseModel": "
|
|
27
|
+
"releaseModel": "continuous",
|
|
28
28
|
"website": {
|
|
29
29
|
"name": "Checkbox",
|
|
30
30
|
"category": "Components"
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
"@atlaskit/icon": "^21.12.0",
|
|
40
40
|
"@atlaskit/platform-feature-flags": "^0.2.0",
|
|
41
41
|
"@atlaskit/theme": "^12.5.0",
|
|
42
|
-
"@atlaskit/tokens": "^1.
|
|
42
|
+
"@atlaskit/tokens": "^1.8.0",
|
|
43
43
|
"@babel/runtime": "^7.0.0",
|
|
44
44
|
"@emotion/react": "^11.7.1"
|
|
45
45
|
},
|
|
@@ -52,12 +52,12 @@
|
|
|
52
52
|
"@atlaskit/form": "^8.11.0",
|
|
53
53
|
"@atlaskit/section-message": "^6.4.0",
|
|
54
54
|
"@atlaskit/ssr": "*",
|
|
55
|
-
"@atlaskit/toggle": "^12.6.0",
|
|
56
55
|
"@atlaskit/visual-regression": "*",
|
|
57
56
|
"@atlaskit/webdriver-runner": "*",
|
|
58
57
|
"@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
|
|
59
58
|
"@atlassian/feature-flags-test-utils": "*",
|
|
60
59
|
"@testing-library/react": "^12.1.5",
|
|
60
|
+
"jest-axe": "^4.0.0",
|
|
61
61
|
"jscodeshift": "^0.13.0",
|
|
62
62
|
"react-dom": "^16.8.0",
|
|
63
63
|
"storybook-addon-performance": "^0.16.0",
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
}
|
|
91
91
|
},
|
|
92
92
|
"platform-feature-flags": {
|
|
93
|
-
"platform.design-system-team.
|
|
93
|
+
"platform.design-system-team.border-checkbox_nyoiu": {
|
|
94
94
|
"type": "boolean"
|
|
95
95
|
}
|
|
96
96
|
},
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
## API Report File for "@atlaskit/checkbox"
|
|
2
|
+
|
|
3
|
+
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
|
|
4
|
+
|
|
5
|
+
```ts
|
|
6
|
+
|
|
7
|
+
/// <reference types="react" />
|
|
8
|
+
|
|
9
|
+
import { ForwardRefExoticComponent } from 'react';
|
|
10
|
+
import { InputHTMLAttributes } from 'react';
|
|
11
|
+
import { MemoExoticComponent } from 'react';
|
|
12
|
+
import { default as React_2 } from 'react';
|
|
13
|
+
import { RefAttributes } from 'react';
|
|
14
|
+
import type UIAnalyticsEvent from '@atlaskit/analytics-next/UIAnalyticsEvent';
|
|
15
|
+
|
|
16
|
+
// @public
|
|
17
|
+
const Checkbox: MemoExoticComponent<ForwardRefExoticComponent<Omit<Omit<InputHTMLAttributes<HTMLInputElement>, "checked" | "css" | "disabled" | "required">, keyof OwnProps> & OwnProps & RefAttributes<HTMLInputElement>>>;
|
|
18
|
+
export { Checkbox }
|
|
19
|
+
export default Checkbox;
|
|
20
|
+
|
|
21
|
+
// @public (undocumented)
|
|
22
|
+
export type CheckboxProps = Combine<Omit<React_2.InputHTMLAttributes<HTMLInputElement>,
|
|
23
|
+
/**
|
|
24
|
+
* 'disabled', 'required', and 'checked' are omitted so that
|
|
25
|
+
* consumers must handle state using our props.
|
|
26
|
+
*
|
|
27
|
+
* 'css' is added globally to element attributes by emotion.
|
|
28
|
+
* This was causing a bug, making the css prop required in
|
|
29
|
+
* some cases. We explicitly omit it to avoid that.
|
|
30
|
+
*
|
|
31
|
+
* Because 'className' (which the css prop uses internally)
|
|
32
|
+
* is still available, this should not break existing usage.
|
|
33
|
+
*/
|
|
34
|
+
'checked' | 'css' | 'disabled' | 'required'>, OwnProps>;
|
|
35
|
+
|
|
36
|
+
// @public (undocumented)
|
|
37
|
+
type Combine<First, Second> = Omit<First, keyof Second> & Second;
|
|
38
|
+
|
|
39
|
+
// @public
|
|
40
|
+
type OwnProps = {
|
|
41
|
+
defaultChecked?: boolean;
|
|
42
|
+
id?: string;
|
|
43
|
+
isChecked?: boolean;
|
|
44
|
+
isDisabled?: boolean;
|
|
45
|
+
isIndeterminate?: boolean;
|
|
46
|
+
isInvalid?: boolean;
|
|
47
|
+
isRequired?: boolean;
|
|
48
|
+
label?: React_2.ReactChild;
|
|
49
|
+
name?: string;
|
|
50
|
+
onChange?: (e: React_2.ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void;
|
|
51
|
+
value?: number | string;
|
|
52
|
+
size?: Size;
|
|
53
|
+
testId?: string;
|
|
54
|
+
analyticsContext?: Record<string, any>;
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
// @public (undocumented)
|
|
58
|
+
type Size = 'large' | 'medium' | 'small' | 'xlarge';
|
|
59
|
+
|
|
60
|
+
// (No @packageDocumentation comment for this package)
|
|
61
|
+
|
|
62
|
+
```
|