@orange-halo/components 1.0.0 → 2.1.0

package/dist/oh-radio-group.js

@@ -35,6 +35,12 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
         this.errorMessage = "";
         this._labelId = `radio-group-label-${Math.random().toString(36).substr(2, 9)}`;
         this._focusedValue = null;
+        /**
+         * 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.
+         */
+        this._announceError = false;
     }
     static { this.styles = [
         baseStyles,
@@ -54,9 +60,9 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
          ═══════════════════════════════════════════════════════════════ */
 
       .group-label {
-        font-family: var(--oh-font-family-sans);
-        font-size: var(--oh-font-size-base);
-        font-weight: var(--oh-font-weight-semibold);
+        font-family: var(--oh-typography-control-font-family);
+        font-size: var(--oh-typography-control-font-size-sm);
+        font-weight: var(--oh-typography-control-font-weight);
         color: var(--oh-color-text-primary);
         margin-bottom: var(--oh-spacing-2);
         display: block;
@@ -96,10 +102,10 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
         width: 24px;
         height: 24px;
         flex-shrink: 0;
-        border: var(--oh-input-base-border-width) solid var(--oh-color-border-emphasis);
-        border-radius: var(--oh-radius-full);
+        border: var(--oh-stroke-control) solid var(--oh-color-border-emphasis);
+        border-radius: var(--oh-shape-pill);
         background-color: var(--oh-color-surface-base);
-        box-shadow: 3px 3px 0 0 var(--oh-shadow-secondary);
+        box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md) 0 0 var(--oh-shadow-secondary);
         transition: 
           transform var(--oh-motion-snappy) var(--oh-motion-ease-playful),
           box-shadow var(--oh-motion-snappy) var(--oh-motion-ease-playful),
@@ -115,15 +121,15 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
         width: 10px;
         height: 10px;
         background-color: var(--oh-color-text-on-brand);
-        border-radius: var(--oh-radius-full);
+        border-radius: var(--oh-shape-pill);
         transform: translate(-50%, -50%) scale(0);
         transition: transform var(--oh-motion-snappy) var(--oh-motion-ease-playful);
       }
 
       .option-label {
-        font-family: var(--oh-font-family-sans);
-        font-size: var(--oh-font-size-lg);
-        line-height: var(--oh-font-line-height-normal);
+        font-family: var(--oh-typography-control-font-family);
+        font-size: var(--oh-typography-control-font-size-md);
+        line-height: var(--oh-typography-body-base-line-height);
         color: var(--oh-color-text-primary);
         user-select: none;
       }
@@ -135,21 +141,21 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
       /* Hover: lift up-left, shadow grows */
       .radio-option:hover .radio-circle {
         border-color: var(--oh-color-border-hover);
-        transform: translate(-1px, -1px);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-secondary);
+        transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-secondary);
       }
 
       /* Active: press down-right, shadow shrinks */
       .radio-option:active .radio-circle {
-        transform: translate(1px, 1px);
-        box-shadow: 1px 1px 0 0 var(--oh-shadow-secondary);
+        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-shadow-secondary);
       }
 
       /* Checked: primary color with warm shadow */
       .native-radio:checked + .radio-circle {
         background-color: var(--oh-color-brand-primary);
         border-color: var(--oh-color-brand-primary);
-        box-shadow: 3px 3px 0 0 var(--oh-shadow-primary);
+        box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md) 0 0 var(--oh-shadow-primary);
       }
 
       .native-radio:checked + .radio-circle::after {
@@ -160,15 +166,15 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
       .radio-option:hover .native-radio:checked + .radio-circle {
         background-color: var(--oh-color-brand-primary-hover);
         border-color: var(--oh-color-brand-primary-hover);
-        transform: translate(-1px, -1px);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-primary);
+        transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-primary);
       }
 
       /* Checked + Active */
       .radio-option:active .native-radio:checked + .radio-circle {
         background-color: var(--oh-color-brand-primary-active);
-        transform: translate(1px, 1px);
-        box-shadow: 1px 1px 0 0 var(--oh-shadow-primary);
+        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-shadow-primary);
       }
 
       /* Focus: underline the label (accessible indicator) */
