SortableJS resolvió hace años la parte difícil del arrastrar y soltar: listas anidadas, mover elementos entre listas conectadas, clonar en lugar de mover, y todo el comportamiento del arrastre que nadie quiere escribir a mano.

En Angular, la puerta a esa potencia fue durante un tiempo ngx-sortablejs. Funcionaba, pero su API se quedó en diciembre de 2020, que es cuando publicó su última versión.

Lo que se podía hacer

ngx-sortablejs dejaba pasar todo SortableJS, así que tenías listas anidadas, transferencias entre listas conectadas, modo de clonación y la reordenación de un FormArray de Angular sin perder los controles. Cualquier opción de SortableJS estaba a un objeto de distancia.

Dónde se quedaba corta

La API era la de 2020:

• Cuatro entradas: el array, el contenedor, el objeto de opciones y la función de clonación.
• Una sola salida, la de inicialización.
• Los eventos, como callbacks dentro del objeto de opciones.
• Nada de señales: no existían todavía.

Tiene dos consecuencias. La primera, que la plantilla se llena de un objeto de opciones: no puedes enlazar animation o handle como entrada, ni escuchar un (update) como salida. La segunda, que con Angular 16 la librería deja de compilar. Está compilada con View Engine, Angular dejó de convertir esas librerías con ngcc en la 16, y ahí se acaba.

La versión de hoy

ng-hub-ui-sortable es un reemplazo para Angular actual. Mantiene lo que SortableJS sabe hacer y moderniza la capa de Angular:

• Una entrada por opción (32 en total) y una salida por evento, además del objeto de opciones si lo prefieres.
• Se enlaza a un array, a un FormArray o a una WritableSignal.
• Proveedor standalone provideSortable() para las opciones globales.
• Reordenación por teclado con anuncios para lectores de pantalla, activada por defecto. SortableJS solo escucha el ratón y el dedo.
• Modo manual al estilo del CDK, para validar o guardar antes de tocar el array.

Un aviso honesto: no es un reemplazo uno a uno. Cada atributo de la plantilla cambia de nombre y hay varios comportamientos que compilan sin quejarse y fallan en ejecución. La guía de migración los recorre uno a uno.

De dónde sale

Es el fork de un fork. El proyecto original murió en 2020; Worktile lo mantuvo vivo sacando una versión por cada Angular, con la misma API; y ng-hub-ui-sortable parte de ese trabajo para llevar la API al Angular de hoy. Si solo necesitas seguir subiendo de versión sin tocar las plantillas, el de Worktile es el camino corto.

Para quien no programa: una librería que resuelve algo tan engorroso como arrastrar y soltar en interfaces complejas seguía funcionando bien, pero su forma de usarla se había quedado vieja. Actualizarla no cambia lo que hace; cambia lo cómodo que es hacerlo desde Angular.