Git Product home page Git Product logo

figma-plugins's Introduction

Figma Plugins Figma Plugins build

Monorepo for my Figma plugins

Name Description
Clean Document Automagically organize and clean up your Figma document
Component Utilities Copy and create components, and replace layers with components
Distribute Layers Distribute layers in a given direction and offset
Draw Mask Under Selection Draw a mask under the selection
Draw Slice Over Selection Draw a slice over the selection
Flatten Selection to Bitmap Rasterize layers at a high resolution
Format Currency Format and convert between currencies
Insert Big Image Insert and retain the original resolution of big images
Language Tester Test your UI in different languages
Move Layers Precisely move layers
Organize Layers Organize layers on the page
Select Layers Select layers based on name, type, or similarity
Set Layer Size Precisely set the size of layers, while ignoring constraints
Sort Layers Sort layers by name or position
Text Utilities Split, normalize, and bulk copy and paste text layers

Unpublished

See also

License

MIT

figma-plugins's People

Contributors

yuanqing avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

figma-plugins's Issues

Insert Big Image: Allow inserting an image by URL

I did not found where to mention this so decided to send an email.

I find your plugin "Insert Big Image" very awesome and helpful, and thank you for that. Just came up with an idea of how it can be even cooler. Would be great to have an option to import the picture via URL.

Hope you add this feature one day.

Organize Layers: Add option to group horizontally

Thank you for the super helpful tool! I think it would be incredibly helpful to have an option to sort groups in a top->bottom, left->right order, as it would be more natural for reading screen progressions:
desired behavior

This is in contrast to the current design which only allows for left->right, top->bottom organization:
current behavior

can not use enablePrivatePluginApi property in manifest.json

enablePrivatePluginApi?: boolean
This enables API that's specific to private plugins. Setting this will also enable local plugins to work with these APIs during development.

how can I use this property ?
is there a way to skip the generate of manifest.json when run build?

thx

Sort Layers: Improve logic for numbered frame names

Currently if I name my frames with a prepended number like 1 Home , 2 About, and the order becomes incorrect at double digits. So once I get to 10 What We Do it places it after 1 Home when the plugin runs.

This could be solved with some additional logic to determine if the first few characters are integers and then doing some comparison logic.

Great plugin and thanks for you work on it!

Migrate plugins to TypeScript

  • Clean Document
  • Component Utilities
  • Distribute Layers
  • Draw Mask Under Selection
  • Draw Slice Over Selection
  • Flatten Selection to Bitmap
  • Format Currency
  • Insert Big Image
  • Language Tester
  • Move Layers
  • Organize Layers
  • Select Layers
  • Set Layer Size
  • Sort Layers

Flatten Selection to Bitmap: Plugin quietly crashes if there is Component inside of the Selection

I encountered this issue while working on a project with design work made by someone else.
I was trying to raster a bunch of things and I noticed that Figma was crashing all the time when running the plugin.

After isolating the Frame that was causing the crash, I noticed that the designer who was working on the project before, left a Component placed inside of the design composition, maybe by accident.

Once I removed the component from the Frame I was able to get the Flatten Selection to Bitmap to run as expected.

Would it be possible to try to create a condition to prevent the plugin from crashing?

  • Transversing the selection to see if there is any Components within seems like an expensive task
  • Maybe gracefully crashing with a prompt that inform the designer that check the selection for any unsupported nodes.

Shortcuts for sub-menu items

In OSX Settings>Keyboard>App Shortcuts there is an option to set custom keyboard shortcuts. I tried to set for a sub-menu items, but this is not working. Anyone can help me out with this?

Screenshot 2023-08-26 at 10 25 48

[Flatten Selection to Bitmap] Scale not accurate with out-of-selection effects

If the selection contains effects like "Drop Shadow", outside stroke, etc. This plugin will resize bitmap to the exact height/width to Figma's dimensions, and will hence 'scale down' the bitmap a little bit.

Don't know if there are any workarounds in Figma API, but hopefully the plug in can solve this one day.

Organize Layers: Set maximum number of items per column

