feat: anade app playground con catalogo de componentes

This commit is contained in:
2026-07-28 19:19:02 +02:00
parent d8c38f434d
commit deb19dd744
192 changed files with 9632 additions and 42 deletions

View File

@@ -33,7 +33,8 @@ no cubren.
## Formularios: Signal Forms
Los campos ya no son `ControlValueAccessor` ni reciben `formControlName`.
Implementan los contratos de Signal Forms, así que basta con enlazar `[field]`:
Implementan los contratos de Signal Forms, así que basta con enlazar
`[formField]` — ése es el selector de la directiva `FormField`, no `[field]`:
```ts
import { form, required, min, FormField } from '@angular/forms/signals';
@@ -41,9 +42,9 @@ import { form, required, min, FormField } from '@angular/forms/signals';
@Component({
imports: [FormField, PiTextFieldComponent, PiNumberFieldComponent, PiSlideToggleComponent],
template: `
<pi-text-field [field]="f.name" placeholder="Nombre" />
<pi-number-field [field]="f.age" />
<pi-slide-toggle [field]="f.active" />
<pi-text-field [formField]="f.name" placeholder="Nombre" />
<pi-number-field [formField]="f.age" />
<pi-slide-toggle [formField]="f.active" />
`,
})
export class Ejemplo {
@@ -57,7 +58,12 @@ export class Ejemplo {
```
La directiva `FormField` sincroniza sola `value`, `disabled`, `errors`,
`touched`, `required`, `min`/`max`, `maxLength`… con el campo enlazado.
`touched`, `required`, `min`/`max`, `maxLength`… con el campo enlazado. De
hecho **no se pueden enlazar a mano** esas entradas en un elemento que ya use
`[formField]`: Angular lo rechaza con `NG8022`. Los validadores van en el
`form()`, no en la plantilla.
Se puede ver funcionando en la app `playground` (`nx serve playground`).
| Componente | Contrato | Tipo del valor |
| ---------------------------------------------------- | --------------------- | ------------------------------------- |
@@ -93,6 +99,11 @@ Detalles a tener en cuenta:
Los selects (`ui/select`) siguen con `ControlValueAccessor`; quedaron fuera del
alcance de esta migración.
**El loader de servidor de traducciones ya no está en el barrel.**
`util/translate/loaders/translate-server.loader` usa `fs`, `path` y `process`;
exportarlo desde `@pi/ui` rompía el bundle de navegador de cualquier app que
importase la librería. Se importa por su ruta directa desde el arranque de SSR.
## Decisiones que cambian comportamiento
Revisar estos puntos antes de usar la librería en producción: