Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

"mask-type" is not supported in <mask> element. #1790

Closed
MuthupandiG opened this issue Jun 16, 2022 · 14 comments
Closed

"mask-type" is not supported in <mask> element. #1790

MuthupandiG opened this issue Jun 16, 2022 · 14 comments
Labels
Missing repro This issue need minimum repro scenario

Comments

@MuthupandiG
Copy link

The problem is explained here very well. gregberge/svgr#336

The same should be addressed in this library as well.
@MohammadKurjieh
Copy link

Any updates on this issue?

@MuthupandiG
Copy link
Author

Any updates on this issue?

Seems, they have fixed it in v0.32.0

resvg supports the mask-type attribute as of v0.32.0. linebender/resvg#582

@mdj-goathamster
Copy link

Need this!

@MuthupandiG
Copy link
Author

Upgrade to the version v0.32.0

@mdj-goathamster
Copy link

Upgrade to the version v0.32.0

Im not sure i follow, which library should be updated to v0.32.0?

react-native-svg is currently on 13.11.0 🤷‍♂️

@MuthupandiG
Copy link
Author

Refer this linebender/resvg#582

@mdj-goathamster
Copy link

Refer this RazrFalcon/resvg#582

Maybe i'm silly, but i don't see how that is relevant in this post.

Status is, still, that react-native-svg doesn't support mask-type/maskType, right?

@jm-masteos
Copy link

Up! Still no update on that ?
I'm using svgr/cli to generate my Icons components from .svg files and some of them are genrated with a component with style property. Which is not handled by react-native-svg in the latest version

@SergeyYurkevich SergeyYurkevich mentioned this issue Oct 13, 2023
Merged
4 tasks
@eljonathas
Copy link

Up! Still no update on that ? I'm using svgr/cli to generate my Icons components from .svg files and some of them are genrated with a component with style property. Which is not handled by react-native-svg in the latest version

the same here

@JacobWennebro
Copy link

Having this same issue

@SaadAhmadSaddiqui
Copy link

Facing this issue right now.

@kartikeyvaish
Copy link

Any Updates?

@bohdanprog
Copy link
Member

Hello,
Can someone provide a simple example to reproduce that problem?
Thank you.

@bohdanprog bohdanprog added Missing repro This issue need minimum repro scenario Close when stale This issue is going to be closed when there is no activity for a while labels Jun 19, 2024
jakex7 added a commit that referenced this issue Jul 5, 2024
@SergeyYurkevich @jakex7
feat: implement mask-type property (#2152)
832522d 
# Summary

"mask-type: alpha" is not supported. 
resolve issue: #1790  

## Explanation

svg example:
```
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100" fill="none">
<g clip-path="url(#clip0_8_3)">
<rect width="100" height="100" fill="white"/>
<mask id="mask0_8_3" mask-type="alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="100" height="100">
<circle cx="50" cy="50" r="50" fill="#000000"/>
</mask>
<g mask="url(#mask0_8_3)">
<rect x="-26" y="-78" width="209" height="263" fill="#252E74"/>
</g>
</g>
<defs>
<clipPath id="clip0_8_3">
<rect width="100" height="100" fill="white"/>
</clipPath>
</defs>
</svg>
```

Current behavior: 

![image](https://github.com/software-mansion/react-native-svg/assets/17138397/2dca6f46-fe8f-48f3-80f9-799563911e8b)

Expected behavior:

![image](https://github.com/software-mansion/react-native-svg/assets/17138397/fb49cf0b-d677-491f-8215-9c9b1d69080f)

## Compatibility

| OS      | Implemented |
| ------- | :---------: |
| iOS     |    ✅    |
| Android |    ✅    |

## Checklist

<!-- Check completed item, when applicable, via: [X] -->

- [x] I have tested this on a device and a simulator
- [ ] I added documentation in `README.md`
- [x] I updated the typed files (typescript)
- [ ] I added a test for the API in the `__tests__` folder

---------

Co-authored-by: Sergey <[email protected]>
Co-authored-by: Jakub Grzywacz <[email protected]>
@jakex7 jakex7 removed the Close when stale This issue is going to be closed when there is no activity for a while label Jul 8, 2024
@jakex7
Copy link
Member

jakex7 commented Jul 8, 2024

Hi,
this issue has been resolved in #2152 and will be release in the next version!
Thanks 🚀

@jakex7 jakex7 closed this as completed Jul 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Missing repro This issue need minimum repro scenario
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
10 participants
@eljonathas @SaadAhmadSaddiqui @mdj-goathamster @MuthupandiG @JacobWennebro @jakex7 @kartikeyvaish @bohdanprog @MohammadKurjieh @jm-masteos