Character Docs

Usage

  <bolt-character size="small"></bolt-character>

Schema

Note: when assigning component props as HTML attributes on a web component, make sure to use kebab-case.

Prop Name Description Type Default Value Option(s)
attributes

A Drupal-style attributes object with extra attributes to append to this component.

object
size *

Character Size.

string small
  • small, medium, large
characterImage

Pre-defined package image.

string customer-happy
  • customer-happy, customer-neutral, customer-sad, customer-surprise, pega-rep, u-comm-plus, custom
characterCustomUrl

URL of a custom image.

string https://www.fillmurray.com/g/200/200
useIcon

Use a bolt-icon in place of an image Url.

boolean false
constrainBottomSlot

Constrain the bottom slot to the width of the character. Used when right or left slots overflow character height and encroach on bottom slot.

boolean false
addBackgroundPadding

Add padding around the character equalling the width/height of the background. Collapses on mobile.

boolean false

Slots

Name Requred? Description
top No
right No
bottom No
left No
Debug Panel