@contentful/f36-typography 4.19.0 → 4.20.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # Change Log
 
+## 4.20.0
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @contentful/f36-core@4.20.0
+
+## 4.19.2
+
+### Patch Changes
+
+- [#2218](https://github.com/contentful/forma-36/pull/2218) [`9647d295`](https://github.com/contentful/forma-36/commit/9647d295763c6518fe6d381d79a53524ac104d92) Thanks [@denkristoffer](https://github.com/denkristoffer)! - - fix(text): truncated styles
+  - fix(datepicker): update react-day-picker
+- Updated dependencies []:
+  - @contentful/f36-core@4.19.2
+
+## 4.19.1
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @contentful/f36-core@4.19.1
+
 ## 4.19.0
 
 ### Patch Changes

package/dist/esm/index.js

@@ -0,0 +1,9 @@
+import H, { useEffect } from 'react';
+import f from '@contentful/f36-tokens';
+import { cx, css } from 'emotion';
+import { Box } from '@contentful/f36-core';
+
+var O=Object.defineProperty,Y=Object.defineProperties;var v=Object.getOwnPropertyDescriptors;var T=Object.getOwnPropertySymbols;var h=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var x=(e,o,t)=>o in e?O(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,p=(e,o)=>{for(var t in o||(o={}))h.call(o,t)&&x(e,t,o[t]);if(T)for(var t of T(o))E.call(o,t)&&x(e,t,o[t]);return e},a=(e,o)=>Y(e,v(o));var i=(e,o)=>{var t={};for(var r in e)h.call(e,r)&&o.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&T)for(var r of T(e))o.indexOf(r)<0&&E.call(e,r)&&(t[r]=e[r]);return t};var J="span";function K(){return css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"100%"})}function Q(){return css({wordBreak:"break-word"})}function S(pe,X){var P=pe,{fontSize:e="fontSizeM",fontStack:o="fontStackPrimary",fontWeight:t="fontWeightNormal",fontColor:r="gray800",lineHeight:m="lineHeightM",children:n,isTruncated:l,isWordBreak:g,as:d,className:W,margin:M="none"}=P,z=i(P,["fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin"]);let w=d||J;return H.createElement(Box,a(p({},z),{as:w,className:cx(css({padding:0,fontFamily:f[o],fontWeight:f[t],color:f[r],fontSize:f[e],lineHeight:f[m]}),l?K():null,g?Q():null,W),margin:M,ref:X}),n)}S.displayName="Text";var s=H.forwardRef(S);var V="h1";function A(m,r){var n=m,{children:e,testId:o="cf-ui-heading"}=n,t=i(n,["children","testId"]);return H.createElement(s,a(p({as:V,testId:o,marginBottom:"spacingM",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeXl",lineHeight:"lineHeightXl"},t),{ref:r}),e)}A.displayName="Heading";var D=H.forwardRef(A);var Z="h3";function I(m,r){var n=m,{children:e,testId:o="cf-ui-subheading"}=n,t=i(n,["children","testId"]);return H.createElement(s,a(p({as:Z,testId:o,marginBottom:"spacingM",fontSize:"fontSizeL",lineHeight:"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:"gray900"},t),{ref:r}),e)}I.displayName="Subheading";var L=H.forwardRef(I);var C=e=>(useEffect(()=>{console.warn("Forma 36: Typography component is deprecated. You can safely remove it from your components.");},[]),H.createElement(H.Fragment,null,e.children));C.displayName="Typography";var ee="h2";function F(n,m){var l=n,{children:e,size:o="default",testId:t="cf-ui-display-text"}=l,r=i(l,["children","size","testId"]);let g="fontSize2Xl",d="lineHeight2Xl";return o==="large"&&(g="fontSize3Xl",d="lineHeight3Xl"),H.createElement(s,a(p({as:ee,testId:t,marginBottom:o==="default"?"spacingL":"spacingXl",fontSize:g,lineHeight:d,fontColor:"gray900",fontWeight:"fontWeightDemiBold"},r),{ref:m}),e)}F.displayName="DisplayText";var N=H.forwardRef(F);var ne="h2";function b(n,m){var l=n,{children:e,className:o,testId:t="cf-ui-section-heading"}=l,r=i(l,["children","className","testId"]);return H.createElement(s,a(p({as:ne,testId:t,marginBottom:"spacingL",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeS",lineHeight:"lineHeightS",className:cx(css({letterSpacing:f.letterSpacingWide,textTransform:"uppercase"}),o)},r),{ref:m}),e)}b.displayName="SectionHeading";var U=H.forwardRef(b);var y=H.forwardRef((m,r)=>{var n=m,{children:e,testId:o="cf-ui-paragraph"}=n,t=i(n,["children","testId"]);return H.createElement(s,a(p({as:"p",testId:o,marginBottom:"spacingM",lineHeight:"lineHeightM"},t),{ref:r}),e)});y.displayName="Paragraph";
+
+export { N as DisplayText, D as Heading, y as Paragraph, U as SectionHeading, L as Subheading, s as Text, C as Typography };
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Heading/Heading.tsx","../../src/Text/Text.tsx","../../src/Subheading/Subheading.tsx","../../src/Typography.tsx","../../src/DisplayText/DisplayText.tsx","../../src/SectionHeading/SectionHeading.tsx","../../src/Paragraph/Paragraph.tsx"],"names":["React","tokens","css","cx","Box","TEXT_DEFAULT_TAG","truncatedStyle","wordBreakStyle","_Text","_a","ref","_b","fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin","otherProps","__objRest","Element","__spreadProps","__spreadValues","Text","HEADING_DEFAULT_TAG","_Heading","testId","Heading","SUBHEADING_DEFAULT_TAG","_Subheading","Subheading","useEffect","Typography","props","DISPLAY_TEXT_DEFAULT_TAG","_DisplayText","size","DisplayText","SECTION_HEADING_DEFAULT_TAG","_SectionHeading","SectionHeading","Paragraph"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nconst HEADING_DEFAULT_TAG = 'h1';\n\nexport type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface HeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  children?: React.ReactNode;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type HeadingProps<\n  E extends React.ElementType = typeof HEADING_DEFAULT_TAG,\n> = PolymorphicProps<HeadingInternalProps, E>;\n\nfunction _Heading<E extends React.ElementType = typeof HEADING_DEFAULT_TAG>(\n  { children, testId = 'cf-ui-heading', ...otherProps }: HeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeXl\"\n      lineHeight=\"lineHeightXl\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Heading.displayName = 'Heading';\n\nexport const Heading: PolymorphicComponent<\n  ExpandProps<HeadingInternalProps>,\n  typeof HEADING_DEFAULT_TAG\n> = React.forwardRef(_Heading);\n","import React from 'react';\nimport tokens, {\n  FontSizeTokens,\n  LineHeightTokens,\n  FontWeightTokens,\n  FontStackTokens,\n  ColorTokens,\n} from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport {\n  Box,\n  type PolymorphicComponent,\n  type CommonProps,\n  type MarginProps,\n  type PolymorphicProps,\n  type ExpandProps,\n} from '@contentful/f36-core';\n\nexport interface TextInternalProps extends CommonProps, MarginProps {\n  children?: React.ReactNode;\n  fontSize?: FontSizeTokens;\n  lineHeight?: LineHeightTokens;\n  fontStack?: FontStackTokens;\n  fontWeight?: FontWeightTokens;\n  fontColor?: ColorTokens;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nconst TEXT_DEFAULT_TAG = 'span';\n\nfunction truncatedStyle() {\n  return css({\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n    maxWidth: '100%',\n  });\n}\n\nfunction wordBreakStyle() {\n  return css({\n    wordBreak: 'break-word',\n  });\n}\n\nexport type TextProps<E extends React.ElementType = typeof TEXT_DEFAULT_TAG> =\n  PolymorphicProps<TextInternalProps, E>;\n\nfunction _Text<E extends React.ElementType = typeof TEXT_DEFAULT_TAG>(\n  {\n    fontSize = 'fontSizeM',\n    fontStack = 'fontStackPrimary',\n    fontWeight = 'fontWeightNormal',\n    fontColor = 'gray800',\n    lineHeight = 'lineHeightM',\n    children,\n    isTruncated,\n    isWordBreak,\n    as,\n    className,\n    margin = 'none',\n    ...otherProps\n  }: TextProps<E>,\n  ref: React.Ref<any>,\n) {\n  const Element: React.ElementType = as || TEXT_DEFAULT_TAG;\n\n  return (\n    <Box\n      {...otherProps}\n      as={Element}\n      className={cx(\n        css({\n          padding: 0,\n          fontFamily: tokens[fontStack],\n          fontWeight: tokens[fontWeight],\n          color: tokens[fontColor],\n          fontSize: tokens[fontSize],\n          lineHeight: tokens[lineHeight],\n        }),\n        isTruncated ? truncatedStyle() : null,\n        isWordBreak ? wordBreakStyle() : null,\n        className,\n      )}\n      margin={margin}\n      ref={ref}\n    >\n      {children}\n    </Box>\n  );\n}\n\n_Text.displayName = 'Text';\n\nexport const Text: PolymorphicComponent<\n  ExpandProps<TextInternalProps>,\n  typeof TEXT_DEFAULT_TAG\n> = React.forwardRef(_Text);\n","import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SUBHEADING_DEFAULT_TAG = 'h3';\n\nexport interface SubheadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SubheadingProps<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n> = PolymorphicProps<SubheadingInternalProps, E>;\n\nfunction _Subheading<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n>(\n  { children, testId = 'cf-ui-subheading', ...otherProps }: SubheadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SUBHEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontSize=\"fontSizeL\"\n      lineHeight=\"lineHeightL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Subheading.displayName = 'Subheading';\n\nexport const Subheading: PolymorphicComponent<\n  ExpandProps<SubheadingInternalProps>,\n  typeof SUBHEADING_DEFAULT_TAG\n> = React.forwardRef(_Subheading);\n","import React, { useEffect } from 'react';\n\nexport interface TypographyProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @deprecated\n */\nexport const Typography = (props: TypographyProps) => {\n  useEffect(() => {\n    console.warn(\n      'Forma 36: Typography component is deprecated. You can safely remove it from your components.',\n    );\n  }, []);\n  return <>{props.children}</>;\n};\n\nTypography.displayName = 'Typography';\n","import React from 'react';\nimport { FontSizeTokens, LineHeightTokens } from '@contentful/f36-tokens';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\nimport type { HeadingElement } from '../Heading';\n\nconst DISPLAY_TEXT_DEFAULT_TAG = 'h2';\n\nexport interface DisplayTextInternalProps extends CommonProps, MarginProps {\n  size?: 'default' | 'large';\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type DisplayTextProps<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n> = PolymorphicProps<DisplayTextInternalProps, E>;\n\nfunction _DisplayText<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n>(\n  {\n    children,\n    size = 'default',\n    testId = 'cf-ui-display-text',\n    ...otherProps\n  }: DisplayTextProps<E>,\n  ref: React.Ref<any>,\n) {\n  let fontSize: FontSizeTokens = 'fontSize2Xl';\n  let lineHeight: LineHeightTokens = 'lineHeight2Xl';\n\n  if (size === 'large') {\n    fontSize = 'fontSize3Xl';\n    lineHeight = 'lineHeight3Xl';\n  }\n\n  return (\n    <Text\n      as={DISPLAY_TEXT_DEFAULT_TAG}\n      testId={testId}\n      marginBottom={size === 'default' ? 'spacingL' : 'spacingXl'}\n      fontSize={fontSize}\n      lineHeight={lineHeight}\n      fontColor=\"gray900\"\n      fontWeight=\"fontWeightDemiBold\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_DisplayText.displayName = 'DisplayText';\n\nexport const DisplayText: PolymorphicComponent<\n  ExpandProps<DisplayTextInternalProps>,\n  typeof DISPLAY_TEXT_DEFAULT_TAG\n> = React.forwardRef(_DisplayText);\n","import React from 'react';\nimport tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SECTION_HEADING_DEFAULT_TAG = 'h2';\n\nexport interface SectionHeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SectionHeadingProps<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n> = PolymorphicProps<SectionHeadingInternalProps, E>;\n\nfunction _SectionHeading<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n>(\n  {\n    children,\n    className,\n    testId = 'cf-ui-section-heading',\n    ...otherProps\n  }: SectionHeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SECTION_HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeS\"\n      lineHeight=\"lineHeightS\"\n      className={cx(\n        css({\n          letterSpacing: tokens.letterSpacingWide,\n          textTransform: 'uppercase',\n        }),\n        className,\n      )}\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_SectionHeading.displayName = 'SectionHeading';\n\nexport const SectionHeading: PolymorphicComponent<\n  ExpandProps<SectionHeadingInternalProps>,\n  typeof SECTION_HEADING_DEFAULT_TAG\n> = React.forwardRef(_SectionHeading);\n","import React from 'react';\nimport type {\n  PropsWithHTMLElement,\n  CommonProps,\n  MarginProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nexport type ParagraphInternalProps = CommonProps &\n  MarginProps & {\n    children: React.ReactNode;\n    isTruncated?: boolean;\n    isWordBreak?: boolean;\n  };\n\nexport type ParagraphProps = PropsWithHTMLElement<ParagraphInternalProps, 'p'>;\n\nexport const Paragraph = React.forwardRef<\n  HTMLParagraphElement,\n  ExpandProps<ParagraphProps>\n>(({ children, testId = 'cf-ui-paragraph', ...otherProps }, ref) => {\n  return (\n    <Text\n      as=\"p\"\n      testId={testId}\n      marginBottom=\"spacingM\"\n      lineHeight=\"lineHeightM\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n});\n\nParagraph.displayName = 'Paragraph';\n"]}

package/dist/index.js

@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var H__default = /*#__PURE__*/_interopDefaultLegacy(H);
 var f__default = /*#__PURE__*/_interopDefaultLegacy(f);
 
-var O=Object.defineProperty,Y=Object.defineProperties;var v=Object.getOwnPropertyDescriptors;var T=Object.getOwnPropertySymbols;var h=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var x=(e,o,t)=>o in e?O(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,p=(e,o)=>{for(var t in o||(o={}))h.call(o,t)&&x(e,t,o[t]);if(T)for(var t of T(o))E.call(o,t)&&x(e,t,o[t]);return e},a=(e,o)=>Y(e,v(o));var i=(e,o)=>{var t={};for(var r in e)h.call(e,r)&&o.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&T)for(var r of T(e))o.indexOf(r)<0&&E.call(e,r)&&(t[r]=e[r]);return t};var J="span";function K(){return emotion.css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"})}function Q(){return emotion.css({wordBreak:"break-word"})}function S(pe,X){var P=pe,{fontSize:e="fontSizeM",fontStack:o="fontStackPrimary",fontWeight:t="fontWeightNormal",fontColor:r="gray800",lineHeight:m="lineHeightM",children:n,isTruncated:l,isWordBreak:g,as:d,className:W,margin:M="none"}=P,z=i(P,["fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin"]);let w=d||J;return H__default["default"].createElement(f36Core.Box,a(p({},z),{as:w,className:emotion.cx(emotion.css({padding:0,fontFamily:f__default["default"][o],fontWeight:f__default["default"][t],color:f__default["default"][r],fontSize:f__default["default"][e],lineHeight:f__default["default"][m]}),l?K():null,g?Q():null,W),margin:M,ref:X}),n)}S.displayName="Text";var s=H__default["default"].forwardRef(S);var V="h1";function A(m,r){var n=m,{children:e,testId:o="cf-ui-heading"}=n,t=i(n,["children","testId"]);return H__default["default"].createElement(s,a(p({as:V,testId:o,marginBottom:"spacingM",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeXl",lineHeight:"lineHeightXl"},t),{ref:r}),e)}A.displayName="Heading";var D=H__default["default"].forwardRef(A);var Z="h3";function I(m,r){var n=m,{children:e,testId:o="cf-ui-subheading"}=n,t=i(n,["children","testId"]);return H__default["default"].createElement(s,a(p({as:Z,testId:o,marginBottom:"spacingM",fontSize:"fontSizeL",lineHeight:"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:"gray900"},t),{ref:r}),e)}I.displayName="Subheading";var L=H__default["default"].forwardRef(I);var C=e=>(H.useEffect(()=>{console.warn("Forma 36: Typography component is deprecated. You can safely remove it from your components.");},[]),H__default["default"].createElement(H__default["default"].Fragment,null,e.children));C.displayName="Typography";var ee="h2";function F(n,m){var l=n,{children:e,size:o="default",testId:t="cf-ui-display-text"}=l,r=i(l,["children","size","testId"]);let g="fontSize2Xl",d="lineHeight2Xl";return o==="large"&&(g="fontSize3Xl",d="lineHeight3Xl"),H__default["default"].createElement(s,a(p({as:ee,testId:t,marginBottom:o==="default"?"spacingL":"spacingXl",fontSize:g,lineHeight:d,fontColor:"gray900",fontWeight:"fontWeightDemiBold"},r),{ref:m}),e)}F.displayName="DisplayText";var N=H__default["default"].forwardRef(F);var ne="h2";function b(n,m){var l=n,{children:e,className:o,testId:t="cf-ui-section-heading"}=l,r=i(l,["children","className","testId"]);return H__default["default"].createElement(s,a(p({as:ne,testId:t,marginBottom:"spacingL",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeS",lineHeight:"lineHeightS",className:emotion.cx(emotion.css({letterSpacing:f__default["default"].letterSpacingWide,textTransform:"uppercase"}),o)},r),{ref:m}),e)}b.displayName="SectionHeading";var U=H__default["default"].forwardRef(b);var y=H__default["default"].forwardRef((m,r)=>{var n=m,{children:e,testId:o="cf-ui-paragraph"}=n,t=i(n,["children","testId"]);return H__default["default"].createElement(s,a(p({as:"p",testId:o,marginBottom:"spacingM",lineHeight:"lineHeightM"},t),{ref:r}),e)});y.displayName="Paragraph";
+var O=Object.defineProperty,Y=Object.defineProperties;var v=Object.getOwnPropertyDescriptors;var T=Object.getOwnPropertySymbols;var h=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var x=(e,o,t)=>o in e?O(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,p=(e,o)=>{for(var t in o||(o={}))h.call(o,t)&&x(e,t,o[t]);if(T)for(var t of T(o))E.call(o,t)&&x(e,t,o[t]);return e},a=(e,o)=>Y(e,v(o));var i=(e,o)=>{var t={};for(var r in e)h.call(e,r)&&o.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&T)for(var r of T(e))o.indexOf(r)<0&&E.call(e,r)&&(t[r]=e[r]);return t};var J="span";function K(){return emotion.css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"100%"})}function Q(){return emotion.css({wordBreak:"break-word"})}function S(pe,X){var P=pe,{fontSize:e="fontSizeM",fontStack:o="fontStackPrimary",fontWeight:t="fontWeightNormal",fontColor:r="gray800",lineHeight:m="lineHeightM",children:n,isTruncated:l,isWordBreak:g,as:d,className:W,margin:M="none"}=P,z=i(P,["fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin"]);let w=d||J;return H__default["default"].createElement(f36Core.Box,a(p({},z),{as:w,className:emotion.cx(emotion.css({padding:0,fontFamily:f__default["default"][o],fontWeight:f__default["default"][t],color:f__default["default"][r],fontSize:f__default["default"][e],lineHeight:f__default["default"][m]}),l?K():null,g?Q():null,W),margin:M,ref:X}),n)}S.displayName="Text";var s=H__default["default"].forwardRef(S);var V="h1";function A(m,r){var n=m,{children:e,testId:o="cf-ui-heading"}=n,t=i(n,["children","testId"]);return H__default["default"].createElement(s,a(p({as:V,testId:o,marginBottom:"spacingM",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeXl",lineHeight:"lineHeightXl"},t),{ref:r}),e)}A.displayName="Heading";var D=H__default["default"].forwardRef(A);var Z="h3";function I(m,r){var n=m,{children:e,testId:o="cf-ui-subheading"}=n,t=i(n,["children","testId"]);return H__default["default"].createElement(s,a(p({as:Z,testId:o,marginBottom:"spacingM",fontSize:"fontSizeL",lineHeight:"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:"gray900"},t),{ref:r}),e)}I.displayName="Subheading";var L=H__default["default"].forwardRef(I);var C=e=>(H.useEffect(()=>{console.warn("Forma 36: Typography component is deprecated. You can safely remove it from your components.");},[]),H__default["default"].createElement(H__default["default"].Fragment,null,e.children));C.displayName="Typography";var ee="h2";function F(n,m){var l=n,{children:e,size:o="default",testId:t="cf-ui-display-text"}=l,r=i(l,["children","size","testId"]);let g="fontSize2Xl",d="lineHeight2Xl";return o==="large"&&(g="fontSize3Xl",d="lineHeight3Xl"),H__default["default"].createElement(s,a(p({as:ee,testId:t,marginBottom:o==="default"?"spacingL":"spacingXl",fontSize:g,lineHeight:d,fontColor:"gray900",fontWeight:"fontWeightDemiBold"},r),{ref:m}),e)}F.displayName="DisplayText";var N=H__default["default"].forwardRef(F);var ne="h2";function b(n,m){var l=n,{children:e,className:o,testId:t="cf-ui-section-heading"}=l,r=i(l,["children","className","testId"]);return H__default["default"].createElement(s,a(p({as:ne,testId:t,marginBottom:"spacingL",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeS",lineHeight:"lineHeightS",className:emotion.cx(emotion.css({letterSpacing:f__default["default"].letterSpacingWide,textTransform:"uppercase"}),o)},r),{ref:m}),e)}b.displayName="SectionHeading";var U=H__default["default"].forwardRef(b);var y=H__default["default"].forwardRef((m,r)=>{var n=m,{children:e,testId:o="cf-ui-paragraph"}=n,t=i(n,["children","testId"]);return H__default["default"].createElement(s,a(p({as:"p",testId:o,marginBottom:"spacingM",lineHeight:"lineHeightM"},t),{ref:r}),e)});y.displayName="Paragraph";
 
 exports.DisplayText = N;
 exports.Heading = D;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Heading/Heading.tsx","../src/Text/Text.tsx","../src/Subheading/Subheading.tsx","../src/Typography.tsx","../src/DisplayText/DisplayText.tsx","../src/SectionHeading/SectionHeading.tsx","../src/Paragraph/Paragraph.tsx"],"names":["React","tokens","css","cx","Box","TEXT_DEFAULT_TAG","truncatedStyle","wordBreakStyle","_Text","_a","ref","_b","fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin","otherProps","__objRest","Element","__spreadProps","__spreadValues","Text","HEADING_DEFAULT_TAG","_Heading","testId","Heading","SUBHEADING_DEFAULT_TAG","_Subheading","Subheading","useEffect","Typography","props","DISPLAY_TEXT_DEFAULT_TAG","_DisplayText","size","DisplayText","SECTION_HEADING_DEFAULT_TAG","_SectionHeading","SectionHeading","Paragraph"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nconst HEADING_DEFAULT_TAG = 'h1';\n\nexport type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface HeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  children?: React.ReactNode;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type HeadingProps<\n  E extends React.ElementType = typeof HEADING_DEFAULT_TAG,\n> = PolymorphicProps<HeadingInternalProps, E>;\n\nfunction _Heading<E extends React.ElementType = typeof HEADING_DEFAULT_TAG>(\n  { children, testId = 'cf-ui-heading', ...otherProps }: HeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeXl\"\n      lineHeight=\"lineHeightXl\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Heading.displayName = 'Heading';\n\nexport const Heading: PolymorphicComponent<\n  ExpandProps<HeadingInternalProps>,\n  typeof HEADING_DEFAULT_TAG\n> = React.forwardRef(_Heading);\n","import React from 'react';\nimport tokens, {\n  FontSizeTokens,\n  LineHeightTokens,\n  FontWeightTokens,\n  FontStackTokens,\n  ColorTokens,\n} from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport {\n  Box,\n  type PolymorphicComponent,\n  type CommonProps,\n  type MarginProps,\n  type PolymorphicProps,\n  type ExpandProps,\n} from '@contentful/f36-core';\n\nexport interface TextInternalProps extends CommonProps, MarginProps {\n  children?: React.ReactNode;\n  fontSize?: FontSizeTokens;\n  lineHeight?: LineHeightTokens;\n  fontStack?: FontStackTokens;\n  fontWeight?: FontWeightTokens;\n  fontColor?: ColorTokens;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nconst TEXT_DEFAULT_TAG = 'span';\n\nfunction truncatedStyle() {\n  return css({\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  });\n}\n\nfunction wordBreakStyle() {\n  return css({\n    wordBreak: 'break-word',\n  });\n}\n\nexport type TextProps<E extends React.ElementType = typeof TEXT_DEFAULT_TAG> =\n  PolymorphicProps<TextInternalProps, E>;\n\nfunction _Text<E extends React.ElementType = typeof TEXT_DEFAULT_TAG>(\n  {\n    fontSize = 'fontSizeM',\n    fontStack = 'fontStackPrimary',\n    fontWeight = 'fontWeightNormal',\n    fontColor = 'gray800',\n    lineHeight = 'lineHeightM',\n    children,\n    isTruncated,\n    isWordBreak,\n    as,\n    className,\n    margin = 'none',\n    ...otherProps\n  }: TextProps<E>,\n  ref: React.Ref<any>,\n) {\n  const Element: React.ElementType = as || TEXT_DEFAULT_TAG;\n\n  return (\n    <Box\n      {...otherProps}\n      as={Element}\n      className={cx(\n        css({\n          padding: 0,\n          fontFamily: tokens[fontStack],\n          fontWeight: tokens[fontWeight],\n          color: tokens[fontColor],\n          fontSize: tokens[fontSize],\n          lineHeight: tokens[lineHeight],\n        }),\n        isTruncated ? truncatedStyle() : null,\n        isWordBreak ? wordBreakStyle() : null,\n        className,\n      )}\n      margin={margin}\n      ref={ref}\n    >\n      {children}\n    </Box>\n  );\n}\n\n_Text.displayName = 'Text';\n\nexport const Text: PolymorphicComponent<\n  ExpandProps<TextInternalProps>,\n  typeof TEXT_DEFAULT_TAG\n> = React.forwardRef(_Text);\n","import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SUBHEADING_DEFAULT_TAG = 'h3';\n\nexport interface SubheadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SubheadingProps<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n> = PolymorphicProps<SubheadingInternalProps, E>;\n\nfunction _Subheading<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n>(\n  { children, testId = 'cf-ui-subheading', ...otherProps }: SubheadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SUBHEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontSize=\"fontSizeL\"\n      lineHeight=\"lineHeightL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Subheading.displayName = 'Subheading';\n\nexport const Subheading: PolymorphicComponent<\n  ExpandProps<SubheadingInternalProps>,\n  typeof SUBHEADING_DEFAULT_TAG\n> = React.forwardRef(_Subheading);\n","import React, { useEffect } from 'react';\n\nexport interface TypographyProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @deprecated\n */\nexport const Typography = (props: TypographyProps) => {\n  useEffect(() => {\n    console.warn(\n      'Forma 36: Typography component is deprecated. You can safely remove it from your components.',\n    );\n  }, []);\n  return <>{props.children}</>;\n};\n\nTypography.displayName = 'Typography';\n","import React from 'react';\nimport { FontSizeTokens, LineHeightTokens } from '@contentful/f36-tokens';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\nimport type { HeadingElement } from '../Heading';\n\nconst DISPLAY_TEXT_DEFAULT_TAG = 'h2';\n\nexport interface DisplayTextInternalProps extends CommonProps, MarginProps {\n  size?: 'default' | 'large';\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type DisplayTextProps<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n> = PolymorphicProps<DisplayTextInternalProps, E>;\n\nfunction _DisplayText<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n>(\n  {\n    children,\n    size = 'default',\n    testId = 'cf-ui-display-text',\n    ...otherProps\n  }: DisplayTextProps<E>,\n  ref: React.Ref<any>,\n) {\n  let fontSize: FontSizeTokens = 'fontSize2Xl';\n  let lineHeight: LineHeightTokens = 'lineHeight2Xl';\n\n  if (size === 'large') {\n    fontSize = 'fontSize3Xl';\n    lineHeight = 'lineHeight3Xl';\n  }\n\n  return (\n    <Text\n      as={DISPLAY_TEXT_DEFAULT_TAG}\n      testId={testId}\n      marginBottom={size === 'default' ? 'spacingL' : 'spacingXl'}\n      fontSize={fontSize}\n      lineHeight={lineHeight}\n      fontColor=\"gray900\"\n      fontWeight=\"fontWeightDemiBold\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_DisplayText.displayName = 'DisplayText';\n\nexport const DisplayText: PolymorphicComponent<\n  ExpandProps<DisplayTextInternalProps>,\n  typeof DISPLAY_TEXT_DEFAULT_TAG\n> = React.forwardRef(_DisplayText);\n","import React from 'react';\nimport tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SECTION_HEADING_DEFAULT_TAG = 'h2';\n\nexport interface SectionHeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SectionHeadingProps<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n> = PolymorphicProps<SectionHeadingInternalProps, E>;\n\nfunction _SectionHeading<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n>(\n  {\n    children,\n    className,\n    testId = 'cf-ui-section-heading',\n    ...otherProps\n  }: SectionHeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SECTION_HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeS\"\n      lineHeight=\"lineHeightS\"\n      className={cx(\n        css({\n          letterSpacing: tokens.letterSpacingWide,\n          textTransform: 'uppercase',\n        }),\n        className,\n      )}\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_SectionHeading.displayName = 'SectionHeading';\n\nexport const SectionHeading: PolymorphicComponent<\n  ExpandProps<SectionHeadingInternalProps>,\n  typeof SECTION_HEADING_DEFAULT_TAG\n> = React.forwardRef(_SectionHeading);\n","import React from 'react';\nimport type {\n  PropsWithHTMLElement,\n  CommonProps,\n  MarginProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nexport type ParagraphInternalProps = CommonProps &\n  MarginProps & {\n    children: React.ReactNode;\n    isTruncated?: boolean;\n    isWordBreak?: boolean;\n  };\n\nexport type ParagraphProps = PropsWithHTMLElement<ParagraphInternalProps, 'p'>;\n\nexport const Paragraph = React.forwardRef<\n  HTMLParagraphElement,\n  ExpandProps<ParagraphProps>\n>(({ children, testId = 'cf-ui-paragraph', ...otherProps }, ref) => {\n  return (\n    <Text\n      as=\"p\"\n      testId={testId}\n      marginBottom=\"spacingM\"\n      lineHeight=\"lineHeightM\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n});\n\nParagraph.displayName = 'Paragraph';\n"]}
+{"version":3,"sources":["../src/Heading/Heading.tsx","../src/Text/Text.tsx","../src/Subheading/Subheading.tsx","../src/Typography.tsx","../src/DisplayText/DisplayText.tsx","../src/SectionHeading/SectionHeading.tsx","../src/Paragraph/Paragraph.tsx"],"names":["React","tokens","css","cx","Box","TEXT_DEFAULT_TAG","truncatedStyle","wordBreakStyle","_Text","_a","ref","_b","fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin","otherProps","__objRest","Element","__spreadProps","__spreadValues","Text","HEADING_DEFAULT_TAG","_Heading","testId","Heading","SUBHEADING_DEFAULT_TAG","_Subheading","Subheading","useEffect","Typography","props","DISPLAY_TEXT_DEFAULT_TAG","_DisplayText","size","DisplayText","SECTION_HEADING_DEFAULT_TAG","_SectionHeading","SectionHeading","Paragraph"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nconst HEADING_DEFAULT_TAG = 'h1';\n\nexport type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface HeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  children?: React.ReactNode;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type HeadingProps<\n  E extends React.ElementType = typeof HEADING_DEFAULT_TAG,\n> = PolymorphicProps<HeadingInternalProps, E>;\n\nfunction _Heading<E extends React.ElementType = typeof HEADING_DEFAULT_TAG>(\n  { children, testId = 'cf-ui-heading', ...otherProps }: HeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeXl\"\n      lineHeight=\"lineHeightXl\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Heading.displayName = 'Heading';\n\nexport const Heading: PolymorphicComponent<\n  ExpandProps<HeadingInternalProps>,\n  typeof HEADING_DEFAULT_TAG\n> = React.forwardRef(_Heading);\n","import React from 'react';\nimport tokens, {\n  FontSizeTokens,\n  LineHeightTokens,\n  FontWeightTokens,\n  FontStackTokens,\n  ColorTokens,\n} from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport {\n  Box,\n  type PolymorphicComponent,\n  type CommonProps,\n  type MarginProps,\n  type PolymorphicProps,\n  type ExpandProps,\n} from '@contentful/f36-core';\n\nexport interface TextInternalProps extends CommonProps, MarginProps {\n  children?: React.ReactNode;\n  fontSize?: FontSizeTokens;\n  lineHeight?: LineHeightTokens;\n  fontStack?: FontStackTokens;\n  fontWeight?: FontWeightTokens;\n  fontColor?: ColorTokens;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nconst TEXT_DEFAULT_TAG = 'span';\n\nfunction truncatedStyle() {\n  return css({\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n    maxWidth: '100%',\n  });\n}\n\nfunction wordBreakStyle() {\n  return css({\n    wordBreak: 'break-word',\n  });\n}\n\nexport type TextProps<E extends React.ElementType = typeof TEXT_DEFAULT_TAG> =\n  PolymorphicProps<TextInternalProps, E>;\n\nfunction _Text<E extends React.ElementType = typeof TEXT_DEFAULT_TAG>(\n  {\n    fontSize = 'fontSizeM',\n    fontStack = 'fontStackPrimary',\n    fontWeight = 'fontWeightNormal',\n    fontColor = 'gray800',\n    lineHeight = 'lineHeightM',\n    children,\n    isTruncated,\n    isWordBreak,\n    as,\n    className,\n    margin = 'none',\n    ...otherProps\n  }: TextProps<E>,\n  ref: React.Ref<any>,\n) {\n  const Element: React.ElementType = as || TEXT_DEFAULT_TAG;\n\n  return (\n    <Box\n      {...otherProps}\n      as={Element}\n      className={cx(\n        css({\n          padding: 0,\n          fontFamily: tokens[fontStack],\n          fontWeight: tokens[fontWeight],\n          color: tokens[fontColor],\n          fontSize: tokens[fontSize],\n          lineHeight: tokens[lineHeight],\n        }),\n        isTruncated ? truncatedStyle() : null,\n        isWordBreak ? wordBreakStyle() : null,\n        className,\n      )}\n      margin={margin}\n      ref={ref}\n    >\n      {children}\n    </Box>\n  );\n}\n\n_Text.displayName = 'Text';\n\nexport const Text: PolymorphicComponent<\n  ExpandProps<TextInternalProps>,\n  typeof TEXT_DEFAULT_TAG\n> = React.forwardRef(_Text);\n","import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SUBHEADING_DEFAULT_TAG = 'h3';\n\nexport interface SubheadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SubheadingProps<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n> = PolymorphicProps<SubheadingInternalProps, E>;\n\nfunction _Subheading<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n>(\n  { children, testId = 'cf-ui-subheading', ...otherProps }: SubheadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SUBHEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontSize=\"fontSizeL\"\n      lineHeight=\"lineHeightL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Subheading.displayName = 'Subheading';\n\nexport const Subheading: PolymorphicComponent<\n  ExpandProps<SubheadingInternalProps>,\n  typeof SUBHEADING_DEFAULT_TAG\n> = React.forwardRef(_Subheading);\n","import React, { useEffect } from 'react';\n\nexport interface TypographyProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @deprecated\n */\nexport const Typography = (props: TypographyProps) => {\n  useEffect(() => {\n    console.warn(\n      'Forma 36: Typography component is deprecated. You can safely remove it from your components.',\n    );\n  }, []);\n  return <>{props.children}</>;\n};\n\nTypography.displayName = 'Typography';\n","import React from 'react';\nimport { FontSizeTokens, LineHeightTokens } from '@contentful/f36-tokens';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\nimport type { HeadingElement } from '../Heading';\n\nconst DISPLAY_TEXT_DEFAULT_TAG = 'h2';\n\nexport interface DisplayTextInternalProps extends CommonProps, MarginProps {\n  size?: 'default' | 'large';\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type DisplayTextProps<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n> = PolymorphicProps<DisplayTextInternalProps, E>;\n\nfunction _DisplayText<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n>(\n  {\n    children,\n    size = 'default',\n    testId = 'cf-ui-display-text',\n    ...otherProps\n  }: DisplayTextProps<E>,\n  ref: React.Ref<any>,\n) {\n  let fontSize: FontSizeTokens = 'fontSize2Xl';\n  let lineHeight: LineHeightTokens = 'lineHeight2Xl';\n\n  if (size === 'large') {\n    fontSize = 'fontSize3Xl';\n    lineHeight = 'lineHeight3Xl';\n  }\n\n  return (\n    <Text\n      as={DISPLAY_TEXT_DEFAULT_TAG}\n      testId={testId}\n      marginBottom={size === 'default' ? 'spacingL' : 'spacingXl'}\n      fontSize={fontSize}\n      lineHeight={lineHeight}\n      fontColor=\"gray900\"\n      fontWeight=\"fontWeightDemiBold\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_DisplayText.displayName = 'DisplayText';\n\nexport const DisplayText: PolymorphicComponent<\n  ExpandProps<DisplayTextInternalProps>,\n  typeof DISPLAY_TEXT_DEFAULT_TAG\n> = React.forwardRef(_DisplayText);\n","import React from 'react';\nimport tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SECTION_HEADING_DEFAULT_TAG = 'h2';\n\nexport interface SectionHeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SectionHeadingProps<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n> = PolymorphicProps<SectionHeadingInternalProps, E>;\n\nfunction _SectionHeading<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n>(\n  {\n    children,\n    className,\n    testId = 'cf-ui-section-heading',\n    ...otherProps\n  }: SectionHeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SECTION_HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeS\"\n      lineHeight=\"lineHeightS\"\n      className={cx(\n        css({\n          letterSpacing: tokens.letterSpacingWide,\n          textTransform: 'uppercase',\n        }),\n        className,\n      )}\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_SectionHeading.displayName = 'SectionHeading';\n\nexport const SectionHeading: PolymorphicComponent<\n  ExpandProps<SectionHeadingInternalProps>,\n  typeof SECTION_HEADING_DEFAULT_TAG\n> = React.forwardRef(_SectionHeading);\n","import React from 'react';\nimport type {\n  PropsWithHTMLElement,\n  CommonProps,\n  MarginProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nexport type ParagraphInternalProps = CommonProps &\n  MarginProps & {\n    children: React.ReactNode;\n    isTruncated?: boolean;\n    isWordBreak?: boolean;\n  };\n\nexport type ParagraphProps = PropsWithHTMLElement<ParagraphInternalProps, 'p'>;\n\nexport const Paragraph = React.forwardRef<\n  HTMLParagraphElement,\n  ExpandProps<ParagraphProps>\n>(({ children, testId = 'cf-ui-paragraph', ...otherProps }, ref) => {\n  return (\n    <Text\n      as=\"p\"\n      testId={testId}\n      marginBottom=\"spacingM\"\n      lineHeight=\"lineHeightM\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n});\n\nParagraph.displayName = 'Paragraph';\n"]}

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@contentful/f36-typography",
-  "version": "4.19.0",
+  "version": "4.20.0",
   "description": "Forma 36: typography React Component",
   "license": "MIT",
   "files": [
     "dist"
   ],
   "main": "dist/index.js",
-  "module": "dist/index.mjs",
+  "module": "dist/esm/index.js",
   "types": "dist/index.d.ts",
   "source": "src/index.ts",
   "sideEffects": false,
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.6.2",
-    "@contentful/f36-core": "^4.19.0",
+    "@contentful/f36-core": "^4.20.0",
     "@contentful/f36-tokens": "^4.0.1",
     "emotion": "^10.0.17"
   },

package/dist/index.mjs

@@ -1,9 +0,0 @@
-import H, { useEffect } from 'react';
-import f from '@contentful/f36-tokens';
-import { cx, css } from 'emotion';
-import { Box } from '@contentful/f36-core';
-
-var O=Object.defineProperty,Y=Object.defineProperties;var v=Object.getOwnPropertyDescriptors;var T=Object.getOwnPropertySymbols;var h=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable;var x=(e,o,t)=>o in e?O(e,o,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[o]=t,p=(e,o)=>{for(var t in o||(o={}))h.call(o,t)&&x(e,t,o[t]);if(T)for(var t of T(o))E.call(o,t)&&x(e,t,o[t]);return e},a=(e,o)=>Y(e,v(o));var i=(e,o)=>{var t={};for(var r in e)h.call(e,r)&&o.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&T)for(var r of T(e))o.indexOf(r)<0&&E.call(e,r)&&(t[r]=e[r]);return t};var J="span";function K(){return css({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"})}function Q(){return css({wordBreak:"break-word"})}function S(pe,X){var P=pe,{fontSize:e="fontSizeM",fontStack:o="fontStackPrimary",fontWeight:t="fontWeightNormal",fontColor:r="gray800",lineHeight:m="lineHeightM",children:n,isTruncated:l,isWordBreak:g,as:d,className:W,margin:M="none"}=P,z=i(P,["fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin"]);let w=d||J;return H.createElement(Box,a(p({},z),{as:w,className:cx(css({padding:0,fontFamily:f[o],fontWeight:f[t],color:f[r],fontSize:f[e],lineHeight:f[m]}),l?K():null,g?Q():null,W),margin:M,ref:X}),n)}S.displayName="Text";var s=H.forwardRef(S);var V="h1";function A(m,r){var n=m,{children:e,testId:o="cf-ui-heading"}=n,t=i(n,["children","testId"]);return H.createElement(s,a(p({as:V,testId:o,marginBottom:"spacingM",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeXl",lineHeight:"lineHeightXl"},t),{ref:r}),e)}A.displayName="Heading";var D=H.forwardRef(A);var Z="h3";function I(m,r){var n=m,{children:e,testId:o="cf-ui-subheading"}=n,t=i(n,["children","testId"]);return H.createElement(s,a(p({as:Z,testId:o,marginBottom:"spacingM",fontSize:"fontSizeL",lineHeight:"lineHeightL",fontWeight:"fontWeightDemiBold",fontColor:"gray900"},t),{ref:r}),e)}I.displayName="Subheading";var L=H.forwardRef(I);var C=e=>(useEffect(()=>{console.warn("Forma 36: Typography component is deprecated. You can safely remove it from your components.");},[]),H.createElement(H.Fragment,null,e.children));C.displayName="Typography";var ee="h2";function F(n,m){var l=n,{children:e,size:o="default",testId:t="cf-ui-display-text"}=l,r=i(l,["children","size","testId"]);let g="fontSize2Xl",d="lineHeight2Xl";return o==="large"&&(g="fontSize3Xl",d="lineHeight3Xl"),H.createElement(s,a(p({as:ee,testId:t,marginBottom:o==="default"?"spacingL":"spacingXl",fontSize:g,lineHeight:d,fontColor:"gray900",fontWeight:"fontWeightDemiBold"},r),{ref:m}),e)}F.displayName="DisplayText";var N=H.forwardRef(F);var ne="h2";function b(n,m){var l=n,{children:e,className:o,testId:t="cf-ui-section-heading"}=l,r=i(l,["children","className","testId"]);return H.createElement(s,a(p({as:ne,testId:t,marginBottom:"spacingL",fontWeight:"fontWeightDemiBold",fontColor:"gray900",fontSize:"fontSizeS",lineHeight:"lineHeightS",className:cx(css({letterSpacing:f.letterSpacingWide,textTransform:"uppercase"}),o)},r),{ref:m}),e)}b.displayName="SectionHeading";var U=H.forwardRef(b);var y=H.forwardRef((m,r)=>{var n=m,{children:e,testId:o="cf-ui-paragraph"}=n,t=i(n,["children","testId"]);return H.createElement(s,a(p({as:"p",testId:o,marginBottom:"spacingM",lineHeight:"lineHeightM"},t),{ref:r}),e)});y.displayName="Paragraph";
-
-export { N as DisplayText, D as Heading, y as Paragraph, U as SectionHeading, L as Subheading, s as Text, C as Typography };
-//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Heading/Heading.tsx","../src/Text/Text.tsx","../src/Subheading/Subheading.tsx","../src/Typography.tsx","../src/DisplayText/DisplayText.tsx","../src/SectionHeading/SectionHeading.tsx","../src/Paragraph/Paragraph.tsx"],"names":["React","tokens","css","cx","Box","TEXT_DEFAULT_TAG","truncatedStyle","wordBreakStyle","_Text","_a","ref","_b","fontSize","fontStack","fontWeight","fontColor","lineHeight","children","isTruncated","isWordBreak","as","className","margin","otherProps","__objRest","Element","__spreadProps","__spreadValues","Text","HEADING_DEFAULT_TAG","_Heading","testId","Heading","SUBHEADING_DEFAULT_TAG","_Subheading","Subheading","useEffect","Typography","props","DISPLAY_TEXT_DEFAULT_TAG","_DisplayText","size","DisplayText","SECTION_HEADING_DEFAULT_TAG","_SectionHeading","SectionHeading","Paragraph"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nconst HEADING_DEFAULT_TAG = 'h1';\n\nexport type HeadingElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface HeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  children?: React.ReactNode;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type HeadingProps<\n  E extends React.ElementType = typeof HEADING_DEFAULT_TAG,\n> = PolymorphicProps<HeadingInternalProps, E>;\n\nfunction _Heading<E extends React.ElementType = typeof HEADING_DEFAULT_TAG>(\n  { children, testId = 'cf-ui-heading', ...otherProps }: HeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeXl\"\n      lineHeight=\"lineHeightXl\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Heading.displayName = 'Heading';\n\nexport const Heading: PolymorphicComponent<\n  ExpandProps<HeadingInternalProps>,\n  typeof HEADING_DEFAULT_TAG\n> = React.forwardRef(_Heading);\n","import React from 'react';\nimport tokens, {\n  FontSizeTokens,\n  LineHeightTokens,\n  FontWeightTokens,\n  FontStackTokens,\n  ColorTokens,\n} from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport {\n  Box,\n  type PolymorphicComponent,\n  type CommonProps,\n  type MarginProps,\n  type PolymorphicProps,\n  type ExpandProps,\n} from '@contentful/f36-core';\n\nexport interface TextInternalProps extends CommonProps, MarginProps {\n  children?: React.ReactNode;\n  fontSize?: FontSizeTokens;\n  lineHeight?: LineHeightTokens;\n  fontStack?: FontStackTokens;\n  fontWeight?: FontWeightTokens;\n  fontColor?: ColorTokens;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nconst TEXT_DEFAULT_TAG = 'span';\n\nfunction truncatedStyle() {\n  return css({\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n  });\n}\n\nfunction wordBreakStyle() {\n  return css({\n    wordBreak: 'break-word',\n  });\n}\n\nexport type TextProps<E extends React.ElementType = typeof TEXT_DEFAULT_TAG> =\n  PolymorphicProps<TextInternalProps, E>;\n\nfunction _Text<E extends React.ElementType = typeof TEXT_DEFAULT_TAG>(\n  {\n    fontSize = 'fontSizeM',\n    fontStack = 'fontStackPrimary',\n    fontWeight = 'fontWeightNormal',\n    fontColor = 'gray800',\n    lineHeight = 'lineHeightM',\n    children,\n    isTruncated,\n    isWordBreak,\n    as,\n    className,\n    margin = 'none',\n    ...otherProps\n  }: TextProps<E>,\n  ref: React.Ref<any>,\n) {\n  const Element: React.ElementType = as || TEXT_DEFAULT_TAG;\n\n  return (\n    <Box\n      {...otherProps}\n      as={Element}\n      className={cx(\n        css({\n          padding: 0,\n          fontFamily: tokens[fontStack],\n          fontWeight: tokens[fontWeight],\n          color: tokens[fontColor],\n          fontSize: tokens[fontSize],\n          lineHeight: tokens[lineHeight],\n        }),\n        isTruncated ? truncatedStyle() : null,\n        isWordBreak ? wordBreakStyle() : null,\n        className,\n      )}\n      margin={margin}\n      ref={ref}\n    >\n      {children}\n    </Box>\n  );\n}\n\n_Text.displayName = 'Text';\n\nexport const Text: PolymorphicComponent<\n  ExpandProps<TextInternalProps>,\n  typeof TEXT_DEFAULT_TAG\n> = React.forwardRef(_Text);\n","import React from 'react';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SUBHEADING_DEFAULT_TAG = 'h3';\n\nexport interface SubheadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SubheadingProps<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n> = PolymorphicProps<SubheadingInternalProps, E>;\n\nfunction _Subheading<\n  E extends React.ElementType = typeof SUBHEADING_DEFAULT_TAG,\n>(\n  { children, testId = 'cf-ui-subheading', ...otherProps }: SubheadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SUBHEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingM\"\n      fontSize=\"fontSizeL\"\n      lineHeight=\"lineHeightL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_Subheading.displayName = 'Subheading';\n\nexport const Subheading: PolymorphicComponent<\n  ExpandProps<SubheadingInternalProps>,\n  typeof SUBHEADING_DEFAULT_TAG\n> = React.forwardRef(_Subheading);\n","import React, { useEffect } from 'react';\n\nexport interface TypographyProps {\n  children?: React.ReactNode;\n}\n\n/**\n * @deprecated\n */\nexport const Typography = (props: TypographyProps) => {\n  useEffect(() => {\n    console.warn(\n      'Forma 36: Typography component is deprecated. You can safely remove it from your components.',\n    );\n  }, []);\n  return <>{props.children}</>;\n};\n\nTypography.displayName = 'Typography';\n","import React from 'react';\nimport { FontSizeTokens, LineHeightTokens } from '@contentful/f36-tokens';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\nimport type { HeadingElement } from '../Heading';\n\nconst DISPLAY_TEXT_DEFAULT_TAG = 'h2';\n\nexport interface DisplayTextInternalProps extends CommonProps, MarginProps {\n  size?: 'default' | 'large';\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type DisplayTextProps<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n> = PolymorphicProps<DisplayTextInternalProps, E>;\n\nfunction _DisplayText<\n  E extends React.ElementType = typeof DISPLAY_TEXT_DEFAULT_TAG,\n>(\n  {\n    children,\n    size = 'default',\n    testId = 'cf-ui-display-text',\n    ...otherProps\n  }: DisplayTextProps<E>,\n  ref: React.Ref<any>,\n) {\n  let fontSize: FontSizeTokens = 'fontSize2Xl';\n  let lineHeight: LineHeightTokens = 'lineHeight2Xl';\n\n  if (size === 'large') {\n    fontSize = 'fontSize3Xl';\n    lineHeight = 'lineHeight3Xl';\n  }\n\n  return (\n    <Text\n      as={DISPLAY_TEXT_DEFAULT_TAG}\n      testId={testId}\n      marginBottom={size === 'default' ? 'spacingL' : 'spacingXl'}\n      fontSize={fontSize}\n      lineHeight={lineHeight}\n      fontColor=\"gray900\"\n      fontWeight=\"fontWeightDemiBold\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_DisplayText.displayName = 'DisplayText';\n\nexport const DisplayText: PolymorphicComponent<\n  ExpandProps<DisplayTextInternalProps>,\n  typeof DISPLAY_TEXT_DEFAULT_TAG\n> = React.forwardRef(_DisplayText);\n","import React from 'react';\nimport tokens from '@contentful/f36-tokens';\nimport { css, cx } from 'emotion';\nimport type {\n  CommonProps,\n  MarginProps,\n  PolymorphicComponent,\n  PolymorphicProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport type { HeadingElement } from '../Heading';\nimport { Text } from '../Text';\n\nconst SECTION_HEADING_DEFAULT_TAG = 'h2';\n\nexport interface SectionHeadingInternalProps extends CommonProps, MarginProps {\n  as?: HeadingElement;\n  isTruncated?: boolean;\n  isWordBreak?: boolean;\n}\n\nexport type SectionHeadingProps<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n> = PolymorphicProps<SectionHeadingInternalProps, E>;\n\nfunction _SectionHeading<\n  E extends React.ElementType = typeof SECTION_HEADING_DEFAULT_TAG,\n>(\n  {\n    children,\n    className,\n    testId = 'cf-ui-section-heading',\n    ...otherProps\n  }: SectionHeadingProps<E>,\n  ref: React.Ref<any>,\n) {\n  return (\n    <Text\n      as={SECTION_HEADING_DEFAULT_TAG}\n      testId={testId}\n      marginBottom=\"spacingL\"\n      fontWeight=\"fontWeightDemiBold\"\n      fontColor=\"gray900\"\n      fontSize=\"fontSizeS\"\n      lineHeight=\"lineHeightS\"\n      className={cx(\n        css({\n          letterSpacing: tokens.letterSpacingWide,\n          textTransform: 'uppercase',\n        }),\n        className,\n      )}\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n}\n\n_SectionHeading.displayName = 'SectionHeading';\n\nexport const SectionHeading: PolymorphicComponent<\n  ExpandProps<SectionHeadingInternalProps>,\n  typeof SECTION_HEADING_DEFAULT_TAG\n> = React.forwardRef(_SectionHeading);\n","import React from 'react';\nimport type {\n  PropsWithHTMLElement,\n  CommonProps,\n  MarginProps,\n  ExpandProps,\n} from '@contentful/f36-core';\nimport { Text } from '../Text';\n\nexport type ParagraphInternalProps = CommonProps &\n  MarginProps & {\n    children: React.ReactNode;\n    isTruncated?: boolean;\n    isWordBreak?: boolean;\n  };\n\nexport type ParagraphProps = PropsWithHTMLElement<ParagraphInternalProps, 'p'>;\n\nexport const Paragraph = React.forwardRef<\n  HTMLParagraphElement,\n  ExpandProps<ParagraphProps>\n>(({ children, testId = 'cf-ui-paragraph', ...otherProps }, ref) => {\n  return (\n    <Text\n      as=\"p\"\n      testId={testId}\n      marginBottom=\"spacingM\"\n      lineHeight=\"lineHeightM\"\n      {...otherProps}\n      ref={ref}\n    >\n      {children}\n    </Text>\n  );\n});\n\nParagraph.displayName = 'Paragraph';\n"]}