Solar quote
A React block (a whole screen) in Beamline's Manufacturing app.
A residential solar quote. The system's price at its rate per watt with adders, discounts and incentives each switched on or off: discounts come off one after another to the contract price, incentives (paid back after install) to the cost after incentives, each total with its price per watt. The customer's monthly bill before and after as two stacked bars and a table, each charge matched by colour, with what's saved and what they'll still pay and why. The proposal's sections shown when presenting and put in the exported PDF separately, a section hidden in both said, the PDF's pages counted. The price tab leads with the cost after incentives, its price per watt, how many years the bill's savings take to pay it back, and the steps from the system price to it; each adder, discount and incentive is a line pressed to include it or leave it out (struck through, no amount). Proposal sections are pressed tags per output, the PDF's page range said on each.
Use it for
- Pricing and presenting a residential energy system with adders, discounts and incentives.
- Any quote whose savings must be shown honestly against what the customer still pays.
Not for
- Battery sizing (battery-sizing).
- Payment plans and deposits (proposal-payments).
Anatomy
- bar: customer and address; system size and panels; Price, Bill, Proposal
- price: base at its rate; adders; discounts with their rate; contract price per watt; incentives with the note; cost after incentives per watt
- bill: before and after bars; charges table with totals; saves and still pays
- proposal: sections with Present and PDF; hidden everywhere; sections and pages
States
- line switched off
- export credit
- hidden everywhere
Keyboard
- Tab through the switches
Props
| Prop | Type | Default | Description |
|---|---|---|---|
title (required) | string | — | The customer and address the quote is for. |
system (required) | QuoteSystem | — | |
defaultAdders (required) | QuoteAdder[] | — | |
defaultDiscounts (required) | QuoteReduction[] | — | |
defaultIncentives (required) | QuoteReduction[] | — | |
bill (required) | BillComponent[] | — | |
defaultSections (required) | ProposalSection[] | — | |
defaultTab | "bill" | "price" | "proposal" | — | |
className | string | — | Classes on the documented visual root; no override by default. |
style | CSSProperties | — | Inline styles on the documented visual root; no overrides by default. |
ref | Ref<HTMLDivElement> | — | Receives the documented native target or imperative handle; omitted by default. |
Built from
- tabs
- switch
Dependencies
lucide-react
Import
import { SolarQuote } from "@beamline/solar-quote";
Get it
Solar quote is part of Beamline UI. Install the parts you need in your React app as compiled packages or editable source. Get Beamline · Connect your agent
More in Manufacturing
- Shop floor: A workshop's shop floor at one workstation: each job is a card at its work centre with why it isn't ready said in words (parts short, or the previous…
- Production plan: A production plan by month: each product's starting stock, forecast demand, replenishment and ending stock, every ending rolling into the next month's…
- Production and lots: Stock made and stored, with every movement traceable. A batch of a recipe, read as a batch sheet: the recipe, batches (in halves) and day as one sentence…
- Print scheduler: A print shop's production schedule. The week by station: each station's day holds its runs, with a load bar and minutes used against the station's…
- Plan readiness: A solar plan on its way to a permit. The design checks (fire setback from the ridge, string voltage in the cold, roof load, eave and rake setbacks, the…
- Design inputs: What a solar design is checked against, and what the home really uses. Code standards and site conditions (building, electrical and fire codes, wind…
- Roof layout: The roof of a solar design. The roof in plan with every face's panels drawn as they lie under its roof type's rules (projected from the slope), each…
- Electrical design: The electrical side of a solar design. The existing service set up from a named way of connecting to it (a load-side breaker or a supply-side tap), the…
- Battery sizing: A home battery sized beside its solar. The model and how many with capacity, power and installed price; how it runs (kept full for an outage, storing…
- Field conditions: A farm's fields and what each one's conditions are. The fields as a searchable list (each with its outline, crop, area and the layer's value, or Not…
- Grazing plan: Mobs on a grazing rotation, on the farm's map: with a map base, its parcels are the paddocks, each filled by where it stands in the chosen mob's plan (on…
- Run of show: One service or event plan's order, run more than once: sections and items with each occurrence's start time in its own column, each item's length dragged…
- Sound library: A library of sounds (or any media a person auditions before using): a search by words and #tags with facets as filters, a live "3 filters · 12 results"…
- Tag manager: Tags for one or several items at once (sounds, photos, documents). Nested tag groups are edited in place (rename, new tag), and a folded group still says…