50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:Tae9,/** * Stat — one figure and its label, as a description-list group. * * DOM order is `

` (label) then `

` (value) because that is the only order * a definition list permits; `flex-col-reverse` puts the number on top visually. * Reading order and visual order therefore differ by one line, which is the * right trade: the value is meaningless to a screen reader without its label * arriving first. * * Must be rendered inside a `

` — the `Stats` section does that for you. * * `as` exists because of a constraint a `

` actually enforces: it may contain * `dt`/`dd` pairs wrapped in at most **one** level of `div`. Wrapping `Stat` in * another element to style or animate it puts the pair two levels deep, which * is invalid and which axe flags as `definition-list` plus `dlitem`. So the * caller replaces this wrapper instead of adding one around it. * * a11y: `value` should include its own unit ("99.9%", "$2.4M"). Pass `srValue` * when the display form is an abbreviation a screen reader would mangle. * * Dependencies: react, @/lib/utils. */ import type { ElementType, ReactNode } from "react" import { cn } from "@/lib/utils" export interface StatItem { /** The figure, including its unit or symbol. */ value: string label: string /** Optional sentence of context below the label. */ description?: string /** Spoken form, when `value` is an abbreviation ("1.2K" -> "1200"). */ srValue?: string } export interface StatProps extends StatItem { /** The group wrapper. Defaults to `"div"`, the only element a `

{label} {description ? ( {description} ) : null}: {srValue ? ( <> {value} {srValue} ) : ( value )} {children}