@@ -189,28 +195,28 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
 
       :host([error]) .radio-circle {
         border-color: var(--oh-color-feedback-error);
-        box-shadow: 3px 3px 0 0 var(--oh-shadow-error);
+        box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md) 0 0 var(--oh-shadow-error);
       }
 
       :host([error]) .radio-option:hover .radio-circle {
         border-color: var(--oh-color-feedback-error-hover);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-error);
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-error);
       }
 
       .error-message {
         display: flex;
         align-items: center;
         gap: var(--oh-spacing-2);
-        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);
         color: var(--oh-color-feedback-error);
         margin-bottom: var(--oh-spacing-2);
       }
 
       .error-icon {
         flex-shrink: 0;
-        width: var(--oh-font-size-lg);
-        height: var(--oh-font-size-lg);
+        width: var(--oh-typography-body-lg-font-size);
+        height: var(--oh-typography-body-lg-font-size);
       }
 
       /* ═══════════════════════════════════════════════════════════════
@@ -236,6 +242,11 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
     _handleBlur() {
         this._focusedValue = null;
     }
+    willUpdate(changed) {
+        if (this.hasUpdated && (changed.has("error") || changed.has("errorMessage"))) {
+            this._announceError = !!(this.error && this.errorMessage);
+        }
+    }
     render() {
         return html `
       <div>
@@ -252,7 +263,7 @@ let OhRadioGroup = class OhRadioGroup extends OhElement {
 
         ${this.error && this.errorMessage
             ? html `
-              <div id="error-msg" class="error-message" role="alert">
+              <div id="error-msg" class="error-message" role=${this._announceError ? "alert" : nothing}>
                 <svg class="error-icon" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                   <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd" />
                 </svg>
@@ -317,6 +328,9 @@ __decorate([
 __decorate([
     state()
 ], OhRadioGroup.prototype, "_focusedValue", void 0);
+__decorate([
+    state()
+], OhRadioGroup.prototype, "_announceError", void 0);
 OhRadioGroup = __decorate([
     customElement("oh-radio-group")
 ], OhRadioGroup);

package/dist/oh-radio-group.js.map

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

package/dist/oh-radio.d.ts

@@ -7,7 +7,7 @@
  * DESIGN DECISIONS:
  * ─────────────────
  * 1. CHUNKY & TACTILE
- *    - Thick 2.5px border
+ *    - Thick border (stroke.control)
  *    - Inset shadow when unchecked (pressed into page)
  *    - Fully circular (radio = circle)
  *
@@ -24,6 +24,7 @@
  *
  * @element oh-radio
  */
