@atlaskit/tokens 5.6.3 → 6.1.0

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

@@ -1,14 +1,15 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c6c0b8c2ca5e429f25fe4035e374a0c5>>
+ * @codegen <<SignedSource::f755c03a62ad1c3a129f21e10a2669d5>>
  * @codegenCommand yarn build tokens
  */
 const tokens = [{
   "attributes": {
     "group": "shape",
     "state": "active",
-    "introduced": "1.1.0",
-    "description": "Used for selection indicators, like tabs."
+    "suggest": ["2px"],
+    "introduced": "6.1.0",
+    "description": "Used for small containers such as badges."
   },
   "value": "2px",
   "filePath": "schema/themes/atlassian-shape/shape.tsx",
@@ -17,20 +18,141 @@ const tokens = [{
     "attributes": {
       "group": "shape",
       "state": "active",
-      "introduced": "1.1.0",
-      "description": "Used for selection indicators, like tabs."
+      "suggest": ["2px"],
+      "introduced": "6.1.0",
+      "description": "Used for small containers such as badges."
     },
-    "value": "Radius050"
+    "value": "Radius02"
   },
-  "name": "border.radius.050",
-  "path": ["border", "radius", "050"],
-  "cleanName": "border.radius.050"
+  "name": "radius.xsmall",
+  "path": ["radius", "xsmall"],
+  "cleanName": "radius.xsmall"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "active",
+    "suggest": ["4px"],
+    "introduced": "6.1.0",
+    "description": "Used for labels."
+  },
+  "value": "4px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "active",
+      "suggest": ["4px"],
+      "introduced": "6.1.0",
+      "description": "Used for labels."
+    },
+    "value": "Radius04"
+  },
+  "name": "radius.small",
+  "path": ["radius", "small"],
+  "cleanName": "radius.small"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "active",
+    "suggest": ["6px"],
+    "introduced": "6.1.0",
+    "description": "Used for buttons and inputs."
+  },
+  "value": "6px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "active",
+      "suggest": ["6px"],
+      "introduced": "6.1.0",
+      "description": "Used for buttons and inputs."
+    },
+    "value": "Radius06"
+  },
+  "name": "radius.medium",
+  "path": ["radius", "medium"],
+  "cleanName": "radius.medium"
 }, {
   "attributes": {
     "group": "shape",
     "state": "active",
-    "suggest": ["3px", "4px"],
+    "suggest": ["8px"],
+    "introduced": "6.1.0",
+    "description": "Used for cards and small containers."
+  },
+  "value": "8px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "active",
+      "suggest": ["8px"],
+      "introduced": "6.1.0",
+      "description": "Used for cards and small containers."
+    },
+    "value": "Radius08"
+  },
+  "name": "radius.large",
+  "path": ["radius", "large"],
+  "cleanName": "radius.large"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "active",
+    "suggest": ["12px"],
+    "introduced": "6.1.0",
+    "description": "Used for modals and large containers."
+  },
+  "value": "12px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "active",
+      "suggest": ["12px"],
+      "introduced": "6.1.0",
+      "description": "Used for modals and large containers."
+    },
+    "value": "Radius12"
+  },
+  "name": "radius.xlarge",
+  "path": ["radius", "xlarge"],
+  "cleanName": "radius.xlarge"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "active",
+    "suggest": ["50%"],
+    "introduced": "6.1.0",
+    "description": "Used for circular containers, like a rounded button."
+  },
+  "value": "9999px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "active",
+      "suggest": ["50%"],
+      "introduced": "6.1.0",
+      "description": "Used for circular containers, like a rounded button."
+    },
+    "value": "Radius99"
+  },
+  "name": "radius.full",
+  "path": ["radius", "full"],
+  "cleanName": "radius.full"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "deprecated",
     "introduced": "1.5.2",
+    "deprecated": "6.1.0",
     "description": "The default border radius."
   },
   "value": "4px",
@@ -39,12 +161,12 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
-      "suggest": ["3px", "4px"],
+      "state": "deprecated",
       "introduced": "1.5.2",
+      "deprecated": "6.1.0",
       "description": "The default border radius."
     },
-    "value": "Radius100"
+    "value": "Radius04"
   },
   "name": "border.radius.[default]",
   "path": ["border", "radius", "[default]"],
@@ -52,8 +174,33 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "active",
+    "state": "deprecated",
+    "introduced": "1.1.0",
+    "deprecated": "6.1.0",
+    "description": "Used for selection indicators, like tabs."
+  },
+  "value": "2px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "deprecated",
+      "introduced": "1.1.0",
+      "deprecated": "6.1.0",
+      "description": "Used for selection indicators, like tabs."
+    },
+    "value": "Radius02"
+  },
+  "name": "border.radius.050",
+  "path": ["border", "radius", "050"],
+  "cleanName": "border.radius.050"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "deprecated",
     "introduced": "1.1.0",
