VueCraft NPM

Visual Linker ​

0.3.0 ​

2026-10-01

  • New (core): опция selectable — соединения становятся фокусируемыми кнопками (порядок Tab совпадает с порядком в connections), которые выделяются кликом или Enter/Space, а Ctrl/Cmd/Shift переключает соединение в мультивыделении; Escape или нажатие указателя в другом месте снимает выделение. Delete/Backspace отправляет connection:delete-request, а сама библиотека данные не удаляет. Новое: setSelectedConnections(ids), событие connection:selectionchange, ConnectionStyle.selectedStyle и CSS-переменные --vl-selected-color / --vl-focus-color. Каждая линия теперь несёт role="img" и aria-label (ConnectionDescriptor.ariaLabel, по умолчанию «Connection: a → b»). Подробнее — Выделение и доступность.
  • New (core): ConnectionDescriptor.labels — любое число подписей в любом месте линии (position: 'start', 'middle', 'end' или доля 0..1; offset, rotate, className). Подпись с text рисует сама библиотека как SVG-«таблетку» (--vl-label-bg, --vl-label-border, --vl-label-color), подпись без него — только позиция. ConnectionLayout.labels содержит рассчитанные точку и угол каждой подписи. Новые типы: ConnectionLabel, LabelLayout. Подробнее — Подписи соединений.
  • New (core): ConnectionStyle.animated / defaultAnimated — узор из штрихов или точек, бегущий вдоль линии (speed, direction, shape, dash, gap, color, width); он рисуется отдельным оверлеем на одном CSS и отключается при prefers-reduced-motion. Новый тип: ConnectionFlow. Подробнее — Анимированный поток.
  • New (core): avoidObstacles / obstaclePadding (и ConnectionStyle.avoidObstacles) — линии smoothstep прокладываются в обход других блоков, а не сквозь них, и перестраиваются на лету при перетаскивании блоков; линия, у которой обычный маршрут уже свободен, не меняется, а если маршрута нет, остаётся обычный. Подробнее — Маршрутизация и пересечения.
  • New (core): jumps (и ConnectionStyle.jumps) — линия smoothstep делает небольшую полукруглую дугу там, где пересекает линию другого соединения, как на электрических схемах. Новый тип: JumpsOption. Подробнее — Маршрутизация и пересечения.
  • New (core): clipToScrollParents — порт, уехавший из видимой области внутри обрезающего предка (строка в прокручиваемом списке, overflow: hidden), больше не оставляет линию висеть над посторонним содержимым: по умолчанию 'pin' прижимает этот конец к краю видимой области и убирает его маркер и точку порта, 'hide' скрывает соединение, false возвращает прежнее поведение. В ConnectionLayout появились fromClipped / toClipped. Подробнее — Прокручиваемые контейнеры.
  • New (core): разведение по порту — BlockDescriptor.portSpread, PortDescriptor.spread и defaultPortSpread (true или { gap, padding }, по умолчанию 16 и 8) дают каждому соединению, которое делит сторону порта, свой виртуальный порт, упорядоченный так, чтобы линии не пересекались. Новые типы: PortSpread, PortSpreadOptions. Подробнее — Разведение соединений по порту.
  • New (Vue): проп selected (v-model:selected) и события connection-selectionchange, connection-delete-request и update:selected.
  • New (Vue): #connection-label вызывается по одному разу на каждую подпись без text — { connection, label, point, angle, rotation, from, to } — и ставит подпись в её точку, повернув на rotation. Без labels он работает как раньше: одна подпись посередине линии.
  • New (Vue): portSpread у v-vl-block и в элементах blocks, spread у v-vl-port и атрибуты data-vl-port-spread / data-vl-spread ("" или "true" включает, "false" выключает, "24" задаёт промежуток, "24 4" — промежуток и отступ).
  • Changed (Vue): слот #marker не рендерится для конца соединения, прижатого к краю прокручиваемого контейнера.
  • New (Nuxt): опции модуля portSpread, clipToScrollParents, animated, avoidObstacles, obstaclePadding и jumps, которые применяются как значения по умолчанию для каждого <VisualLinker>.