8801ab0081
* feat: add card component to propel package and update tooltip imports * refactor: remove @plane/ui dependency and update tooltip imports to use local card component * fix: lint * refactor: update import from @plane/ui to @plane/utils in command component * refactor: extend CardProps interface to include HTML attributes for better flexibility
41 lines
942 B
TypeScript
41 lines
942 B
TypeScript
import * as React from "react";
|
|
import { cn } from "../utils";
|
|
import {
|
|
ECardDirection,
|
|
ECardSpacing,
|
|
ECardVariant,
|
|
getCardStyle,
|
|
TCardDirection,
|
|
TCardSpacing,
|
|
TCardVariant,
|
|
} from "./helper";
|
|
|
|
export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
variant?: TCardVariant;
|
|
spacing?: TCardSpacing;
|
|
direction?: TCardDirection;
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
const Card = React.forwardRef<HTMLDivElement, CardProps>((props, ref) => {
|
|
const {
|
|
variant = ECardVariant.WITH_SHADOW,
|
|
direction = ECardDirection.COLUMN,
|
|
className = "",
|
|
spacing = ECardSpacing.LG,
|
|
children,
|
|
...rest
|
|
} = props;
|
|
|
|
const style = getCardStyle(variant, spacing, direction);
|
|
return (
|
|
<div ref={ref} className={cn(style, className)} {...rest}>
|
|
{children}
|
|
</div>
|
|
);
|
|
});
|
|
|
|
Card.displayName = "plane-ui-card";
|
|
|
|
export { Card, ECardVariant, ECardSpacing, ECardDirection };
|