Представление создателя
Обзор макета
Представление создателя — это среда редактирования с тремя панелями, которая открывается двойным нажатием на любую группу в области компонентов. Она предоставляет список блоков слева, редактор кода в центре и предпросмотр в реальном времени справа с панелью промпта ИИ в нижней части.
Панель списка блоков
Левая панель показывает все блоки текущей группы. Каждый блок отображает карточку предварительного просмотра с названием блока и нумерованным списком файлов ниже. Используйте панель инструментов вверху для навигации назад, переключения между списочным и разделённым представлением, или нажмите кнопку + для добавления нового блока.
Редактор кода
Центральная панель — это редактор кода с вкладками, где вы пишете и редактируете содержимое блоков. Вкладки организованы по типу файла:
Text
Пишите документацию, Markdown или обычный текстовый контент для блока.
HTML
Редактируйте HTML-структуру вашего компонента.
CSS
Добавляйте стили для вашего компонента.
JavaScript
Добавляйте интерактивность и логику к вашему компоненту.
Предпросмотр в реальном времени
Правая панель отображает живой предварительный просмотр вашего компонента. По мере добавления HTML, CSS и JavaScript в редакторе предварительный просмотр обновляется, показывая скомпилированный результат. Вы также можете перетаскивать файлы или вставлять содержимое (Ctrl+V) прямо в область предварительного просмотра для добавления в блок. Используйте значок глаза для переключения предварительного просмотра и переключатель BG для изменения фона предварительного просмотра.
Панель промпта ИИ
Нижняя панель — это поле ИИ-подсказок. Используйте его для описания изменений и позвольте ИИ генерировать или изменять содержимое вашего блока. Оно включает выбор модели, текстовое поле ввода, голосовой и эмодзи-ввод, а также кнопку Сгенерировать. Два переключателя режимов — A и V — переключают между Режимом Прямого ИИ и Режимом Вариаций.
Категории генерации ИИ
модели ИИ выбратьor reveals generation категории который determine что kind of content AI produces:
Text Gen
Generate или редактировать text-based content such as code, documentation, и markup.
Image Gen
Создавайте изображения из текстовых промптов или редактируйте существующие изображения с помощью ИИ (текст-в-изображение и изображение-в-изображение).
Video Gen
Generate видео из text описания или animate still изображения в video (text-to-video и image-to-video).
Прямой режим ИИ (A)
Когда переключатель A активен, ИИ вносит прямые изменения в ваш компонент на месте. Текст поля показывает «Опишите изменения для применения к компоненту», а значок указывает, какой файл будет изменён (например, «Изменит: текст»). Этот режим идеален для быстрых, точечных правок текущего выбранного файла.
Режим вариаций (V)
Когда переключатель V активен, ИИ генерирует несколько вариаций вашего компонента вместо редактирования на месте. Текст поля меняется на «Опишите вариации, которые хотите сгенерировать», и появляется счётчик с элементами управления − / +, позволяющий выбрать количество создаваемых вариаций. Сгенерированные вариации появляются в специальной панели, где вы можете просмотреть их и добавить предпочтительные версии в группу.