Developer kit
Everything needed to add an “estimated monthly payment” widget to your site. Download it all at once, or pick single files below.
Files
MonthlyPaymentEstimate.tsx29 KB
Drop-in React widget ('use client'). Styles: auto, dropdown, button. Follows every display rule. Tested on React 18 and 19.
payment-estimate-api.ts16 KB
TypeScript types for every response, plus getOptions() and getEstimate() helpers.
monthly-payment-estimate.css8 KB
.pme-* classes and --pme-* variables (mysheds colors and Rubik). Restyle freely.
README.md7 KB
Install steps, every prop, an example for each style, and what customers see for each error.
openapi.json305 KB
OpenAPI 3.0 description of the whole API. Import into Swagger, Postman or a code generator.
Quick start (React / Next.js)
- Copy
MonthlyPaymentEstimate.tsx,payment-estimate-api.tsandmonthly-payment-estimate.cssinto your project. - Put the widget on a product page and pass it the total price from your price calculator:
import MonthlyPaymentEstimate from './MonthlyPaymentEstimate';
import './monthly-payment-estimate.css';
<MonthlyPaymentEstimate price={totalPrice} displayStyle="auto" />- Open the test page, press Run all scenarios, and compare your widget with it.
ZIP is optional. Thrive and Upgrade lend in every ZIP, so a blank or incorrect ZIP still shows loan payments. Only rent-to-own needs a valid US ZIP — otherwise it shows “Incorrect Zip Code entered. Please provide a valid US Zip Code to see Rent-to-Own options.”
Rules for showing payments (APR + term with every payment, footnote marks, disclosures, no APR for rent-to-own) are in the API guide.