> `SL`ack `I`nspired `T`ext `E`diting
npm install react-slite> SLack Inspired Text Editing
This react component aims to provide a slack like rich text editing experience powered by lexical library. This project is currently in alpha stage and used internally for Remindoro extension.
NOTE: Starting v0.2.0, react-slite is powered by lexical. Right now, it is just a thin wrapper around vanilla lexical functionality. As lexical becomes more stable and moves towards v1.x, this library will become more feature complete. Till then, apis are subject to change.
IMPORTANT: Please pin your package version in your project to avoid breaking changes in v0.x version
``javascript
import Slite, { Toolbar, Editor, SliteProps, ThemeClassList, SLITE_EDITOR_CONTAINER_CLASS } from '../index'
function SliteWrapper({ initialValue, onChange, readOnly }: SliteProps) {
return (
}
onChange={(currentMarkdown) => {}}
readOnly={false}
>
{/ decide if and how you want to display the toolbar /}
{!readOnly &&
{/ editor text area /}
)
}
// ThemeClassList has all the classes used within the rich text editor
// SLITE_EDITOR_CONTAINER_CLASS exports the container class name, which is slite-container`
// With this info, theming can be done via classespnpm run storybook` in the repo.
For more examples, please run