{
  "name": "price",
  "title": "Price",
  "description": "Renders a formatted price in the display currency.",
  "type": "component",
  "registryDependencies": [],
  "files": [
    {
      "path": "price.tsx",
      "content": "\"use client\";\n\nimport React from \"react\";\nimport { formatPrice } from \"@cimplify/sdk\";\nimport type { CurrencyCode } from \"@cimplify/sdk\";\nimport { useOptionalCimplify } from \"@cimplify/sdk/react\";\n\nexport interface PriceProps {\n  /** The amount, denominated in `currency` (or the business base currency). */\n  amount: number | string;\n  /**\n   * Currency the `amount` is denominated in. Pass the product/order currency\n   * so the value renders correctly during SSR — before the provider has\n   * loaded the business client-side. Falls back to the provider's base\n   * currency, then USD.\n   */\n  currency?: CurrencyCode;\n  /** Optional CSS class name for the wrapping span. */\n  className?: string;\n  /** Optional prefix rendered before the formatted price (e.g. \"+\"). */\n  prefix?: string;\n  /**\n   * Apply the provider's FX display-currency override when one is active.\n   * Default true. The conversion is a post-hydration enhancement: it only\n   * engages once an FX rate has loaded client-side, so SSR and first-paint\n   * output always match and no currency flash occurs.\n   */\n  convert?: boolean;\n}\n\n/**\n * Price — renders a formatted price value.\n *\n * Currency is resolved from the `currency` prop (the amount's source currency),\n * falling back to the provider's base currency, then USD. Because the source\n * currency comes from data rather than the client-only provider bootstrap, an\n * explicit `currency` renders correctly during SSR.\n *\n * FX display-currency conversion (when a user picks a non-base display\n * currency) is layered on top after hydration, and only when the source is the\n * base currency the FX rate is computed from. It never affects the server or\n * first-paint render, so there is no hydration mismatch.\n */\nexport function Price({\n  amount,\n  currency,\n  className,\n  prefix,\n  convert = true,\n}: PriceProps): React.ReactElement {\n  const context = useOptionalCimplify();\n  const sourceCurrency =\n    currency ?? (context?.baseCurrency as CurrencyCode | undefined) ?? \"USD\";\n\n  const fxActive =\n    convert &&\n    context?.fxRate != null &&\n    context.displayCurrency !== sourceCurrency &&\n    sourceCurrency === context.baseCurrency;\n\n  const resolvedCurrency = (fxActive ? context!.displayCurrency : sourceCurrency) as CurrencyCode;\n  const resolvedAmount = fxActive\n    ? context!.convertPrice(amount)\n    : typeof amount === \"string\"\n      ? parseFloat(amount) || 0\n      : amount;\n\n  return (\n    <span className={className}>\n      {prefix}\n      {formatPrice(resolvedAmount, resolvedCurrency)}\n    </span>\n  );\n}\n"
    }
  ]
}