@aurodesignsystem/auro-formkit 3.0.0 → 3.0.1

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Semantic Release Automated Changelog
 
+## [3.0.1](https://github.com/AlaskaAirlines/auro-formkit/compare/v3.0.0...v3.0.1) (2025-04-29)
+
+
+### Bug Fixes
+
+* add `reflect: true` on boolean props ([05cc3db](https://github.com/AlaskaAirlines/auro-formkit/commit/05cc3db9a5069a172a835066d4b08a2082c318e3))
+
 # [3.0.0](https://github.com/AlaskaAirlines/auro-formkit/compare/v2.2.1...v3.0.0) (2025-04-29)
 
 

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

@@ -19,6 +19,7 @@ export class AuroBibtemplate extends LitElement {
      *
      */
     static register(name?: string): void;
+    large: boolean;
     iconTag: any;
     headerTag: any;
     /**

package/components/bibtemplate/dist/index.js

@@ -665,6 +665,8 @@ class AuroBibtemplate extends LitElement {
   constructor() {
     super();
 
+    this.large = false;
+
     AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
 
     const versioning = new AuroDependencyVersioning();

package/components/bibtemplate/dist/registered.js

@@ -665,6 +665,8 @@ class AuroBibtemplate extends LitElement {
   constructor() {
     super();
 
+    this.large = false;
+
     AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
 
     const versioning = new AuroDependencyVersioning();

package/components/checkbox/README.md

@@ -106,7 +106,7 @@ The use of any Auro custom element has a dependency on the [Auro Design Tokens](
 In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Legacy browsers such as IE11 are no longer supported.
 
 ```html
-<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@2.2.1/auro-checkbox/+esm"></script>
+<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@3.0.0/auro-checkbox/+esm"></script>
 ```
 <!-- AURO-GENERATED-CONTENT:END -->
 

package/components/checkbox/demo/readme.md

@@ -106,7 +106,7 @@ The use of any Auro custom element has a dependency on the [Auro Design Tokens](
 In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Legacy browsers such as IE11 are no longer supported.
 
 ```html
-<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@2.2.1/auro-checkbox/+esm"></script>
+<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@3.0.0/auro-checkbox/+esm"></script>
 ```
 <!-- AURO-GENERATED-CONTENT:END -->
 

package/components/combobox/README.md

@@ -111,7 +111,7 @@ The use of any Auro custom element has a dependency on the [Auro Design Tokens](
 In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Legacy browsers such as IE11 are no longer supported.
 
 ```html
-<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@2.2.1/auro-combobox/+esm"></script>
+<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@3.0.0/auro-combobox/+esm"></script>
 ```
 <!-- AURO-GENERATED-CONTENT:END -->
 

package/components/combobox/demo/api.md

@@ -14,12 +14,12 @@
 | [error](#error)                         | `error`                         | `string`  |                | When defined, sets persistent validity to `customError` and sets the validation message to the attribute value. |
 | [fullscreenBreakpoint](#fullscreenBreakpoint)          | `fullscreenBreakpoint`          | `string`  | "sm"           | Defines the screen size breakpoint (`lg`, `md`, `sm`, or `xs`) at which the dropdown switches to fullscreen mode on mobile.<br />When expanded, the dropdown will automatically display in fullscreen mode if the screen size is equal to or smaller than the selected breakpoint. |
 | [largeFullscreenHeadline](#largeFullscreenHeadline)       | `largeFullscreenHeadline`       | `boolean` |                | If declared, make bib.fullscreen.headline in HeadingDisplay.<br />Otherwise, Heading 600 |
-| [noFilter](#noFilter)                      | `noFilter`                      | `boolean` | false          | If set, combobox will not filter menuoptions based in input. |
+| [noFilter](#noFilter)                      | `noFilter`                      | `boolean` |                | If set, combobox will not filter menuoptions based in input. |
 | [noFlip](#noFlip)                        | `noFlip`                        | `boolean` | "false"        | If declared, the bib will NOT flip to an alternate position<br />when there isn't enough space in the specified `placement`. |
 | [noValidate](#noValidate)                    | `noValidate`                    | `boolean` |                | If set, disables auto-validation on blur.        |
 | [offset](#offset)                        | `offset`                        | `number`  | "0"            | Gap between the trigger element and bib.         |
 | [onDark](#onDark)                        | `onDark`                        | `boolean` |                | If declared, onDark styles will be applied to the trigger. |
-| [optionSelected](#optionSelected)                | `optionSelected`                | `object`  | "undefined"    | Specifies the current selected option.           |
+| [optionSelected](#optionSelected)                | `optionSelected`                | `object`  |                | Specifies the current selected option.           |
 | [placement](#placement)                     | `placement`                     | `string`  | "bottom-start" | Position where the bib should appear relative to the trigger.<br />Accepted values:<br />"top" \| "right" \| "bottom" \| "left" \|<br />"bottom-start" \| "top-start" \| "top-end" \|<br />"right-start" \| "right-end" \| "bottom-end" \|<br />"left-start" \| "left-end" |
 | [required](#required)                      | `required`                      | `boolean` |                | Populates the `required` attribute on the input. Used for client-side validation. |
 | [setCustomValidity](#setCustomValidity)             | `setCustomValidity`             | `string`  |                | Sets a custom help text message to display for all validityStates. |
@@ -27,8 +27,8 @@
 | [setCustomValidityValueMissing](#setCustomValidityValueMissing) | `setCustomValidityValueMissing` | `string`  |                | Custom help text message to display when validity = `valueMissing`. |
 | [triggerIcon](#triggerIcon)                   | `triggerIcon`                   | `boolean` |                | If set, the `icon` attribute will be applied to the trigger `auro-input` element. |
 | [type](#type)                          | `type`                          | `string`  |                | Applies the defined value as the type attribute on auro-input. |
-| [validity](#validity)                      | `validity`                      | `string`  | "undefined"    | Specifies the `validityState` this element is in. |
-| [value](#value)                         | `value`                         |           | "undefined"    | Value selected for the dropdown menu.            |
+| [validity](#validity)                      | `validity`                      | `string`  |                | Specifies the `validityState` this element is in. |
+| [value](#value)                         | `value`                         |           |                | Value selected for the dropdown menu.            |
 
 ## Methods
 

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

@@ -8764,7 +8764,8 @@ class BaseInput extends r$1 {
        * If set, disables the input.
        */
       disabled: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8794,7 +8795,8 @@ class BaseInput extends r$1 {
        * If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format.
        */
       icon: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8850,7 +8852,8 @@ class BaseInput extends r$1 {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8880,14 +8883,16 @@ class BaseInput extends r$1 {
        * Makes the input read-only, but can be set programmatically.
        */
       readonly: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
        * Populates the `required` attribute on the input. Used for client-side validation.
        */
       required: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11475,6 +11480,8 @@ class AuroBibtemplate extends r$1 {
   constructor() {
     super();
 
+    this.large = false;
+
     AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
 
     const versioning = new AuroDependencyVersioning();
@@ -11723,11 +11730,6 @@ class AuroCombobox extends r$1 {
   constructor() {
     super();
 
-    this.noFilter = false;
-    this.validity = undefined;
-    this.value = undefined;
-    this.optionSelected = undefined;
-
     this.privateDefaults();
   }
 
@@ -11737,11 +11739,24 @@ class AuroCombobox extends r$1 {
    */
   privateDefaults() {
     this.onDark = false;
+
+    this.noFilter = false;
+    this.validity = undefined;
+    this.value = undefined;
+    this.optionSelected = undefined;
+
+    this.checkmark = false;
+    this.disabled = false;
+    this.noValidate = false;
+    this.required = false;
+    this.triggerIcon = false;
+
     this.availableOptions = [];
     this.optionActive = null;
     this.msgSelectionMissing = 'Please select an option.';
 
     this.fullscreenBreakpoint = 'sm';
+    this.largeFullscreenHeadline = false;
 
     this.validation = new AuroFormValidation$1();
 
@@ -11832,7 +11847,8 @@ class AuroCombobox extends r$1 {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11959,8 +11975,7 @@ class AuroCombobox extends r$1 {
        * @private
        */
       isDropdownFullscreen: {
-        type: Boolean,
-        reflect: false
+        type: Boolean
       }
     };
   }

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

@@ -8622,7 +8622,8 @@ class BaseInput extends r$1 {
        * If set, disables the input.
        */
       disabled: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8652,7 +8653,8 @@ class BaseInput extends r$1 {
        * If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format.
        */
       icon: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8708,7 +8710,8 @@ class BaseInput extends r$1 {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8738,14 +8741,16 @@ class BaseInput extends r$1 {
        * Makes the input read-only, but can be set programmatically.
        */
       readonly: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
        * Populates the `required` attribute on the input. Used for client-side validation.
        */
       required: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11333,6 +11338,8 @@ class AuroBibtemplate extends r$1 {
   constructor() {
     super();
 
+    this.large = false;
+
     AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
 
     const versioning = new AuroDependencyVersioning();
@@ -11581,11 +11588,6 @@ class AuroCombobox extends r$1 {
   constructor() {
     super();
 
-    this.noFilter = false;
-    this.validity = undefined;
-    this.value = undefined;
-    this.optionSelected = undefined;
-
     this.privateDefaults();
   }
 
@@ -11595,11 +11597,24 @@ class AuroCombobox extends r$1 {
    */
   privateDefaults() {
     this.onDark = false;
+
+    this.noFilter = false;
+    this.validity = undefined;
+    this.value = undefined;
+    this.optionSelected = undefined;
+
+    this.checkmark = false;
+    this.disabled = false;
+    this.noValidate = false;
+    this.required = false;
+    this.triggerIcon = false;
+
     this.availableOptions = [];
     this.optionActive = null;
     this.msgSelectionMissing = 'Please select an option.';
 
     this.fullscreenBreakpoint = 'sm';
+    this.largeFullscreenHeadline = false;
 
     this.validation = new AuroFormValidation$1();
 
@@ -11690,7 +11705,8 @@ class AuroCombobox extends r$1 {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11817,8 +11833,7 @@ class AuroCombobox extends r$1 {
        * @private
        */
       isDropdownFullscreen: {
-        type: Boolean,
-        reflect: false
+        type: Boolean
       }
     };
   }

package/components/combobox/demo/readme.md

@@ -111,7 +111,7 @@ The use of any Auro custom element has a dependency on the [Auro Design Tokens](
 In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Legacy browsers such as IE11 are no longer supported.
 
 ```html
-<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@2.2.1/auro-combobox/+esm"></script>
+<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@3.0.0/auro-combobox/+esm"></script>
 ```
 <!-- AURO-GENERATED-CONTENT:END -->
 

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

@@ -65,6 +65,7 @@ export class AuroCombobox extends LitElement {
          */
         noValidate: {
             type: BooleanConstructor;
+            reflect: boolean;
         };
         /**
          * Gap between the trigger element and bib.
@@ -177,7 +178,6 @@ export class AuroCombobox extends LitElement {
          */
         isDropdownFullscreen: {
             type: BooleanConstructor;
-            reflect: boolean;
         };
     };
     static get styles(): import("lit").CSSResult[];
@@ -190,20 +190,26 @@ export class AuroCombobox extends LitElement {
      *
      */
     static register(name?: string): void;
-    noFilter: boolean;
-    validity: any;
-    value: any;
-    optionSelected: any[];
     /**
      * @private
      * @returns {void} Internal defaults.
      */
     private privateDefaults;
     onDark: boolean;
+    noFilter: boolean;
+    validity: any;
+    value: any;
+    optionSelected: any[];
+    checkmark: boolean;
+    disabled: boolean;
+    noValidate: boolean;
+    required: boolean;
+    triggerIcon: boolean;
     availableOptions: any[];
     optionActive: any;
     msgSelectionMissing: string;
     fullscreenBreakpoint: string;
+    largeFullscreenHeadline: boolean;
     validation: AuroFormValidation;
     runtimeUtils: any;
     isHiddenWhileLoading: boolean;

package/components/combobox/dist/index.js

@@ -8540,7 +8540,8 @@ class BaseInput extends LitElement {
        * If set, disables the input.
        */
       disabled: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8570,7 +8571,8 @@ class BaseInput extends LitElement {
        * If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format.
        */
       icon: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8626,7 +8628,8 @@ class BaseInput extends LitElement {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8656,14 +8659,16 @@ class BaseInput extends LitElement {
        * Makes the input read-only, but can be set programmatically.
        */
       readonly: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
        * Populates the `required` attribute on the input. Used for client-side validation.
        */
       required: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11251,6 +11256,8 @@ class AuroBibtemplate extends LitElement {
   constructor() {
     super();
 
+    this.large = false;
+
     AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
 
     const versioning = new AuroDependencyVersioning();
@@ -11499,11 +11506,6 @@ class AuroCombobox extends LitElement {
   constructor() {
     super();
 
-    this.noFilter = false;
-    this.validity = undefined;
-    this.value = undefined;
-    this.optionSelected = undefined;
-
     this.privateDefaults();
   }
 
@@ -11513,11 +11515,24 @@ class AuroCombobox extends LitElement {
    */
   privateDefaults() {
     this.onDark = false;
+
+    this.noFilter = false;
+    this.validity = undefined;
+    this.value = undefined;
+    this.optionSelected = undefined;
+
+    this.checkmark = false;
+    this.disabled = false;
+    this.noValidate = false;
+    this.required = false;
+    this.triggerIcon = false;
+
     this.availableOptions = [];
     this.optionActive = null;
     this.msgSelectionMissing = 'Please select an option.';
 
     this.fullscreenBreakpoint = 'sm';
+    this.largeFullscreenHeadline = false;
 
     this.validation = new AuroFormValidation$1();
 
@@ -11608,7 +11623,8 @@ class AuroCombobox extends LitElement {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11735,8 +11751,7 @@ class AuroCombobox extends LitElement {
        * @private
        */
       isDropdownFullscreen: {
-        type: Boolean,
-        reflect: false
+        type: Boolean
       }
     };
   }

package/components/combobox/dist/registered.js

@@ -8540,7 +8540,8 @@ class BaseInput extends LitElement {
        * If set, disables the input.
        */
       disabled: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8570,7 +8571,8 @@ class BaseInput extends LitElement {
        * If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format.
        */
       icon: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8626,7 +8628,8 @@ class BaseInput extends LitElement {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -8656,14 +8659,16 @@ class BaseInput extends LitElement {
        * Makes the input read-only, but can be set programmatically.
        */
       readonly: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
        * Populates the `required` attribute on the input. Used for client-side validation.
        */
       required: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11251,6 +11256,8 @@ class AuroBibtemplate extends LitElement {
   constructor() {
     super();
 
+    this.large = false;
+
     AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
 
     const versioning = new AuroDependencyVersioning();
@@ -11499,11 +11506,6 @@ class AuroCombobox extends LitElement {
   constructor() {
     super();
 
-    this.noFilter = false;
-    this.validity = undefined;
-    this.value = undefined;
-    this.optionSelected = undefined;
-
     this.privateDefaults();
   }
 
@@ -11513,11 +11515,24 @@ class AuroCombobox extends LitElement {
    */
   privateDefaults() {
     this.onDark = false;
+
+    this.noFilter = false;
+    this.validity = undefined;
+    this.value = undefined;
+    this.optionSelected = undefined;
+
+    this.checkmark = false;
+    this.disabled = false;
+    this.noValidate = false;
+    this.required = false;
+    this.triggerIcon = false;
+
     this.availableOptions = [];
     this.optionActive = null;
     this.msgSelectionMissing = 'Please select an option.';
 
     this.fullscreenBreakpoint = 'sm';
+    this.largeFullscreenHeadline = false;
 
     this.validation = new AuroFormValidation$1();
 
@@ -11608,7 +11623,8 @@ class AuroCombobox extends LitElement {
        * If set, disables auto-validation on blur.
        */
       noValidate: {
-        type: Boolean
+        type: Boolean,
+        reflect: true
       },
 
       /**
@@ -11735,8 +11751,7 @@ class AuroCombobox extends LitElement {
        * @private
        */
       isDropdownFullscreen: {
-        type: Boolean,
-        reflect: false
+        type: Boolean
       }
     };
   }

package/components/counter/README.md

@@ -110,7 +110,7 @@ The use of any Auro custom element has a dependency on the [Auro Design Tokens](
 In cases where the project is not able to process JS assets, there are pre-processed assets available for use. Legacy browsers such as IE11 are no longer supported.
 
 ```html
-<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@2.2.1/auro-counter/+esm"></script>
+<script type="module" src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-formkit@3.0.0/auro-counter/+esm"></script>
 ```
 <!-- AURO-GENERATED-CONTENT:END -->
 

package/components/counter/demo/api.md

@@ -44,7 +44,7 @@
 | [autoPlacement](#autoPlacement)           | `autoPlacement`           | `boolean` | "false"        | If declared, bib's position will be automatically calculated where to appear. |
 | [fullscreenBreakpoint](#fullscreenBreakpoint)    | `fullscreenBreakpoint`    | `string`  | "sm"           | Defines the screen size breakpoint (`lg`, `md`, `sm`, or `xs`) at which the dropdown switches to fullscreen mode on mobile.<br />When expanded, the dropdown will automatically display in fullscreen mode if the screen size is equal to or smaller than the selected breakpoint. |
 | [isDropdown](#isDropdown)              | `isDropdown`              | `boolean` | false          | Indicates if the counter group is displayed as a dropdown. |
-| [largeFullscreenHeadline](#largeFullscreenHeadline) | `largeFullscreenHeadline` | `boolean` |                | If declared, make bib.fullscreen.headline in HeadingDisplay.<br />Otherwise, Heading 600. |
+| [largeFullscreenHeadline](#largeFullscreenHeadline) | `largeFullscreenHeadline` | `boolean` | false          | If declared, make bib.fullscreen.headline in HeadingDisplay.<br />Otherwise, Heading 600. |
 | [max](#max)                     | `max`                     | `number`  | "undefined"    | The maximum value allowed for the whole group of counters. |
 | [min](#min)                     | `min`                     | `number`  | "undefined"    | The minimum value allowed for the whole group of counters. |
 | [noFlip](#noFlip)                  | `noFlip`                  | `boolean` | "false"        | If declared, the bib will NOT flip to an alternate position<br />when there isn't enough space in the specified `placement`. |

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

@@ -5929,6 +5929,8 @@ class AuroBibtemplate extends r {
   constructor() {
     super();
 
+    this.large = false;
+
     AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
 
     const versioning = new AuroDependencyVersioning();
@@ -6112,14 +6114,18 @@ class AuroCounterGroup extends r {
   constructor() {
     super();
 
-    this.isDropdown = false;
     this.max = undefined;
     this.min = undefined;
     this.onDark = false;
     this.total = undefined;
     this.validity = undefined;
     this.value = undefined;
+
+    this.isDropdown = false;
     this.fullscreenBreakpoint = 'sm';
+    this.largeFullscreenHeadline = false;
+    this.autoPlacement = false;
+    this.noFlip = false;
 
     /**
      * @private