Events emitted from slotted components

I try to wrap an application into a 'Repository' component and that outer component should handle all communication with the backend, like loading, updating, deleting editable data. I thought I could just send events up to that Repository component but I doesn't work the way I do it. Does anyone spot the issue or can explain, why this doesn't work and how to do it correctly with events? I could use writables instead but events would make it more readable. Here's a simplified example and a svelte REPL link:

https://svelte.dev/repl/e1eae56c7d5e48b2a99299f1bc1bf970?version=3.22.3

App.svelte:

<script>    import Repository from './Repository.svelte'    import Application from './Application.svelte'</script><Repository><Application on:save={() => console.log('caught in App')} /></Repository>

Repository.svelte:

<div on:save={() => console.log('caught in Repository')}><slot></slot></div>

Application.svelte:

<script>    import {createEventDispatcher} from 'svelte'    const dispatch = createEventDispatcher();    function saveHandler() {        console.log('dispatching')        dispatch('save')    }</script><button on:click={saveHandler}>    Save</button>

The desired output would be

dispatchingcaught in Repository

but it only prints

dispatchingcaught in App

when the button is clicked.