Remove master component and detach all its instances

Share an idea
1

When cleaning up Figma files we tend to remove old master components to keep things neat.

Right now - each time we want to get rid of a master component we are:

  1. marking it with some really vivid and distinguishable color as its fill,
  2. going over whole document to make sure it is not used anywhere,
  3. remove master component

There are some cases where basically we don’t really need to go over every screen to check where component is used however me just want to make sure that we got rid of it. While I love the possibility to restore master component when it’s removed by mistake - I think that it might be handy to have an option to remove master component AND detach all its instances (just to be sure that no one would restore it).

11 Likes
2

When updates to components with text in them come out, it wipes out all the custom text! If I restore from an earlier version, screenshot images that are fundamental to the design come back at low resolution making it a multi-step process to restore the text :(. Either do a fiddly re-insert of new screenshots or copy the file, go to an earlier version to access the text and then copy back to the original file. Ugh.
Wish I could at least detach all instances with one command. Currently I select all the frames, command+option+b to detach, enter to go down a level, command+option+b to detach, repeat…
To avoid this, I need to detach all instances in every file.

3

Check out the plugin named ‘Instance finder’ it will help you select all the instances on a page, then you can use Cmd+opt+b to detach them all

or try the plugin called ‘Unused components’… I found it just now, so not sure of drawbacks & limitations

1 Like
4

const detachAll => (node) {
if (node.type === ‘INSTANCE’) {
node = node.detachInstance();
}
if (node.children) {
node.children.forEach(c => detachAll(c));
}
return node;
}

1 Like
5

Hi,
Let me give you some context.

  • I perform most of my work in a “Working” Figma Page in a Project,
  • I tend to end a week with a UX review of the Working Page. Gather Feedback.
  • I duplicate the page I was presenting,
  • I Rename the duplicate with the date, and it becomes a cut, (I don’t want to automate this process).
  • I would like to disconnect all components from the duplicate page I just cut. making it a locked file that will not be changed when I update the components.
  • I have hundreds of elements pointing to my local components and find it difficult to select all when I have components within components.

So I would like to disconnect the duplicate page from the design components. I am not using a library because things are changing.
Anyone have any idea?