@aurodesignsystem-dev/auro-formkit 0.0.0-pr1269.7 → 0.0.0-pr1269.8

package/components/checkbox/demo/api.min.js

@@ -172,6 +172,9 @@ class AuroCheckbox extends i$2 {
     this.error = false;
     this.onDark = false;
     this.touched = false;
+    this.tabIndex = 0;
+    this.ariaChecked = 'false';
+    this.role = 'checkbox';
 
     /**
      * @private
@@ -268,6 +271,55 @@ class AuroCheckbox extends i$2 {
         attribute: false
       },
 
+      /**
+       * The tabindex attribute for the checkbox.
+       * @private
+       */
+      tabIndex: {
+        type: Number,
+        reflect: true,
+        attribute: 'tabindex'
+      },
+
+      /**
+       * The aria-checked attribute for the checkbox.
+       * @private
+       */
+      ariaChecked: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-checked'
+      },
+
+      /**
+       * The role attribute for the checkbox.
+       * @private
+       */
+      role: {
+        type: String,
+        reflect: true
+      },
+
+      /**
+       * The aria-label attribute for the checkbox.
+       * @private
+       */
+      ariaLabel: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-label'
+      },
+
+      /**
+       * The aria-disabled attribute for the checkbox.
+       * @private
+       */
+      ariaDisabled: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-disabled'
+      },
+
     };
   }
 
@@ -361,8 +413,7 @@ class AuroCheckbox extends i$2 {
     this.inputId = this.id ? `${this.id}-input` : window.crypto.randomUUID();
 
     // Set initial ARIA state
-    this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
-    this.setAttribute('tabindex', '0');
+    this.ariaChecked = this.checked ? 'true' : 'false';
 
     // Set accessible name from slot content, but only if consumer hasn't provided an explicit aria-label
     const hasExplicitAriaLabel = this.hasAttribute('aria-label');
@@ -375,7 +426,7 @@ class AuroCheckbox extends i$2 {
             join('').
             trim();
           if (text) {
-            this.setAttribute('aria-label', text);
+            this.ariaLabel = text;
           }
         };
 
@@ -412,8 +463,8 @@ class AuroCheckbox extends i$2 {
   connectedCallback() {
     super.connectedCallback();
 
-    // Set role unconditionally to prevent consumers from breaking a11y
-    this.setAttribute('role', 'checkbox');
+    // Role is set via property to prevent consumers from breaking a11y
+    this.role = 'checkbox';
 
     this.handleKeyDown = this.handleKeyDown.bind(this);
     this.addEventListener('keydown', this.handleKeyDown);
@@ -435,15 +486,11 @@ class AuroCheckbox extends i$2 {
     super.updated(changedProperties);
 
     if (changedProperties.has('checked')) {
-      this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
+      this.ariaChecked = this.checked ? 'true' : 'false';
     }
 
     if (changedProperties.has('disabled')) {
-      if (this.disabled) {
-        this.setAttribute('aria-disabled', 'true');
-      } else {
-        this.removeAttribute('aria-disabled');
-      }
+      this.ariaDisabled = this.disabled ? 'true' : undefined;
     }
   }
 
@@ -1650,7 +1697,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/checkbox/demo/index.min.js

@@ -164,6 +164,9 @@ class AuroCheckbox extends i$2 {
     this.error = false;
     this.onDark = false;
     this.touched = false;
+    this.tabIndex = 0;
+    this.ariaChecked = 'false';
+    this.role = 'checkbox';
 
     /**
      * @private
@@ -260,6 +263,55 @@ class AuroCheckbox extends i$2 {
         attribute: false
       },
 
+      /**
+       * The tabindex attribute for the checkbox.
+       * @private
+       */
+      tabIndex: {
+        type: Number,
+        reflect: true,
+        attribute: 'tabindex'
+      },
+
+      /**
+       * The aria-checked attribute for the checkbox.
+       * @private
+       */
+      ariaChecked: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-checked'
+      },
+
+      /**
+       * The role attribute for the checkbox.
+       * @private
+       */
+      role: {
+        type: String,
+        reflect: true
+      },
+
+      /**
+       * The aria-label attribute for the checkbox.
+       * @private
+       */
+      ariaLabel: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-label'
+      },
+
+      /**
+       * The aria-disabled attribute for the checkbox.
+       * @private
+       */
+      ariaDisabled: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-disabled'
+      },
+
     };
   }
 
