Visual Linker

0.4.3

2026-10-02

• Изменено (поведение по умолчанию): hover и highlight теперь включаются по запросу. Раньше линия реагировала на курсор в любой диаграмме: получала состояние hover с прибавкой к толщине, показывала курсор-указатель над своей областью нажатия, а наведение на блок подсвечивало его соединения. Теперь ничего из этого не происходит, пока вы не включите режим, так что диаграмма, на которую просто смотрят, остаётся неподвижной. Курсор-указатель на линии появляется, только если для неё включён hover или она выделяемая. Чтобы вернуть прежнее поведение, задайте interaction: { hover: true, highlight: true }.
• Новое: interaction.hover и interaction.highlight. Два независимых флага, оба по умолчанию false. hover — курсор над линией, highlight — курсор над блоком подсвечивает его соединения. См. Визуальные состояния.
• Новое: hoverable у соединения и highlightable у блока. Каждый включает или выключает свой режим для одной сущности, и локальное значение сильнее глобального. highlightable также доступен как опция v-vl-block, поле пропа blocks и атрибут data-vl-highlightable.
• Без изменений: события connection:mouseenter, connection:mouseleave, connection:click, block:mouseenter и block:mouseleave приходят как раньше, а состояния selected и focus, выделение и управление с клавиатуры от новых флагов не зависят. Корзина hover или highlight ничего не делает, пока её режим выключен. Оба флага можно менять через setConfig.

0.4.2

2026-10-02

• Порт с якорем больше не прижимается обрезающей обёрткой внутри якорного блока. У порта с anchorBlockId или anchorEl точка рисуется на границе якоря, но обрезан ли он, решала именно эта точка. Строка внутри элемента с overflow: hidden — скруглённого переключателя, карточки — внутри блока с отступами, привязанная к нижней границе блока, имеет точку ниже обёртки, поэтому её линию подтягивало к краю обёртки, и она теряла маркер и точку порта. Теперь, обрезан ли такой порт, решает его собственный элемент: видимая строка оставляет точку на границе якоря, а ушедшая за край прокрутки прижимается, как раньше. Порты без якоря не изменились. Подробнее — Прокручиваемые контейнеры.

0.4.1

2026-10-02

• Строки принимаются везде, где был enum. Типы lines.curve, shape и orient маркера и side порта были объединениями членов enum'ов, поэтому TypeScript отклонял curve: 'straight' или shape: 'arrow' с ошибкой Type '"straight"' is not assignable to type 'ConnectionCurve', хотя в рантайме обе записи работали. Теперь это обычные объединения строк ('bezier' | 'straight' | 'smoothstep', 'circle' | 'square' | 'diamond' | 'arrow', 'top' | 'right' | 'bottom' | 'left', 'auto' | 'fixed'), и члены enum'ов под них по-прежнему подходят, так что существующий код продолжает компилироваться. VLConnectionCurveEnum, VLMarkerShapeEnum, VLFixedSideEnum и VLOrientEnum по-прежнему экспортируются. Подробнее — Структура конфигурации.

0.4.0

2026-10-02

• Breaking (все пакеты): плоский VisualLinkerOptions заменён одним структурированным VisualLinkerConfig, разбитым по тому, что он оформляет: theme, lines, markers, ports, labels, blocks и interaction. Все опции defaultXxx убраны; у каждой настройки теперь есть место в группе. style соединения имеет ту же форму, что и группа lines, плюс markers: { start, end }. Подробнее — Структура конфигурации. Старые имена соответствуют новым так:

  0.3.x	0.4.0
  defaultCurve	lines.curve
  defaultCurvature, defaultCurveMinReach, defaultCurveMaxReach, defaultCurveAngleBlend, defaultCurveAngleMaxOffset	lines.bezier.curvature, minReach, maxReach, angleBlend, angleMaxOffset
  defaultCornerRadius, defaultMaxTrunkReach	lines.smoothstep.cornerRadius, lines.smoothstep.maxTrunkReach
  avoidObstacles, obstaclePadding	lines.routing.avoidObstacles, lines.routing.padding
  jumps, defaultAnimated	lines.jumps, lines.animated
  showPorts	ports.show
  defaultPortRadius, defaultPortColor, defaultPortStrokeColor, defaultPortStrokeWidth	ports.radius, ports.fill, ports.stroke, ports.strokeWidth
  defaultPortSpread	ports.spread
  defaultCircleMarkerSize, defaultSquareMarkerSize, defaultDiamondMarkerSize, defaultArrowMarkerSize	markers.sizes.circle, square, diamond, arrow
  draggable, dragGridSize, dragBounds	blocks.draggable, blocks.drag.grid, blocks.drag.bounds
  selectable, clipToScrollParents	interaction.selectable, interaction.clipToScrollParents
  style.curvature, curveMinReach, curveMaxReach, curveAngleBlend, curveAngleMaxOffset	style.bezier.curvature, minReach, maxReach, angleBlend, angleMaxOffset
  style.cornerRadius, style.maxTrunkReach	style.smoothstep.cornerRadius, style.smoothstep.maxTrunkReach
  style.avoidObstacles	style.routing.avoidObstacles
  style.startMarker, style.endMarker	style.markers.start, style.markers.end
  style.hoverStyle, style.selectedStyle	style.hover, style.selected
  hoverStyle.markerSize, selectedStyle.markerSize	size в собственных hover и selected маркера
  VisualLinkerOptions	VisualLinkerConfig