+    "deprecated": "6.1.0",
     "description": "Used for buttons and inputs."
   },
   "value": "4px",
@@ -62,11 +209,12 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
+      "state": "deprecated",
       "introduced": "1.1.0",
+      "deprecated": "6.1.0",
       "description": "Used for buttons and inputs."
     },
-    "value": "Radius100"
+    "value": "Radius04"
   },
   "name": "border.radius.100",
   "path": ["border", "radius", "100"],
@@ -74,8 +222,9 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "active",
+    "state": "deprecated",
     "introduced": "1.1.0",
+    "deprecated": "6.1.0",
     "description": "Used for smaller cards."
   },
   "value": "8px",
@@ -84,11 +233,12 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
+      "state": "deprecated",
       "introduced": "1.1.0",
+      "deprecated": "6.1.0",
       "description": "Used for smaller cards."
     },
-    "value": "Radius200"
+    "value": "Radius08"
   },
   "name": "border.radius.200",
   "path": ["border", "radius", "200"],
@@ -96,8 +246,9 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "active",
+    "state": "deprecated",
     "introduced": "1.1.0",
+    "deprecated": "6.1.0",
     "description": "Used for cards and larger containers."
   },
   "value": "12px",
@@ -106,11 +257,12 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
+      "state": "deprecated",
       "introduced": "1.1.0",
+      "deprecated": "6.1.0",
       "description": "Used for cards and larger containers."
     },
-    "value": "Radius300"
+    "value": "Radius12"
   },
   "name": "border.radius.300",
   "path": ["border", "radius", "300"],
@@ -118,8 +270,9 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "active",
+    "state": "deprecated",
     "introduced": "1.1.0",
+    "deprecated": "6.1.0",
     "description": "Used for modals."
   },
   "value": "16px",
@@ -128,11 +281,12 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
+      "state": "deprecated",
       "introduced": "1.1.0",
+      "deprecated": "6.1.0",
       "description": "Used for modals."
     },
-    "value": "Radius400"
+    "value": "Radius16"
   },
   "name": "border.radius.400",
   "path": ["border", "radius", "400"],
@@ -140,23 +294,23 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "active",
-    "suggest": ["50%"],
+    "state": "deprecated",
     "introduced": "1.1.0",
+    "deprecated": "6.1.0",
     "description": "Used for circular containers, like a rounded button."
   },
-  "value": "32032px",
+  "value": "9999px",
   "filePath": "schema/themes/atlassian-shape/shape.tsx",
   "isSource": true,
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
-      "suggest": ["50%"],
+      "state": "deprecated",
       "introduced": "1.1.0",
+      "deprecated": "6.1.0",
       "description": "Used for circular containers, like a rounded button."
     },
-    "value": "RadiusCircle"
+    "value": "Radius99"
   },
   "name": "border.radius.circle",
   "path": ["border", "radius", "circle"],
@@ -165,7 +319,7 @@ const tokens = [{
   "attributes": {
     "group": "shape",
     "state": "active",
-    "suggest": ["1px", "2px"],
+    "suggest": ["1px"],
     "introduced": "1.5.2",
     "description": "The default border width. Used for all borders."
   },
@@ -176,11 +330,11 @@ const tokens = [{
     "attributes": {
       "group": "shape",
       "state": "active",
-      "suggest": ["1px", "2px"],
+      "suggest": ["1px"],
       "introduced": "1.5.2",
       "description": "The default border width. Used for all borders."
     },
-    "value": "Size050"
+    "value": "BorderWidth1"
   },
   "name": "border.width.[default]",
   "path": ["border", "width", "[default]"],
@@ -188,8 +342,9 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "experimental",
+    "state": "deprecated",
     "introduced": "1.2.1",
+    "deprecated": "6.1.0",
     "description": "Used for zero width borders."
   },
   "value": "0px",
@@ -198,8 +353,9 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "experimental",
+      "state": "deprecated",
       "introduced": "1.2.1",
+      "deprecated": "6.1.0",
       "description": "Used for zero width borders."
     },
     "value": "Size0"
@@ -210,8 +366,9 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "active",
+    "state": "deprecated",
     "introduced": "1.5.2",
+    "deprecated": "6.1.0",
     "description": "Used for indicators like tab and menu selected states."
   },
   "value": "3px",
@@ -220,8 +377,9 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
+      "state": "deprecated",
       "introduced": "1.5.2",
