@kolkrabbi/kol-component 0.48.0 → 0.49.0
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.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kolkrabbi/kol-component",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.49.0",
|
|
4
4
|
"description": "KOL design-system components — atoms through organisms, emitting canonical kol-* classes. Pairs with @kolkrabbi/kol-theme for styling.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -28,14 +28,18 @@ import usePrefersReducedMotion from '../hooks/usePrefersReducedMotion.js'
|
|
|
28
28
|
* @param {string} form 'grid' | 'list'
|
|
29
29
|
* @param {string} min grid track minimum, card form (default 20rem — the law)
|
|
30
30
|
* @param {string} listMin grid track minimum, list form (default 30rem)
|
|
31
|
-
* @param {number} gap px between items
|
|
31
|
+
* @param {number} gap px between items — defaults PER FORM (grid 24,
|
|
32
|
+
* list 8), the values every shipped consumer
|
|
33
|
+
* re-typed as a ternary at its own call site. A
|
|
34
|
+
* single default meant the ternary survived the
|
|
35
|
+
* migration, which is half the duplication
|
|
32
36
|
* @param {boolean} stagger enter animation on/off (reduced motion wins)
|
|
33
37
|
*/
|
|
34
38
|
export default function ContentCollection({
|
|
35
39
|
form = 'grid',
|
|
36
40
|
min = '20rem',
|
|
37
41
|
listMin = '30rem',
|
|
38
|
-
gap
|
|
42
|
+
gap,
|
|
39
43
|
stagger = true,
|
|
40
44
|
children,
|
|
41
45
|
className = '',
|
|
@@ -43,6 +47,9 @@ export default function ContentCollection({
|
|
|
43
47
|
const reduced = usePrefersReducedMotion()
|
|
44
48
|
const animate = stagger && !reduced
|
|
45
49
|
const items = Array.isArray(children) ? children.flat() : [children]
|
|
50
|
+
/* ruled 2026-08-15 — the shipped 24/8 become the defaults, so `gap` is only
|
|
51
|
+
* passed when a consumer genuinely differs from the house. */
|
|
52
|
+
const px = gap ?? (form === 'list' ? 8 : 24)
|
|
46
53
|
|
|
47
54
|
return (
|
|
48
55
|
<ul
|
|
@@ -51,7 +58,7 @@ export default function ContentCollection({
|
|
|
51
58
|
style={{
|
|
52
59
|
display: 'grid',
|
|
53
60
|
gridTemplateColumns: `repeat(auto-fill, minmax(${form === 'list' ? listMin : min}, 1fr))`,
|
|
54
|
-
gap: `${
|
|
61
|
+
gap: `${px}px`,
|
|
55
62
|
}}
|
|
56
63
|
>
|
|
57
64
|
{items.map((child, i) =>
|