Example of forwardRef usage

[mahdiyazdani]

Thanks for the great tool. Would you be able to share a brief example of how to pass a component as a child to the SortableKnob using React.forwardRef()?

[ValentinH]

Sure, here you go: https://codesandbox.io/s/react-easy-sort-custom-knob-demo-ij37h?file=/src/App.tsx

I'm also adding this to the Readme.

[mahdiyazdani]

Thank you for your reply. I was thinking that perhaps it would be possible not to have a wrapper div within the CustomKnob component, and pass on the ref directory to the DragIndicatorIcon instead.

const CustomKnob = React.forwardRef<HTMLDivElement, {}>((props, ref) => {
  const classes = useKnobStyles();
  return (
    <div ref={ref} className={classes.root}> { /* Referring to this line */ }
      <DragIndicatorIcon />
      <Typography variant="caption">drag me</Typography>
    </div>
  );
});

[ValentinH]

Yes this should be possible if the icon can hold a ref.