Snapper

The snapper is a utility that allows you to adjust the start and end positions of annotations based on user actions. It can be used to create a more intuitive user experience when interacting with annotations. F.E. when you want to use a word snapper, you can use the snapper to adjust the start and end positions of the annotation to the nearest word boundaries.

Example

An example of how to use the snapper, to adjust the start and end positions of an annotation when it is moved or created.

const useSnapper = (action, payload) => {
  const { start, end } = payload;
  switch (action) {
    case 'move-end':
      return { start, end: end - 2 };
      break;
    case 'move-start':
      return { start: start + 2, end };
      break;
  }

  return { start, end };
};