Unique pricing chart modal

A reusable step-style line chart component built with Recharts and ShadCN UI, used to visualize monthly data trends. It accepts an array of { month, value } objects and dynamically renders a smooth step line with customizable color and tooltips.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Unique pricing chart modal to your project and fits it to your theme.

import React from 'react'
import { PricingInteractionRow } from '@/components/ui/unique-pricing-chart-modal'
export default function PricingInteractionRowDemo() {
  return (
    <div className='size-full h-fit flex justify-center items-center'>
        <PricingInteractionRow
          starterMonth={24.5}
          starterAnnual={50.5}
          proMonth={124.5}
          proAnnual={145.6}
        />
    </div>
  )
}