@atlaskit/heading 5.2.16 → 5.2.18

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 (19) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/heading.compiled.css +26 -0
  3. package/dist/cjs/{heading.partial.js → heading.js} +45 -9
  4. package/dist/cjs/index.js +1 -1
  5. package/dist/es2019/heading.compiled.css +26 -0
  6. package/dist/es2019/{heading.partial.js → heading.js} +45 -9
  7. package/dist/es2019/index.js +1 -1
  8. package/dist/esm/heading.compiled.css +26 -0
  9. package/dist/esm/{heading.partial.js → heading.js} +46 -9
  10. package/dist/esm/index.js +1 -1
  11. package/dist/{types-ts4.5/heading.partial.d.ts → types/heading.d.ts} +28 -18
  12. package/dist/types/index.d.ts +1 -1
  13. package/dist/{types/heading.partial.d.ts → types-ts4.5/heading.d.ts} +28 -18
  14. package/dist/types-ts4.5/index.d.ts +1 -1
  15. package/package.json +9 -6
  16. package/dist/cjs/heading.partial.compiled.css +0 -13
  17. package/dist/es2019/heading.partial.compiled.css +0 -13
  18. package/dist/esm/heading.partial.compiled.css +0 -13
  19. package/scripts/codegen.tsx +0 -65
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @atlaskit/heading
2
2
 
