@atlaskit/ds-explorations 2.2.13 → 2.2.15

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/ds-explorations
 
+## 2.2.15
+
+### Patch Changes
+
+- [`6b3e7af515d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6b3e7af515d) - Updates based on new codgen for tokens (no API change).
+- Updated dependencies
+
+## 2.2.14
+
+### Patch Changes
+
+- [`813edf2fe03`](https://bitbucket.org/atlassian/atlassian-frontend/commits/813edf2fe03) - Minor internal changes. There is no expected behaviour change.
+- Updated dependencies
+
 ## 2.2.13
 
 ### Patch Changes

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

@@ -284,11 +284,11 @@ var heightMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::26bdf3368d6e881f82176d797d99e03f>>
+ * @codegen <<SignedSource::8aa9e47916dc6f6d72f32999f48fbd27>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["padding", "paddingBlock", "paddingInline"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 var paddingMap = {
   'space.0': (0, _react2.css)({

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

@@ -68,7 +68,7 @@ var baseStyles = (0, _react2.css)({
   flexDirection: 'row'
 });
 var dividerStyles = (0, _react2.css)({
-  margin: '0 -2px',
+  margin: "0 ".concat("var(--ds-space-negative-025, -2px)"),
   color: "var(--ds-text-subtle, #42526E)",
   pointerEvents: 'none',
   userSelect: 'none'
@@ -126,11 +126,11 @@ Inline.displayName = 'Inline';
 var _default = Inline;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::253507949de085f00146762f8cd80723>>
+ * @codegen <<SignedSource::63747c8b92ba373ad2259fa1fff3f434>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["columnGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 exports.default = _default;
 var columnGapMap = {

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

@@ -92,11 +92,11 @@ Stack.displayName = 'Stack';
 var _default = Stack;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0e45f4f2d2cca413fcf2aadc0cc08de0>>
+ * @codegen <<SignedSource::02ffa7c4ee52871441d288f44a054685>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["rowGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 exports.default = _default;
 var rowGapMap = {

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

@@ -135,11 +135,11 @@ var Text = function Text(_ref) {
 var _default = Text;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d3b73d63fef16f1f12ad8ec39520497e>>
+ * @codegen <<SignedSource::de3943f17f27e9d5895c249c30c12802>>
  * @codegenId typography
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::0e11bb3b13c1850386ae45bae589a46a>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::85d34d11efbf90832fccaf960c2ea033>>
  */
 exports.default = _default;
 var fontSizeMap = {
@@ -183,18 +183,21 @@ var fontWeightMap = {
   })
 };
 var fontFamilyMap = {
+  body: (0, _react2.css)({
+    fontFamily: "var(--ds-font-family-body, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
+  }),
   brand: (0, _react2.css)({
     fontFamily: "var(--ds-font-family-brand, Charlie Sans)"
   }),
   code: (0, _react2.css)({
     fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)"
   }),
+  heading: (0, _react2.css)({
+    fontFamily: "var(--ds-font-family-heading, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
+  }),
   monospace: (0, _react2.css)({
     fontFamily: "var(--ds-font-family-monospace, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)"
   }),
-  product: (0, _react2.css)({
-    fontFamily: "var(--ds-font-family-product, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
-  }),
   sans: (0, _react2.css)({
     fontFamily: "var(--ds-font-family-sans, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif)"
   })

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

@@ -276,11 +276,11 @@ const heightMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::26bdf3368d6e881f82176d797d99e03f>>
+ * @codegen <<SignedSource::8aa9e47916dc6f6d72f32999f48fbd27>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["padding", "paddingBlock", "paddingInline"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 const paddingMap = {
   'space.0': css({

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

@@ -62,7 +62,7 @@ const baseStyles = css({
   flexDirection: 'row'
 });
 const dividerStyles = css({
-  margin: '0 -2px',
+  margin: `0 ${"var(--ds-space-negative-025, -2px)"}`,
   color: "var(--ds-text-subtle, #42526E)",
   pointerEvents: 'none',
   userSelect: 'none'
@@ -121,11 +121,11 @@ export default Inline;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::253507949de085f00146762f8cd80723>>
+ * @codegen <<SignedSource::63747c8b92ba373ad2259fa1fff3f434>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["columnGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 const columnGapMap = {
   'space.0': css({

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

@@ -88,11 +88,11 @@ export default Stack;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0e45f4f2d2cca413fcf2aadc0cc08de0>>
+ * @codegen <<SignedSource::02ffa7c4ee52871441d288f44a054685>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["rowGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 const rowGapMap = {
   'space.0': css({

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

@@ -126,11 +126,11 @@ export default Text;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d3b73d63fef16f1f12ad8ec39520497e>>
+ * @codegen <<SignedSource::de3943f17f27e9d5895c249c30c12802>>
  * @codegenId typography
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::0e11bb3b13c1850386ae45bae589a46a>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::85d34d11efbf90832fccaf960c2ea033>>
  */
 const fontSizeMap = {
   'size.050': css({
@@ -173,18 +173,21 @@ const fontWeightMap = {
   })
 };
 const fontFamilyMap = {
+  body: css({
+    fontFamily: "var(--ds-font-family-body, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
+  }),
   brand: css({
     fontFamily: "var(--ds-font-family-brand, Charlie Sans)"
   }),
   code: css({
     fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)"
   }),
+  heading: css({
+    fontFamily: "var(--ds-font-family-heading, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
+  }),
   monospace: css({
     fontFamily: "var(--ds-font-family-monospace, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)"
   }),
-  product: css({
-    fontFamily: "var(--ds-font-family-product, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
-  }),
   sans: css({
     fontFamily: "var(--ds-font-family-sans, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif)"
   })

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

@@ -279,11 +279,11 @@ var heightMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::26bdf3368d6e881f82176d797d99e03f>>
+ * @codegen <<SignedSource::8aa9e47916dc6f6d72f32999f48fbd27>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["padding", "paddingBlock", "paddingInline"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 var paddingMap = {
   'space.0': css({

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

@@ -62,7 +62,7 @@ var baseStyles = css({
   flexDirection: 'row'
 });
 var dividerStyles = css({
-  margin: '0 -2px',
+  margin: "0 ".concat("var(--ds-space-negative-025, -2px)"),
   color: "var(--ds-text-subtle, #42526E)",
   pointerEvents: 'none',
   userSelect: 'none'
@@ -121,11 +121,11 @@ export default Inline;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::253507949de085f00146762f8cd80723>>
+ * @codegen <<SignedSource::63747c8b92ba373ad2259fa1fff3f434>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["columnGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 var columnGapMap = {
   'space.0': css({

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

@@ -87,11 +87,11 @@ export default Stack;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0e45f4f2d2cca413fcf2aadc0cc08de0>>
+ * @codegen <<SignedSource::02ffa7c4ee52871441d288f44a054685>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["rowGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 var rowGapMap = {
   'space.0': css({

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

@@ -129,11 +129,11 @@ export default Text;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d3b73d63fef16f1f12ad8ec39520497e>>
+ * @codegen <<SignedSource::de3943f17f27e9d5895c249c30c12802>>
  * @codegenId typography
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::0e11bb3b13c1850386ae45bae589a46a>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::85d34d11efbf90832fccaf960c2ea033>>
  */
 var fontSizeMap = {
   'size.050': css({
@@ -176,18 +176,21 @@ var fontWeightMap = {
   })
 };
 var fontFamilyMap = {
+  body: css({
+    fontFamily: "var(--ds-font-family-body, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
+  }),
   brand: css({
     fontFamily: "var(--ds-font-family-brand, Charlie Sans)"
   }),
   code: css({
     fontFamily: "var(--ds-font-family-code, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)"
   }),
+  heading: css({
+    fontFamily: "var(--ds-font-family-heading, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
+  }),
   monospace: css({
     fontFamily: "var(--ds-font-family-monospace, ui-monospace, Menlo, \"Segoe UI Mono\", \"Ubuntu Mono\", monospace)"
   }),
-  product: css({
-    fontFamily: "var(--ds-font-family-product, ui-sans-serif, \"Segoe UI\", system-ui, Ubuntu, \"Helvetica Neue\", sans-serif)"
-  }),
   sans: css({
     fontFamily: "var(--ds-font-family-sans, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif)"
   })

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

@@ -229,11 +229,11 @@ export type Height = keyof typeof heightMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::26bdf3368d6e881f82176d797d99e03f>>
+ * @codegen <<SignedSource::8aa9e47916dc6f6d72f32999f48fbd27>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["padding", "paddingBlock", "paddingInline"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 declare const paddingMap: {
     'space.0': import("@emotion/react").SerializedStyles;

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

@@ -80,11 +80,11 @@ declare const Inline: import("react").MemoExoticComponent<import("react").Forwar
 export default Inline;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::253507949de085f00146762f8cd80723>>
+ * @codegen <<SignedSource::63747c8b92ba373ad2259fa1fff3f434>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["columnGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 declare const columnGapMap: {
     'space.0': import("@emotion/react").SerializedStyles;

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

@@ -64,11 +64,11 @@ declare const Stack: import("react").MemoExoticComponent<import("react").Forward
 export default Stack;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0e45f4f2d2cca413fcf2aadc0cc08de0>>
+ * @codegen <<SignedSource::02ffa7c4ee52871441d288f44a054685>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["rowGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 declare const rowGapMap: {
     'space.0': import("@emotion/react").SerializedStyles;

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

@@ -81,11 +81,11 @@ declare const Text: FC<TextProps>;
 export default Text;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d3b73d63fef16f1f12ad8ec39520497e>>
+ * @codegen <<SignedSource::de3943f17f27e9d5895c249c30c12802>>
  * @codegenId typography
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::0e11bb3b13c1850386ae45bae589a46a>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::85d34d11efbf90832fccaf960c2ea033>>
  */
 declare const fontSizeMap: {
     'size.050': import("@emotion/react").SerializedStyles;
@@ -106,10 +106,11 @@ declare const fontWeightMap: {
 };
 export type FontWeight = keyof typeof fontWeightMap;
 declare const fontFamilyMap: {
+    body: import("@emotion/react").SerializedStyles;
     brand: import("@emotion/react").SerializedStyles;
     code: import("@emotion/react").SerializedStyles;
+    heading: import("@emotion/react").SerializedStyles;
     monospace: import("@emotion/react").SerializedStyles;
-    product: import("@emotion/react").SerializedStyles;
     sans: import("@emotion/react").SerializedStyles;
 };
 export type FontFamily = keyof typeof fontFamilyMap;

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

@@ -229,11 +229,11 @@ export type Height = keyof typeof heightMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::26bdf3368d6e881f82176d797d99e03f>>
+ * @codegen <<SignedSource::8aa9e47916dc6f6d72f32999f48fbd27>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["padding", "paddingBlock", "paddingInline"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 declare const paddingMap: {
     'space.0': import("@emotion/react").SerializedStyles;

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

@@ -80,11 +80,11 @@ declare const Inline: import("react").MemoExoticComponent<import("react").Forwar
 export default Inline;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::253507949de085f00146762f8cd80723>>
+ * @codegen <<SignedSource::63747c8b92ba373ad2259fa1fff3f434>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["columnGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 declare const columnGapMap: {
     'space.0': import("@emotion/react").SerializedStyles;

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

@@ -64,11 +64,11 @@ declare const Stack: import("react").MemoExoticComponent<import("react").Forward
 export default Stack;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0e45f4f2d2cca413fcf2aadc0cc08de0>>
+ * @codegen <<SignedSource::02ffa7c4ee52871441d288f44a054685>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["rowGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 declare const rowGapMap: {
     'space.0': import("@emotion/react").SerializedStyles;

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

@@ -86,11 +86,11 @@ declare const Text: FC<TextProps>;
 export default Text;
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d3b73d63fef16f1f12ad8ec39520497e>>
+ * @codegen <<SignedSource::de3943f17f27e9d5895c249c30c12802>>
  * @codegenId typography
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::0e11bb3b13c1850386ae45bae589a46a>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::85d34d11efbf90832fccaf960c2ea033>>
  */
 declare const fontSizeMap: {
     'size.050': import("@emotion/react").SerializedStyles;
@@ -111,10 +111,11 @@ declare const fontWeightMap: {
 };
 export type FontWeight = keyof typeof fontWeightMap;
 declare const fontFamilyMap: {
+    body: import("@emotion/react").SerializedStyles;
     brand: import("@emotion/react").SerializedStyles;
     code: import("@emotion/react").SerializedStyles;
+    heading: import("@emotion/react").SerializedStyles;
     monospace: import("@emotion/react").SerializedStyles;
-    product: import("@emotion/react").SerializedStyles;
     sans: import("@emotion/react").SerializedStyles;
 };
 export type FontFamily = keyof typeof fontFamilyMap;

package/docs/01-basic.tsx

@@ -5,14 +5,15 @@ import {
   DevPreviewWarning,
   md,
 } from '@atlaskit/docs';
+import { token } from '@atlaskit/tokens';
 
 export default md`
 ${(
   <>
-    <div style={{ marginBottom: 8 }}>
+    <div style={{ marginBottom: token('space.100', '8px') }}>
       <AtlassianInternalWarning />
     </div>
-    <div style={{ marginTop: 8 }}>
+    <div style={{ marginTop: token('space.100', '8px') }}>
       <DevPreviewWarning />
     </div>
   </>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/ds-explorations",
-  "version": "2.2.13",
+  "version": "2.2.15",
   "description": "An experimental package for exploration and validation of spacing / typography foundations.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -25,7 +25,7 @@
     "prepare": "yarn ak-postbuild"
   },
   "dependencies": {
-    "@atlaskit/tokens": "^1.19.0",
+    "@atlaskit/tokens": "^1.22.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "tiny-invariant": "^1.2.0"

package/scripts/spacing-codegen-template.tsx

@@ -26,12 +26,12 @@ const spacingProperties = {
   },
 } as const;
 
-const onlySpaceTokens = tokens.filter((token) =>
-  token.name.startsWith('space.'),
-);
+const onlySpaceTokens = tokens
+  .filter((token) => token.name.startsWith('space.'))
+  .filter((token) => !token.name.includes('.negative'));
 
 const activeTokens = onlySpaceTokens.map((t) => ({
-  name: t.name,
+  name: t.cleanName,
   fallback: t.value,
 }));
 

package/scripts/spacing-scale-template.tsx

@@ -3,11 +3,11 @@ import parserTypeScript from 'prettier/parser-typescript';
 
 import { spacing as tokens } from '@atlaskit/tokens/tokens-raw';
 
-const onlySpaceTokens = tokens.filter((token) =>
-  token.name.startsWith('space.'),
-);
+const onlySpaceTokens = tokens
+  .filter((token) => token.name.startsWith('space.'))
+  .filter((token) => !token.name.includes('.negative'));
 
-const activeTokens = onlySpaceTokens.map((t) => `'${t.name}'`);
+const activeTokens = onlySpaceTokens.map((t) => `'${t.cleanName}'`);
 
 export const createSpacingScaleTemplate = () => {
   return prettier.format(

package/src/components/box.partial.tsx

@@ -357,11 +357,11 @@ export type Height = keyof typeof heightMap;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::26bdf3368d6e881f82176d797d99e03f>>
+ * @codegen <<SignedSource::8aa9e47916dc6f6d72f32999f48fbd27>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["padding", "paddingBlock", "paddingInline"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 const paddingMap = {
   'space.0': css({

package/src/components/inline.partial.tsx

@@ -73,7 +73,7 @@ const baseStyles = css({
 });
 
 const dividerStyles = css({
-  margin: '0 -2px',
+  margin: `0 ${token('space.negative.025', '-2px')}`,
   color: token('color.text.subtle', '#42526E'),
   pointerEvents: 'none',
   userSelect: 'none',
@@ -160,11 +160,11 @@ export default Inline;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::253507949de085f00146762f8cd80723>>
+ * @codegen <<SignedSource::63747c8b92ba373ad2259fa1fff3f434>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["columnGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 const columnGapMap = {
   'space.0': css({

package/src/components/stack.partial.tsx

@@ -116,11 +116,11 @@ export default Stack;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0e45f4f2d2cca413fcf2aadc0cc08de0>>
+ * @codegen <<SignedSource::02ffa7c4ee52871441d288f44a054685>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["rowGap"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::68f6bde7e6b186964ee53458284bbb90>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::298080e8024fb3eb37589721413e0156>>
  */
 const rowGapMap = {
   'space.0': css({

package/src/components/text.partial.tsx

@@ -195,11 +195,11 @@ export default Text;
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d3b73d63fef16f1f12ad8ec39520497e>>
+ * @codegen <<SignedSource::de3943f17f27e9d5895c249c30c12802>>
  * @codegenId typography
  * @codegenCommand yarn codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight"]
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::0e11bb3b13c1850386ae45bae589a46a>>
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-typography.tsx <<SignedSource::85d34d11efbf90832fccaf960c2ea033>>
  */
 const fontSizeMap = {
   'size.050': css({
@@ -248,6 +248,12 @@ const fontWeightMap = {
 export type FontWeight = keyof typeof fontWeightMap;
 
 const fontFamilyMap = {
+  body: css({
+    fontFamily: token(
+      'font.family.body',
+      'ui-sans-serif, "Segoe UI", system-ui, Ubuntu, "Helvetica Neue", sans-serif',
+    ),
+  }),
   brand: css({
     fontFamily: token('font.family.brand', 'Charlie Sans'),
   }),
@@ -257,16 +263,16 @@ const fontFamilyMap = {
       'ui-monospace, Menlo, "Segoe UI Mono", "Ubuntu Mono", monospace',
     ),
   }),
-  monospace: css({
+  heading: css({
     fontFamily: token(
-      'font.family.monospace',
-      'ui-monospace, Menlo, "Segoe UI Mono", "Ubuntu Mono", monospace',
+      'font.family.heading',
+      'ui-sans-serif, "Segoe UI", system-ui, Ubuntu, "Helvetica Neue", sans-serif',
     ),
   }),
-  product: css({
+  monospace: css({
     fontFamily: token(
-      'font.family.product',
-      'ui-sans-serif, "Segoe UI", system-ui, Ubuntu, "Helvetica Neue", sans-serif',
+      'font.family.monospace',
+      'ui-monospace, Menlo, "Segoe UI Mono", "Ubuntu Mono", monospace',
     ),
   }),
   sans: css({