@khipu/design-system 0.2.0-alpha.42 → 0.2.0-alpha.44

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-06-11T19:33:07.389Z
16
+ * Generated: 2026-06-11T20:11:47.479Z
17
17
  *
18
18
  * To regenerate:
19
19
  * cd design-system && npm run tokens:generate
@@ -2143,7 +2143,7 @@
2143
2143
  .kds-theme-root .kds-secure-loader-text {
2144
2144
  display: flex;
2145
2145
  flex-direction: column;
2146
- gap: var(--kds-spacing-1);
2146
+ gap: var(--kds-spacing-0-25);
2147
2147
  }
2148
2148
 
2149
2149
  .kds-theme-root .kds-secure-loader-title {
@@ -2164,20 +2164,20 @@
2164
2164
  }
2165
2165
 
2166
2166
  /* Caja del spinner con tamaño fijo: la animación no altera el layout.
2167
- 8.5rem (136px) iguala el tamaño visual del loader original. */
2167
+ 6.25rem (100px) = tamaño del loader original (CircularProgress size=100). */
2168
2168
  .kds-theme-root .kds-secure-loader-spinner {
2169
2169
  position: relative;
2170
2170
  display: inline-grid;
2171
2171
  place-items: center;
2172
- inline-size: var(--kds-secure-loader-size, 8.5rem);
2173
- block-size: var(--kds-secure-loader-size, 8.5rem);
2172
+ inline-size: var(--kds-secure-loader-size, 6.25rem);
2173
+ block-size: var(--kds-secure-loader-size, 6.25rem);
2174
2174
  }
2175
2175
 
2176
2176
  /* Anillo: SVG nativo con arco vía stroke-dasharray, rotando. Replica el
2177
- CircularProgress original (viewBox 44u, thickness 2 → ~6px, arco ~63%, disableShrink). */
2177
+ CircularProgress original (viewBox 44u, thickness 2, arco ~63%, disableShrink). */
2178
2178
  .kds-theme-root .kds-secure-loader-ring {
2179
- inline-size: var(--kds-secure-loader-size, 8.5rem);
2180
- block-size: var(--kds-secure-loader-size, 8.5rem);
2179
+ inline-size: var(--kds-secure-loader-size, 6.25rem);
2180
+ block-size: var(--kds-secure-loader-size, 6.25rem);
2181
2181
  animation: kds-secure-loader-spin 1.2s linear infinite;
2182
2182
  }
2183
2183
 
@@ -2196,11 +2196,16 @@
2196
2196
  }
2197
2197
  }
2198
2198
 
2199
- /* Candado centrado sobre el anillo (~0.3 del diámetro 40px, como el original) */
2199
+ /* Candado centrado sobre el anillo (~0.3 del diámetro). Centrado explícito
2200
+ (top/left 50% + translate) para que no dependa del grid ni se recorte. */
2200
2201
  .kds-theme-root .kds-secure-loader-lock {
2201
2202
  position: absolute;
2203
+ top: 50%;
2204
+ left: 50%;
2205
+ transform: translate(-50%, -50%);
2202
2206
  color: var(--kds-color-text-secondary);
2203
- font-size: calc(var(--kds-secure-loader-size, 8.5rem) * 0.3);
2207
+ font-size: calc(var(--kds-secure-loader-size, 6.25rem) * 0.3);
2208
+ line-height: 1;
2204
2209
  pointer-events: none;
2205
2210
  }
2206
2211