Version 1, Update 16

July 7, 2020

New:

  • The newly released easing curves are now available in the API.
  • The existing reactions property returns multiple reactions to support this newly launched feature.
  • The spread property in ShadowEffect to match the newly released spread feature.
  • A rescale function to match to toolbar's Scale Tool.
  • The masterComponent property has been renamed to mainComponent

Fixed:

  • The QuickJS runtime used to sandbox plugin code has been upgraded to the latest version. Exceptions thrown will now contain a property stack trace (e.g. in the (new Error()).stack). Note that you could previously get stack traces using the Developer VM, which also supports the debugger keyword.
  • The setSharedPluginData namespace argument now supports the characters _, . and uppercase characters.
  • Fixed an issue where exportAsImage API would sometimes would fail to render nodes correctly due to instances not being updated.
  • Fixed an issue where plugins could sometimes set a non-invertible affine transform to relativeTransform.
  • Fixed an issue where cloning a component via .clone() would not trigger library updates for publishing.
  • Fixed an issue where very long plugin names would stretch the plugin window.

Version 1, Update 15

May 7, 2020

New:

  • As per popular request, the default typings have moved have moved to NPM. See the Typings page for more information.
  • Added getPublishStatusAsync to components and styles.

Version 1, Update 14

February 26, 2020

Last update erroneously set the typings file to update 13, so this skips ahead to update 14.

New:

  • The setRelaunchData API (plugin inspector) now supports multiple buttons.
  • The setRelaunchData API is now available on the DocumentNode. Relaunch buttons set on this node will appear on every page when nothing is selected.

Version 1, Update 12

February 12, 2020

New:

  • New selectedTextRange API that allows you to get and set the current text selection.
  • New insertCharacters and deleteCharacters that make it easier to edit text while preserving existing styles.
  • ICYM, new setRelaunchData API (plugin inspector) introduced at Config.
  • "STRETCH" is now a valid value for layoutAlign in children of frames.

