# Panel

![Panel](/_astro/Panel.DDcvxQCK_25SRMV.webp)

## Props

| Prop           | Type      | Description                                                                                          |
| -------------- | --------- | ---------------------------------------------------------------------------------------------------- |
| `heading`      | `string`  | Panel heading. **Default:** `'Inställningar'`                                                        |
| `required`     | `boolean` | Marks heading with an asterisk to indicate that all fields are required inside. **Default:** `false` |
| `show`         | `boolean` | Show and hide the component without re-rendering. **Default:** `true`                                |
| `expandable`   | `boolean` | Makes the panel collapsible. **Default:** `false`                                                    |
| `headingLevel` | `number`  | Allows custom heading levels for the panel, `h1` to `h6`.                                            |

## Examples

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


<Panel heading="Inställningar">
  <!-- Panel content -->
</Panel>
```

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


<Panel heading="Inställningar" expandable headingLevel="h3">
  <!-- Panel content -->
</Panel>
```

## Slots

Default slot for panel body.