ui-style-kit-css 2.4.1 → 2.5.0

package/CHANGELOG.md

@@ -4,6 +4,52 @@ All notable changes to **UI Style Kit CSS** will be documented here.
 
 ## [Unreleased]
 
+## [2.5.0] - 2026-09-26
+
+### Added
+
+- Promoted 46 reusable Tier A and Tier B selectors for tabs, pagination, breadcrumb, skeleton, empty state, metric, chip, avatar, stepper, toast, popover, menu, segmented control, file upload, dropzone, and listbox patterns.
+- Added semantic chip and toast variants plus explicit skeleton-shape and step-state hooks.
+- Added deterministic generic-markup coverage for every promoted selector across all 20 runtime-selectable presets.
+
+### Changed
+
+- Extended the generated universal component foundation so each promoted semantic selector resolves through preset-native paint tokens without moving behavioral state into CSS.
+- Reclassified promoted suffixes from preset-only extras into the universal class inventory while retaining existing prefixed compatibility classes.
+- Aligned the current compatibility matrix with the reviewed `interactive-surface-css@1.7.3` and `layout-style-css@3.2.3` release commits.
+
+### Fixed
+
+- Recalibrated the pairwise identity snapshot metric to retain subtle palette differences and use viewport-specific component floors, replacing accumulating pair exceptions with one documented comparison contract.
+
+### Tests
+
+- Added a focused promotion contract covering manifest roles, universal source suffixes, implementation status, variants, and state hooks.
+- Expanded semantic alias, fixture, and declaration-artifact checks for the 75-selector stable component API.
+- Verified all approved desktop and mobile component and native-control snapshot pairs against the repaired identity contract.
+
+## [2.4.2] - 2026-09-24
+
+### Changed
+
+- Aligned the local candidate matrix with `interactive-surface-css@1.7.1` and `layout-style-css@3.2.1` while retaining the published minimum support floor.
+- Expanded migration guidance for preset-prefixed hooks, preset-private tokens, and legacy `variant-*` state classes without adding a public variant API.
+- Restored Organic Modern's authored select indicator, preserved Y2K's indicator through its late field material, aligned Retro Glass info icons with their semantic status color, and strengthened small Art Deco copy over layered dark cards.
+- Scoped Bento's retained Soft Mosaic tokens to its sheet, and restored state-specific specificity for its invalid and read-only controls.
+- Capped Art Deco's 12rem action measure at the available flex width so 200% text zoom remains contained.
+- Preserved distinct Y2K invalid and read-only paint for both prefixed and unclassed native fields after its late bevel reset.
+
+### Tests
+
+- Added focused Chromium coverage for semantic cards at 320px and 390px with native controls, long content, internally scrolling wide tables, and icon-only actions.
+- Added a short-height fixture proving consumer-owned sticky positioning and internal scrolling survive the visual bundle.
+- Added representative preset coverage proving icon-only actions retain neutral or subtle paint rather than inheriting primary action treatment.
+- Added an exact-version coordinated-candidate preflight so unpublished local companion packages can be verified without weakening the registry-backed minimum matrix.
+- Made WebKit's exhaustive Neumorphism pass use an engine-appropriate timeout and sampled Technical Blueprint connector geometry atomically to avoid cross-frame reflow noise.
+- Refreshed the fixed visual baselines after the verified identity corrections and calibrated pairwise comparison floors against the closest valid preset pairs.
+- Extended the visual state probes to include material-bearing pseudo-elements, covering Neo Noir's themed and pressed action faces.
+- Verified the complete 4,500-case preset, theme, mode, and browser matrix with resumable one-case recovery for the Y2K state regression.
+
 ## [2.4.1] - 2026-09-20
 
 ### Added

package/README.md

@@ -9,11 +9,11 @@ It is separate from, but complementary to, **Interactive Surface CSS** and **Lay
 
 ## Current release
 
-Version `v2.4.1` adds Signal Yellow, Botanical Green, Cobalt Electric, Stone Graphite, and Walnut Clay, bringing the registry to 25 shared color themes. Every added theme includes light, dark, and contrast modes, while existing palettes, selectors, and default/focused/visual/bridge entrypoints remain compatible.
+Version `v2.5.0` is a backward-compatible semantic-component release. It promotes reusable tabs, pagination, breadcrumb, skeleton, empty-state, metric, chip, avatar, stepper, toast, popover, menu, segmented-control, file-upload, dropzone, and listbox patterns into the stable `.ui-*` API while preserving preset-owned paint.
 
-The available browser matrix now covers 20 presets × 25 themes × 3 modes × 3 engines (4,500 combinations). Signal Yellow keeps its vivid yellow fills while using readable light-mode ink across prefixed and semantic components.
+The available browser matrix continues to cover 20 presets × 25 themes × 3 modes × 3 engines (4,500 combinations). The `v2.4.1` theme additions and Signal Yellow contrast corrections remain unchanged.
 
