@atlaskit/primitives 1.18.0 → 1.20.0

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/primitives
 
+## 1.20.0
+
+### Minor Changes
+
+- [#68163](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/68163) [`67d09e3f972d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/67d09e3f972d) - `weight` property added to `Text` to allow overriding text variant default font weight.
+- [#69343](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/69343) [`77249f536425`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/77249f536425) - `Text` color prop defaults to `color.text` if not provided.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 1.19.0
+
+### Minor Changes
+
+- [#66702](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/66702) [`5b6bbaf2d5fc`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5b6bbaf2d5fc) - Added `maxLines` prop to `Text` component, allowing truncation at a certain number of lines. This prop replaces `shouldTruncate` prop.
+
+### Patch Changes
+
+- [#67698](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67698) [`175c07b58c52`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/175c07b58c52) - Export tokensMap object
+
 ## 1.18.0
 
 ### Minor Changes

package/dist/cjs/components/text.js

@@ -40,11 +40,16 @@ var textAlignMap = {
     textAlign: 'start'
   })
 };
-var truncateStyles = (0, _react2.css)({
+var truncationStyles = (0, _react2.css)({
+  display: '-webkit-box',
   overflow: 'hidden',
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap'
+  WebkitBoxOrient: 'vertical'
 });
+var wordBreakMap = {
+  breakAll: (0, _react2.css)({
+    wordBreak: 'break-all'
+  })
+};
 
 /**
  * Custom hook designed to abstract the parsing of the color props and make it clearer in the future how color is reconciled between themes and tokens.
@@ -78,29 +83,25 @@ var Text = function Text(_ref) {
   var children = _ref.children,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var asElement = props.as,
-    colorProp = props.color,
+    _props$color = props.color,
+    colorProp = _props$color === void 0 ? 'color.text' : _props$color,
     textAlign = props.textAlign,
     testId = props.testId,
     id = props.id,
     _props$variant = props.variant,
-    variant = _props$variant === void 0 ? 'body' : _props$variant;
-  var Component = asElement;
-  if (!Component) {
-    if (variant.includes('body')) {
-      Component = 'p';
-    } else {
-      // ui text and default => span
-      Component = 'span';
-    }
-  }
+    variant = _props$variant === void 0 ? 'body' : _props$variant,
+    weight = props.weight;
 
-  // Remove the ability to bypass typescript errors for shouldTruncate
-  var shouldTruncate = false;
-  if ('shouldTruncate' in props && variant.includes('body')) {
-    var _props$shouldTruncate;
-    shouldTruncate = (_props$shouldTruncate = props.shouldTruncate) !== null && _props$shouldTruncate !== void 0 ? _props$shouldTruncate : false;
-  }
+  // body variants -> p
+  // ui variants -> span
+  var Component = asElement || (variant.includes('body') ? 'p' : 'span');
   (0, _tinyInvariant.default)(asAllowlist.includes(Component), "@atlaskit/primitives: Text received an invalid \"as\" value of \"".concat(Component, "\""));
+
+  // Remove the ability to bypass typescript errors for maxLines
+  var maxLines;
+  if ('maxLines' in props && variant.includes('body')) {
+    maxLines = props.maxLines;
+  }
   var color = useColor(colorProp);
   var isWrapped = useHasTextAncestor();
 
@@ -112,7 +113,10 @@ var Text = function Text(_ref) {
     return (0, _react2.jsx)(_react.Fragment, null, children);
   }
   var component = (0, _react2.jsx)(Component, {
-    css: [resetStyles, variant && variantStyles[variant], color && _styleMaps.textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    css: [resetStyles, variant && variantStyles[variant], color && _styleMaps.textColorStylesMap[color], maxLines && truncationStyles, maxLines === 1 && wordBreakMap.breakAll, textAlign && textAlignMap[textAlign], weight && _styleMaps.fontWeightStylesMap[weight], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    style: {
+      WebkitLineClamp: maxLines
+    },
     "data-testid": testId,
     id: id
   }, children);

package/dist/cjs/index.js

@@ -64,6 +64,12 @@ Object.defineProperty(exports, "media", {
     return _responsive.media;
   }
 });
+Object.defineProperty(exports, "tokensMap", {
+  enumerable: true,
+  get: function get() {
+    return _xcss.tokensMap;
+  }
+});
 Object.defineProperty(exports, "xcss", {
   enumerable: true,
   get: function get() {

package/dist/cjs/xcss/style-maps.partial.js

@@ -496,7 +496,7 @@ var borderRadiusMap = exports.borderRadiusMap = {
 
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::badcf0eda5c0c2a7dca4428cc42a5db9>>
+ * @codegen <<SignedSource::402816562c359603300fda81596a2978>>
  * @codegenId typography
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight", "body", "ui"]
@@ -514,10 +514,10 @@ var fontSizeMap = exports.fontSizeMap = {
   'font.size.600': "var(--ds-font-size-600, 35px)"
 };
 var fontWeightMap = exports.fontWeightMap = {
-  'font.weight.bold': "var(--ds-font-weight-bold, 700)",
-  'font.weight.medium': "var(--ds-font-weight-medium, 500)",
-  'font.weight.regular': "var(--ds-font-weight-regular, 400)",
-  'font.weight.semibold': "var(--ds-font-weight-semibold, 600)"
+  bold: "var(--ds-font-weight-bold, 700)",
+  medium: "var(--ds-font-weight-medium, 500)",
+  regular: "var(--ds-font-weight-regular, 400)",
+  semibold: "var(--ds-font-weight-semibold, 600)"
 };
 var fontFamilyMap = exports.fontFamilyMap = {
   'font.family.body': "var(--ds-font-family-body, ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
@@ -542,7 +542,7 @@ var bodyTextMap = exports.bodyTextMap = {
   'body.small': "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
 };
 var uiTextMap = exports.uiTextMap = {
-  ui: "var(--ds-font-ui, normal 400 14px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
+  ui: "var(--ds-font-ui, normal 500 14px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
   'ui.small': "var(--ds-font-ui-small, normal 400 11px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
 };
 

package/dist/cjs/xcss/xcss.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.parseXcss = void 0;
+exports.tokensMap = exports.parseXcss = void 0;
 exports.xcss = xcss;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -15,7 +15,7 @@ var _styleMaps = require("./style-maps.partial");
 
 // eslint-disable-next-line import/no-extraneous-dependencies
 
-var tokensMap = {
+var tokensMap = exports.tokensMap = {
   backgroundColor: _styleMaps.backgroundColorMap,
   blockSize: _styleMaps.dimensionMap,
   borderBlockColor: _styleMaps.borderColorMap,

package/dist/es2019/components/text.js

@@ -2,7 +2,7 @@
 import { createContext, Fragment, useContext } from 'react';
 import { css, jsx } from '@emotion/react';
 import invariant from 'tiny-invariant';
-import { bodyTextStylesMap, inverseColorMap, textColorStylesMap, uiTextStylesMap } from '../xcss/style-maps.partial';
+import { bodyTextStylesMap, fontWeightStylesMap, inverseColorMap, textColorStylesMap, uiTextStylesMap } from '../xcss/style-maps.partial';
 import { useSurface } from './internal/surface-provider';
 const asAllowlist = ['span', 'p', 'strong', 'em'];
 // We're doing this because our CSS reset can add top margins to elements such as `p` which is totally insane.
@@ -32,11 +32,16 @@ const textAlignMap = {
     textAlign: 'start'
   })
 };
-const truncateStyles = css({
+const truncationStyles = css({
+  display: '-webkit-box',
   overflow: 'hidden',
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap'
+  WebkitBoxOrient: 'vertical'
 });
+const wordBreakMap = {
+  breakAll: css({
+    wordBreak: 'break-all'
+  })
+};
 
 /**
  * Custom hook designed to abstract the parsing of the color props and make it clearer in the future how color is reconciled between themes and tokens.
@@ -70,29 +75,24 @@ const Text = ({
 }) => {
   const {
     as: asElement,
-    color: colorProp,
+    color: colorProp = 'color.text',
     textAlign,
     testId,
     id,
-    variant = 'body'
+    variant = 'body',
+    weight
   } = props;
-  let Component = asElement;
-  if (!Component) {
-    if (variant.includes('body')) {
-      Component = 'p';
-    } else {
-      // ui text and default => span
-      Component = 'span';
-    }
-  }
 
-  // Remove the ability to bypass typescript errors for shouldTruncate
-  let shouldTruncate = false;
-  if ('shouldTruncate' in props && variant.includes('body')) {
-    var _props$shouldTruncate;
-    shouldTruncate = (_props$shouldTruncate = props.shouldTruncate) !== null && _props$shouldTruncate !== void 0 ? _props$shouldTruncate : false;
-  }
+  // body variants -> p
+  // ui variants -> span
+  const Component = asElement || (variant.includes('body') ? 'p' : 'span');
   invariant(asAllowlist.includes(Component), `@atlaskit/primitives: Text received an invalid "as" value of "${Component}"`);
+
+  // Remove the ability to bypass typescript errors for maxLines
+  let maxLines;
+  if ('maxLines' in props && variant.includes('body')) {
+    maxLines = props.maxLines;
+  }
   const color = useColor(colorProp);
   const isWrapped = useHasTextAncestor();
 
@@ -104,7 +104,10 @@ const Text = ({
     return jsx(Fragment, null, children);
   }
   const component = jsx(Component, {
-    css: [resetStyles, variant && variantStyles[variant], color && textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    css: [resetStyles, variant && variantStyles[variant], color && textColorStylesMap[color], maxLines && truncationStyles, maxLines === 1 && wordBreakMap.breakAll, textAlign && textAlignMap[textAlign], weight && fontWeightStylesMap[weight], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    style: {
+      WebkitLineClamp: maxLines
+    },
     "data-testid": testId,
     id: id
   }, children);

package/dist/es2019/index.js

@@ -1,6 +1,6 @@
 export { default as Box } from './components/box';
 export { default as Inline } from './components/inline';
-export { xcss } from './xcss/xcss';
+export { xcss, tokensMap } from './xcss/xcss';
 export { default as Stack } from './components/stack';
 export { default as Flex } from './components/flex';
 export { default as Grid } from './components/grid';

package/dist/es2019/xcss/style-maps.partial.js

@@ -484,7 +484,7 @@ export const borderRadiusMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::badcf0eda5c0c2a7dca4428cc42a5db9>>
+ * @codegen <<SignedSource::402816562c359603300fda81596a2978>>
  * @codegenId typography
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight", "body", "ui"]
@@ -502,10 +502,10 @@ export const fontSizeMap = {
   'font.size.600': "var(--ds-font-size-600, 35px)"
 };
 export const fontWeightMap = {
-  'font.weight.bold': "var(--ds-font-weight-bold, 700)",
-  'font.weight.medium': "var(--ds-font-weight-medium, 500)",
-  'font.weight.regular': "var(--ds-font-weight-regular, 400)",
-  'font.weight.semibold': "var(--ds-font-weight-semibold, 600)"
+  bold: "var(--ds-font-weight-bold, 700)",
+  medium: "var(--ds-font-weight-medium, 500)",
+  regular: "var(--ds-font-weight-regular, 400)",
+  semibold: "var(--ds-font-weight-semibold, 600)"
 };
 export const fontFamilyMap = {
   'font.family.body': "var(--ds-font-family-body, ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
@@ -530,7 +530,7 @@ export const bodyTextMap = {
   'body.small': "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
 };
 export const uiTextMap = {
-  ui: "var(--ds-font-ui, normal 400 14px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
+  ui: "var(--ds-font-ui, normal 500 14px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
   'ui.small': "var(--ds-font-ui-small, normal 400 11px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
 };
 

package/dist/es2019/xcss/xcss.js

@@ -4,7 +4,7 @@ import { css as cssEmotion } from '@emotion/react';
 // eslint-disable-next-line import/no-extraneous-dependencies
 
 import { allSpaceMap, backgroundColorMap, borderColorMap, borderRadiusMap, borderWidthMap, dimensionMap, layerMap, opacityMap, positiveSpaceMap, shadowMap, textColorMap } from './style-maps.partial';
-const tokensMap = {
+export const tokensMap = {
   backgroundColor: backgroundColorMap,
   blockSize: dimensionMap,
   borderBlockColor: borderColorMap,

package/dist/esm/components/text.js

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { createContext, Fragment, useContext } from 'react';
 import { css, jsx } from '@emotion/react';
 import invariant from 'tiny-invariant';
-import { bodyTextStylesMap, inverseColorMap, textColorStylesMap, uiTextStylesMap } from '../xcss/style-maps.partial';
+import { bodyTextStylesMap, fontWeightStylesMap, inverseColorMap, textColorStylesMap, uiTextStylesMap } from '../xcss/style-maps.partial';
 import { useSurface } from './internal/surface-provider';
 var asAllowlist = ['span', 'p', 'strong', 'em'];
 // We're doing this because our CSS reset can add top margins to elements such as `p` which is totally insane.
@@ -34,11 +34,16 @@ var textAlignMap = {
     textAlign: 'start'
   })
 };
-var truncateStyles = css({
+var truncationStyles = css({
+  display: '-webkit-box',
   overflow: 'hidden',
-  textOverflow: 'ellipsis',
-  whiteSpace: 'nowrap'
+  WebkitBoxOrient: 'vertical'
 });
+var wordBreakMap = {
+  breakAll: css({
+    wordBreak: 'break-all'
+  })
+};
 
 /**
  * Custom hook designed to abstract the parsing of the color props and make it clearer in the future how color is reconciled between themes and tokens.
@@ -72,29 +77,25 @@ var Text = function Text(_ref) {
   var children = _ref.children,
     props = _objectWithoutProperties(_ref, _excluded);
   var asElement = props.as,
-    colorProp = props.color,
+    _props$color = props.color,
+    colorProp = _props$color === void 0 ? 'color.text' : _props$color,
     textAlign = props.textAlign,
     testId = props.testId,
     id = props.id,
     _props$variant = props.variant,
-    variant = _props$variant === void 0 ? 'body' : _props$variant;
-  var Component = asElement;
-  if (!Component) {
-    if (variant.includes('body')) {
-      Component = 'p';
-    } else {
-      // ui text and default => span
-      Component = 'span';
-    }
-  }
+    variant = _props$variant === void 0 ? 'body' : _props$variant,
+    weight = props.weight;
 
-  // Remove the ability to bypass typescript errors for shouldTruncate
-  var shouldTruncate = false;
-  if ('shouldTruncate' in props && variant.includes('body')) {
-    var _props$shouldTruncate;
-    shouldTruncate = (_props$shouldTruncate = props.shouldTruncate) !== null && _props$shouldTruncate !== void 0 ? _props$shouldTruncate : false;
-  }
+  // body variants -> p
+  // ui variants -> span
+  var Component = asElement || (variant.includes('body') ? 'p' : 'span');
   invariant(asAllowlist.includes(Component), "@atlaskit/primitives: Text received an invalid \"as\" value of \"".concat(Component, "\""));
+
+  // Remove the ability to bypass typescript errors for maxLines
+  var maxLines;
+  if ('maxLines' in props && variant.includes('body')) {
+    maxLines = props.maxLines;
+  }
   var color = useColor(colorProp);
   var isWrapped = useHasTextAncestor();
 
@@ -106,7 +107,10 @@ var Text = function Text(_ref) {
     return jsx(Fragment, null, children);
   }
   var component = jsx(Component, {
-    css: [resetStyles, variant && variantStyles[variant], color && textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    css: [resetStyles, variant && variantStyles[variant], color && textColorStylesMap[color], maxLines && truncationStyles, maxLines === 1 && wordBreakMap.breakAll, textAlign && textAlignMap[textAlign], weight && fontWeightStylesMap[weight], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    style: {
+      WebkitLineClamp: maxLines
+    },
     "data-testid": testId,
     id: id
   }, children);

package/dist/esm/index.js

@@ -1,6 +1,6 @@
 export { default as Box } from './components/box';
 export { default as Inline } from './components/inline';
-export { xcss } from './xcss/xcss';
+export { xcss, tokensMap } from './xcss/xcss';
 export { default as Stack } from './components/stack';
 export { default as Flex } from './components/flex';
 export { default as Grid } from './components/grid';

package/dist/esm/xcss/style-maps.partial.js

@@ -484,7 +484,7 @@ export var borderRadiusMap = {
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::badcf0eda5c0c2a7dca4428cc42a5db9>>
+ * @codegen <<SignedSource::402816562c359603300fda81596a2978>>
  * @codegenId typography
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight", "body", "ui"]
@@ -502,10 +502,10 @@ export var fontSizeMap = {
   'font.size.600': "var(--ds-font-size-600, 35px)"
 };
 export var fontWeightMap = {
-  'font.weight.bold': "var(--ds-font-weight-bold, 700)",
-  'font.weight.medium': "var(--ds-font-weight-medium, 500)",
-  'font.weight.regular': "var(--ds-font-weight-regular, 400)",
-  'font.weight.semibold': "var(--ds-font-weight-semibold, 600)"
+  bold: "var(--ds-font-weight-bold, 700)",
+  medium: "var(--ds-font-weight-medium, 500)",
+  regular: "var(--ds-font-weight-regular, 400)",
+  semibold: "var(--ds-font-weight-semibold, 600)"
 };
 export var fontFamilyMap = {
   'font.family.body': "var(--ds-font-family-body, ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
@@ -530,7 +530,7 @@ export var bodyTextMap = {
   'body.small': "var(--ds-font-body-small, normal 400 11px/16px ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
 };
 export var uiTextMap = {
-  ui: "var(--ds-font-ui, normal 400 14px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
+  ui: "var(--ds-font-ui, normal 500 14px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)",
   'ui.small': "var(--ds-font-ui-small, normal 400 11px/1 ui-sans-serif, \"Segoe UI\", Ubuntu, system-ui, \"Helvetica Neue\", sans-serif)"
 };
 

package/dist/esm/xcss/xcss.js

@@ -7,7 +7,7 @@ import { css as cssEmotion } from '@emotion/react';
 // eslint-disable-next-line import/no-extraneous-dependencies
 
 import { allSpaceMap, backgroundColorMap, borderColorMap, borderRadiusMap, borderWidthMap, dimensionMap, layerMap, opacityMap, positiveSpaceMap, shadowMap, textColorMap } from './style-maps.partial';
-var tokensMap = {
+export var tokensMap = {
   backgroundColor: backgroundColorMap,
   blockSize: dimensionMap,
   borderBlockColor: borderColorMap,

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

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { FC, ReactNode } from 'react';
-import { BodyText, TextColor, UiText } from '../xcss/style-maps.partial';
+import { BodyText, FontWeight, TextColor, UiText } from '../xcss/style-maps.partial';
 import type { BasePrimitiveProps } from './types';
 declare const asAllowlist: readonly ["span", "p", "strong", "em"];
 type AsElement = (typeof asAllowlist)[number];
@@ -10,18 +10,20 @@ type TextPropsBody = {
      */
     variant?: BodyText;
     /**
-     * Truncates text with an ellipsis when text overflows its parent container
-     * (i.e. `width` has been set on parent that is shorter than text length).
+     * The number of lines to limit the provided text to. Text will be truncated with an ellipsis.
+     *
+     * When `maxLines={1}`, `wordBreak` defaults to `break-all` to match the behaviour of `text-overflow: ellipsis`.
      *
      * Only available for `body` text variants.
      */
-    shouldTruncate?: boolean;
+    maxLines?: number;
 };
 type TextPropsUi = {
     /**
      * Text variant
      */
     variant: UiText;
+    maxLines?: never;
 };
 type TextPropsBase = {
     /**
@@ -46,6 +48,10 @@ type TextPropsBase = {
      * Text align https://developer.mozilla.org/en-US/docs/Web/CSS/text-align
      */
     textAlign?: TextAlign;
+    /**
+     * Font weight https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight
+     */
+    weight?: FontWeight;
 };
 export type TextProps = TextPropsBase & Omit<BasePrimitiveProps, 'xcss'> & (TextPropsBody | TextPropsUi);
 type TextAlign = keyof typeof textAlignMap;

package/dist/types/index.d.ts

@@ -3,7 +3,7 @@ export { default as Box } from './components/box';
 export type { BoxProps } from './components/box';
 export { default as Inline } from './components/inline';
 export type { InlineProps } from './components/inline';
-export { xcss } from './xcss/xcss';
+export { xcss, tokensMap } from './xcss/xcss';
 export type { XCSS } from './xcss/xcss';
 export { default as Stack } from './components/stack';
 export type { StackProps } from './components/stack';
@@ -16,4 +16,4 @@ export type { BleedProps } from './components/bleed';
 export { default as Text } from './components/text';
 export type { TextProps } from './components/text';
 export { media, UNSAFE_media, UNSAFE_BREAKPOINTS_CONFIG } from './responsive';
-export type { Breakpoint } from './responsive';
+export type { Breakpoint, MediaQuery } from './responsive';

package/dist/types/responsive/index.d.ts

@@ -1,7 +1,7 @@
 export { media, UNSAFE_media } from './media-helper';
 export { UNSAFE_buildAboveMediaQueryCSS } from './build-media-query-css';
 export { UNSAFE_BREAKPOINTS_ORDERED_LIST, UNSAFE_BREAKPOINTS_CONFIG, } from './constants';
-export type { Breakpoint, ResponsiveObject, ResponsiveCSSObject, } from './types';
+export type { Breakpoint, ResponsiveObject, ResponsiveCSSObject, MediaQuery, } from './types';
 export { UNSAFE_useMediaQuery } from './use-media-query';
 export { Show } from './show';
 export { Hide } from './hide';

package/dist/types/xcss/style-maps.partial.d.ts

@@ -515,7 +515,7 @@ export type BorderRadius = keyof typeof borderRadiusMap;
  */
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::badcf0eda5c0c2a7dca4428cc42a5db9>>
+ * @codegen <<SignedSource::402816562c359603300fda81596a2978>>
  * @codegenId typography
  * @codegenCommand yarn workspace @atlaskit/primitives codegen-styles
  * @codegenParams ["fontSize", "fontWeight", "fontFamily", "lineHeight", "body", "ui"]
@@ -534,10 +534,10 @@ export declare const fontSizeMap: {
 };
 export type FontSize = keyof typeof fontSizeMap;
 export declare const fontWeightMap: {
-    'font.weight.bold': "var(--ds-font-weight-bold)";
-    'font.weight.medium': "var(--ds-font-weight-medium)";
-    'font.weight.regular': "var(--ds-font-weight-regular)";
-    'font.weight.semibold': "var(--ds-font-weight-semibold)";
+    bold: "var(--ds-font-weight-bold)";
+    medium: "var(--ds-font-weight-medium)";
+    regular: "var(--ds-font-weight-regular)";
+    semibold: "var(--ds-font-weight-semibold)";
 };
 export type FontWeight = keyof typeof fontWeightMap;
 export declare const fontFamilyMap: {