@joewinke/jatui 0.2.10 → 0.2.12

package/dist/components/Collapse.svelte

@@ -2,9 +2,11 @@
 	/**
 	 * Collapse — batteries-included tall-content collapser.
 	 *
-	 * Animates via grid-template-rows 0fr↔1fr with var(--motion-glide) — no
-	 * overshoot, no layout-property animation. The toggle self-hides when content
-	 * is shorter than the threshold (ResizeObserver-backed measurement).
+	 * Caps tall content at `threshold` px with a fade-out mask so it shows a
+	 * preview instead of overflowing; the toggle clamp is instant (no
+	 * layout-property animation, matching the `use:collapse` action). The toggle
+	 * self-hides when content is shorter than the threshold
+	 * (ResizeObserver-backed measurement).
 	 *
 	 *   <Collapse>
 	 *     {@html renderedMarkdown}
@@ -86,27 +88,26 @@
 
 <style>
 	/*
-	 * Grid-template-rows trick: outer wraps inner with overflow:hidden.
-	 * Closed → 0fr (inner pinned to 0 height). Open → 1fr (natural height).
-	 * grid-template-rows is a discrete property in older engines but modern
-	 * browsers interpolate it as a length when rows go 0fr↔1fr.
-	 * No layout-property width change; height is the only transition.
+	 * Preview collapse: closed caps the visible area at the threshold with a
+	 * fade-out mask; open removes the cap. This is a PREVIEW collapser — closed
+	 * must show the first `threshold` px, NOT zero. The original implementation
+	 * animated grid-template-rows 0fr↔1fr, but 0fr (with the inner's
+	 * min-height:0) clamps the row to ZERO height — max-height never got a say,
+	 * so every collapsed body rendered empty with only the "Show more" toggle
+	 * visible (mos-7i3ni). The toggle is now an instant clamp, matching the
+	 * `use:collapse` action's behavior (no layout-property animation).
 	 */
 	.jatui-collapse-outer {
-		display: grid;
-		grid-template-rows: 1fr;
-		transition: grid-template-rows var(--motion-enter) var(--motion-glide);
 		overflow: hidden;
 		position: relative;
 	}
 
 	.jatui-collapse-outer-closed {
-		grid-template-rows: 0fr;
+		/* Cap visible area at threshold */
+		max-height: var(--collapse-threshold);
 		/* Fade gradient masks the bottom edge when collapsed */
 		-webkit-mask-image: var(--collapse-gradient);
 		mask-image: var(--collapse-gradient);
-		/* Cap visible area at threshold */
-		max-height: var(--collapse-threshold);
 	}
 
 	/* When open, remove the mask and height cap */
@@ -116,12 +117,6 @@
 		mask-image: none;
 	}
 
-	.jatui-collapse-inner {
-		/* Required for grid 0fr to clamp to zero */
-		min-height: 0;
-		overflow: hidden;
-	}
-
 	.jatui-collapse-toggle {
 		display: block;
 		margin-top: 4px;
@@ -138,10 +133,4 @@
 		opacity: 1;
 		text-decoration: underline;
 	}
-
-	@media (prefers-reduced-motion: reduce) {
-		.jatui-collapse-outer {
-			transition: none;
-		}
-	}
 </style>

package/dist/components/Collapse.svelte.d.ts

@@ -1,9 +1,11 @@
 /**
  * Collapse — batteries-included tall-content collapser.
  *
- * Animates via grid-template-rows 0fr↔1fr with var(--motion-glide) — no
- * overshoot, no layout-property animation. The toggle self-hides when content
- * is shorter than the threshold (ResizeObserver-backed measurement).
+ * Caps tall content at `threshold` px with a fade-out mask so it shows a
+ * preview instead of overflowing; the toggle clamp is instant (no
+ * layout-property animation, matching the `use:collapse` action). The toggle
+ * self-hides when content is shorter than the threshold
+ * (ResizeObserver-backed measurement).
  *
  *   <Collapse>
  *     {@html renderedMarkdown}

package/dist/dnd/createDndBoard.js

@@ -36,7 +36,16 @@ export function createDndBoard(opts) {
 		mirror.clear();
 
 		var src = opts.items();
-		var entries = src instanceof Map ? src : new Map(Object.entries(src));
+
+		// Iterate a real ARRAY, never a Map/iterator directly. This module is
+		// downlevelled by the package build (svelte-package emits ES5-ish output:
+		// `for…of` becomes a `.length`-indexed loop and `[...iterable]` becomes
+		// `Array.prototype.slice.call`). Those transforms are correct for arrays
+		// but SILENTLY WRONG for Maps/iterators (`Map.length` is undefined → the
+		// loop never runs; slice on an iterator returns []). Iterating a Map here
+		// left the render mirror permanently empty → every board rendered blank.
+		// `Array.from(map)` is a runtime call, so it survives the downlevel intact.
+		var entries = src instanceof Map ? Array.from(src) : Object.entries(src);
 
 		for (var _i = 0, entries_1 = entries; _i < entries_1.length; _i++) {
 			var _a = entries_1[_i], id = _a[0], list = _a[1];
@@ -93,8 +102,9 @@ export function createDndBoard(opts) {
 		var _a;
 		var _b;
 
-		for (var _i = 0, mirror_1 = mirror; _i < mirror_1.length; _i++) {
-			var _c = mirror_1[_i], cid = _c[0], list_1 = _c[1];
+		// Array.from — never iterate the SvelteMap directly (downlevel breaks it; see seed()).
+		for (var _i = 0, _c = Array.from(mirror); _i < _c.length; _i++) {
+			var _d = _c[_i], cid = _d[0], list_1 = _d[1];
 
 			var idx = list_1.findIndex(function (item) {
 				return item[SHADOW_KEY];
@@ -164,8 +174,9 @@ export function createDndBoard(opts) {
 	function rollback(move) {
 		var _a;
 
-		for (var _i = 0, mirror_2 = mirror; _i < mirror_2.length; _i++) {
-			var _b = mirror_2[_i], cid = _b[0], list = _b[1];
+		// Array.from — never iterate the SvelteMap directly (downlevel breaks it; see seed()).
+		for (var _i = 0, _b = Array.from(mirror); _i < _b.length; _i++) {
+			var _c = _b[_i], cid = _c[0], list = _c[1];
 
 			var idx = list.findIndex(function (it) {
 				return opts.key(it) === opts.key(move.item);
@@ -284,7 +295,7 @@ export function createDndBoard(opts) {
 		},
 
 		containers() {
-			return __spreadArray([], mirror.keys(), true);
+			return Array.from(mirror.keys());
 		},
 
 		get dragging() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@joewinke/jatui",
-  "version": "0.2.10",
+  "version": "0.2.12",
   "private": false,
   "description": "Shared Svelte 5 component library for JAT projects",
   "type": "module",