{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "utxo-table",
  "title": "UTXO table",
  "description": "Semantic unspent transaction output ledger.",
  "registryDependencies": [
    "dennisonbertram/bitcoin-ui/bitcoin-amount",
    "dennisonbertram/bitcoin-ui/hash-display",
    "dennisonbertram/bitcoin-ui/protocol-badges"
  ],
  "files": [
    {
      "path": "components/bitcoin/utxo-table.tsx",
      "content": "import type { ComponentProps } from \"react\";\n\nimport type { BitcoinUtxo } from \"@/lib/bitcoin\";\nimport { componentClasses } from \"@/lib/utils\";\n\nimport { BitcoinAmount } from \"./bitcoin-amount\";\nimport { HashDisplay } from \"./hash-display\";\nimport { ScriptBadge } from \"./script-badge\";\nimport { panelStyles, type BitcoinVisualProps } from \"./shared\";\n\nexport type UtxoTableProps = Omit<ComponentProps<\"div\">, \"children\"> &\n  BitcoinVisualProps & {\n    utxos: BitcoinUtxo[];\n    caption?: string;\n    getTransactionHref?: (utxo: BitcoinUtxo) => string | undefined;\n  };\n\nexport function UtxoTable({\n  utxos,\n  caption = \"Unspent transaction outputs\",\n  getTransactionHref,\n  unstyled,\n  className,\n  ...props\n}: UtxoTableProps) {\n  return (\n    <div\n      data-slot=\"utxo-table\"\n      data-unstyled={unstyled || undefined}\n      className={componentClasses(\n        unstyled,\n        [panelStyles, \"max-w-full overflow-x-auto\"],\n        className,\n      )}\n      {...props}\n    >\n      <table\n        className={componentClasses(\n          unstyled,\n          \"w-full min-w-[44rem] border-collapse text-left text-sm\",\n        )}\n      >\n        <caption\n          className={componentClasses(\n            unstyled,\n            \"border-b border-[var(--color-rule)] px-4 py-3 text-left text-sm font-medium\",\n          )}\n        >\n          {caption}\n        </caption>\n        <thead>\n          <tr\n            className={componentClasses(\n              unstyled,\n              \"border-b border-[var(--color-rule-subtle)] text-xs text-[var(--color-muted)]\",\n            )}\n          >\n            <th className={componentClasses(unstyled, \"px-4 py-3 font-normal\")}>\n              Outpoint\n            </th>\n            <th className={componentClasses(unstyled, \"px-4 py-3 font-normal\")}>\n              Script\n            </th>\n            <th className={componentClasses(unstyled, \"px-4 py-3 font-normal\")}>\n              Confirmations\n            </th>\n            <th\n              className={componentClasses(\n                unstyled,\n                \"px-4 py-3 text-right font-normal\",\n              )}\n            >\n              Value\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          {utxos.map((utxo) => (\n            <tr\n              key={`${utxo.txid}:${utxo.vout}`}\n              data-slot=\"utxo-table-row\"\n              data-spendable={utxo.spendable}\n              className={componentClasses(\n                unstyled,\n                \"border-b border-[var(--color-rule-subtle)] last:border-0 hover:bg-[var(--color-surface)]\",\n              )}\n            >\n              <td className={componentClasses(unstyled, \"px-4 py-3\")}>\n                <div className=\"flex min-w-0 items-center\">\n                  <HashDisplay\n                    value={utxo.txid}\n                    label=\"Transaction ID\"\n                    href={getTransactionHref?.(utxo)}\n                    startCharacters={7}\n                    endCharacters={5}\n                    unstyled={unstyled}\n                  />\n                  <span\n                    className={componentClasses(\n                      unstyled,\n                      \"font-mono text-xs text-[var(--color-muted)]\",\n                    )}\n                  >\n                    :{utxo.vout}\n                  </span>\n                </div>\n              </td>\n              <td className={componentClasses(unstyled, \"px-4 py-3\")}>\n                <ScriptBadge type={utxo.scriptType} unstyled={unstyled} />\n              </td>\n              <td\n                className={componentClasses(\n                  unstyled,\n                  \"px-4 py-3 font-mono text-xs tabular-nums\",\n                )}\n              >\n                {utxo.confirmations.toLocaleString(\"en-US\")}\n              </td>\n              <td\n                className={componentClasses(\n                  unstyled,\n                  \"px-4 py-3 text-right\",\n                )}\n              >\n                <BitcoinAmount\n                  value={utxo.value}\n                  unit=\"sat\"\n                  unstyled={unstyled}\n                />\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}