@lion/ui 0.6.0-alpha.2 → 0.6.0-alpha.4

package/components/checkbox-group/src/LionCheckboxIndeterminate.js

@@ -197,19 +197,34 @@ export class LionCheckboxIndeterminate extends LionCheckbox {
   // eslint-disable-next-line class-methods-use-this
   _afterTemplate() {
     return html`
-      <div class="choice-field__nested-checkboxes">
+      <div class="choice-field__nested-checkboxes" role="list">
         <slot></slot>
       </div>
     `;
   }
 
   /**
+   * @param {Event} ev
    * @protected
    */
-  _onRequestToAddFormElement() {
+  _onRequestToAddFormElement(ev) {
+    if (!(/** @type {HTMLElement} */ (ev.target).hasAttribute('role'))) {
+      /** @type {HTMLElement} */ (ev.target)?.setAttribute('role', 'listitem');
+    }
     this._setOwnCheckedState();
   }
 
+  /**
+   * @param {Event} ev
+   * @protected
+   */
+  // eslint-disable-next-line class-methods-use-this
+  _onRequestToRemoveFormElement(ev) {
+    if (/** @type {HTMLElement} */ (ev.target).getAttribute('role') === 'listitem') {
+      /** @type {HTMLElement} */ (ev.target)?.removeAttribute('role');
+    }
+  }
+
   constructor() {
     super();
     this.indeterminate = false;

package/components/checkbox-group/test/lion-checkbox-indeterminate-integrations.test.js

@@ -1,4 +1,7 @@
 import '@lion/ui/define/lion-checkbox-indeterminate.js';
+import '@lion/ui/define/lion-checkbox-group.js';
+import '@lion/ui/define/lion-checkbox.js';
+
 import { runChoiceInputMixinSuite } from '@lion/ui/form-core-test-suites.js';
 import { runCheckboxIndeterminateSuite } from '../test-suites/CheckboxIndeterminate.suite.js';