BaseInfoPanel

Props

Prop name	Description	Type	Values	Default
iconName	specify the name of the icon rendered on the left side or use slot icon. (see BaseIcon for available icons). if no icon should be displayed leave the section empty.	string	-	'attention'
alignIcon	define if icon should be aligned top or center. if prop expandable is true the default is top otherwise the default is center.	string	top, center	''
panelStyle	define the styling of the panel (influences e.g. icon size or padding).	string	large, medium	'large'
boxShadow	should box shadow be visible (useful to turn of if component should be rendered inside another box e.g.).	boolean	-	true
panelHeaderText	the panel header text or use slot header instead.	string	-	''
renderPanelHeaderAs	define the HTML element as which the header should be rendered.	string	-	'h2'
text	define panel body text or use slot text instead.	string|array	-	''
buttonsConfig	add buttons at the end of the text element via this config and it will render BaseButton elements - this should be an array of objects with the following properties: id: identifier that will also be emitted via action event on button click label?: button label icon?: button icon to be displayed - for available options see BaseIcon iconPosition?: should icon be displayed left or right of button label, default is right disabled?: set button disabled caveat: label and icon property are optional but at least one of them needs to be specified!	array	-	[]
expandable	if set true an BaseExpandBox is rendered inside the text body config for this BaseExpandBox can be set via expandBoxConfig prop.	boolean	-	false
expandBoxConfig	if prop expandable is set true use this prop to configure the BaseExpandBox element. See BaseExpandBox for available options.	object	-	{}

Events

Event name	Properties	Description
action	undefined string - the id of the button clicked	inform parent of button click

Slots

Name	Description	Bindings
icon	replace the left side icon element
header	replace the header instead of using panelHeaderText
text	replace the text body with something custom e.g. BaseTextList
bottom	replace buttons with custom elements or add some other custom element. If body is expandable these elements are rendered within the expand box.

---

Demo

A simple example

Expandable example using more config and slots