Screen Properties

Every question in a Birdhouse questionnaire has a screen component that controls its visual presentation. The screen defines the layout, text content, buttons, and supplementary UI elements.

Layout

Property	Type	Default	Description
`layout`	enum	`Centered`	Controls the page layout mode

Layout options:

Value	Behavior
`Centered`	Standard centered layout. All other screen properties (header, description, buttonText, etc.) are rendered in their default positions. This is the default for most question types.
`Standalone`	Full-control layout. The question component takes over the entire screen. All other screen properties (header, description, buttonText, skipDetails, additionalInfo) are ignored. The question component is responsible for rendering everything. Used by `BLOCKER`, `GENERIC_CHECKOUT_V2`, `REVIEW`, and other full-page types.

Text Content

Property	Type	Description
`header`	string	Text displayed above the question title. Typically used for step labels or section headers.
`question`	string	The main question text. This is the primary heading the user sees.
`questionClassName`	string	Custom CSS class applied to the question text element. Use for per-question styling overrides.
`description`	string	Explanatory text displayed below the question title. Use for additional context or instructions.
`error`	string	Error message text. Displayed with an animation when a validation fails.

Visual Elements

Property	Type	Description
`icon`	object	Icon displayed above the header text.

Icon object:

Field	Type	Description
`src`	string	URL or path to the icon image
`alt`	string	Alt text for accessibility

Buttons

Submit Button

Property	Type	Description
`buttonText`	string	Override the default submit button text. Default is typically “Continue” or “Next”.
`loading`	boolean	When `true`, displays a spinner inside the submit button. Used during async operations.

Skip Button

Property	Type	Description
`skipDetails`	object	Configures an optional secondary “skip” button below the main submit button.

skipDetails object:

Field	Type	Description
`path`	string	URL path to navigate to when skipping
`title`	string	Text displayed on the skip button
`onClick`	function	Custom click handler (code only)
`skipQuestion`	object	Contains a `value` field — the answer value to store when the user skips

Example use case: “I don’t know my IBAN” skip button that stores a placeholder value and moves to the next step.

Secondary Action

Property	Type	Description
`secondaryAction`	JSX.Element	A custom React element rendered as an additional button or action. Only configurable in code, not from Strapi.

Additional Info Box

Property	Type	Description
`additionalInfo`	object	Configures an expandable information box displayed alongside the question.

additionalInfo object:

Field	Type	Required	Description
`title`	string	Yes	The clickable title/heading of the info box
`description`	string	No	Short description text
`children`	JSX.Element	No	Custom React content (code only)
`moreInfo`	JSX.Element	No	Expandable detail content (code only)
`moreInfoLink`	string	No	URL link for “Learn more”

Usage: Provide context without cluttering the main question. The user can expand the box to see details.

Layout Control

Property	Type	Description
`noMaxWidth`	boolean	When `true`, removes the default content max-width constraint. The question content can expand to fill the available horizontal space.

Per-Question Configuration

Property	Type	Description
`configuration`	object	Per-question config overrides. Accepts any key-value pairs to pass custom configuration to the question component.

The configuration object is passed directly to the question component at render time. Each question type may use different configuration keys. The only exception is progressBar — progress bar configuration is handled at the questionnaire metadata level, not per-question.

Summary Table

Property	Type	Strapi field	Description
`question`	string	`question`	Main question text
`description`	string	`description`	Text below question
`buttonText`	string	`continueButtonText`	Submit button text override (Strapi field name differs)
`skipDetails`	object	`skipDetails`	Skip button config
`additionalInfo`	object	`additionalInfo`	Info box config
`noMaxWidth`	boolean	`noMaxWidth`	Remove max-width
`layout`	enum	— (runtime)	Set automatically based on question type (e.g., BLOCKER → Standalone)
`icon`	`{ src, alt }`	— (runtime)	Set by the framework, not configurable in Strapi
`header`	string	— (runtime)	Set in code or by the framework
`questionClassName`	string	— (code only)	CSS class override
`error`	string	— (runtime)	Set by validation logic at runtime
`loading`	boolean	— (runtime)	Set during async operations
`secondaryAction`	JSX.Element	— (code only)	Additional action button
`configuration`	object	— (partial)	Per-question config, partially set by transforms