@humanforest/ui 0.3.3 → 0.3.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@humanforest/ui",
-  "version": "0.3.3",
+  "version": "0.3.5",
   "type": "module",
   "files": [
     "src",
@@ -9,7 +9,7 @@
     "preset.gen.js"
   ],
   "dependencies": {
-    "@humanforest/tokens": "^0.3.3",
+    "@humanforest/tokens": "^0.3.5",
     "@internationalized/date": "^3.12.2",
     "@mapbox/search-js-core": "^1.6.0",
     "@turf/boolean-point-in-polygon": "^7.4.0",

package/preset.gen.js

@@ -1017,7 +1017,8 @@ var progressGroupTheme = {
 var proseTheme = {
   codePreview: {
     slots: {
-      preview: "ed-demo"
+      preview: "ed-demo",
+      code: "[&>div]:rounded-t-none [&>div>div>pre]:rounded-t-none"
     }
   },
   codeCollapse: {

package/src/card/FInsetCard.vue

@@ -119,8 +119,8 @@ const props = withDefaults(
     flush?: boolean;
     /**
      * The card fills the height its row gives it instead of hugging its content, so cards in a row
-     * end level. Only for content that can take the extra height: an FKpi whose bleed chart is a
-     * `fill` sparkline grows into it. A bar, a table or a line of text cannot, and the spare height
+     * end level. Only for content that can take the extra height: an FKpi whose chart is a
+     * `fill` sparkline grows into it. A fixed-height chart, a table or a line of text cannot, and the spare height
      * lands as a gap under it.
      */
     stretch?: boolean;

package/src/kpi/kpi.theme.ts

@@ -22,8 +22,8 @@ export const kpiTheme = tv({
     // bleed pulls by the same expression, so the graphic meets the edge the padding leaves.
     //
     // No row template: the rows are implicit, one per part present, so a tile without a visual has
-    // no empty track under its caption, and no gap in front of one. A bleed visual adds a flexible
-    // last row (`visualFit`); a grouped tile takes its rows from the group instead (`aligned`).
+    // no empty track under its caption, and no gap in front of one. A visual adds a flexible last
+    // row (`visualFit`); a grouped tile takes its rows from the group instead (`aligned`).
     //
     // One explicit minmax(0,1fr) column: without it the implicit column sizes to max-content, and a
     // chart with an intrinsic width (Unovis defaults to 300px) makes the tile's own grid wider than
@@ -78,22 +78,22 @@ export const kpiTheme = tv({
      * carry only the first — which left every other visual undoing it with utilities at the call
      * site.
      *
-     * `bleed` (the default) is for a graphic that IS data and nothing else, a sparkline being the
-     * case: it runs through the tile's gutter to both side edges and sits on the bottom edge, which
+     * `bleed` (the default) is for a graphic that IS data and nothing else, a line or area sparkline
+     * being the case: it runs through the tile's gutter to both side edges and sits on the bottom edge, which
      * the tile reaches by zeroing its own bottom padding rather than by a negative margin — a
      * margin would shrink the grid row and pull the graphic up over the caption. Its row is the
      * tile's last and flexible one, and the graphic spans it bottom-aligned: a tile given more
      * height than it needs — a group's shared row, a stretched FInsetCard — grows a `fill`
      * sparkline into the spare height and leaves any other graphic on the bottom edge.
      *
-     * `inset` is for a graphic carrying text, FDistributionBar's legend being the case. Text set
-     * against the card's edge reads as a mistake, so the padding stays. It also top-aligns, and
-     * packs the tile's rows to the top with `content-start`, so a tile stretched taller than its
-     * content keeps the extra height below the graphic rather than spread between its rows.
+     * `inset` is for bars, and for a graphic carrying text, FDistributionBar's legend being the
+     * case. Text set against the card's edge reads as a mistake, so the padding stays. It shares
+     * bleed's last, flexible row, with the graphic at the top of it: spare height lands below a
+     * graphic that cannot grow, and a `fill` sparkline grows into it.
      */
     visualFit: {
       bleed: { root: 'pb-0 grid-rows-[auto_auto_auto_1fr]', visual: 'self-stretch flex flex-col justify-end -mx-[var(--forest-kpi-pad,var(--forest-card-pad))]' },
-      inset: { root: 'content-start', visual: 'self-start' },
+      inset: { root: 'grid-rows-[auto_auto_auto_1fr]', visual: 'self-stretch flex flex-col justify-start' },
     },
     // A grouped tile spans exactly the rows its group declares (kpiGroupRows), so a group with no
     // visual has no empty last track and no group gap under its captions.

package/src/themes/prose.ts

@@ -26,6 +26,10 @@ export const proseTheme = {
   codePreview: {
     slots: {
       preview: 'ed-demo',
+      // Stock squares `code > div > pre`, the top of a bare block joined under the pane. A collapsed
+      // block wraps that <pre> one level deeper, so the wrapper and the <pre> both kept 12px top
+      // corners and notched the joint at each end.
+      code: '[&>div]:rounded-t-none [&>div>div>pre]:rounded-t-none',
     },
   },