ng-hub-ui-ds 22.4.0 → 22.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +18 -0
- package/docs/variables-css-library.en.md +15 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,24 @@ All notable changes to `ng-hub-ui-ds` are documented in this file.
|
|
|
5
5
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
6
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
7
|
|
|
8
|
+
## [22.4.3] - 2026-07-01
|
|
9
|
+
|
|
10
|
+
### Changed
|
|
11
|
+
|
|
12
|
+
- Token-spec MD: documented the six `--hub-icon-*` component tokens (`size`, `color` and the variable-font axes `fill` / `weight` / `grade` / `optical-size`), added by the new `ng-hub-ui-icons` 22.0.0 library. Docs only — no change to the emitted tokens.
|
|
13
|
+
|
|
14
|
+
## [22.4.2] - 2026-06-29
|
|
15
|
+
|
|
16
|
+
### Changed
|
|
17
|
+
|
|
18
|
+
- Token-spec MD: documented the `--hub-breadcrumb-max-item-width` component token (added in `ng-hub-ui-breadcrumbs` 22.3.0 for opt-in item truncation). Docs only — no change to the emitted tokens.
|
|
19
|
+
|
|
20
|
+
## [22.4.1] - 2026-06-29
|
|
21
|
+
|
|
22
|
+
### Changed
|
|
23
|
+
|
|
24
|
+
- Token-spec MD: documented the `--hub-badge-max-width` component token (added in `ng-hub-ui-badges` 22.4.0 for content truncation). Docs only — no change to the emitted tokens.
|
|
25
|
+
|
|
8
26
|
## [22.4.0] - 2026-06-26
|
|
9
27
|
|
|
10
28
|
### Added
|
|
@@ -726,6 +726,7 @@ Source legend:
|
|
|
726
726
|
| `--hub-breadcrumb-link-hover-color` | `var(--hub-sys-link-hover-color, #0a58ca)` | Text color of breadcrumb links on hover | `IN_USE` | `breadcrumbs/src/lib/components/breadcrumb/breadcrumb.component.scss:16` |
|
|
727
727
|
| `--hub-breadcrumb-link-decoration` | `none` | Text decoration of breadcrumb links | `IN_USE` | `breadcrumbs/src/lib/components/breadcrumb/breadcrumb.component.scss:17` |
|
|
728
728
|
| `--hub-breadcrumb-link-hover-decoration` | `underline` | Text decoration of breadcrumb links on hover | `IN_USE` | `breadcrumbs/src/lib/components/breadcrumb/breadcrumb.component.scss:18` |
|
|
729
|
+
| `--hub-breadcrumb-max-item-width` | `12rem` | Max width of a breadcrumb item label before it is clipped with an ellipsis (opt-in via the `truncateItems` input) | `IN_USE` | `breadcrumbs/src/lib/components/breadcrumb/breadcrumb.component.scss:32` |
|
|
729
730
|
|
|
730
731
|
### `calendar`
|
|
731
732
|
|
|
@@ -978,6 +979,7 @@ The `detail` token set is defined as a single, standardized collection that supp
|
|
|
978
979
|
| `--hub-badge-focus-ring-width` | `var(--hub-sys-focus-ring-width, 0.25rem)` | Badge focus ring width | `IN_USE` | `badges/src/lib/components/badge/badge.component.scss:30` |
|
|
979
980
|
| `--hub-badge-font-family` | `var(--hub-ref-font-family-base, inherit)` | Badge font family | `IN_USE` | `badges/src/lib/components/badge/badge.component.scss:14` |
|
|
980
981
|
| `--hub-badge-font-size` | `0.875rem` | Badge font size | `IN_USE` | `badges/src/lib/components/badge/badge.component.scss:15` |
|
|
982
|
+
| `--hub-badge-max-width` | `100%` | Badge max width (truncation bound for the content ellipsis) | `IN_USE` | `badges/src/lib/components/badge/badge.component.scss:40` |
|
|
981
983
|
| `--hub-badge-font-weight` | `600` | Badge font weight | `IN_USE` | `badges/src/lib/components/badge/badge.component.scss:16` |
|
|
982
984
|
| `--hub-badge-gap` | `0.375rem` | Badge gap | `IN_USE` | `badges/src/lib/components/badge/badge.component.scss:21` |
|
|
983
985
|
| `--hub-badge-letter-spacing` | `0.01em` | Badge letter spacing | `IN_USE` | `badges/src/lib/components/badge/badge.component.scss:18` |
|
|
@@ -2064,6 +2066,19 @@ The navigation strip is **semantic-accent aware**: a single `--hub-panels-accent
|
|
|
2064
2066
|
| `--hub-milestone-pending-color` | `var(--hub-sys-text-muted, #6c757d)` | Pending node text color | `IN_USE` | `milestones/src/lib/milestones.component.scss:14` |
|
|
2065
2067
|
| `--hub-milestone-spacing` | `1.75rem` | Spacing between node and content | `IN_USE` | `milestones/src/lib/milestones.component.scss:21` |
|
|
2066
2068
|
|
|
2069
|
+
### `icons`
|
|
2070
|
+
|
|
2071
|
+
Agnostic icon renderer (`ng-hub-ui-icons`). One token set themes any icon pack (Font Awesome, Bootstrap Icons, Material Symbols, Solar, custom SVG) uniformly. The variable-font axes (`fill`/`weight`/`grade`/`optical-size`) are applied via `font-variation-settings` and only affect variable icon fonts such as Material Symbols.
|
|
2072
|
+
|
|
2073
|
+
| Token | Initial value | Usage | Status | Source |
|
|
2074
|
+
| ----- | ------------- | ----- | ------ | ------ |
|
|
2075
|
+
| `--hub-icon-size` | `1em` | Icon size (font-size for glyphs; width/height for SVG/img) | `IN_USE` | `icons/src/lib/styles/_icon-base.scss:11` |
|
|
2076
|
+
| `--hub-icon-color` | `currentColor` | Icon color (color for glyphs; fill for SVG) | `IN_USE` | `icons/src/lib/styles/_icon-base.scss:12` |
|
|
2077
|
+
| `--hub-icon-fill` | `0` | Variable-font `FILL` axis (Material Symbols) | `IN_USE` | `icons/src/lib/styles/_icon-base.scss:16` |
|
|
2078
|
+
| `--hub-icon-weight` | `400` | Variable-font `wght` axis (Material Symbols) | `IN_USE` | `icons/src/lib/styles/_icon-base.scss:17` |
|
|
2079
|
+
| `--hub-icon-grade` | `0` | Variable-font `GRAD` axis (Material Symbols) | `IN_USE` | `icons/src/lib/styles/_icon-base.scss:18` |
|
|
2080
|
+
| `--hub-icon-optical-size` | `24` | Variable-font `opsz` axis (Material Symbols) | `IN_USE` | `icons/src/lib/styles/_icon-base.scss:19` |
|
|
2081
|
+
|
|
2067
2082
|
## Appendix
|
|
2068
2083
|
|
|
2069
2084
|
### Glossary
|