8000 It'd be nice if `align` took an array, to match `positions` · Issue #206 · alexkatz/react-tiny-popover · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content
8000

It'd be nice if align took an array, to match positions #206

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
neoncube2 opened this issue Feb 5, 2025 · 3 comments
Open

It'd be nice if align took an array, to match positions #206

neoncube2 opened this issue Feb 5, 2025 · 3 comments

Comments

@neoncube2
Copy link

When my popover is positioned as top or bottom, I'd like for align to be end, but when it's positioned as left or right, I'd like for it to be center.

I can set align="end", but then if the popover is shifted to the left position, I don't have an easy way to change align to be center:

<Popover
  isOpen={true}
  positions={['bottom', 'left']}
  align="end"
  content={<div>example</div>}
>
  Click me
</Popover>

I think it'd be nice if align could also take an array of alignments, which would automatically match with values in positions:

<Popover
  isOpen={true}
  positions={['bottom', 'left']}
  align={['end', 'center']}
  content={<div>example</div>}
>
  Click me
</Popover>
@neoncube2
Copy link
Author
neoncube2 commented Feb 5, 2025 •
edited
Loading

I guess I need to be able to set transform to different values depending on which position is being used, too. Perhaps align and transform could optionally take a function?

<Popover
  isOpen={true}
  positions={['bottom', 'left']}
  align={newPosition => newPosition === 'bottom' ? 'end' : 'center'}
  transform={newPosition => ...}
  content={<div>example</div>}
>
  Click me
</Popover>

@alexkatz
Copy link
Owner
alexkatz commented Feb 5, 2025

This is a great idea, and something I will likely implement for the next release. Thanks for sharing. I'll post the release here when I get around to it. If you'd like to make a PR for it in the meantime, feel free.

@neoncube2 neoncube2 mentioned this issue Feb 6, 2025
Open
@neoncube2
Copy link
Author

Yay, thanks! :D

I took a stab at this: #207 :)

I just passed position to the function. Not sure if it'd make sense to pass more data, like when a function is passed to transform?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@alexkatz @neoncube2
0