@khipu/design-system 0.3.2 → 0.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -13,7 +13,7 @@
13
13
  *
14
14
  * AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
15
15
  * Source: design-system/src/tokens/tokens.json
16
- * Generated: 2026-08-12T19:58:58.122Z
16
+ * Generated: 2026-08-12T21:28:55.469Z
17
17
  *
18
18
  * To regenerate:
19
19
  * cd design-system && npm run tokens:generate
@@ -2422,6 +2422,12 @@ a.kds-btn-google:disabled {
2422
2422
  /* Llena y centra dentro de contenedores flex (pantalla de carga); en flujo
2423
2423
  normal (contenedor no-flex) se reduce a su contenido. */
2424
2424
  flex: 1 1 auto;
2425
+ /* Alto propio: el loader es contenido minimo por definicion, asi que sin esto la
2426
+ card queda del alto del spinner y se lee como un recorte. Ocupa el body completo
2427
+ de un telefono para que la pantalla de carga se lea como una pantalla y no como
2428
+ una franja. Va aca y no en la card para que el minimo aplique solo a la carga:
2429
+ el resto de las pantallas crece con su contenido. */
2430
+ min-height: 36rem;
2425
2431
  }
2426
2432
 
2427
2433
  .kds-secure-loader-text {
@@ -7178,6 +7184,19 @@ div.kds-invoice-header,
7178
7184
  padding: var(--kds-spacing-0-5);
7179
7185
  }
7180
7186
 
7187
+ /* Titulo del body de la card: alineado a la izquierda, sin importar que el consumidor
7188
+ traiga .kds-text-center. Va con especificidad de contexto (screen + card) a proposito:
7189
+ el centrado se venia pidiendo app por app y el resultado era inconsistente entre
7190
+ pantallas. Si alguna necesita centrarlo, el modificador explicito es
7191
+ .kds-card-title--centered. */
7192
+ .kds-screen > .kds-card-elevated :is(h1, .kds-card-title) {
7193
+ text-align: left;
7194
+ }
7195
+
7196
+ .kds-screen > .kds-card-elevated :is(h1, .kds-card-title).kds-card-title--centered {
7197
+ text-align: center;
7198
+ }
7199
+
7181
7200
  /* -- Card Title -- */
7182
7201
  .kds-card-title {
7183
7202
  font-weight: var(--kds-font-weight-semibold);
@@ -7830,13 +7849,16 @@ svg[fill='none'] {
7830
7849
  padding-bottom: 0;
7831
7850
  }
7832
7851
 
7833
- /* Body card: alto mínimo estable para que NO salte entre estados de distinta altura
7834
- (loader/progress ↔ formulario). Solo la body card = hijo directo de `.kds-screen`
7852
+ /* Body card: crece con su contenido. Solo la body card = hijo directo de `.kds-screen`
7835
7853
  (los headers van dentro de `.kds-invoice-sticky-wrap`, no la afecta).
7836
- Flex-column para que el contenido quede arriba y el footer interno (versión / secure
7837
- footer) pueda pinearse al fondo con `margin-top: auto` aunque el contenido sea corto. */
7854
+ NO lleva alto mínimo: un valor fijo deja espacio muerto en las apps cuyo contenido es
7855
+ más bajo, y el DS lo sirve a todas por igual. Cuando el contenido es corto el footer
7856
+ interno (versión / secure footer) queda pegado a él en vez de al fondo: su padding
7857
+ da el respiro. Las apps que embeben el flujo en un iframe reciben la altura real por
7858
+ el mensaje RESIZE (KTUF-239), asi que tampoco dependen de un mínimo aca.
7859
+ Flex-column se mantiene: ordena el contenido y sostiene el `margin-top: auto` del
7860
+ footer cuando la card sí tiene alto de sobra. */
7838
7861
  .kds-screen > .kds-card-elevated {
7839
- min-height: 36rem;
7840
7862
  display: flex;
7841
7863
  flex-direction: column;
7842
7864
  /* mismo radio que el header (invoice-sticky usa radius-card); el base card-elevated