@atlaskit/primitives 1.9.0 → 1.10.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/primitives
 
+## 1.10.0
+
+### Minor Changes
+
+- [#42931](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/42931) [`5778f757885`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5778f757885) - Added export for Text component. This component is currently in closed beta and is not intended for general use at this stage.
+
 ## 1.9.0
 
 ### Minor Changes

package/dist/cjs/index.js

@@ -40,6 +40,12 @@ Object.defineProperty(exports, "Stack", {
     return _stack.default;
   }
 });
+Object.defineProperty(exports, "Text", {
+  enumerable: true,
+  get: function get() {
+    return _text.default;
+  }
+});
 Object.defineProperty(exports, "UNSAFE_BREAKPOINTS_CONFIG", {
   enumerable: true,
   get: function get() {
@@ -71,4 +77,5 @@ var _stack = _interopRequireDefault(require("./components/stack"));
 var _flex = _interopRequireDefault(require("./components/flex"));
 var _grid = _interopRequireDefault(require("./components/grid"));
 var _bleed = _interopRequireDefault(require("./components/bleed"));
+var _text = _interopRequireDefault(require("./components/text"));
 var _responsive = require("./responsive");

package/dist/es2019/index.js

@@ -5,4 +5,5 @@ export { default as Stack } from './components/stack';
 export { default as Flex } from './components/flex';
 export { default as Grid } from './components/grid';
 export { default as Bleed } from './components/bleed';
+export { default as Text } from './components/text';
 export { media, UNSAFE_media, UNSAFE_BREAKPOINTS_CONFIG } from './responsive';

package/dist/esm/index.js

@@ -5,4 +5,5 @@ export { default as Stack } from './components/stack';
 export { default as Flex } from './components/flex';
 export { default as Grid } from './components/grid';
 export { default as Bleed } from './components/bleed';
+export { default as Text } from './components/text';
 export { media, UNSAFE_media, UNSAFE_BREAKPOINTS_CONFIG } from './responsive';

package/dist/types/index.d.ts

@@ -12,5 +12,7 @@ export { default as Grid } from './components/grid';
 export type { GridProps } from './components/grid';
 export { default as Bleed } from './components/bleed';
 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';

package/dist/types-ts4.5/index.d.ts

@@ -12,5 +12,7 @@ export { default as Grid } from './components/grid';
 export type { GridProps } from './components/grid';
 export { default as Bleed } from './components/bleed';
 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';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/primitives",
-  "version": "1.9.0",
+  "version": "1.10.0",
   "description": "Primitives are token-backed low-level building blocks.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -191,6 +191,7 @@
     "./box": "./src/components/box.tsx",
     "./stack": "./src/components/stack.tsx",
     "./inline": "./src/components/inline.tsx",
+    "./text": "./src/components/text.tsx",
     "./pressable": "./src/components/pressable.tsx",
     "./link": "./src/components/link.tsx",
     "./responsive": "./src/responsive/index.tsx"

package/report.api.md

@@ -21,6 +21,7 @@ import type * as CSS_2 from 'csstype';
 import type { CSSProperties } from 'react';
 import type { CSSPropertiesWithMultiValues } from '@emotion/serialize';
 import { ElementType } from 'react';
+import { FC } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { jsx } from '@emotion/react';
 import { MemoExoticComponent } from 'react';
@@ -84,6 +85,12 @@ type AllMedia =
 // @public (undocumented)
 type AllowedElements = Exclude<keyof JSX.IntrinsicElements, SVGElements>;
 
+// @public (undocumented)
+const asAllowlist: readonly ['span', 'p', 'strong', 'em'];
+
+// @public (undocumented)
+type AsElement = (typeof asAllowlist)[number];
+
 // @public (undocumented)
 type AtRulesWithoutMedia = Exclude<CSS_2.AtRules, '@media'>;
 
@@ -337,6 +344,16 @@ export type BleedProps = {
   block?: Space_2;
 } & BasePrimitiveProps;
 
+// @public (undocumented)
+type BodyText = keyof typeof bodyTextMap;
+
+// @public (undocumented)
+const bodyTextMap: {
+  body: 'var(--ds-font-body)';
+  'body.large': 'var(--ds-font-body-large)';
+  'body.small': 'var(--ds-font-body-small)';
+};
+
 // @public (undocumented)
 export type BorderColor = keyof typeof borderColorMap;
 
@@ -1040,6 +1057,20 @@ type SVGElements =
   | 'use'
   | 'view';
 
+// @internal
+const Text_2: FC<TextProps>;
+export { Text_2 as Text };
+
+// @public (undocumented)
+type TextAlign = keyof typeof textAlignMap;
+
+// @public (undocumented)
+const textAlignMap: {
+  center: SerializedStyles_2;
+  end: SerializedStyles_2;
+  start: SerializedStyles_2;
+};
+
 // @public (undocumented)
 export type TextColor = keyof typeof textColorMap;
 
@@ -1083,6 +1114,17 @@ const textColorMap: {
   readonly 'color.link.visited': 'var(--ds-link-visited)';
 };
 
+// @public (undocumented)
+export interface TextProps extends BasePrimitiveProps {
+  as?: AsElement;
+  children: ReactNode;
+  color?: TextColor;
+  id?: string;
+  shouldTruncate?: boolean;
+  textAlign?: TextAlign;
+  variant?: Variant;
+}
+
 // @public (undocumented)
 type TokenisedProps = {
   backgroundColor?: BackgroundColor;
@@ -1145,6 +1187,15 @@ type TokenisedProps = {
   zIndex?: Layer;
 };
 
+// @public (undocumented)
+type UiText = keyof typeof uiTextMap;
+
+// @public (undocumented)
+const uiTextMap: {
+  ui: 'var(--ds-font-ui)';
+  'ui.small': 'var(--ds-font-ui-small)';
+};
+
 // @public (undocumented)
 const uniqueSymbol: unique symbol;
 
@@ -1215,6 +1266,9 @@ export const UNSAFE_media: {
   };
 };
 
+// @public (undocumented)
+type Variant = BodyText | UiText;
+
 // @public (undocumented)
 type Wrap = keyof typeof flexWrapMap;
 

package/text/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "@atlaskit/primitives/text",
+  "main": "../dist/cjs/components/text.js",
+  "module": "../dist/esm/components/text.js",
+  "module:es2019": "../dist/es2019/components/text.js",
+  "sideEffects": false,
+  "types": "../dist/types/components/text.d.ts",
+  "typesVersions": {
+    ">=4.5 <4.9": {
+      "*": [
+        "../dist/types-ts4.5/components/text.d.ts"
+      ]
+    }
+  }
+}

package/tmp/api-report-tmp.d.ts

@@ -10,6 +10,7 @@ import type * as CSS_2 from 'csstype';
 import type { CSSProperties } from 'react';
 import type { CSSPropertiesWithMultiValues } from '@emotion/serialize';
 import { ElementType } from 'react';
+import { FC } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { jsx } from '@emotion/react';
 import { MemoExoticComponent } from 'react';
@@ -68,6 +69,12 @@ type AllMedia = '@media (prefers-color-scheme: dark)' | '@media (prefers-color-s
 // @public (undocumented)
 type AllowedElements = Exclude<keyof JSX.IntrinsicElements, SVGElements>;
 
+// @public (undocumented)
+const asAllowlist: readonly ["span", "p", "strong", "em"];
+
+// @public (undocumented)
+type AsElement = (typeof asAllowlist)[number];
+
 // @public (undocumented)
 type AtRulesWithoutMedia = Exclude<CSS_2.AtRules, '@media'>;
 
@@ -312,6 +319,16 @@ export type BleedProps = {
     block?: Space_2;
 } & BasePrimitiveProps;
 
+// @public (undocumented)
+type BodyText = keyof typeof bodyTextMap;
+
+// @public (undocumented)
+const bodyTextMap: {
+    body: "var(--ds-font-body)";
+    'body.large': "var(--ds-font-body-large)";
+    'body.small': "var(--ds-font-body-small)";
+};
+
 // @public (undocumented)
 export type BorderColor = keyof typeof borderColorMap;
 
@@ -694,6 +711,20 @@ type StyleProp = {
 // @public (undocumented)
 type SVGElements = 'animate' | 'animateMotion' | 'animateTransform' | 'circle' | 'clipPath' | 'defs' | 'desc' | 'ellipse' | 'feBlend' | 'feColorMatrix' | 'feComponentTransfer' | 'feComposite' | 'feConvolveMatrix' | 'feDiffuseLighting' | 'feDisplacementMap' | 'feDistantLight' | 'feDropShadow' | 'feFlood' | 'feFuncA' | 'feFuncB' | 'feFuncG' | 'feFuncR' | 'feGaussianBlur' | 'feImage' | 'feMerge' | 'feMergeNode' | 'feMorphology' | 'feOffset' | 'fePointLight' | 'feSpecularLighting' | 'feSpotLight' | 'feTile' | 'feTurbulence' | 'filter' | 'foreignObject' | 'g' | 'image' | 'line' | 'linearGradient' | 'marker' | 'mask' | 'metadata' | 'mpath' | 'path' | 'pattern' | 'polygon' | 'polyline' | 'radialGradient' | 'rect' | 'stop' | 'svg' | 'switch' | 'symbol' | 'text' | 'textPath' | 'tspan' | 'use' | 'view';
 
+// @internal
+const Text_2: FC<TextProps>;
+export { Text_2 as Text }
+
+// @public (undocumented)
+type TextAlign = keyof typeof textAlignMap;
+
+// @public (undocumented)
+const textAlignMap: {
+    center: SerializedStyles_2;
+    end: SerializedStyles_2;
+    start: SerializedStyles_2;
+};
+
 // @public (undocumented)
 export type TextColor = keyof typeof textColorMap;
 
@@ -737,6 +768,17 @@ const textColorMap: {
     readonly 'color.link.visited': "var(--ds-link-visited)";
 };
 
+// @public (undocumented)
+export interface TextProps extends BasePrimitiveProps {
+    as?: AsElement;
+    children: ReactNode;
+    color?: TextColor;
+    id?: string;
+    shouldTruncate?: boolean;
+    textAlign?: TextAlign;
+    variant?: Variant;
+}
+
 // @public (undocumented)
 type TokenisedProps = {
     backgroundColor?: BackgroundColor;
@@ -799,6 +841,15 @@ type TokenisedProps = {
     zIndex?: Layer;
 };
 
+// @public (undocumented)
+type UiText = keyof typeof uiTextMap;
+
+// @public (undocumented)
+const uiTextMap: {
+    ui: "var(--ds-font-ui)";
+    'ui.small': "var(--ds-font-ui-small)";
+};
+
 // @public (undocumented)
 const uniqueSymbol: unique symbol;
 
@@ -869,6 +920,9 @@ export const UNSAFE_media: {
     };
 };
 
+// @public (undocumented)
+type Variant = BodyText | UiText;
+
 // @public (undocumented)
 type Wrap = keyof typeof flexWrapMap;