Hace pocos dias se dio a conocer la noticia de que Facebook ha abierto el código fuente de la biblioteca Lexical JavaScript, que ofrece componentes para crear editores de texto y formularios web avanzados de edición de texto para sitios web y aplicaciones web.

En esencia, Lexical es un motor de edición de texto, una plataforma para crear editores web ricos en funciones. Al mismo tiempo, creemos que los usuarios no deberían tener que volver a escribir la misma funcionalidad de texto enriquecido una y otra vez en cada implementación. Lexical expone un conjunto de paquetes modulares individuales que se pueden usar para agregar características comunes como listas, enlaces y tablas.

Las cualidades distintivas de la biblioteca son la facilidad de integración en los sitios, el diseño compacto, la modularidad y el soporte para herramientas para personas con discapacidad, como lectores de pantalla.

Lexical es un marco extensible de editor de texto web de JavaScript con énfasis en la confiabilidad, la accesibilidad y el rendimiento. Lexical tiene como objetivo proporcionar la mejor experiencia de desarrollador de su clase, para que pueda crear fácilmente prototipos y crear funciones con confianza. Combinado con una arquitectura altamente extensible, Lexical permite a los desarrolladores crear experiencias de edición de texto únicas que escalan en tamaño y funcionalidad.

Sobre Lexical

La biblioteca está diseñada para que sea fácil de conectar y no depende de marcos web externos, pero proporciona enlaces listos para usar para una fácil integración con el marco React.

Para usar Lexical, basta con vincular una instancia del editor al elemento que se está editando, después de lo cual, durante el proceso de edición, puede controlar el estado del editor a través del procesamiento de eventos y comandos. La biblioteca le permite al usuario poder realizar un seguimiento de los estados del editor en cualquier momento y reflejar los cambios en el DOM en función del cálculo de las diferencias entre los estados.

Es posible crear formularios para ingresar texto sin formato sin marcas, así como crear interfaces para la edición visual de documentos que se asemejan a los procesadores de texto y brindan funciones como insertar tablas, imágenes y listas, manipular fuentes y controlar la alineación del texto.

El desarrollador tiene la capacidad de anular el comportamiento del editor o conectar controladores para implementar una funcionalidad atípica.

De las características que se destacan de Lexical, se mencionan las siguientes:

• Lexical se compone de instancias de editor que se adjuntan a un solo elemento editable de contenido. Un conjunto de estados del editor representa los estados actuales y pendientes del editor en un momento dado.
• Lexical está diseñado para todos. Sigue las mejores prácticas establecidas en WCAG y es compatible con lectores de pantalla y otras tecnologías de asistencia.
• Lexical es mínimo. No se ocupa directamente de los componentes de la interfaz de usuario, las barras de herramientas o las funciones de texto enriquecido y las rebajas. La lógica de estas funciones se puede incluir a través de una interfaz de complemento

El marco básico de la biblioteca contiene el conjunto mínimo requerido de componentes, cuya funcionalidad se amplía a través de la conexión de complementos. Por ejemplo, a través de complementos, puede conectar elementos adicionales de la interfaz, paneles, herramientas para la edición visual en modo WYSIWYG, soporte para el formato Markdown o componentes para trabajar con ciertos tipos de contenido, como listas y tablas.

En forma de complementos, también están disponibles funciones tales como autocompletar entrada, limitar el tamaño máximo de los datos de entrada, abrir y guardar archivos, adjuntar notas/comentarios, entrada de voz, etc.

Finalmente cabe mencionar que actualmente Lexical se encuentra actualmente en desarrollo temprano y es probable que las API y los paquetes cambien con bastante frecuencia. El código está escrito en JavaScript y se distribuye bajo la licencia MIT.

Se han preparado varias demostraciones interactivas para familiarizarse con las posibilidades de la biblioteca y puedes consultar una de ellas en el siguiente enlace.

Si quieres conocer más al respecto, puedes consultar los detalles en el siguiente enlace.