feat(rename @Input): Rename xPosition and yPosition

[ncstate-sat]

feat(rename @Input): Rename xPosition and yPosition

[willshowell]

Oh another consideration is that I'd like to add offset support soon. So it would probably have to match

<sat-popover #p
    horizontalAlign="after"
    verticalAlign="above"
    horizontalOffset="16"
    verticalOffset="16">
  <my-tooltip></my-tooltip>
</sat-popover>

vs. something like,

<sat-popover #p
    xAlign="after"
    yAlign="above"
    xOffset="16"
    yOffset="16">
  <my-tooltip></my-tooltip>
</sat-popover>

or

<sat-popover #p
    hAlign="after"
    vAlign="above"
    hOffset="16"
    vOffset="16">
  <my-tooltip></my-tooltip>
</sat-popover>

So this kind of makes me swing back towards providing an alias but keeping *Align for both. It would probably be described in the docs to use horizontal|vertical but with a note saying there is an x|y shorthand.

[willshowell]

Thanks for separating the issue. My intention with aliases wasn't for smaller bundle, but for template cleanliness. It's personal preference, of course, but I like to break lines around 90-100 characters, so keeping input names as minimal as they can be while still being descriptive is important.

<!-- Proposed that both would be allowed and equal -->
<sat-popover #p hasBackdrop horizontalAlign="start" verticalAlign="below">
<sat-popover #p hasBackdrop xPos="start" yPos="below">

But I also see the point that having aliases can be confusing. And it's not like openTransition="" or scrollStrategy="" are particularly short. Plus, losing overlapAnchor will save space anyway. I also like horizontalAlign since it matches flexbox's align-items.

I guess in conclusion, I like the proposal! I just want to chew on it a bit more before making the change.

[julianobrasil]

If we think the position we'll be set relative to another component, than align makes more sense (two components will be aligned to each other in some way).

We can also think of h and v as an alternative to x and y. It is not so clear as horizontal and vertical, but it steps away from axis concepts.

[willshowell]

I've given this some thought and think it would be best to go with horizontalAlign with xAlign as an alias. The README would look like this

---

Positioning

By default, the popover will appear centered over the anchor. If you instead want the popover
to appear below the anchor:

<sat-popover #contactPopover verticalAlign="below">
  <!-- ... -->
</sat-popover>

You can use the following to position the popover around the anchor:

Input	Type	Default
horizontalAlign	'before' | 'start' | 'center' | 'end' | 'after'	'center'
verticalAlign	'above' | 'start' | 'center' | 'end' | 'below'	'center'

For convenience, you can also use xAlign and yAlign as shorthand for horizontalAlign and verticalAlign, respectively.