A two-column calculator: seat and volume sliders, a billing period switch, and add-on toggles on the left, and a summary card on the right whose rolling price and line items follow every change. The base price, per-seat and per-unit rates, included amounts, yearly discount, and currency are all props.
Files · 6
Dependencies
npm packages
clsx
tailwind-merge
lucide-react
Registry items
button
switch
Registry Items
pricing84
Configuration
Name
pricing84
Type
Block
Description
A two-column calculator: seat and volume sliders, a billing period switch, and add-on toggles on the left, and a summary card on the right whose rolling price and line items follow every change. The base price, per-seat and per-unit rates, included amounts, yearly discount, and currency are all props.