https://github.com/Flaque/use-slate-lifecycle

Add "onUserStartsTyping" and "onUserStopsTyping" events to your slate-js editor
https://github.com/Flaque/use-slate-lifecycle

Last synced: 4 months ago
JSON representation

Add "onUserStartsTyping" and "onUserStopsTyping" events to your slate-js editor

• Host: GitHub
• URL: https://github.com/Flaque/use-slate-lifecycle
• Owner: Flaque
• Created: 2019-10-10T21:01:50.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2021-08-11T13:45:26.000Z (over 3 years ago)
• Last Synced: 2024-09-15T23:38:12.353Z (5 months ago)
• Language: TypeScript
• Size: 44.9 KB
• Stars: 4
• Watchers: 2
• Forks: 1
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# use-slate-lifecycle 

Add `onUserStartsTyping` and `onUserStopsTyping` events to your slate editor.

## Install

```

yarn add use-slate-lifecycle

```

## Usage

`use-slate-lifecycle` works by returning a function that needs to be called

in your `onChange` function like this:

```jsx

const [ withLifeCycle ] = useSlateLifecycle({

  onUserStartsTyping: () => {},

  onUserStopsTyping: () => {}

});

// ...

 {

    withLifeCycle(change)

    // .. other stuff

}}>

```

Full example:

```jsx

import { Editor } from "slate-react";

import useSlateLifecycle from "use-slate-lifecycle";

function MyEditor = () => {

  function onUserStartsTyping(change) {

      console.log("starts typing")

  }

  function onUserStopsTyping(change) {

      console.log("stops typing")

  }

  const [ withLifeCycle ] = useSlateLifecycle({

    onUserStartsTyping,

    onUserStopsTyping

  });

  function onChange(change) {

      withLifeCycle(change)

      // Do your regular updating

  }

  return (

      

  )

}

```