Component Schema

Definition

A schema defines everything that you can change about the component. The schema table can be found on each component's Pattern Lab page on https://boltdesignsystem.com/.

Example Schema Table

Prop	Values	Default
prop1	tight, regular, loose	regular
prop2	inherit,left, center, right	inherit
prop3	(This is a boolean prop)	false

Common Props

There are a few common props for components, such as:

• Color
• Spacing
• Alignment

These props allow Bolt components to be more versatile. There are a lot more props depending on a specific component's needs, so make sure to read the schema table for each component you are using.

Customization vs Override

Please make sure you try all the ways to customize a component before you resort to overrides. Take the band component for example, all the Bolt themes can be used to colorize a band, you can choose from xlight to xdark. If you want something other than what's being offered, you have to ask yourself why first, or ask your designer. Themes aren't as simple as text color and background color, there are a lot more things to consider such as link color, button color, headline color, border color, etc.

As a rule of thumb, do not override unless you absolutely have to. And if you have to, please try to understand the butterfly effects of changing one thing. Understand the ins and outs of a component and then you can override away.

Know the rules before you break the rules.