{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "author": "Lopifi (https://lopifi.com)",
  "categories": [
    "statements",
    "finance",
    "accounting"
  ],
  "dependencies": [],
  "description": "Basis, period, comparison, currency, consolidation.",
  "files": [
    {
      "content": "\"use client\";\n\nimport { cn } from \"@/lib/ledger/cn\";\nimport type { AccountingBasis } from \"@/lib/ledger/money.types\";\nimport { Button } from \"@/components/ledger/button\";\nimport { CurrencySelect } from \"@/components/ledger/currency-select\";\nimport { ExportMenu } from \"@/components/ledger/export-menu\";\nimport { ArrowsPointingInIcon, ChevronUpDownIcon } from \"@/components/ledger/icons\";\nimport { PeriodPicker, type PeriodSelection } from \"@/components/ledger/period-picker\";\n\nexport interface StatementToolbarProps {\n  basis: AccountingBasis;\n  className?: string;\n  comparison: string;\n  consolidation: string;\n  currency: string;\n  fiscalYearStartMonth?: number;\n  onBasisChange: (b: AccountingBasis) => void;\n  onCollapseAll?: () => void;\n  onComparisonChange: (c: string) => void;\n  onConsolidationChange: (c: string) => void;\n  onCurrencyChange: (c: string) => void;\n  onExpandAll?: () => void;\n  onExport?: (format: \"csv\" | \"xlsx\" | \"pdf\") => void;\n  onPeriodChange: (p: PeriodSelection) => void;\n  period: PeriodSelection;\n}\n\nconst COMPARISONS = [\"Prior period\", \"Prior year\", \"Budget\", \"Forecast\", \"None\"];\n\n/**\n * The basis toggle is prominent and always visible. A P&L on cash basis and\n * the same P&L on accrual basis are different statements, and a user who\n * doesn't know which they're looking at is being misled. This is not a\n * settings-menu item.\n */\nexport function StatementToolbar({\n  basis,\n  onBasisChange,\n  period,\n  onPeriodChange,\n  fiscalYearStartMonth = 1,\n  comparison,\n  onComparisonChange,\n  currency,\n  onCurrencyChange,\n  consolidation,\n  onConsolidationChange,\n  onExpandAll,\n  onCollapseAll,\n  onExport,\n  className,\n}: StatementToolbarProps) {\n  return (\n    <div\n      className={cn(\n        \"no-print flex flex-wrap items-center gap-2 rounded-md border border-border bg-surface p-3\",\n        className,\n      )}\n    >\n      <div\n        aria-label=\"Accounting basis\"\n        className=\"flex rounded-sm border border-border-strong p-0.5\"\n        role=\"radiogroup\"\n      >\n        {([\"accrual\", \"cash\"] as const).map((b) => (\n          <button\n            aria-checked={basis === b}\n            className={cn(\n              \"press h-7 rounded-xs px-3 text-label font-medium capitalize\",\n              basis === b\n                ? \"bg-surface-selected text-text-primary\"\n                : \"text-text-secondary hover:bg-surface-hover\",\n            )}\n            key={b}\n            onClick={() => onBasisChange(b)}\n            role=\"radio\"\n            type=\"button\"\n          >\n            {b}\n          </button>\n        ))}\n      </div>\n\n      <PeriodPicker\n        fiscalYearStartMonth={fiscalYearStartMonth}\n        onValueChange={onPeriodChange}\n        value={period}\n      />\n\n      <label className=\"flex items-center gap-2\">\n        <span className=\"sr-only\">Comparison</span>\n        <select\n          className=\"h-8 rounded-sm border border-border bg-surface px-2 text-label outline-none focus-visible:border-accent focus-visible:ring-2 focus-visible:ring-accent-subtle\"\n          onChange={(e) => onComparisonChange(e.target.value)}\n          value={comparison}\n        >\n          {COMPARISONS.map((c) => (\n            <option key={c}>{c}</option>\n          ))}\n        </select>\n      </label>\n\n      <CurrencySelect\n        className=\"h-8\"\n        label=\"Presentation currency\"\n        onValueChange={onCurrencyChange}\n        value={currency}\n      />\n\n      <label className=\"flex items-center gap-2\">\n        <span className=\"sr-only\">Consolidation scope</span>\n        <select\n          className=\"h-8 rounded-sm border border-border bg-surface px-2 text-label outline-none focus-visible:border-accent focus-visible:ring-2 focus-visible:ring-accent-subtle\"\n          onChange={(e) => onConsolidationChange(e.target.value)}\n          value={consolidation}\n        >\n          <option>Consolidated</option>\n          <option>Parent standalone</option>\n          <option>Northwind Ltd</option>\n          <option>Northwind GmbH</option>\n        </select>\n      </label>\n\n      <div className=\"ml-auto flex flex-wrap items-center gap-2\">\n        <Button aria-label=\"Expand all rows\" onClick={onExpandAll} size=\"sm\" variant=\"ghost\">\n          <ChevronUpDownIcon aria-hidden=\"true\" className=\"size-3.5\" />\n          Expand all\n        </Button>\n        <Button aria-label=\"Collapse all rows\" onClick={onCollapseAll} size=\"sm\" variant=\"ghost\">\n          <ArrowsPointingInIcon aria-hidden=\"true\" className=\"size-3.5\" />\n          Collapse all\n        </Button>\n        {onExport ? (\n          <ExportMenu\n            onExport={onExport}\n            scopeCount={1}\n            scopeDescription=\"statement with the resolved period and basis\"\n          />\n        ) : null}\n      </div>\n    </div>\n  );\n}\n",
      "path": "components/ledger/statement-toolbar.tsx",
      "target": "components/ledger/statement-toolbar.tsx",
      "type": "registry:component"
    }
  ],
  "name": "statement-toolbar",
  "registryDependencies": [
    "@lopifi/theme",
    "@lopifi/button",
    "@lopifi/cn",
    "@lopifi/currency-select",
    "@lopifi/export-menu",
    "@lopifi/icons",
    "@lopifi/money.types",
    "@lopifi/period-picker"
  ],
  "title": "StatementToolbar",
  "type": "registry:component"
}
