@khipu/design-system 0.2.0-alpha.7 → 0.2.0-alpha.70

package/dist/beercss/khipu-beercss.js

@@ -991,10 +991,15 @@ const ui = _context.ui;
 
             if (!logoSource) return;
 
+            // Insert inside the amount div (first child of .kds-invoice-header)
+            var header = card.querySelector('.kds-invoice-header');
+            var amountDiv = header ? header.firstElementChild : null;
+            if (!amountDiv) return;
+
             var inner = document.createElement('div');
             inner.className = 'kds-brand-inner';
             inner.appendChild(logoSource.cloneNode(true));
-            card.insertBefore(inner, card.firstChild);
+            amountDiv.insertBefore(inner, amountDiv.firstChild);
         });
     }
 
@@ -1325,9 +1330,9 @@ const ui = _context.ui;
     function initStickyInvoice(root) {
         root = root || document;
 
-        // Progressive collapse range: 0px (expanded) to 60px (collapsed)
+        // Progressive collapse range: 0px (expanded) to 20px (collapsed)
         var COLLAPSE_START = 0;
-        var COLLAPSE_END = 60;
+        var COLLAPSE_END = 20;
 
         var lastScrollY = 0;
         var ticking = false;
@@ -1382,6 +1387,19 @@ const ui = _context.ui;
                 // Single DOM write per frame — set on screen (parent) so it cascades to sticky + siblings
                 currentScreen.style.setProperty('--collapse-progress', progress);
 
+                // Toggle collapsed state class for discrete styling that can't interpolate (e.g. align-items)
+                currentSticky.classList.toggle('is-collapsed', progress >= 1);
+
+                // Close expand panels as soon as the sticky header starts collapsing
+                if (progress > 0) {
+                    currentSticky.querySelectorAll('[data-expand-toggle][aria-expanded="true"]').forEach(function(toggle) {
+                        toggle.setAttribute('aria-expanded', 'false');
+                        var panelId = toggle.getAttribute('aria-controls');
+                        var panel = panelId ? document.getElementById(panelId) : null;
+                        if (panel) panel.classList.remove('open');
+                    });
+                }
+
                 lastScrollY = scrollY;
             });
         }
@@ -1395,6 +1413,9 @@ const ui = _context.ui;
                     screen.style.removeProperty('--collapse-progress');
                     screen.style.removeProperty('--collapse-collapsible-h');
                 });
+                root.querySelectorAll('.kds-invoice-sticky.is-collapsed').forEach(function(el) {
+                    el.classList.remove('is-collapsed');
+                });
             }
         });
 
@@ -1446,7 +1467,7 @@ const ui = _context.ui;
             var rows = container.querySelectorAll('.kds-copyable-table-row[data-copy]');
             var values = [];
             rows.forEach(function(r) {
-                var key = r.querySelector('.k');
+                var key = r.querySelector('.kds-key');
                 var val = r.dataset.copy;
                 if (key) {
                     values.push(key.textContent.trim() + ': ' + val);