* refactor: Move classNames from @calcom/lib to @calcom/ui * Import fix * Removed extra import of classNames * Removed tailwind-merge from @calcom/lib
32 lines
903 B
TypeScript
32 lines
903 B
TypeScript
import classNames from "@calcom/ui/classNames";
|
|
|
|
export function CellWithOverflowX({
|
|
children,
|
|
className,
|
|
}: {
|
|
children: React.ReactNode;
|
|
className?: string;
|
|
}) {
|
|
return (
|
|
<div className={classNames("group relative max-w-[200px]", className)}>
|
|
<div
|
|
className="no-scrollbar flex gap-1 overflow-x-auto whitespace-nowrap"
|
|
ref={(el) => {
|
|
// Only add shadow if the scroll width is greater than 200px
|
|
if (!el) return;
|
|
const nextElement = el.nextElementSibling;
|
|
if (!nextElement) return;
|
|
|
|
if (el.scrollWidth > 200) {
|
|
nextElement.classList.remove("hidden");
|
|
} else {
|
|
nextElement.classList.add("hidden");
|
|
}
|
|
}}>
|
|
{children}
|
|
</div>
|
|
<div className="from-default absolute right-0 top-0 hidden h-full w-8 bg-gradient-to-l to-transparent " />
|
|
</div>
|
|
);
|
|
}
|