@atlaskit/primitives 5.1.1 → 5.1.2

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/primitives
 
+## 5.1.2
+
+### Patch Changes
+
+- [#80174](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/80174) [`2a4fd6ccba31`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2a4fd6ccba31) - Add forwardRef to text component
+
 ## 5.1.1
 
 ### Patch Changes

package/dist/cjs/components/anchor.js

@@ -76,7 +76,7 @@ var Anchor = function Anchor(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "5.1.1",
+    packageVersion: "5.1.2",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/cjs/components/pressable.js

@@ -80,7 +80,7 @@ var UNSAFE_PRESSABLE = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref)
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "5.1.1",
+    packageVersion: "5.1.2",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/cjs/components/text.js

@@ -5,14 +5,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
 var _styleMaps = require("../xcss/style-maps.partial");
 var _surfaceProvider = require("./internal/surface-provider");
-var _excluded = ["children"];
 /** @jsx jsx */
+
 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.
 // Long term we should remove those instances from the reset - it should be a reset to 0.
@@ -83,23 +82,23 @@ var useColor = function useColor(colorProp, hasTextAncestor) {
  *
  * @internal
  */
-var Text = function Text(_ref) {
-  var children = _ref.children,
-    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'span' : _props$as,
-    colorProp = props.color,
-    textAlign = props.textAlign,
-    testId = props.testId,
-    id = props.id,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'medium' : _props$size,
-    weight = props.weight,
-    maxLines = props.maxLines;
+var Text = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var _ref$as = _ref.as,
+    Component = _ref$as === void 0 ? 'span' : _ref$as,
+    colorProp = _ref.color,
+    textAlign = _ref.textAlign,
+    testId = _ref.testId,
+    id = _ref.id,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'medium' : _ref$size,
+    weight = _ref.weight,
+    maxLines = _ref.maxLines,
+    children = _ref.children;
   (0, _tinyInvariant.default)(asAllowlist.includes(Component), "@atlaskit/primitives: Text received an invalid \"as\" value of \"".concat(Component, "\""));
   var hasTextAncestor = useHasTextAncestor();
   var color = useColor(colorProp, hasTextAncestor);
   var component = (0, _react2.jsx)(Component, {
+    ref: ref,
     css: [resetStyles, _styleMaps.fontStylesMap[size], color && _styleMaps.textColorStylesMap[color], maxLines && truncationStyles, maxLines === 1 && wordBreakMap.breakAll, textAlign && textAlignMap[textAlign], weight && _styleMaps.fontWeightStylesMap[weight], Component === 'em' && emStyles, Component === 'strong' && strongStyles],
     style: {
       WebkitLineClamp: maxLines
@@ -112,5 +111,5 @@ var Text = function Text(_ref) {
   component : (0, _react2.jsx)(HasTextAncestorContext.Provider, {
     value: true
   }, component);
-};
+});
 var _default = exports.default = Text;

package/dist/es2019/components/anchor.js

@@ -62,7 +62,7 @@ const Anchor = ({
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "5.1.1",
+    packageVersion: "5.1.2",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/es2019/components/pressable.js

@@ -66,7 +66,7 @@ const UNSAFE_PRESSABLE = /*#__PURE__*/forwardRef(({
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "5.1.1",
+    packageVersion: "5.1.2",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/es2019/components/text.js

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { createContext, useContext } from 'react';
+import { createContext, forwardRef, useContext } from 'react';
 import { css, jsx } from '@emotion/react';
 import invariant from 'tiny-invariant';
 import { fontStylesMap, fontWeightStylesMap, inverseColorMap, textColorStylesMap } from '../xcss/style-maps.partial';
@@ -72,24 +72,22 @@ const useColor = (colorProp, hasTextAncestor) => {
  *
  * @internal
  */
-const Text = ({
-  children,
-  ...props
-}) => {
-  const {
-    as: Component = 'span',
-    color: colorProp,
-    textAlign,
-    testId,
-    id,
-    size = 'medium',
-    weight,
-    maxLines
-  } = props;
+const Text = /*#__PURE__*/forwardRef(({
+  as: Component = 'span',
+  color: colorProp,
+  textAlign,
+  testId,
+  id,
+  size = 'medium',
+  weight,
+  maxLines,
+  children
+}, ref) => {
   invariant(asAllowlist.includes(Component), `@atlaskit/primitives: Text received an invalid "as" value of "${Component}"`);
   const hasTextAncestor = useHasTextAncestor();
   const color = useColor(colorProp, hasTextAncestor);
   const component = jsx(Component, {
+    ref: ref,
     css: [resetStyles, fontStylesMap[size], color && textColorStylesMap[color], maxLines && truncationStyles, maxLines === 1 && wordBreakMap.breakAll, textAlign && textAlignMap[textAlign], weight && fontWeightStylesMap[weight], Component === 'em' && emStyles, Component === 'strong' && strongStyles],
     style: {
       WebkitLineClamp: maxLines
@@ -102,5 +100,5 @@ const Text = ({
   component : jsx(HasTextAncestorContext.Provider, {
     value: true
   }, component);
-};
+});
 export default Text;

package/dist/esm/components/anchor.js

@@ -66,7 +66,7 @@ var Anchor = function Anchor(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "5.1.1",
+    packageVersion: "5.1.2",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/esm/components/pressable.js

@@ -70,7 +70,7 @@ var UNSAFE_PRESSABLE = /*#__PURE__*/forwardRef(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "5.1.1",
+    packageVersion: "5.1.2",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/esm/components/text.js

@@ -1,7 +1,5 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children"];
 /** @jsx jsx */
-import { createContext, useContext } from 'react';
+import { createContext, forwardRef, useContext } from 'react';
 import { css, jsx } from '@emotion/react';
 import invariant from 'tiny-invariant';
 import { fontStylesMap, fontWeightStylesMap, inverseColorMap, textColorStylesMap } from '../xcss/style-maps.partial';
@@ -76,23 +74,23 @@ var useColor = function useColor(colorProp, hasTextAncestor) {
  *
  * @internal
  */
-var Text = function Text(_ref) {
-  var children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var _props$as = props.as,
-    Component = _props$as === void 0 ? 'span' : _props$as,
-    colorProp = props.color,
-    textAlign = props.textAlign,
-    testId = props.testId,
-    id = props.id,
-    _props$size = props.size,
-    size = _props$size === void 0 ? 'medium' : _props$size,
-    weight = props.weight,
-    maxLines = props.maxLines;
+var Text = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _ref$as = _ref.as,
+    Component = _ref$as === void 0 ? 'span' : _ref$as,
+    colorProp = _ref.color,
+    textAlign = _ref.textAlign,
+    testId = _ref.testId,
+    id = _ref.id,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'medium' : _ref$size,
+    weight = _ref.weight,
+    maxLines = _ref.maxLines,
+    children = _ref.children;
   invariant(asAllowlist.includes(Component), "@atlaskit/primitives: Text received an invalid \"as\" value of \"".concat(Component, "\""));
   var hasTextAncestor = useHasTextAncestor();
   var color = useColor(colorProp, hasTextAncestor);
   var component = jsx(Component, {
+    ref: ref,
     css: [resetStyles, fontStylesMap[size], color && textColorStylesMap[color], maxLines && truncationStyles, maxLines === 1 && wordBreakMap.breakAll, textAlign && textAlignMap[textAlign], weight && fontWeightStylesMap[weight], Component === 'em' && emStyles, Component === 'strong' && strongStyles],
     style: {
       WebkitLineClamp: maxLines
@@ -105,5 +103,5 @@ var Text = function Text(_ref) {
   component : jsx(HasTextAncestorContext.Provider, {
     value: true
   }, component);
-};
+});
 export default Text;

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

@@ -1,10 +1,10 @@
 /** @jsx jsx */
-import { FC, ReactNode } from 'react';
+import { ComponentPropsWithRef, ElementType, ReactNode } from 'react';
 import { FontSize, FontWeight, TextColor } from '../xcss/style-maps.partial';
 import type { BasePrimitiveProps } from './types';
 declare const asAllowlist: readonly ["span", "p", "strong", "em"];
 type AsElement = (typeof asAllowlist)[number];
-type TextPropsBase = {
+type TextPropsBase<T extends ElementType = 'span'> = {
     /**
      * HTML tag to be rendered. Defaults to `span`.
      */
@@ -41,8 +41,12 @@ type TextPropsBase = {
      * The [HTML `font-weight` attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight).
      */
     weight?: FontWeight;
+    /**
+     * Forwarded ref.
+     */
+    ref?: ComponentPropsWithRef<T>['ref'];
 };
-export type TextProps = TextPropsBase & Omit<BasePrimitiveProps, 'xcss'>;
+export type TextProps<T extends ElementType = 'span'> = TextPropsBase<T> & Omit<BasePrimitiveProps, 'xcss'>;
 type TextAlign = keyof typeof textAlignMap;
 declare const textAlignMap: {
     center: import("@emotion/react").SerializedStyles;
@@ -58,5 +62,5 @@ declare const textAlignMap: {
  *
  * @internal
  */
-declare const Text: FC<TextProps>;
+declare const Text: import("react").ForwardRefExoticComponent<Pick<TextPropsBase<ElementType> & Omit<BasePrimitiveProps, "xcss">, "color" | "maxLines" | "textAlign" | "size" | "weight" | "children" | "as" | "id" | "role" | "testId" | "data-testid"> & import("react").RefAttributes<any>>;
 export default Text;

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

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import { FC, ReactNode } from 'react';
+import { ComponentPropsWithRef, ElementType, ReactNode } from 'react';
 import { FontSize, FontWeight, TextColor } from '../xcss/style-maps.partial';
 import type { BasePrimitiveProps } from './types';
 declare const asAllowlist: readonly [
@@ -9,7 +9,7 @@ declare const asAllowlist: readonly [
     "em"
 ];
 type AsElement = (typeof asAllowlist)[number];
-type TextPropsBase = {
+type TextPropsBase<T extends ElementType = 'span'> = {
     /**
      * HTML tag to be rendered. Defaults to `span`.
      */
@@ -46,8 +46,12 @@ type TextPropsBase = {
      * The [HTML `font-weight` attribute](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight).
      */
     weight?: FontWeight;
+    /**
+     * Forwarded ref.
+     */
+    ref?: ComponentPropsWithRef<T>['ref'];
 };
-export type TextProps = TextPropsBase & Omit<BasePrimitiveProps, 'xcss'>;
+export type TextProps<T extends ElementType = 'span'> = TextPropsBase<T> & Omit<BasePrimitiveProps, 'xcss'>;
 type TextAlign = keyof typeof textAlignMap;
 declare const textAlignMap: {
     center: import("@emotion/react").SerializedStyles;
@@ -63,5 +67,5 @@ declare const textAlignMap: {
  *
  * @internal
  */
-declare const Text: FC<TextProps>;
+declare const Text: import("react").ForwardRefExoticComponent<Pick<TextPropsBase<ElementType> & Omit<BasePrimitiveProps, "xcss">, "color" | "maxLines" | "textAlign" | "size" | "weight" | "children" | "as" | "id" | "role" | "testId" | "data-testid"> & import("react").RefAttributes<any>>;
 export default Text;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/primitives",
-  "version": "5.1.1",
+  "version": "5.1.2",
   "description": "Primitives are token-backed low-level building blocks.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"