thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

fix : tooltip fix (#318)

Browse Source 
* fix: ellipsis added to issue title

* feat: toolttip added

* feat: assignees tooltip added

* fix: build fix

* fix: build fix

* fix: build error

---------

Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>
This commit is contained in:
Anmol Singh Bhatia 2023-02-22 13:24:59 +05:30 committed by GitHub
parent d8c10b6bc0
commit d29f34566c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
apps/app/components/core/list-view/single-issue.tsx
View File

@ -16,7 +16,6 @@ import {
ViewPrioritySelect, ViewPrioritySelect,
ViewStateSelect, ViewStateSelect,
} from "components/issues/view-select"; } from "components/issues/view-select";
import { Tooltip2 } from "@blueprintjs/popover2";
// ui // ui
import { Tooltip, CustomMenu } from "components/ui"; import { Tooltip, CustomMenu } from "components/ui";

45
apps/app/components/ui/tooltip.tsx
View File

@ -1,7 +1,8 @@
import React from "react"; import React from "react";
import { Tooltip2 } from "@blueprintjs/popover2"; import { Tooltip2 } from "@blueprintjs/popover2";
export type Props = { type Props = {
tooltipHeading?: string; tooltipHeading?: string;
tooltipContent: string; tooltipContent: string;
position?: "top" | "right" | "bottom" | "left"; position?: "top" | "right" | "bottom" | "left";
@ -15,26 +16,24 @@ export const Tooltip: React.FC<Props> = ({
position = "top", position = "top",
children, children,
disabled = false, disabled = false,
}) => { }) => (
return ( <Tooltip2
<Tooltip2 disabled={disabled}
disabled={disabled} content={
content={ <div className="flex flex-col justify-center items-start gap-1 max-w-[600px] text-xs rounded-md bg-white p-2 shadow-md capitalize text-left">
<div className="flex flex-col justify-center items-start gap-1 max-w-[600px] text-xs rounded-md bg-white p-2 shadow-md capitalize text-left"> {tooltipHeading ? (
{tooltipHeading ? ( <>
<> <h5 className="font-medium">{tooltipHeading}</h5>
<h5 className="font-medium">{tooltipHeading}</h5>
<p className="text-gray-700">{tooltipContent}</p>
</>
) : (
<p className="text-gray-700">{tooltipContent}</p> <p className="text-gray-700">{tooltipContent}</p>
)} </>
</div> ) : (
} <p className="text-gray-700">{tooltipContent}</p>
position={position} )}
renderTarget={({ isOpen: isTooltipOpen, ref: eleRefernce, ...tooltipProps }) => </div>
React.cloneElement(children, { ref: eleRefernce, ...tooltipProps, ...children.props }) }
} position={position}
/> renderTarget={({ isOpen: isTooltipOpen, ref: eleRefernce, ...tooltipProps }) =>
); React.cloneElement(children, { ref: eleRefernce, ...tooltipProps, ...children.props })
}; }
/>
);