Home Address Street

This kit can be used to display the address for a homeowner/project. It contains street address, APT format, City, state and zip. A Project hashtag can be used as a prop to link back to a project.

Default


PBHomeAddressStreet(
  address: "70 Prospect Ave",
  withBullet: true,
  houseStyle: "Colonial",
  addressCont: "Apt M18",
  city: "West Chester",
  homeId: "8250263",
  homeUrl: "https://powerhrg.com/",
  state: "PA",
  territory: "PHL",
  zipcode: "19382"
)

Emphasis


PBHomeAddressStreet(
  address: "70 Prospect Ave",
  withBullet: true,
  houseStyle: "Colonial",
  addressCont: "Apt M18",
  city: "West Chester",
  homeId: "8250263",
  homeUrl: "https://powerhrg.com/",
  state: "PA",
  territory: "PHL",
  zipcode: "19382"
)

Spacer(minLength: Spacing.medium)

PBHomeAddressStreet(
  address: "70 Prospect Ave",
  withBullet: true,
  houseStyle: "Colonial",
  addressCont: "Apt M18",
  city: "West Chester",
  homeId: "8250263",
  homeUrl: "https://powerhrg.com/",
  state: "PA",
  territory: "PHL",
  zipcode: "19382",
  emphasize: .city
)

Modified


PBHomeAddressStreet(
  address: "70 Prospect Ave",
  city: "West Chester",
  state: "PA",
  territory: "PHL",
  zipcode: "19382"
)

Link


PBHomeAddressStreet(
  address: "70 Prospect Ave",
  withBullet: true,
  houseStyle: "Colonial",
  addressCont: "Apt M18",
  city: "West Chester",
  homeId: "8250263",
  homeUrl: "https://powerhrg.com/",
  state: "PA",
  territory: "PHL",
  zipcode: "19382"
)

Props

Name	Type	Description	Default	Values
address	`String`	Sets the address
withBullet	`Bool`	Adds a bullet after the address	`false`	`false` `true`
houseStyle	`String`	Sets the house style	`nil`
addressCont	`String`	Sets additional address text	`nil`
city	`String`	Sets the city
homeId	`String`	Sets the home ID	`nil`
homeUrl	`String`	Adds a URL to the homeID	`nil`
state	`String`	Sets the state
territory	`String`	Sets the territory
zipcode	`String`	Sets the zipcode
emphasize	`Emphasize`	Changes text to bold	`.address`	`.address` `.city` `.cityWithZipcode`

Contribute to Playbook

When you start designing a new feature, you may come across a Design Token or Component that isn’t defined in Playbook. If so, you should open an issue or reach out to the team to make a contribution.

Contribute on GitHub

As the highest-rated residential remodeler in the nation, our international technology team builds a custom suite of products that continuously transform our business.

Power

Tech @ Power

Open Positions

About Power

Connect

Dribbble

Github

Connect Chat