matcha-components 19.52.0 → 19.53.0

package/fesm2022/matcha-components.mjs

@@ -199,40 +199,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
             }] } });
 
 class MatchaButtonItemComponent {
-    constructor(renderer) {
-        this.renderer = renderer;
+    constructor(_render) {
+        this._render = _render;
         this.active = false;
         this.selected = new EventEmitter();
     }
     ngAfterContentInit() {
-        if (this.innerButton) {
-            this.renderer.listen(this.innerButton.nativeElement, 'click', () => this.onClick());
+        if (!this.innerButton) {
+            return;
+        }
+        /* considera <button … active-item> como ativo */
+        if (this.innerButton.nativeElement.hasAttribute('active-item')) {
+            this.active = true;
         }
+        this._render.listen(this.innerButton.nativeElement, 'click', () => this.onClick());
     }
     onClick() {
         this.selected.emit();
     }
     setActiveState(isActive, inactiveColor, inactiveType) {
         this.active = isActive;
-        const color = isActive ? '' : inactiveColor;
-        const type = isActive ? '' : inactiveType;
-        // Aplica a cor correta ao botão interno 
+        /* liga/desliga atributo visual */
         if (isActive) {
-            this.renderer.setAttribute(this.innerButton.nativeElement, 'active-item', 'true');
+            this._render.setAttribute(this.innerButton.nativeElement, 'active-item', 'true');
         }
         else {
-            this.renderer.removeAttribute(this.innerButton.nativeElement, 'active-item');
+            this._render.removeAttribute(this.innerButton.nativeElement, 'active-item');
         }
-        // inactiveType - pode ser 'basic', 'outline', 'alpha' ou 'pill'
-        // Se o tipo for 'basic', 'outline', 'alpha' ou 'pill', aplica o tipo correto
-        // Limpa todos os tipos anteriores
-        // ['basic', 'outline', 'alpha', 'pill'].forEach(attr => {
-        //   this.renderer.setAttribute(this.innerButton.nativeElement, attr, 'false');
-        // });
-        // Aplica o tipo correto ao botão interno se houver algum
-        // if (type) {
-        //   this.renderer.setAttribute(this.innerButton.nativeElement, type, 'true');
-        // }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: MatchaButtonItemComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: MatchaButtonItemComponent, isStandalone: false, selector: "matcha-button-item", inputs: { active: "active" }, outputs: { selected: "selected" }, queries: [{ propertyName: "innerButton", first: true, predicate: MatchaButtonComponent, descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""] }); }
@@ -251,39 +244,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImpor
 
 class MatchaButtonGroupComponent {
     constructor() {
+        /* entradas originais */
         this._multiple = false;
         this._disabled = false;
         this.inactiveColor = 'disabled';
         this.inactiveType = 'basic';
         this._gap = 16;
     }
-    get multiple() {
-        return this._multiple;
-    }
-    set multiple(value) {
-        this._multiple = value === 'false' ? false : Boolean(value);
-    }
-    get disabled() {
-        return this._disabled;
-    }
-    set disabled(value) {
-        this._disabled = value === 'false' ? false : Boolean(value);
-    }
-    get isDisabled() {
-        return this.disabled || null;
-    }
-    set gap(value) {
-        const numericGap = Number(value);
-        this._gap = isNaN(numericGap) ? 16 : numericGap;
-    }
-    get gapClass() {
-        return `gap-${this._gap}`;
-    }
+    get multiple() { return this._multiple; }
+    set multiple(v) { this._multiple = v === 'false' ? false : !!v; }
+    get disabled() { return this._disabled; }
+    set disabled(v) { this._disabled = v === 'false' ? false : !!v; }
+    get isDisabled() { return this.disabled || null; }
+    set gap(v) { const n = +v; this._gap = isNaN(n) ? 16 : n; }
+    get gapClass() { return `gap-${this._gap}`; }
+    /* ────────────────────────────────────── */
     ngAfterContentInit() {
-        this.buttonItems.forEach((item, index) => {
-            const isFirst = index === 0;
-            // Opcionalmente, primeiro botão pode iniciar ativo por padrão
-            item.setActiveState(isFirst, this.inactiveColor, this.inactiveType);
+        /* se algum veio com [active] / active-item usa-o, senão o primeiro */
+        const preset = this.buttonItems.find(i => i.active);
+        this.buttonItems.forEach((item, idx) => {
+            const isActive = preset ? item === preset : idx === 0;
+            item.setActiveState(isActive, this.inactiveColor, this.inactiveType);
             item.selected.subscribe(() => this.onItemSelected(item));
         });
     }
@@ -292,9 +273,7 @@ class MatchaButtonGroupComponent {
             selectedItem.setActiveState(!selectedItem.active, this.inactiveColor, this.inactiveType);
         }
         else {
-            this.buttonItems.forEach(item => {
-                item.setActiveState(item === selectedItem, this.inactiveColor, this.inactiveType);
-            });
+            this.buttonItems.forEach(item => item.setActiveState(item === selectedItem, this.inactiveColor, this.inactiveType));
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: MatchaButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }