Draft-js: Get entities from selection

Created on 6 Jun 2017 · 9Comments · Source: facebook/draft-js

Hi,
How I can get entities from selection state?
I need to get all entities that exist in current selection.

Thanks.

Source

taniko13

Most helpful comment

You can do this by using findEntityRanges
I've created a function to get all entities with their corresponding ranges... it shouldn't be that hard to modify this to your needs...

function getEntities(editorState, entityType = null) {
  const content = editorState.getCurrentContent();
  const entities = [];
  content.getBlocksAsArray().forEach((block) => {
    let selectedEntity = null;
    block.findEntityRanges(
      (character) => {
        if (character.getEntity() !== null) {
          const entity = content.getEntity(character.getEntity());
          if (!entityType || (entityType && entity.getType() === entityType)) {
            selectedEntity = {
              entityKey: character.getEntity(),
              blockKey: block.getKey(),
              entity: content.getEntity(character.getEntity()),
            };
            return true;
          }
        }
        return false;
      },
      (start, end) => {
        entities.push({ ...selectedEntity, start, end });
      });
  });
  return entities;
}

spacedust on 17 Jun 2017

👍7

All 9 comments

You can do this by using findEntityRanges
I've created a function to get all entities with their corresponding ranges... it shouldn't be that hard to modify this to your needs...

function getEntities(editorState, entityType = null) {
  const content = editorState.getCurrentContent();
  const entities = [];
  content.getBlocksAsArray().forEach((block) => {
    let selectedEntity = null;
    block.findEntityRanges(
      (character) => {
        if (character.getEntity() !== null) {
          const entity = content.getEntity(character.getEntity());
          if (!entityType || (entityType && entity.getType() === entityType)) {
            selectedEntity = {
              entityKey: character.getEntity(),
              blockKey: block.getKey(),
              entity: content.getEntity(character.getEntity()),
            };
            return true;
          }
        }
        return false;
      },
      (start, end) => {
        entities.push({ ...selectedEntity, start, end });
      });
  });
  return entities;
}

spacedust on 17 Jun 2017

👍7

Thanks, I already tried this method.
By I need entities of selected blocks.
Selection state holds only keys of start and end blocks, and if I select more then 2 blocks I don't know keys of block that between start and end.

taniko13 on 18 Jun 2017

👍2

I'm getting past this by forcing all the text in my editor into a single block. I haven't found any down sides and it makes operations like this significantly more easy to manage.

Aaronik on 18 Aug 2017

I'd like to be able to do this as well. I think for my use case I can get away with not having to worry about the spanning of >2 blocks like @taniko13 mentioned, so this is 'acceptable' from my end, but not ideal.