@central-icons-react-native/square-outlined-radius-0-stroke-1 1.1.291 → 1.1.293

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. package/IconBase44/index.d.ts +4 -0
  2. package/IconBase44/index.js +3 -0
  3. package/IconBase44/index.js.map +11 -0
  4. package/IconBase44/index.mjs +3 -0
  5. package/IconBase44/index.mjs.map +11 -0
  6. package/IconBookHeart/index.d.ts +4 -0
  7. package/IconBookHeart/index.js +3 -0
  8. package/IconBookHeart/index.js.map +11 -0
  9. package/IconBookHeart/index.mjs +3 -0
  10. package/IconBookHeart/index.mjs.map +11 -0
  11. package/IconEmail2Block/index.d.ts +4 -0
  12. package/IconEmail2Block/index.js +3 -0
  13. package/IconEmail2Block/index.js.map +11 -0
  14. package/IconEmail2Block/index.mjs +3 -0
  15. package/IconEmail2Block/index.mjs.map +11 -0
  16. package/IconEmail2Check/index.d.ts +4 -0
  17. package/IconEmail2Check/index.js +3 -0
  18. package/IconEmail2Check/index.js.map +11 -0
  19. package/IconEmail2Check/index.mjs +3 -0
  20. package/IconEmail2Check/index.mjs.map +11 -0
  21. package/IconEmail2Incoming/index.d.ts +4 -0
  22. package/IconEmail2Incoming/index.js +3 -0
  23. package/IconEmail2Incoming/index.js.map +11 -0
  24. package/IconEmail2Incoming/index.mjs +3 -0
  25. package/IconEmail2Incoming/index.mjs.map +11 -0
  26. package/IconEmail2Plus/index.d.ts +4 -0
  27. package/IconEmail2Plus/index.js +3 -0
  28. package/IconEmail2Plus/index.js.map +11 -0
  29. package/IconEmail2Plus/index.mjs +3 -0
  30. package/IconEmail2Plus/index.mjs.map +11 -0
  31. package/IconEmail2Remove/index.d.ts +4 -0
  32. package/IconEmail2Remove/index.js +3 -0
  33. package/IconEmail2Remove/index.js.map +11 -0
  34. package/IconEmail2Remove/index.mjs +3 -0
  35. package/IconEmail2Remove/index.mjs.map +11 -0
  36. package/IconEmail2Unread/index.d.ts +4 -0
  37. package/IconEmail2Unread/index.js +3 -0
  38. package/IconEmail2Unread/index.js.map +11 -0
  39. package/IconEmail2Unread/index.mjs +3 -0
  40. package/IconEmail2Unread/index.mjs.map +11 -0
  41. package/IconSuitcase/index.js +2 -2
  42. package/IconSuitcase/index.js.map +3 -3
  43. package/IconSuitcase/index.mjs +2 -2
  44. package/IconSuitcase/index.mjs.map +3 -3
  45. package/IconTodoist/index.d.ts +4 -0
  46. package/IconTodoist/index.js +3 -0
  47. package/IconTodoist/index.js.map +11 -0
  48. package/IconTodoist/index.mjs +3 -0
  49. package/IconTodoist/index.mjs.map +11 -0
  50. package/README.md +30 -0
  51. package/filtered-icons.json +1 -1
  52. package/icons/index.d.ts +1 -1
  53. package/icons/index.js +2 -2
  54. package/icons/index.js.map +3 -3
  55. package/icons/index.mjs +2 -2
  56. package/icons/index.mjs.map +3 -3
  57. package/icons-index.json +4 -4
  58. package/index.d.ts +9 -0
  59. package/index.js +27 -0
  60. package/index.mjs +9 -0
  61. package/license-check.js +1 -1
  62. package/package.json +1 -1
  63. package/skills/central-icons-react-native/SKILL.md +20 -2
package/README.md CHANGED
@@ -8,6 +8,7 @@ A collection of square outlined React icons with 0px radius and 1px stroke width
8
8
  - [Installation](#installation)
9
9
  - [Requirements](#requirements)
10
10
  - [Usage](#usage)
11
+ - [Using Transparent Colors](#using-transparent-colors)
11
12
  - [Icon Properties](#icon-properties)
12
13
  - [Accessibility](#accessibility)
13
14
  - [Available Packages](#available-packages)
@@ -95,6 +96,22 @@ function MyComponent() {
95
96
  }
96
97
  ```
97
98
 
99
+ ## Using transparent colors
100
+
101
+ Each icon is drawn from several overlapping shapes — strokes and fills — all painted with the current color. If that color already carries transparency (an alpha channel), every shape is drawn semi-transparent, so the places where shapes overlap get painted twice and look darker than the rest of the icon.
102
+
103
+ To apply a see-through color evenly, keep the color solid and set the transparency with `opacity` instead. `opacity` fades the whole icon as a single layer, so overlaps no longer stack:
104
+
105
+ ```jsx
106
+ // ❌ overlaps look darker — the color carries transparency
107
+ <IconHome color="rgba(0, 0, 0, 0.5)" />
108
+
109
+ // ✅ uniform — solid color, transparency applied with opacity
110
+ <IconHome color="black" opacity={0.5} />
111
+ ```
112
+
113
+ React Native has no `currentColor`/CSS cascade, so apply the same idea with props: pass a solid `color` and set `opacity` on the icon. With NativeWind, use the `opacity-50` class rather than a color that carries an alpha channel.
114
+
98
115
  ## Icon Properties
99
116
 
100
117
  All icons accept the following properties:
@@ -588,6 +605,13 @@ Below is a complete list of available icons:
588
605
  - IconChatBubble7
589
606
  - IconChatBubbles
590
607
  - IconMailbox
608
+ - IconEmail2Plus
609
+ - IconEmail2Remove
610
+ - IconEmail2Incoming
611
+ - IconEmail2Block
612
+ - IconEmail2Check
613
+ - IconEmail2Unread
614
+ - IconBookHeart
591
615
 
592
616
  ### Crypto
593
617
 
@@ -1855,6 +1879,8 @@ Below is a complete list of available icons:
1855
1879
  - IconAtlassian
1856
1880
  - IconJira
1857
1881
  - IconConfluence
1882
+ - IconTodoist
1883
+ - IconBase44
1858
1884
 
1859
1885
  ### Sound & Music
1860
1886
 
@@ -2362,3 +2388,7 @@ Common issues and solutions:
2362
2388
  3. **Bundle size concerns**
2363
2389
  - Use specific imports instead of the main entry point
2364
2390
  - Use a build tool supporting tree shaking
2391
+
2392
+ 4. **Icons look darker where lines overlap**
2393
+
2394
+ - You're likely using a semi-transparent `color` (one with an alpha channel). Keep the color solid and apply transparency with `opacity` instead — see [Using transparent colors](#using-transparent-colors).