@khipu/design-system 0.3.5-alpha.6 → 0.3.5-alpha.7

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-14T15:09:26.125Z
16
+ * Generated: 2026-08-14T15:36:49.015Z
17
17
  *
18
18
  * To regenerate:
19
19
  * cd design-system && npm run tokens:generate
@@ -15,7 +15,7 @@
15
15
  *
16
16
  * AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
17
17
  * Source: design-system/src/tokens/tokens.json
18
- * Generated: 2026-08-14T15:09:26.125Z
18
+ * Generated: 2026-08-14T15:36:49.015Z
19
19
  *
20
20
  * To regenerate:
21
21
  * cd design-system && npm run tokens:generate
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "@khipu/design-system/beercss",
3
- "version": "0.3.5-alpha.6",
3
+ "version": "0.3.5-alpha.7",
4
4
  "description": "Khipu BeerCSS bundle with Material Design 3 and Khipu customizations",
5
- "buildDate": "2026-08-14T15:09:28.792Z",
5
+ "buildDate": "2026-08-14T15:36:51.847Z",
6
6
  "includes": {
7
7
  "beercss": "4.0.1",
8
8
  "khipu-tokens": "latest",
@@ -19,8 +19,8 @@
19
19
  },
20
20
  "scopeClass": ".kds-theme-root",
21
21
  "cdn": {
22
- "css": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.6/dist/beercss/khipu-beercss.min.css",
23
- "cssScoped": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.6/dist/beercss/khipu-beercss.scoped.min.css",
24
- "js": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.6/dist/beercss/khipu-beercss.min.js"
22
+ "css": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.7/dist/beercss/khipu-beercss.min.css",
23
+ "cssScoped": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.7/dist/beercss/khipu-beercss.scoped.min.css",
24
+ "js": "https://cdn.jsdelivr.net/npm/@khipu/design-system@0.3.5-alpha.7/dist/beercss/khipu-beercss.min.js"
25
25
  }
26
26
  }
package/dist/index.js CHANGED
@@ -225,11 +225,15 @@ function useCardHeightTransition() {
225
225
  [{ height: `${from}px` }, { height: `${to}px` }],
226
226
  { duration: CARD_TRANSITION_MS, easing: "ease-out" }
227
227
  );
228
- const release = () => {
228
+ return animation.finished.catch(() => void 0).then(() => {
229
+ const current = parseFloat(card.style.height) || card.offsetHeight;
230
+ const natural = card.scrollHeight;
231
+ if (Math.abs(natural - current) >= CARD_MIN_DELTA_PX) {
232
+ return animate(card, current, natural);
233
+ }
229
234
  card.style.height = "";
230
- };
231
- animation.finished.then(release).catch(release);
232
- return animation;
235
+ return void 0;
236
+ });
233
237
  };
234
238
  const observe = (card) => {
235
239
  if (card.getAttribute(CARD_MARK_ATTRIBUTE) === "on") {
@@ -244,10 +248,9 @@ function useCardHeightTransition() {
244
248
  const from = Number(remembered);
245
249
  if (Number.isFinite(from) && from > 0 && Math.abs(from - previous) >= CARD_MIN_DELTA_PX) {
246
250
  animating = true;
247
- animate(card, from, previous).finished.then(() => {
248
- animating = false;
249
- }).catch(() => {
251
+ animate(card, from, previous).then(() => {
250
252
  animating = false;
253
+ previous = card.offsetHeight;
251
254
  });
252
255
  }
253
256
  }
@@ -263,15 +266,13 @@ function useCardHeightTransition() {
263
266
  return;
264
267
  }
265
268
  animating = true;
266
- const animation = animate(card, previous, next);
269
+ const from = previous;
267
270
  previous = next;
268
271
  screen?.setAttribute(SCREEN_LAST_HEIGHT_ATTRIBUTE, String(next));
269
- animation.finished.then(() => {
272
+ animate(card, from, next).then(() => {
270
273
  animating = false;
271
274
  previous = card.offsetHeight;
272
275
  screen?.setAttribute(SCREEN_LAST_HEIGHT_ATTRIBUTE, String(previous));
273
- }).catch(() => {
274
- animating = false;
275
276
  });
276
277
  });
277
278
  observer.observe(card);
package/dist/index.mjs CHANGED
@@ -97,11 +97,15 @@ function useCardHeightTransition() {
97
97
  [{ height: `${from}px` }, { height: `${to}px` }],
98
98
  { duration: CARD_TRANSITION_MS, easing: "ease-out" }
99
99
  );
100
- const release = () => {
100
+ return animation.finished.catch(() => void 0).then(() => {
101
+ const current = parseFloat(card.style.height) || card.offsetHeight;
102
+ const natural = card.scrollHeight;
103
+ if (Math.abs(natural - current) >= CARD_MIN_DELTA_PX) {
104
+ return animate(card, current, natural);
105
+ }
101
106
  card.style.height = "";
102
- };
103
- animation.finished.then(release).catch(release);
104
- return animation;
107
+ return void 0;
108
+ });
105
109
  };
106
110
  const observe = (card) => {
107
111
  if (card.getAttribute(CARD_MARK_ATTRIBUTE) === "on") {
@@ -116,10 +120,9 @@ function useCardHeightTransition() {
116
120
  const from = Number(remembered);
117
121
  if (Number.isFinite(from) && from > 0 && Math.abs(from - previous) >= CARD_MIN_DELTA_PX) {
118
122
  animating = true;
119
- animate(card, from, previous).finished.then(() => {
120
- animating = false;
121
- }).catch(() => {
123
+ animate(card, from, previous).then(() => {
122
124
  animating = false;
125
+ previous = card.offsetHeight;
123
126
  });
124
127
  }
125
128
  }
@@ -135,15 +138,13 @@ function useCardHeightTransition() {
135
138
  return;
136
139
  }
137
140
  animating = true;
138
- const animation = animate(card, previous, next);
141
+ const from = previous;
139
142
  previous = next;
140
143
  screen?.setAttribute(SCREEN_LAST_HEIGHT_ATTRIBUTE, String(next));
141
- animation.finished.then(() => {
144
+ animate(card, from, next).then(() => {
142
145
  animating = false;
143
146
  previous = card.offsetHeight;
144
147
  screen?.setAttribute(SCREEN_LAST_HEIGHT_ATTRIBUTE, String(previous));
145
- }).catch(() => {
146
- animating = false;
147
148
  });
148
149
  });
149
150
  observer.observe(card);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@khipu/design-system",
3
- "version": "0.3.5-alpha.6",
3
+ "version": "0.3.5-alpha.7",
4
4
  "description": "Khipu Design System - UI components and design tokens for the Khipu payment platform",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",