{
  "example": "import { SkeletonStat } from \"@godxjp/ui/feedback\";\nimport { ResponsiveGrid } from \"@godxjp/ui/layout\";\n\n<ResponsiveGrid columns={{ base: 1, sm: 2, lg: 4 }} gap=\"md\">\n  {Array.from({ length: 4 }).map((_, i) => (\n    <SkeletonStat key={i} />\n  ))}\n</ResponsiveGrid>",
  "group": "feedback",
  "importPath": "@godxjp/ui/feedback",
  "name": "SkeletonStat",
  "props": [],
  "related": [
    "StatCard — the loaded component this stands in for; match the grid, not just the size.",
    "SkeletonDetail — the same propless treatment for a record page.",
    "SkeletonRows — flat list lines.",
    "Skeleton — the bare block this preset is built from."
  ],
  "rules": [
    3,
    31
  ],
  "storyPath": "feedback/Skeleton.stories.tsx",
  "tagline": "Fixed-shape placeholder for ONE KPI tile — label, big value, caption. Takes no props, so a row of tiles loads at a uniform height and nothing reflows when the numbers arrive.",
  "usage": [
    "DO render one per StatCard while the figures load, inside the same grid the loaded tiles use.",
    "DO leave it propless — it mirrors StatCard's three-line rhythm exactly, which is what stops the row jumping on hydration.",
    "DON'T wrap it in a Card yourself if the loaded state uses StatCard; put it where the StatCard goes so the surface is identical.",
    "Import from `@godxjp/ui/feedback` (canonical). `@godxjp/ui/admin` re-exports it for admin pages."
  ],
  "useCases": [
    "Dashboard KPI row before the metrics query resolves",
    "A single figure on a detail page loading separately from the record",
    "Placeholder inside a ResponsiveGrid of StatCards"
  ]
}
