@thewhatmatters/wmds 0.4.8 → 0.4.9

package/CHANGELOG.md

@@ -7,6 +7,35 @@ Every release of `@thewhatmatters/wmds` is listed here, newest first.
 - **Pasted patterns:** when a release changes a **Pattern — …** story's Show code, it is named under Consumer actions so apps re-copy it.
 - **How to add an entry** (contributors): add your change to the top entry. If that version is already on npm (`npm view @thewhatmatters/wmds versions`), start a new entry above it and bump `version` in `package.json` to match. `npm run check:changelog` enforces the format.
 
+## 0.4.9
+
+**Fixes from the site's 0.4.8 upgrade: router links in every page pattern, a tighter tile caption, and a checker that no longer skips files.**
+
+- **`renderLink` on the page patterns** — one prop name everywhere, for links the app's router should handle. Without it they were plain anchors that reload the page, and swapping one in the pasted markup reads as drift.
+  - **Guides/Filter panel → Pattern — filtered index**: `renderLink={(post) => <Link href={post.href} />}` (new) — post titles.
+  - **Guides/Post page → Pattern — post page**: `renderLink={(link) => <Link href={link.href} />}` (new) — the **Breadcrumb** and the category tags. View as Markdown and the share links stay plain anchors.
+  - **Guides/Resource detail → Pattern — resource detail**: `renderLink={(item) => <Link href={item.href} />}` (new) on `ResourceDetailPage` — the **Breadcrumb**.
+  - **Pattern — filtered grid** already had it, for tiles.
+- **IndexList.Item** `render` (new) — `render={<Link href="/blog/post" />}` in place of `href`, the same shape as **LinkTile** and **Badge**. `href` is now optional.
+- **TextLink** `render` (new) — the same, for any text link. `href` is now optional; pass one or the other.
+- **`type-caption`** (new type step; `typographyClass("caption-tight")`) — `type-supporting`'s size and weight on a 16px line. For a single line directly under a label; not for wrapped text, which stays on `type-supporting`. In this release it is used on **LinkTile**'s meta line only. **Foundations → Typography** lists it.
+- **LinkTile** — the title and the meta line sit as a pair: no gap between them, and the meta line is on `type-caption`. The space between the title's text and the meta's goes from about 9px to about 5px. The 12px between the image and the title and the two-line clamp are unchanged. A tile with a meta line is 6px shorter. The `loading` placeholder's bars sit in the same 20px and 16px lines, so a placeholder is exactly as tall as a loaded tile with a one-line title.
+- **`wmds-check`** — finds a pasted pattern's header when a `"use client"` or `"use server"` directive (or blank lines) comes before it. It read line 1 only, so such a file was skipped silently and never checked for drift. Findings name the header's line.
+- **0.4.8 Consumer actions corrected** — they said to put `"use client"` above the pattern header. The header goes first and the directive below it, as the `use-wmds` skill says. Both orders now work with `wmds-check`.
+- **TileGrid docs** — the space under a masonry tile is the 2rem row gap plus less than 4px (32px to just under 36px), not "within 3px". A tile's height rounds up to the next 4px row track. The behavior has not changed.
+
+### Consumer actions
+
+Re-copy three patterns, then pass the app's link through `renderLink`. Do the wiring in a client component (a function cannot cross from a server component), and remove any `<Link>` added to pasted markup.
+
+1. **Re-copy Guides/Filter panel → Pattern — filtered index** (`node_modules/@thewhatmatters/wmds/docs/patterns/guides-filter-panel--filtered-index.tsx`) over `components/blog-index.tsx`, re-apply your content, data, and handlers, and pass `renderLink={(post) => <Link href={post.href} />}` to `<FilteredIndex>`.
+2. **Re-copy Guides/Post page → Pattern — post page** (`…/docs/patterns/guides-post-page--post-page.tsx`) over `components/post-page.tsx`, re-apply your content, and pass `renderLink={(link) => <Link href={link.href} />}` to `<PostPage>`.
+3. **Re-copy Guides/Resource detail → Pattern — resource detail** (`…/docs/patterns/guides-resource-detail--detail.tsx`) over `components/resource-detail.tsx`, re-apply your content, and pass `renderLink={(item) => <Link href={item.href} />}` to `<ResourceDetailPage>`.
+4. **Pattern headers:** the header stays on the first lines with `"use client"` below it. A file with the directive first is now checked too, so `npx wmds-check` may report drift it skipped before. Fix the drift, or re-copy.
+5. **LinkTile:** nothing to do. Tiles with a meta line are 6px shorter. Update a screenshot baseline or a test that measures a tile's height. **Pattern — filtered grid** did not change; no re-copy.
+6. **`type-caption`:** do not move other text to it. It is for one line under a label.
+7. Other apps: none. `render` on **TextLink** and **IndexList.Item** is optional.
+
 ## 0.4.8
 
 **A filtered grid and a resource detail for a resources page.** Three new components and two page patterns: a tile that is one link, a grid that packs tiles in reading order, the filter panel as a component, and a resource's detail as a dialog over the grid or as its own page. The WhatMatters Resources page is the first use. See **ADR-0044**.
@@ -25,9 +54,9 @@ Every release of `@thewhatmatters/wmds` is listed here, newest first.
 
 ### Consumer actions
 
-1. **WhatMatters site, Resources page: use the new grid.** Copy **Guides/Filter panel → Pattern — filtered grid** (`node_modules/@thewhatmatters/wmds/docs/patterns/guides-filter-panel--filtered-grid.tsx`) into `components/resource-grid.tsx`, keep its header comment, and add `"use client"` above it. Each item is `{ id, title, href, image: { src, alt, width, height }, meta?, tag?, facets }` with `href: "/resources/<slug>"`; give every image its real `width` and `height`. Delete the hand-built list in `app/resources/page.tsx` and its classes.
+1. **WhatMatters site, Resources page: use the new grid.** Copy **Guides/Filter panel → Pattern — filtered grid** (`node_modules/@thewhatmatters/wmds/docs/patterns/guides-filter-panel--filtered-grid.tsx`) into `components/resource-grid.tsx`, keep its header comment as the first lines, and add `"use client"` below it. Each item is `{ id, title, href, image: { src, alt, width, height }, meta?, tag?, facets }` with `href: "/resources/<slug>"`; give every image its real `width` and `height`. Delete the hand-built list in `app/resources/page.tsx` and its classes.
 2. **Wire the grid in one small client file** (functions cannot cross from a server component): `components/resources.tsx` with `"use client"` renders `<FilteredGrid title="Resources" caption="Library" items={items} groups={groups} renderLink={(item) => <Link href={item.href} scroll={false} />} renderImage={(image) => <Image {...image} sizes="(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw" />} overlay={<SiteGridOverlay />} />`. `app/resources/page.tsx` loads the items and renders it. Change `sizes` if you change `columns`; allow the image hosts in `next.config.ts`. Do not edit the pasted file for any of this.
