@genesislcap/rapid-design-system 15.16.0 → 15.17.0

package/dist/custom-elements.json

@@ -804,6 +804,86 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/_config/configure.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "configureRapidDesignSystem",
+          "return": {
+            "type": {
+              "text": "void"
+            }
+          },
+          "parameters": [
+            {
+              "name": "provider",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "config",
+              "type": {
+                "text": "Partial<DesignTokensConfig>"
+              }
+            }
+          ],
+          "description": "Extends configureDesignSystem with support for the `secondary`, `tertiary`, `error`,\n`success`, and `warning` color palettes.\n\nPass any of these entries under `design_tokens.color` in your config to override the defaults.\nOmitting any of them is safe — existing apps are unaffected and each token falls back to its\nbuilt-in default.",
+          "privacy": "public"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "configureRapidDesignSystem",
+          "declaration": {
+            "name": "configureRapidDesignSystem",
+            "module": "src/_config/configure.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/_config/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./configure"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./styles"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./tokens"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./values"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/accordion/accordion.styles.ts",
@@ -952,86 +1032,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/_config/configure.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "configureRapidDesignSystem",
-          "return": {
-            "type": {
-              "text": "void"
-            }
-          },
-          "parameters": [
-            {
-              "name": "provider",
-              "type": {
-                "text": "HTMLElement"
-              }
-            },
-            {
-              "name": "config",
-              "type": {
-                "text": "Partial<DesignTokensConfig>"
-              }
-            }
-          ],
-          "description": "Extends configureDesignSystem with support for the `secondary`, `tertiary`, `error`,\n`success`, and `warning` color palettes.\n\nPass any of these entries under `design_tokens.color` in your config to override the defaults.\nOmitting any of them is safe — existing apps are unaffected and each token falls back to its\nbuilt-in default.",
-          "privacy": "public"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "configureRapidDesignSystem",
-          "declaration": {
-            "name": "configureRapidDesignSystem",
-            "module": "src/_config/configure.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/_config/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./configure"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./styles"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./tokens"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./values"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/accordion-item/accordion-item.styles.ts",
@@ -38060,8 +38060,9 @@
               "type": {
                 "text": "boolean"
               },
-              "description": "When true, the control will be immutable by user interaction. See https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled | disabled HTML attribute for more information.",
-              "fieldName": "disabled",
+              "description": "Draws sustained attention to the tab while background work is pending, for example\nwhile a grid behind an inactive tab still holds rows awaiting action.\n\nThe design system supplies the visuals, retintable per app with `--tab-alert-color`. The flash\nsamples a shared document-level clock, so every alerting surface — including grid rows — stays\nin phase; retime them all together with `--alert-flash-duration` on `:root`. Motion is\nsuppressed under `prefers-reduced-motion`, which shows a static alert colour instead.",
+              "fieldName": "alert",
+              "default": "false",
               "inheritedFrom": {
                 "name": "Tab",
                 "module": "src/tab/tab.ts"
@@ -38069,6 +38070,34 @@
             }
           ],
           "members": [
+            {
+              "kind": "field",
+              "name": "alert",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Draws sustained attention to the tab while background work is pending, for example\nwhile a grid behind an inactive tab still holds rows awaiting action.\n\nThe design system supplies the visuals, retintable per app with `--tab-alert-color`. The flash\nsamples a shared document-level clock, so every alerting surface — including grid rows — stays\nin phase; retime them all together with `--alert-flash-duration` on `:root`. Motion is\nsuppressed under `prefers-reduced-motion`, which shows a static alert colour instead.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "Tab",
+                "module": "src/tab/tab.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "alertChanged",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "inheritedFrom": {
+                "name": "Tab",
+                "module": "src/tab/tab.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "disabled",

package/dist/dts/tab/tab.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tab.styles.d.ts","sourceRoot":"","sources":["../../../src/tab/tab.styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,KAAK,EACV,wBAAwB,EACxB,2BAA2B,EAC5B,MAAM,4BAA4B,CAAC;AAEpC,eAAO,MAAM,cAAc,GACzB,SAAS,wBAAwB,EACjC,YAAY,2BAA2B,KACtC,aAiBF,CAAC"}
+{"version":3,"file":"tab.styles.d.ts","sourceRoot":"","sources":["../../../src/tab/tab.styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,KAAK,EACV,wBAAwB,EACxB,2BAA2B,EAC5B,MAAM,4BAA4B,CAAC;AAEpC,eAAO,MAAM,cAAc,GACzB,SAAS,wBAAwB,EACjC,YAAY,2BAA2B,KACtC,aAkDF,CAAC"}

package/dist/esm/tab/tab.styles.js

@@ -1,4 +1,4 @@
-import { foundationTabStyles } from '@genesislcap/foundation-ui';
+import { alertFlashPhaseProperty, foundationTabStyles } from '@genesislcap/foundation-ui';
 import { css } from '@microsoft/fast-element';
 export const rapidTabStyles = (context, definition) => css `
   ${foundationTabStyles(context, definition)}
@@ -17,4 +17,37 @@ export const rapidTabStyles = (context, definition) => css `
     background-color: var(--neutral-layer-4);
     font-weight: 700;
   }
+
+  /*
+   * Sustained alert, sampling the flash phase the platform animates on the document. Every
+   * alerting surface reads that one value, so tabs and grid rows brighten and fade together
+   * however long ago each of them started alerting.
+   *
+   * Mixing towards transparent and currentColor lets the tab fade back to its own resting
+   * colours, so selected and unselected tabs each return to the right background.
+   *
+   * !important because a :host rule loses to any app stylesheet that colours tabs from the light
+   * DOM, and an alert nobody can see is worse than no alert.
+   */
+  :host([alert]) {
+    background-color: color-mix(
+      in srgb,
+      var(--tab-alert-color, var(--error-fill-rest)) calc(var(${alertFlashPhaseProperty}, 0) * 100%),
+      transparent
+    ) !important;
+    color: color-mix(
+      in srgb,
+      contrast-color(var(--tab-alert-color, var(--error-fill-rest)))
+        calc(var(${alertFlashPhaseProperty}, 0) * 100%),
+      currentColor
+    ) !important;
+  }
+
+  /* Reduced motion stops the clock, leaving the phase at 0, so paint a steady alert instead. */
+  @media (prefers-reduced-motion: reduce) {
+    :host([alert]) {
+      background-color: var(--tab-alert-color, var(--error-fill-rest)) !important;
+      color: contrast-color(var(--tab-alert-color, var(--error-fill-rest))) !important;
+    }
+  }
 `;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/rapid-design-system",
   "description": "Rapid Design System",
-  "version": "15.16.0",
+  "version": "15.17.0",
   "sideEffects": false,
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
@@ -38,13 +38,13 @@
   },
   "devDependencies": {
     "@genesiscommunitysuccess/analyzer-import-alias-plugin": "^5.0.3",
-    "@genesislcap/foundation-testing": "15.16.0",
-    "@genesislcap/genx": "15.16.0",
-    "@genesislcap/rollup-builder": "15.16.0",
-    "@genesislcap/ts-builder": "15.16.0",
-    "@genesislcap/uvu-playwright-builder": "15.16.0",
-    "@genesislcap/vite-builder": "15.16.0",
-    "@genesislcap/webpack-builder": "15.16.0",
+    "@genesislcap/foundation-testing": "15.17.0",
+    "@genesislcap/genx": "15.17.0",
+    "@genesislcap/rollup-builder": "15.17.0",
+    "@genesislcap/ts-builder": "15.17.0",
+    "@genesislcap/uvu-playwright-builder": "15.17.0",
+    "@genesislcap/vite-builder": "15.17.0",
+    "@genesislcap/webpack-builder": "15.17.0",
     "flexlayout-react": "^0.8.19"
   },
   "peerDependencies": {
@@ -56,9 +56,9 @@
     }
   },
   "dependencies": {
-    "@genesislcap/foundation-logger": "15.16.0",
-    "@genesislcap/foundation-ui": "15.16.0",
-    "@genesislcap/foundation-utils": "15.16.0",
+    "@genesislcap/foundation-logger": "15.17.0",
+    "@genesislcap/foundation-ui": "15.17.0",
+    "@genesislcap/foundation-utils": "15.17.0",
     "@microsoft/fast-colors": "5.3.1",
     "@microsoft/fast-components": "2.30.6",
     "@microsoft/fast-element": "1.14.0",
@@ -94,5 +94,5 @@
       "require": "./dist/react.cjs"
     }
   },
-  "gitHead": "2cacfdef54a332ee571ae784b5b7629cf66f050f"
+  "gitHead": "2e040c4861f6acfde7afef48b60555548fac8708"
 }