@usableapp/cardds 0.7.104 → 0.7.105

package/dist/journey/JourneyBadge.d.ts

@@ -14,5 +14,5 @@ export interface JourneyBadgeProps extends ComponentProps<'span'> {
      *  three beside a two-line title (day · number · month). Write it as the head's last child, after the title block */
     stretch?: boolean;
 }
-/** JourneyBadge — a tiny label over a big value: gate, seat, date, rating. `stretch`: a date in a head that takes its form from the title's height. */
+/** JourneyBadge — a tiny label over a big value: gate, seat, date, rating. `stretch`: a date in a head that takes its form from the title's height, no taller than its own three lines. */
 export declare function JourneyBadge({ label, value, sub, plain, corner, stretch, className, ...rest }: JourneyBadgeProps): import("react").JSX.Element;

package/dist/journey/JourneyBadge.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cx } from '../cx.js';
-/** JourneyBadge — a tiny label over a big value: gate, seat, date, rating. `stretch`: a date in a head that takes its form from the title's height. */
+/** JourneyBadge — a tiny label over a big value: gate, seat, date, rating. `stretch`: a date in a head that takes its form from the title's height, no taller than its own three lines. */
 export function JourneyBadge({ label, value, sub, plain, corner, stretch, className, ...rest }) {
     return (_jsxs("span", { className: cx('tile-badge', plain && 'tile-badge--plain', corner && 'tile-badge--corner', stretch && 'tile-badge--stretch', className), ...rest, children: [_jsx("span", { className: "tile-badge__label", children: label }), _jsx("span", { className: "tile-badge__value", children: value }), sub != null && _jsx("span", { className: "tile-badge__label", children: sub })] }));
 }

package/docs/reference.md

@@ -497,9 +497,11 @@ between at 40% down the screen (see *Anatomy*, "Where the centre is"):
 - **A card is head · content · foot.**
   - **Head** (`.card__head`): the heading on the left; hints, actions or a
     more-menu — the contextual info — at the far right. With nothing at
-    the far right it runs all the way across. The heading wraps freely —
-    no line budget, no squeeze, no clamp (Lh 2026-09-16): a height rule on
-    words only distorts them. The head is FLAT markup — heading, then an
+    the far right it runs all the way across. The heading wraps, no
+    squeeze, up to three lines and is cut there with an ellipsis (Lh
+    2026-10-21; `--card-head-title-lines`, default 3). A date
+    (`JourneyBadge stretch`) beside it is as tall as the title block up to
+    its own three lines, at the head's top. The head is FLAT markup — heading, then an
     optional caption as a span, then the far-right thing; no
     wrapper element, no `<p>`: the head wraps, the caption takes the row
     below (`order`), the gap tokens do the rest (Lh 2026-09-16).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@usableapp/cardds",
-  "version": "0.7.104",
+  "version": "0.7.105",
   "license": "UNLICENSED",
   "type": "module",
   "description": "card-first mobile design system, React-first: the components in src/ are thin wrappers over the CSS contract (css/*.css stays the only truth); gallery/ shows every story live (npm run dev), tests/ measures the geometry.",