-3. **Add the detail.** Copy **Guides/Resource detail → Pattern — resource detail** (`…/docs/patterns/guides-resource-detail--detail.tsx`) into `components/resource-detail.tsx`, keep its header comment, and add `"use client"`. Each resource needs `{ id, title, image, video?: { src, poster, captions? }, category, tags?, meta?, note, added, addedLabel, visitHref, rows? }`.
+3. **Add the detail.** Copy **Guides/Resource detail → Pattern — resource detail** (`…/docs/patterns/guides-resource-detail--detail.tsx`) into `components/resource-detail.tsx`, keep its header comment as the first lines, and add `"use client"` below it. Each resource needs `{ id, title, image, video?: { src, poster, captions? }, category, tags?, meta?, note, added, addedLabel, visitHref, rows? }`.
 4. **Pick the form by route.**
    - The page: `app/resources/[slug]/page.tsx` renders `<ResourceDetailPage item={…} breadcrumb={[{ label: "Home", href: "/" }, { label: "Resources", href: "/resources" }, { label: item.title }]} overlay={<SiteGridOverlay />} />`. Delete `app/resources/[category]`: the categories become a filter group on the grid. No redirects.
    - The dialog: a parallel slot with an intercepting route (`app/resources/@detail/(.)[slug]/page.tsx`, a `default.tsx` that returns `null`, and `{detail}` in `app/resources/layout.tsx`) renders a client component with `<ResourceDetailDialog item={…} open onClose={() => router.back()} onPrevious={previous ? () => router.replace("/resources/" + previous.slug, { scroll: false }) : undefined} onNext={…} position={"3 of 9"} />`. Leave `onPrevious` out on the first resource and `onNext` out on the last.

package/CONSUMING.md

@@ -273,7 +273,7 @@ import {
 | `DescriptionList` | `layout` (`inline` \| `stacked`), `rule` (`solid` \| `dotted` \| `none`), `variant` (`sans` \| `mono`), `DescriptionList.Item` `name` / `layout` | Components/DescriptionList — **Pattern — post metadata**, **Pattern — details** |
 | `SectionCaption` | `children`, `as`, `id`, `end`, `marker`, `rule` | Components/SectionCaption — **Pattern — column caption**, **Pattern — caption with an action** |
 | `Prose` | `size` (`lg` \| `md`), `measure` (`reading` \| `none`), `as` | Components/Prose — **Pattern — article body**. Full page: **Guides/Post page → Pattern — post page** |
-| `IndexList` | `captions`, `size`, `titleAs`, `empty`, `IndexList.Item` `meta` / `title` / `href` / `preview` | Components/IndexList — **Pattern — post index**. With filters: **Guides/Filter panel → Pattern — filtered index** |
+| `IndexList` | `captions`, `size`, `titleAs`, `empty`, `IndexList.Item` `meta` / `title` / `href` or `render` / `preview` | Components/IndexList — **Pattern — post index**. With filters: **Guides/Filter panel → Pattern — filtered index** |
 | `LinkTile` | `title`, `href` / `render`, `external`, `media`, `ratio`, `meta`, `tag`, `source`, `loading` | Components/LinkTile — **Pattern — resource tile**, **Pattern — router link** |
 | `TileGrid` | `layout` (`masonry` / `uniform`), `columns`, `empty`, `busy`, `TileGrid.Item` | Components/TileGrid — **Pattern — tile grid**. With filters: **Guides/Filter panel → Pattern — filtered grid** |
 | `FilterPanel` | `groups`, `selection`, `onSelectionChange`, `resultsLabel`, `labels`; `FilterPanel.Rail` / `.Trigger` / `.Sheet`; `useFilterSelection`, `matchesFilterSelection`, `countFilterOptions` | Components/FilterPanel — **Pattern — filter panel** |

package/bin/wmds-check.mjs

@@ -230,22 +230,26 @@ for (const file of files) {
   });
 
   // Pasted patterns.