3
+ ## 5.2.18
4
+
5
+ ### Patch Changes
6
+
7
+ - [`1791263fbda89`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1791263fbda89) -
8
+ Increased specificity for font styles to ensure Heading is not affected by unwanted
9
+ classnameoverrides. This change is applied behind a feature gate and will soon become the default.
10
+
11
+ ## 5.2.17
12
+
13
+ ### Patch Changes
14
+
15
+ - [`6832ded6661b2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6832ded6661b2) -
16
+ Increased specificity for font styles to ensure Heading is not affected by unwanted classname
17
+ overrides. This change is applied behind a feature gate and will soon become the default.
18
+ - Updated dependencies
19
+
3
20
  ## 5.2.16
4
21
 
5
22
  ### Patch Changes
package/dist/cjs/heading.compiled.css ADDED
@@ -0,0 +1,26 @@
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
+ ._fqox140y._fqox140y{font:var(--ds-font-heading-xsmall,normal 600 14px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
9
+ ._fqox1c04._fqox1c04{font:var(--ds-font-heading-xlarge,normal 600 29px/2pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
10
+ ._fqox1vhk._fqox1vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
11
+ ._fqox4xcc._fqox4xcc{font:var(--ds-font-heading-xxlarge,normal 500 35px/40px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
12
+ ._fqoxlodh._fqoxlodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
13
+ ._fqoxnbxd._fqoxnbxd{font:var(--ds-font-heading-small,normal 600 1pc/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
14
+ ._fqoxnf1z._fqoxnf1z{font:var(--ds-font-heading-large,normal 500 24px/28px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
15
+ ._1mouidpf{margin-block:0}
16
+ ._dxsyidpf._dxsyidpf{margin-block:0}
17
+ ._1dyz4jg8{letter-spacing:normal}
18
+ ._1i144jg8._1i144jg8{letter-spacing:normal}
19
+ ._1p1dglyw{text-transform:none}
20
+ ._1w9015cr._1w9015cr{color:var(--ds-text-inverse,#fff)}
21
+ ._1w901yd3._1w901yd3{color:var(--ds-text-warning-inverse,#292a2e)}
22
+ ._1w90i7uo._1w90i7uo{color:var(--ds-text,#292a2e)}
23
+ ._nmk4glyw._nmk4glyw{text-transform:none}
24
+ ._syaz15cr{color:var(--ds-text-inverse,#fff)}
25
+ ._syaz1yd3{color:var(--ds-text-warning-inverse,#292a2e)}
26
+ ._syazi7uo{color:var(--ds-text,#292a2e)}
package/dist/cjs/{heading.partial.js → heading.js} RENAMED
@@ -1,4 +1,4 @@
1
- /* heading.partial.tsx generated by @compiled/babel-plugin v0.38.1 */
1
+ /* heading.tsx generated by @compiled/babel-plugin v0.38.1 */
2
2
  "use strict";
3
3
 
4
4
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -7,15 +7,17 @@ Object.defineProperty(exports, "__esModule", {
7
7
  value: true
8
8
  });
9
9
  exports.default = void 0;
10
- require("./heading.partial.compiled.css");
10
+ require("./heading.compiled.css");
11
11
  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");
15
16
  var _primitives = require("@atlaskit/primitives");
16
17
  var _compiled = require("@atlaskit/primitives/compiled");
17
18
  var _headingContext = require("./heading-context");
18
19
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
20
+ /* eslint-disable @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors */
19
21
  // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
20
22
  var sizeTagMap = {
21
23
  xxlarge: 'h1',
@@ -26,22 +28,27 @@ var sizeTagMap = {
26
28
  xsmall: 'h5',
27
29
  xxsmall: 'h6'
28
30
  };
31
+
32
+ /**
33
+ * Remove with `platform-dst-heading-specificity` fg cleanup
34
+ */
29
35
  var styles = {
30
36
  reset: "_1mouidpf _1dyz4jg8 _1p1dglyw"
31
37
  };
32
- var headingColorStylesMap = {
38
+
39
+ /**
40
+ * Remove with `platform-dst-heading-specificity` fg cleanup
41
+ */
42
+ var headingColorStyles = {
33
43
  'color.text': "_syazi7uo",
34
44
  'color.text.inverse': "_syaz15cr",
35
45
  'color.text.warning.inverse': "_syaz1yd3"
36
46
  };
37
47
 
38
48
  /**
39
- * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
40
- * @codegen <<SignedSource::406afb01e5634a0b459f50de660d8c2e>>
41
- * @codegenId typography
42
- * @codegenCommand yarn workspace @atlaskit/heading codegen
49
+ * Remove with `platform-dst-heading-specificity` fg cleanup
43
50
  */
44
- var headingSizeStylesMap = {
51
+ var headingSizeStyles = {
45
52
  xxlarge: "_11c84xcc",
46
53
  xlarge: "_11c81c04",
47
54
  large: "_11c8nf1z",
@@ -50,6 +57,35 @@ var headingSizeStylesMap = {
50
57
  xsmall: "_11c8140y",
51
58
  xxsmall: "_11c81vhk"
52
59
  };
60
+
61
+ /**
62
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
63
+ */
64
+ var stylesWithSpecificity = {
65
+ reset: "_dxsyidpf _1i144jg8 _nmk4glyw"
66
+ };
67
+
68
+ /**
69
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
70
+ */
71
+ var headingColorStylesWithSpecificity = {
72
+ 'color.text': "_1w90i7uo",
73
+ 'color.text.inverse': "_1w9015cr",
74
+ 'color.text.warning.inverse': "_1w901yd3"
75
+ };
76
+
77
+ /**
78
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
79
+ */
80
+ var headingSizeWithSpecificityStyles = {
81
+ xxlarge: "_fqox4xcc",
82
+ xlarge: "_fqox1c04",
83
+ large: "_fqoxnf1z",
84
+ medium: "_fqoxlodh",
85
+ small: "_fqoxnbxd",
86
+ xsmall: "_fqox140y",
87
+ xxsmall: "_fqox1vhk"
88
+ };
53
89
  /**
54
90
  * @codegenEnd
55
91
  */
@@ -99,7 +135,7 @@ var Heading = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
99
135
  "data-testid": testId,
100
136
  role: needsAriaRole ? 'heading' : undefined,
101
137
  "aria-level": needsAriaRole ? hLevel : undefined,
102
- className: (0, _runtime.ax)([styles.reset, size && headingSizeStylesMap[size], headingColorStylesMap[color]])
138
+ className: (0, _runtime.ax)([styles.reset, (0, _platformFeatureFlags.fg)('platform-dst-heading-specificity') && stylesWithSpecificity.reset, headingSizeStyles[size], (0, _platformFeatureFlags.fg)('platform-dst-heading-specificity') && headingSizeWithSpecificityStyles[size], headingColorStyles[color], (0, _platformFeatureFlags.fg)('platform-dst-heading-specificity') && headingColorStylesWithSpecificity[color]])
103
139
  }, children);
104
140
  });
105
141
  var _default = exports.default = Heading;
package/dist/cjs/index.js CHANGED
@@ -16,5 +16,5 @@ Object.defineProperty(exports, "default", {
16
16
  return _heading.default;
17
17
  }
18
18
  });
19
- var _heading = _interopRequireDefault(require("./heading.partial"));
19
+ var _heading = _interopRequireDefault(require("./heading"));
20
20
  var _headingContext = _interopRequireDefault(require("./heading-context"));
package/dist/es2019/heading.compiled.css ADDED
@@ -0,0 +1,26 @@
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
+ ._fqox140y._fqox140y{font:var(--ds-font-heading-xsmall,normal 600 14px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
9
+ ._fqox1c04._fqox1c04{font:var(--ds-font-heading-xlarge,normal 600 29px/2pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
10
+ ._fqox1vhk._fqox1vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
11
+ ._fqox4xcc._fqox4xcc{font:var(--ds-font-heading-xxlarge,normal 500 35px/40px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
12
+ ._fqoxlodh._fqoxlodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
13
+ ._fqoxnbxd._fqoxnbxd{font:var(--ds-font-heading-small,normal 600 1pc/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
14
+ ._fqoxnf1z._fqoxnf1z{font:var(--ds-font-heading-large,normal 500 24px/28px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
15
+ ._1mouidpf{margin-block:0}
16
+ ._dxsyidpf._dxsyidpf{margin-block:0}
17
+ ._1dyz4jg8{letter-spacing:normal}
18
+ ._1i144jg8._1i144jg8{letter-spacing:normal}
19
+ ._1p1dglyw{text-transform:none}
20
+ ._1w9015cr._1w9015cr{color:var(--ds-text-inverse,#fff)}
21
+ ._1w901yd3._1w901yd3{color:var(--ds-text-warning-inverse,#292a2e)}
22
+ ._1w90i7uo._1w90i7uo{color:var(--ds-text,#292a2e)}
23
+ ._nmk4glyw._nmk4glyw{text-transform:none}
24
+ ._syaz15cr{color:var(--ds-text-inverse,#fff)}
25
+ ._syaz1yd3{color:var(--ds-text-warning-inverse,#292a2e)}
26
+ ._syazi7uo{color:var(--ds-text,#292a2e)}
package/dist/es2019/{heading.partial.js → heading.js} RENAMED
@@ -1,8 +1,10 @@
1
- /* heading.partial.tsx generated by @compiled/babel-plugin v0.38.1 */
2
- import "./heading.partial.compiled.css";
1
+ /* heading.tsx generated by @compiled/babel-plugin v0.38.1 */
2
+ /* eslint-disable @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors */
3
+ import "./heading.compiled.css";
3
4
  import * as React from 'react';
4
5
  import { ax, ix } from "@compiled/react/runtime";
5
6
  import { forwardRef } from 'react';
7
+ import { fg } from '@atlaskit/platform-feature-flags';
6
8
  // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
7
9
  import { UNSAFE_inverseColorMap } from '@atlaskit/primitives';
8
10
  import { UNSAFE_useSurface } from '@atlaskit/primitives/compiled';
@@ -16,22 +18,27 @@ const sizeTagMap = {
16
18
  xsmall: 'h5',
17
19
  xxsmall: 'h6'
18
20
  };
21
+
22
+ /**
23
+ * Remove with `platform-dst-heading-specificity` fg cleanup
24
+ */
19
25
  const styles = {
20
26
  reset: "_1mouidpf _1dyz4jg8 _1p1dglyw"
21
27
  };
22
- const headingColorStylesMap = {
28
+
29
+ /**
30
+ * Remove with `platform-dst-heading-specificity` fg cleanup
31
+ */
32
+ const headingColorStyles = {
23
33
  'color.text': "_syazi7uo",
24
34
  'color.text.inverse': "_syaz15cr",
25
35
  'color.text.warning.inverse': "_syaz1yd3"
26
36
  };
27
37
 
28
38
  /**
29
- * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
30
- * @codegen <<SignedSource::406afb01e5634a0b459f50de660d8c2e>>
31
- * @codegenId typography
32
- * @codegenCommand yarn workspace @atlaskit/heading codegen
39
+ * Remove with `platform-dst-heading-specificity` fg cleanup
33
40
  */
34
- const headingSizeStylesMap = {
41
+ const headingSizeStyles = {
35
42
  xxlarge: "_11c84xcc",
36
43
  xlarge: "_11c81c04",
37
44
  large: "_11c8nf1z",
@@ -40,6 +47,35 @@ const headingSizeStylesMap = {
40
47
  xsmall: "_11c8140y",
41
48
  xxsmall: "_11c81vhk"
42
49
  };
50
+
51
+ /**
52
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
53
+ */
54
+ const stylesWithSpecificity = {
55
+ reset: "_dxsyidpf _1i144jg8 _nmk4glyw"
56
+ };
57
+
58
+ /**
59
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
60
+ */
61
+ const headingColorStylesWithSpecificity = {
62
+ 'color.text': "_1w90i7uo",
63
+ 'color.text.inverse': "_1w9015cr",
64
+ 'color.text.warning.inverse': "_1w901yd3"
65
+ };
66
+
67
+ /**
68
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
69
+ */
70
+ const headingSizeWithSpecificityStyles = {
71
+ xxlarge: "_fqox4xcc",
72
+ xlarge: "_fqox1c04",
73
+ large: "_fqoxnf1z",
74
+ medium: "_fqoxlodh",
75
+ small: "_fqoxnbxd",
76
+ xsmall: "_fqox140y",
77
+ xxsmall: "_fqox1vhk"
78
+ };
43
79
  /**
44
80
  * @codegenEnd
45
81
  */
@@ -88,7 +124,7 @@ const Heading = /*#__PURE__*/forwardRef((props, ref) => {
88
124
  "data-testid": testId,
89
125
  role: needsAriaRole ? 'heading' : undefined,
90
126
  "aria-level": needsAriaRole ? hLevel : undefined,
91
- className: ax([styles.reset, size && headingSizeStylesMap[size], headingColorStylesMap[color]])
127
+ className: ax([styles.reset, fg('platform-dst-heading-specificity') && stylesWithSpecificity.reset, headingSizeStyles[size], fg('platform-dst-heading-specificity') && headingSizeWithSpecificityStyles[size], headingColorStyles[color], fg('platform-dst-heading-specificity') && headingColorStylesWithSpecificity[color]])
92
128
  }, children);
93
129
  });
94
130
  export default Heading;
package/dist/es2019/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export { default } from './heading.partial';
1
+ export { default } from './heading';
2
2
  export { default as HeadingContextProvider } from './heading-context';
package/dist/esm/heading.compiled.css ADDED
@@ -0,0 +1,26 @@
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
+ ._fqox140y._fqox140y{font:var(--ds-font-heading-xsmall,normal 600 14px/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
9
+ ._fqox1c04._fqox1c04{font:var(--ds-font-heading-xlarge,normal 600 29px/2pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
10
+ ._fqox1vhk._fqox1vhk{font:var(--ds-font-heading-xxsmall,normal 600 9pt/1pc ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
11
+ ._fqox4xcc._fqox4xcc{font:var(--ds-font-heading-xxlarge,normal 500 35px/40px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
12
+ ._fqoxlodh._fqoxlodh{font:var(--ds-font-heading-medium,normal 500 20px/24px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
13
+ ._fqoxnbxd._fqoxnbxd{font:var(--ds-font-heading-small,normal 600 1pc/20px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
14
+ ._fqoxnf1z._fqoxnf1z{font:var(--ds-font-heading-large,normal 500 24px/28px ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
15
+ ._1mouidpf{margin-block:0}
16
+ ._dxsyidpf._dxsyidpf{margin-block:0}
17
+ ._1dyz4jg8{letter-spacing:normal}
18
+ ._1i144jg8._1i144jg8{letter-spacing:normal}
19
+ ._1p1dglyw{text-transform:none}
20
+ ._1w9015cr._1w9015cr{color:var(--ds-text-inverse,#fff)}
21
+ ._1w901yd3._1w901yd3{color:var(--ds-text-warning-inverse,#292a2e)}
22
+ ._1w90i7uo._1w90i7uo{color:var(--ds-text,#292a2e)}
23
+ ._nmk4glyw._nmk4glyw{text-transform:none}
24
+ ._syaz15cr{color:var(--ds-text-inverse,#fff)}
25
+ ._syaz1yd3{color:var(--ds-text-warning-inverse,#292a2e)}
26
+ ._syazi7uo{color:var(--ds-text,#292a2e)}
package/dist/esm/{heading.partial.js → heading.js} RENAMED
@@ -1,9 +1,12 @@
1
- /* heading.partial.tsx generated by @compiled/babel-plugin v0.38.1 */
1
+ /* heading.tsx generated by @compiled/babel-plugin v0.38.1 */
2
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
- import "./heading.partial.compiled.css";
3
+ import "./heading.compiled.css";
4
4
  import * as React from 'react';
5
5
  import { ax, ix } from "@compiled/react/runtime";
6
+ /* eslint-disable @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors */
7
+
6
8
  import { forwardRef } from 'react';
9
+ import { fg } from '@atlaskit/platform-feature-flags';
7
10
  // eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
8
11
  import { UNSAFE_inverseColorMap } from '@atlaskit/primitives';
9
12
  import { UNSAFE_useSurface } from '@atlaskit/primitives/compiled';
@@ -17,22 +20,27 @@ var sizeTagMap = {
17
20
  xsmall: 'h5',
18
21
  xxsmall: 'h6'
19
22
  };
23
+
24
+ /**
25
+ * Remove with `platform-dst-heading-specificity` fg cleanup
26
+ */
20
27
  var styles = {
21
28
  reset: "_1mouidpf _1dyz4jg8 _1p1dglyw"
22
29
  };
23
- var headingColorStylesMap = {
30
+
31
+ /**
32
+ * Remove with `platform-dst-heading-specificity` fg cleanup
33
+ */
34
+ var headingColorStyles = {
24
35
  'color.text': "_syazi7uo",
25
36
  'color.text.inverse': "_syaz15cr",
26
37
  'color.text.warning.inverse': "_syaz1yd3"
27
38
  };
28
39
 
29
40
  /**
30
- * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
31
- * @codegen <<SignedSource::406afb01e5634a0b459f50de660d8c2e>>
32
- * @codegenId typography
33
- * @codegenCommand yarn workspace @atlaskit/heading codegen
41
+ * Remove with `platform-dst-heading-specificity` fg cleanup
34
42
  */
35
- var headingSizeStylesMap = {
43
+ var headingSizeStyles = {
36
44
  xxlarge: "_11c84xcc",
37
45
  xlarge: "_11c81c04",
38
46
  large: "_11c8nf1z",
@@ -41,6 +49,35 @@ var headingSizeStylesMap = {
41
49
  xsmall: "_11c8140y",
42
50
  xxsmall: "_11c81vhk"
43
51
  };
52
+
53
+ /**
54
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
55
+ */
56
+ var stylesWithSpecificity = {
57
+ reset: "_dxsyidpf _1i144jg8 _nmk4glyw"
58
+ };
59
+
60
+ /**
61
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
62
+ */
63
+ var headingColorStylesWithSpecificity = {
64
+ 'color.text': "_1w90i7uo",
65
+ 'color.text.inverse': "_1w9015cr",
66
+ 'color.text.warning.inverse': "_1w901yd3"
67
+ };
68
+
69
+ /**
70
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
71
+ */
72
+ var headingSizeWithSpecificityStyles = {
73
+ xxlarge: "_fqox4xcc",
74
+ xlarge: "_fqox1c04",
75
+ large: "_fqoxnf1z",
76
+ medium: "_fqoxlodh",
77
+ small: "_fqoxnbxd",
78
+ xsmall: "_fqox140y",
79
+ xxsmall: "_fqox1vhk"
80
+ };
44
81
  /**
45
82
  * @codegenEnd
46
83
  */
@@ -90,7 +127,7 @@ var Heading = /*#__PURE__*/forwardRef(function (props, ref) {
90
127
  "data-testid": testId,
91
128
  role: needsAriaRole ? 'heading' : undefined,
92
129
  "aria-level": needsAriaRole ? hLevel : undefined,
93
- className: ax([styles.reset, size && headingSizeStylesMap[size], headingColorStylesMap[color]])
130
+ className: ax([styles.reset, fg('platform-dst-heading-specificity') && stylesWithSpecificity.reset, headingSizeStyles[size], fg('platform-dst-heading-specificity') && headingSizeWithSpecificityStyles[size], headingColorStyles[color], fg('platform-dst-heading-specificity') && headingColorStylesWithSpecificity[color]])
94
131
  }, children);
95
132
  });
96
133
  export default Heading;
package/dist/esm/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export { default } from './heading.partial';
1
+ export { default } from './heading';
2
2
  export { default as HeadingContextProvider } from './heading-context';
package/dist/{types-ts4.5/heading.partial.d.ts → types/heading.d.ts} RENAMED
@@ -7,13 +7,12 @@ import { type CompiledStyles } from '@compiled/react';
7
7
  type HeadingColor = 'color.text' | 'color.text.inverse' | 'color.text.warning.inverse';
8
8
  export type HeadingProps = {
9
9
  /**
10
- * Heading size. This value is detached from the specific heading level applied to allow for more flexibility.
11
- * Use instead of the deprecated `level` prop.
12
- *
10
+ * Determines which text styles are applied. A corresponding HTML element is automatically applied from h1 to h6 based on the size.
11
+ * This can be overriden using the `as` prop to allow for more flexibility.
13
12
  */
14
13
  size: HeadingSize;
15
14
  /**
16
- * Allows the component to be rendered as the specified DOM element, overriding a default element set by `level` prop.
15
+ * Allows the component to be rendered as the specified HTML element, overriding a default element set by the `size` prop.
17
16
  */
18
17
  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'span';
19
18
  /**
@@ -27,7 +26,7 @@ export type HeadingProps = {
27
26
  */
28
27
  children: ReactNode;
29
28
  /**
30
- * Unique identifier for the heading DOM element.
29
+ * Unique identifier for the heading HTML element.
31
30
  */
32
31
  id?: string;
33
32
  /**
@@ -38,35 +37,46 @@ export type HeadingProps = {
38
37
  testId?: string;
39
38
  };
40
39
  /**
41
- * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
42
- * @codegen <<SignedSource::406afb01e5634a0b459f50de660d8c2e>>
43
- * @codegenId typography
44
- * @codegenCommand yarn workspace @atlaskit/heading codegen
40
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
45
41
  */
46
- declare const headingSizeStylesMap: {
42
+ declare const headingSizeWithSpecificityStyles: {
47
43
  readonly xxlarge: CompiledStyles<{
48
- font: 'var(--ds-font-heading-xxlarge)';
44
+ '&&': {
45
+ font: 'var(--ds-font-heading-xxlarge)';
46
+ };
49
47
  }>;
50
48
  readonly xlarge: CompiledStyles<{
51
- font: 'var(--ds-font-heading-xlarge)';
49
+ '&&': {
50
+ font: 'var(--ds-font-heading-xlarge)';
51
+ };
52
52
  }>;
53
53
  readonly large: CompiledStyles<{
54
- font: 'var(--ds-font-heading-large)';
54
+ '&&': {
55
+ font: 'var(--ds-font-heading-large)';
56
+ };
55
57
  }>;
56
58
  readonly medium: CompiledStyles<{
57
- font: 'var(--ds-font-heading-medium)';
59
+ '&&': {
60
+ font: 'var(--ds-font-heading-medium)';
61
+ };
58
62
  }>;
59
63
  readonly small: CompiledStyles<{
60
- font: 'var(--ds-font-heading-small)';
64
+ '&&': {
65
+ font: 'var(--ds-font-heading-small)';
66
+ };
61
67
  }>;
62
68
  readonly xsmall: CompiledStyles<{
63
- font: 'var(--ds-font-heading-xsmall)';
69
+ '&&': {
70
+ font: 'var(--ds-font-heading-xsmall)';
71
+ };
64
72
  }>;
65
73
  readonly xxsmall: CompiledStyles<{
66
- font: 'var(--ds-font-heading-xxsmall)';
74
+ '&&': {
75
+ font: 'var(--ds-font-heading-xxsmall)';
76
+ };
67
77
  }>;
68
78
  };
69
- type HeadingSize = keyof typeof headingSizeStylesMap;
79
+ type HeadingSize = keyof typeof headingSizeWithSpecificityStyles;
70
80
  /**
71
81
  * __Heading__
72
82
  *
package/dist/types/index.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- export { default, type HeadingProps } from './heading.partial';
1
+ export { default, type HeadingProps } from './heading';
2
2
  export { default as HeadingContextProvider } from './heading-context';
package/dist/{types/heading.partial.d.ts → types-ts4.5/heading.d.ts} RENAMED
@@ -7,13 +7,12 @@ import { type CompiledStyles } from '@compiled/react';
7
7
  type HeadingColor = 'color.text' | 'color.text.inverse' | 'color.text.warning.inverse';
8
8
  export type HeadingProps = {
9
9
  /**
10
- * Heading size. This value is detached from the specific heading level applied to allow for more flexibility.
11
- * Use instead of the deprecated `level` prop.
12
- *
10
+ * Determines which text styles are applied. A corresponding HTML element is automatically applied from h1 to h6 based on the size.
11
+ * This can be overriden using the `as` prop to allow for more flexibility.
13
12
  */
14
13
  size: HeadingSize;
15
14
  /**
16
- * Allows the component to be rendered as the specified DOM element, overriding a default element set by `level` prop.
15
+ * Allows the component to be rendered as the specified HTML element, overriding a default element set by the `size` prop.
17
16
  */
18
17
  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div' | 'span';
19
18
  /**
@@ -27,7 +26,7 @@ export type HeadingProps = {
27
26
  */
28
27
  children: ReactNode;
29
28
  /**
30
- * Unique identifier for the heading DOM element.
29
+ * Unique identifier for the heading HTML element.
31
30
  */
32
31
  id?: string;
33
32
  /**
@@ -38,35 +37,46 @@ export type HeadingProps = {
38
37
  testId?: string;
39
38
  };
40
39
  /**
41
- * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
42
- * @codegen <<SignedSource::406afb01e5634a0b459f50de660d8c2e>>
43
- * @codegenId typography
44
- * @codegenCommand yarn workspace @atlaskit/heading codegen
40
+ * Using '&&' here to increase specificity of Heading styles such that app styles like ".wiki-content h4" cannot override this component.
45
41
  */
46
- declare const headingSizeStylesMap: {
42
+ declare const headingSizeWithSpecificityStyles: {
47
43
  readonly xxlarge: CompiledStyles<{
48
- font: 'var(--ds-font-heading-xxlarge)';
44
+ '&&': {
45
+ font: 'var(--ds-font-heading-xxlarge)';
46
+ };
49
47
  }>;
50
48
  readonly xlarge: CompiledStyles<{
51
- font: 'var(--ds-font-heading-xlarge)';
49
+ '&&': {
50
+ font: 'var(--ds-font-heading-xlarge)';
51
+ };
52
52
  }>;
53
53
  readonly large: CompiledStyles<{
54
- font: 'var(--ds-font-heading-large)';
54
+ '&&': {
55
+ font: 'var(--ds-font-heading-large)';
56
+ };
55
57
  }>;
56
58
  readonly medium: CompiledStyles<{
57
- font: 'var(--ds-font-heading-medium)';
59
+ '&&': {
60
+ font: 'var(--ds-font-heading-medium)';
61
+ };
58
62
  }>;
59
63
  readonly small: CompiledStyles<{
60
- font: 'var(--ds-font-heading-small)';
64
+ '&&': {
65
+ font: 'var(--ds-font-heading-small)';
66
+ };
61
67
  }>;
62
68
  readonly xsmall: CompiledStyles<{
63
- font: 'var(--ds-font-heading-xsmall)';
69
+ '&&': {
70
+ font: 'var(--ds-font-heading-xsmall)';
71
+ };
64
72
  }>;
65
73
  readonly xxsmall: CompiledStyles<{
66
- font: 'var(--ds-font-heading-xxsmall)';
74
+ '&&': {
75
+ font: 'var(--ds-font-heading-xxsmall)';
76
+ };
67
77
  }>;
68
78
  };
69
- type HeadingSize = keyof typeof headingSizeStylesMap;
79
+ type HeadingSize = keyof typeof headingSizeWithSpecificityStyles;
70
80
  /**
71
81
  * __Heading__
72
82
  *
package/dist/types-ts4.5/index.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- export { default, type HeadingProps } from './heading.partial';
1
+ export { default, type HeadingProps } from './heading';
2
2
  export { default as HeadingContextProvider } from './heading-context';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/heading",
3
- "version": "5.2.16",
3
+ "version": "5.2.18",
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/"
@@ -23,13 +23,11 @@
23
23
  "category": "Text and data display"
24
24
  }
25
25
  },
26
- "scripts": {
27
- "codegen": "ts-node ./scripts/codegen.tsx"
28
- },
29
26
  "dependencies": {
30
27
  "@atlaskit/css": "^0.19.0",
28
+ "@atlaskit/platform-feature-flags": "^1.1.0",
31
29
  "@atlaskit/primitives": "^17.0.0",
32
- "@atlaskit/tokens": "^9.0.0",
30
+ "@atlaskit/tokens": "^9.1.0",
33
31
  "@babel/runtime": "^7.0.0",
34
32
  "@compiled/react": "^0.18.6"
35
33
  },
@@ -77,5 +75,10 @@
77
75
  ]
78
76
  }
79
77
  },
80
- "homepage": "https://atlassian.design/components/heading/"
78
+ "homepage": "https://atlassian.design/components/heading/",
79
+ "platform-feature-flags": {
80
+ "platform-dst-heading-specificity": {
81
+ "type": "boolean"
82
+ }
83
+ }
81
84
  }
package/dist/cjs/heading.partial.compiled.css DELETED
@@ -1,13 +0,0 @@
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
- ._1mouidpf{margin-block:0}
9
- ._1dyz4jg8{letter-spacing:normal}
10
- ._1p1dglyw{text-transform:none}
11
- ._syaz15cr{color:var(--ds-text-inverse,#fff)}
12
- ._syaz1yd3{color:var(--ds-text-warning-inverse,#292a2e)}
13
- ._syazi7uo{color:var(--ds-text,#292a2e)}
package/dist/es2019/heading.partial.compiled.css DELETED
@@ -1,13 +0,0 @@
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
- ._1mouidpf{margin-block:0}
9
- ._1dyz4jg8{letter-spacing:normal}
10
- ._1p1dglyw{text-transform:none}
11
- ._syaz15cr{color:var(--ds-text-inverse,#fff)}
12
- ._syaz1yd3{color:var(--ds-text-warning-inverse,#292a2e)}
13
- ._syazi7uo{color:var(--ds-text,#292a2e)}
package/dist/esm/heading.partial.compiled.css DELETED
@@ -1,13 +0,0 @@
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
- ._1mouidpf{margin-block:0}
9
- ._1dyz4jg8{letter-spacing:normal}
10
- ._1p1dglyw{text-transform:none}
11
- ._syaz15cr{color:var(--ds-text-inverse,#fff)}
12
- ._syaz1yd3{color:var(--ds-text-warning-inverse,#292a2e)}
13
- ._syazi7uo{color:var(--ds-text,#292a2e)}
package/scripts/codegen.tsx DELETED
@@ -1,65 +0,0 @@
1
- import { writeFileSync } from 'fs';
2
- import { join } from 'path';
3
-
4
- import format from '@af/formatting/sync';
5
- import tokenNames from '@atlaskit/tokens/token-names';
6
- // eslint-disable-next-line import/order
7
- import { createPartialSignedArtifact } from '@atlassian/codegen';
8
-
9
- // eslint-disable-next-line import/order
10
- import { typographyAdg3 as tokens } from '@atlaskit/tokens/tokens-raw';
11
-
12
- const constructTokenFunctionCall = (tokenName: string) => {
13
- return `token('${tokenName}')`;
14
- };
15
-
16
- const headingTokens = tokens
17
- .filter((t) => t.attributes.group === 'typography')
18
- .filter((t) => t.cleanName.includes('heading'));
19
-
20
- const removeVerbosity = (name: string): string => {
21
- return name.replace('font.heading.', '');
22
- };
23
-
24
- export const createTypographyStylesFromTemplate = () => {
25
- const tokenTypes = headingTokens
26
- .map((token) => {
27
- return `
28
- readonly ${removeVerbosity(token.name)}: CompiledStyles<{
29
- font: "var(${tokenNames[token.name as keyof typeof tokenNames]})";
30
- }>;`.trim();
31
- })
32
- .join('\n\t');
33
-
34
- return (
35
- format(
36
- `
37
- const headingSizeStylesMap: {
38
- ${tokenTypes}
39
- } = cssMap({
40
- ${headingTokens
41
- .map((token) => {
42
- return `
43
- '${removeVerbosity(token.name)}': { font: ${constructTokenFunctionCall(token.cleanName)} }
44
- `.trim();
45
- })
46
- .join(',\n\t')}
47
- });`,
48
- 'typescript',
49
- ) + `\ntype HeadingSize = keyof typeof headingSizeStylesMap;\n`
50
- );
51
- };
52
-
53
- const targetPath = join(__dirname, '../', 'src', 'heading.partial.tsx');
54
-
55
- writeFileSync(
56
- join(__dirname, '../src/heading.partial.tsx'),
57
- createPartialSignedArtifact(
58
- createTypographyStylesFromTemplate(),
59
- 'yarn workspace @atlaskit/heading codegen',
60
- {
61
- id: 'typography',
62
- absoluteFilePath: targetPath,
63
- },
64
- ),
65
- );