@descope/web-components-ui 1.0.196 → 1.0.198

package/dist/cjs/index.cjs.js

@@ -7571,9 +7571,13 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
     this.getSelectedNode()?.removeAttribute('selected');
   }
 
-  onNodeClick(e) {
-    if (!this.isReadonly) {
-      this.setSelected(e.target);
+  onClick(e) {
+    if (!this.isReadonly && e.target !== e.currentTarget) {
+      if (e.target === this.getSelectedNode()) {
+        this.removeSelected();
+      } else {
+        this.setSelected(e.target);
+      }
       this.#dispatchChange();
     }
   }
@@ -7586,7 +7590,7 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
   }
 
   get value() {
-    return this.getSelectedNode()?.value;
+    return this.getSelectedNode()?.value || '';
   }
 
   set value(value) {
@@ -7646,12 +7650,7 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
 
     observeAttributes(this, this.onObservedAttributeChange.bind(this), { includeAttrs: ['size'] });
 
-    observeChildren(this, ({ addedNodes }) => {
-      addedNodes.forEach((node) => {
-        node.addEventListener('click', this.onNodeClick.bind(this));
-        node.setAttribute('size', this.size);
-      });
-    });
+    this.querySelector('slot').addEventListener('click', this.onClick.bind(this));
   }
 }
 
@@ -7674,6 +7673,10 @@ const customMixin = (superclass) =>
       this.renderItems();
     }
 
+    get size() {
+      return this.inputElement?.size;
+    }
+
     get data() {
       if (this.#data) return this.#data;
 
@@ -7744,6 +7747,13 @@ const customMixin = (superclass) =>
       this.renderItems();
 
       observeAttributes(this, this.renderItems.bind(this), { includeAttrs: ['data'] });
+
+      // we want new items to get the size
+      observeChildren(this, ({ addedNodes }) => {
+        addedNodes.forEach((node) => {
+          node.setAttribute('size', this.size);
+        });
+      });
     }
   };