ncstate-sat / popover

Popover component for Angular
MIT License
225 stars 47 forks source link

Feature: anchorless popover #84

Open willshowell opened 6 years ago

willshowell commented 6 years ago

There should be a way to display popovers at a specific coordinate on the screen. This would enable a variety of use cases:

I expect this would exist as a separate component that is capable of opening and closing itself

<sat-global-popover #gp top="20px" right="20px">
  <app-notification>You have a message from {{ user }}.</app-notification>
</sat-global-popover>

Backdrop and animation inputs would be common between this and the original popover, so it'll probably be best to use a mixin for those.

It's important that any behavior in https://github.com/ncstate-sat/popover/issues/22 is also available.

fxck commented 6 years ago

The way angular menus work is that you are able to have multiple buttons (with mdMenuTriggerFor) sharing the same menu. The same is unfortunately not possible with popover, so when you want to use it in a for loop, you have to print out popover for each item. So being able to create anchorless pop would be useful for this case as well.

fxck commented 6 years ago

Or alternatively, passing the anchor to the open function would probably work as well.

<button 
  *ngFor="let item of lotsOfItems"
  #buttonRef
  (click)="!!popRef.open(buttonRef)">
  open
</button>

<sat-popover #popRef></sat-popover>

in one of the cases I have the popover contains a smart component that triggers an api call, so I really need it to only exists once

// edit

I see, something is in the works already https://github.com/ncstate-sat/popover/pull/103

willshowell commented 6 years ago

Re: #103, that work is already done and the anchoring service is exposed in in https://github.com/ncstate-sat/popover/pull/125. I hate how clunky it is to use though, so I didn't document it anywhere. I would like a cleaner service that makes it easy to manage multiple popovers (similar to Overlay).

As you can see in #103's demo and SatPopoverAnchor, there is a one-to-one relationship with the service to the popover, so you have to manually manage that relationship yourself. It should all be possible to do at this point though.