Вызовы цитат

Настройка Компонент темы
50

Вот обновление, которое модернизирует компонент и добавляет поддержку текстового редактора с форматированием! :rocket:
Возможно, потребуется некоторая доработка или могут возникнуть непредвиденные крайние случаи, но я считаю, что это хорошее начало. :folded_hands:

Кратко

  • Добавлена поддержка текстового редактора с форматированием (подробный обзор ниже)
  • Рендеринг переведён на компонент Glimmer
  • Исправлен цвет CSS для вложенных вызовов
  • Исправлен цвет CSS для алиасов
  • Анимация сворачивания должна стать плавнее
  • Добавлена настройка callout_transition_duration_ms (анимация сворачивания)
  • Добавлено сочетание клавиш Ctrl + q для вставки вызова по умолчанию.
    Работает в обоих редакторах, а сочетание клавиш добавлено в модальное окно «Горячие клавиши».
    Изображения

    chrome_7HSSbReBtO
    chrome_7HSSbReBtO329×348 15.5 KB

    chrome_YaDrphqvbV
    chrome_YaDrphqvbV712×275 19.1 KB

  • Чат: добавлена кнопка в панели инструментов для вставки вызова по умолчанию
    Изображения

    chrome_CWig42tWHY
    chrome_CWig42tWHY478×551 16.3 KB

    chrome_TsyfsoA82R
    chrome_TsyfsoA82R291×373 12.8 KB

    chrome_nWk7hUyRGr
    chrome_nWk7hUyRGr445×181 5.07 KB

  • Предпросмотр Markdown: добавлена возможность изменения типа вызова при клике на иконку
    Изображение

    chrome_atmmLf0v3c
    chrome_atmmLf0v3c1522×462 41.3 KB

Текстовый редактор с форматированием

Давайте поговорим о текстовом редакторе с форматированием и о том, чего ожидать!

Создание вызовов:

У вас есть четыре способа вставки вызовов:

  • Горячие клавиши
  • Панель инструментов
  • Правила ввода
    • /callout<type>
    • !!<type>
  • Поддержка вставки
    Видео

Редактирование вызовов

Элементы управления для редактирования вызова появляются только после его выбора.

  • Выбор типа
    При клике на иконку появится всплывающее меню.
  • Пользовательский заголовок
    Поддерживается встроенное форматирование и эмодзи
  • Сворачивание
    Возможность сделать вызов сворачиваемым. Доступно через меню параметров.
    Видео

Организация вызовов

  • Элементы управления перемещением

    • Настольный компьютер
      Есть ручка, за которую можно потянуть, чтобы перетащить вызов.
    • Устройство с сенсорным экраном
      Вы можете перемещать вызовы вверх/вниз или встраивать их в соседние вызовы. По умолчанию эта функция отключена, чтобы не перегружать интерфейс, так как вы редко будете этим заниматься. Включить можно в настройках.
    Видео

  • Навигация с клавиатуры
    Это помогает легче перемещаться внутрь и из вложенных вызовов.
    Возможно, в будущих версиях потребуется внести некоторые изменения для обеспечения согласованности поведения.

    • ← В начале заголовка автоматически откроется выбор типа вызова.
    • ↑ ↓ Внутри тела вызова, если нет абзаца, в который можно перейти, будет создан новый; если вы выйдете с пустым содержимым, абзац будет удалён.
    • Enter внутри заголовка перемещает курсор в тело (и создаёт его, если необходимо).
    Видео

  • Вставка по клику

    • В областях, где нет абзаца, можно кликнуть внутрь, чтобы открыть новый абзац.
    • При желании также можно использовать кнопки для открытия абзаца внутри или снаружи вызова.
      Видео

Возможно, позже я займусь:

  • автодополнением правил ввода
  • улучшением цветов с помощью современного CSS для обеспечения согласованности и видимости, особенно в тёмной теме.

  • Я бы хотел убрать все настройки и сначала сосредоточиться на простоте, оставив продвинутую кастомизацию только через CSS, но уже слишком поздно для этого :rofl:

Особая благодарность Moin за обратную связь.

На этом всё. Дайте знать, что вы думаете. Отзывы очень приветствуются!

7 лайков