Hide/show autocomplete based on selection state

This commit is contained in:
Aviral Dasgupta 2016-06-21 15:46:20 +05:30
parent f6a76edfdf
commit fb6eec0f7d
11 changed files with 114 additions and 43 deletions

View file

@ -5,7 +5,8 @@ import {
convertFromHTML,
DefaultDraftBlockRenderMap,
DefaultDraftInlineStyle,
CompositeDecorator
CompositeDecorator,
SelectionState
} from 'draft-js';
import * as sdk from './index';
@ -168,3 +169,28 @@ export function modifyText(contentState: ContentState, rangeToReplace: Selection
return Modifier.replaceText(contentState, rangeToReplace, modifyFn(text), inlineStyle, entityKey);
}
/**
* Computes the plaintext offsets of the given SelectionState.
* Note that this inherently means we make assumptions about what that means (no separator between ContentBlocks, etc)
* Used by autocomplete to show completions when the current selection lies within, or at the edges of a command.
*/
export function getTextSelectionOffsets(selectionState: SelectionState,
contentBlocks: Array<ContentBlock>): {start: number, end: number} {
let offset = 0, start = 0, end = 0;
for(let block of contentBlocks) {
if (selectionState.getStartKey() == block.getKey()) {
start = offset + selectionState.getStartOffset();
}
if (selectionState.getEndKey() == block.getKey()) {
end = offset + selectionState.getEndOffset();
break;
}
offset += block.getLength();
}
return {
start,
end
}
}