+import { type PropertyValues } from "lit";
 import { OhElement } from "./base.js";
 export type RadioState = "default" | "hover" | "focus";
 export declare class OhRadio extends OhElement {
@@ -40,6 +41,14 @@ export declare class OhRadio extends OhElement {
      */
     forceState: RadioState;
     private _handleChange;
+    /**
+     * 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;
+    private _errorId;
+    willUpdate(changed: PropertyValues): void;
     render(): import("lit").TemplateResult<1>;
 }
 declare global {

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

@@ -1 +1 @@
-{"version":3,"file":"oh-radio.d.ts","sourceRoot":"","sources":["../src/oh-radio.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAEvD,qBACa,OAAQ,SAAQ,SAAS;IACpC,OAAgB,MAAM,4BAwMpB;IAGF,OAAO,UAAS;IAGhB,KAAK,SAAM;IAGX,IAAI,SAAM;IAGV,KAAK,SAAM;IAGX,KAAK,UAAS;IAGd,YAAY,SAAM;IAElB;;;OAGG;IAEH,UAAU,EAAE,UAAU,CAAa;IAEnC,OAAO,CAAC,aAAa;IAMrB,MAAM;CAgCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
+{"version":3,"file":"oh-radio.d.ts","sourceRoot":"","sources":["../src/oh-radio.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAEvD,qBACa,OAAQ,SAAQ,SAAS;IACpC,OAAgB,MAAM,4BAwMpB;IAGF,OAAO,UAAS;IAGhB,KAAK,SAAM;IAGX,IAAI,SAAM;IAGV,KAAK,SAAM;IAGX,KAAK,UAAS;IAGd,YAAY,SAAM;IAElB;;;OAGG;IAEH,UAAU,EAAE,UAAU,CAAa;IAEnC,OAAO,CAAC,aAAa;IAMrB;;;;OAIG;IAEH,OAAO,CAAC,cAAc,CAAS;IAE/B,OAAO,CAAC,QAAQ,CAA+D;IAE/E,UAAU,CAAC,OAAO,EAAE,cAAc;IAMlC,MAAM;CAiCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}

package/dist/oh-radio.js

@@ -7,7 +7,7 @@
  * DESIGN DECISIONS:
  * ─────────────────
  * 1. CHUNKY & TACTILE
- *    - Thick 2.5px border
+ *    - Thick border (stroke.control)
  *    - Inset shadow when unchecked (pressed into page)
  *    - Fully circular (radio = circle)
  *
@@ -30,8 +30,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { html, css } from "lit";
-import { customElement, property } from "lit/decorators.js";
+import { html, css, nothing } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
 import { OhElement, baseStyles } from "./base.js";
 let OhRadio = class OhRadio extends OhElement {
     constructor() {
@@ -47,6 +47,13 @@ let OhRadio = class OhRadio extends OhElement {
          * Values: 'hover' | 'focus'
          */
         this.forceState = "default";
+        /**
+         * 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.
+         */
+        this._announceError = false;
+        this._errorId = `oh-radio-error-${Math.random().toString(36).slice(2, 11)}`;
     }
     static { this.styles = [
         baseStyles,
@@ -91,12 +98,12 @@ let OhRadio = class OhRadio extends OhElement {
         flex-shrink: 0;
         
         /* Chunky border, fully circular */
-        border: var(--oh-input-base-border-width) solid var(--oh-color-border-emphasis);
-        border-radius: var(--oh-radius-full);
+        border: var(--oh-stroke-control) solid var(--oh-color-border-emphasis);
+        border-radius: var(--oh-shape-pill);
         
         /* Offset shadow like primary button */
         background-color: var(--oh-color-surface-base);
-        box-shadow: 3px 3px 0 0 var(--oh-shadow-secondary);
+        box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md) 0 0 var(--oh-shadow-secondary);
         
         transition: 
           transform var(--oh-motion-snappy) var(--oh-motion-ease-playful),
@@ -114,7 +121,7 @@ let OhRadio = class OhRadio extends OhElement {
         width: 10px;
         height: 10px;
         background-color: var(--oh-color-text-on-brand);
-        border-radius: var(--oh-radius-full);
+        border-radius: var(--oh-shape-pill);
         transform: translate(-50%, -50%) scale(0);
         transition: transform var(--oh-motion-snappy) var(--oh-motion-ease-playful);
       }
@@ -126,21 +133,21 @@ let OhRadio = class OhRadio extends OhElement {
       /* Hover: lift up-left, shadow grows */
       .radio-wrapper:hover .radio-circle {
         border-color: var(--oh-color-border-hover);
-        transform: translate(-1px, -1px);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-secondary);
+        transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-secondary);
       }
 
       /* Active: press down-right, shadow shrinks */
       .radio-wrapper:active .radio-circle {
-        transform: translate(1px, 1px);
-        box-shadow: 1px 1px 0 0 var(--oh-shadow-secondary);
+        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-shadow-secondary);
       }
 
       /* Checked: primary color with warm shadow */
       .native-radio:checked + .radio-circle {
         background-color: var(--oh-color-brand-primary);
         border-color: var(--oh-color-brand-primary);
-        box-shadow: 3px 3px 0 0 var(--oh-shadow-primary);
+        box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md) 0 0 var(--oh-shadow-primary);
       }
 
       .native-radio:checked + .radio-circle::after {
@@ -151,15 +158,15 @@ let OhRadio = class OhRadio extends OhElement {
       .radio-wrapper:hover .native-radio:checked + .radio-circle {
         background-color: var(--oh-color-brand-primary-hover);
         border-color: var(--oh-color-brand-primary-hover);
-        transform: translate(-1px, -1px);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-primary);
+        transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-primary);
       }
 
       /* Checked + Active */
       .radio-wrapper:active .native-radio:checked + .radio-circle {
         background-color: var(--oh-color-brand-primary-active);
-        transform: translate(1px, 1px);
-        box-shadow: 1px 1px 0 0 var(--oh-shadow-primary);
+        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-shadow-primary);
       }
 
       /* Focus: underline the label (accessible indicator) */