-  const header = lines[0]?.match(/^\/\/ @thewhatmatters\/wmds@([\w.-]+) · (.+)$/);
+  // The header is the file's first comment line. A "use client" / "use server" directive or blank
+  // lines may come before it.
+  const headerIndex = lines.findIndex((line) => line.trim() !== "" && !/^\s*["']use (client|server)["'];?\s*$/.test(line));
+  const headerLine = headerIndex === -1 ? 0 : headerIndex;
+  const header = lines[headerLine]?.match(/^\/\/ @thewhatmatters\/wmds@([\w.-]+) · (.+)$/);
   const id = source.match(/\?path=\/story\/([\w-]+)/)?.[1];
   if (header && id && packageRoot) {
     const shipped = path.join(packageRoot, "docs", "patterns", `${id}.tsx`);
     if (!existsSync(shipped)) {
-      report(file, 1, "pattern-removed", "error", `pattern ${id} no longer ships in ${packageVersion} — see CHANGELOG.md`);
+      report(file, headerLine + 1, "pattern-removed", "error", `pattern ${id} no longer ships in ${packageVersion} — see CHANGELOG.md`);
     } else {
       if (header[1] !== packageVersion) {
-        report(file, 1, "pattern-stale", "warn", `pasted from ${header[1]}, installed ${packageVersion} — re-copy if CHANGELOG names it`);
+        report(file, headerLine + 1, "pattern-stale", "warn", `pasted from ${header[1]}, installed ${packageVersion} — re-copy if CHANGELOG names it`);
       }
       const shippedStructure = patternStructure(readFileSync(shipped, "utf8"));
       const pastedStructure = patternStructure(source);
       if (shippedStructure.join("\n") !== pastedStructure.join("\n")) {
         report(
           file,
-          1,
+          headerLine + 1,
           "pattern-drift",
           "warn",
           `markup or classes differ from docs/patterns/${id}.tsx (${firstDifference(shippedStructure, pastedStructure)}) — allowed edits are content, data, handlers, exports`,

package/dist/components/atoms/TextLink/TextLink.d.ts

@@ -1,10 +1,16 @@
-import type { AnchorHTMLAttributes, ReactNode } from "react";
+import type { AnchorHTMLAttributes, ReactElement, ReactNode } from "react";
 import { type TextLinkVariant } from "./textLinkStyles";
 export { textLinkVariants, type TextLinkVariant } from "./textLinkStyles";
 /** Layout-only — margin or placement; not for changing the link treatment. */
 export type TextLinkLayoutClassName = string;
 export interface TextLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "children" | "className" | "href" | "target"> {
-    href: string;
+    /** Where the link goes. Leave it out when `render` carries the destination. */
+    href?: string;
+    /**
+     * Compose the link onto another element (Base UI `render`) — `render={<Link href="/blog/post" />}`
+     * for a router link. The treatment, the focus ring, and `external` stay the same.
+     */
+    render?: ReactElement;
     children: ReactNode;
     /**
      * `prose` (default) — medium weight with a solid underline, for links inside body copy.
@@ -18,5 +24,5 @@ export interface TextLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorEleme
     className?: TextLinkLayoutClassName;
 }
 /** Inline text navigation — the solid-underline prose link, or a quiet link for titles. */
-export declare function TextLink({ href, children, variant, external, className, rel, ...anchorProps }: TextLinkProps): import("react").JSX.Element;
+export declare function TextLink({ href, render, children, variant, external, className, rel, ...anchorProps }: TextLinkProps): ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 //# sourceMappingURL=TextLink.d.ts.map

package/dist/components/atoms/TextLink/TextLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextLink.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/TextLink/TextLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7D,OAAO,EAGL,KAAK,eAAe,EACrB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,gBAAgB,EAAE,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAE1E,8EAA8E;AAC9E,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC;AAE7C,MAAM,WAAW,aACf,SAAQ,IAAI,CACV,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,UAAU,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,CAC7C;IACD,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wCAAwC;IACxC,SAAS,CAAC,EAAE,uBAAuB,CAAC;CACrC;AAED,2FAA2F;AAC3F,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,QAAQ,EACR,OAAiB,EACjB,QAAgB,EAChB,SAAS,EACT,GAAG,EACH,GAAG,WAAW,EACf,EAAE,aAAa,+BAwBf"}
+{"version":3,"file":"TextLink.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/TextLink/TextLink.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG3E,OAAO,EAGL,KAAK,eAAe,EACrB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,gBAAgB,EAAE,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAE1E,8EAA8E;AAC9E,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC;AAE7C,MAAM,WAAW,aACf,SAAQ,IAAI,CACV,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,UAAU,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,CAC7C;IACD,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wCAAwC;IACxC,SAAS,CAAC,EAAE,uBAAuB,CAAC;CACrC;AAED,2FAA2F;AAC3F,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,OAAiB,EACjB,QAAgB,EAChB,SAAS,EACT,GAAG,EACH,GAAG,WAAW,EACf,EAAE,aAAa,8EA6Bf"}

package/dist/components/atoms/TextLink/TextLink.js

@@ -3,24 +3,29 @@ import { cn as e } from "../../../lib/cn.js";
 import { textLinkExternalIconClasses as t, textLinkVariantClasses as n, textLinkVariants as r } from "./textLinkStyles.js";
 import { SquareArrowOutUpRight as i } from "lucide-react";
 import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useRender as c } from "@base-ui/react/use-render";
 //#region src/components/atoms/TextLink/TextLink.tsx
-function c({ href: r, children: c, variant: l = "prose", external: u = !1, className: d, rel: f, ...p }) {
-	let m = u && f == null ? "noopener noreferrer" : f;
-	return /* @__PURE__ */ s("a", {
-		...p,
-		href: r,
-		target: u ? "_blank" : void 0,
-		rel: m,
-		className: e(n[l], d),
-		children: [c, u ? /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(i, {
-			className: t,
-			strokeWidth: 2,
-			"aria-hidden": !0
-		}), /* @__PURE__ */ o("span", {
-			className: "sr-only",
-			children: " (opens in a new tab)"
-		})] }) : null]
+function l({ href: r, render: l, children: u, variant: d = "prose", external: f = !1, className: p, rel: m, ...h }) {
+	let g = f && m == null ? "noopener noreferrer" : m;
+	return r == null && l == null && console.warn("[WMDS TextLink] Pass `href`, or `render` with a link that carries it."), c({
+		render: l,
+		defaultTagName: "a",
+		props: {
+			...h,
+			...r == null ? null : { href: r },
+			...f ? { target: "_blank" } : null,
+			...g == null ? null : { rel: g },
+			className: e(n[d], p),
+			children: /* @__PURE__ */ s(a, { children: [u, f ? /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(i, {
+				className: t,
+				strokeWidth: 2,
+				"aria-hidden": !0
+			}), /* @__PURE__ */ o("span", {
+				className: "sr-only",
+				children: " (opens in a new tab)"
+			})] }) : null] })
+		}
 	});
 }
 //#endregion
-export { c as TextLink, r as textLinkVariants };
+export { l as TextLink, r as textLinkVariants };

package/dist/components/molecules/IndexList/IndexList.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode } from "react";
+import { type ReactElement, type ReactNode } from "react";
 import { type IndexListSize, type IndexListTitleElement } from "./indexListStyles";
 export { indexListSizes, indexListTitleElements, type IndexListSize, type IndexListTitleElement, } from "./indexListStyles";
 /** Layout-only — width, margin, or grid placement. */
@@ -32,7 +32,10 @@ export interface IndexListProps {
 export interface IndexListItemProps {
     /** The row's title — a link to `href`. */
     title: string;
-    href: string;
+    /** Where the title goes. Leave it out when `render` carries the destination. */
+    href?: string;
+    /** The router's link for the title, in place of a plain anchor — `render={<Link href="/blog/post" />}`. */
+    render?: ReactElement;
     /** The meta column, for example a `<time>`. Above the title where the list is one column. */
     meta?: ReactNode;
     /** A short preview. When set, a control at the row's end expands it under the title. */
@@ -51,7 +54,7 @@ export interface IndexListItemProps {
  * optional preview that expands under the title. Optional column captions share the rows' tracks.
  */
 declare function IndexListRoot({ captions, size, titleAs, empty, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, children, className, }: IndexListProps): import("react").JSX.Element;
-declare function IndexListItem({ title, href, meta, preview, defaultOpen, open: openProp, onOpenChange, previewLabel, className, }: IndexListItemProps): import("react").JSX.Element;
+declare function IndexListItem({ title, href, render, meta, preview, defaultOpen, open: openProp, onOpenChange, previewLabel, className, }: IndexListItemProps): import("react").JSX.Element;
 export declare const IndexList: typeof IndexListRoot & {
     Item: typeof IndexListItem;
 };

package/dist/components/molecules/IndexList/IndexList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IndexList.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/IndexList/IndexList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,OAAO,EAiBL,KAAK,aAAa,EAClB,KAAK,qBAAqB,EAC3B,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EACL,cAAc,EACd,sBAAsB,EACtB,KAAK,aAAa,EAClB,KAAK,qBAAqB,GAC3B,MAAM,mBAAmB,CAAC;AAE3B,sDAAsD;AACtD,MAAM,MAAM,wBAAwB,GAAG,MAAM,CAAC;AAE9C,MAAM,WAAW,iBAAiB;IAChC,iGAAiG;IACjG,IAAI,EAAE,SAAS,CAAC;IAChB,2CAA2C;IAC3C,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,4FAA4F;IAC5F,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,mGAAmG;IACnG,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,wBAAwB,CAAC;CACtC;AAED,MAAM,WAAW,kBAAkB;IACjC,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,6FAA6F;IAC7F,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wFAAwF;IACxF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,wBAAwB,CAAC;CACtC;AASD;;;GAGG;AACH,iBAAS,aAAa,CAAC,EACrB,QAAQ,EACR,IAAW,EACX,OAAc,EACd,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,QAAQ,EACR,SAAS,GACV,EAAE,cAAc,+BA8BhB;AAED,iBAAS,aAAa,CAAC,EACrB,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,WAAmB,EACnB,IAAI,EAAE,QAAQ,EACd,YAAY,EACZ,YAAY,EACZ,SAAS,GACV,EAAE,kBAAkB,+BA6CpB;AAED,eAAO,MAAM,SAAS;;CAEpB,CAAC"}
+{"version":3,"file":"IndexList.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/IndexList/IndexList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,OAAO,EAiBL,KAAK,aAAa,EAClB,KAAK,qBAAqB,EAC3B,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EACL,cAAc,EACd,sBAAsB,EACtB,KAAK,aAAa,EAClB,KAAK,qBAAqB,GAC3B,MAAM,mBAAmB,CAAC;AAE3B,sDAAsD;AACtD,MAAM,MAAM,wBAAwB,GAAG,MAAM,CAAC;AAE9C,MAAM,WAAW,iBAAiB;IAChC,iGAAiG;IACjG,IAAI,EAAE,SAAS,CAAC;IAChB,2CAA2C;IAC3C,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,4FAA4F;IAC5F,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,mGAAmG;IACnG,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,wBAAwB,CAAC;CACtC;AAED,MAAM,WAAW,kBAAkB;IACjC,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,gFAAgF;IAChF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2GAA2G;IAC3G,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,6FAA6F;IAC7F,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wFAAwF;IACxF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gCAAgC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,wBAAwB,CAAC;CACtC;AASD;;;GAGG;AACH,iBAAS,aAAa,CAAC,EACrB,QAAQ,EACR,IAAW,EACX,OAAc,EACd,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,QAAQ,EACR,SAAS,GACV,EAAE,cAAc,+BA8BhB;AAED,iBAAS,aAAa,CAAC,EACrB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,OAAO,EACP,WAAmB,EACnB,IAAI,EAAE,QAAQ,EACd,YAAY,EACZ,YAAY,EACZ,SAAS,GACV,EAAE,kBAAkB,+BA6CpB;AAED,eAAO,MAAM,SAAS;;CAEpB,CAAC"}

package/dist/components/molecules/IndexList/IndexList.js

@@ -43,48 +43,49 @@ function k({ captions: t, size: n = "lg", titleAs: i = "h2", empty: o, "aria-lab
 		})
 	});
 }
-function A({ title: r, href: a, meta: s, preview: f, defaultOpen: p = !1, open: g, onOpenChange: y, previewLabel: b, className: C }) {
-	let { size: k, titleAs: A } = x(O), j = S(), [M, N] = w(p), P = g !== void 0, F = P ? g : M, I = f != null;
-	function L() {
-		let e = !F;
-		P || N(e), y?.(e);
+function A({ title: r, href: a, render: s, meta: f, preview: p, defaultOpen: g = !1, open: y, onOpenChange: b, previewLabel: C, className: k }) {
+	let { size: A, titleAs: j } = x(O), M = S(), [N, P] = w(g), F = y !== void 0, I = F ? y : N, L = p != null;
+	function R() {
+		let e = !I;
+		F || P(e), b?.(e);
 	}
 	return /* @__PURE__ */ D("li", {
-		className: e(o, C),
+		className: e(o, k),
 		children: [
-			s == null ? null : /* @__PURE__ */ E("div", {
+			f == null ? null : /* @__PURE__ */ E("div", {
 				className: c,
-				children: s
+				children: f
 			}),
 			/* @__PURE__ */ D("div", {
 				className: m,
-				children: [/* @__PURE__ */ E(A, {
-					className: e(h, _[k]),
+				children: [/* @__PURE__ */ E(j, {
+					className: e(h, _[A]),
 					children: /* @__PURE__ */ E(n, {
 						variant: "quiet",
 						href: a,
+						render: s,
 						children: r
 					})
-				}), I ? /* @__PURE__ */ E(t, {
+				}), L ? /* @__PURE__ */ E(t, {
 					size: "md",
-					className: v[k],
-					icon: /* @__PURE__ */ E(T, { className: e(i, F && "rotate-180") }),
-					"aria-label": b ?? `Preview: ${r}`,
+					className: v[A],
+					icon: /* @__PURE__ */ E(T, { className: e(i, I && "rotate-180") }),
+					"aria-label": C ?? `Preview: ${r}`,
 					title: "",
-					"aria-expanded": F,
-					"aria-controls": j,
-					onClick: L
+					"aria-expanded": I,
+					"aria-controls": M,
+					onClick: R
 				}) : null]
 			}),
-			I ? /* @__PURE__ */ E("div", {
+			L ? /* @__PURE__ */ E("div", {
 				className: e("motion-collapse", l),
-				"data-visible": F ? "true" : "false",
+				"data-visible": I ? "true" : "false",
 				children: /* @__PURE__ */ E("div", {
-					id: j,
+					id: M,
 					className: d,
 					children: /* @__PURE__ */ E("div", {
 						className: u,
-						children: f
+						children: p
 					})
 				})
 			}) : null

package/dist/components/molecules/LinkTile/LinkTile.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinkTile.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/LinkTile/LinkTile.tsx"],"names":[],"mappings":"AACA,OAAO,EAA6B,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAqBrF,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,sDAAsD;AACtD,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC;AAE7C,MAAM,WAAW,aAAa;IAC5B,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uEAAuE;IACvE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+GAA+G;IAC/G,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,2FAA2F;IAC3F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6GAA6G;IAC7G,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,uBAAuB,CAAC;CACrC;AAuBD;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,QAAgB,EAChB,KAAK,EACL,KAAK,EACL,IAAI,EACJ,GAAG,EACH,MAAM,EACN,OAAe,EACf,SAAS,GACV,EAAE,aAAa,+BAsFf"}
+{"version":3,"file":"LinkTile.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/LinkTile/LinkTile.tsx"],"names":[],"mappings":"AACA,OAAO,EAA6B,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAuBrF,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,sDAAsD;AACtD,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC;AAE7C,MAAM,WAAW,aAAa;IAC5B,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uEAAuE;IACvE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,+GAA+G;IAC/G,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,2FAA2F;IAC3F,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6GAA6G;IAC7G,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,uBAAuB,CAAC;CACrC;AAuBD;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,QAAgB,EAChB,KAAK,EACL,KAAK,EACL,IAAI,EACJ,GAAG,EACH,MAAM,EACN,OAAe,EACf,SAAS,GACV,EAAE,aAAa,+BA0Ff"}

package/dist/components/molecules/LinkTile/LinkTile.js

@@ -1,115 +1,121 @@
 "use client";
 import { cn as e } from "../../../lib/cn.js";
 import { Skeleton as t } from "../../atoms/Skeleton/Skeleton.js";
-import { linkTileCaptionClasses as n, linkTileExternalIconClasses as r, linkTileFrameClasses as i, linkTileFrameFixedClasses as a, linkTileFrameNaturalClasses as o, linkTileLoadingRatio as s, linkTileLoadingRootClasses as c, linkTileMetaClasses as l, linkTileRootClasses as u, linkTileSourceClasses as d, linkTileTagInlineClasses as f, linkTileTagOverClasses as p, linkTileTextClasses as m, linkTileTitleClasses as h } from "./linkTileStyles.js";
-import { useId as g } from "react";
-import { SquareArrowOutUpRight as _ } from "lucide-react";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
-import { useRender as b } from "@base-ui/react/use-render";
+import { linkTileCaptionClasses as n, linkTileExternalIconClasses as r, linkTileFrameClasses as i, linkTileFrameFixedClasses as a, linkTileFrameNaturalClasses as o, linkTileLoadingLineClasses as s, linkTileLoadingMetaLineClasses as c, linkTileLoadingRatio as l, linkTileLoadingRootClasses as u, linkTileMetaClasses as d, linkTileRootClasses as f, linkTileSourceClasses as p, linkTileTagInlineClasses as m, linkTileTagOverClasses as h, linkTileTextClasses as g, linkTileTitleClasses as _ } from "./linkTileStyles.js";
+import { useId as v } from "react";
+import { SquareArrowOutUpRight as y } from "lucide-react";
+import { jsx as b, jsxs as x } from "react/jsx-runtime";
+import { useRender as S } from "@base-ui/react/use-render";
 //#region src/components/molecules/LinkTile/LinkTile.tsx
-function x({ render: e, ...t }) {
-	return b({
+function C({ render: e, ...t }) {
+	return S({
 		render: e,
 		defaultTagName: "a",
 		props: t
 	});
 }
-function S(e) {
+function w(e) {
 	return e == null ? void 0 : { aspectRatio: String(e) };
 }
-function C({ title: s, href: b, render: C, external: w = !1, media: T, ratio: E, meta: D, tag: O, source: k, loading: A = !1, className: j }) {
-	let M = g(), N = `${M}-title`, P = `${M}-meta`, F = `${M}-tag`, I = `${M}-hint`;
-	if (A) return /* @__PURE__ */ y("div", {
-		className: e(c, j),
+function T({ title: l, href: S, render: T, external: E = !1, media: D, ratio: O, meta: k, tag: A, source: j, loading: M = !1, className: N }) {
+	let P = v(), F = `${P}-title`, I = `${P}-meta`, L = `${P}-tag`, R = `${P}-hint`;
+	if (M) return /* @__PURE__ */ x("div", {
+		className: e(u, N),
 		"data-link-tile": "",
 		"data-loading": "",
 		"aria-hidden": "true",
-		children: [/* @__PURE__ */ v("span", {
+		children: [/* @__PURE__ */ b("span", {
 			className: i,
-			style: S(E ?? 1.3333333333333333),
-			children: /* @__PURE__ */ v(t, { radius: "none" })
-		}), /* @__PURE__ */ y("span", {
-			className: m,
-			children: [/* @__PURE__ */ v(t, {
-				width: "70%",
-				height: 16,
-				radius: "inner",
-				index: 1
-			}), /* @__PURE__ */ v(t, {
-				width: "40%",
-				height: 12,
-				radius: "inner",
-				index: 2
+			style: w(O ?? 1.3333333333333333),
+			children: /* @__PURE__ */ b(t, { radius: "none" })
+		}), /* @__PURE__ */ x("span", {
+			className: g,
+			children: [/* @__PURE__ */ b("span", {
+				className: s,
+				children: /* @__PURE__ */ b(t, {
+					width: "70%",
+					height: 12,
+					radius: "inner",
+					index: 1
+				})
+			}), /* @__PURE__ */ b("span", {
+				className: c,
+				children: /* @__PURE__ */ b(t, {
+					width: "40%",
+					height: 10,
+					radius: "inner",
+					index: 2
+				})
 			})]
 		})]
 	});
-	b == null && C == null && console.warn("[WMDS LinkTile] Pass `href`, or `render` with a link that carries it.");
-	let L = T != null, R = [
-		N,
-		D != null && P,
-		O != null && F,
-		w && I
+	S == null && T == null && console.warn("[WMDS LinkTile] Pass `href`, or `render` with a link that carries it.");
+	let z = D != null, B = [
+		F,
+		k != null && I,
+		A != null && L,
+		E && R
 	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ y(x, {
-		render: C,
-		...b == null ? null : { href: b },
-		...w ? {
+	return /* @__PURE__ */ x(C, {
+		render: T,
+		...S == null ? null : { href: S },
+		...E ? {
 			target: "_blank",
 			rel: "noopener noreferrer"
 		} : null,
-		className: e(u, j),
-		"aria-labelledby": R,
+		className: e(f, N),
+		"aria-labelledby": B,
 		"data-link-tile": "",
-		"data-external": w ? "" : void 0,
-		children: [L ? /* @__PURE__ */ y("span", {
-			className: e(i, E == null ? o : a),
-			style: S(E),
+		"data-external": E ? "" : void 0,
+		children: [z ? /* @__PURE__ */ x("span", {
+			className: e(i, O == null ? o : a),
+			style: w(O),
 			"data-link-tile-frame": "",
-			children: [T, O == null ? null : /* @__PURE__ */ v("span", {
-				id: F,
-				className: p,
-				children: O
+			children: [D, A == null ? null : /* @__PURE__ */ b("span", {
+				id: L,
+				className: h,
+				children: A
 			})]
-		}) : null, /* @__PURE__ */ y("span", {
+		}) : null, /* @__PURE__ */ x("span", {
 			className: n,
 			children: [
-				k == null ? null : /* @__PURE__ */ v("span", {
-					className: d,
+				j == null ? null : /* @__PURE__ */ b("span", {
+					className: p,
 					"aria-hidden": "true",
-					children: k
+					children: j
 				}),
-				/* @__PURE__ */ y("span", {
-					className: m,
+				/* @__PURE__ */ x("span", {
+					className: g,
 					children: [
-						/* @__PURE__ */ y("span", {
-							id: N,
-							className: h,
-							children: [s, w ? /* @__PURE__ */ v(_, {
+						/* @__PURE__ */ x("span", {
+							id: F,
+							className: _,
+							children: [l, E ? /* @__PURE__ */ b(y, {
 								className: r,
 								strokeWidth: 2,
 								"aria-hidden": !0
 							}) : null]
 						}),
-						D == null ? null : /* @__PURE__ */ v("span", {
-							id: P,
-							className: l,
-							children: D
-						}),
-						w ? /* @__PURE__ */ v("span", {
+						k == null ? null : /* @__PURE__ */ b("span", {
 							id: I,
+							className: d,
+							children: k
+						}),
+						E ? /* @__PURE__ */ b("span", {
+							id: R,
 							className: "sr-only",
 							children: "(opens in a new tab)"
 						}) : null
 					]
 				}),
-				O != null && !L ? /* @__PURE__ */ v("span", {
-					id: F,
-					className: f,
-					children: O
+				A != null && !z ? /* @__PURE__ */ b("span", {
+					id: L,
+					className: m,
+					children: A
 				}) : null
 			]
 		})]
 	});
 }
 //#endregion
-export { C as LinkTile, s as linkTileLoadingRatio };
+export { T as LinkTile, l as linkTileLoadingRatio };

package/dist/components/molecules/LinkTile/linkTileStyles.d.ts

@@ -21,10 +21,16 @@ export declare const linkTileTagOverClasses = "absolute start-2 top-2 z-[1] flex
 export declare const linkTileCaptionClasses = "flex min-w-0 items-start gap-2";
 /** Holds the source mark on the title's first line. */
 export declare const linkTileSourceClasses = "flex h-5 shrink-0 items-center";
-export declare const linkTileTextClasses = "flex min-w-0 flex-1 flex-col gap-0.5";
+/** The title's lines, then the meta line on its 16px line, with no gap between them: the leading is the space. */
+export declare const linkTileTextClasses = "flex min-w-0 flex-1 flex-col";
+/** The loading placeholder's title line — the title's 20px line box, with the bar centered in it. */
+export declare const linkTileLoadingLineClasses = "flex h-5 items-center";
+/** The loading placeholder's meta line — the meta's 16px line box. */
+export declare const linkTileLoadingMetaLineClasses = "flex h-4 items-center";
 /** Two lines at most. Hover and keyboard focus underline it, as a quiet **TextLink** does. */
 export declare const linkTileTitleClasses: string;
 export declare const linkTileExternalIconClasses = "ml-1 inline-block size-[0.85em] align-[-0.05em] stroke-current text-muted";
+/** One line, on the 16px caption line so it sits close under the title. */
 export declare const linkTileMetaClasses: string;
 /** A tag on a tile with no image sits at the caption's end. */
 export declare const linkTileTagInlineClasses = "flex shrink-0 items-center";

package/dist/components/molecules/LinkTile/linkTileStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"linkTileStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/LinkTile/linkTileStyles.ts"],"names":[],"mappings":"AAIA,sGAAsG;AACtG,eAAO,MAAM,oBAAoB,QAAQ,CAAC;AAE1C;;;GAGG;AACH,eAAO,MAAM,mBAAmB,QAI/B,CAAC;AAEF,eAAO,MAAM,0BAA0B,uCAAuC,CAAC;AAE/E;;;GAGG;AACH,eAAO,MAAM,oBAAoB,QAMhC,CAAC;AAEF,uGAAuG;AACvG,eAAO,MAAM,2BAA2B,gDAAgD,CAAC;AAEzF,iGAAiG;AACjG,eAAO,MAAM,yBAAyB,0FACmD,CAAC;AAE1F,iDAAiD;AACjD,eAAO,MAAM,sBAAsB,8DAA8D,CAAC;AAElG,2EAA2E;AAC3E,eAAO,MAAM,sBAAsB,mCAAmC,CAAC;AAEvE,uDAAuD;AACvD,eAAO,MAAM,qBAAqB,mCAAmC,CAAC;AAEtE,eAAO,MAAM,mBAAmB,yCAAyC,CAAC;AAE1E,8FAA8F;AAC9F,eAAO,MAAM,oBAAoB,QAMhC,CAAC;AAEF,eAAO,MAAM,2BAA2B,8EAA8E,CAAC;AAEvH,eAAO,MAAM,mBAAmB,QAA6C,CAAC;AAE9E,+DAA+D;AAC/D,eAAO,MAAM,wBAAwB,+BAA+B,CAAC"}
+{"version":3,"file":"linkTileStyles.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/LinkTile/linkTileStyles.ts"],"names":[],"mappings":"AAIA,sGAAsG;AACtG,eAAO,MAAM,oBAAoB,QAAQ,CAAC;AAE1C;;;GAGG;AACH,eAAO,MAAM,mBAAmB,QAI/B,CAAC;AAEF,eAAO,MAAM,0BAA0B,uCAAuC,CAAC;AAE/E;;;GAGG;AACH,eAAO,MAAM,oBAAoB,QAMhC,CAAC;AAEF,uGAAuG;AACvG,eAAO,MAAM,2BAA2B,gDAAgD,CAAC;AAEzF,iGAAiG;AACjG,eAAO,MAAM,yBAAyB,0FACmD,CAAC;AAE1F,iDAAiD;AACjD,eAAO,MAAM,sBAAsB,8DAA8D,CAAC;AAElG,2EAA2E;AAC3E,eAAO,MAAM,sBAAsB,mCAAmC,CAAC;AAEvE,uDAAuD;AACvD,eAAO,MAAM,qBAAqB,mCAAmC,CAAC;AAEtE,kHAAkH;AAClH,eAAO,MAAM,mBAAmB,iCAAiC,CAAC;AAElE,qGAAqG;AACrG,eAAO,MAAM,0BAA0B,0BAA0B,CAAC;AAElE,sEAAsE;AACtE,eAAO,MAAM,8BAA8B,0BAA0B,CAAC;AAEtE,8FAA8F;AAC9F,eAAO,MAAM,oBAAoB,QAMhC,CAAC;AAEF,eAAO,MAAM,2BAA2B,8EAA8E,CAAC;AAEvH,2EAA2E;AAC3E,eAAO,MAAM,mBAAmB,QAAmD,CAAC;AAEpF,+DAA+D;AAC/D,eAAO,MAAM,wBAAwB,+BAA+B,CAAC"}

package/dist/components/molecules/LinkTile/linkTileStyles.js

@@ -3,6 +3,6 @@ import { cn as e } from "../../../lib/cn.js";
 import { typographyClass as t } from "../../../lib/typography.js";
 import { focusRingTransitionClasses as n, motionTransition as r } from "../../../lib/motion.js";
 //#region src/components/molecules/LinkTile/linkTileStyles.ts
-var i = 4 / 3, a = e("group/link-tile relative flex w-full min-w-0 flex-col gap-3 rounded-[var(--radius-card-body)] text-left no-underline", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-4 focus-visible:ring-offset-body", n), o = "flex w-full min-w-0 flex-col gap-3", s = e("relative block w-full overflow-hidden rounded-[var(--radius-card-body)] bg-muted-surface", "after:pointer-events-none after:absolute after:inset-0 after:rounded-[inherit] after:border after:border-border after:content-['']", "after:transition-[border-color,background-color] after:duration-fast after:ease-standard", "group-hover/link-tile:after:border-border-emphasized group-hover/link-tile:after:bg-overlay-hover", "group-focus-visible/link-tile:after:border-border-emphasized"), c = "[&>img]:block [&>img]:h-auto [&>img]:w-full", l = "[&>img]:absolute [&>img]:inset-0 [&>img]:block [&>img]:size-full [&>img]:object-cover", u = "absolute start-2 top-2 z-[1] flex max-w-[calc(100%-1rem)]", d = "flex min-w-0 items-start gap-2", f = "flex h-5 shrink-0 items-center", p = "flex min-w-0 flex-1 flex-col gap-0.5", m = e(t("ui-label"), "line-clamp-2 text-pretty underline decoration-transparent decoration-solid underline-offset-[0.2em]", "transition-[text-decoration-color]", r("fast"), "group-hover/link-tile:decoration-current group-focus-visible/link-tile:decoration-current"), h = "ml-1 inline-block size-[0.85em] align-[-0.05em] stroke-current text-muted", g = e(t("caption"), "truncate"), _ = "flex shrink-0 items-center";
+var i = 4 / 3, a = e("group/link-tile relative flex w-full min-w-0 flex-col gap-3 rounded-[var(--radius-card-body)] text-left no-underline", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-4 focus-visible:ring-offset-body", n), o = "flex w-full min-w-0 flex-col gap-3", s = e("relative block w-full overflow-hidden rounded-[var(--radius-card-body)] bg-muted-surface", "after:pointer-events-none after:absolute after:inset-0 after:rounded-[inherit] after:border after:border-border after:content-['']", "after:transition-[border-color,background-color] after:duration-fast after:ease-standard", "group-hover/link-tile:after:border-border-emphasized group-hover/link-tile:after:bg-overlay-hover", "group-focus-visible/link-tile:after:border-border-emphasized"), c = "[&>img]:block [&>img]:h-auto [&>img]:w-full", l = "[&>img]:absolute [&>img]:inset-0 [&>img]:block [&>img]:size-full [&>img]:object-cover", u = "absolute start-2 top-2 z-[1] flex max-w-[calc(100%-1rem)]", d = "flex min-w-0 items-start gap-2", f = "flex h-5 shrink-0 items-center", p = "flex min-w-0 flex-1 flex-col", m = "flex h-5 items-center", h = "flex h-4 items-center", g = e(t("ui-label"), "line-clamp-2 text-pretty underline decoration-transparent decoration-solid underline-offset-[0.2em]", "transition-[text-decoration-color]", r("fast"), "group-hover/link-tile:decoration-current group-focus-visible/link-tile:decoration-current"), _ = "ml-1 inline-block size-[0.85em] align-[-0.05em] stroke-current text-muted", v = e(t("caption-tight"), "truncate"), y = "flex shrink-0 items-center";
 //#endregion
-export { d as linkTileCaptionClasses, h as linkTileExternalIconClasses, s as linkTileFrameClasses, l as linkTileFrameFixedClasses, c as linkTileFrameNaturalClasses, i as linkTileLoadingRatio, o as linkTileLoadingRootClasses, g as linkTileMetaClasses, a as linkTileRootClasses, f as linkTileSourceClasses, _ as linkTileTagInlineClasses, u as linkTileTagOverClasses, p as linkTileTextClasses, m as linkTileTitleClasses };
+export { d as linkTileCaptionClasses, _ as linkTileExternalIconClasses, s as linkTileFrameClasses, l as linkTileFrameFixedClasses, c as linkTileFrameNaturalClasses, m as linkTileLoadingLineClasses, h as linkTileLoadingMetaLineClasses, i as linkTileLoadingRatio, o as linkTileLoadingRootClasses, v as linkTileMetaClasses, a as linkTileRootClasses, f as linkTileSourceClasses, y as linkTileTagInlineClasses, u as linkTileTagOverClasses, p as linkTileTextClasses, g as linkTileTitleClasses };

package/dist/components/molecules/TileGrid/tileGridStyles.d.ts

@@ -15,8 +15,8 @@ export declare const tileGridDefaultColumns: {
     readonly lg: 3;
 };
 /**
- * A packed grid's row track, in px (`--spacing`). A tile spans as many as its height needs, so
- * the space under a tile is the row gap plus at most this much less one.
+ * A packed grid's row track, in px (`--spacing`). A tile spans as many as its height needs, rounded
+ * up, so the space under a tile is the row gap plus less than this much (32px to just under 36px).
  */
 export declare const tileGridRowUnitPx = 4;
 export declare const tileGridRootClasses = "w-full min-w-0";

package/dist/lib/typography.d.ts

@@ -6,9 +6,9 @@
  * Atoms with fixed-height shells still use text-sm + leading-none until Phase 4 (type-control).
  */
 /** WMDS document roles — map to Astryx semantic type scale. */
-export type TypographyRole = "display" | "page-heading" | "section-heading" | "subheading" | "body" | "ui-label" | "caption" | "overline" | "eyebrow" | "reading";
+export type TypographyRole = "display" | "page-heading" | "section-heading" | "subheading" | "body" | "ui-label" | "caption" | "caption-tight" | "overline" | "eyebrow" | "reading";
 /** Astryx semantic type names (Foundation reference). */
-export type AstryxTypeScale = "display-1" | "display-2" | "display-3" | "heading-1" | "heading-2" | "heading-3" | "heading-4" | "heading-5" | "heading-6" | "large" | "body" | "label" | "supporting" | "code" | "control" | "eyebrow" | "reading";
+export type AstryxTypeScale = "display-1" | "display-2" | "display-3" | "heading-1" | "heading-2" | "heading-3" | "heading-4" | "heading-5" | "heading-6" | "large" | "body" | "label" | "supporting" | "caption" | "code" | "control" | "eyebrow" | "reading";
 export type TypographyTracking = "tight" | "normal" | "wider";
 export interface GeometricScaleStep {
     token: string;

package/dist/lib/typography.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../src/lib/typography.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,+DAA+D;AAC/D,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,cAAc,GACd,iBAAiB,GACjB,YAAY,GACZ,MAAM,GACN,UAAU,GACV,SAAS,GACT,UAAU,GACV,SAAS,GACT,SAAS,CAAC;AAEd,yDAAyD;AACzD,MAAM,MAAM,eAAe,GACvB,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,OAAO,GACP,MAAM,GACN,OAAO,GACP,YAAY,GACZ,MAAM,GACN,SAAS,GACT,SAAS,GACT,SAAS,CAAC;AAEd,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE9D,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,6CAA6C;IAC7C,UAAU,EAAE,eAAe,CAAC;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC;IAChC,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;CACd,CAgBA,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,cAAc,EAAE,kBAAkB,EAc9C,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;EAKd,CAAC;AAEX,mFAAmF;AACnF,eAAO,MAAM,SAAS;;;;;GAKnB,CAAC;AAEJ,eAAO,MAAM,gBAAgB,EAAE,eAAe,EAiH7C,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC;IAClC,IAAI,EAAE,eAAe,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB,CAkBA,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;EAsBf,CAAC;AAEX,kGAAkG;AAClG,eAAO,MAAM,qBAAqB,EAE7B,MAAM,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;AAEpC,wBAAgB,eAAe,CAAC,IAAI,EAAE,cAAc,GAAG,MAAM,CAE5D;AAED,8EAA8E;AAC9E,wBAAgB,4BAA4B,CAAC,IAAI,GAAE,OAAO,GAAG,IAErD,GAAG,kBAAkB,EAAE,CAS9B"}
+{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../src/lib/typography.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,+DAA+D;AAC/D,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,cAAc,GACd,iBAAiB,GACjB,YAAY,GACZ,MAAM,GACN,UAAU,GACV,SAAS,GACT,eAAe,GACf,UAAU,GACV,SAAS,GACT,SAAS,CAAC;AAEd,yDAAyD;AACzD,MAAM,MAAM,eAAe,GACvB,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,OAAO,GACP,MAAM,GACN,OAAO,GACP,YAAY,GACZ,SAAS,GACT,MAAM,GACN,SAAS,GACT,SAAS,GACT,SAAS,CAAC;AAEd,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE9D,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,6CAA6C;IAC7C,UAAU,EAAE,eAAe,CAAC;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC;IAChC,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;CACd,CAgBA,CAAC;AAEF,gFAAgF;AAChF,eAAO,MAAM,cAAc,EAAE,kBAAkB,EAc9C,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;EAKd,CAAC;AAEX,mFAAmF;AACnF,eAAO,MAAM,SAAS;;;;;GAKnB,CAAC;AAEJ,eAAO,MAAM,gBAAgB,EAAE,eAAe,EA6H7C,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC;IAClC,IAAI,EAAE,eAAe,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB,CAmBA,CAAC;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;EAsBf,CAAC;AAEX,kGAAkG;AAClG,eAAO,MAAM,qBAAqB,EAE7B,MAAM,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;AAEpC,wBAAgB,eAAe,CAAC,IAAI,EAAE,cAAc,GAAG,MAAM,CAE5D;AAED,8EAA8E;AAC9E,wBAAgB,4BAA4B,CAAC,IAAI,GAAE,OAAO,GAAG,IAErD,GAAG,kBAAkB,EAAE,CAS9B"}

package/dist/lib/typography.js

@@ -151,6 +151,17 @@ var t = [
 		sample: "Updated 2 minutes ago",
 		usedIn: ["Address line", "Input description"]
 	},
+	{
+		role: "caption-tight",
+		label: "Caption, tight",
+		description: "A single line directly under a label — supporting size and weight on a 16px line (WMDS extension). Not for wrapped text; that stays caption",
+		astryxType: "caption",
+		className: "type-caption text-muted",
+		tracking: "normal",
+		trackingClass: "tracking-normal",
+		sample: "contrast.example",
+		usedIn: ["LinkTile meta line"]
+	},
 	{
 		role: "overline",
 		label: "Overline",