@orange-halo/components 1.0.0 → 2.1.0

package/dist/oh-modal.js

@@ -6,12 +6,12 @@
  * DESIGN DECISIONS:
  * ─────────────────
  * 1. CHUNKY & LIFTED
- *    - 2.5px border like other components
- *    - Offset shadow (4px 4px) — feels like a lifted surface
+ *    - stroke.control border like other components
+ *    - Offset shadow (elevation.offset.2xl) — feels like a lifted surface
  *    - Warm backdrop, not pure black
  *
  * 2. ACCESSIBLE
- *    - Focus trap when open
+ *    - Focus trap when open (focus guards at each end of the dialog)
  *    - Escape key closes (when dismissible)
  *    - Focus returns to trigger on close
  *    - role="dialog" + aria-modal="true"
@@ -32,6 +32,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html, css, nothing } from "lit";
 import { customElement, property, query, state } from "lit/decorators.js";
 import { OhElement, baseStyles } from "./base.js";
+import { getFocusableElementsDeep } from "@orange-halo/utils";
 let OhModal = class OhModal extends OhElement {
     constructor() {
         super(...arguments);
@@ -63,7 +64,7 @@ let OhModal = class OhModal extends OhElement {
         z-index: 1000;
         
         /* Warm semi-transparent overlay */
-        background-color: rgba(61, 50, 41, 0.6);
+        background-color: var(--oh-modal-overlay);
         
         /* Flexbox centering */
         display: flex;
@@ -71,17 +72,22 @@ let OhModal = class OhModal extends OhElement {
         justify-content: center;
         padding: var(--oh-spacing-4);
         
-        /* Animation */
+        /* Animation. Closing: fade, then hide once the fade ends. */
         opacity: 0;
         visibility: hidden;
-        transition: 
-          opacity var(--oh-motion-gentle, 200ms) ease,
-          visibility var(--oh-motion-gentle, 200ms) ease;
+        transition:
+          opacity var(--oh-motion-gentle) ease,
+          visibility 0s linear var(--oh-motion-gentle);
       }
 
+      /* Opening: visible at once, so focus can move into the dialog on the
+         next frame (a hidden element can't take focus). */
       .backdrop--open {
         opacity: 1;
         visibility: visible;
+        transition:
+          opacity var(--oh-motion-gentle) ease,
+          visibility 0s;
       }
 
       /* ═══════════════════════════════════════════════════════════════
@@ -99,18 +105,18 @@ let OhModal = class OhModal extends OhElement {
         background-color: var(--oh-color-surface-base);
         
         /* Chunky border */
-        border: var(--oh-input-base-border-width, 2.5px) solid var(--oh-color-border-emphasis);
-        border-radius: var(--oh-radius-md);
+        border: var(--oh-stroke-control) solid var(--oh-color-border-emphasis);
+        border-radius: var(--oh-shape-container);
         
         /* Offset shadow — lifted surface */
-        box-shadow: 6px 6px 0 0 rgba(107, 93, 77, 0.25);
+        box-shadow: var(--oh-elevation-offset-2xl) var(--oh-elevation-offset-2xl) 0 0 var(--oh-shadow-overlay);
         
         /* Animation */
         transform: scale(0.95) translateY(10px);
         opacity: 0;
         transition: 
-          transform var(--oh-motion-gentle, 200ms) var(--oh-motion-ease-playful, cubic-bezier(0.34, 1.56, 0.64, 1)),
-          opacity var(--oh-motion-gentle, 200ms) ease;
+          transform var(--oh-motion-gentle) var(--oh-motion-ease-playful),
+          opacity var(--oh-motion-gentle) ease;
       }
 
       .backdrop--open .modal {
@@ -141,16 +147,16 @@ let OhModal = class OhModal extends OhElement {
         justify-content: space-between;
         gap: var(--oh-spacing-4);
         padding: var(--oh-spacing-4) var(--oh-spacing-5);
-        border-bottom: var(--oh-input-base-border-width, 2.5px) solid var(--oh-color-border-subtle);
+        border-bottom: var(--oh-stroke-control) solid var(--oh-color-border-subtle);
       }
 
       .modal-title {
         margin: 0;
-        font-family: var(--oh-font-family-sans);
-        font-size: var(--oh-font-size-xl);
-        font-weight: var(--oh-font-weight-semibold);
+        font-family: var(--oh-typography-body-font-family);
+        font-size: var(--oh-typography-heading-h4-font-size);
+        font-weight: var(--oh-typography-heading-h4-font-weight);
         color: var(--oh-color-text-primary);
-        line-height: var(--oh-font-line-height-tight, 1.25);
+        line-height: var(--oh-typography-heading-h1-line-height);
       }
 
       /* ═══════════════════════════════════════════════════════════════
@@ -165,31 +171,31 @@ let OhModal = class OhModal extends OhElement {
         
         padding: var(--oh-spacing-1) var(--oh-spacing-2);
         
-        font-family: var(--oh-font-family-sans);
-        font-size: var(--oh-font-size-base);
-        font-weight: var(--oh-font-weight-medium);
+        font-family: var(--oh-typography-body-font-family);
+        font-size: var(--oh-typography-body-base-font-size);
+        font-weight: var(--oh-typography-label-base-font-weight);
         
         background: transparent;
         border: none;
-        border-radius: var(--oh-radius-sm);
+        border-radius: var(--oh-shape-compact);
         cursor: pointer;
         color: var(--oh-color-text-primary);
         
         transition: 
-          transform var(--oh-motion-snappy, 150ms) var(--oh-motion-ease-playful, cubic-bezier(0.34, 1.56, 0.64, 1)),
-          box-shadow var(--oh-motion-snappy, 150ms) var(--oh-motion-ease-playful, cubic-bezier(0.34, 1.56, 0.64, 1)),
-          background-color var(--oh-motion-quick, 120ms) ease;
+          transform var(--oh-motion-snappy) var(--oh-motion-ease-playful),
+          box-shadow var(--oh-motion-snappy) var(--oh-motion-ease-playful),
+          background-color var(--oh-motion-quick) ease;
       }
 
       .modal-close:hover {
-        background-color: rgba(0, 0, 0, 0.08);
-        transform: translate(-2px, -2px);
-        box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.15);
+        background-color: var(--oh-close-button-background-hover);
+        transform: translate(var(--oh-lift-hover-md), var(--oh-lift-hover-md));
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-close-button-shadow-hover);
       }
 
       .modal-close:active {
-        transform: translate(1px, 1px);
-        box-shadow: 1px 1px 0 0 rgba(0, 0, 0, 0.15);
+        transform: translate(var(--oh-lift-press-sm), var(--oh-lift-press-sm));
+        box-shadow: var(--oh-elevation-offset-xs) var(--oh-elevation-offset-xs) 0 0 var(--oh-close-button-shadow-hover);
       }
 
       .modal-close:focus-visible {
@@ -212,9 +218,9 @@ let OhModal = class OhModal extends OhElement {
         overflow-y: auto;
         padding: var(--oh-spacing-5);
         
-        font-family: var(--oh-font-family-sans);
-        font-size: var(--oh-font-size-base);
-        line-height: var(--oh-font-line-height-normal);
+        font-family: var(--oh-typography-body-font-family);
+        font-size: var(--oh-typography-body-base-font-size);
+        line-height: var(--oh-typography-body-base-line-height);
         color: var(--oh-color-text-primary);
       }
 
@@ -228,7 +234,7 @@ let OhModal = class OhModal extends OhElement {
         justify-content: flex-start;
         gap: var(--oh-spacing-6);
         padding: var(--oh-spacing-4) var(--oh-spacing-5);
-        border-top: var(--oh-input-base-border-width, 2.5px) solid var(--oh-color-border-subtle);
+        border-top: var(--oh-stroke-control) solid var(--oh-color-border-subtle);
       }
 
       /* Hide footer if empty */
@@ -243,6 +249,15 @@ let OhModal = class OhModal extends OhElement {
         gap: var(--oh-spacing-6);
       }
 
+      /* Focus guards: focusable but never seen; focus moves on at once. */
+      .focus-guard {
+        position: absolute;
+        width: 1px;
+        height: 1px;
+        overflow: hidden;
+        clip-path: inset(50%);
+      }
+
       /* ═══════════════════════════════════════════════════════════════
          REDUCED MOTION
          ═══════════════════════════════════════════════════════════════ */
@@ -253,7 +268,11 @@ let OhModal = class OhModal extends OhElement {
         .modal-close {
           transition-duration: 0.01ms !important;
         }
-        
+
+        .backdrop {
+          transition-delay: 0s !important;
+        }
+
         .modal {
           transform: none !important;
         }
@@ -275,8 +294,13 @@ let OhModal = class OhModal extends OhElement {
         }
     }
     _onOpen() {
-        // Store the currently focused element
-        this._previousActiveElement = document.activeElement;
+        // Store the currently focused element, following focus into shadow
+        // roots: a trigger inside another component is reported as its host,
+        // which can't take focus back.
+        let active = document.activeElement;
+        while (active?.shadowRoot?.activeElement)
+            active = active.shadowRoot.activeElement;
+        this._previousActiveElement = active;
         // Prevent body scroll
         document.body.style.overflow = "hidden";
         // Add keyboard listener
@@ -307,43 +331,20 @@ let OhModal = class OhModal extends OhElement {
             this._requestClose();
             return;
         }
-        if (event.key === "Tab") {
-            this._trapFocus(event);
-        }
-    }
-    _trapFocus(event) {
-        const focusableElements = this._getFocusableElements();
-        if (focusableElements.length === 0)
-            return;
-        const firstElement = focusableElements[0];
-        const lastElement = focusableElements[focusableElements.length - 1];
-        if (event.shiftKey) {
-            // Shift + Tab
-            if (document.activeElement === firstElement) {
-                event.preventDefault();
-                lastElement.focus();
-            }
-        }
-        else {
-            // Tab
-            if (document.activeElement === lastElement) {
-                event.preventDefault();
-                firstElement.focus();
-            }
-        }
     }
+    /** Focusable elements in the dialog, in tab order, excluding the guards. */
     _getFocusableElements() {
-        const selector = [
-            'button:not([disabled])',
-            'a[href]',
-            'input:not([disabled])',
-            'select:not([disabled])',
-            'textarea:not([disabled])',
-            '[tabindex]:not([tabindex="-1"])',
-        ].join(', ');
-        const shadowElements = Array.from(this.shadowRoot?.querySelectorAll(selector) || []);
-        const slottedElements = Array.from(this.querySelectorAll(selector));
-        return [...shadowElements, ...slottedElements];
+        const dialog = this.renderRoot.querySelector(".modal");
+        return dialog ? getFocusableElementsDeep(dialog).filter((el) => !el.classList.contains("focus-guard")) : [];
+    }
+    /**
+     * Focus guards: Tab past the last control lands on the end guard, which
+     * wraps to the first; Shift+Tab before the first wraps to the last. This
+     * holds however the browser orders Tab (Safari skips links by default).
+     */
+    _focusEdge(edge) {
+        const items = this._getFocusableElements();
+        (edge === "first" ? items[0] : items[items.length - 1])?.focus();
     }
     _focusFirstElement() {
         const focusableElements = this._getFocusableElements();
@@ -388,6 +389,7 @@ let OhModal = class OhModal extends OhElement {
           aria-labelledby=${labelId || nothing}
           part="modal"
         >
+          <span class="focus-guard" tabindex="0" @focus=${() => this._focusEdge("last")}></span>
           ${this.heading || this.dismissible
             ? html `
                 <header class="modal-header" part="header">
@@ -420,6 +422,7 @@ let OhModal = class OhModal extends OhElement {
           <footer class="modal-footer" part="footer">
             <slot name="footer"></slot>
           </footer>
+          <span class="focus-guard" tabindex="0" @focus=${() => this._focusEdge("first")}></span>
         </div>
       </div>
     `;

package/dist/oh-modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"oh-modal.js","sourceRoot":"","sources":["../src/oh-modal.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"oh-modal.js","sourceRoot":"","sources":["../src/oh-modal.ts"],"names":[],"mappings":"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"}

package/dist/oh-navbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"oh-navbar.d.ts","sourceRoot":"","sources":["../src/oh-navbar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,iBAAiB,CAAC;AACzB,OAAO,gBAAgB,CAAC;AACxB,OAAO,gBAAgB,CAAC;AACxB,OAAO,cAAc,CAAC;AAEtB,qBACa,QAAS,SAAQ,SAAS;IACrC,OAAgB,MAAM,4BA2EpB;IAEF,yCAAyC;IAEzC,aAAa,SAAU;IAGvB,OAAO,CAAC,WAAW,CAAS;IAE5B,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,YAAY;IAIpB,MAAM;CA0CP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}
+{"version":3,"file":"oh-navbar.d.ts","sourceRoot":"","sources":["../src/oh-navbar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,iBAAiB,CAAC;AACzB,OAAO,gBAAgB,CAAC;AACxB,OAAO,gBAAgB,CAAC;AACxB,OAAO,cAAc,CAAC;AAEtB,qBACa,QAAS,SAAQ,SAAS;IACrC,OAAgB,MAAM,4BA0EpB;IAEF,yCAAyC;IAEzC,aAAa,SAAU;IAGvB,OAAO,CAAC,WAAW,CAAS;IAE5B,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,YAAY;IAIpB,MAAM;CA0CP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}

package/dist/oh-navbar.js

@@ -53,10 +53,9 @@ let OhNavbar = class OhNavbar extends OhElement {
       :host {
         display: block;
         background-color: var(--oh-color-surface-base);
-        border-bottom: var(--oh-border-width-md) solid var(--oh-color-border-default);
         box-shadow: 0 2px 8px var(--oh-focus-glow-color);
-        font-family: var(--oh-font-family-sans);
-        font-size: var(--oh-font-size-base);
+        font-family: var(--oh-typography-body-font-family);
+        font-size: var(--oh-typography-body-base-font-size);
       }
 
       .navbar {
@@ -104,7 +103,7 @@ let OhNavbar = class OhNavbar extends OhElement {
 
       .drawer-nav ::slotted(oh-link) {
         padding: var(--oh-spacing-3) 0;
-        border-bottom: 1px solid var(--oh-color-border-subtle);
+        border-bottom: var(--oh-stroke-divider) solid var(--oh-color-border-subtle);
       }
 
       .drawer-nav ::slotted(oh-link:last-child) {
@@ -149,7 +148,7 @@ let OhNavbar = class OhNavbar extends OhElement {
               variant="primary"
               size="sm"
               icon-only
-              aria-label="Open navigation menu"
+              accessible-label="Open navigation menu"
               @click=${this._openDrawer}
             >
               <oh-icon name="menu"></oh-icon>

package/dist/oh-navbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"oh-navbar.js","sourceRoot":"","sources":["../src/oh-navbar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;;;;;;;AAEH,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAElD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,iBAAiB,CAAC;AACzB,OAAO,gBAAgB,CAAC;AACxB,OAAO,gBAAgB,CAAC;AACxB,OAAO,cAAc,CAAC;AAGf,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,SAAS;IAAhC;;QA8EL,yCAAyC;QAEzC,kBAAa,GAAG,MAAM,CAAC;QAGf,gBAAW,GAAG,KAAK,CAAC;IAoD9B,CAAC;aAtIiB,WAAM,GAAG;QACvB,UAAU;QACV,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAwEF;KACF,AA3EqB,CA2EpB;IASM,WAAW;QACjB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IAC1B,CAAC;IAEO,YAAY;QAClB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;IAC3B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;uBAoBQ,IAAI,CAAC,WAAW;;;;;;;;;;;kBAWrB,IAAI,CAAC,aAAa;gBACpB,IAAI,CAAC,WAAW;oBACZ,IAAI,CAAC,YAAY;;;;;;KAMhC,CAAC;IACJ,CAAC;;AAtDD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;+CACjC;AAGf;IADP,KAAK,EAAE;6CACoB;AAnFjB,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAuIpB"}
+{"version":3,"file":"oh-navbar.js","sourceRoot":"","sources":["../src/oh-navbar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;;;;;;;AAEH,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAElD,OAAO,mBAAmB,CAAC;AAC3B,OAAO,iBAAiB,CAAC;AACzB,OAAO,gBAAgB,CAAC;AACxB,OAAO,gBAAgB,CAAC;AACxB,OAAO,cAAc,CAAC;AAGf,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,SAAS;IAAhC;;QA6EL,yCAAyC;QAEzC,kBAAa,GAAG,MAAM,CAAC;QAGf,gBAAW,GAAG,KAAK,CAAC;IAoD9B,CAAC;aArIiB,WAAM,GAAG;QACvB,UAAU;QACV,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAuEF;KACF,AA1EqB,CA0EpB;IASM,WAAW;QACjB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IAC1B,CAAC;IAEO,YAAY;QAClB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;IAC3B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;uBAoBQ,IAAI,CAAC,WAAW;;;;;;;;;;;kBAWrB,IAAI,CAAC,aAAa;gBACpB,IAAI,CAAC,WAAW;oBACZ,IAAI,CAAC,YAAY;;;;;;KAMhC,CAAC;IACJ,CAAC;;AAtDD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;+CACjC;AAGf;IADP,KAAK,EAAE;6CACoB;AAlFjB,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAsIpB"}

package/dist/oh-progress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"oh-progress.d.ts","sourceRoot":"","sources":["../src/oh-progress.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AACjF,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9C,qBACa,UAAW,SAAQ,SAAS;IACvC,OAAgB,MAAM,4BA4KpB;IAEF,0DAA0D;IAE1D,KAAK,SAAK;IAEV,kCAAkC;IAElC,GAAG,SAAO;IAEV,+DAA+D;IAE/D,KAAK,SAAc;IAEnB,sDAAsD;IAEtD,SAAS,UAAS;IAElB,4CAA4C;IAE5C,SAAS,UAAQ;IAEjB,mBAAmB;IAEnB,IAAI,EAAE,YAAY,CAAQ;IAE1B,oBAAoB;IAEpB,OAAO,EAAE,eAAe,CAAW;IAEnC,0CAA0C;IAE1C,OAAO,UAAS;IAEhB,2CAA2C;IAC3C,OAAO,KAAK,UAAU,GAGrB;IAED,MAAM;CAwCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
+{"version":3,"file":"oh-progress.d.ts","sourceRoot":"","sources":["../src/oh-progress.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AACjF,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE9C,qBACa,UAAW,SAAQ,SAAS;IACvC,OAAgB,MAAM,4BA8JpB;IAEF,0DAA0D;IAE1D,KAAK,SAAK;IAEV,kCAAkC;IAElC,GAAG,SAAO;IAEV,+DAA+D;IAE/D,KAAK,SAAc;IAEnB,sDAAsD;IAEtD,SAAS,UAAS;IAElB,4CAA4C;IAE5C,SAAS,UAAQ;IAEjB,mBAAmB;IAEnB,IAAI,EAAE,YAAY,CAAQ;IAE1B,oBAAoB;IAEpB,OAAO,EAAE,eAAe,CAAW;IAEnC,0CAA0C;IAE1C,OAAO,UAAS;IAEhB,2CAA2C;IAC3C,OAAO,KAAK,UAAU,GAGrB;IAED,MAAM;CAwCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}

package/dist/oh-progress.js

@@ -69,7 +69,7 @@ let OhProgress = class OhProgress extends OhElement {
         display: flex;
         align-items: center;
         gap: var(--oh-spacing-3);
-        font-family: var(--oh-font-family-sans);
+        font-family: var(--oh-typography-body-font-family);
       }
 
       /* ═══════════════════════════════════════════════════════════════
@@ -79,10 +79,10 @@ let OhProgress = class OhProgress extends OhElement {
       .progress__track {
         flex: 1;
         background-color: var(--oh-color-surface-inset);
-        border: var(--oh-border-width-chunky, 2.5px) solid var(--oh-color-border-default);
-        border-radius: var(--oh-radius-full);
+        border: var(--oh-stroke-control) solid var(--oh-color-border-default);
+        border-radius: var(--oh-shape-pill);
         overflow: hidden;
-        box-shadow: inset 2px 2px 0 0 rgba(0, 0, 0, 0.06);
+        box-shadow: inset var(--oh-elevation-offset-sm) var(--oh-elevation-offset-sm) 0 0 var(--oh-progress-track-inset-shadow);
       }
 
       /* Size variants for track height */
@@ -104,8 +104,8 @@ let OhProgress = class OhProgress extends OhElement {
 
       .progress__fill {
         height: 100%;
-        border-radius: var(--oh-radius-full);
-        transition: width var(--oh-motion-relaxed, 300ms) var(--oh-motion-ease-gentle, ease-out);
+        border-radius: var(--oh-shape-pill);
+        transition: width var(--oh-motion-relaxed) var(--oh-motion-ease-gentle);
         min-width: 0;
       }
 
@@ -135,8 +135,8 @@ let OhProgress = class OhProgress extends OhElement {
          ═══════════════════════════════════════════════════════════════ */
 
       .progress__value {
-        font-size: var(--oh-font-size-base);
-        font-weight: var(--oh-font-weight-medium);
+        font-size: var(--oh-typography-body-base-font-size);
+        font-weight: var(--oh-typography-label-base-font-weight);
         color: var(--oh-color-text-primary);
         min-width: 3.5ch;
         text-align: right;
@@ -144,11 +144,11 @@ let OhProgress = class OhProgress extends OhElement {
       }
 
       .progress--sm .progress__value {
-        font-size: var(--oh-font-size-base);
+        font-size: var(--oh-typography-body-base-font-size);
       }
 
       .progress--lg .progress__value {
-        font-size: var(--oh-font-size-lg);
+        font-size: var(--oh-typography-body-lg-font-size);
       }
 
       /* Hide value text when showValue is false */
@@ -169,8 +169,8 @@ let OhProgress = class OhProgress extends OhElement {
          ═══════════════════════════════════════════════════════════════ */
 
       .progress__label {
-        font-size: var(--oh-font-size-base);
-        font-weight: var(--oh-font-weight-medium);
+        font-size: var(--oh-typography-body-base-font-size);
+        font-weight: var(--oh-typography-label-base-font-weight);
         color: var(--oh-color-text-primary);
         margin-bottom: var(--oh-spacing-2);
       }
@@ -180,38 +180,24 @@ let OhProgress = class OhProgress extends OhElement {
          ═══════════════════════════════════════════════════════════════ */
 
       :host([inverse]) .progress__track {
-        background-color: rgba(255, 255, 255, 0.15);
-        border-color: rgba(255, 255, 255, 0.3);
+        background-color: var(--oh-progress-inverse-track-background);
+        border-color: var(--oh-progress-inverse-track-border);
         box-shadow: none;
       }
 
       :host([inverse]) .progress__value {
-        color: var(--oh-color-surface-white);
+        color: var(--oh-color-text-on-brand);
       }
 
       :host([inverse]) .progress__label {
-        color: var(--oh-color-surface-white);
+        color: var(--oh-color-text-on-brand);
       }
 
-      /* Inverse fill - use honey/gold for better visibility on dark */
-      :host([inverse]) .progress--brand .progress__fill {
-        background-color: var(--oh-color-honey, #E8A838);
-      }
-
-      :host([inverse]) .progress--success .progress__fill {
-        background-color: #6FCF97;
-      }
-
-      :host([inverse]) .progress--info .progress__fill {
-        background-color: #6FB3CF;
-      }
-
-      :host([inverse]) .progress--warning .progress__fill {
-        background-color: var(--oh-color-honey, #E8A838);
-      }
-
-      :host([inverse]) .progress--error .progress__fill {
-        background-color: #EB8989;
+      /* Inverse fill — one solid cream fill for every variant, so the bar
+         keeps 3:1+ contrast against the track on brand/accent backgrounds
+         (the old honey/pastel fills were 1.6–1.9:1). */
+      :host([inverse]) .progress__fill {
+        background-color: var(--oh-progress-inverse-fill);
       }
 
       /* ═══════════════════════════════════════════════════════════════

package/dist/oh-progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"oh-progress.js","sourceRoot":"","sources":["../src/oh-progress.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"oh-progress.js","sourceRoot":"","sources":["../src/oh-progress.ts"],"names":[],"mappings":"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"}

package/dist/oh-radio-group.d.ts

@@ -14,6 +14,7 @@
  *
  * @element oh-radio-group
  */
+import { type PropertyValues } from "lit";
 import { OhElement } from "./base.js";
 export interface RadioOption {
     label: string;
@@ -33,6 +34,13 @@ export declare class OhRadioGroup extends OhElement {
     private _handleChange;
     private _handleFocus;
     private _handleBlur;
+    /**
+     * Errors that appear after first render (e.g. on submit) are announced via
+     * role="alert". Errors present on page load are only linked with
+     * aria-describedby, so they aren't read out unprompted.
+     */
+    private _announceError;
+    willUpdate(changed: PropertyValues): void;
     render(): import("lit").TemplateResult<1>;
 }
 declare global {

package/dist/oh-radio-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"oh-radio-group.d.ts","sourceRoot":"","sources":["../src/oh-radio-group.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBACa,YAAa,SAAQ,SAAS;IACzC,OAAgB,MAAM,4BA4LpB;IAGF,KAAK,SAAM;IAGX,IAAI,SAAM;IAGV,OAAO,EAAE,WAAW,EAAE,CAAM;IAG5B,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,KAAK,UAAS;IAGd,YAAY,SAAM;IAGlB,OAAO,CAAC,QAAQ,CAAkE;IAGlF,OAAO,CAAC,aAAa,CAAuB;IAE5C,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IAInB,MAAM;CAuDP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}
+{"version":3,"file":"oh-radio-group.d.ts","sourceRoot":"","sources":["../src/oh-radio-group.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBACa,YAAa,SAAQ,SAAS;IACzC,OAAgB,MAAM,4BA4LpB;IAGF,KAAK,SAAM;IAGX,IAAI,SAAM;IAGV,OAAO,EAAE,WAAW,EAAE,CAAM;IAG5B,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,KAAK,UAAS;IAGd,YAAY,SAAM;IAGlB,OAAO,CAAC,QAAQ,CAAkE;IAGlF,OAAO,CAAC,aAAa,CAAuB;IAE5C,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IAInB;;;;OAIG;IAEH,OAAO,CAAC,cAAc,CAAS;IAE/B,UAAU,CAAC,OAAO,EAAE,cAAc;IAMlC,MAAM;CAuDP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}