E-Style

E-Style — это плагин для Figma, который позволяет управлять переменными шрифтов и текстовыми стилями. Он помогает пользователям легко применять переменные к семействам шрифтов и обновлять данные стилей.

Установка

Перед началом убедитесь, что у вас установлен Node.js (рекомендуется последняя LTS-версия). Если Node.js не установлен, скачайте его с официального сайта.

1. Склонируйте репозиторий или скачайте исходный код.
2. Установите зависимости:

   npm install

3. Соберите проект:

   npm run build

4. В Figma откройте Плагины → Разработка → Запустить локальный плагин… и выберите manifest.json.

Использование

Интерфейс

Плагин предоставляет удобный UI с возможностью выбора семейства шрифтов и переменных:

• Select Font Family — выбор текстового стиля.
• Select Variable — выбор переменной.
• Apply Variable — применение переменной к выбранному стилю.
• Update Data — обновление списка доступных текстовых стилей и переменных.

Обмен данными с Figma

Плагин отправляет сообщения в среду Figma:

• get-variables — получает доступные переменные.
• get-text-styles — получает список текстовых стилей.
• apply-variable-to-font-family — применяет выбранную переменную к текстовому стилю.

Разработка

Скрипты

• npm run build — сборка TypeScript-кода.
• npm run watch — запуск сборки в режиме отслеживания изменений.
• npm run lint — проверка кода на ошибки.
• npm run lint:fix — исправление ошибок форматирования.

Технологии

• TypeScript — основной язык проекта.
• ESLint — линтер для проверки кода.
• Figma Plugin API — взаимодействие с Figma.
• HTML/CSS — UI плагина.

Лицензия

Этот проект распространяется под лицензией AGPL-3.0 (GNU Affero General Public License).

Автор

Разработчик: Тимур Якшимбетов (@timur_etc)