Text-cursor-helper NPM

Text Cursor Helper

This library provides fast ways to deal with the text cursor when editing in input, textarea, and div (contenteditable = true) elements:

Get position of the text cursor on the Oxy coordinate axis
Move the text cursor to the end of input fields

Reference sources

Blog HOW TO: Where’s the text cursor?

Installing

Using npm

  npm i text-cusor-helper

Using yarn

  yarn add text-cusor-helper

Once the package is installed, you can import using ES Modules:

import textCursorHelper from 'text-cusor-helper';

Quick Start

1. Get position of the text cursor

Returns X, Y coordinates for positioning of a text cursor within a given text input at a given selection point

Parameters:

Order	Name	Description	Type
1	`input`	The text input that need deal with text cursor inside it	Element
2	`anchor`	The element serves as a reference for coordinates calculation (The origin of Oxy coordinates)	textCursorHelper.ANCHOR: `ROOT` Default`POSITIONED_PARENT`: the nearest parent element having the position attribute is relative or absolute

Example:

const inputElement = document.querySelector(".comment-input")
const position = textCursorHelper.getCursorXY(
  inputElement,
  textCursorHelper.ANCHOR.POSITIONED_PARENT
);

console.log(position)
// { x: 50: y : 50 }

2. Move the text cursor to the end of input fields

Parameters:

None

Example:

const inputElement = document.querySelector(".comment-input")
textCursorHelper.goToEnd();

Show Your Support

Please ⭐️ this repository if this project helped you!

node cursor text-cursor

1.0.0

2 years ago