@kolkrabbi/kol-component 0.107.0 → 0.108.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.108.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",
|
|
@@ -19,10 +19,15 @@ import AssetPlaceholder from '../utilities/AssetPlaceholder.jsx'
|
|
|
19
19
|
*
|
|
20
20
|
* `fit` (2026-08-15) — `cover` crops to fill, which is right for a photograph
|
|
21
21
|
* and wrong for a diagram or a screenshot, where the crop eats the content.
|
|
22
|
-
* `natural` and `compact` are GridCard's `previewFit` under the family's name
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
*
|
|
22
|
+
* `natural` and `compact` are GridCard's `previewFit` under the family's name
|
|
23
|
+
* — AS GRIDCARD DREW THEM (CatalogPageMonitorParity, kol-monitor 2026-08-27):
|
|
24
|
+
* the image at 50 % / 30 % of its own pixels, anchored top-left, clipped by the
|
|
25
|
+
* box (`.kol-shell-card-preview--natural/--compact` in kol-theme, verbatim). A
|
|
26
|
+
* rack preview reads its modules at the top-left and the rest runs off the
|
|
27
|
+
* card. Until 0.108.0 they were contain / contain-at-70 % — the whole rack
|
|
28
|
+
* small in the middle, rejected on sight against the original; no consumer was
|
|
29
|
+
* on that meaning. `cover` stays the default — every card in the family today
|
|
30
|
+
* is a photograph.
|
|
26
31
|
*
|
|
27
32
|
* THREE separate edge treatments, because the shipped components use three:
|
|
28
33
|
*
|
|
@@ -72,8 +77,9 @@ import AssetPlaceholder from '../utilities/AssetPlaceholder.jsx'
|
|
|
72
77
|
const FIT = {
|
|
73
78
|
/* a consumer WRAPPER div fills the frame as an img/video does (ColumnBrowser round, 2026-08-27 — kol-r2b2's wrapped thumb fell back to the image's intrinsic size) */
|
|
74
79
|
cover: '[&>img]:h-full [&>img]:w-full [&>img]:object-cover [&>video]:h-full [&>video]:w-full [&>video]:object-cover [&>div]:h-full [&>div]:w-full',
|
|
75
|
-
|
|
76
|
-
|
|
80
|
+
/* GridCard's previewFit, verbatim: `img { max-width: none; transform: scale(.5 | .3); transform-origin: top left }` */
|
|
81
|
+
natural: '[&>img]:max-w-none [&>img]:scale-50 [&>img]:origin-top-left',
|
|
82
|
+
compact: '[&>img]:max-w-none [&>img]:scale-[.3] [&>img]:origin-top-left',
|
|
77
83
|
}
|
|
78
84
|
|
|
79
85
|
/* the fade: the child <img> is cloned with loading="lazy" and `kol-media-fade`,
|