-
Notifications
You must be signed in to change notification settings - Fork 281
feat(ui5-popover): implement resizable popover #12623
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.
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
base: main
Are you sure you want to change the base?
Conversation
|
🚀 Deployed on https://pr-12623--ui5-webcomponents-preview.netlify.app |
alexandar-mitsev
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- during the resize, the arrow constantly flickers. minor issue, but quite visible.
- sometimes the resize arrow is on the wrong side. This happens if the opener is longer than the popover - e.g. in a very long date picker input, the popover is in leftmost position and the arrow is also in the left bottom arrow. To reproduce set resizable to true on the datepicker input (second input) on test/pages/Popover.html. Same is reproducible in the "Horizontal Align" test section in Popover.html
- during resize - if you do it quick, the resizing starts to lag. Can stay like that, but if possible to fix, will be better
|
|
packages/website/docs/_samples/main/Popover/Resizable/sample.html
Outdated
Show resolved
Hide resolved
packages/website/docs/_samples/main/Popover/Resizable/sample.html
Outdated
Show resolved
Hide resolved
Stoev
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good from my UA perspective.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
| _width?: string; | ||
| _height?: string; | ||
|
|
||
| _resizeMouseMoveHandler: (e: MouseEvent) => void; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you may consider moving all those private properties and most of the resize related logic inside a second class, e.g. PopoverResize.ts. It can contain the methods you need, like getResizeHandleClasses, onClose, attachMouseEvents, reset, isResizeHandleClicked and etc.
This will make the Popover.ts easier to read.
Could be separate BLI

JIRA: BGSOFUIRODOPI-3384
Certain styles for slotted elements in the footer and header are overridden, similar to how it is done in the UI5 dialog.
fixes #8167
fixes #12088