Permit services

A React block (a whole screen) in Beamline's Government & legal app.

Where a permit starts on a city's permitting portal. The work's address resolved to the city (its permits are here) or the county around it (that office takes it, with a way there). The city's permits listed as a catalogue grouped by kind of work with counts, each with its usual review time and fee in columns; found by what's being done in plain words (deck, water heater) or narrowed by kind. One chosen leads with its review time, fee and kind of work, then shows what to have ready before starting, each ticked off as it's gathered with how many are ready, and starts an application whose draft keeps whatever is still missing; it can't start for an address outside the city.

Use it for

A public portal where people must first find the right office and the right service for their job.
Any application whose success depends on having things ready before starting.

Not for

Filling in the application (permit-application).
A submitted permit (permit-record).

Anatomy

where: the address; in the city, or outside with the county's link
permits: what you're doing; kinds with counts; each permit with kind, review time and fee
before you start: the permit; ready of all with the meter; each thing to have ready; what's still to gather; Start application or the draft started

States

no address
in the city
outside the city
nothing matches
all ready
draft started

Keyboard

Tab through the address, the search, the kinds, the permits and the checklist

Props

Prop	Type	Default	Description
`city` (required)	`string`	—	The city's name as it reads in a sentence ("City of Larkspur").
`county` (required)	`string`	—	The county around it, which takes permits outside the city.
`addresses` (required)	`ServiceAddress[]`	—
`services` (required)	`PermitService[]`	—
`address`	`string \| null`	—
`defaultAddress`	`string \| null`	—
`onAddressChange`	`((id: string \| null) => void)`	—
`defaultService`	`string \| null`	—
`defaultQuery`	`string`	—
`defaultReady`	`string[]`	—	Requirements already ticked off, by id.
`onStart`	`((o: { service: string; address: string; ready: string[]; }) => void)`	—
`onCounty`	`(() => void)`	—	Sent elsewhere: the county's permit office.
`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

combobox
search-field
chip-group
checkbox
button

Dependencies

lucide-react

Import

import { PermitServices } from "@beamline/permit-services";

Get it

Permit services 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

Permit servicesComplete system · $49

Where a permit starts on a city's permitting portal.

A deck on Alder Street

Brightline Builders is about to apply for a deck in Larkspur: the address is the city's, the city's permits are listed by kind of work with their review time and fee (type “deck” or “water heater” to find one), the deck permit is open, and two of the four things to have ready are in hand.

0 × 0full

Outside the city

Old Mill Road is past the city line: the county takes that permit, so it says so before anything is started.