Update typography and Tiptap classes, fix styling and break word issue

Author: agjs

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@programmer_network/yail",
-  "version": "1.0.155",
+  "version": "1.0.156",
   "description": "Programmer Network's official UI library for React",
   "author": "Aleksandar Grbic - (https://programmer.network)",
   "publishConfig": {

src/Components/AuthorCard/__snapshots__/AuthorCard.test.tsx.snap

@@ -25,7 +25,7 @@ exports[`AuthorCard component > renders correctly 1`] = `
       </div>
       <div>
         <h2
-          class="text-2xl sm:text-3xl md:text-4xl lg:text-5xl my-4 text-primary wordbreak font-bold !my-0"
+          class="text-2xl sm:text-3xl md:text-4xl lg:text-5xl my-4 text-primary break-words overflow-hidden font-bold !my-0"
         >
           John Doe
         </h2>

src/Components/CTA/__snapshots__/CTA.test.tsx.snap

@@ -15,7 +15,7 @@ exports[`CTA component > renders correctly - snapshot test 1`] = `
           class="flex flex-col gap-2"
         >
           <h2
-            class="text-2xl sm:text-3xl md:text-4xl lg:text-5xl my-4 text-primary wordbreak font-bold text-primary-text-color"
+            class="text-2xl sm:text-3xl md:text-4xl lg:text-5xl my-4 text-primary break-words overflow-hidden font-bold text-primary-text-color"
           >
             Test Title
           </h2>

src/Components/Card/index.tsx

@@ -1,7 +1,7 @@
 import classNames from "classnames";
 import { FC } from "react";
 
-import { Anchor, H2, Paragraph } from "Components/Typography";
+import { Anchor, H3, Paragraph } from "Components/Typography";
 
 import URLUtils from "Utils/URL";
 
@@ -37,13 +37,13 @@ const Card: FC<ICard> = ({ data, className, NavLink }) => {
 
       {URLUtils.isExternalLink(titleUrl) ? (
         <Anchor href={titleUrl} target='_blank'>
-          <H2 margin='none' className='flex items-center justify-start gap-2'>
+          <H3 margin='none' className='flex items-center justify-start gap-2'>
             {title}
-          </H2>
+          </H3>
         </Anchor>
       ) : (
         <NavLink to={titleUrl}>
-          <H2 margin='none'>{title}</H2>
+          <H3 margin='none'>{title}</H3>
         </NavLink>
       )}
       <Paragraph>{description}</Paragraph>

src/Components/Inputs/Tiptap/constants.ts

@@ -28,32 +28,32 @@ export const toolbarItemToClassName = {
   [TIPTAP_TOOLBAR_ITEMS.HEADING_1]: {
     tagName: "h1",
     classes:
-      "text-3xl sm:text-4xl md:text-5xl lg:text-6xl my-4 text-primary wordbreak font-bold"
+      "text-3xl sm:text-4xl md:text-5xl lg:text-6xl my-4 text-primary break-words overflow-hidden font-bold"
   },
   [TIPTAP_TOOLBAR_ITEMS.HEADING_2]: {
     tagName: "h2",
     classes:
-      "text-2xl sm:text-3xl md:text-4xl lg:text-5xl my-4 text-primary wordbreak font-bold"
+      "text-2xl sm:text-3xl md:text-4xl lg:text-5xl my-4 text-primary break-words overflow-hidden font-bold"
   },
   [TIPTAP_TOOLBAR_ITEMS.HEADING_3]: {
     tagName: "h3",
     classes:
-      "text-xl sm:text-2xl md:text-3xl lg:text-4xl my-4 text-primary wordbreak font-bold"
+      "text-xl sm:text-2xl md:text-3xl lg:text-4xl my-4 text-primary break-words overflow-hidden font-bold"
   },
   [TIPTAP_TOOLBAR_ITEMS.HEADING_4]: {
     tagName: "h4",
     classes:
-      "text-lg sm:text-xl md:text-2xl lg:text-3xl my-4 text-primary wordbreak font-bold"
+      "text-lg sm:text-xl md:text-2xl lg:text-3xl my-4 text-primary break-words overflow-hidden font-bold"
   },
   [TIPTAP_TOOLBAR_ITEMS.HEADING_5]: {
     tagName: "h5",
     classes:
-      "text-md sm:text-lg md:text-xl lg:text-2xl my-4 text-primary wordbreak font-bold"
+      "text-md sm:text-lg md:text-xl lg:text-2xl my-4 text-primary break-words overflow-hidden font-bold"
   },
   [TIPTAP_TOOLBAR_ITEMS.HEADING_6]: {
     tagName: "h6",
     classes:
-      "text-sm sm:text-md md:text-lg lg:text-xl my-4 text-primary wordbreak font-bold"
+      "text-sm sm:text-md md:text-lg lg:text-xl my-4 text-primary break-words overflow-hidden font-bold"
   },
   [TIPTAP_TOOLBAR_ITEMS.UNORDERED_LIST]: {
     tagName: "ul",