Files
calendar/packages/features/insights/components/CellWithOverflowX.tsx
T
Keith WilliamsandGitHub 78d06c6d01 refactor: Move classNames from @calcom/lib to @calcom/ui (#19674)
* refactor: Move classNames from @calcom/lib to @calcom/ui

* Import fix

* Removed extra import of classNames

* Removed tailwind-merge from @calcom/lib
2025-03-03 15:54:33 +00:00

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>
);
}