Luthor
DocumentationDemoPlaygroundGitHub
Luthor

A headless, extensible rich text editor built on Lexical. Ship faster with production-ready defaults and TypeScript-first APIs.

Documentation

IntroductionInstallation@lyfie/headless@lyfie/luthor

Resources

DemoPlaygroundGitHubnpm Package

Support the Project

Buy me a coffeeStar on GitHub

Built with love by developers for developers.

DocsGitHubllms.txtllms-full.txt
  1. Home
  2. Docs
  3. Luthor
  4. Presets
  5. Chat Window Editor

Luthor Documentation

Getting Started

  • Introduction
  • Installation
  • @lyfie/headless
  • @lyfie/luthor

@lyfie/headless

  • Features
  • Typography and Text
  • Structure and Lists
  • Media and Embeds
  • Code and Devtools
  • Interaction and Productivity
  • Customization and Theming

@lyfie/luthor

  • Presets
  • Extensive
  • Simple Text
  • Rich Text
  • Chat Window
  • Email Compose
  • Markdown
  • Notion Like
  • Headless Preset
  • Notes

Chat Window

Chat composer style preset with send and action controls.

Usage

tsx
import { ChatWindowEditor } from '@lyfie/luthor';
import '@lyfie/luthor/styles.css';

export function App() {
  return (
    <ChatWindowEditor
      onSend={({ jsonb }) => console.log(jsonb)}
      submitOnEnter
      allowShiftEnter
    />
  );
}

Props

ChatWindowEditorProps inherits ExtensiveEditorProps except featureFlags and isToolbarEnabled.

  • onSend: undefined (default) | (payload: { jsonb: string }) => void
  • submitOnEnter: true (default) | false
  • allowShiftEnter: true (default) | false
  • showVoiceButton: false (default) | true
  • showImageButton: true (default) | false
  • showSendButton: true (default) | false

Behavior

  • Toolbar is disabled by preset defaults
  • Visual mode only
  • Enter-to-send behavior is configurable
Previous: Rich Text
Next: Email Compose