83fdebf64d
- Add jscodeshift-based codemod to convert arrow function components to function declarations - Support React.FC, observer-wrapped, and forwardRef components - Include comprehensive test suite covering edge cases - Add npm script to run transformer across codebase - Target only .tsx files in source directories, excluding node_modules and declaration files * [WEB-5459] chore: updates after running codemod --------- Co-authored-by: sriramveeraghanta <veeraghanta.sriram@gmail.com>
40 lines
987 B
TypeScript
40 lines
987 B
TypeScript
import { MoreVertical } from "lucide-react";
|
|
import React, { forwardRef } from "react";
|
|
// helpers
|
|
import { cn } from "./utils";
|
|
|
|
interface IDragHandle {
|
|
className?: string;
|
|
disabled?: boolean;
|
|
}
|
|
|
|
export const DragHandle = forwardRef(function DragHandle(
|
|
props: IDragHandle,
|
|
ref: React.ForwardedRef<HTMLButtonElement | null>
|
|
) {
|
|
const { className, disabled = false } = props;
|
|
|
|
if (disabled) {
|
|
return <div className="w-[14px] h-[18px]" />;
|
|
}
|
|
|
|
return (
|
|
<button
|
|
type="button"
|
|
className={cn(
|
|
"p-0.5 flex flex-shrink-0 rounded bg-custom-background-90 text-custom-sidebar-text-200 cursor-grab",
|
|
className
|
|
)}
|
|
onContextMenu={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
}}
|
|
ref={ref}
|
|
>
|
|
<MoreVertical className="h-3.5 w-3.5 stroke-custom-text-400" />
|
|
<MoreVertical className="-ml-5 h-3.5 w-3.5 stroke-custom-text-400" />
|
|
</button>
|
|
);
|
|
});
|
|
|
|
DragHandle.displayName = "DragHandle";
|