Fixed:

  • The following properties have been removed on group nodes (they didn't do anything): clipsContent, guides, layoutGrids, gridStyleId.

Version 1, Update 11

February 5, 2020

New:

Fixed:

  • Fixed how the getRange/setRange functions handle unicode characters. Previously, those function took a start and end parameter which were interpreted as unicode code points (UCS4). However, node.characters returns a JavaScript string which is encoded as UTF16. This created an inconsistency where calling getRange/setRange could end up referencing a different range than the one you would expect, if characters that encode differently were present in your strings (such as emojis). Most plugins should simply work better as a result of this change. If you had added workaround code in your plugin, you may now need to remove the workaround.

We also recently released a new version of the desktop app, which uses Electron 6 and Chrome 76. This gives you access to newer Chrome APIs that weren't previously available in the desktop app.

Version 1, Update 10

January 8, 2020

New:

  • Read-only access to prototyping properties is now available for all plugins

Fixed:

  • Fixed a bug where cloning a page did not clone the prototyping connections

Version 1, Update 9

December 11, 2019

New:

Fixed:

  • The FrameNode and GroupNode objects now have separate prototypes, which means that code such as 'strokes' in group will correctly return false. Note that we still recommend checking the .type property of node objects over using the in operator. We expect this to be an implementation detail -- however, let us know if this is causing you any issues.

Proposed API (how do they work?):

  • Overlay properties have been added to the proposed prototyping APIs.

Version 1, Update 8

December 4, 2019

Figma has released auto-layout!

As always, we try to make sure plugins don't break when we release new features. That being said, this release affects a lot of the core functionality of Figma and you may need to update your plugin to be aware of those concepts.

New layout constraints

Auto-layout frames introduces new types of relations between layers. Existing APIs around size, positioning and children order have different behavior:

  • Children of auto-layout frames have a x and y position set automatically. Writing to the position of those nodes via the API will no-op. Similarly, setting relativeTransform may ignore the translation component (but retain the rotation component).
  • Calling resize(w, h) and resizeWithoutConstraints(w, h) will no-op in one or both dimensions if the auto-layout frame has a size set automatically by auto-layout.
  • Changing the size of a node will have the side effect of changing the size of its parent if the parent is an auto-layout frame.
  • Changing the order of children in an auto-layout frame will have the side effect of changing the position of its children.

The plugin API is intended to always return the most up to date value for all properties (i.e. has auto-layout applied). As such, be aware of these new restrictions and side effects when setting properties.

New frame properties

Frame-like containers (frames, components & instances) now support new properties! The properties listed below now exist on nodes of type "FRAME", "COMPONENT" and "INSTANCE". Note that they are not available on nodes of type "GROUP".

Note that adding these new properties required re-organizing type definitions in the typings file. Notably, we've split FrameNode into FrameNode and GroupNode because a lot of properties are not supported on group nodes.

  • Fill properties
    • fills
    • fillStyleId
  • Stroke properties
    • strokes
    • strokeStyleId
    • strokeWeight
    • strokeAlign
    • strokeCap
    • strokeJoin
    • dashPattern
  • Corner properties
    • cornerRadius
    • topLeftRadius
    • topRightRadius
    • bottomLeftRadius
    • bottomRightRadius
    • cornerSmoothing

Tip: don't write code like if ('fills' in node) { ... } to check if a property exists on a node. This is not guaranteed to work, especially with group nodes. Compare against the node type instead. It also helps TypeScript infer properties about the node better.

function isFrameLike(node: BaseNode): node is FrameNode | ComponentNode | InstanceNode {
  return node.type === "FRAME" || node.type === "COMPONENT" || node.type === "INSTANCE"
}

if (isFrameLike(node)) {
  console.log(node.fills, node.strokes, node.cornerRadius)
}

Deprecation of backgrounds property

On frame-like nodes, the backgrounds and backgroundStyleId properties are marked as DEPRECATED. Use the newly-introduced fills and fillStyleId properties instead. We made this change to be consistent with other types of nodes that also use the fills properties. We may remove the property entirely in a new version so you should not use it. In the meantime, backgrounds and backgroundStyleId will keep working as an alias for fills and fillStyleId (i.e. they read and write to the same value).

On group nodes, backgrounds and backgroundStyleId are no longer supported, both in the editor and the API. If you have existing frames with a background, you will notice that the backgrounds panel in the properties panel has been changed with a message prompting you to replace it with a fill. Consequently, in the API, writing to the backgrounds and backgroundStyleId properties of a group node will no-op.

On page nodes, backgrounds is not deprecated.

Auto-layout properties

Coming soon!

Version 1, Update 7

November 26, 2019

(Also included: update 6)

New:

  • We updated the typings and replaced instances of | symbol with PluginAPI['mixed'] for all properties that can return the special figma.mixed value. This new syntax also fixes the problem where TypeScript's control flow analysis was not able to understand if (node.prop !== figma.mixed) and narrow down the type.
  • We added "Use Developer VM" option in the plugin developer menu that gives plugin code access to the browser's debugger during development. Read more.
  • We fixed a bug where the selectionchanged event could sometimes fire multiple times when the selection changed.

Proposed API (how do they work?):

  • We decided not to go forward with the optional position option in figma.showUI(). Instead, plugins now always remember their last opened position by default.
  • Most prototyping properties are now available, read-only, under the proposed flag! Read more about these new properties. As always, let the Figma team know if these properties are working for you.

Version 1, Update 5

October 24, 2019

New:

  • The figma.ui.on('message'), figma.on('selectionchange') and figma.on('currentpagechange') APIs, which were previously proposed APIs can now be used in published plugins.
  • A new figma.on('close') API for allowing you to run shutdown actions when the plugin closes.

Proposed API (how do they work?):

  • An optional position option in figma.showUI() with possible values 'default' | 'last' | 'auto'
Next →