@xosue-utils/actions

Componentes de acción Angular 19 standalone con estética Cupertino (pills suaves, scale 0.98, ripple suave). Altura de botones fija 32px.

Componentes

| Selector | Uso | |----------|-----| | text-btn | Botón con label/icono | | icon-btn | Botón solo icono 32×32 | | capsule | Badge/pill de estado | | chip | Chip seleccionable / removable | | segmented-control | Control segmentado iOS | | progress-bar | Barra 0–100 o indeterminate | | badge | Contador / dot overlay | | divider | Separador hairline | | spinner | Activity indicator CSS |

Uso

import {
  TextBtnComponent,
  CapsuleComponent,
  ChipComponent,
  SegmentedControlComponent,
} from '@xosue-utils/actions';

<text-btn label="Guardar" icon="save" color="primary"></text-btn>
<capsule label="Pagado" tone="paid"></capsule>
<capsule label="Pagado" tone="paid" size="md"></capsule>
<chip label="Tag" removable (removed)="..."></chip>
<segmented-control [options]="opts" [(value)]="tab"></segmented-control>

Diseño

• Rounded por defecto botones: medium (var(--radius-xl)).
• Capsule: full + tonos soft. Tamaño sm (pequeño, default, fuente 12px) o md (normal, fuente 14px).
• Soft press scale(0.98) + ripple suave.
• Colores solo CSS vars / color-mix (sin #hex).

Build

cd D:\apps\xosue-utils\actions
npm install
npm run build