@atlaskit/heading 4.3.1 → 5.1.0

package/CHANGELOG.md

@@ -1,5 +1,36 @@
 # @atlaskit/heading
 
+## 5.1.0
+
+### Minor Changes
+
+- [#118121](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/118121)
+  [`4850fa1a503ba`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4850fa1a503ba) -
+  [ux] Automatic color inversion based on bold surfaces will only affect the default color behind a
+  feature flag. If testing successful, this change will be made available in a later release.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 5.0.0
+
+### Major Changes
+
+- [#117363](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/117363)
+  [`10a0f7f6c2027`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/10a0f7f6c2027) -
+  This package's `peerDependencies` have been adjusted for `react` and/or `react-dom` to reflect the
+  status of only supporting React 18 going forward. No explicit breaking change to React support has
+  been made in this release, but this is to signify going forward, breaking changes for React 16 or
+  React 17 may come via non-major semver releases.
+
+  Please refer this community post for more details:
+  https://community.developer.atlassian.com/t/rfc-78-dropping-support-for-react-16-and-rendering-in-a-react-18-concurrent-root-in-jira-and-confluence/87026
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 4.3.1
 
 ### Patch Changes

package/dist/cjs/heading.partial.js

@@ -12,6 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
 var React = _react;
 var _runtime = require("@compiled/react/runtime");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _headingContext = require("./heading-context");
@@ -56,6 +57,15 @@ var headingSizeStylesMap = {
 
 var useColor = function useColor(colorProp) {
   var surface = (0, _compiled.UNSAFE_useSurface)();
+  if ((0, _platformFeatureFlags.fg)('platform-typography-improved-color-control')) {
+    if (colorProp) {
+      return colorProp;
+    }
+    if (_primitives.UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
+      return _primitives.UNSAFE_inverseColorMap[surface];
+    }
+    return 'color.text';
+  }
 
   /**
    * Where the color of the surface is inverted we always override the color

package/dist/es2019/heading.partial.js

@@ -3,6 +3,7 @@ import "./heading.partial.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { UNSAFE_inverseColorMap } from '@atlaskit/primitives';
 import { UNSAFE_useSurface } from '@atlaskit/primitives/compiled';
 import { useHeading } from './heading-context';
@@ -45,6 +46,15 @@ const headingSizeStylesMap = {
 
 const useColor = colorProp => {
   const surface = UNSAFE_useSurface();
+  if (fg('platform-typography-improved-color-control')) {
+    if (colorProp) {
+      return colorProp;
+    }
+    if (UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
+      return UNSAFE_inverseColorMap[surface];
+    }
+    return 'color.text';
+  }
 
   /**
    * Where the color of the surface is inverted we always override the color

package/dist/esm/heading.partial.js

@@ -4,6 +4,7 @@ import "./heading.partial.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef } from 'react';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { UNSAFE_inverseColorMap } from '@atlaskit/primitives';
 import { UNSAFE_useSurface } from '@atlaskit/primitives/compiled';
 import { useHeading } from './heading-context';
@@ -46,6 +47,15 @@ var headingSizeStylesMap = {
 
 var useColor = function useColor(colorProp) {
   var surface = UNSAFE_useSurface();
+  if (fg('platform-typography-improved-color-control')) {
+    if (colorProp) {
+      return colorProp;
+    }
+    if (UNSAFE_inverseColorMap.hasOwnProperty(surface)) {
+      return UNSAFE_inverseColorMap[surface];
+    }
+    return 'color.text';
+  }
 
   /**
    * Where the color of the surface is inverted we always override the color

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/heading",
-	"version": "4.3.1",
+	"version": "5.1.0",
 	"description": "A heading is a typography component used to display text in different sizes and formats.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -31,23 +31,24 @@
 		"codegen": "ts-node ./scripts/codegen.tsx"
 	},
 	"dependencies": {
-		"@atlaskit/css": "^0.9.0",
-		"@atlaskit/primitives": "^13.6.0",
-		"@atlaskit/tokens": "^3.3.0",
+		"@atlaskit/css": "^0.10.0",
+		"@atlaskit/platform-feature-flags": "^1.1.0",
+		"@atlaskit/primitives": "^14.1.0",
+		"@atlaskit/tokens": "^4.2.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.2",
 		"@emotion/react": "^11.7.1"
 	},
 	"peerDependencies": {
-		"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+		"react": "^18.2.0"
 	},
 	"devDependencies": {
 		"@af/accessibility-testing": "*",
 		"@af/formatting": "*",
 		"@af/integration-testing": "*",
 		"@af/visual-regression": "*",
-		"@atlaskit/button": "^20.5.0",
-		"@atlaskit/ds-lib": "^3.5.0",
+		"@atlaskit/button": "^21.1.0",
+		"@atlaskit/ds-lib": "^4.0.0",
 		"@atlaskit/ssr": "*",
 		"@atlassian/codegen": "^0.1.0",
 		"@testing-library/react": "^13.4.0",
@@ -86,5 +87,10 @@
 	"af:exports": {
 		".": "./src/index.tsx"
 	},
-	"homepage": "https://atlassian.design/components/heading/"
+	"homepage": "https://atlassian.design/components/heading/",
+	"platform-feature-flags": {
+		"platform-typography-improved-color-control": {
+			"type": "boolean"
+		}
+	}
 }