I love this plugin and use it regularly. But when you have a lot of items in one category, the layout get's a little out of hands (see attachment).

Would you consider, adding a "number of items per row" option to the plugin? After a certain number of items the plugin "wraps" placement again to the top and moves over to the right, starting a new column for the same category.

This would help to keep the layout compact and easier to navigate.

Thanks for your efforts and best regards
8-)

Bildschirmfoto 2020-12-18 um 19 40 54

Move Layers: Run the plugin with the last-used value(s) without showing the plugin UI

https://github.com/yuanqing/figma-plugins/tree/main/packages/figma-move-layers

Hi there, I am wondering whether it would be not too much effort to add shortcuts to run the latest entered values for horizontal and vertical „latest hor“ „latest vert“. So it would be possible to run the plugin without opening the interface ... actually like the nudge settings in figma ... just it would be a Third Nudge Value.

Thanks in advance!

Data security question

I’m a Figma admin from a software company where we’re seeking security approval for a list of plugins, which includes Select Layers. The InfoSec Team needs to understand the flow of data for the plugins. Does the data processed by your plugin leave the Figma cloud at all?

希望能固定一个插件的小页面在旁边

在工作中整理文件的时候,会有很多的图标需要替换成instrance,希望再点击插件之后能有个固定的插件页面在旁边可以供我不停地替换组件,而不是每次选中一个东西,再去插件库里找到插件,这样会比较繁琐,希望大神能改进一下,谢谢了

Sorting layers doesn't take into account the shadow

Sorting layers shouldn't swap layers if one is overlapping another, and it doesn't, however - if there's a layer with a shadow that is below another layer, they will be swapped anyways.

I'm not sure if my description is clear enough so here's an example:

Before sorting
obraz

After sorting
obraz

Insert Big Image: Many images won't load / image thumbnails won't show up in Figma design canvas

Hey there,

I am using the "Insert Big Image" plugin on a regular basis and it really helps to avoid Figmas native downsizing when images exceed 4096px. So firstly, thank you for creating this useful plugin! :)
Since roughly one week I was experiencing the following issues. When I imported ~100 images to the Figma design file and reloaded / reopened the file, many images won't simply show up again. Even after waiting quite a while (of course loading times increase with many imported images and many layers). The image layers simply stay invisible but can be individually and manually triggered with hiding and showing the image fill of the layer.

I already contacted Figma support and this they could improve the behavior by running repair tools. This is their response:

[...] it seems that an issue may have occurred with thumbnails not being stored as expected for these images. This may sometimes occur if a third party plugin has previously manipulated the images.

For your reference, we have seen cases of users reporting this type of issue with other plugins that also downsize or manipulate images. However, as most plugins are developed and maintained by our community our team is unfortunately not equipped to troubleshoot or resolve what change a plugin may be making to cause images to end up in this state.

Any ideas and insights on how to resolve this issue? Maybe there's a compatibility issue here on Figma's end since the plugin did not update since 1 year. Looking forward for any solutions as I'd really like to continue using this plugin.

Thanks!

Enable TypeScript strict mode

  • Clean Document
  • Component Utilities
  • Distribute Layers
  • Draw Mask Under Selection
  • Draw Slice Over Selection
  • Flatten Selection to Bitmap
  • Format Currency
  • Insert Big Image
  • Language Tester
  • Move Layers
  • Organize Layers
  • Select Layers
  • Set Layer Size
  • Sort Layers

邀请「yuanqing」先生入驻 MasterGo 开放平台

yuanqing,你好!我是 MasterGo 的PM 山渐青。MasterGo 是一款国产多人实时协同的在线产品设计工具,目前对外提供开放能力,希望可以和你沟通交流一下,邀请加入 MasterGo 开放平台。
我的微信号:shanjianqing-swq

Component Utilities: "Replace with component" is difficult to use with variants

Hi,
I use this plugin every day but when you want to replace something with a component that has variants, the plugin does not show the component-name anymore but only the name of the variants – which can be very confusing because components often share variants-names.

