Repolode
Enviar
ianstormtaylor

ianstormtaylor/slate

Framework personalizable en TypeScript para crear editores de texto enriquecido sobre React, con un núcleo sin esquema y basado en plugins.

Ver en GitHubSitio web
Estrellas
31,743
Forks
3,304
Issues abiertos
6
Último commit
hace 6 horas

¿Qué es?

Slate es un framework para crear editores de texto enriquecido en el navegador. Se plantea como una capa extensible sobre contenteditable, que usa React para renderizar. Su núcleo hace pocas suposiciones sobre la estructura del documento, así que los desarrolladores pueden definir sus propios tipos de bloque y en línea, como comentarios, contenido incrustado, menciones o tablas, en lugar de tener que adaptarse a un esquema fijo.

Los documentos se modelan como un árbol anidado, similar al DOM, y se modifican mediante comandos y operaciones de alto nivel. El modelo de datos está diseñado para que más adelante se pueda añadir edición colaborativa. La funcionalidad de deshacer y rehacer, la serialización al estilo HTML y la creación de documentos con JSX se ofrecen en paquetes separados.

El proyecto está organizado como un monorepo con varios paquetes: slate para el modelo central, slate-react para el renderizado, slate-history para deshacer y rehacer, y slate-hyperscript para escribir documentos en JSX. El proyecto está actualmente en beta y algunas API todavía podrían cambiar.

Funciones clave

  • 01Arquitectura basada en plugins que permite personalizar el comportamiento de edición.
  • 02Núcleo sin esquema que permite definir tus propios tipos de nodos de bloque y en línea.
  • 03Árbol de documentos anidado, inspirado en el DOM, que admite estructuras como tablas y citas anidadas.
  • 04Componentes de React para renderizar editores mediante slate-react.
  • 05Historial para deshacer y rehacer disponible a través del plugin slate-history.
  • 06Creación de documentos con JSX mediante slate-hyperscript.

Casos de uso

  • Crear un editor al estilo de Medium o Google Docs con bloques personalizados, como contenido incrustado o comentarios.
  • Crear un editor con atajos de Markdown que transforma la entrada mientras los usuarios escriben.
  • Añadir menciones con @ o nodos de datos en línea a una interfaz de edición de texto.
  • Crear una aplicación React que necesite una entrada de texto enriquecido con un modelo de documento no plano.

Inicio rápido

  1. 1

    Abre la guía de instalación de Getting Started en la documentación oficial

Antes de usarlo

  • Slate está en fase beta y algunas API aún no están finalizadas, por lo que podrían sufrir cambios incompatibles.
  • Lo mantienen colaboradores voluntarios, no una gran empresa, así que quizá tengas que aportar las correcciones por tu cuenta.

Temas

#rich-text#text-editor#react#typescript#contenteditable#editor-framework#browser#editor#framework#javascript

Preguntas frecuentes

¿Qué es slate?
Framework personalizable en TypeScript para crear editores de texto enriquecido sobre React, con un núcleo sin esquema y basado en plugins. Slate es un framework para crear editores de texto enriquecido en el navegador. Se plantea como una capa extensible sobre contenteditable, que usa React para renderizar. Su núcleo hace pocas suposiciones sobre la estructura del documento, así que los desarrolladores pueden definir sus propios tipos de bloque y en línea, como comentarios, contenido incrustado, menciones o tablas, en lugar de tener que adaptarse a un esquema fijo.
¿slate es gratuito? ¿Qué licencia tiene?
slate es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿slate sigue mantenido?
Mantenimiento activo. El último commit de slate fue el 21 oct 2026.
¿Para qué puedo usar slate?
Crear un editor al estilo de Medium o Google Docs con bloques personalizados, como contenido incrustado o comentarios. Crear un editor con atajos de Markdown que transforma la entrada mientras los usuarios escriben. Añadir menciones con @ o nodos de datos en línea a una interfaz de edición de texto. Crear una aplicación React que necesite una entrada de texto enriquecido con un modelo de documento no plano.
¿Cómo se instala slate?
Abre la guía de instalación de Getting Started en la documentación oficial
¿Dónde consigo slate?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/ianstormtaylor/slate

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados