<PopOutContent>

Search

Table of contents

Displays content in a modal. Useful for displaying a lot of text.

Use of <PopOutContent>

<PopOutContent
  buttonTextHtml={{
    en: 'Read <abbr title="terms and conditions">T&amp;Cs</abbr>',
  }}
  modalHeadingHtml={{ en: 'Terms and conditions' }}
  modalContentHtml={{ en: '<p>A lot of text</p> ... ' }}
/>

<PopOutContent>'s props

PropAboutType
buttonTextHtml

Localisable HTML: popup button content

E.g.

{
  en: 'Click to read <abbr title="terms and conditions">T&amp;C\'s</abbr>',
}
LocalisedHtml
modalContentHtml

Localisable HTML: popup modal body content

E.g.

{
  en: 'A lot of terms and conditions content',
}
LocalisedHtml
modalHeadingHtml

Localisable HTML: popup modal heading content.

E.g.

{
  en: 'Terms and conditions',
}
LocalisedHtml
id

Component Id.

Must be unique within the form.

string
hasChildrenById

Non-editable.

Used to indicate that this component doesn't have children.

false
hasTagsById

Non-editable.

Used to indicate that this component isn't a form field with tags by id.

false
isFormField

Non-editable.

Used to indicate that this component isn't a form field.

false
isMultichoice

Non-editable.

Used to indicate that this component isn't a multichoice form field like <Select>, <Radios> or <Checkboxes>.

false
type

Non-editable.

Type of component of "PopOutContent".

"PopOutContent"