Angular - how to pass Overlay Trigger between components

Question

I'm trying to develop a custom flyout panel component for our library. It's more or less a "lower" part of a mat-menu component but with a small difference that it can be attached to various elements (button, select, input, etc.) and it should allow having inputs, checkboxes and other elements in it. This means that clicking on something in the flyout should NOT close it.

I inherited some component already but I want to split it to two parts. One, which is basically the trigger and it could be input or button (or something else) and the second, which is the flyout itself. Below is the code I have now:

<div class="flyout-wrapper">
  <!-- This I want to move to separate component - mylib-flyout-button or something -->
  <div
    cdkOverlayOrigin
    #trigger="cdkOverlayOrigin"
  >
   <!-- ... -->
  </div>

  <!-- And this to standalone panel - mylib-flyout-panel -->
  <ng-template>
    cdkConnectedOverlay
    [cdkConnectedOverlayOrigin]="trigger"
    [cdkConnectedOverlayOpen]="isOpen"
    [cdkConnectedOverlayMinWidth]="trigger?.elementRef?.nativeElement?.offsetWidth"
    [cdkConnectedOverlayPositions]="positionStrategy"
    [cdkConnectedOverlayHasBackdrop]="true"
    [cdkConnectedOverlayBackdropClass]="some-backdrop-clas"
    (backdropClick)="close()"
    (detach)="isOpen = false"
  >
    <div class="flyout-panel-container">
      <ng-content class="flyoutSearchBox" select="[flyoutSearchBox]"></ng-content>
      <ng-content class="flyoutContent" select="[flyoutContent]"></ng-content>
      <ng-content class="flyoutActions" select="[flyoutActions]"></ng-content>
    </div>
  </ng-template>
</div>

My question is, how can I pass the trigger between siblings, if I were to refactor it to something like this?

<!-- Trying to pass this trigger -->
<div
  cdkOverlayOrigin
  #trigger="cdkOverlayOrigin"
>

<!-- to this one -->
<mylib-flyout-panel [trigger]="myTrigger">
  <div flyoutSearchBox>
    <!-- some input -->
  </div>
  <div flyoutActions>
    <!-- buttons to close the flyout and to request some data from BE for example -->
  </div>
</mylib-flyout-panel>

If I just pass the trigger to the flyout-panel, like in the way above, I'll get the NG0201: No Provider for TemplateRef found. I know I'm missing something but honestly, I'm bit lost here.

I admit that my thinking might be all wrong and I was actually playing with the idea to have a service created for that, to work in a similar way as MatDialog does. I just wanted to give a try to this probably simpler solution.