feat(styles): add grow option for nve-text

- Introduced a new 'Grow' section in typography documentation.
- Added CSS rules for 'grow' text to utilize the `text-fit` property.
Signed-off-by: Cory Rylan <crylan@nvidia.com>

Author: coryrylan

projects/site/src/docs/foundations/typography.md

@@ -93,6 +93,10 @@ See the links below for specific integration patterns for the following framewor
 
 {% example '@nvidia-elements/styles/typography.examples.json' 'Size' %}
 
+## Grow
+
+{% example '@nvidia-elements/styles/typography.examples.json' 'Grow' %}
+
 ## Line height
 
 Use different attributes with `nve-text` like `loose`, `relaxed`, `moderate`, `snug`, and `tight` to give an element a relative line-height based on its current font-size.

projects/styles/src/typography.css

@@ -344,3 +344,8 @@ ul[nve-text~='nav'] ul li {
 [nve-text~='monospace'] {
 font-family: monospace !important;
 }
+
+[nve-text~='grow'] {
+text-fit: grow;
+width:100%;
+}

projects/styles/src/typography.examples.ts

@@ -64,6 +64,19 @@ export const Size = {
  `
 }
 
+/**
+ * @summary Grow text to fill the available width via the CSS `text-fit` property.
+ */
+exportconstGrow={
+render: ()=>html`
+<divnve-layout="column gap:xl" >
+<pnve-text="body grow" style="width: 400px;">grow text</p>
+<pnve-text="body grow" style="width: 300px;">grow text</p>
+<pnve-text="body grow" style="width: 200px;">grow text</p>
+</div>
+ `
+}
+
 /**
  * @summary Color variations for text to convey importance levels and ensure proper contrast in light and dark themes.
  * @tags test-case