Setting a Widget’s Properties

The following widget contains several different property types.

Other serializable properties, like arrays and configuration objects, can be set via HTML attributes by passing in serialized JSON. The sucessMessages property ({ successMessages?: string[] }) can be set by adding a successmessages attribute to the HTML.

Here, the value of the successmessages attribute will be deserialized and set as the property.

Widget properties that start with on and have a function signature are exposed as events. The emitted event is the lower cased part of the property name without the “on.” Listening for the onSignUp property ({ onSignUp?: () => void }) would look like this.

All non-event widget properties are automatically created as properties on the custom element. These properties can be fully controlled by JavaScript. In the email subscription widget, both the title and signUpBonusDate properties can be set programmatically as properties.