Streamdown 2.4: кастомизация, доступность и кастомный рендеринг Markdown

Vercel выпустила Streamdown 2.4 — новую версию библиотеки для рендеринга Markdown, ориентированную на разработчиков. Главные изменения касаются кастомизации внешнего вида, поддержки доступности и улучшения пользовательского опыта при работе с потоковым выводом. Это обновление делает библиотеку более

Streamdown 2.4: кастомизация, доступность и кастомный рендеринг Markdown

Vercel выпустила Streamdown 2.4 — новую версию библиотеки для рендеринга Markdown, ориентированную на разработчиков. Главные изменения касаются кастомизации внешнего вида, поддержки доступности и улучшения пользовательского опыта при работе с потоковым выводом. Это обновление делает библиотеку более гибкой и подходящей для enterprise-проектов, где важны детальная настройка и поддержка разных языков.

Что нового в Streamdown 2.4

Разработчики теперь могут переопределять встроенные иконки, передавая кастомную карту компонентов в пропс icons. Кроме того, в createCodePlugin добавлена поддержка тем Shiki для светлого и тёмного режимов, опция startLine для указания начального номера строки и виртуальный компонент inlineCode для независимой стилизации строчного кода. Эти изменения дают больше контроля над внешним видом и поведением рендеринга.

Предыстория и контекст

Streamdown — это библиотека для рендеринга Markdown, созданная Vercel для использования в своих продуктах, таких как Vercel AI SDK. Она ориентирована на потоковую передачу данных и часто применяется в AI-приложениях, где важен инкрементальный вывод. Предыдущие версии уже поддерживали базовую кастомизацию, но версия 2.4 значительно расширяет эти возможности, приближая библиотеку к потребностям enterprise-проектов.

Какие новые возможности появились в Streamdown 2.4?

Streamdown 2.4 добавляет поддержку интернационализации и направления текста. Пропс dir автоматически определяет направление письма (слева направо или справа налево) на основе первого сильного символа Unicode, а пропс translations позволяет задавать кастомные языки. Таблицы теперь оснащены полноэкранным оверлеем, управляемым через пропс controls, с блокировкой прокрутки и поддержкой клавиши Escape. Разработчики могут подключаться к событиям стриминга через колбэки onAnimationStart и onAnimationEnd.

Технические подробности: как устроена кастомизация

Ключевое нововведение — возможность полной замены иконок через компонентную карту. Это значит, что разработчики могут использовать свои SVG-иконки или библиотеки вроде Heroicons без дополнительных обёрток. Для кодовых блоков Shiki-темы теперь настраиваются отдельно для светлой и тёмной темы, что критично для сайтов с поддержкой color scheme. Пропс startLine решает проблему, когда код начинается не с первой строки (например, при вставке фрагмента). Компонент inlineCode позволяет задать стили для строчного кода, отличные от блочного, что раньше было возможно только через глобальные CSS-классы.

Кого затронет и как

Обновление в первую очередь полезно разработчикам, использующим Streamdown в AI-чатах, документации или блогах. Возможность кастомизации иконок и кода упрощает интеграцию с дизайн-системами. Поддержка RTL (справа налево) важна для арабского, иврита и других языков — это расширяет аудиторию продукта. Исправление ошибок с пустыми строками в подсвеченных блоках и предотвращение повторной анимации списков улучшают пользовательский опыт на клиентской стороне. Для проектов на Tailwind v4 добавлен пропс prefix, который неймспейсит утилитарные классы, избегая конфликтов.

Что будет дальше

Ожидается, что Vercel продолжит развивать Streamdown в сторону большей модульности и производительности. В ближайших версиях возможна поддержка кастомных парсеров и расширений Markdown, а также улучшенная интеграция с AI SDK. Разработчикам стоит следить за changelog и обновлять зависимости.

Итог

Streamdown 2.4 — значимое обновление для всех, кто работает с рендерингом Markdown в потоковом режиме. Новые возможности кастомизации, интернационализации и доступности делают библиотеку более гибкой и готовой к использованию в сложных проектах. Рекомендуем обновиться и изучить документацию.