Skip to content
Open
Show file tree
Hide file tree
Changes from 6 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -41,3 +41,5 @@ bin/
.kotlin
local.properties
kotlin-js-store/
tools/figma-plugin/node_modules/
tools/figma-plugin/dist/
4 changes: 4 additions & 0 deletions DEVELOPMENT.md
Original file line number Diff line number Diff line change
Expand Up @@ -37,3 +37,7 @@ Update changelog: `./gradlew tools:idea-plugin:patchChangelog`
## WEB

- Run WASM: `./gradlew tools:compose-app:wasmJsBrowserDevelopmentRun`

## FIGMA Plugin

- See `tools/figma-plugin/DEVELOPMENT.md`.
13 changes: 13 additions & 0 deletions tools/figma-plugin/DEVELOPMENT.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
# Figma Plugin Development

## Build and run

- Build converter for Wasm executable: `../../gradlew -p ../../ :sdk:figma:converter:compileProductionExecutableKotlinWasmJs`
- Install plugin package deps: `pnpm install`
- Build plugin assets: `pnpm build`
- Build converter + plugin assets: `pnpm build:all`
- Watch plugin assets: `pnpm watch`

## Reload in Figma

- Reload in Figma after build: `Plugins -> Development -> Hot Reload plugin`
59 changes: 59 additions & 0 deletions tools/figma-plugin/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
# Valkyrie Figma Plugin

This package contains a Figma plugin shell for exporting selected icons into Kotlin `ImageVector` source.

## Status

- UI + selection export flow implemented.
- Auto export is enabled by default and can be toggled off.
- Output format supports both backing property and lazy property generation.
- Plugin UI follows Figma light/dark theme tokens.
- Converter runtime is injected into `dist/ui.html` during build.
- Copy and download actions are both supported.

## Scripts

- `pnpm build:converter` - compile Kotlin/Wasm converter executable assets
- `pnpm build` - build plugin assets into `dist/`
- `pnpm build:all` - build converter + plugin assets
- `pnpm watch` - watch mode for development
- `pnpm typecheck` - TypeScript checks

## Rerun in Figma

1. Run `pnpm build:all`
2. In Figma desktop, open `Plugins -> Development -> Reload plugins`
3. Reopen `Valkyrie ImageVector Export`

## Files

- `manifest.json` - Figma plugin manifest
- `src/main/code.ts` - plugin main thread (selection and SVG export)
- `src/ui/ui.ts` - plugin UI entry and orchestration
- `src/ui/core/` - UI runtime primitives (dom, status, state, api, utils)
- `src/ui/controllers/` - UI request/selection lifecycle controllers
- `src/ui/features/` - conversion, rendering, settings, and bulk actions
- `src/ui/features/converterAdapter.ts` - runtime bridge to Wasm converter
- `src/shared/messages.ts` - typed message contracts between main and UI

## Runtime hookup

`pnpm build` reads these converter outputs:

- `valkyrie-sdk-figma-converter.uninstantiated.mjs`
- `valkyrie-sdk-figma-converter.wasm`

Then build-time injection inlines a Wasm bridge and exposes:

- `window.ValkyrieFigmaWasmConverter.convertSvg(...)`
- `window.ValkyrieFigmaWasmConverter.normalizeIconName(...)`

This avoids external script loading issues in `figma.showUI(__html__)`.

If converter artifacts are missing, build prints warnings and the UI reports that the runtime is not loaded.

## UX notes

- Conversion uses request ids so stale responses do not overwrite newer runs.
- Bulk actions are disabled until at least one successful conversion exists.
- For a single converted icon, the code panel expands and increases code font size for readability.
8 changes: 8 additions & 0 deletions tools/figma-plugin/manifest.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"name": "Valkyrie ImageVector Export",
"id": "valkyrie-imagevector-export",
"api": "1.0.0",
"main": "dist/code.js",
"ui": "dist/ui.html",
"editorType": ["figma"]
}
22 changes: 22 additions & 0 deletions tools/figma-plugin/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"name": "@composegears/valkyrie-figma-plugin",
"version": "0.1.0",
"private": true,
"type": "module",
"scripts": {
"build:converter": "../../gradlew -p ../../ :sdk:figma:converter:compileProductionExecutableKotlinWasmJs",
"build": "node ./scripts/build.mjs",
"build:all": "pnpm build:converter && pnpm build",
"watch": "node ./scripts/build.mjs --watch",
"typecheck": "tsc --noEmit"
},
"devDependencies": {
"@figma/plugin-typings": "^1.122.0",
"esbuild": "^0.25.10",
"typescript": "^5.9.2"
},
"dependencies": {
"fast-text-encoding": "^1.0.6",
"fflate": "^0.8.2"
}
}
Loading