+      "deprecated": "6.1.0",
       "description": "Used for indicators like tab and menu selected states."
     },
     "value": "Size200"
@@ -232,8 +390,9 @@ const tokens = [{
 }, {
   "attributes": {
     "group": "shape",
-    "state": "active",
+    "state": "deprecated",
     "introduced": "1.5.2",
+    "deprecated": "6.1.0",
     "description": "Used for focus, active or selected inputs."
   },
   "value": "2px",
@@ -242,14 +401,63 @@ const tokens = [{
   "original": {
     "attributes": {
       "group": "shape",
-      "state": "active",
+      "state": "deprecated",
       "introduced": "1.5.2",
+      "deprecated": "6.1.0",
       "description": "Used for focus, active or selected inputs."
     },
-    "value": "Size100"
+    "value": "BorderWidth2"
   },
   "name": "border.width.outline",
   "path": ["border", "width", "outline"],
   "cleanName": "border.width.outline"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "active",
+    "suggest": ["2px"],
+    "introduced": "6.1.0",
+    "description": "Use for selected states."
+  },
+  "value": "2px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "active",
+      "suggest": ["2px"],
+      "introduced": "6.1.0",
+      "description": "Use for selected states."
+    },
+    "value": "BorderWidth2"
+  },
+  "name": "border.width.selected",
+  "path": ["border", "width", "selected"],
+  "cleanName": "border.width.selected"
+}, {
+  "attributes": {
+    "group": "shape",
+    "state": "active",
+    "suggest": ["2px"],
+    "introduced": "6.1.0",
+    "description": "Use for focused states."
+  },
+  "value": "2px",
+  "filePath": "schema/themes/atlassian-shape/shape.tsx",
+  "isSource": true,
+  "original": {
+    "attributes": {
+      "group": "shape",
+      "state": "active",
+      "suggest": ["2px"],
+      "introduced": "6.1.0",
+      "description": "Use for focused states."
+    },
+    "value": "BorderWidth2"
+  },
+  "name": "border.width.focused",
+  "path": ["border", "width", "focused"],
+  "cleanName": "border.width.focused"
 }];
 export default tokens;

package/dist/es2019/constants.js

@@ -3,6 +3,6 @@ export const COLOR_MODE_ATTRIBUTE = 'data-color-mode';
 export const CONTRAST_MODE_ATTRIBUTE = 'data-contrast-mode';
 export const CUSTOM_THEME_ATTRIBUTE = 'data-custom-theme';
 export const CSS_PREFIX = 'ds';
-export const CSS_VAR_FULL = ['opacity', 'font', 'space', 'border'];
+export const CSS_VAR_FULL = ['opacity', 'font', 'space', 'border', 'radius'];
 export const TOKEN_NOT_FOUND_CSS_VAR = `--${CSS_PREFIX}-token-not-found`;
 export const CURRENT_SURFACE_CSS_VAR = `--${CSS_PREFIX}-elevation-surface-current`;

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

@@ -3,7 +3,7 @@
  *
  * Metadata for generation of of `@atlaskit/ads-mcp` and https://atlassian.design/llms-tokens.txt.
  *
- * @codegen <<SignedSource::c6f9eb087d49a14806a7713cb8306e06>>
+ * @codegen <<SignedSource::2f0d0ffb7abcc77f7b99efa4241047a4>>
  * @codegenCommand yarn build tokens
  */
 
