@atlaskit/heading 5.1.0 → 5.2.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 +22 -0
- package/dist/cjs/heading.partial.compiled.css +7 -7
- package/dist/cjs/heading.partial.js +10 -22
- package/dist/es2019/heading.partial.compiled.css +7 -7
- package/dist/es2019/heading.partial.js +10 -22
- package/dist/esm/heading.partial.compiled.css +7 -7
- package/dist/esm/heading.partial.js +10 -22
- package/package.json +14 -18
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,27 @@
|
|
|
1
1
|
# @atlaskit/heading
|
|
2
2
|
|
|
3
|
+
## 5.2.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#138526](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/138526)
|
|
8
|
+
[`1c66b8e32f30a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1c66b8e32f30a) -
|
|
9
|
+
[ux] Removed feature flag `platform-typography-improved-color-control` resulting in automatic
|
|
10
|
+
color inversion based on bold surfaces will only affect the default color.
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- Updated dependencies
|
|
15
|
+
|
|
16
|
+
## 5.1.1
|
|
17
|
+
|
|
18
|
+
### Patch Changes
|
|
19
|
+
|
|
20
|
+
- [#129972](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/129972)
|
|
21
|
+
[`b2d69a39e6687`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b2d69a39e6687) -
|
|
22
|
+
Update `@compiled/react` dependency for improved type checking support.
|
|
23
|
+
- Updated dependencies
|
|
24
|
+
|
|
3
25
|
## 5.1.0
|
|
4
26
|
|
|
5
27
|
### Minor Changes
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
.
|
|
2
|
-
.
|
|
3
|
-
.
|
|
4
|
-
.
|
|
5
|
-
.
|
|
6
|
-
.
|
|
7
|
-
.
|
|
1
|
+
._11c8140y{font:var(--ds-font-heading-xsmall,normal 600 14px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
2
|
+
._11c81c04{font:var(--ds-font-heading-xlarge,normal 600 29px/2pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
3
|
+
._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
4
|
+
._11c84xcc{font:var(--ds-font-heading-xxlarge,normal 500 35px/40px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
5
|
+
._11c8lodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
6
|
+
._11c8nbxd{font:var(--ds-font-heading-small,normal 600 1pc/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
7
|
+
._11c8nf1z{font:var(--ds-font-heading-large,normal 500 24px/28px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
8
8
|
._1mouidpf{margin-block:0}
|
|
9
9
|
._1dyz4jg8{letter-spacing:normal}
|
|
10
10
|
._1p1dglyw{text-transform:none}
|
|
@@ -12,7 +12,6 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
12
12
|
var React = _react;
|
|
13
13
|
var _runtime = require("@compiled/react/runtime");
|
|
14
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
16
15
|
var _primitives = require("@atlaskit/primitives");
|
|
17
16
|
var _compiled = require("@atlaskit/primitives/compiled");
|
|
18
17
|
var _headingContext = require("./heading-context");
|
|
@@ -43,13 +42,13 @@ var headingColorStylesMap = {
|
|
|
43
42
|
* @codegenCommand yarn workspace @atlaskit/heading codegen
|
|
44
43
|
*/
|
|
45
44
|
var headingSizeStylesMap = {
|
|
46
|
-
xxlarge: "
|
|
47
|
-
xlarge: "
|
|
48
|
-
large: "
|
|
49
|
-
medium: "
|
|
50
|
-
small: "
|
|
51
|
-
xsmall: "
|
|
52
|
-
xxsmall: "
|
|
45
|
+
xxlarge: "_11c84xcc",
|
|
46
|
+
xlarge: "_11c81c04",
|
|
47
|
+
large: "_11c8nf1z",
|
|
48
|
+
medium: "_11c8lodh",
|
|
49
|
+
small: "_11c8nbxd",
|
|
50
|
+
xsmall: "_11c8140y",
|
|
51
|
+
xxsmall: "_11c81vhk"
|
|
53
52
|
};
|
|
54
53
|
/**
|
|
55
54
|
* @codegenEnd
|
|
@@ -57,24 +56,13 @@ var headingSizeStylesMap = {
|
|
|
57
56
|
|
|
58
57
|
var useColor = function useColor(colorProp) {
|
|
59
58
|
var surface = (0, _compiled.UNSAFE_useSurface)();
|
|
60
|
-
if (
|
|
61
|
-
|
|
62
|
-
return colorProp;
|
|
63
|
-
}
|
|
64
|
-
if (_primitives.UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
|
|
65
|
-
return _primitives.UNSAFE_inverseColorMap[surface];
|
|
66
|
-
}
|
|
67
|
-
return 'color.text';
|
|
59
|
+
if (colorProp) {
|
|
60
|
+
return colorProp;
|
|
68
61
|
}
|
|
69
|
-
|
|
70
|
-
/**
|
|
71
|
-
* Where the color of the surface is inverted we always override the color
|
|
72
|
-
* as there is no valid choice that is not covered by the override.
|
|
73
|
-
*/
|
|
74
62
|
if (_primitives.UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
|
|
75
63
|
return _primitives.UNSAFE_inverseColorMap[surface];
|
|
76
64
|
}
|
|
77
|
-
return
|
|
65
|
+
return 'color.text';
|
|
78
66
|
};
|
|
79
67
|
|
|
80
68
|
/**
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
.
|
|
2
|
-
.
|
|
3
|
-
.
|
|
4
|
-
.
|
|
5
|
-
.
|
|
6
|
-
.
|
|
7
|
-
.
|
|
1
|
+
._11c8140y{font:var(--ds-font-heading-xsmall,normal 600 14px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
2
|
+
._11c81c04{font:var(--ds-font-heading-xlarge,normal 600 29px/2pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
3
|
+
._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
4
|
+
._11c84xcc{font:var(--ds-font-heading-xxlarge,normal 500 35px/40px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
5
|
+
._11c8lodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
6
|
+
._11c8nbxd{font:var(--ds-font-heading-small,normal 600 1pc/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
7
|
+
._11c8nf1z{font:var(--ds-font-heading-large,normal 500 24px/28px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
8
8
|
._1mouidpf{margin-block:0}
|
|
9
9
|
._1dyz4jg8{letter-spacing:normal}
|
|
10
10
|
._1p1dglyw{text-transform:none}
|
|
@@ -3,7 +3,6 @@ import "./heading.partial.compiled.css";
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
5
|
import { forwardRef } from 'react';
|
|
6
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
6
|
import { UNSAFE_inverseColorMap } from '@atlaskit/primitives';
|
|
8
7
|
import { UNSAFE_useSurface } from '@atlaskit/primitives/compiled';
|
|
9
8
|
import { useHeading } from './heading-context';
|
|
@@ -32,13 +31,13 @@ const headingColorStylesMap = {
|
|
|
32
31
|
* @codegenCommand yarn workspace @atlaskit/heading codegen
|
|
33
32
|
*/
|
|
34
33
|
const headingSizeStylesMap = {
|
|
35
|
-
xxlarge: "
|
|
36
|
-
xlarge: "
|
|
37
|
-
large: "
|
|
38
|
-
medium: "
|
|
39
|
-
small: "
|
|
40
|
-
xsmall: "
|
|
41
|
-
xxsmall: "
|
|
34
|
+
xxlarge: "_11c84xcc",
|
|
35
|
+
xlarge: "_11c81c04",
|
|
36
|
+
large: "_11c8nf1z",
|
|
37
|
+
medium: "_11c8lodh",
|
|
38
|
+
small: "_11c8nbxd",
|
|
39
|
+
xsmall: "_11c8140y",
|
|
40
|
+
xxsmall: "_11c81vhk"
|
|
42
41
|
};
|
|
43
42
|
/**
|
|
44
43
|
* @codegenEnd
|
|
@@ -46,24 +45,13 @@ const headingSizeStylesMap = {
|
|
|
46
45
|
|
|
47
46
|
const useColor = colorProp => {
|
|
48
47
|
const surface = UNSAFE_useSurface();
|
|
49
|
-
if (
|
|
50
|
-
|
|
51
|
-
return colorProp;
|
|
52
|
-
}
|
|
53
|
-
if (UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
|
|
54
|
-
return UNSAFE_inverseColorMap[surface];
|
|
55
|
-
}
|
|
56
|
-
return 'color.text';
|
|
48
|
+
if (colorProp) {
|
|
49
|
+
return colorProp;
|
|
57
50
|
}
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* Where the color of the surface is inverted we always override the color
|
|
61
|
-
* as there is no valid choice that is not covered by the override.
|
|
62
|
-
*/
|
|
63
51
|
if (UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
|
|
64
52
|
return UNSAFE_inverseColorMap[surface];
|
|
65
53
|
}
|
|
66
|
-
return
|
|
54
|
+
return 'color.text';
|
|
67
55
|
};
|
|
68
56
|
|
|
69
57
|
/**
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
.
|
|
2
|
-
.
|
|
3
|
-
.
|
|
4
|
-
.
|
|
5
|
-
.
|
|
6
|
-
.
|
|
7
|
-
.
|
|
1
|
+
._11c8140y{font:var(--ds-font-heading-xsmall,normal 600 14px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
2
|
+
._11c81c04{font:var(--ds-font-heading-xlarge,normal 600 29px/2pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
3
|
+
._11c81vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
4
|
+
._11c84xcc{font:var(--ds-font-heading-xxlarge,normal 500 35px/40px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
5
|
+
._11c8lodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
6
|
+
._11c8nbxd{font:var(--ds-font-heading-small,normal 600 1pc/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
7
|
+
._11c8nf1z{font:var(--ds-font-heading-large,normal 500 24px/28px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
|
|
8
8
|
._1mouidpf{margin-block:0}
|
|
9
9
|
._1dyz4jg8{letter-spacing:normal}
|
|
10
10
|
._1p1dglyw{text-transform:none}
|
|
@@ -4,7 +4,6 @@ import "./heading.partial.compiled.css";
|
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import { ax, ix } from "@compiled/react/runtime";
|
|
6
6
|
import { forwardRef } from 'react';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
7
|
import { UNSAFE_inverseColorMap } from '@atlaskit/primitives';
|
|
9
8
|
import { UNSAFE_useSurface } from '@atlaskit/primitives/compiled';
|
|
10
9
|
import { useHeading } from './heading-context';
|
|
@@ -33,13 +32,13 @@ var headingColorStylesMap = {
|
|
|
33
32
|
* @codegenCommand yarn workspace @atlaskit/heading codegen
|
|
34
33
|
*/
|
|
35
34
|
var headingSizeStylesMap = {
|
|
36
|
-
xxlarge: "
|
|
37
|
-
xlarge: "
|
|
38
|
-
large: "
|
|
39
|
-
medium: "
|
|
40
|
-
small: "
|
|
41
|
-
xsmall: "
|
|
42
|
-
xxsmall: "
|
|
35
|
+
xxlarge: "_11c84xcc",
|
|
36
|
+
xlarge: "_11c81c04",
|
|
37
|
+
large: "_11c8nf1z",
|
|
38
|
+
medium: "_11c8lodh",
|
|
39
|
+
small: "_11c8nbxd",
|
|
40
|
+
xsmall: "_11c8140y",
|
|
41
|
+
xxsmall: "_11c81vhk"
|
|
43
42
|
};
|
|
44
43
|
/**
|
|
45
44
|
* @codegenEnd
|
|
@@ -47,24 +46,13 @@ var headingSizeStylesMap = {
|
|
|
47
46
|
|
|
48
47
|
var useColor = function useColor(colorProp) {
|
|
49
48
|
var surface = UNSAFE_useSurface();
|
|
50
|
-
if (
|
|
51
|
-
|
|
52
|
-
return colorProp;
|
|
53
|
-
}
|
|
54
|
-
if (UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
|
|
55
|
-
return UNSAFE_inverseColorMap[surface];
|
|
56
|
-
}
|
|
57
|
-
return 'color.text';
|
|
49
|
+
if (colorProp) {
|
|
50
|
+
return colorProp;
|
|
58
51
|
}
|
|
59
|
-
|
|
60
|
-
/**
|
|
61
|
-
* Where the color of the surface is inverted we always override the color
|
|
62
|
-
* as there is no valid choice that is not covered by the override.
|
|
63
|
-
*/
|
|
64
52
|
if (UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
|
|
65
53
|
return UNSAFE_inverseColorMap[surface];
|
|
66
54
|
}
|
|
67
|
-
return
|
|
55
|
+
return 'color.text';
|
|
68
56
|
};
|
|
69
57
|
|
|
70
58
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/heading",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.2.0",
|
|
4
4
|
"description": "A heading is a typography component used to display text in different sizes and formats.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -32,25 +32,25 @@
|
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@atlaskit/css": "^0.10.0",
|
|
35
|
-
"@atlaskit/
|
|
36
|
-
"@atlaskit/
|
|
37
|
-
"@atlaskit/tokens": "^4.2.0",
|
|
35
|
+
"@atlaskit/primitives": "^14.4.0",
|
|
36
|
+
"@atlaskit/tokens": "^4.7.0",
|
|
38
37
|
"@babel/runtime": "^7.0.0",
|
|
39
|
-
"@compiled/react": "^0.18.
|
|
40
|
-
"@emotion/react": "^11.7.1"
|
|
38
|
+
"@compiled/react": "^0.18.3"
|
|
41
39
|
},
|
|
42
40
|
"peerDependencies": {
|
|
43
41
|
"react": "^18.2.0"
|
|
44
42
|
},
|
|
45
43
|
"devDependencies": {
|
|
46
|
-
"@af/accessibility-testing": "
|
|
47
|
-
"@af/formatting": "
|
|
48
|
-
"@af/integration-testing": "
|
|
49
|
-
"@af/visual-regression": "
|
|
50
|
-
"@atlaskit/button": "^
|
|
44
|
+
"@af/accessibility-testing": "^2.0.0",
|
|
45
|
+
"@af/formatting": "^0.0.4",
|
|
46
|
+
"@af/integration-testing": "^0.5.0",
|
|
47
|
+
"@af/visual-regression": "^1.3.0",
|
|
48
|
+
"@atlaskit/button": "^23.0.0",
|
|
49
|
+
"@atlaskit/docs": "^10.0.0",
|
|
51
50
|
"@atlaskit/ds-lib": "^4.0.0",
|
|
52
|
-
"@atlaskit/ssr": "
|
|
51
|
+
"@atlaskit/ssr": "^0.4.0",
|
|
53
52
|
"@atlassian/codegen": "^0.1.0",
|
|
53
|
+
"@atlassian/ssr-tests": "^0.2.0",
|
|
54
54
|
"@testing-library/react": "^13.4.0",
|
|
55
55
|
"react-dom": "^18.2.0",
|
|
56
56
|
"ts-node": "^10.9.1",
|
|
@@ -65,6 +65,7 @@
|
|
|
65
65
|
"dom-events": "use-bind-event-listener",
|
|
66
66
|
"design-system": "v1",
|
|
67
67
|
"styling": [
|
|
68
|
+
"static",
|
|
68
69
|
"emotion"
|
|
69
70
|
],
|
|
70
71
|
"ui-components": "lite-mode",
|
|
@@ -87,10 +88,5 @@
|
|
|
87
88
|
"af:exports": {
|
|
88
89
|
".": "./src/index.tsx"
|
|
89
90
|
},
|
|
90
|
-
"homepage": "https://atlassian.design/components/heading/"
|
|
91
|
-
"platform-feature-flags": {
|
|
92
|
-
"platform-typography-improved-color-control": {
|
|
93
|
-
"type": "boolean"
|
|
94
|
-
}
|
|
95
|
-
}
|
|
91
|
+
"homepage": "https://atlassian.design/components/heading/"
|
|
96
92
|
}
|