• Breaking (Vue): проп options компонента <VisualLinker> теперь называется config, а UseVisualLinkerOptions у useVisualLinker() больше не расширяет опции движка: в нём config, blocks и connections. config реактивен, поэтому его изменение перерисовывает диаграмму. Подробнее — Компонент VisualLinker.

• Breaking (Vue): общая конфигурация переехала из глобального объекта в provide/inject Vue. setVisualLinkerDefaults(), resetVisualLinkerDefaults(), visualLinkerDefaults и тип VisualLinkerDefaults удалены. Передайте конфигурацию в app.use(VisualLinkerPlugin, { config }), а позже меняйте её через useVisualLinkerConfig(). Подробнее — Общая конфигурация.

• Breaking (Nuxt): опции модуля теперь сама конфигурация движка — те же группы theme, lines, markers, ports, labels, blocks и interaction — вместо отдельного плоского списка (defaultCurve, portRadius, curvature, …). Они должны быть сериализуемы в JSON. Четыре настройки, до которых старый список не дотягивался (defaultCornerRadius, defaultMaxTrunkReach, draggable, dragBounds), стали обычными полями. Клиентского плагина больше нет: один универсальный плагин регистрирует директивы и устанавливает конфигурацию. Подробнее — Модуль Nuxt.

• Breaking (core): маркер, заданный в markers.start или markers.end, заменяет встроенную точку порта на этом конце у каждого соединения — так же, как это всегда делал маркер, заданный у одного соединения. Цвета маркеров теперь следуют и за цветами линий из темы.

• New (core): визуальные состояния для каждой визуальной сущности. Линии, маркеры, порты и подписи принимают корзины highlight, hover, selected и focus с полями самой сущности, которые накладываются на базовые в этом порядке. В состоянии маркер может поменять shape, size, цвета, обводку, arrow или целый svg; порт может вырасти, подпись — сменить заливку. Маркеры, порты и подписи следуют состоянию своего соединения. Подробнее — Визуальные состояния.

• New (core): состояние highlight. Наведённый блок теперь переводит свои соединения в highlight, отдельно от hover — курсора над самой линией. Пока корзина highlight не задана, оно выглядит так же, как hover, поэтому существующие конфигурации выглядят как раньше.

• New (core): opacity для линий, маркеров, портов и подписей, в том числе по состояниям. Маркер без собственной opacity блёкнет вместе со своей линией, а анимированная линия перемножает её со своим притемнением.

• New (core): темы. theme — это набор токенов цветов — line, lineHover, lineSelected, selectedHalo, focusRing, portFill, portStroke, labelBackground, labelBorder, labelText, — которые записываются в CSS-переменные. Экспортируются lightTheme, darkTheme и defineTheme(overrides, base). Подробнее — Темы.

• New (core): группа labels — background, border, color, fontSize, paddingX, paddingY и opacity подписей, которые рисует библиотека, с состояниями — а также ports.side и ports.offset как значения по умолчанию для портов, у которых нет своих.

• New (core): конфигурацию можно менять, пока движок работает. setConfig(patch) глубоко сливает (ключ со значением undefined удаляется), replaceConfig(next) заменяет, getConfig() возвращает копию. Перетаскивание и выделение подключаются или отключаются в соответствии с ней, и всё перерисовывается. Дополнительно экспортируются mergeConfig, patchConfig и mergeMarkerInputs.

• New (Vue): общая конфигурация. VisualLinkerPlugin принимает { config }; useVisualLinkerConfig() возвращает реактивный объект; provideVisualLinkerConfig(initial?) задаёт свою для поддерева; installVisualLinkerConfig, createSharedConfig и VISUAL_LINKER_CONFIG_KEY нужны интеграциям. Каждая диаграмма сливает её под своим config, а изменение перерисовывает все диаграммы. Ничего глобального нет, поэтому несколько приложений на странице не мешают друг другу.

• Changed (core): событие block:mouseenter переводит соединения блока в highlight, а не в hover, и под курсором в состоянии hover остаётся только линия, над которой он находится.