In the screenshot, I tried to replace a rectangle with a button, but there are several buttons with shared properties. Maybe the plugin could show the name of the variants-group instead? Once it is replaced, I can select the right variant in the inspector.

Bildschirmfoto 2021-11-09 um 16 44 48

Thanks in advance and have a great day.

Organize Layers: Group layers with dot or underscore together with others

It would be great if components that are hidden from the global library are grouped together with the ones that are not. For example, If I have the following components:

.Card / Master
Card / Default
Card / Error
Card / Hover

Right now .Card / Master is organized in a different column there than the rest. It'll be great if the plugin can recognize this and place them at the top of the Card component stack.

[Proposal] Adding default issues with custom templates

Hey @yuanqing here is an unsolicited proposal regarding Figma Comments and Github Issues.

My assumption is that with the addition of Figma Comments inside the Figma Community content views [for instance, the Figma Plugin view] there is going to be an increase of feedback about plugin performance and issues. Subsequently, a lower increase in the issues created (or lower quality feedback within the issues).

I can't imagine how difficult might be to manage this, as an open source project with a significant usage.

So, I was thinking about helping funnel this type of feedback and lowering the friction for designers to contribute with better, more actionable feedback.

Github provides tons of flexibility to create a template that could satisfy your needs in terms of having a comprehensive feedback and use cases. Source: About automation for issues and pull requests with query parameters.

So, the plan:

  • Adding a set of custom template issues [maybe even one for each plugin].
  • Each custom template can be triggered from the Readme.md with a deep-link to a custom template, but also can pre-populate title and label.

This might help connect users's feedback from the new Figma Plugin Comment area with this monorepo in a way that can be more conducive to the sustainability of this project.

I'll be more than happy to help putting an initial proposal. I will need to ask you some questions, tho.

build error

I'm unable to build from a fresh clone under node v16.13.0.

figma-format-currency: $ node --loader ts-node/esm scripts/generate-currencies-ts.ts > src/utilities/data/currencies.ts && eslint --fix src/utilities/data/currencies.ts
figma-format-currency: (node:36270) ExperimentalWarning: --experimental-loader is an experimental feature. This feature could change at any time
figma-format-currency: (Use `node --trace-warnings ...` to show where the warning was created)
figma-format-currency: TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /Users/jsantangelo/Source/figma-plugins/packages/figma-format-currency/scripts/generate-currencies-ts.ts
figma-format-currency:     at new NodeError (node:internal/errors:371:5)
figma-format-currency:     at Object.file: (node:internal/modules/esm/get_format:72:15)
figma-format-currency:     at defaultGetFormat (node:internal/modules/esm/get_format:85:38)
figma-format-currency:     at defaultLoad (node:internal/modules/esm/load:13:42)
figma-format-currency:     at ESMLoader.load (node:internal/modules/esm/loader:303:26)
figma-format-currency:     at ESMLoader.moduleProvider (node:internal/modules/esm/loader:230:58)
figma-format-currency:     at new ModuleJob (node:internal/modules/esm/module_job:63:26)
figma-format-currency:     at ESMLoader.getModuleJob (node:internal/modules/esm/loader:244:11)
figma-format-currency:     at async Promise.all (index 0)
figma-format-currency:     at async ESMLoader.import (node:internal/modules/esm/loader:281:24) {
figma-format-currency:   code: 'ERR_UNKNOWN_FILE_EXTENSION'
figma-format-currency: }
figma-format-currency: error Command failed with exit code 1.
figma-format-currency: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
figma-format-currency: error Command failed with exit code 1.
figma-format-currency: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
lerna ERR! yarn run build exited 1 in 'figma-format-currency'

Clean Document: Deleting layer flexibility

Hey 👋

Apologies for posting a question here. Happy to reach out elsewhere if you prefer. Just point me in the right direction.


My team was looking at using Clean Document for a project and wondering if there's a way to avoid deleting all hidden layers.

The cases where this is most prominent are assets with multiple states that we need to show and hide (some elements will be hidden based on the displayed state). Let me know if there's anything we can do to avoid clearing those all out.

Thanks in advance!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.