@@ -173,9 +180,9 @@ let OhRadio = class OhRadio extends OhElement {
          ═══════════════════════════════════════════════════════════════ */
 
       .label {
-        font-family: var(--oh-font-family-sans);
-        font-size: var(--oh-font-size-lg);
-        line-height: var(--oh-font-line-height-normal);
+        font-family: var(--oh-typography-control-font-family);
+        font-size: var(--oh-typography-control-font-size-md);
+        line-height: var(--oh-typography-body-base-line-height);
         color: var(--oh-color-text-primary);
         user-select: none;
         padding-top: 0; /* Align with radio */
@@ -187,20 +194,20 @@ let OhRadio = class OhRadio extends OhElement {
 
       :host([error]) .radio-circle {
         border-color: var(--oh-color-feedback-error);
-        box-shadow: 3px 3px 0 0 var(--oh-shadow-error);
+        box-shadow: var(--oh-elevation-offset-md) var(--oh-elevation-offset-md) 0 0 var(--oh-shadow-error);
       }
 
       :host([error]) .radio-wrapper:hover .radio-circle {
         border-color: var(--oh-color-feedback-error-hover);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-error);
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-error);
       }
 
       .error-message {
         display: flex;
         align-items: center;
         gap: var(--oh-spacing-2);
-        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);
         color: var(--oh-color-feedback-error);
         margin-top: var(--oh-spacing-1);
         margin-left: calc(24px + var(--oh-spacing-3)); /* Align with label */
@@ -230,8 +237,8 @@ let OhRadio = class OhRadio extends OhElement {
       /* Forced Hover - Unchecked */
       :host([force-state="hover"]) .radio-circle {
         border-color: var(--oh-color-border-hover);
-        transform: translate(-1px, -1px);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-secondary);
+        transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-secondary);
       }
 
       /* Forced Focus - Unchecked */
