@descope/web-components-ui 1.0.197 → 1.0.199

package/dist/index.esm.js

@@ -4825,7 +4825,7 @@ let PhoneFieldInternal$1 = class PhoneFieldInternal extends BaseInputClass$3 {
   init() {
     this.addEventListener('focus', (e) => {
       // we want to ignore focus events we are dispatching
-      if (e.isTrusted) this.inputs[0].focus();
+      if (e.isTrusted) this.inputs[1].focus();
     });
 
     super.init?.();
@@ -6208,9 +6208,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();
     }
   }
@@ -6223,7 +6227,7 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
   }
 
   get value() {
-    return this.getSelectedNode()?.value;
+    return this.getSelectedNode()?.value || '';
   }
 
   set value(value) {
@@ -6283,12 +6287,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));
   }
 }
 
@@ -6311,6 +6310,10 @@ const customMixin = (superclass) =>
       this.renderItems();
     }
 
+    get size() {
+      return this.inputElement?.size;
+    }
+
     get data() {
       if (this.#data) return this.#data;
 
@@ -6381,6 +6384,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);
+        });
+      });
     }
   };