How to use the @tds/shared-typography.wordBreak function in @tds/shared-typography

import { spacing } from '@tds/shared-styles'
import { safeRest } from '@tds/util-helpers'

const paragraphColor = ({ invert }) => (invert ? typography.invertedColor : typography.color)
const paragraphInheritColor = ({ inheritColor }) =>
  inheritColor ? { color: 'inherit' } : undefined

const paragraphSize = ({ size }) => typography[size]
const paragraphBold = ({ bold, size }) => (bold ? typography.boldFont : typography[`${size}Font`])
const paragraphAlign = ({ align }) => ({
  textAlign: align,
})

export const StyledParagraph = styled.p(
  paragraphColor,
  typography.wordBreak,
  spacing.noSpacing,
  paragraphInheritColor,
  paragraphSize,
  paragraphBold,
  paragraphAlign,
  { sup: typography.sup }
)

/**
 * Block text as an HTML `<p>` element.
 *
 * @version ./package.json
 */
const Paragraph = ({ children, ...rest }, context) =&gt; (
  
    {children}</p>