@atlaskit/tokens 13.3.0 → 13.4.0

package/dist/es2019/artifacts/tokens-raw/atlassian-light.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c631fcd3119818d8ef034f197db3132f>>
+ * @codegen <<SignedSource::a1882f4b4e3305935325d612a706f4d0>>
  * @codegenCommand yarn build tokens
  */
 
@@ -3683,7 +3683,7 @@ const tokens = [{
     "group": "paint",
     "state": "active",
     "introduced": "13.2.0",
-    "description": "Background colour for non-interactive elements communicating caution (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.warning.bold or color.background.warning.subtler for interactive states."
+    "description": "Background colour for non-interactive elements communicating caution (e.g. status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.warning.bold or color.background.warning.subtler for interactive states."
   },
   "value": "#FBD779",
   "filePath": "schema/themes/atlassian-light/color/background.tsx",
@@ -3693,7 +3693,7 @@ const tokens = [{
       "group": "paint",
       "state": "active",
       "introduced": "13.2.0",
-      "description": "Background colour for non-interactive elements communicating caution (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.warning.bold or color.background.warning.subtler for interactive states."
+      "description": "Background colour for non-interactive elements communicating caution (e.g. status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.warning.bold or color.background.warning.subtler for interactive states."
     },
     "value": "Orange250"
   },
@@ -4873,7 +4873,7 @@ const tokens = [{
     "introduced": "13.2.0",
     "description": "Use for decorative gray borders that do not need to meet 3:1 contrast requirements."
   },
-  "value": "#DDDEE1",
+  "value": "#B7B9BE",
   "filePath": "schema/themes/atlassian-light/color/accent.tsx",
   "isSource": true,
   "original": {
@@ -4883,7 +4883,7 @@ const tokens = [{
       "introduced": "13.2.0",
       "description": "Use for decorative gray borders that do not need to meet 3:1 contrast requirements."
     },
-    "value": "Neutral300"
+    "value": "Neutral400"
   },
   "name": "color.border.accent.gray.subtle",
   "path": ["color", "border", "accent", "gray", "subtle"],
@@ -9354,6 +9354,28 @@ const tokens = [{
   "name": "elevation.surface.[default].pressed",
   "path": ["elevation", "surface", "[default]", "pressed"],
   "cleanName": "elevation.surface.pressed"
+}, {
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "13.3.0",
+    "description": "Use as a neutral container surface background."
+  },
+  "value": "#F0F1F2",
+  "filePath": "schema/themes/atlassian-light/elevation/surface.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "13.3.0",
+      "description": "Use as a neutral container surface background."
+    },
+    "value": "Neutral200"
+  },
+  "name": "elevation.surface.container",
+  "path": ["elevation", "surface", "container"],
+  "cleanName": "elevation.surface.container"
 }, {
   "attributes": {
     "group": "paint",
@@ -9508,6 +9530,72 @@ const tokens = [{
   "name": "elevation.surface.sunken",
   "path": ["elevation", "surface", "sunken"],
   "cleanName": "elevation.surface.sunken"
+}, {
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "13.3.0",
+    "description": "Use for Rovo overlay surface backgrounds."
+  },
+  "value": "#F8F8F8",
+  "filePath": "schema/themes/atlassian-light/elevation/rovo/surface.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "13.3.0",
+      "description": "Use for Rovo overlay surface backgrounds."
+    },
+    "value": "Neutral100"
+  },
+  "name": "elevation.rovo.surface.overlay.[default]",
+  "path": ["elevation", "rovo", "surface", "overlay", "[default]"],
+  "cleanName": "elevation.rovo.surface.overlay"
+}, {
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "13.3.0",
+    "description": "Hovered state of elevation.rovo.surface.overlay."
+  },
+  "value": "#F0F1F2",
+  "filePath": "schema/themes/atlassian-light/elevation/rovo/surface.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "13.3.0",
+      "description": "Hovered state of elevation.rovo.surface.overlay."
+    },
+    "value": "Neutral200"
+  },
+  "name": "elevation.rovo.surface.overlay.hovered",
+  "path": ["elevation", "rovo", "surface", "overlay", "hovered"],
+  "cleanName": "elevation.rovo.surface.overlay.hovered"
+}, {
+  "attributes": {
+    "group": "paint",
+    "state": "active",
+    "introduced": "13.3.0",
+    "description": "Pressed state of elevation.rovo.surface.overlay."
+  },
+  "value": "#DDDEE1",
+  "filePath": "schema/themes/atlassian-light/elevation/rovo/surface.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "paint",
+      "state": "active",
+      "introduced": "13.3.0",
+      "description": "Pressed state of elevation.rovo.surface.overlay."
+    },
+    "value": "Neutral300"
+  },
+  "name": "elevation.rovo.surface.overlay.pressed",
+  "path": ["elevation", "rovo", "surface", "overlay", "pressed"],
+  "cleanName": "elevation.rovo.surface.overlay.pressed"
 }, {
   "attributes": {
     "group": "shadow",

package/dist/es2019/entry-points/token-metadata.codegen.js

@@ -3,7 +3,7 @@
  *
  * Metadata for generation of `@atlaskit/ads-mcp` and https://atlassian.design/llms-tokens.txt.
  *
- * @codegen <<SignedSource::0dd74e66e81ca1f0f575266507ec4ff6>>
+ * @codegen <<SignedSource::ae4acbb8ddfe6f3a0c28dc3479fd9d0d>>
  * @codegenCommand yarn build tokens
  */
 
@@ -1945,7 +1945,7 @@ export const tokens = [{
 }, {
   name: 'color.background.warning.subtle',
   path: ['color', 'background', 'warning', 'subtle', '[default]'],
-  description: 'Background colour for non-interactive elements communicating caution (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.warning.bold or color.background.warning.subtler for interactive states.',
+  description: 'Background colour for non-interactive elements communicating caution (e.g. status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.warning.bold or color.background.warning.subtler for interactive states.',
   exampleValue: '#FBD779',
   usageGuidelines: {
     usage: 'The color for backgrounds. Use for areas behind content (e.g. color.background.neutral, color.background.selected)',
@@ -2432,7 +2432,7 @@ export const tokens = [{
   name: 'color.border.accent.gray.subtle',
   path: ['color', 'border', 'accent', 'gray', 'subtle'],
   description: 'Use for decorative gray borders that do not need to meet 3:1 contrast requirements.',
-  exampleValue: '#DDDEE1',
+  exampleValue: '#B7B9BE',
   usageGuidelines: {
     usage: 'The color for borders or outlines. Use for border and outline colors on components (e.g. color.border, color.border.focused)',
     cssProperties: ['border-color', 'outline-color']
@@ -4264,6 +4264,15 @@ export const tokens = [{
     usage: 'The base color for app and component surfaces. Raised and overlay surfaces should be used in concert with shadows (e.g. elevation.surface.raised should be used with elevation.shadow.raised)',
     cssProperties: ['background-color']
   }
+}, {
+  name: 'elevation.surface.container',
+  path: ['elevation', 'surface', 'container'],
+  description: 'Use as a neutral container surface background.',
+  exampleValue: '#F0F1F2',
+  usageGuidelines: {
+    usage: 'The base color for app and component surfaces. Raised and overlay surfaces should be used in concert with shadows (e.g. elevation.surface.raised should be used with elevation.shadow.raised)',
+    cssProperties: ['background-color']
+  }
 }, {
   name: 'elevation.surface.overlay',
   path: ['elevation', 'surface', 'overlay', '[default]'],
@@ -4327,6 +4336,33 @@ export const tokens = [{
     usage: 'The base color for app and component surfaces. Raised and overlay surfaces should be used in concert with shadows (e.g. elevation.surface.raised should be used with elevation.shadow.raised)',
     cssProperties: ['background-color']
   }
+}, {
+  name: 'elevation.rovo.surface.overlay',
+  path: ['elevation', 'rovo', 'surface', 'overlay', '[default]'],
+  description: 'Use for Rovo overlay surface backgrounds.',
+  exampleValue: '#F8F8F8',
+  usageGuidelines: {
+    usage: 'The base color for app and component surfaces. Raised and overlay surfaces should be used in concert with shadows (e.g. elevation.surface.raised should be used with elevation.shadow.raised)',
+    cssProperties: ['background-color']
+  }
+}, {
+  name: 'elevation.rovo.surface.overlay.hovered',
+  path: ['elevation', 'rovo', 'surface', 'overlay', 'hovered'],
+  description: 'Hovered state of elevation.rovo.surface.overlay.',
+  exampleValue: '#F0F1F2',
+  usageGuidelines: {
+    usage: 'The base color for app and component surfaces. Raised and overlay surfaces should be used in concert with shadows (e.g. elevation.surface.raised should be used with elevation.shadow.raised)',
+    cssProperties: ['background-color']
+  }
+}, {
+  name: 'elevation.rovo.surface.overlay.pressed',
+  path: ['elevation', 'rovo', 'surface', 'overlay', 'pressed'],
+  description: 'Pressed state of elevation.rovo.surface.overlay.',
+  exampleValue: '#DDDEE1',
+  usageGuidelines: {
+    usage: 'The base color for app and component surfaces. Raised and overlay surfaces should be used in concert with shadows (e.g. elevation.surface.raised should be used with elevation.shadow.raised)',
+    cssProperties: ['background-color']
+  }
 }, {
   name: 'elevation.shadow.overflow',
   path: ['elevation', 'shadow', 'overflow', '[default]'],

package/dist/es2019/utils/token-order.js

@@ -8,7 +8,7 @@ export const tokenOrder = [{
   'accent', 'iconBorder', 'overlay']
 }, {
   path: 'elevation',
-  subpaths: ['surface', 'shadow']
+  subpaths: ['surface', 'rovo', 'shadow']
 }, {
   path: 'opacity',
   subpaths: []

package/dist/es2019/utils/token-usage-guidelines.js

@@ -8,6 +8,9 @@ const getTokenCategoryId = tokenId => {
   if (tokenId.startsWith('color.rovo.icon.')) {
     return tokenId.replace('color.rovo.icon.', 'color.icon.');
   }
+  if (tokenId.startsWith('elevation.rovo.surface.')) {
+    return tokenId.replace('elevation.rovo.surface.', 'elevation.surface.');
+  }
   return tokenId;
 };
 export const getTokenUsageGuidelines = tokenId => {