@atlaskit/tokens 1.5.0 → 1.5.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/tokens
 
+## 1.5.2
+
+### Patch Changes
+
+- [`8be4cc2372f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8be4cc2372f) - update border color to Neutral500
+
+## 1.5.1
+
+### Patch Changes
+
+- [`e7ea6832ad2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e7ea6832ad2) - Bans the use of React.FC/React.FunctionComponent type in ADS components as part of the React 18 migration work. The change is internal only and should not introduce any changes for the component consumers.
+
 ## 1.5.0
 
 ### Minor Changes

package/dist/cjs/artifacts/generated-pairs.js

@@ -10,7 +10,7 @@ exports.generatedPairs = exports.default = void 0;
  * Auto-generated list of token pairings that may need to have sufficient contrast.
  * Not currently used by tests, but is used by the custom theme contrast checker example
  *
- * @codegen <<SignedSource::349f00c184fe40bca26982001eabb94c>>
+ * @codegen <<SignedSource::ec8e2d34c5152b1b66186e14b261c0f1>>
  * @codegenCommand yarn build tokens
  */
 var generatedPairs = [{
@@ -189,38 +189,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.red.bolder',
   background: 'color.background.accent.red.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.red.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.orange',
   background: 'color.background.accent.orange.subtlest',
@@ -229,10 +197,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.orange',
   background: 'color.background.accent.orange.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.orange.bolder',
   background: 'color.background.accent.orange.subtlest',
@@ -245,34 +209,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.orange.bolder',
   background: 'color.background.accent.orange.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.orange.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.yellow',
   background: 'color.background.accent.yellow.subtlest',
@@ -281,14 +217,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.yellow',
   background: 'color.background.accent.yellow.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.yellow.bolder',
   background: 'color.background.accent.yellow.subtlest',
@@ -301,30 +229,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.yellow.bolder',
   background: 'color.background.accent.yellow.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.yellow.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.green',
   background: 'color.background.accent.green.subtlest',
@@ -333,18 +237,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.green',
   background: 'color.background.accent.green.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.green.bolder',
   background: 'color.background.accent.green.subtlest',
@@ -357,26 +249,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.green.bolder',
   background: 'color.background.accent.green.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.green.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.teal',
   background: 'color.background.accent.teal.subtlest',
@@ -385,22 +257,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.teal',
   background: 'color.background.accent.teal.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.teal.bolder',
   background: 'color.background.accent.teal.subtlest',
@@ -413,22 +269,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.teal.bolder',
   background: 'color.background.accent.teal.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.teal.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.blue',
   background: 'color.background.accent.blue.subtlest',
@@ -437,26 +277,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.blue',
   background: 'color.background.accent.blue.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.blue.bolder',
   background: 'color.background.accent.blue.subtlest',
@@ -469,18 +289,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.blue.bolder',
   background: 'color.background.accent.blue.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.blue.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.purple',
   background: 'color.background.accent.purple.subtlest',
@@ -489,30 +297,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.purple',
   background: 'color.background.accent.purple.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.purple.bolder',
   background: 'color.background.accent.purple.subtlest',
@@ -525,14 +309,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.purple.bolder',
   background: 'color.background.accent.purple.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.purple.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.magenta',
   background: 'color.background.accent.magenta.subtlest',
@@ -541,34 +317,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.magenta',
   background: 'color.background.accent.magenta.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.magenta.bolder',
   background: 'color.background.accent.magenta.subtlest',
@@ -581,10 +329,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.magenta.bolder',
   background: 'color.background.accent.magenta.subtle',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.magenta.bolder',
-  background: 'color.background.accent.gray.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.gray',
   background: 'color.background.accent.gray.subtlest',
@@ -593,38 +337,6 @@ var generatedPairs = [{
   foreground: 'color.text.accent.gray',
   background: 'color.background.accent.gray.subtler',
   desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.red.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.orange.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.yellow.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.green.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.teal.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.blue.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.purple.subtle',
-  desiredContrast: 4.5
-}, {
-  foreground: 'color.text.accent.gray.bolder',
-  background: 'color.background.accent.magenta.subtle',
-  desiredContrast: 4.5
 }, {
   foreground: 'color.text.accent.gray.bolder',
   background: 'color.background.accent.gray.subtlest',

package/dist/cjs/artifacts/themes/atlassian-dark-new-input-border.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c975c1ac2db9f1c0efff9214a1aac7b7>>
+ * @codegen <<SignedSource::b255ff03ae4f781bb3016003a111bed0>>
  * @codegenCommand yarn build tokens
  */
-var _default = "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:dark\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:dark\"] {\n  color-scheme: dark;\n  --ds-border: #A6C5E229;\n  --ds-border-disabled: #A1BDD914;\n  --ds-border-focused: #85B8FF;\n  --ds-border-input: #738496;\n  --ds-border-inverse: #161A1D;\n  --ds-border-selected: #579DFF;\n  --ds-border-brand: #579DFF;\n  --ds-border-danger: #EF5C48;\n  --ds-border-warning: #CF9F02;\n  --ds-border-success: #2ABB7F;\n  --ds-border-discovery: #8F7EE7;\n  --ds-border-information: #388BFF;\n  --ds-border-bold: #738496;\n}\n";
+var _default = "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:dark\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:dark\"] {\n  color-scheme: dark;\n  --ds-border-input: #596773;\n}\n";
 exports.default = _default;

package/dist/cjs/artifacts/themes/atlassian-light-new-input-border.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::901558f32ad8ab69dd685f026e5d85db>>
+ * @codegen <<SignedSource::b14cc1106ad737bfef0b77e4b645c1df>>
  * @codegenCommand yarn build tokens
  */
-var _default = "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: light;\n  --ds-border: #091E4224;\n  --ds-border-disabled: #091E420F;\n  --ds-border-focused: #388BFF;\n  --ds-border-input: #758195;\n  --ds-border-inverse: #FFFFFF;\n  --ds-border-selected: #0C66E4;\n  --ds-border-brand: #0C66E4;\n  --ds-border-danger: #E34935;\n  --ds-border-warning: #D97008;\n  --ds-border-success: #22A06B;\n  --ds-border-discovery: #8270DB;\n  --ds-border-information: #1D7AFC;\n  --ds-border-bold: #758195;\n}\n";
+var _default = "\nhtml[data-color-mode=\"light\"][data-theme~=\"light:light\"],\nhtml[data-color-mode=\"dark\"][data-theme~=\"dark:light\"] {\n  color-scheme: light;\n  --ds-border-input: #8590A2;\n}\n";
 exports.default = _default;