* docs: polish localized documentation - Rewrite Russian documentation for natural terminology and current source parity\n- Continue the Polish editorial pass across guides and SDK references\n- Refresh shared localized SDK API data imports * docs(pl): complete editorial pass - Rewrite the remaining advanced Vue SDK references\n- Refresh the Figma compatibility matrix against the canonical source\n- Align terminology and behavior across every Polish documentation page * docs(de): complete editorial pass - Rewrite German guides, automation docs, and Vue SDK references\n- Restore current AI, export, component, and variable behavior\n- Refresh the Penpot comparison and Figma compatibility matrix * docs(es): complete editorial pass - Rewrite Spanish guides, automation docs, and Vue SDK references\n- Restore current AI, export, component, and variable behavior\n- Refresh the Penpot comparison and Figma compatibility matrix * docs(fr): complete editorial pass - Rewrite French guides, automation docs, and Vue SDK references\n- Restore current AI, export, component, and variable behavior\n- Refresh the Penpot comparison and Figma compatibility matrix * docs: correct localized terminology - Replace unnecessary English prose with natural localized terminology\n- Derive documentation aliases from named directory roots\n- Preserve English only for identifiers, APIs, and exact product terms * docs(it): continue editorial pass - Rewrite Italian user guides and automation documentation\n- Update Vue SDK composables and component references\n- Restore current AI, export, component, and variable behavior * docs(it): complete editorial pass - Finish Italian advanced SDK and reference documentation\n- Refresh the Penpot comparison and Figma compatibility matrix\n- Replace literal machine translations with natural technical prose * docs(pl): refine property panel terminology * docs: refine remaining localized prose - Replace overfitted English prose in Polish feature documentation\n- Rewrite the Russian property-list reference in natural terminology * docs(ru): rewrite Penpot comparison naturally - Replace remaining English prose with natural Russian\n- Preserve code identifiers and library names only where required * docs: rewrite localized feature overviews naturally - Replace avoidable English prose in German, Spanish, and French\n- Keep identifiers and product names unchanged * docs(de): refine property panel terminology * docs: refine Spanish and French SDK terminology * docs(ru): continue full prose audit - Rewrite homepage, setup, navigation, and guide index naturally\n- Restore missing zoom shortcuts * docs(ru): audit user and automation guides - Rewrite selection, collaboration, and automation prose naturally\n- Preserve API identifiers while localizing ordinary terminology * docs(ru): audit CLI inspection and analysis * docs(ru): audit Vue SDK overview and guides * docs(ru): audit Vue SDK API prose - Localize ordinary component and composable terminology\n- Preserve API symbols and code identifiers * docs(ru): audit advanced and gradient API references * docs(ru): finish advanced API prose audit * docs(ru): audit JSX renderer guide * docs(ru): audit CLI export and scripting guides * docs(pl): audit Penpot comparison prose * docs(pl): audit selection and automation guides * docs(pl): audit homepage and variable guides * docs(pl): audit vector, layers, and Pen guides * docs(pl): audit Auto layout and shape guides * docs(pl): audit context menu and export guides * docs(pl): audit JSX and analysis guides * docs(pl): audit AI Chat guide * docs(pl): audit components and CLI inspection * docs(pl): audit scripting and SDK overview prose * docs(pl): audit SDK API indexes * docs(pl): audit SDK component references * docs(pl): audit SDK composable references * docs(ru): refine usePosition terminology * docs(pl): audit advanced SDK references * docs(pl): audit Figma compatibility matrix * docs(pl): finish residual SDK terminology audit * docs(pl): finish component terminology audit * docs(pl): finish SDK guide terminology audit * docs(de): begin full user guide prose audit * docs(de): audit navigation, Pen, and layers guides * docs(de): audit Auto Layout, shapes, menu, and export * docs(de): audit components, text, and vector guides * docs(de): audit variables and automation overview * docs(de): audit AI Chat and collaboration guides * docs(de): audit CLI inspection, analysis, and export * docs(de): audit scripting and JSX guides * docs(de): audit Vue SDK overview and guides * docs(de): audit SDK API indexes * docs(de): audit SDK component references * docs(de): audit SDK composable references * docs(de): audit advanced SDK references * docs(de): audit Penpot comparison prose * docs(de): audit Figma compatibility reference * docs(es): begin full user guide prose audit * docs(es): audit document organization guides * docs(es): audit editing workflow guides * docs(es): audit automation and collaboration prose * docs(es): audit CLI inspection and export guides * docs(es): audit CLI scripting guide * docs(es): audit JSX and feature overview prose * docs(es): audit Penpot comparison prose * docs(es): audit SDK overview and guides * docs(es): begin SDK component reference audit * docs(es): audit SDK navigation component references * docs(es): audit SDK color and layout components * docs(es): begin SDK composable reference audit * docs(es): audit SDK property composable references * docs(es): audit SDK editor composable references * docs(es): begin advanced SDK reference audit * docs(es): audit advanced SDK state references * docs(es): complete advanced SDK reference audit * docs(es): audit Figma compatibility reference * docs(es): complete residual terminology sweep * docs(fr): begin full prose second audit * docs(fr): audit AI and variables prose * docs(fr): audit core user guide prose * docs(fr): audit editing workflow guides * docs(fr): audit CLI and JSX prose * docs(fr): audit Penpot comparison prose * docs(fr): audit SDK overview and guides * docs(fr): begin SDK API reference audit * docs(fr): audit SDK navigation component references * docs(fr): audit SDK color and layout components * docs(fr): begin SDK composable reference audit * docs(fr): audit SDK property composable references * docs(fr): audit editor composables and advanced APIs * docs(fr): audit advanced SDK state references * docs(fr): complete advanced SDK reference audit * docs(fr): audit Figma compatibility reference * docs(fr): complete residual terminology sweep * docs(it): begin full prose second audit * docs(it): audit document workflow guides * docs(it): audit editing and automation prose * docs(it): audit CLI and JSX prose * docs(it): audit Penpot comparison and SDK guides * docs(it): begin SDK API reference audit * docs(it): audit SDK component and state references * docs(it): audit residual SDK references * docs(it): audit Figma compatibility reference * docs(it): complete residual terminology sweep * docs(i18n): verify residual locale terminology
158 lines
6.1 KiB
Markdown
158 lines
6.1 KiB
Markdown
---
|
||
title: Сценарии
|
||
description: Выполнение JavaScript через совместимый с Figma Plugin API для поиска, массового изменения и создания дизайна.
|
||
---
|
||
|
||
# Сценарии
|
||
|
||
`openpencil eval` выполняет JavaScript для документа OpenPencil и предоставляет глобальный объект `figma`, совместимый с Figma Plugin API. Команда подходит для пакетных изменений, проверки документов, подготовки тестовых данных и другой автоматизации без интерфейса редактора.
|
||
|
||
## Первый вызов
|
||
|
||
```sh
|
||
openpencil eval design.fig -c "return figma.currentPage.children.length"
|
||
```
|
||
|
||
Параметр `-c` принимает JavaScript. Если код не начинается с `return`, OpenPencil помещает его в асинхронную функцию и возвращает её результат, когда он есть.
|
||
|
||
```sh
|
||
openpencil eval design.fig -c "
|
||
const frame = figma.createFrame()
|
||
frame.name = 'Card'
|
||
frame.resize(300, 200)
|
||
frame.layoutMode = 'VERTICAL'
|
||
frame.itemSpacing = 12
|
||
return { id: frame.id, name: frame.name }
|
||
"
|
||
```
|
||
|
||
## Поиск объектов
|
||
|
||
```sh
|
||
openpencil eval design.fig -c "
|
||
return figma.currentPage
|
||
.findAll((node) => node.type === 'FRAME' && node.name.includes('Button'))
|
||
.map((button) => ({
|
||
id: button.id,
|
||
name: button.name,
|
||
width: button.width,
|
||
height: button.height
|
||
}))
|
||
"
|
||
```
|
||
|
||
## Изменение и сохранение
|
||
|
||
`--write` или `-w` записывает изменения во входной файл. `--output` или `-o` создаёт новый файл.
|
||
|
||
## Сценарий из стандартного ввода
|
||
|
||
```sh
|
||
cat transform.js | openpencil eval design.fig --stdin --write
|
||
```
|
||
|
||
## Открытое приложение
|
||
|
||
Не указывайте файл, чтобы выполнить сценарий для текущего документа в настольном приложении:
|
||
|
||
```sh
|
||
openpencil eval -c "return figma.currentPage.name"
|
||
```
|
||
|
||
## Вывод
|
||
|
||
При перенаправлении вывода по умолчанию используется JSON. Параметр `--json` включает его явно, а `--quiet` или `-q` отключает вывод.
|
||
|
||
## Доступный API
|
||
|
||
API намеренно близок к Figma Plugin API, но работает с SceneGraph и форматами OpenPencil.
|
||
|
||
### Документ и страницы
|
||
|
||
- `figma.root`
|
||
- `figma.currentPage`
|
||
- `figma.currentPage.selection`
|
||
- `figma.getNodeById(id)`
|
||
- `figma.createPage()`
|
||
|
||
### Создание объектов
|
||
|
||
- `figma.createFrame()`
|
||
- `figma.createRectangle()`
|
||
- `figma.createEllipse()`
|
||
- `figma.createText()`
|
||
- `figma.createLine()`
|
||
- `figma.createPolygon()`
|
||
- `figma.createStar()`
|
||
- `figma.createVector()`
|
||
- `figma.createComponent()`
|
||
- `figma.createSection()`
|
||
|
||
### Дерево
|
||
|
||
- `node.children`
|
||
- `node.parent`
|
||
- `node.appendChild(child)`
|
||
- `node.insertChild(index, child)`
|
||
- `node.clone()`
|
||
- `node.remove()`
|
||
- `node.findAll(callback?)`
|
||
- `node.findOne(callback)`
|
||
- `node.findChild(callback)`
|
||
- `node.findChildren(callback?)`
|
||
- `figma.group(nodes, parent)`
|
||
- `figma.ungroup(node)`
|
||
|
||
### Компоненты
|
||
|
||
- `figma.createComponentFromNode(node)`
|
||
- `component.createInstance()`
|
||
- `instance.mainComponent`
|
||
|
||
### Переменные
|
||
|
||
- `figma.getLocalVariables(type?)`
|
||
- `figma.getVariableById(id)`
|
||
- `figma.getLocalVariableCollections()`
|
||
- `figma.getVariableCollectionById(id)`
|
||
- `figma.createVariable(name, type, collectionId, value?)`
|
||
- `figma.setVariableValue(variableId, modeId, value)`
|
||
- `figma.deleteVariable(id)`
|
||
- `figma.createVariableCollection(name)`
|
||
- `figma.deleteVariableCollection(id)`
|
||
- `figma.bindVariable(nodeId, field, variableId)`
|
||
- `figma.unbindVariable(nodeId, field)`
|
||
|
||
### Свойства
|
||
|
||
Распространённые свойства доступны для чтения и записи через прокси:
|
||
|
||
- геометрия: `x`, `y`, `width`, `height`, `rotation`, `resize(width, height)`;
|
||
- внешний вид: `fills`, `strokes`, `effects`, `opacity`, `visible`, `locked`, `blendMode`, `clipsContent`;
|
||
- радиусы: `cornerRadius`, `topLeftRadius`, `topRightRadius`, `bottomRightRadius`, `bottomLeftRadius`;
|
||
- текст: `characters`, `fontSize`, `fontName`, `fontWeight`, выравнивание, интерлиньяж, межбуквенный интервал и функции для диапазонов стилей;
|
||
- автоматическая компоновка: `layoutMode`, `primaryAxisAlignItems`, `counterAxisAlignItems`, `itemSpacing`, отступы, размеры и положение;
|
||
- обводка: `strokeWeight`, `strokeAlign`, `dashPattern`.
|
||
|
||
### Служебные возможности
|
||
|
||
- `figma.mixed`
|
||
- `figma.createImage(data)`
|
||
- `figma.loadFontAsync(fontName)` ничего не делает, поскольку OpenPencil не блокирует изменение текста до загрузки шрифта плагином
|
||
- `figma.listAvailableFontsAsync()` возвращает доступные системные шрифты
|
||
- `figma.notify(message)` записывает предупреждение в режиме без интерфейса
|
||
- `figma.viewport`
|
||
|
||
## Пока не совместимо с Figma
|
||
|
||
Следующие API пока не предоставляются в совместимом виде:
|
||
|
||
- `node.exportAsync()`
|
||
- `node.setBoundVariable(field, variable)`
|
||
- `node.detachInstance()`
|
||
- `figma.combineAsVariants(components, parent)`
|
||
- API стилей Figma, например `figma.createPaintStyle()` и `figma.createTextStyle()`
|
||
- полная совместимость логических операций над векторами
|
||
|
||
Вместо них используйте команды экспорта OpenPencil CLI, инструменты основного пакета или прямые вспомогательные функции SceneGraph, когда они доступны.
|