fix(BaseHeader): word break for single word

Author: saurabhdaware

packages/blade/src/components/BaseHeaderFooter/BaseHeader.tsx

@@ -314,6 +314,7 @@ const _BaseHeader = ({
                     marginTop={makeSize(sizeToken['1'])}
                     weight="semibold"
                     color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.normal'}
+                    wordBreak="break-word"
                   >
                     {title}
                   </Text>

packages/blade/src/components/BaseHeaderFooter/BaseHeaderFooter.internal.stories.tsx

@@ -56,6 +56,17 @@ export const BaseHeaderKitchenSink = (): React.ReactElement => {
           showBackButton={true}
         />
       </HeaderContainer>
+      <HeaderContainer>
+        <BaseHeader
+          leading={<StarIcon color="surface.icon.gray.normal" size="large" />}
+          title="When_Title_Does_Not_Break_Word_And_Goes_On_Next_Line"
+          subtitle="When The Subtitle of this BaseHeader is So Largeeeee That It Goes On Next Line"
+          titleSuffix={<Badge color="positive">New</Badge>}
+          trailing={<Link>Apply</Link>}
+          showCloseButton={true}
+          showBackButton={true}
+        />
+      </HeaderContainer>
       <HeaderContainer>
         <BaseHeader
           leading={