Skip to content

Commit

Permalink
improvement: add ability to customize max width of Popover
Browse files Browse the repository at this point in the history
The popover is default limited to a width of 350 pixels. Developers
should be able to customize the maximum width.

Added maxWidth property to Popover.
  • Loading branch information
Gido Manders committed Nov 12, 2024
1 parent d972dff commit e056fd9
Showing 1 changed file with 9 additions and 2 deletions.
11 changes: 9 additions & 2 deletions src/core/Popover/Popover.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,11 @@ type Props = {
* by the wrapping of the children inside the CustomTag.
*/
style?: CSSProperties;

/**
* Optionally set the maximum width of the popover.
*/
maxWidth?: number;
};

/**
Expand All @@ -79,7 +84,8 @@ export function Popover({
className,
isOpen,
onClickOutside,
style
style,
maxWidth
}: Props) {
const Tag = tag;

Expand All @@ -90,9 +96,10 @@ export function Popover({
className="border-0 tippy-popover"
content={children}
placement={placement}
offset={[ offset, distance ]}
offset={[offset, distance]}
interactive={true}
zIndex={1049} // One level below bootstrap's modal
maxWidth={maxWidth}
>
<Tag className={className} style={style} tabIndex={0} role="button">
{target}
Expand Down

0 comments on commit e056fd9

Please sign in to comment.