Tabs Component Labels should handle text overflow

[diwakarang]

Describe the bug
When Tabs label is too long to be displayed inside the available space it should force the text to trucate with ellipsis. That is not working

To Reproduce

1. Visit Halstack component website, and add following values to list of tabs

     [
          {
            label: "Customer Journey V2 Jan 2023.pdf",
          },
          {
            label: "Market Compensation Levels Report Q1 2023.pdf",
          },
          {
            label: "Market Reform Contract",
          },
          {
            label: "Market Reform Proposal",
          }
     ] 

2. It can be noticed that tabs label doesn't get truncated with ellipsis.

Expected behaviour
When Tabs label is too long to be displayed inside the available space it should force the text to trucate with ellipsis
As mentioned in the screenshot below.

Screenshots
Usage mentioned in Docs

Additional context
This is observed, when it is required to use lengthy labels for Tabs

Add labels
Tabs, text overflow

[Mil4n0r]

The multi-line ellipsis is, as far as I know, a functionality that can be implemented only using -webkit-line-clamp (with value 2 in this case), which is not supported by all the browsers. It is also not handled either by our BaseTypography which could become a problem due to it being used in order to display the label of the Tabs.

We should find a way to proceed in order to cover this scenario.

[kukoc]

From our doc:

We need to engage to our Designers and figure out if long text is a fair use case for tab titles.. Maybe not.

[Mil4n0r]

Hello,

Following our discussion, we have decided not to incorporate the requested feature into Halstack. We believe that accommodating long text within the Tabs component does not align with its intended use case.

Thank you in any case for proposing it and helping us to improve.