Slots

ComboBox provides two slots for adding addtional elements to perform various actions.

  1. Slot "before" : can be used to add elements before the options in the listbox.
  2. Slot "after" : can be used to add elements after the options in the listbox.

Slot before

 // Usage of before slot.
<script>
    import ComboBox from 'svelte-combobox/ComboBox.svelte';
</script>
<ComboBox 
   //props here 
>
    <button 
        style="width: 100%; margin-inline:auto; position:sticky; top:-.5rem" 
        slot="before"
        on:click={()=>{alert("You Clicked Add New !!!")}}
    >
        Add New
    </button>
</ComboBox>

Slot after

 // Usage of after slot.
<script>
    import ComboBox from 'svelte-combobox/ComboBox.svelte';
</script>
<ComboBox 
   //props here 
>
    <button 
        style="width: 100%; margin-inline:auto; position:sticky; bottom:-.5rem" 
        slot="after"
        on:click={()=>{alert("You Clicked Add New !!!")}}
    >
        Add New
    </button>
</ComboBox>