@descope/web-components-ui 1.0.201 → 1.0.203

package/dist/index.esm.js

@@ -6220,7 +6220,7 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
   }
 
   onClick(e) {
-    if (!this.isReadonly && e.target !== e.currentTarget) {
+    if (e.target !== e.currentTarget) {
       if (e.target === this.getSelectedNode() && this.allowDeselect) {
         this.removeSelected();
       } else {
@@ -6266,6 +6266,10 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
     });
   }
 
+  onReadOnlyChange() {
+    this.querySelector('slot').toggleAttribute('inert', this.isReadonly);
+  }
+
   getValidity() {
     if (this.isRequired && !this.value) {
       return { valueMissing: true };
@@ -6280,6 +6284,9 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
         case 'size':
           this.onSizeChange();
           break;
+        case 'readonly':
+          this.onReadOnlyChange();
+          break;
       }
     });
   }
@@ -6289,14 +6296,16 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
     this.addEventListener('focus', (e) => {
       // we want to ignore focus events we are dispatching
       if (e.isTrusted) {
-        this.items[0].focus();
+        this.items[0]?.focus();
       }
     });
 
     super.init?.();
     this.setDefaultValue();
 
-    observeAttributes(this, this.onObservedAttributeChange.bind(this), { includeAttrs: ['size'] });
+    observeAttributes(this, this.onObservedAttributeChange.bind(this), {
+      includeAttrs: ['size', 'readonly'],
+    });
 
     this.querySelector('slot').addEventListener('click', this.onClick.bind(this));
   }