@atlaskit/ds-explorations 2.2.6 → 2.2.7

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/ds-explorations
 
+## 2.2.7
+
+### Patch Changes
+
+- [`298df94426c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/298df94426c) - Regenerates codegen'd artifacts as a result of introducting new brand background design tokens.
+- Updated dependencies
+
 ## 2.2.6
 
 ### Patch Changes

package/dist/cjs/components/box.partial.js

@@ -427,11 +427,11 @@ var paddingInlineMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::891786734c508bdcd4316dff89e481c4>>
+ * @codegen <<SignedSource::641490362f94761dab3c48a98b999b7a>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["border", "background", "shadow"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 var borderColorMap = {
   'color.border': (0, _react2.css)({
@@ -499,9 +499,15 @@ var backgroundColorMap = {
   'selected.bold': (0, _react2.css)({
     backgroundColor: "var(--ds-background-selected-bold, #0052CC)"
   }),
+  'brand.subtlest': (0, _react2.css)({
+    backgroundColor: "var(--ds-background-brand-subtlest, #B3D4FF)"
+  }),
   'brand.bold': (0, _react2.css)({
     backgroundColor: "var(--ds-background-brand-bold, #0052CC)"
   }),
+  'brand.boldest': (0, _react2.css)({
+    backgroundColor: "var(--ds-background-brand-boldest, #0747A6)"
+  }),
   danger: (0, _react2.css)({
     backgroundColor: "var(--ds-background-danger, #FFEBE6)"
   }),

package/dist/cjs/components/interaction-surface.partial.js

@@ -53,11 +53,11 @@ var InteractionSurface = function InteractionSurface(_ref) {
 var _default = InteractionSurface;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b11e88d30e0364eaa7a660c740b296b6>>
+ * @codegen <<SignedSource::6705bcce4bc1f3f6b944ca61e2f7afcf>>
  * @codegenId interactions
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["background"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 exports.default = _default;
 var backgroundActiveColorMap = {
@@ -96,11 +96,21 @@ var backgroundActiveColorMap = {
       backgroundColor: "var(--ds-background-selected-bold-pressed, #09326C)"
     }
   }),
+  'brand.subtlest': (0, _react2.css)({
+    ':active': {
+      backgroundColor: "var(--ds-background-brand-subtlest-pressed, #85B8FF)"
+    }
+  }),
   'brand.bold': (0, _react2.css)({
     ':active': {
       backgroundColor: "var(--ds-background-brand-bold-pressed, #09326C)"
     }
   }),
+  'brand.boldest': (0, _react2.css)({
+    ':active': {
+      backgroundColor: "var(--ds-background-brand-boldest-pressed, #0055CC)"
+    }
+  }),
   danger: (0, _react2.css)({
     ':active': {
       backgroundColor: "var(--ds-background-danger-pressed, #FF9C8F)"
@@ -203,11 +213,21 @@ var backgroundHoverColorMap = {
       backgroundColor: "var(--ds-background-selected-bold-hovered, #0055CC)"
     }
   }),
+  'brand.subtlest': (0, _react2.css)({
+    ':hover': {
+      backgroundColor: "var(--ds-background-brand-subtlest-hovered, #CCE0FF)"
+    }
+  }),
   'brand.bold': (0, _react2.css)({
     ':hover': {
       backgroundColor: "var(--ds-background-brand-bold-hovered, #0055CC)"
     }
   }),
+  'brand.boldest': (0, _react2.css)({
+    ':hover': {
+      backgroundColor: "var(--ds-background-brand-boldest-hovered, #09326C)"
+    }
+  }),
   danger: (0, _react2.css)({
     ':hover': {
       backgroundColor: "var(--ds-background-danger-hovered, #FFD2CC)"

package/dist/cjs/components/text.partial.js

@@ -209,11 +209,11 @@ var lineHeightMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::346b54332eaa1c1e3980c869a02434db>>
+ * @codegen <<SignedSource::039c7b7400ed2152388a9501fcdea070>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["text"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 var textColorMap = {
   'color.text': (0, _react2.css)({

package/dist/cjs/internal/color-map.js

@@ -9,9 +9,9 @@ exports.default = void 0;
  *
  * The color map is used to map a background color token to a matching text color that will meet contrast.
  *
- * @codegen <<SignedSource::0e6ef7d45c6904ff2af7d94ba657014b>>
+ * @codegen <<SignedSource::43134d6abeba44006053eb83fc827e9b>>
  * @codegenCommand yarn codegen-styles
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 var _default = {
   'neutral.bold': 'inverse',
@@ -23,6 +23,9 @@ var _default = {
   'brand.bold': 'inverse',
   'brand.bold.hovered': 'inverse',
   'brand.bold.pressed': 'inverse',
+  'brand.boldest': 'inverse',
+  'brand.boldest.hovered': 'inverse',
+  'brand.boldest.pressed': 'inverse',
   'danger.bold': 'inverse',
   'danger.bold.hovered': 'inverse',
   'danger.bold.pressed': 'inverse',

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "2.2.6",
+	"version": "2.2.7",
 	"sideEffects": false
 }

package/dist/es2019/components/box.partial.js

@@ -419,11 +419,11 @@ const paddingInlineMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::891786734c508bdcd4316dff89e481c4>>
+ * @codegen <<SignedSource::641490362f94761dab3c48a98b999b7a>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["border", "background", "shadow"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 const borderColorMap = {
   'color.border': css({
@@ -491,9 +491,15 @@ const backgroundColorMap = {
   'selected.bold': css({
     backgroundColor: "var(--ds-background-selected-bold, #0052CC)"
   }),
+  'brand.subtlest': css({
+    backgroundColor: "var(--ds-background-brand-subtlest, #B3D4FF)"
+  }),
   'brand.bold': css({
     backgroundColor: "var(--ds-background-brand-bold, #0052CC)"
   }),
+  'brand.boldest': css({
+    backgroundColor: "var(--ds-background-brand-boldest, #0747A6)"
+  }),
   danger: css({
     backgroundColor: "var(--ds-background-danger, #FFEBE6)"
   }),

package/dist/es2019/components/interaction-surface.partial.js

@@ -48,11 +48,11 @@ export default InteractionSurface;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b11e88d30e0364eaa7a660c740b296b6>>
+ * @codegen <<SignedSource::6705bcce4bc1f3f6b944ca61e2f7afcf>>
  * @codegenId interactions
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["background"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 const backgroundActiveColorMap = {
   input: css({
@@ -90,11 +90,21 @@ const backgroundActiveColorMap = {
       backgroundColor: "var(--ds-background-selected-bold-pressed, #09326C)"
     }
   }),
+  'brand.subtlest': css({
+    ':active': {
+      backgroundColor: "var(--ds-background-brand-subtlest-pressed, #85B8FF)"
+    }
+  }),
   'brand.bold': css({
     ':active': {
       backgroundColor: "var(--ds-background-brand-bold-pressed, #09326C)"
     }
   }),
+  'brand.boldest': css({
+    ':active': {
+      backgroundColor: "var(--ds-background-brand-boldest-pressed, #0055CC)"
+    }
+  }),
   danger: css({
     ':active': {
       backgroundColor: "var(--ds-background-danger-pressed, #FF9C8F)"
@@ -197,11 +207,21 @@ const backgroundHoverColorMap = {
       backgroundColor: "var(--ds-background-selected-bold-hovered, #0055CC)"
     }
   }),
+  'brand.subtlest': css({
+    ':hover': {
+      backgroundColor: "var(--ds-background-brand-subtlest-hovered, #CCE0FF)"
+    }
+  }),
   'brand.bold': css({
     ':hover': {
       backgroundColor: "var(--ds-background-brand-bold-hovered, #0055CC)"
     }
   }),
+  'brand.boldest': css({
+    ':hover': {
+      backgroundColor: "var(--ds-background-brand-boldest-hovered, #09326C)"
+    }
+  }),
   danger: css({
     ':hover': {
       backgroundColor: "var(--ds-background-danger-hovered, #FFD2CC)"

package/dist/es2019/components/text.partial.js

@@ -199,11 +199,11 @@ const lineHeightMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::346b54332eaa1c1e3980c869a02434db>>
+ * @codegen <<SignedSource::039c7b7400ed2152388a9501fcdea070>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["text"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 const textColorMap = {
   'color.text': css({

package/dist/es2019/internal/color-map.js

@@ -3,9 +3,9 @@
  *
  * The color map is used to map a background color token to a matching text color that will meet contrast.
  *
- * @codegen <<SignedSource::0e6ef7d45c6904ff2af7d94ba657014b>>
+ * @codegen <<SignedSource::43134d6abeba44006053eb83fc827e9b>>
  * @codegenCommand yarn codegen-styles
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 export default {
   'neutral.bold': 'inverse',
@@ -17,6 +17,9 @@ export default {
   'brand.bold': 'inverse',
   'brand.bold.hovered': 'inverse',
   'brand.bold.pressed': 'inverse',
+  'brand.boldest': 'inverse',
+  'brand.boldest.hovered': 'inverse',
+  'brand.boldest.pressed': 'inverse',
   'danger.bold': 'inverse',
   'danger.bold.hovered': 'inverse',
   'danger.bold.pressed': 'inverse',

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "2.2.6",
+	"version": "2.2.7",
 	"sideEffects": false
 }

package/dist/esm/components/box.partial.js

@@ -422,11 +422,11 @@ var paddingInlineMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::891786734c508bdcd4316dff89e481c4>>
+ * @codegen <<SignedSource::641490362f94761dab3c48a98b999b7a>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["border", "background", "shadow"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 var borderColorMap = {
   'color.border': css({
@@ -494,9 +494,15 @@ var backgroundColorMap = {
   'selected.bold': css({
     backgroundColor: "var(--ds-background-selected-bold, #0052CC)"
   }),
+  'brand.subtlest': css({
+    backgroundColor: "var(--ds-background-brand-subtlest, #B3D4FF)"
+  }),
   'brand.bold': css({
     backgroundColor: "var(--ds-background-brand-bold, #0052CC)"
   }),
+  'brand.boldest': css({
+    backgroundColor: "var(--ds-background-brand-boldest, #0747A6)"
+  }),
   danger: css({
     backgroundColor: "var(--ds-background-danger, #FFEBE6)"
   }),

package/dist/esm/components/interaction-surface.partial.js

@@ -47,11 +47,11 @@ export default InteractionSurface;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::b11e88d30e0364eaa7a660c740b296b6>>
+ * @codegen <<SignedSource::6705bcce4bc1f3f6b944ca61e2f7afcf>>
  * @codegenId interactions
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["background"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 var backgroundActiveColorMap = {
   input: css({
@@ -89,11 +89,21 @@ var backgroundActiveColorMap = {
       backgroundColor: "var(--ds-background-selected-bold-pressed, #09326C)"
     }
   }),
+  'brand.subtlest': css({
+    ':active': {
+      backgroundColor: "var(--ds-background-brand-subtlest-pressed, #85B8FF)"
+    }
+  }),
   'brand.bold': css({
     ':active': {
       backgroundColor: "var(--ds-background-brand-bold-pressed, #09326C)"
     }
   }),
+  'brand.boldest': css({
+    ':active': {
+      backgroundColor: "var(--ds-background-brand-boldest-pressed, #0055CC)"
+    }
+  }),
   danger: css({
     ':active': {
       backgroundColor: "var(--ds-background-danger-pressed, #FF9C8F)"
@@ -196,11 +206,21 @@ var backgroundHoverColorMap = {
       backgroundColor: "var(--ds-background-selected-bold-hovered, #0055CC)"
     }
   }),
+  'brand.subtlest': css({
+    ':hover': {
+      backgroundColor: "var(--ds-background-brand-subtlest-hovered, #CCE0FF)"
+    }
+  }),
   'brand.bold': css({
     ':hover': {
       backgroundColor: "var(--ds-background-brand-bold-hovered, #0055CC)"
     }
   }),
+  'brand.boldest': css({
+    ':hover': {
+      backgroundColor: "var(--ds-background-brand-boldest-hovered, #09326C)"
+    }
+  }),
   danger: css({
     ':hover': {
       backgroundColor: "var(--ds-background-danger-hovered, #FFD2CC)"

package/dist/esm/components/text.partial.js

@@ -202,11 +202,11 @@ var lineHeightMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::346b54332eaa1c1e3980c869a02434db>>
+ * @codegen <<SignedSource::039c7b7400ed2152388a9501fcdea070>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["text"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 var textColorMap = {
   'color.text': css({

package/dist/esm/internal/color-map.js

@@ -3,9 +3,9 @@
  *
  * The color map is used to map a background color token to a matching text color that will meet contrast.
  *
- * @codegen <<SignedSource::0e6ef7d45c6904ff2af7d94ba657014b>>
+ * @codegen <<SignedSource::43134d6abeba44006053eb83fc827e9b>>
  * @codegenCommand yarn codegen-styles
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 export default {
   'neutral.bold': 'inverse',
@@ -17,6 +17,9 @@ export default {
   'brand.bold': 'inverse',
   'brand.bold.hovered': 'inverse',
   'brand.bold.pressed': 'inverse',
+  'brand.boldest': 'inverse',
+  'brand.boldest.hovered': 'inverse',
+  'brand.boldest.pressed': 'inverse',
   'danger.bold': 'inverse',
   'danger.bold.hovered': 'inverse',
   'danger.bold.pressed': 'inverse',

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "2.2.6",
+	"version": "2.2.7",
 	"sideEffects": false
 }

package/dist/types/components/box.partial.d.ts

@@ -291,11 +291,11 @@ export type PaddingInline = keyof typeof paddingInlineMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::891786734c508bdcd4316dff89e481c4>>
+ * @codegen <<SignedSource::641490362f94761dab3c48a98b999b7a>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["border", "background", "shadow"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 declare const borderColorMap: {
     readonly 'color.border': import("@emotion/react").SerializedStyles;
@@ -322,7 +322,9 @@ declare const backgroundColorMap: {
     readonly 'neutral.bold': import("@emotion/react").SerializedStyles;
     readonly selected: import("@emotion/react").SerializedStyles;
     readonly 'selected.bold': import("@emotion/react").SerializedStyles;
+    readonly 'brand.subtlest': import("@emotion/react").SerializedStyles;
     readonly 'brand.bold': import("@emotion/react").SerializedStyles;
+    readonly 'brand.boldest': import("@emotion/react").SerializedStyles;
     readonly danger: import("@emotion/react").SerializedStyles;
     readonly 'danger.bold': import("@emotion/react").SerializedStyles;
     readonly warning: import("@emotion/react").SerializedStyles;

package/dist/types/components/interaction-surface.partial.d.ts

@@ -28,7 +28,9 @@ declare const backgroundHoverColorMap: {
     'neutral.bold': import("@emotion/react").SerializedStyles;
     selected: import("@emotion/react").SerializedStyles;
     'selected.bold': import("@emotion/react").SerializedStyles;
+    'brand.subtlest': import("@emotion/react").SerializedStyles;
     'brand.bold': import("@emotion/react").SerializedStyles;
+    'brand.boldest': import("@emotion/react").SerializedStyles;
     danger: import("@emotion/react").SerializedStyles;
     'danger.bold': import("@emotion/react").SerializedStyles;
     warning: import("@emotion/react").SerializedStyles;

package/dist/types/components/surface-provider.d.ts

@@ -4,7 +4,7 @@
  *
  * A surface context provides context information on the current background (if set).
  */
-export declare const SurfaceContext: import("react").Context<"color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.bold" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold">;
+export declare const SurfaceContext: import("react").Context<"color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.subtlest" | "brand.bold" | "brand.boldest" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold">;
 /**
  * __useSurface__
  *
@@ -12,4 +12,4 @@ export declare const SurfaceContext: import("react").Context<"color.blanket" | "
  *
  * @see SurfaceContext
  */
-export declare const useSurface: () => "color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.bold" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold";
+export declare const useSurface: () => "color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.subtlest" | "brand.bold" | "brand.boldest" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold";

package/dist/types/components/text.partial.d.ts

@@ -124,11 +124,11 @@ export type LineHeight = keyof typeof lineHeightMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::346b54332eaa1c1e3980c869a02434db>>
+ * @codegen <<SignedSource::039c7b7400ed2152388a9501fcdea070>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["text"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 declare const textColorMap: {
     readonly 'color.text': import("@emotion/react").SerializedStyles;

package/dist/types/internal/color-map.d.ts

@@ -3,9 +3,9 @@
  *
  * The color map is used to map a background color token to a matching text color that will meet contrast.
  *
- * @codegen <<SignedSource::0e6ef7d45c6904ff2af7d94ba657014b>>
+ * @codegen <<SignedSource::43134d6abeba44006053eb83fc827e9b>>
  * @codegenCommand yarn codegen-styles
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 declare const _default: {
     readonly 'neutral.bold': "inverse";
@@ -17,6 +17,9 @@ declare const _default: {
     readonly 'brand.bold': "inverse";
     readonly 'brand.bold.hovered': "inverse";
     readonly 'brand.bold.pressed': "inverse";
+    readonly 'brand.boldest': "inverse";
+    readonly 'brand.boldest.hovered': "inverse";
+    readonly 'brand.boldest.pressed': "inverse";
     readonly 'danger.bold': "inverse";
     readonly 'danger.bold.hovered': "inverse";
     readonly 'danger.bold.pressed': "inverse";

package/dist/types-ts4.5/components/box.partial.d.ts

@@ -291,11 +291,11 @@ export type PaddingInline = keyof typeof paddingInlineMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::891786734c508bdcd4316dff89e481c4>>
+ * @codegen <<SignedSource::641490362f94761dab3c48a98b999b7a>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["border", "background", "shadow"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 declare const borderColorMap: {
     readonly 'color.border': import("@emotion/react").SerializedStyles;
@@ -322,7 +322,9 @@ declare const backgroundColorMap: {
     readonly 'neutral.bold': import("@emotion/react").SerializedStyles;
     readonly selected: import("@emotion/react").SerializedStyles;
     readonly 'selected.bold': import("@emotion/react").SerializedStyles;
+    readonly 'brand.subtlest': import("@emotion/react").SerializedStyles;
     readonly 'brand.bold': import("@emotion/react").SerializedStyles;
+    readonly 'brand.boldest': import("@emotion/react").SerializedStyles;
     readonly danger: import("@emotion/react").SerializedStyles;
     readonly 'danger.bold': import("@emotion/react").SerializedStyles;
     readonly warning: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/components/interaction-surface.partial.d.ts

@@ -28,7 +28,9 @@ declare const backgroundHoverColorMap: {
     'neutral.bold': import("@emotion/react").SerializedStyles;
     selected: import("@emotion/react").SerializedStyles;
     'selected.bold': import("@emotion/react").SerializedStyles;
+    'brand.subtlest': import("@emotion/react").SerializedStyles;
     'brand.bold': import("@emotion/react").SerializedStyles;
+    'brand.boldest': import("@emotion/react").SerializedStyles;
     danger: import("@emotion/react").SerializedStyles;
     'danger.bold': import("@emotion/react").SerializedStyles;
     warning: import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/components/surface-provider.d.ts

@@ -4,7 +4,7 @@
  *
  * A surface context provides context information on the current background (if set).
  */
-export declare const SurfaceContext: import("react").Context<"color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.bold" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold">;
+export declare const SurfaceContext: import("react").Context<"color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.subtlest" | "brand.bold" | "brand.boldest" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold">;
 /**
  * __useSurface__
  *
@@ -12,4 +12,4 @@ export declare const SurfaceContext: import("react").Context<"color.blanket" | "
  *
  * @see SurfaceContext
  */
-export declare const useSurface: () => "color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.bold" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold";
+export declare const useSurface: () => "color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.overlay" | "elevation.surface.raised" | "elevation.surface.sunken" | "disabled" | "input" | "inverse.subtle" | "neutral" | "neutral.subtle" | "neutral.bold" | "selected" | "selected.bold" | "brand.subtlest" | "brand.bold" | "brand.boldest" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold";

package/dist/types-ts4.5/components/text.partial.d.ts

@@ -129,11 +129,11 @@ export type LineHeight = keyof typeof lineHeightMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::346b54332eaa1c1e3980c869a02434db>>
+ * @codegen <<SignedSource::039c7b7400ed2152388a9501fcdea070>>
  * @codegenId colors
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["text"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 declare const textColorMap: {
     readonly 'color.text': import("@emotion/react").SerializedStyles;

package/dist/types-ts4.5/internal/color-map.d.ts

@@ -3,9 +3,9 @@
  *
  * The color map is used to map a background color token to a matching text color that will meet contrast.
  *
- * @codegen <<SignedSource::0e6ef7d45c6904ff2af7d94ba657014b>>
+ * @codegen <<SignedSource::43134d6abeba44006053eb83fc827e9b>>
  * @codegenCommand yarn codegen-styles
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::efb3dfea27ab3db2fb3756ed9657c5cb>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::d09e7cd13e24113267155813747b3bd4>>
  */
 declare const _default: {
     readonly 'neutral.bold': "inverse";
@@ -17,6 +17,9 @@ declare const _default: {
     readonly 'brand.bold': "inverse";
     readonly 'brand.bold.hovered': "inverse";
     readonly 'brand.bold.pressed': "inverse";
+    readonly 'brand.boldest': "inverse";
+    readonly 'brand.boldest.hovered': "inverse";
+    readonly 'brand.boldest.pressed': "inverse";
     readonly 'danger.bold': "inverse";
     readonly 'danger.bold.hovered': "inverse";
     readonly 'danger.bold.pressed': "inverse";

package/examples/01-box.tsx

@@ -153,7 +153,9 @@ export default () => {
               padding="space.400"
               position="absolute"
               UNSAFE_style={{
+                // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
                 top: index * 64,
+                // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
                 left: index * 64,
               }}
             >