-The `v2.4.0` baseline introduced complete native-control identities, native light/dark/contrast palettes when `data-theme` is omitted, a palette-aware color workbench, a unified demo with style-specific components, and exactly pinned parser-based minification. See the [2.4.1 release notes](docs/RELEASE-2.4.1.md) for the current scope and verification boundaries.
+The `v2.4.0` baseline introduced complete native-control identities, native light/dark/contrast palettes when `data-theme` is omitted, a palette-aware color workbench, a unified demo with style-specific components, and exactly pinned parser-based minification. See the [2.5.0 release notes](docs/RELEASE-2.5.0.md) for the release scope and verification boundaries.
 
 [Showcase website](https://foscat.github.io/ui-style-kit-css/)
 
@@ -56,11 +56,11 @@ These libraries stay standalone, but the current aligned set is:
 
 | Library | Aligned version | Owns |
 |---|---:|---|
-| `ui-style-kit-css@2.4.1` | current release target | visual identity, color themes, UI paint, native HTML styling, content wrapping, and bridge tokens |
-| `interactive-surface-css@1.7.0` | compatible state release | interaction-state primitives, surface behavior, state layers, and input affordances |
-| `layout-style-css@3.1.0` | compatible structural release | structural wrappers, grids, sections, app shells, and layout recipes |
+| `ui-style-kit-css@2.5.0` | current release | visual identity, color themes, UI paint, native HTML styling, content wrapping, and bridge tokens |
+| `interactive-surface-css@1.7.3` | compatible state release | interaction-state primitives, surface behavior, state layers, and input affordances |
+| `layout-style-css@3.2.3` | compatible structural release | structural wrappers, grids, sections, app shells, and layout recipes |
 
-UI Style Kit `2.4.1` is the current release target and is verified with Interactive Surface `1.7.0`. Layout Style `3.1.0` is the compatible structural release. The validated minimum remains `ui-style-kit-css@2.1.0`, `interactive-surface-css@1.5.0`, and `layout-style-css@3.0.0`.
+UI Style Kit `2.5.0` is the current release and is aligned with the reviewed Interactive Surface `1.7.3` and Layout Style `3.2.3` releases. The validated minimum remains `ui-style-kit-css@2.1.0`, `interactive-surface-css@1.5.0`, and `layout-style-css@3.0.0`.
 
 Use one, two, or all three depending on the project. UI Style Kit does not require the sibling libraries, and the optional bridge only maps shared `--usk-*` roles into Interactive Surface tokens when consumers import it.
 
@@ -115,7 +115,7 @@ Use the generated default bundle for semantic components that can switch across
 import "ui-style-kit-css";
 ```
 
-Use `ui-style-kit-css/visual.css` for the same 29-selector semantic runtime API without the deprecated prefixed layout selectors. The generated default, visual, and with-bridge bundles all support all 20 `data-ui` values.
+Use `ui-style-kit-css/visual.css` for the same 75-selector semantic runtime API without the deprecated prefixed layout selectors. The generated default, visual, and with-bridge bundles all support all 20 `data-ui` values.
 
 Applications fixed to one preset can use a generated focused visual entrypoint. It includes semantic aliases scoped to that preset only:
 
@@ -169,15 +169,15 @@ When the bridge is attached, add `.interactive-surface` to interactable elements
 
 | Import | Raw | Gzip | Best for |
 |---|---:|---:|---|
-| `ui-style-kit-css/dist/ui-style-kit.min.css` | ~1994 KB | ~381 KB | Compatible runtime UI-system switchers and demos |
-| `ui-style-kit-css/visual.min.css` | ~1977 KB | ~379 KB | Runtime visual switching with consumer-owned layout |
-| `ui-style-kit-css/with-bridge.css` | ~2327 KB | ~402 KB | Deprecated runtime switcher plus stateful bridge |
+| `ui-style-kit-css/dist/ui-style-kit.min.css` | ~2151 KB | ~394 KB | Compatible runtime UI-system switchers and demos |
+| `ui-style-kit-css/visual.min.css` | ~2135 KB | ~392 KB | Runtime visual switching with consumer-owned layout |
+| `ui-style-kit-css/with-bridge.css` | ~2494 KB | ~418 KB | Deprecated runtime switcher plus stateful bridge |
 | `ui-style-kit-css/theme-colors.css` | ~64 KB | ~8 KB | Shared color schemes for standalone style imports |
 | `ui-style-kit-css/native-elements.css` | ~31 KB | ~5 KB | Shared native HTML fallback styling |
 | `ui-style-kit-css/content-overflow.css` | ~20 KB | ~3 KB | Shared long-text containment for standalone style imports |
 | `ui-style-kit-css/interactive-surface-theme.css` | ~9 KB | ~1 KB | Canonical token-and-paint bridge for Interactive Surface state core |
-| `ui-style-kit-css/visual/minimal-saas.css` | ~219 KB | ~32 KB | Focused Minimal SaaS, including semantic aliases and shared foundations |
-| `ui-style-kit-css/visual/industrial-utility.css` | ~291 KB | ~41 KB | Focused Industrial Utility, including its instrumentation styles |
+| `ui-style-kit-css/visual/minimal-saas.css` | ~334 KB | ~43 KB | Focused Minimal SaaS, including semantic aliases and shared foundations |
+| `ui-style-kit-css/visual/industrial-utility.css` | ~409 KB | ~53 KB | Focused Industrial Utility, including its instrumentation styles |
 
 ## CDN usage
 
@@ -234,7 +234,7 @@ The demo labels this choice **None — style defaults**. Do not assign the liter
 
 ## Semantic component API
 
-`manifest.json#semanticComponentApi` is the authoritative specification for the implemented generic component API. Its 29 selectors keep the same class names while `data-ui` changes across all 20 presets. `implementationStatus` records the two retained `.ui-spinner` and `.ui-tooltip` hooks, the 27 generated semantic aliases, and an empty pending set.
+`manifest.json#semanticComponentApi` is the authoritative specification for the implemented generic component API. Its 75 selectors keep the same class names while `data-ui` changes across all 20 presets. `implementationStatus` records the two retained `.ui-spinner` and `.ui-tooltip` hooks, the 73 generated semantic aliases, and an empty pending set.
 
 | Role | Generic selectors | Switching coverage |
 |---|---|---|
@@ -248,15 +248,34 @@ The demo labels this choice **None — style defaults**. Do not assign the liter
 | Table | `.ui-table`, `.ui-table-wrap` | all 20 presets |
 | Progress | `.ui-progress`, `.ui-progress-bar` | all 20 presets |
 | Toolbar | `.ui-toolbar` | all 20 presets |
+| Tabs | `.ui-tabs`, `.ui-tab-list`, `.ui-tab`, `.ui-tab-panel` | all 20 presets |
+| Pagination | `.ui-pagination`, `.ui-pagination-item`, `.ui-pagination-link` | all 20 presets |
+| Breadcrumb | `.ui-breadcrumb`, `.ui-breadcrumb-list`, `.ui-breadcrumb-item`, `.ui-breadcrumb-link`, `.ui-breadcrumb-separator` | all 20 presets |
+| Skeleton | `.ui-skeleton` | all 20 presets |
+| Empty state | `.ui-empty-state`, `.ui-empty-state-icon`, `.ui-empty-state-title`, `.ui-empty-state-body`, `.ui-empty-state-actions` | all 20 presets |
+| Metric | `.ui-metric`, `.ui-metric-label`, `.ui-metric-value`, `.ui-metric-detail` | all 20 presets |
+| Chip | `.ui-chip`, `.ui-chip-group` | all 20 presets |
+| Avatar | `.ui-avatar`, `.ui-avatar-group` | all 20 presets |
+| Stepper | `.ui-stepper`, `.ui-step`, `.ui-step-marker`, `.ui-step-label` | all 20 presets |
+| Toast | `.ui-toast-stack`, `.ui-toast`, `.ui-toast-title`, `.ui-toast-body`, `.ui-toast-actions` | all 20 presets |
+| Popover | `.ui-popover` | all 20 presets |
+| Menu | `.ui-menu`, `.ui-menu-item`, `.ui-menu-group`, `.ui-menu-separator` | all 20 presets |
+| Segmented control | `.ui-segmented-control`, `.ui-segment` | all 20 presets |
+| File upload | `.ui-file-upload`, `.ui-dropzone` | all 20 presets |
+| Listbox | `.ui-listbox`, `.ui-listbox-option` | all 20 presets |
 | Existing generic hooks | `.ui-spinner`, `.ui-tooltip` | all 20 presets |
 
-The only new attribute is context-constrained `data-ui-variant`. Omit it for the neutral treatment.
+Semantic paint variants use context-constrained `data-ui-variant`. Omit it for the neutral treatment.
 
 | Selector | `data-ui-variant` values |
 |---|---|
-| `.ui-button` | `primary`, `secondary`, `danger`, `ghost` |
+| `.ui-button` | `primary`, `secondary`, `warning`, `danger`, `ghost` |
 | `.ui-badge` | `primary`, `secondary`, `success`, `warning`, `danger` |
 | `.ui-alert` | `success`, `warning`, `danger` |
+| `.ui-chip` | `primary`, `secondary`, `success`, `warning`, `danger` |
+| `.ui-toast` | `info`, `success`, `warning`, `danger` |
+
+Skeleton shape uses `data-shape="text|circle|block"`. Step workflow presentation uses `data-state="complete|current|upcoming|error"`; React and application code remain responsible for behavior and ARIA state.
 
 ```html
 <body data-ui="minimal-saas" data-theme="arctic-indigo" data-mode="light">