{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "author": "Lopifi (https://lopifi.com)",
  "categories": [
    "statements",
    "finance",
    "accounting"
  ],
  "dependencies": [],
  "description": "Absolute + percent + significance flag.",
  "files": [
    {
      "content": "import { cn } from \"@/lib/ledger/cn\";\nimport { safeRelativeChange } from \"@/lib/ledger/format-money\";\nimport type { Polarity } from \"@/lib/ledger/money.types\";\nimport { Money } from \"@/components/ledger/money\";\nimport { Percent } from \"@/components/ledger/percent\";\nimport { Tooltip } from \"@/components/ledger/tooltip\";\n\nexport interface VarianceCellProps {\n  currency: string;\n  current: number | null;\n  hidden?: boolean;\n  /**\n   * Both thresholds must be exceeded for a variance to flag. A 200% swing on\n   * $12 isn't news, and $40,000 on $8M isn't either.\n   */\n  materiality?: { absolute: number; relative: number };\n  polarity?: Polarity;\n  prior: number | null;\n}\n\n/**\n * Absolute change and percent change together — either alone misleads.\n * Division by zero renders `n/a`, never Infinity.\n */\nexport function VarianceCell({\n  current,\n  prior,\n  currency,\n  polarity = \"standard\",\n  materiality,\n  hidden = false,\n}: VarianceCellProps) {\n  if (hidden || current === null || prior === null) {\n    return (\n      <>\n        <td className=\"px-3 py-3\" />\n        <td className=\"px-6 py-3\" />\n      </>\n    );\n  }\n\n  const absolute = current - prior;\n  const relative = safeRelativeChange(current, prior);\n  const material =\n    materiality != null &&\n    Math.abs(absolute) >= materiality.absolute &&\n    relative != null &&\n    Math.abs(relative.value) >= materiality.relative;\n\n  const up = absolute > 0;\n  const tone =\n    polarity === \"neutral\"\n      ? \"text-text-secondary\"\n      : absolute === 0\n        ? \"text-text-secondary\"\n        : (polarity === \"standard\") === up\n          ? \"text-positive\"\n          : \"text-negative\";\n\n  return (\n    <>\n      <td className={cn(\"px-3 py-3 text-right\", tone)}>\n        <span className=\"inline-flex items-baseline gap-1\">\n          {material ? (\n            <Tooltip content=\"Exceeds both the absolute and relative materiality thresholds\">\n              <span aria-label=\"material variance\" className=\"text-[0.85em] leading-none\" role=\"img\">\n                ▸\n              </span>\n            </Tooltip>\n          ) : null}\n          <Money accounting tone=\"inherit\" value={{ amount: absolute, currency }} />\n        </span>\n      </td>\n      <td className={cn(\"px-6 py-3 text-right\", tone)}>\n        <Percent className=\"text-inherit\" value={relative} />\n      </td>\n    </>\n  );\n}\n",
      "path": "components/ledger/variance-cell.tsx",
      "target": "components/ledger/variance-cell.tsx",
      "type": "registry:component"
    }
  ],
  "name": "variance-cell",
  "registryDependencies": [
    "@lopifi/theme",
    "@lopifi/cn",
    "@lopifi/format-money",
    "@lopifi/money",
    "@lopifi/money.types",
    "@lopifi/percent",
    "@lopifi/tooltip"
  ],
  "title": "VarianceCell",
  "type": "registry:component"
}