API Reference / Angular InstantSearch / ais-panel

ais-panel

Signature 
<ais-panel
  // Optional parameters
  header="string"
  footer="string"
></ais-panel>
See code examples

About this widget

The panel widget wraps other widgets in a consistent panel design. It also reacts by adding a CSS class when the widget no longer can refine, for example, when a refinementList becomes empty because of the current search results.

Examples

Copy 
1
2
3
4
5
6

<ais-panel
  header="Header of the widget"
  footer="Footer of the widget"
>
  <!-- a widget -->
</ais-panel>

Props

header
type: string

Displays text before the wrapped element
Copy 
1
2
3

<ais-panel
  header="Header of the widget"
></ais-panel>
type: string

Displays text after the wrapped element
Copy 
1
2
3

<ais-panel
  footer="Footer of the widget"
></ais-panel>
Did you find this page helpful?
Angular InstantSearch v4