Handoff for Code Components

Handoff in Framer just got better. You can now view and copy the properties of any Code Component in the Handoff panel. Developers will be able to see how components are configured, making the transition to production even easier.

Need to know which properties you can override? Clearly see which properties are defined by Property Controls set in your components. Working with tokens from your design system? See all the tokens used in your components right in the Handoff panel. You can also filter out all undefined props with the Used Props setting.

Clicking or hovering over properties in the Handoff panel will give you more information as well. Images and files used in Code Components will be revealed in your Finder or a new tab making all your assets easy to manage. EventHandlers for local custom actions will open the file where the definition of the handler is located.ComponentInstance will highlight the instance on the canvas when hovered. Finally, strings will be displayed in quotes and if displayTextArea is set to true, the value will be wrapped in backticks.