refactor: migra decoradores a signals (input/output/viewChild/contentChild)

libs/ui/src/lib/ui/button/action-button/action-button.component.ts

@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';
+import { ChangeDetectionStrategy, Component, HostBinding, Input, input } from '@angular/core';
 import { buttonSize, mode } from '../../../styles';
 import { PiBaseButtonComponent } from '../base-button.component';
 import { NgIf } from '@angular/common';
@@ -17,27 +17,30 @@ export class PiActionButtonComponent extends PiBaseButtonComponent {
     );
   }
 
-  @Input() previous = false;
-  @Input() override size: buttonSize = 'medium';
+  readonly previous = input(false);
+  override readonly size = input<buttonSize>('medium');
   @Input() text: string | undefined;
-  @Input() hasPadding = true;
-  @Input() hasIcon = true;
-  @Input() label: string | undefined;
-  @Input() buttonType: 'default' | 'menu-item' = 'default';
-  @Input() mode: mode = 'dark';
-  @Input() direction: 'back' | 'forward' = 'forward';
-  @Input() fontWeight: '300' | '400' | '600' = '600';
+  readonly hasPadding = input(true);
+  readonly hasIcon = input(true);
+  readonly label = input<string>();
+  readonly buttonType = input<'default' | 'menu-item'>('default');
+  readonly mode = input<mode>('dark');
+  readonly direction = input<'back' | 'forward'>('forward');
+  readonly fontWeight = input<'300' | '400' | '600'>('600');
 
   get buttonColorClass(): string | null {
-    return this.color ? `pi-color__${this.color}` : null;
+    const color = this.color();
+    return color ? `pi-color__${color}` : null;
   }
 
   get directionClass(): string | null {
-    return this.direction ? `pi-action-button__direction--${this.direction}` : null;
+    const direction = this.direction();
+    return direction ? `pi-action-button__direction--${direction}` : null;
   }
 
   override get sizeClass(): string | null {
-    return this.size ? `pi-button__${this.size}` : null;
+    const size = this.size();
+    return size ? `pi-button__${size}` : null;
   }
 
   get textClass(): string | null {
@@ -45,26 +48,30 @@ export class PiActionButtonComponent extends PiBaseButtonComponent {
   }
 
   get fontWeightClass(): string | null {
-    return this.fontWeight ? `pi-action-button__font-weight--${this.fontWeight}` : '';
+    const fontWeight = this.fontWeight();
+    return fontWeight ? `pi-action-button__font-weight--${fontWeight}` : '';
   }
 
   get hasPaddingClass(): string | null {
-    return this.hasPadding ? null : 'pi-button__trimmed';
+    return this.hasPadding() ? null : 'pi-button__trimmed';
   }
 
   get hasIconClass(): string | null {
-    return this.hasIcon ? null : 'has-icon';
+    return this.hasIcon() ? null : 'has-icon';
   }
 
   override get appearanceClass(): string | null {
-    return this.appearance !== 'fill' ? `pi-button__appearance--${this.appearance}` : null;
+    const appearance = this.appearance();
+    return appearance !== 'fill' ? `pi-button__appearance--${appearance}` : null;
   }
 
   get buttonTypeClass(): string | null {
-    return this.buttonType !== 'default' ? `pi-button__type--${this.buttonType}` : null;
+    const buttonType = this.buttonType();
+    return buttonType !== 'default' ? `pi-button__type--${buttonType}` : null;
   }
 
   get modeClass(): string | null {
-    return this.mode && `pi-color__mode--${this.mode}`;
+    const modeValue = this.mode();
+    return modeValue && `pi-color__mode--${modeValue}`;
   }
 }