Duplicate components without linking to the original

#1

Have you searched the Docs and Knowledge base?
Principle Version: Version 5.10
macOS Version: 10.14.6
Sketch Version:
Description of what you need help with:
How can I duplicate components so that they are not linked to each other? I would like to make multiple copies of the same component so that I can have minor differences in each - but since every instance of a component is linked, any change I make reflects in each one of them.

Any tips would be highly appreciated! :slight_smile:

Screenshots/Sketch File/Principle file: (if applicable)

0 Likes

#2

Copy the component.

Paste it in a new empty document.

Edit whatever you want to edit/change.

Copy it again from such new document.

Paste it in your working document.


I know, it shouldn’t be like this and we should have component overrides and all that, it seems like Principle is falling behind in some basic features, hope they come within the next version.

0 Likes

#3

Awh nice! Such a simple hack. Thanks :slight_smile:

0 Likes

#4

A good thing to have in mind is that if you have a nested component (with some other components inside), if you do this trick and change anything but not the internal nested component, this will remain linked to the others in your original document.

I used this workaround to have multiple buttons with the same design and behaviour but only changing the text label, similar to what an override would do.

So if you have a button which has this structure.

Button Component

  • Text Layer
  • Base Button Component (this is where all the button background effects and states live)

So when you copy this button to a new document, change its text layer and copy back again to your working document, the internal “Base Button Component” will still be linked to all the other buttons that you have with a different text layer, so if you ever want to edit that button style or behaviour, you could edit them all without having to go one by one.

I hope this makes sense!

0 Likes