@@ -1962,56 +1962,6 @@ export const tokens = [{
   path: ['utility', 'elevation', 'surface', 'current'],
   description: "A dynamic token that represents the current surface color set by a parent element. It defaults to the 'elevation.surface' token value.",
   exampleValue: '#FFFFFF'
-}, {
-  name: 'border.radius.050',
-  path: ['border', 'radius', '050'],
-  description: 'Used for selection indicators, like tabs.',
-  exampleValue: '0.125rem'
-}, {
-  name: 'border.radius',
-  path: ['border', 'radius', '[default]'],
-  description: 'The default border radius.',
-  exampleValue: '0.25rem'
-}, {
-  name: 'border.radius.100',
-  path: ['border', 'radius', '100'],
-  description: 'Used for buttons and inputs.',
-  exampleValue: '0.25rem'
-}, {
-  name: 'border.radius.200',
-  path: ['border', 'radius', '200'],
-  description: 'Used for smaller cards.',
-  exampleValue: '0.5rem'
-}, {
-  name: 'border.radius.300',
-  path: ['border', 'radius', '300'],
-  description: 'Used for cards and larger containers.',
-  exampleValue: '0.75rem'
-}, {
-  name: 'border.radius.400',
-  path: ['border', 'radius', '400'],
-  description: 'Used for modals.',
-  exampleValue: '1rem'
-}, {
-  name: 'border.radius.circle',
-  path: ['border', 'radius', 'circle'],
-  description: 'Used for circular containers, like a rounded button.',
-  exampleValue: '2002rem'
-}, {
-  name: 'border.width',
-  path: ['border', 'width', '[default]'],
-  description: 'The default border width. Used for all borders.',
-  exampleValue: '0.0625rem'
-}, {
-  name: 'border.width.indicator',
-  path: ['border', 'width', 'indicator'],
-  description: 'Used for indicators like tab and menu selected states.',
-  exampleValue: '0.1875rem'
-}, {
-  name: 'border.width.outline',
-  path: ['border', 'width', 'outline'],
-  description: 'Used for focus, active or selected inputs.',
-  exampleValue: '0.125rem'
 }, {
   name: 'space.0',
   path: ['space', '0'],
@@ -2247,4 +2197,99 @@ export const tokens = [{
   path: ['font', 'family', 'brand', 'body'],
   description: 'For our brand body text. Uses Charlie Text.',
   exampleValue: '"Charlie Text", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, "Helvetica Neue", sans-serif'
+}, {
+  name: 'radius.xsmall',
+  path: ['radius', 'xsmall'],
+  description: 'Used for small containers such as badges.',
+  exampleValue: '0.125rem'
+}, {
+  name: 'radius.small',
+  path: ['radius', 'small'],
+  description: 'Used for labels.',
+  exampleValue: '0.25rem'
+}, {
+  name: 'radius.medium',
+  path: ['radius', 'medium'],
+  description: 'Used for buttons and inputs.',
+  exampleValue: '0.375rem'
+}, {
+  name: 'radius.large',
+  path: ['radius', 'large'],
+  description: 'Used for cards and small containers.',
+  exampleValue: '0.5rem'
+}, {
+  name: 'radius.xlarge',
+  path: ['radius', 'xlarge'],
+  description: 'Used for modals and large containers.',
+  exampleValue: '0.75rem'
+}, {
+  name: 'radius.full',
+  path: ['radius', 'full'],
+  description: 'Used for circular containers, like a rounded button.',
+  exampleValue: '624.9375rem'
+}, {
+  name: 'border.radius',
+  path: ['border', 'radius', '[default]'],
+  description: 'The default border radius.',
+  exampleValue: '0.25rem'
+}, {
+  name: 'border.radius.050',
+  path: ['border', 'radius', '050'],
+  description: 'Used for selection indicators, like tabs.',
+  exampleValue: '0.125rem'
+}, {
+  name: 'border.radius.100',
+  path: ['border', 'radius', '100'],
+  description: 'Used for buttons and inputs.',
+  exampleValue: '0.25rem'
+}, {
+  name: 'border.radius.200',
+  path: ['border', 'radius', '200'],
+  description: 'Used for smaller cards.',
+  exampleValue: '0.5rem'
+}, {
+  name: 'border.radius.300',
+  path: ['border', 'radius', '300'],
+  description: 'Used for cards and larger containers.',
+  exampleValue: '0.75rem'
+}, {
+  name: 'border.radius.400',
+  path: ['border', 'radius', '400'],
+  description: 'Used for modals.',
+  exampleValue: '1rem'
+}, {
+  name: 'border.radius.circle',
+  path: ['border', 'radius', 'circle'],
+  description: 'Used for circular containers, like a rounded button.',
+  exampleValue: '624.9375rem'
+}, {
+  name: 'border.width',
+  path: ['border', 'width', '[default]'],
+  description: 'The default border width. Used for all borders.',
+  exampleValue: '0.0625rem'
+}, {
+  name: 'border.width.0',
+  path: ['border', 'width', '0'],
+  description: 'Used for zero width borders.',
+  exampleValue: '0rem'
+}, {
+  name: 'border.width.indicator',
+  path: ['border', 'width', 'indicator'],
+  description: 'Used for indicators like tab and menu selected states.',
+  exampleValue: '0.1875rem'
+}, {
+  name: 'border.width.outline',
+  path: ['border', 'width', 'outline'],
+  description: 'Used for focus, active or selected inputs.',
+  exampleValue: '0.125rem'
+}, {
+  name: 'border.width.selected',
+  path: ['border', 'width', 'selected'],
+  description: 'Use for selected states.',
+  exampleValue: '0.125rem'
+}, {
+  name: 'border.width.focused',
+  path: ['border', 'width', 'focused'],
+  description: 'Use for focused states.',
+  exampleValue: '0.125rem'
 }];