@@ -353,8 +405,7 @@ class AuroCheckbox extends i$2 {
     this.inputId = this.id ? `${this.id}-input` : window.crypto.randomUUID();
 
     // Set initial ARIA state
-    this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
-    this.setAttribute('tabindex', '0');
+    this.ariaChecked = this.checked ? 'true' : 'false';
 
     // Set accessible name from slot content, but only if consumer hasn't provided an explicit aria-label
     const hasExplicitAriaLabel = this.hasAttribute('aria-label');
@@ -367,7 +418,7 @@ class AuroCheckbox extends i$2 {
             join('').
             trim();
           if (text) {
-            this.setAttribute('aria-label', text);
+            this.ariaLabel = text;
           }
         };
 
@@ -404,8 +455,8 @@ class AuroCheckbox extends i$2 {
   connectedCallback() {
     super.connectedCallback();
 
-    // Set role unconditionally to prevent consumers from breaking a11y
-    this.setAttribute('role', 'checkbox');
+    // Role is set via property to prevent consumers from breaking a11y
+    this.role = 'checkbox';
 
     this.handleKeyDown = this.handleKeyDown.bind(this);
     this.addEventListener('keydown', this.handleKeyDown);
@@ -427,15 +478,11 @@ class AuroCheckbox extends i$2 {
     super.updated(changedProperties);
 
     if (changedProperties.has('checked')) {
-      this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
+      this.ariaChecked = this.checked ? 'true' : 'false';
     }
 
     if (changedProperties.has('disabled')) {
-      if (this.disabled) {
-        this.setAttribute('aria-disabled', 'true');
-      } else {
-        this.removeAttribute('aria-disabled');
-      }
+      this.ariaDisabled = this.disabled ? 'true' : undefined;
     }
   }
 
@@ -1642,7 +1689,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/checkbox/dist/auro-checkbox.d.ts

@@ -79,6 +79,50 @@ export class AuroCheckbox extends LitElement {
             reflect: boolean;
             attribute: boolean;
         };
+        /**
+         * The tabindex attribute for the checkbox.
+         * @private
+         */
+        tabIndex: {
+            type: NumberConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        /**
+         * The aria-checked attribute for the checkbox.
+         * @private
+         */
+        ariaChecked: {
+            type: StringConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        /**
+         * The role attribute for the checkbox.
+         * @private
+         */
+        role: {
+            type: StringConstructor;
+            reflect: boolean;
+        };
+        /**
+         * The aria-label attribute for the checkbox.
+         * @private
+         */
+        ariaLabel: {
+            type: StringConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        /**
+         * The aria-disabled attribute for the checkbox.
+         * @private
+         */
+        ariaDisabled: {
+            type: StringConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
     };
     /**
      * This will register this element with the browser.

package/components/checkbox/dist/index.js

@@ -124,6 +124,9 @@ class AuroCheckbox extends LitElement {
     this.error = false;
     this.onDark = false;
     this.touched = false;
+    this.tabIndex = 0;
+    this.ariaChecked = 'false';
+    this.role = 'checkbox';
 
     /**
      * @private
@@ -220,6 +223,55 @@ class AuroCheckbox extends LitElement {
         attribute: false
       },
 
+      /**
+       * The tabindex attribute for the checkbox.
+       * @private
+       */
+      tabIndex: {
+        type: Number,
+        reflect: true,
+        attribute: 'tabindex'
+      },
+
+      /**
+       * The aria-checked attribute for the checkbox.
+       * @private
+       */
+      ariaChecked: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-checked'
+      },
+
+      /**
+       * The role attribute for the checkbox.
+       * @private
+       */
+      role: {
+        type: String,
+        reflect: true
+      },
+
+      /**
+       * The aria-label attribute for the checkbox.
+       * @private
+       */
+      ariaLabel: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-label'
+      },
+
+      /**
+       * The aria-disabled attribute for the checkbox.
+       * @private
+       */
+      ariaDisabled: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-disabled'
+      },
+
     };
   }
 
@@ -313,8 +365,7 @@ class AuroCheckbox extends LitElement {
     this.inputId = this.id ? `${this.id}-input` : window.crypto.randomUUID();
 
     // Set initial ARIA state
-    this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
-    this.setAttribute('tabindex', '0');
+    this.ariaChecked = this.checked ? 'true' : 'false';
 
     // Set accessible name from slot content, but only if consumer hasn't provided an explicit aria-label
     const hasExplicitAriaLabel = this.hasAttribute('aria-label');
@@ -327,7 +378,7 @@ class AuroCheckbox extends LitElement {
             join('').
             trim();
           if (text) {
-            this.setAttribute('aria-label', text);
+            this.ariaLabel = text;
           }
         };
 
@@ -364,8 +415,8 @@ class AuroCheckbox extends LitElement {
   connectedCallback() {
     super.connectedCallback();
 
-    // Set role unconditionally to prevent consumers from breaking a11y
-    this.setAttribute('role', 'checkbox');
+    // Role is set via property to prevent consumers from breaking a11y
+    this.role = 'checkbox';
 
     this.handleKeyDown = this.handleKeyDown.bind(this);
     this.addEventListener('keydown', this.handleKeyDown);
@@ -387,15 +438,11 @@ class AuroCheckbox extends LitElement {
     super.updated(changedProperties);
 
     if (changedProperties.has('checked')) {
-      this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
+      this.ariaChecked = this.checked ? 'true' : 'false';
     }
 
     if (changedProperties.has('disabled')) {
-      if (this.disabled) {
-        this.setAttribute('aria-disabled', 'true');
-      } else {
-        this.removeAttribute('aria-disabled');
-      }
+      this.ariaDisabled = this.disabled ? 'true' : undefined;
     }
   }
 
@@ -1595,7 +1642,7 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/checkbox/dist/registered.js

@@ -124,6 +124,9 @@ class AuroCheckbox extends LitElement {
     this.error = false;
     this.onDark = false;
     this.touched = false;
+    this.tabIndex = 0;
+    this.ariaChecked = 'false';
+    this.role = 'checkbox';
 
     /**
      * @private
@@ -220,6 +223,55 @@ class AuroCheckbox extends LitElement {
         attribute: false
       },
 
+      /**
+       * The tabindex attribute for the checkbox.
+       * @private
+       */
+      tabIndex: {
+        type: Number,
+        reflect: true,
+        attribute: 'tabindex'
+      },
+
+      /**
+       * The aria-checked attribute for the checkbox.
+       * @private
+       */
+      ariaChecked: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-checked'
+      },
+
+      /**
+       * The role attribute for the checkbox.
+       * @private
+       */
+      role: {
+        type: String,
+        reflect: true
+      },
+
+      /**
+       * The aria-label attribute for the checkbox.
+       * @private
+       */
+      ariaLabel: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-label'
+      },
+
+      /**
+       * The aria-disabled attribute for the checkbox.
+       * @private
+       */
+      ariaDisabled: {
+        type: String,
+        reflect: true,
+        attribute: 'aria-disabled'
+      },
+
     };
   }
 
@@ -313,8 +365,7 @@ class AuroCheckbox extends LitElement {
     this.inputId = this.id ? `${this.id}-input` : window.crypto.randomUUID();
 
     // Set initial ARIA state
-    this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
-    this.setAttribute('tabindex', '0');
+    this.ariaChecked = this.checked ? 'true' : 'false';
 
     // Set accessible name from slot content, but only if consumer hasn't provided an explicit aria-label
     const hasExplicitAriaLabel = this.hasAttribute('aria-label');
@@ -327,7 +378,7 @@ class AuroCheckbox extends LitElement {
             join('').
             trim();
           if (text) {
-            this.setAttribute('aria-label', text);
+            this.ariaLabel = text;
           }
         };
 
@@ -364,8 +415,8 @@ class AuroCheckbox extends LitElement {
   connectedCallback() {
     super.connectedCallback();
 
-    // Set role unconditionally to prevent consumers from breaking a11y
-    this.setAttribute('role', 'checkbox');
+    // Role is set via property to prevent consumers from breaking a11y
+    this.role = 'checkbox';
 
     this.handleKeyDown = this.handleKeyDown.bind(this);
     this.addEventListener('keydown', this.handleKeyDown);
@@ -387,15 +438,11 @@ class AuroCheckbox extends LitElement {
     super.updated(changedProperties);
 
     if (changedProperties.has('checked')) {
-      this.setAttribute('aria-checked', this.checked ? 'true' : 'false');
+      this.ariaChecked = this.checked ? 'true' : 'false';
     }
 
     if (changedProperties.has('disabled')) {
-      if (this.disabled) {
-        this.setAttribute('aria-disabled', 'true');
-      } else {
-        this.removeAttribute('aria-disabled');
-      }
+      this.ariaDisabled = this.disabled ? 'true' : undefined;
     }
   }
 
@@ -1595,7 +1642,7 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/combobox/demo/api.min.js

@@ -4303,7 +4303,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$2 = '202601082113';
+var formkitVersion$2 = '202601212058';
 
 let AuroElement$2 = class AuroElement extends i$3 {
   static get properties() {
@@ -11928,7 +11928,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$1 = '202601082113';
+var formkitVersion$1 = '202601212058';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -12918,7 +12918,7 @@ class AuroBibtemplate extends i$3 {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 var styleCss$3 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
 

package/components/combobox/demo/index.min.js

@@ -4175,7 +4175,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$2 = '202601082113';
+var formkitVersion$2 = '202601212058';
 
 let AuroElement$2 = class AuroElement extends i$3 {
   static get properties() {
@@ -11800,7 +11800,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$1 = '202601082113';
+var formkitVersion$1 = '202601212058';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -12790,7 +12790,7 @@ class AuroBibtemplate extends i$3 {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 var styleCss$3 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
 

package/components/combobox/dist/index.js

@@ -4089,7 +4089,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$2 = '202601082113';
+var formkitVersion$2 = '202601212058';
 
 let AuroElement$2 = class AuroElement extends LitElement {
   static get properties() {
@@ -11707,7 +11707,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$1 = '202601082113';
+var formkitVersion$1 = '202601212058';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -12697,7 +12697,7 @@ class AuroBibtemplate extends LitElement {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 var styleCss$1 = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
 

package/components/combobox/dist/registered.js

@@ -4089,7 +4089,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$2 = '202601082113';
+var formkitVersion$2 = '202601212058';
 
 let AuroElement$2 = class AuroElement extends LitElement {
   static get properties() {
@@ -11707,7 +11707,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
   }
 };
 
-var formkitVersion$1 = '202601082113';
+var formkitVersion$1 = '202601212058';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -12697,7 +12697,7 @@ class AuroBibtemplate extends LitElement {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 var styleCss$1 = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
 

package/components/counter/demo/api.min.js

@@ -1437,7 +1437,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
   }
 };
 
-var formkitVersion$1 = '202601082113';
+var formkitVersion$1 = '202601212058';
 
 /* eslint-disable lit/binding-positions, lit/no-invalid-html, max-lines */
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
@@ -4972,7 +4972,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 let AuroElement$1 = class AuroElement extends i$2 {
   static get properties() {

package/components/counter/demo/index.min.js

@@ -1437,7 +1437,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$2 {
   }
 };
 
-var formkitVersion$1 = '202601082113';
+var formkitVersion$1 = '202601212058';
 
 /* eslint-disable lit/binding-positions, lit/no-invalid-html, max-lines */
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
@@ -4972,7 +4972,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202601082113';
+var formkitVersion = '202601212058';
 
 let AuroElement$1 = class AuroElement extends i$2 {
   static get properties() {