GeorgeandClaude Sonnet 5.5
68caf401a7
El mockup muestra que una fila es etiqueta + uno o varios controles en la misma línea (Cliente = input + "...", Canal / Zona = dos mitades, Serie + Número = 72 px + resto, select + número + botón) y que la cabecera tiene a lo sumo 2 columnas. Los campos de un solo control no lo permitían. - Controles sin etiqueta combinables dentro de sbo-field: sbo-input, sbo-textarea, sbo-number, sbo-date, sbo-select y el botón .sbo-btn; ocupan el espacio sobrante o un width fijo. - El primer control de la fila toma el id de la etiqueta (claimId); los demás se nombran con ariaLabel. El error de la fila marca todos sus controles (aria-invalid / aria-describedby). - Los campos con etiqueta (sbo-text-field, sbo-number-field, ..., sbo-lookup-field) pasan a ser atajos de un solo control con la misma API. - CSS global: .sbo-group y .sbo-btn reemplazan a .sbo-pick/.sbo-pair. - CLAUDE.md apunta al mockup renombrado (tools/oferta_venta.html). - Verificado en Chrome contra SAP real, con una cabecera que reproduce las filas compuestas del mockup. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
12 lines
504 B
TypeScript
12 lines
504 B
TypeScript
import { Directive, booleanAttribute, input } from '@angular/core';
|
|
|
|
/** Entradas comunes de los campos con etiqueta (un solo control por fila). */
|
|
@Directive()
|
|
export abstract class FieldBase {
|
|
readonly label = input.required<string>();
|
|
readonly required = input(false, { transform: booleanAttribute });
|
|
readonly readOnly = input(false, { alias: 'readonly', transform: booleanAttribute });
|
|
readonly disabled = input(false, { transform: booleanAttribute });
|
|
readonly error = input<string>();
|
|
}
|