Add props to Text component to break words

Author: Kubit

src/components/text/textStandAlone.tsx

@@ -7,12 +7,7 @@ import { ITextStandAlone } from './types/text';
 import { TextTransformType } from './types/transform';
 
 const TextStandAloneComponent = (
-  {
-    dataTestId = 'text',
-
-    transform = TextTransformType.NONE,
-    ...props
-  }: ITextStandAlone,
+  { dataTestId = 'text', transform = TextTransformType.NONE, ...props }: ITextStandAlone,
   ref: React.ForwardedRef<HTMLParagraphElement> | null
 ): JSX.Element => {
   const ariaProps = pickAriaProps(props);

src/components/text/types/text.ts

@@ -23,7 +23,7 @@ export interface ITextStyled {
 
 type TextAriaAttributes = Pick<
   React.AriaAttributes,
-  'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-hidden' | 'aria-level'
+  'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-hidden' | 'aria-level' | 'aria-live'
 >;
 
 export interface ITextStandAlone extends ITextStyled, TextAriaAttributes {
@@ -35,6 +35,8 @@ export interface ITextStandAlone extends ITextStyled, TextAriaAttributes {
   onClick?: React.MouseEventHandler<HTMLElement>;
   role?: React.AriaRole;
   color?: string;
+  wordBreak?: string;
+  wordWrap?: string;
   filter?: string;
   display?: TextDisplayType;
   decoration?: TextDecorationType;

src/components/text/types/textTheme.ts

@@ -41,6 +41,8 @@ export type TextPropsStylesType = {
   $transform?: TextTransformType;
   align?: string;
   weight?: number;
+  wordBreak?: string;
+  wordWrap?: string;
   isDisabled?: boolean;
   $maxTruncatedLines?: number;
   $truncate?: boolean;