@webority/theme 0.103.0 → 0.104.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/theme",
-  "version": "0.103.0",
+  "version": "0.104.1",
   "description": "Webority shared design system — Bootstrap 5.3 SCSS overrides, --wui-* tokens, and shared component CSS. The single source of brand chrome for React portals and Razor sites.",
   "license": "SEE LICENSE IN LICENSE",
   "publishConfig": {
@@ -51,7 +51,7 @@
     "country-flag-icons": "^1.6.20",
     "sass-embedded": "^1.97.0",
     "vite": "^8.0.12",
-    "@webority/tokens": "0.103.0"
+    "@webority/tokens": "0.104.1"
   },
   "scripts": {
     "tokens": "node ../tokens/dist/webority.js brand --library --out ../tokens/dist --web scss/_tokens.generated.scss",

package/scss/_bootstrap.generated.scss

@@ -1,4 +1,4 @@
-// Generated by @webority/tokens 0.103.0 from its token source. Do not edit; run webority brand --library.
+// Generated by @webority/tokens 0.104.1 from its token source. Do not edit; run webority brand --library.
 $body-color: #252f4a !default;
 $body-secondary-color: #4b5675 !default;
 $body-tertiary-color: #626a82 !default;

package/scss/_tokens.generated.scss

@@ -1,4 +1,4 @@
-// Generated by @webority/tokens 0.103.0 from its token source. Do not edit; run webority brand --library.
+// Generated by @webority/tokens 0.104.1 from its token source. Do not edit; run webority brand --library.
 
 :root {
     --wui-primary: #4F46E5;

package/scss/wui/_choice.scss

@@ -73,6 +73,13 @@
     background: var(--color-surface);
     color: var(--color-primary-text);
 }
+// Opt-in (selected-style="filled"): the checked card's icon disc fills with primary. The hover
+// rule above is more specific, so the hovered, enabled card repeats the selector to keep its glyph on-primary.
+.wui-struct-card-filled:has(.struct-card-input:checked) .struct-card-ic,
+.wui-struct-card-filled:has(.struct-card-input:checked):hover:not(:has(.struct-card-input:disabled)) .struct-card-ic {
+    background: var(--color-primary);
+    color: var(--color-on-primary);
+}
 // The linear and bold glyphs are both rendered; the input's checked state picks one.
 .wui-struct-card-glyph-on {
     display: none;

package/scss/wui/_controls.scss

@@ -364,6 +364,14 @@
 .form-switch-pill .form-check-input {
     corner-shape: squircle;
 }
+
+// Round checkbox (app-checkbox shape="circle"): the same glyph, ring, disabled and error states
+// as the square box, drawn as a circle. The wrapper class and the type selector outrank the square
+// box's own radius rule.
+.form-check-circle .form-check-input[type="checkbox"] {
+    border-radius: 50%;
+    corner-shape: round;
+}
 @media (prefers-reduced-motion: reduce) {
     .form-check-input,
     .wui-check,

package/scss/wui/_page-header-bar.scss

@@ -16,7 +16,9 @@
 }
 .page-header.page-header-bar .page-title {
     flex: 0 1 auto;
-    min-width: min(12ch, max-content);
+    // Zero, not a floor: the tools are `flex: none`, so the title must be the part that gives way.
+    // `min()` cannot take `max-content`, and an invalid floor falls back to `auto`, which never shrinks.
+    min-width: 0;
     font-size: 20px;
     overflow: hidden;
     text-overflow: ellipsis;

package/scss/wui/_shell.scss

@@ -521,6 +521,7 @@
     padding: 9px 0;
 }
 .app-shell.collapsed .app-nav-badge,
+.app-shell.collapsed .wui-nav-new,
 .app-shell.collapsed .app-nav-group-label,
 .app-shell.collapsed .wui-nav-group-toggle,
 .app-shell.collapsed .wui-nav-header,
@@ -589,6 +590,19 @@
     color: var(--color-primary-text);
 }
 
+// A "New" pill after a label, shown through a date (`new-until`). It takes the success
+// tint the tone badge uses, so it reads green in every theme.
+.wui-nav-new {
+    flex: none;
+    padding: 0 var(--wui-space-xs);
+    border-radius: var(--wui-radius-pill);
+    background: var(--color-success-soft);
+    font-size: var(--wui-fs-xs);
+    font-weight: var(--wui-fw-bold);
+    line-height: var(--wui-lh-heading);
+    color: var(--color-success-text);
+}
+
 // ── Expandable sub-items ─────────────────────────────────────────────────────
 // A parent row that toggles a nested list. It reuses the .app-nav-item chrome but
 // is a <button>; the caret rotates open. The nested list animates its height via
@@ -968,6 +982,7 @@
     }
     .app-shell.app-shell.collapsed .app-nav-text,
     .app-shell.app-shell.collapsed .app-nav-badge,
+    .app-shell.app-shell.collapsed .wui-nav-new,
     .app-shell.app-shell.collapsed .app-nav-group-label,
     .app-shell.app-shell.collapsed .wui-nav-header,
     .app-shell.app-shell.collapsed .wui-nav-group-after,