@quario/html 0.3.0 → 0.4.0

package/CHANGELOG.md

@@ -7,6 +7,22 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.4.0] - 2026-09-03
+
+### Changed
+
+- **A split slot's box now fills the split's height.** Before, a slot's
+  background and border stopped at that slot's own content, leaving a gap under
+  any slot shorter than its neighbours. The slot wrapper now carries inline
+  `display:grid`, so the item inside it fills the row; a slot's item markup is
+  unchanged. See the `@quario/layout` changelog for the rule and for what it
+  costs a report that relied on the short box.
+
+- **A date string under `format: "date"` now presents as a date.** The
+  engine's `format()` helper revives the two read forms, so a cell that
+  rendered `2026-08-14` verbatim now renders the presented date. See the
+  `quario` changelog for the forms and the timezone rule.
+
 ## [0.3.0] - 2026-09-02
 
 ### Added

package/README.md

@@ -97,13 +97,13 @@ host. Compilation stays synchronous; render-time failures reject with the same l
 These classes are the contract host CSS targets. They are stable, and changing them is a breaking
 change.
 
-| Emits                                     | For                                                                                                                                             |
-| ----------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
-| `<div class="q-item q-<role>">`           | Every item. Roles: `q-report-header`, `q-empty`, `q-group-header`, `q-detail`, `q-group-footer`, `q-report-footer`                              |
-| `<div class="q-group" data-group="name">` | Each group instance, wrapping its header, nested content, and footer. Adds `q-break` when the group declares `break: "page"` or `reset: "page"` |
-| `<table class="q-table">`                 | Each table, with a real `colgroup`, `thead`, `tbody`, and a `tfoot` when totals are declared                                                    |
-| `<div class="q-item q-image q-<role>">`   | Each image item, holding one `<img>` whose `src` is a base64 `data:` URI of the event's bytes; the rendered `alt` is escaped                    |
-| `<div class="q-split q-<role>">`          | Each split, carrying inline `display:flex`; its slots are `<div class="q-slot">` sized inline, each holding the slot item's ordinary container  |
+| Emits                                     | For                                                                                                                                                                              |
+| ----------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `<div class="q-item q-<role>">`           | Every item. Roles: `q-report-header`, `q-empty`, `q-group-header`, `q-detail`, `q-group-footer`, `q-report-footer`                                                               |
+| `<div class="q-group" data-group="name">` | Each group instance, wrapping its header, nested content, and footer. Adds `q-break` when the group declares `break: "page"` or `reset: "page"`                                  |
+| `<table class="q-table">`                 | Each table, with a real `colgroup`, `thead`, `tbody`, and a `tfoot` when totals are declared                                                                                     |
+| `<div class="q-item q-image q-<role>">`   | Each image item, holding one `<img>` whose `src` is a base64 `data:` URI of the event's bytes; the rendered `alt` is escaped                                                     |
+| `<div class="q-split q-<role>">`          | Each split, carrying inline `display:flex`; its slots are `<div class="q-slot">` carrying inline `display:grid` and their share, each holding the slot item's ordinary container |
 
 A column `width` becomes an inline `width:<n>%` on its `<col>`. The classes above belong to this
 target. The schema never speaks in CSS. Displaying a fragment that contains images under a Content

package/lib/index.js

@@ -256,9 +256,16 @@ let styling = (fonts) => {
 
 // One slot's wrapper. An authored share is that width; a width-less slot
 // divides what the sized ones leave, exactly as a width-less column does.
+// `display:grid` is what gives a slot's box the split's height rather than its
+// own content's: the wrapper already stretches as a flex item, and a grid makes
+// its single child fill it in both axes. It belongs here and not on the
+// fragment, because a slot's item is the same `q-item` div it would be
+// anywhere else -- nothing about an item's markup depends on where it sits.
 /** @type {(slot: { width?: number } | undefined) => string} */
 let slotAttr = (slot) =>
-  ' style="' + esc(slot && slot.width != null ? "width:" + slot.width + "%" : "flex:1") + '"';
+  ' style="' +
+  esc("display:grid;" + (slot && slot.width != null ? "width:" + slot.width + "%" : "flex:1")) +
+  '"';
 
 // The identity attribute, escaped like every other generated value at this
 // edge. `mark` is the factory's verdict: a render without `paths` maps every

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quario/html",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "The HTML render target for quario — in the makings, not yet released",
   "homepage": "https://getquario.com",
   "license": "SEE LICENSE IN LICENSE",
@@ -39,12 +39,12 @@
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.3",
     "@size-limit/preset-small-lib": "^13.0.3",
-    "quario": "^0.3.0",
+    "quario": "^0.4.0",
     "size-limit": "^13.0.3",
     "typescript": "^7.0.2"
   },
   "peerDependencies": {
-    "quario": "^0.3.0"
+    "quario": "^0.4.0"
   },
   "size-limit": [
     {