nicklabs-ui 1.0.116 → 1.0.117

package/README.md

@@ -2,7 +2,7 @@
 
 A Vue 3 component library with glassmorphism design, built for modern web applications.
 
-**Version**: 1.0.116 | **Framework**: Vue 3.5+
+**Version**: 1.0.117 | **Framework**: Vue 3.5+
 
 ---
 
@@ -1177,16 +1177,16 @@ function handleItemClick(item: User) {
 
 > **Column sizing.** Each column resolves to a CSS grid `minmax()` track:
 >
-> | Setting | Resulting track | Behaviour |
-> | --- | --- | --- |
-> | _(none)_ | `minmax(120px, 1fr)` | Flexible, shares leftover space, min 120px |
-> | `width: "200px"` | `minmax(200px, 200px)` | Fixed at exactly 200px |
-> | `width: "2fr"` | `minmax(120px, 2fr)` | Flexible with a 2× share, min 120px |
-> | `minWidth: "200px"` | `minmax(200px, max-content)` | Content-driven, at least 200px |
-> | `maxWidth: "300px"` | `minmax(0, min(max-content, 300px))` | Content-driven, at most 300px |
-> | `minWidth: "150px", maxWidth: "400px"` | `minmax(150px, min(max-content, 400px))` | Content-driven, clamped to 150–400px |
+> | Setting | Resulting track | maxWidth enforced by | Behaviour |
+> | --- | --- | --- | --- |
+> | _(none)_ | `minmax(120px, 1fr)` | — | Flexible, shares leftover space, min 120px |
+> | `width: "200px"` | `minmax(200px, 200px)` | — | Fixed at exactly 200px |
+> | `width: "2fr"` | `minmax(120px, 2fr)` | — | Flexible with a 2× share, min 120px |
+> | `minWidth: "200px"` | `minmax(200px, max-content)` | — | Content-driven, at least 200px |
+> | `maxWidth: "300px"` | `minmax(0, max-content)` | cell `max-width: 300px` | Content-driven, at most 300px |
+> | `minWidth: "150px", maxWidth: "400px"` | `minmax(150px, max-content)` | cell `max-width: 400px` | Content-driven, clamped to 150–400px |
 >
-> When `minWidth` and/or `maxWidth` is set the track becomes **content-driven** (hugs the cell content) instead of flexible, clamped to those bounds: below `minWidth` it stays at `minWidth`, above `maxWidth` it stops at `maxWidth`, and in between it hugs the content. A content-driven column does **not** absorb leftover space the way `1fr` does — if every column is bounded/fixed, leftover space shows as blank on the right. Leave at least one column unset (or `Nfr`) to soak up the remainder. Otherwise the single `width` value drives the fixed-or-flexible behaviour above.
+> When `minWidth` and/or `maxWidth` is set the track becomes **content-driven** (hugs the cell content) instead of flexible, clamped to those bounds: below `minWidth` it stays at `minWidth`, above `maxWidth` it stops at `maxWidth`, and in between it hugs the content. The upper bound can't live in the grid track itself — neither `minmax(min, fit-content(max))` nor `minmax(min, min(max-content, max))` is valid CSS (both would drop the whole `grid-template-columns` and collapse the table to one column) — so `maxWidth` is enforced per-cell via a generated `max-width` rule, and cells use `overflow: hidden`. A content-driven column does **not** absorb leftover space the way `1fr` does — if every column is bounded/fixed, leftover space shows as blank on the right. Leave at least one column unset (or `Nfr`) to soak up the remainder. Otherwise the single `width` value drives the fixed-or-flexible behaviour above.
 
 ---