Cleanup react components

[lukasoppermann]

Since the react-figma-plugin-ds dependency is broken, I recently "imported" the components that are used in this plugin. However they need to be cleaned up, including the css.

This includes (but is not limited to):

• [ ] Button
• [ ] Checkbox
• [ ] Select
• [ ] Title
• [ ] Input
• [ ] Label
• [ ] Text

[ratnakar5938]

Can I work on this issue???

[lukasoppermann]

Hey @ratnakar5938, sure I would love help with that.

It would be best to do one PR per component.

For any questions, feel free to ask me or send a [WIP] PR with questions / Ideas attached.

[ratnakar5938]

Can u plz explain wt are ur needs

[lukasoppermann]

Sure, so the components are mainly copied from the react-figma-plugin-ds package.

This means there is probably css in there that is never used in the plugin. -> This css should be removed.

Also there may be states in the components that are never used. Those states should be removed as well. This often leads to being able to remove more code from the components.

The goal of this is that the components react code & css (which is within the .tsx file) gets less complex.

Hope that helps.

[ratnakar5938]

can u describe how to start the local server 😬😬😬

[lukasoppermann]

Well, there is no local server. So you need to add it to figma as a plugin first. Afterwards you run "npm start" which builds it.

This may be a bit complicated though. :( sorry. Do you need it to verify?

[ratnakar5938]

I will try if any error comes up I will ask 😬😬

[ratnakar5938]

I installed the plugin in my figma What to do next??

[lukasoppermann]

Hey, I am sorry, I think this does not even work. I thought you could get a dev version to run. But I am not sure that works.

I think you would need to run the react files locally but I am not sure it would work. You'd probably get errors due to specific figma api usage.

I think the only way to do it, is to do it "blind". But it's also fine if that is no fun for you. I understand that this is not a great dev experience. :)

[ratnakar5938]

Actually I am a newbie so working blind will not work for me :( sorry

[lukasoppermann]

Yeah, no worries, makes sense. I removed the two labels, as I realised that it has more complexity to it than I thought. Working on open source is a great idea though. Just find another problem to solve here or in another project. 👍

Cheers & thanks for offering help.

[hayawata3626]

@lukasoppermann I think this issue has already been addressed. Are there any remaining tasks related to this? Mayme this https://github.com/lukasoppermann/design-tokens/pull/163.