Panel

Settings

Put panel content here.

Examples

<script>
  import { Panel } from '@soleil-se/config-svelte';
</script>

<Panel heading="Settings">
  <!-- Panel content -->
</Panel>

<script>
  import { Panel } from '@soleil-se/config-svelte';
</script>

<Panel heading="Settings" expandable headingLevel="h3">
  <!-- Panel content -->
</Panel>

headingLevel defaults to the next heading level after its parent panel. Setting it explicitly overrides that nesting behavior.

Props

Prop	Type	Description
heading	string	Panel heading. The default is localized to the document language. Default: Inställningar | Innstillinger | Settings
required	boolean	Adds an asterisk to the heading to indicate that all fields inside are required. Default: false
show	boolean	Shows or hides the panel without destroying it. Default: true
expandable	boolean	Makes the panel collapsible. Default: false
headingLevel	stringMer information 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'	Overrides the heading element. By default, heading levels follow the panel nesting depth, up to h6.
class	string	CSS class added to the panel wrapper.
children	Snippet	Content rendered inside the panel body.

Content

Pass panel body content in the default Svelte snippet.