@@ -244,8 +251,8 @@ let OhRadio = class OhRadio extends OhElement {
       :host([force-state="hover"][checked]) .radio-circle {
         background-color: var(--oh-color-brand-primary-hover);
         border-color: var(--oh-color-brand-primary-hover);
-        transform: translate(-1px, -1px);
-        box-shadow: 4px 4px 0 0 var(--oh-shadow-primary);
+        transform: translate(var(--oh-lift-hover-sm), var(--oh-lift-hover-sm));
+        box-shadow: var(--oh-elevation-offset-lg) var(--oh-elevation-offset-lg) 0 0 var(--oh-shadow-primary);
       }
     `,
     ]; }
@@ -254,6 +261,11 @@ let OhRadio = class OhRadio extends OhElement {
         this.checked = target.checked;
         this.emit("oh-change", { checked: this.checked, value: this.value });
     }
+    willUpdate(changed) {
+        if (this.hasUpdated && (changed.has("error") || changed.has("errorMessage"))) {
+            this._announceError = !!(this.error && this.errorMessage);
+        }
+    }
     render() {
         const inputId = `oh-radio-${this.name}-${this.value || Math.random().toString(36).substr(2, 9)}`;
         return html `
@@ -267,6 +279,7 @@ let OhRadio = class OhRadio extends OhElement {
             .value=${this.value}
             .checked=${this.checked}
             aria-invalid=${this.error ? "true" : "false"}
+            aria-describedby=${this.error && this.errorMessage ? this._errorId : nothing}
             @change=${this._handleChange}
           />
           <span class="radio-circle" part="circle"></span>
@@ -274,7 +287,7 @@ let OhRadio = class OhRadio extends OhElement {
         </label>
         ${this.error && this.errorMessage
             ? html `
-              <div class="error-message" part="error" role="alert">
+              <div id=${this._errorId} class="error-message" part="error" role=${this._announceError ? "alert" : nothing}>
                 <svg class="error-icon" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                   <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd" />
                 </svg>
@@ -307,6 +320,9 @@ __decorate([
 __decorate([
     property({ type: String, reflect: true, attribute: "force-state" })
 ], OhRadio.prototype, "forceState", void 0);
+__decorate([
+    state()
+], OhRadio.prototype, "_announceError", void 0);
 OhRadio = __decorate([
     customElement("oh-radio")
 ], OhRadio);

package/dist/oh-radio.js.map

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

package/dist/oh-select.d.ts

@@ -7,9 +7,9 @@
  * DESIGN DECISIONS:
  * ─────────────────
  * 1. CHUNKY & TACTILE
- *    - Thick 2.5px border
+ *    - Thick border (stroke.control)
  *    - Offset shadow (sticker effect like button)
- *    - 10px border radius
+ *    - shape.control corners
  *    - Solid warm fills
  *
  * 2. DROPDOWN PANEL
@@ -27,6 +27,7 @@
  *
  * @element oh-select
  */
+import { type PropertyValues } from "lit";
 import { OhElement } from "./base.js";
 export interface SelectOption {
     label: string;
@@ -72,6 +73,13 @@ export declare class OhSelect extends OhElement {
     private _handleClickOutside;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /**
+     * 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-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"oh-select.d.ts","sourceRoot":"","sources":["../src/oh-select.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAIH,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBACa,QAAS,SAAQ,SAAS;IACrC,OAAgB,MAAM,4BA+PpB;IAGF,KAAK,SAAM;IAGX,WAAW,SAAsB;IAGjC,IAAI,SAAM;IAGV,OAAO,EAAE,YAAY,EAAE,CAAM;IAG7B,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,UAAU,SAAM;IAGhB,SAAS,SAAM;IAGf,OAAO,CAAC,KAAK,CAAS;IAGtB,OAAO,CAAC,iBAAiB,CAAM;IAG/B,OAAO,CAAC,QAAQ,CAAS;IAGzB,OAAO,CAAC,QAAQ,CAAqB;IAGrC,OAAO,CAAC,QAAQ,CAAoB;IAEpC,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,UAAU,CAAkE;IACpF,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,gBAAgB,CAAM;IAC9B,OAAO,CAAC,iBAAiB,CAAuB;IAEhD,OAAO,KAAK,eAAe,GAE1B;IAED,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,eAAe;IAKvB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,qBAAqB;IAqE7B,OAAO,CAAC,gBAAgB;IAwBxB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,kBAAkB;IAQ1B,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,oBAAoB;IAO5B,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,uBAAuB;IAI/B,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,mBAAmB,CAIzB;IAEO,iBAAiB;IAKjB,oBAAoB;IAK7B,MAAM;CAyGP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}
+{"version":3,"file":"oh-select.d.ts","sourceRoot":"","sources":["../src/oh-select.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9D,OAAO,EAAE,SAAS,EAAc,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBACa,QAAS,SAAQ,SAAS;IACrC,OAAgB,MAAM,4BAoQpB;IAGF,KAAK,SAAM;IAGX,WAAW,SAAsB;IAGjC,IAAI,SAAM;IAGV,OAAO,EAAE,YAAY,EAAE,CAAM;IAG7B,KAAK,SAAM;IAGX,QAAQ,UAAS;IAGjB,UAAU,SAAM;IAGhB,SAAS,SAAM;IAGf,OAAO,CAAC,KAAK,CAAS;IAGtB,OAAO,CAAC,iBAAiB,CAAM;IAG/B,OAAO,CAAC,QAAQ,CAAS;IAGzB,OAAO,CAAC,QAAQ,CAAqB;IAGrC,OAAO,CAAC,QAAQ,CAAoB;IAEpC,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,UAAU,CAAkE;IACpF,OAAO,CAAC,QAAQ,CAAgE;IAChF,OAAO,CAAC,gBAAgB,CAAM;IAC9B,OAAO,CAAC,iBAAiB,CAAuB;IAEhD,OAAO,KAAK,eAAe,GAE1B;IAED,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,eAAe;IAKvB,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,qBAAqB;IAqE7B,OAAO,CAAC,gBAAgB;IAwBxB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,kBAAkB;IAQ1B,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,oBAAoB;IAO5B,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,uBAAuB;IAI/B,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IASnB,OAAO,CAAC,mBAAmB,CAIzB;IAEO,iBAAiB;IAKjB,oBAAoB;IAK7B;;;;OAIG;IAEH,OAAO,CAAC,cAAc,CAAS;IAE/B,UAAU,CAAC,OAAO,EAAE,cAAc;IAMlC,MAAM;CAyGP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}