https://github.com/aashreys/button

A Figma & FigJam widget to execute simple actions like navigate to a frame or open a link.
https://github.com/aashreys/button

Last synced: about 1 month ago
JSON representation

A Figma & FigJam widget to execute simple actions like navigate to a frame or open a link.

• Host: GitHub
• URL: https://github.com/aashreys/button
• Owner: aashreys
• License: mit
• Created: 2022-11-22T18:10:55.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2024-08-24T15:12:07.000Z (4 months ago)
• Last Synced: 2024-08-25T16:08:16.867Z (4 months ago)
• Language: TypeScript
• Homepage:
• Size: 364 KB
• Stars: 3
• Watchers: 1
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Button

A Figma & FigJam widget to open links and navigate design.

## Development guide

*This widget is built with [Create Figma Plugin](https://yuanqing.github.io/create-figma-plugin/).*

### Pre-requisites

- [Node.js](https://nodejs.org) – v14

- [Figma desktop app](https://figma.com/downloads/)

### Build the widget

To build the widget:

```

$ npm run build

```

This will generate a [`manifest.json`](https://figma.com/widget-docs/manifest/) file and a `build/` directory containing the JavaScript bundle(s) for the widget.

To watch for code changes and rebuild the widget automatically:

```

$ npm run watch

```

### Install the widget

1. In the Figma desktop app, open a FigJam document.

2. Search for and run `Import widget from manifest…` via the Quick Actions search bar.

3. Select the `manifest.json` file that was generated by the `build` script.

### Debugging

Use `console.log` statements to inspect values in your code.

To open the developer console, search for and run `Open Console` via the Quick Actions search bar.

## See also

- [Create Figma Plugin docs](https://yuanqing.github.io/create-figma-plugin/)

- [`yuanqing/figma-plugins`](https://github.com/yuanqing/figma-plugins#readme)

Official docs and code samples from Figma:

- [Widget API docs](https://figma.com/widget-docs/)

- [`figma/widget-samples`](https://github.com/figma/widget-samples#readme)