@liner-fe/icon 0.0.36 → 0.0.38

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 (191) hide show
  1. package/.gitignore +2 -1
  2. package/CHANGELOG.md +16 -0
  3. package/assets/add-clock/index.tsx +15 -14
  4. package/assets/add-to-folder/index.tsx +11 -10
  5. package/assets/ai/index.tsx +18 -17
  6. package/assets/airplane/index.tsx +7 -6
  7. package/assets/android/index.tsx +7 -6
  8. package/assets/apple/index.tsx +11 -10
  9. package/assets/arrow-back/index.tsx +7 -6
  10. package/assets/arrow-backward/index.tsx +7 -6
  11. package/assets/arrow-down/index.tsx +7 -6
  12. package/assets/arrow-down-left/index.tsx +7 -6
  13. package/assets/arrow-downward/index.tsx +7 -6
  14. package/assets/arrow-drop-right/index.tsx +7 -6
  15. package/assets/arrow-forward/index.tsx +7 -6
  16. package/assets/arrow-left/index.tsx +7 -6
  17. package/assets/arrow-right/index.tsx +7 -6
  18. package/assets/arrow-turn/index.tsx +7 -6
  19. package/assets/arrow-up/index.tsx +7 -6
  20. package/assets/arrow-up-down/index.tsx +11 -10
  21. package/assets/arrow-up-left/index.tsx +7 -6
  22. package/assets/arrow-up-right/index.tsx +7 -6
  23. package/assets/arrow-upward/index.tsx +7 -6
  24. package/assets/balance/index.tsx +15 -14
  25. package/assets/bell/index.tsx +11 -10
  26. package/assets/block/index.tsx +7 -6
  27. package/assets/bolt/index.tsx +7 -6
  28. package/assets/book/index.tsx +8 -7
  29. package/assets/bookmark/index.tsx +7 -6
  30. package/assets/bookmark-cancel/index.tsx +15 -14
  31. package/assets/books/index.tsx +15 -14
  32. package/assets/brain/index.tsx +8 -7
  33. package/assets/bulb/index.tsx +11 -10
  34. package/assets/bulb-exclamtionmark/index.tsx +19 -18
  35. package/assets/camera/index.tsx +10 -9
  36. package/assets/car/index.tsx +7 -6
  37. package/assets/casual-shoe/index.tsx +7 -6
  38. package/assets/chart-bar/index.tsx +16 -15
  39. package/assets/chart-line-uptrend/index.tsx +9 -8
  40. package/assets/check-mark/index.tsx +7 -6
  41. package/assets/check-mark-fill/index.tsx +11 -10
  42. package/assets/check-mark-in-circle/index.tsx +9 -8
  43. package/assets/chrome/index.tsx +19 -18
  44. package/assets/clock/index.tsx +11 -10
  45. package/assets/close/index.tsx +7 -6
  46. package/assets/close-fill/index.tsx +11 -10
  47. package/assets/color-docx/index.tsx +23 -22
  48. package/assets/color-facebook/index.tsx +3 -2
  49. package/assets/color-fire/index.tsx +3 -2
  50. package/assets/color-google/index.tsx +3 -2
  51. package/assets/color-liner/index.tsx +3 -2
  52. package/assets/color-liner-variation/index.tsx +7 -6
  53. package/assets/color-pdf/index.tsx +19 -18
  54. package/assets/color-txt/index.tsx +19 -18
  55. package/assets/copy/index.tsx +8 -7
  56. package/assets/credit/index.tsx +15 -14
  57. package/assets/creditcard/index.tsx +11 -10
  58. package/assets/dark-mode/index.tsx +7 -6
  59. package/assets/description/index.tsx +16 -15
  60. package/assets/desktop/index.tsx +7 -6
  61. package/assets/desktop-on-cursor/index.tsx +15 -14
  62. package/assets/document/index.tsx +9 -8
  63. package/assets/document-add/index.tsx +13 -12
  64. package/assets/document-check/index.tsx +13 -12
  65. package/assets/document-warning/index.tsx +11 -10
  66. package/assets/double-arrow-backward/index.tsx +11 -10
  67. package/assets/double-arrow-forward/index.tsx +11 -10
  68. package/assets/download/index.tsx +11 -10
  69. package/assets/drop-down/index.tsx +7 -6
  70. package/assets/drop-up/index.tsx +7 -6
  71. package/assets/email/index.tsx +9 -8
  72. package/assets/end/index.tsx +11 -10
  73. package/assets/essay/index.tsx +13 -12
  74. package/assets/exclamationmark/index.tsx +9 -8
  75. package/assets/exclamationmark-fill/index.tsx +15 -14
  76. package/assets/expand/index.tsx +11 -10
  77. package/assets/expand-close/index.tsx +7 -6
  78. package/assets/extend/index.tsx +7 -6
  79. package/assets/facebook/index.tsx +7 -6
  80. package/assets/feedback/index.tsx +11 -10
  81. package/assets/filter/index.tsx +15 -14
  82. package/assets/fire/index.tsx +10 -9
  83. package/assets/flowchart/index.tsx +7 -6
  84. package/assets/focus/index.tsx +11 -10
  85. package/assets/folder/index.tsx +7 -6
  86. package/assets/folder-add/index.tsx +9 -8
  87. package/assets/folder-open/index.tsx +7 -6
  88. package/assets/folder-open-share/index.tsx +15 -14
  89. package/assets/folder-share/index.tsx +15 -14
  90. package/assets/formal-bag/index.tsx +7 -6
  91. package/assets/globe/index.tsx +7 -6
  92. package/assets/google/index.tsx +7 -6
  93. package/assets/google-export/index.tsx +15 -14
  94. package/assets/graduationcap/index.tsx +8 -7
  95. package/assets/help/index.tsx +11 -10
  96. package/assets/hide-all/index.tsx +19 -18
  97. package/assets/highlight-edit/index.tsx +11 -10
  98. package/assets/highlighter/index.tsx +7 -6
  99. package/assets/history/index.tsx +11 -10
  100. package/assets/home/index.tsx +7 -6
  101. package/assets/info/index.tsx +15 -14
  102. package/assets/light/index.tsx +11 -10
  103. package/assets/light-mode/index.tsx +39 -38
  104. package/assets/liner/index.tsx +11 -10
  105. package/assets/link/index.tsx +11 -10
  106. package/assets/list/index.tsx +27 -26
  107. package/assets/literature-review/index.tsx +23 -22
  108. package/assets/lock/index.tsx +11 -10
  109. package/assets/magic-pencil/index.tsx +23 -22
  110. package/assets/magic-wand/index.tsx +19 -18
  111. package/assets/make-easy/index.tsx +23 -22
  112. package/assets/members/index.tsx +19 -18
  113. package/assets/memo/index.tsx +11 -10
  114. package/assets/menu/index.tsx +15 -14
  115. package/assets/microscope/index.tsx +7 -6
  116. package/assets/mindmap/index.tsx +7 -6
  117. package/assets/minus/index.tsx +7 -6
  118. package/assets/mobile/index.tsx +11 -10
  119. package/assets/more/index.tsx +15 -14
  120. package/assets/more-horizontal/index.tsx +15 -14
  121. package/assets/more-vertical/index.tsx +15 -14
  122. package/assets/move/index.tsx +7 -6
  123. package/assets/move-to-folder/index.tsx +11 -10
  124. package/assets/new-chrome-extension/index.tsx +7 -6
  125. package/assets/new-tab/index.tsx +11 -10
  126. package/assets/new-thread/index.tsx +9 -8
  127. package/assets/new-thread-folder/index.tsx +15 -14
  128. package/assets/palette/index.tsx +23 -22
  129. package/assets/paperclip/index.tsx +7 -6
  130. package/assets/paragraph/index.tsx +19 -18
  131. package/assets/paraphrase/index.tsx +19 -18
  132. package/assets/pencil/index.tsx +8 -7
  133. package/assets/person/index.tsx +11 -10
  134. package/assets/person-add/index.tsx +15 -14
  135. package/assets/person-fill/index.tsx +15 -14
  136. package/assets/photo/index.tsx +10 -9
  137. package/assets/play-button/index.tsx +10 -9
  138. package/assets/plus/index.tsx +7 -6
  139. package/assets/power/index.tsx +11 -10
  140. package/assets/question-box/index.tsx +11 -10
  141. package/assets/question-message/index.tsx +11 -10
  142. package/assets/quote/index.tsx +11 -10
  143. package/assets/redo/index.tsx +7 -6
  144. package/assets/regenerate/index.tsx +11 -10
  145. package/assets/remove-from-folder/index.tsx +11 -10
  146. package/assets/report/index.tsx +11 -10
  147. package/assets/restaurant/index.tsx +15 -14
  148. package/assets/retry/index.tsx +7 -6
  149. package/assets/rocket/index.tsx +11 -10
  150. package/assets/search/index.tsx +7 -6
  151. package/assets/secret-mode/index.tsx +11 -10
  152. package/assets/send/index.tsx +7 -6
  153. package/assets/setting/index.tsx +11 -10
  154. package/assets/share/index.tsx +11 -10
  155. package/assets/sheet-export/index.tsx +11 -10
  156. package/assets/shield/index.tsx +9 -8
  157. package/assets/shield-person/index.tsx +15 -14
  158. package/assets/shield-usage/index.tsx +23 -22
  159. package/assets/shorten/index.tsx +11 -10
  160. package/assets/show-all/index.tsx +19 -18
  161. package/assets/sign-out/index.tsx +11 -10
  162. package/assets/source/index.tsx +19 -18
  163. package/assets/speaker/index.tsx +11 -10
  164. package/assets/spinner/index.tsx +3 -2
  165. package/assets/stack/index.tsx +15 -14
  166. package/assets/star/index.tsx +7 -6
  167. package/assets/start/index.tsx +11 -10
  168. package/assets/step/index.tsx +11 -10
  169. package/assets/stop/index.tsx +11 -10
  170. package/assets/summarize/index.tsx +16 -15
  171. package/assets/target/index.tsx +15 -14
  172. package/assets/teams/index.tsx +14 -13
  173. package/assets/text-select/index.tsx +11 -10
  174. package/assets/thumb-down/index.tsx +9 -8
  175. package/assets/thumb-up/index.tsx +9 -8
  176. package/assets/timer/index.tsx +15 -14
  177. package/assets/translate/index.tsx +11 -10
  178. package/assets/trash/index.tsx +13 -12
  179. package/assets/tune/index.tsx +27 -26
  180. package/assets/twitter/index.tsx +7 -6
  181. package/assets/undo/index.tsx +7 -6
  182. package/assets/verification-badge/index.tsx +7 -6
  183. package/assets/view-list/index.tsx +7 -6
  184. package/assets/visibility/index.tsx +11 -10
  185. package/assets/visibility-off/index.tsx +23 -22
  186. package/assets/volume/index.tsx +7 -6
  187. package/assets/volume-up/index.tsx +15 -14
  188. package/assets/zoom-in/index.tsx +11 -10
  189. package/assets/zoom-out/index.tsx +11 -10
  190. package/index.tsx +8 -3
  191. package/package.json +1 -1
@@ -6,34 +6,35 @@ interface LinerProps {
6
6
  thick?: boolean;
7
7
  className?: string;
8
8
  size?: number
9
- color?: BasicColorType;
9
+ type?: BasicColorType;
10
+ fillType?: BasicColorType;
10
11
  }
11
12
 
12
13
  export const Liner = forwardRef<SVGSVGElement, LinerProps>(
13
- ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary', className, ...props }, ref) => {
14
+ ({ fill = false, thick = false, size = 24, type = 'neutral-label-primary', className, ...props }, ref) => {
14
15
  if (fill && thick) {
15
16
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
16
- <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--${color})` }}/>
17
- <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--${color})` }}/>
17
+ <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--type)` }}/>
18
+ <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--type)` }}/>
18
19
  </svg>
19
20
  ;
20
21
  } else if (fill) {
21
22
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
22
- <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--${color})` }}/>
23
- <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--${color})` }}/>
23
+ <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--type)` }}/>
24
+ <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--type)` }}/>
24
25
  </svg>
25
26
  ;
26
27
  } else if (thick) {
27
28
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
28
- <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--${color})` }}/>
29
- <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--${color})` }}/>
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--type)` }}/>
30
+ <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--type)` }}/>
30
31
  </svg>
31
32
  ;
32
33
  }
33
34
 
34
35
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
35
- <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--${color})` }}/>
36
- <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--${color})` }}/>
36
+ <path fillRule="evenodd" clipRule="evenodd" d="M26.9523 6.58093C27.6483 5.88485 28.5774 5.5 29.5616 5.5H38.8094C40.8435 5.5 42.4996 7.15609 42.4996 9.19026V18.4436C42.4996 19.4155 42.1101 20.3615 41.4187 21.0529L35.0383 27.4332V37.5254C35.0383 38.5096 34.6535 39.4386 33.9574 40.1347L29.8327 44.2594L29.829 44.2632C29.1265 44.9728 28.1958 45.3528 27.233 45.3528C26.7527 45.3528 26.2712 45.2582 25.8102 45.0684L25.8004 45.0644C24.4191 44.4842 23.5317 43.1682 23.5317 41.657V36.0884H15.8337C13.6723 36.0884 11.9167 34.3328 11.9167 32.1714V24.4734H6.34813C4.84776 24.4734 3.51381 23.6004 2.93621 22.1936C2.36349 20.8044 2.6749 19.2433 3.7388 18.1794L7.87043 14.0477C8.56651 13.3517 9.49559 12.9668 10.4798 12.9668H20.5664L26.9523 6.58093ZM29.5616 8.5C29.3732 8.5 29.2071 8.56869 29.0736 8.70225L22.5858 15.1901C22.0925 15.6833 21.4249 15.9668 20.712 15.9668H10.4798C10.2914 15.9668 10.1253 16.0355 9.99175 16.1691L5.86012 20.3007C5.65272 20.5081 5.59874 20.7816 5.71004 21.0509L5.71138 21.0541C5.81961 21.3177 6.0454 21.4734 6.34813 21.4734H12.2663C13.7205 21.4734 14.9167 22.6547 14.9167 24.1239V32.1714C14.9167 32.676 15.3292 33.0884 15.8337 33.0884H23.8813C25.3355 33.0884 26.5317 34.2697 26.5317 35.7389V41.657C26.5317 41.9473 26.6824 42.1789 26.9573 42.2963C27.0585 42.3373 27.1506 42.3528 27.233 42.3528C27.3969 42.3528 27.5597 42.2917 27.6976 42.152L27.7044 42.145L31.8361 38.0134C31.9697 37.8798 32.0383 37.7138 32.0383 37.5254V27.2046C32.0383 26.5753 32.2783 25.9506 32.7487 25.4802L39.2974 18.9316C39.4246 18.8044 39.4996 18.6221 39.4996 18.4436V9.19026C39.4996 8.81293 39.1867 8.5 38.8094 8.5H29.5616Z" style={{ fill: `var(--type)` }}/>
37
+ <path fillRule="evenodd" clipRule="evenodd" d="M24.6174 18.929V23.4755H29.1781V18.929H24.6174ZM21.6174 18.2307C21.6174 16.9568 22.653 15.929 23.9226 15.929H29.8729C31.134 15.929 32.1781 16.9521 32.1781 18.2307V24.1699C32.1781 25.4344 31.152 26.4755 29.8729 26.4755H23.9226C22.6568 26.4755 21.6174 25.4477 21.6174 24.1699V18.2307Z" style={{ fill: `var(--type)` }}/>
37
38
  </svg>
38
39
  ;
39
40
  }
@@ -6,34 +6,35 @@ interface LinkProps {
6
6
  thick?: boolean;
7
7
  className?: string;
8
8
  size?: number
9
- color?: BasicColorType;
9
+ type?: BasicColorType;
10
+ fillType?: BasicColorType;
10
11
  }
11
12
 
12
13
  export const Link = forwardRef<SVGSVGElement, LinkProps>(
13
- ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary', className, ...props }, ref) => {
14
+ ({ fill = false, thick = false, size = 24, type = 'neutral-label-primary', className, ...props }, ref) => {
14
15
  if (fill && thick) {
15
16
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
16
- <path d="M39.6433 8.79387L39.642 8.79251L39.5881 8.739C39.5559 8.70588 39.5234 8.67293 39.4906 8.64016L39.4892 8.6388L39.487 8.64099C35.753 5.06987 29.8307 5.12037 26.1586 8.7925L20.8505 14.1006C22.2542 13.8355 23.6976 13.8325 25.1023 14.0915L28.2799 10.9138C30.8114 8.38233 34.9032 8.36222 37.4595 10.8535C39.9207 13.4117 39.8906 17.4809 37.3693 20.0022L29.9026 27.4687C29.4816 27.8897 29.0175 28.2413 28.5244 28.5233C26.0526 29.9373 22.8541 29.6061 20.723 27.5293C19.5373 26.2967 18.9298 24.7135 18.9005 23.1216L16.2955 25.7267C16.7132 27.1318 17.4616 28.4596 18.5404 29.5876L18.5392 29.5889L18.5406 29.5902L18.5945 29.6438C18.6267 29.6769 18.6592 29.7098 18.6919 29.7426L18.6933 29.7439L18.6955 29.7417C22.4295 33.3129 28.3518 33.2623 32.024 29.5902L39.4906 22.1236C43.1627 18.4514 43.2132 12.5291 39.6421 8.79509L39.6433 8.79387Z" style={{ fill: `var(--${color})` }}/>
17
- <path d="M10.9138 28.2799C8.3925 30.8012 8.36242 34.8704 10.8236 37.4287C13.3799 39.9198 17.4717 39.8997 20.0031 37.3682L23.1807 34.1906C24.5854 34.4495 26.0288 34.4465 27.4325 34.1815L22.1244 39.4895C18.4523 43.1616 12.5301 43.2122 8.79607 39.6411L8.79387 39.6433L8.7925 39.642C8.75973 39.6092 8.72724 39.5763 8.69505 39.5431C8.67699 39.5253 8.65899 39.5075 8.64104 39.4895L8.63967 39.4882L8.64089 39.4869C5.06987 35.7529 5.12041 29.8307 8.79251 26.1586L16.2592 18.6919C19.9313 15.0198 25.8535 14.9693 29.5875 18.5403L29.5897 18.5381L29.5911 18.5395C29.6238 18.5722 29.6563 18.6052 29.6885 18.6383C29.7066 18.6561 29.7246 18.674 29.7426 18.6919L29.7439 18.6933L29.7427 18.6945C30.8215 19.8225 31.5698 21.1503 31.9875 22.5554L29.3825 25.1604C29.3532 23.5685 28.7458 21.9853 27.56 20.7528C25.4288 18.6759 22.2304 18.3445 19.7586 19.7586C19.7587 19.7586 19.7586 19.7587 19.7586 19.7586C19.3272 20.0055 18.9179 20.3055 18.5403 20.6587C18.4931 20.7028 18.4464 20.7478 18.4002 20.7936C18.3936 20.8002 18.387 20.8067 18.3805 20.8132" style={{ fill: `var(--${color})` }}/>
17
+ <path d="M39.6433 8.79387L39.642 8.79251L39.5881 8.739C39.5559 8.70588 39.5234 8.67293 39.4906 8.64016L39.4892 8.6388L39.487 8.64099C35.753 5.06987 29.8307 5.12037 26.1586 8.7925L20.8505 14.1006C22.2542 13.8355 23.6976 13.8325 25.1023 14.0915L28.2799 10.9138C30.8114 8.38233 34.9032 8.36222 37.4595 10.8535C39.9207 13.4117 39.8906 17.4809 37.3693 20.0022L29.9026 27.4687C29.4816 27.8897 29.0175 28.2413 28.5244 28.5233C26.0526 29.9373 22.8541 29.6061 20.723 27.5293C19.5373 26.2967 18.9298 24.7135 18.9005 23.1216L16.2955 25.7267C16.7132 27.1318 17.4616 28.4596 18.5404 29.5876L18.5392 29.5889L18.5406 29.5902L18.5945 29.6438C18.6267 29.6769 18.6592 29.7098 18.6919 29.7426L18.6933 29.7439L18.6955 29.7417C22.4295 33.3129 28.3518 33.2623 32.024 29.5902L39.4906 22.1236C43.1627 18.4514 43.2132 12.5291 39.6421 8.79509L39.6433 8.79387Z" style={{ fill: `var(--type)` }}/>
18
+ <path d="M10.9138 28.2799C8.3925 30.8012 8.36242 34.8704 10.8236 37.4287C13.3799 39.9198 17.4717 39.8997 20.0031 37.3682L23.1807 34.1906C24.5854 34.4495 26.0288 34.4465 27.4325 34.1815L22.1244 39.4895C18.4523 43.1616 12.5301 43.2122 8.79607 39.6411L8.79387 39.6433L8.7925 39.642C8.75973 39.6092 8.72724 39.5763 8.69505 39.5431C8.67699 39.5253 8.65899 39.5075 8.64104 39.4895L8.63967 39.4882L8.64089 39.4869C5.06987 35.7529 5.12041 29.8307 8.79251 26.1586L16.2592 18.6919C19.9313 15.0198 25.8535 14.9693 29.5875 18.5403L29.5897 18.5381L29.5911 18.5395C29.6238 18.5722 29.6563 18.6052 29.6885 18.6383C29.7066 18.6561 29.7246 18.674 29.7426 18.6919L29.7439 18.6933L29.7427 18.6945C30.8215 19.8225 31.5698 21.1503 31.9875 22.5554L29.3825 25.1604C29.3532 23.5685 28.7458 21.9853 27.56 20.7528C25.4288 18.6759 22.2304 18.3445 19.7586 19.7586C19.7587 19.7586 19.7586 19.7587 19.7586 19.7586C19.3272 20.0055 18.9179 20.3055 18.5403 20.6587C18.4931 20.7028 18.4464 20.7478 18.4002 20.7936C18.3936 20.8002 18.387 20.8067 18.3805 20.8132" style={{ fill: `var(--type)` }}/>
18
19
  </svg>
19
20
  ;
20
21
  } else if (fill) {
21
22
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
22
- <path d="M39.6433 8.79387L39.642 8.79251L39.5881 8.739C39.5559 8.70588 39.5234 8.67293 39.4906 8.64016L39.4892 8.6388L39.487 8.64099C35.753 5.06987 29.8307 5.12037 26.1586 8.7925L20.8505 14.1006C22.2542 13.8355 23.6976 13.8325 25.1023 14.0915L28.2799 10.9138C30.8114 8.38233 34.9032 8.36222 37.4595 10.8535C39.9207 13.4117 39.8906 17.4809 37.3693 20.0022L29.9026 27.4687C29.4816 27.8897 29.0175 28.2413 28.5244 28.5233C26.0526 29.9373 22.8541 29.6061 20.723 27.5293C19.5373 26.2967 18.9298 24.7135 18.9005 23.1216L16.2955 25.7267C16.7132 27.1318 17.4616 28.4596 18.5404 29.5876L18.5392 29.5889L18.5406 29.5902L18.5945 29.6438C18.6267 29.6769 18.6592 29.7098 18.6919 29.7426L18.6933 29.7439L18.6955 29.7417C22.4295 33.3129 28.3518 33.2623 32.024 29.5902L39.4906 22.1236C43.1627 18.4514 43.2132 12.5291 39.6421 8.79509L39.6433 8.79387Z" style={{ fill: `var(--${color})` }}/>
23
- <path d="M10.9138 28.2799C8.3925 30.8012 8.36242 34.8704 10.8236 37.4287C13.3799 39.9198 17.4717 39.8997 20.0031 37.3682L23.1807 34.1906C24.5854 34.4495 26.0288 34.4465 27.4325 34.1815L22.1244 39.4895C18.4523 43.1616 12.5301 43.2122 8.79607 39.6411L8.79387 39.6433L8.7925 39.642C8.75973 39.6092 8.72724 39.5763 8.69505 39.5431C8.67699 39.5253 8.65899 39.5075 8.64104 39.4895L8.63967 39.4882L8.64089 39.4869C5.06987 35.7529 5.12041 29.8307 8.79251 26.1586L16.2592 18.6919C19.9313 15.0198 25.8535 14.9693 29.5875 18.5403L29.5897 18.5381L29.5911 18.5395C29.6238 18.5722 29.6563 18.6052 29.6885 18.6383C29.7066 18.6561 29.7246 18.674 29.7426 18.6919L29.7439 18.6933L29.7427 18.6945C30.8215 19.8225 31.5698 21.1503 31.9875 22.5554L29.3825 25.1604C29.3532 23.5685 28.7458 21.9853 27.56 20.7528C25.4288 18.6759 22.2304 18.3445 19.7586 19.7586C19.7587 19.7586 19.7586 19.7587 19.7586 19.7586C19.3272 20.0055 18.9179 20.3055 18.5403 20.6587C18.4931 20.7028 18.4464 20.7478 18.4002 20.7936C18.3936 20.8002 18.387 20.8067 18.3805 20.8132" style={{ fill: `var(--${color})` }}/>
23
+ <path d="M39.6433 8.79387L39.642 8.79251L39.5881 8.739C39.5559 8.70588 39.5234 8.67293 39.4906 8.64016L39.4892 8.6388L39.487 8.64099C35.753 5.06987 29.8307 5.12037 26.1586 8.7925L20.8505 14.1006C22.2542 13.8355 23.6976 13.8325 25.1023 14.0915L28.2799 10.9138C30.8114 8.38233 34.9032 8.36222 37.4595 10.8535C39.9207 13.4117 39.8906 17.4809 37.3693 20.0022L29.9026 27.4687C29.4816 27.8897 29.0175 28.2413 28.5244 28.5233C26.0526 29.9373 22.8541 29.6061 20.723 27.5293C19.5373 26.2967 18.9298 24.7135 18.9005 23.1216L16.2955 25.7267C16.7132 27.1318 17.4616 28.4596 18.5404 29.5876L18.5392 29.5889L18.5406 29.5902L18.5945 29.6438C18.6267 29.6769 18.6592 29.7098 18.6919 29.7426L18.6933 29.7439L18.6955 29.7417C22.4295 33.3129 28.3518 33.2623 32.024 29.5902L39.4906 22.1236C43.1627 18.4514 43.2132 12.5291 39.6421 8.79509L39.6433 8.79387Z" style={{ fill: `var(--type)` }}/>
24
+ <path d="M10.9138 28.2799C8.3925 30.8012 8.36242 34.8704 10.8236 37.4287C13.3799 39.9198 17.4717 39.8997 20.0031 37.3682L23.1807 34.1906C24.5854 34.4495 26.0288 34.4465 27.4325 34.1815L22.1244 39.4895C18.4523 43.1616 12.5301 43.2122 8.79607 39.6411L8.79387 39.6433L8.7925 39.642C8.75973 39.6092 8.72724 39.5763 8.69505 39.5431C8.67699 39.5253 8.65899 39.5075 8.64104 39.4895L8.63967 39.4882L8.64089 39.4869C5.06987 35.7529 5.12041 29.8307 8.79251 26.1586L16.2592 18.6919C19.9313 15.0198 25.8535 14.9693 29.5875 18.5403L29.5897 18.5381L29.5911 18.5395C29.6238 18.5722 29.6563 18.6052 29.6885 18.6383C29.7066 18.6561 29.7246 18.674 29.7426 18.6919L29.7439 18.6933L29.7427 18.6945C30.8215 19.8225 31.5698 21.1503 31.9875 22.5554L29.3825 25.1604C29.3532 23.5685 28.7458 21.9853 27.56 20.7528C25.4288 18.6759 22.2304 18.3445 19.7586 19.7586C19.7587 19.7586 19.7586 19.7587 19.7586 19.7586C19.3272 20.0055 18.9179 20.3055 18.5403 20.6587C18.4931 20.7028 18.4464 20.7478 18.4002 20.7936C18.3936 20.8002 18.387 20.8067 18.3805 20.8132" style={{ fill: `var(--type)` }}/>
24
25
  </svg>
25
26
  ;
26
27
  } else if (thick) {
27
28
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
28
- <path d="M30.7506 30.8016C31.2173 30.4789 31.6615 30.1098 32.077 29.6943L39.5437 22.2277C43.2589 18.5124 43.267 12.4937 39.5678 8.76849L39.5666 8.76927C35.8414 5.0701 29.8227 5.07814 26.1075 8.79342L20.7993 14.1016C22.5871 13.7641 24.4393 13.8515 26.1938 14.364L28.9359 11.6218C31.0891 9.46867 34.575 9.46063 36.7382 11.5977L36.7393 11.5969C38.8764 13.7601 38.8684 17.2461 36.7152 19.3992L29.2486 26.8659C27.0954 29.0191 23.6094 29.0271 21.4463 26.89L21.4451 26.8908C21.4233 26.8687 21.35 26.8156 21.35 26.7844L21.3458 26.7876C20.4729 25.858 19.9816 24.7004 19.8719 23.5142L16.6201 26.7661C17.0801 27.8376 17.7456 28.842 18.6167 29.7192L18.6178 29.7185C20.0083 31.0992 21.8247 32.0336 23.7582 32.3562L23.7572 32.3573C26.1537 32.7571 28.674 32.2382 30.7506 30.8016Z" style={{ fill: `var(--${color})` }}/>
29
- <path d="M26.8388 21.4971C25.1023 19.7815 22.5132 19.4484 20.4456 20.4976C19.9693 20.7393 19.5206 21.0545 19.1165 21.4428C19.0896 21.4686 19.0627 21.495 19.0363 21.5215L11.5698 28.9879C9.41665 31.1411 9.40861 34.6271 11.5457 36.7902C13.7088 38.9273 17.195 38.9195 19.3482 36.7663L22.09 34.0244C23.8445 34.5369 25.6967 34.6243 27.4845 34.2868L22.1766 39.5947C18.4613 43.31 12.4425 43.3178 8.71725 39.6187C5.01807 35.8934 5.02612 29.8748 8.74139 26.1595L16.208 18.6928C19.9233 14.9776 25.942 14.9695 29.6672 18.6687C30.5383 19.5459 31.204 20.5505 31.664 21.6221L28.4121 24.8739C28.2984 23.6434 27.7738 22.4436 26.8388 21.4971Z" style={{ fill: `var(--${color})` }}/>
29
+ <path d="M30.7506 30.8016C31.2173 30.4789 31.6615 30.1098 32.077 29.6943L39.5437 22.2277C43.2589 18.5124 43.267 12.4937 39.5678 8.76849L39.5666 8.76927C35.8414 5.0701 29.8227 5.07814 26.1075 8.79342L20.7993 14.1016C22.5871 13.7641 24.4393 13.8515 26.1938 14.364L28.9359 11.6218C31.0891 9.46867 34.575 9.46063 36.7382 11.5977L36.7393 11.5969C38.8764 13.7601 38.8684 17.2461 36.7152 19.3992L29.2486 26.8659C27.0954 29.0191 23.6094 29.0271 21.4463 26.89L21.4451 26.8908C21.4233 26.8687 21.35 26.8156 21.35 26.7844L21.3458 26.7876C20.4729 25.858 19.9816 24.7004 19.8719 23.5142L16.6201 26.7661C17.0801 27.8376 17.7456 28.842 18.6167 29.7192L18.6178 29.7185C20.0083 31.0992 21.8247 32.0336 23.7582 32.3562L23.7572 32.3573C26.1537 32.7571 28.674 32.2382 30.7506 30.8016Z" style={{ fill: `var(--type)` }}/>
30
+ <path d="M26.8388 21.4971C25.1023 19.7815 22.5132 19.4484 20.4456 20.4976C19.9693 20.7393 19.5206 21.0545 19.1165 21.4428C19.0896 21.4686 19.0627 21.495 19.0363 21.5215L11.5698 28.9879C9.41665 31.1411 9.40861 34.6271 11.5457 36.7902C13.7088 38.9273 17.195 38.9195 19.3482 36.7663L22.09 34.0244C23.8445 34.5369 25.6967 34.6243 27.4845 34.2868L22.1766 39.5947C18.4613 43.31 12.4425 43.3178 8.71725 39.6187C5.01807 35.8934 5.02612 29.8748 8.74139 26.1595L16.208 18.6928C19.9233 14.9776 25.942 14.9695 29.6672 18.6687C30.5383 19.5459 31.204 20.5505 31.664 21.6221L28.4121 24.8739C28.2984 23.6434 27.7738 22.4436 26.8388 21.4971Z" style={{ fill: `var(--type)` }}/>
30
31
  </svg>
31
32
  ;
32
33
  }
33
34
 
34
35
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
35
- <path d="M39.6433 8.79387L39.642 8.79251L39.5881 8.739C39.5559 8.70588 39.5234 8.67293 39.4906 8.64016L39.4892 8.6388L39.487 8.64099C35.753 5.06987 29.8307 5.12037 26.1586 8.7925L20.8505 14.1006C22.2542 13.8355 23.6976 13.8325 25.1023 14.0915L28.2799 10.9138C30.8114 8.38233 34.9032 8.36222 37.4595 10.8535C39.9207 13.4117 39.8906 17.4809 37.3693 20.0022L29.9026 27.4687C29.4816 27.8897 29.0175 28.2413 28.5244 28.5233C26.0526 29.9373 22.8541 29.6061 20.723 27.5293C19.5373 26.2967 18.9298 24.7135 18.9005 23.1216L16.2955 25.7267C16.7132 27.1318 17.4616 28.4596 18.5404 29.5876L18.5392 29.5889L18.5406 29.5902L18.5945 29.6438C18.6267 29.6769 18.6592 29.7098 18.6919 29.7426L18.6933 29.7439L18.6955 29.7417C22.4295 33.3129 28.3518 33.2623 32.024 29.5902L39.4906 22.1236C43.1627 18.4514 43.2132 12.5291 39.6421 8.79509L39.6433 8.79387Z" style={{ fill: `var(--${color})` }}/>
36
- <path d="M10.9138 28.2799C8.3925 30.8012 8.36242 34.8704 10.8236 37.4287C13.3799 39.9198 17.4717 39.8997 20.0031 37.3682L23.1807 34.1906C24.5854 34.4495 26.0288 34.4465 27.4325 34.1815L22.1244 39.4895C18.4523 43.1616 12.5301 43.2122 8.79607 39.6411L8.79387 39.6433L8.7925 39.642C8.75973 39.6092 8.72724 39.5763 8.69505 39.5431C8.67699 39.5253 8.65899 39.5075 8.64104 39.4895L8.63967 39.4882L8.64089 39.4869C5.06987 35.7529 5.12041 29.8307 8.79251 26.1586L16.2592 18.6919C19.9313 15.0198 25.8535 14.9693 29.5875 18.5403L29.5897 18.5381L29.5911 18.5395C29.6238 18.5722 29.6563 18.6052 29.6885 18.6383C29.7066 18.6561 29.7246 18.674 29.7426 18.6919L29.7439 18.6933L29.7427 18.6945C30.8215 19.8225 31.5698 21.1503 31.9875 22.5554L29.3825 25.1604C29.3532 23.5685 28.7458 21.9853 27.56 20.7528C25.4288 18.6759 22.2304 18.3445 19.7586 19.7586C19.7587 19.7586 19.7586 19.7587 19.7586 19.7586C19.3272 20.0055 18.9179 20.3055 18.5403 20.6587C18.4931 20.7028 18.4464 20.7478 18.4002 20.7936C18.3936 20.8002 18.387 20.8067 18.3805 20.8132" style={{ fill: `var(--${color})` }}/>
36
+ <path d="M39.6433 8.79387L39.642 8.79251L39.5881 8.739C39.5559 8.70588 39.5234 8.67293 39.4906 8.64016L39.4892 8.6388L39.487 8.64099C35.753 5.06987 29.8307 5.12037 26.1586 8.7925L20.8505 14.1006C22.2542 13.8355 23.6976 13.8325 25.1023 14.0915L28.2799 10.9138C30.8114 8.38233 34.9032 8.36222 37.4595 10.8535C39.9207 13.4117 39.8906 17.4809 37.3693 20.0022L29.9026 27.4687C29.4816 27.8897 29.0175 28.2413 28.5244 28.5233C26.0526 29.9373 22.8541 29.6061 20.723 27.5293C19.5373 26.2967 18.9298 24.7135 18.9005 23.1216L16.2955 25.7267C16.7132 27.1318 17.4616 28.4596 18.5404 29.5876L18.5392 29.5889L18.5406 29.5902L18.5945 29.6438C18.6267 29.6769 18.6592 29.7098 18.6919 29.7426L18.6933 29.7439L18.6955 29.7417C22.4295 33.3129 28.3518 33.2623 32.024 29.5902L39.4906 22.1236C43.1627 18.4514 43.2132 12.5291 39.6421 8.79509L39.6433 8.79387Z" style={{ fill: `var(--type)` }}/>
37
+ <path d="M10.9138 28.2799C8.3925 30.8012 8.36242 34.8704 10.8236 37.4287C13.3799 39.9198 17.4717 39.8997 20.0031 37.3682L23.1807 34.1906C24.5854 34.4495 26.0288 34.4465 27.4325 34.1815L22.1244 39.4895C18.4523 43.1616 12.5301 43.2122 8.79607 39.6411L8.79387 39.6433L8.7925 39.642C8.75973 39.6092 8.72724 39.5763 8.69505 39.5431C8.67699 39.5253 8.65899 39.5075 8.64104 39.4895L8.63967 39.4882L8.64089 39.4869C5.06987 35.7529 5.12041 29.8307 8.79251 26.1586L16.2592 18.6919C19.9313 15.0198 25.8535 14.9693 29.5875 18.5403L29.5897 18.5381L29.5911 18.5395C29.6238 18.5722 29.6563 18.6052 29.6885 18.6383C29.7066 18.6561 29.7246 18.674 29.7426 18.6919L29.7439 18.6933L29.7427 18.6945C30.8215 19.8225 31.5698 21.1503 31.9875 22.5554L29.3825 25.1604C29.3532 23.5685 28.7458 21.9853 27.56 20.7528C25.4288 18.6759 22.2304 18.3445 19.7586 19.7586C19.7587 19.7586 19.7586 19.7587 19.7586 19.7586C19.3272 20.0055 18.9179 20.3055 18.5403 20.6587C18.4931 20.7028 18.4464 20.7478 18.4002 20.7936C18.3936 20.8002 18.387 20.8067 18.3805 20.8132" style={{ fill: `var(--type)` }}/>
37
38
  </svg>
38
39
  ;
39
40
  }
@@ -6,50 +6,51 @@ interface ListProps {
6
6
  thick?: boolean;
7
7
  className?: string;
8
8
  size?: number
9
- color?: BasicColorType;
9
+ type?: BasicColorType;
10
+ fillType?: BasicColorType;
10
11
  }
11
12
 
12
13
  export const List = forwardRef<SVGSVGElement, ListProps>(
13
- ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary', className, ...props }, ref) => {
14
+ ({ fill = false, thick = false, size = 24, type = 'neutral-label-primary', className, ...props }, ref) => {
14
15
  if (fill && thick) {
15
16
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
16
- <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--${color})` }}/>
17
- <path d="M39 9.5H18V12.5H39V9.5Z" style={{ fill: `var(--${color})` }}/>
18
- <path d="M39 22.5H18V25.5H39V22.5Z" style={{ fill: `var(--${color})` }}/>
19
- <path d="M18 35.5H39V38.5H18V35.5Z" style={{ fill: `var(--${color})` }}/>
20
- <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--${color})` }}/>
21
- <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--${color})` }}/>
17
+ <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--type)` }}/>
18
+ <path d="M39 9.5H18V12.5H39V9.5Z" style={{ fill: `var(--type)` }}/>
19
+ <path d="M39 22.5H18V25.5H39V22.5Z" style={{ fill: `var(--type)` }}/>
20
+ <path d="M18 35.5H39V38.5H18V35.5Z" style={{ fill: `var(--type)` }}/>
21
+ <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--type)` }}/>
22
+ <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--type)` }}/>
22
23
  </svg>
23
24
  ;
24
25
  } else if (fill) {
25
26
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
26
- <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--${color})` }}/>
27
- <path d="M39 9.5H18V12.5H39V9.5Z" style={{ fill: `var(--${color})` }}/>
28
- <path d="M39 22.5H18V25.5H39V22.5Z" style={{ fill: `var(--${color})` }}/>
29
- <path d="M18 35.5H39V38.5H18V35.5Z" style={{ fill: `var(--${color})` }}/>
30
- <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--${color})` }}/>
31
- <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--${color})` }}/>
27
+ <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--type)` }}/>
28
+ <path d="M39 9.5H18V12.5H39V9.5Z" style={{ fill: `var(--type)` }}/>
29
+ <path d="M39 22.5H18V25.5H39V22.5Z" style={{ fill: `var(--type)` }}/>
30
+ <path d="M18 35.5H39V38.5H18V35.5Z" style={{ fill: `var(--type)` }}/>
31
+ <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--type)` }}/>
32
+ <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--type)` }}/>
32
33
  </svg>
33
34
  ;
34
35
  } else if (thick) {
35
36
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
36
- <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--${color})` }}/>
37
- <path d="M39 9H18V13H39V9Z" style={{ fill: `var(--${color})` }}/>
38
- <path d="M39 22H18V26H39V22Z" style={{ fill: `var(--${color})` }}/>
39
- <path d="M18 35H39V39H18V35Z" style={{ fill: `var(--${color})` }}/>
40
- <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--${color})` }}/>
41
- <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--${color})` }}/>
37
+ <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--type)` }}/>
38
+ <path d="M39 9H18V13H39V9Z" style={{ fill: `var(--type)` }}/>
39
+ <path d="M39 22H18V26H39V22Z" style={{ fill: `var(--type)` }}/>
40
+ <path d="M18 35H39V39H18V35Z" style={{ fill: `var(--type)` }}/>
41
+ <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--type)` }}/>
42
+ <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--type)` }}/>
42
43
  </svg>
43
44
  ;
44
45
  }
45
46
 
46
47
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
47
- <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--${color})` }}/>
48
- <path d="M39 9.5H18V12.5H39V9.5Z" style={{ fill: `var(--${color})` }}/>
49
- <path d="M39 22.5H18V25.5H39V22.5Z" style={{ fill: `var(--${color})` }}/>
50
- <path d="M18 35.5H39V38.5H18V35.5Z" style={{ fill: `var(--${color})` }}/>
51
- <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--${color})` }}/>
52
- <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--${color})` }}/>
48
+ <path d="M8 8C6.89543 8 6 8.89543 6 10V12C6 13.1046 6.89543 14 8 14H10C11.1046 14 12 13.1046 12 12V10C12 8.89543 11.1046 8 10 8H8Z" style={{ fill: `var(--type)` }}/>
49
+ <path d="M39 9.5H18V12.5H39V9.5Z" style={{ fill: `var(--type)` }}/>
50
+ <path d="M39 22.5H18V25.5H39V22.5Z" style={{ fill: `var(--type)` }}/>
51
+ <path d="M18 35.5H39V38.5H18V35.5Z" style={{ fill: `var(--type)` }}/>
52
+ <path d="M6 23C6 21.8954 6.89543 21 8 21H10C11.1046 21 12 21.8954 12 23V25C12 26.1046 11.1046 27 10 27H8C6.89543 27 6 26.1046 6 25V23Z" style={{ fill: `var(--type)` }}/>
53
+ <path d="M8 34C6.89543 34 6 34.8954 6 36V38C6 39.1046 6.89543 40 8 40H10C11.1046 40 12 39.1046 12 38V36C12 34.8954 11.1046 34 10 34H8Z" style={{ fill: `var(--type)` }}/>
53
54
  </svg>
54
55
  ;
55
56
  }
@@ -6,46 +6,47 @@ interface LiteratureReviewProps {
6
6
  thick?: boolean;
7
7
  className?: string;
8
8
  size?: number
9
- color?: BasicColorType;
9
+ type?: BasicColorType;
10
+ fillType?: BasicColorType;
10
11
  }
11
12
 
12
13
  export const LiteratureReview = forwardRef<SVGSVGElement, LiteratureReviewProps>(
13
- ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary', className, ...props }, ref) => {
14
+ ({ fill = false, thick = false, size = 24, type = 'neutral-label-primary', className, ...props }, ref) => {
14
15
  if (fill && thick) {
15
16
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
16
- <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9341 36.9597 40.5889 38.0075 40.0312 38.9102L45.0605 43.9395L42.9395 46.0605L37.9102 41.0312C36.9185 41.644 35.7513 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 32C32.567 32 31 33.567 31 35.5C31 37.433 32.567 39 34.5 39C36.433 39 38 37.433 38 35.5C38 33.567 36.433 32 34.5 32Z" style={{ fill: `var(--${color})` }}/>
17
- <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C42.1401 27.5419 41.1262 26.7791 40 26.2031V8H8V40H24.7529C25.1811 41.0961 25.7776 42.1076 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--${color})` }}/>
18
- <path d="M25.4756 30.5C24.941 31.4237 24.5375 32.4315 24.2891 33.5H14.5V30.5H25.4756Z" style={{ fill: `var(--${color})` }}/>
19
- <path d="M33.5 25.1045C32.8862 25.1882 32.2881 25.3194 31.7109 25.5H14.5V22.5H33.5V25.1045Z" style={{ fill: `var(--${color})` }}/>
20
- <path d="M33.5 17.5H14.5V14.5H33.5V17.5Z" style={{ fill: `var(--${color})` }}/>
17
+ <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9341 36.9597 40.5889 38.0075 40.0312 38.9102L45.0605 43.9395L42.9395 46.0605L37.9102 41.0312C36.9185 41.644 35.7513 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 32C32.567 32 31 33.567 31 35.5C31 37.433 32.567 39 34.5 39C36.433 39 38 37.433 38 35.5C38 33.567 36.433 32 34.5 32Z" style={{ fill: `var(--type)` }}/>
18
+ <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C42.1401 27.5419 41.1262 26.7791 40 26.2031V8H8V40H24.7529C25.1811 41.0961 25.7776 42.1076 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--type)` }}/>
19
+ <path d="M25.4756 30.5C24.941 31.4237 24.5375 32.4315 24.2891 33.5H14.5V30.5H25.4756Z" style={{ fill: `var(--type)` }}/>
20
+ <path d="M33.5 25.1045C32.8862 25.1882 32.2881 25.3194 31.7109 25.5H14.5V22.5H33.5V25.1045Z" style={{ fill: `var(--type)` }}/>
21
+ <path d="M33.5 17.5H14.5V14.5H33.5V17.5Z" style={{ fill: `var(--type)` }}/>
21
22
  </svg>
22
23
  ;
23
24
  } else if (fill) {
24
25
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
25
- <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9341 36.9597 40.5889 38.0075 40.0312 38.9102L45.0605 43.9395L42.9395 46.0605L37.9102 41.0312C36.9185 41.644 35.7513 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 32C32.567 32 31 33.567 31 35.5C31 37.433 32.567 39 34.5 39C36.433 39 38 37.433 38 35.5C38 33.567 36.433 32 34.5 32Z" style={{ fill: `var(--${color})` }}/>
26
- <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C42.1401 27.5419 41.1262 26.7791 40 26.2031V8H8V40H24.7529C25.1811 41.0961 25.7776 42.1076 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--${color})` }}/>
27
- <path d="M25.4756 30.5C24.941 31.4237 24.5375 32.4315 24.2891 33.5H14.5V30.5H25.4756Z" style={{ fill: `var(--${color})` }}/>
28
- <path d="M33.5 25.1045C32.8862 25.1882 32.2881 25.3194 31.7109 25.5H14.5V22.5H33.5V25.1045Z" style={{ fill: `var(--${color})` }}/>
29
- <path d="M33.5 17.5H14.5V14.5H33.5V17.5Z" style={{ fill: `var(--${color})` }}/>
26
+ <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9341 36.9597 40.5889 38.0075 40.0312 38.9102L45.0605 43.9395L42.9395 46.0605L37.9102 41.0312C36.9185 41.644 35.7513 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 32C32.567 32 31 33.567 31 35.5C31 37.433 32.567 39 34.5 39C36.433 39 38 37.433 38 35.5C38 33.567 36.433 32 34.5 32Z" style={{ fill: `var(--type)` }}/>
27
+ <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C42.1401 27.5419 41.1262 26.7791 40 26.2031V8H8V40H24.7529C25.1811 41.0961 25.7776 42.1076 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--type)` }}/>
28
+ <path d="M25.4756 30.5C24.941 31.4237 24.5375 32.4315 24.2891 33.5H14.5V30.5H25.4756Z" style={{ fill: `var(--type)` }}/>
29
+ <path d="M33.5 25.1045C32.8862 25.1882 32.2881 25.3194 31.7109 25.5H14.5V22.5H33.5V25.1045Z" style={{ fill: `var(--type)` }}/>
30
+ <path d="M33.5 17.5H14.5V14.5H33.5V17.5Z" style={{ fill: `var(--type)` }}/>
30
31
  </svg>
31
32
  ;
32
33
  } else if (thick) {
33
34
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
34
- <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9434 36.7767 40.6939 37.6649 40.2871 38.459L45.4141 43.5859L42.5859 46.4141L37.459 41.2871C36.5713 41.7419 35.566 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 33C33.1193 33 32 34.1193 32 35.5C32 36.8807 33.1193 38 34.5 38C35.8807 38 37 36.8807 37 35.5C37 34.1193 35.8807 33 34.5 33Z" style={{ fill: `var(--${color})` }}/>
35
- <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C41.8923 27.2794 40.5297 26.3505 39 25.7529V9H9V39H24.418C24.838 40.4844 25.5584 41.8422 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--${color})` }}/>
36
- <path d="M25.7822 30C25.0039 31.1934 24.4517 32.5462 24.1846 34H14V30H25.7822Z" style={{ fill: `var(--${color})` }}/>
37
- <path d="M34 25.0469C32.7315 25.1612 31.5264 25.4918 30.4189 26H14V22H34V25.0469Z" style={{ fill: `var(--${color})` }}/>
38
- <path d="M34 18H14V14H34V18Z" style={{ fill: `var(--${color})` }}/>
35
+ <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9434 36.7767 40.6939 37.6649 40.2871 38.459L45.4141 43.5859L42.5859 46.4141L37.459 41.2871C36.5713 41.7419 35.566 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 33C33.1193 33 32 34.1193 32 35.5C32 36.8807 33.1193 38 34.5 38C35.8807 38 37 36.8807 37 35.5C37 34.1193 35.8807 33 34.5 33Z" style={{ fill: `var(--type)` }}/>
36
+ <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C41.8923 27.2794 40.5297 26.3505 39 25.7529V9H9V39H24.418C24.838 40.4844 25.5584 41.8422 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--type)` }}/>
37
+ <path d="M25.7822 30C25.0039 31.1934 24.4517 32.5462 24.1846 34H14V30H25.7822Z" style={{ fill: `var(--type)` }}/>
38
+ <path d="M34 25.0469C32.7315 25.1612 31.5264 25.4918 30.4189 26H14V22H34V25.0469Z" style={{ fill: `var(--type)` }}/>
39
+ <path d="M34 18H14V14H34V18Z" style={{ fill: `var(--type)` }}/>
39
40
  </svg>
40
41
  ;
41
42
  }
42
43
 
43
44
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
44
- <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9341 36.9597 40.5889 38.0075 40.0312 38.9102L45.0605 43.9395L42.9395 46.0605L37.9102 41.0312C36.9185 41.644 35.7513 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 32C32.567 32 31 33.567 31 35.5C31 37.433 32.567 39 34.5 39C36.433 39 38 37.433 38 35.5C38 33.567 36.433 32 34.5 32Z" style={{ fill: `var(--${color})` }}/>
45
- <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C42.1401 27.5419 41.1262 26.7791 40 26.2031V8H8V40H24.7529C25.1811 41.0961 25.7776 42.1076 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--${color})` }}/>
46
- <path d="M25.4756 30.5C24.941 31.4237 24.5375 32.4315 24.2891 33.5H14.5V30.5H25.4756Z" style={{ fill: `var(--${color})` }}/>
47
- <path d="M33.5 25.1045C32.8862 25.1882 32.2881 25.3194 31.7109 25.5H14.5V22.5H33.5V25.1045Z" style={{ fill: `var(--${color})` }}/>
48
- <path d="M33.5 17.5H14.5V14.5H33.5V17.5Z" style={{ fill: `var(--${color})` }}/>
45
+ <path fillRule="evenodd" clipRule="evenodd" d="M34.834 29.0088C38.2686 29.1826 41 32.0222 41 35.5L40.9912 35.835C40.9341 36.9597 40.5889 38.0075 40.0312 38.9102L45.0605 43.9395L42.9395 46.0605L37.9102 41.0312C36.9185 41.644 35.7513 42 34.5 42L34.165 41.9912C30.8418 41.8225 28.1775 39.1582 28.0088 35.835L28 35.5C28 31.9101 30.9101 29 34.5 29L34.834 29.0088ZM34.5 32C32.567 32 31 33.567 31 35.5C31 37.433 32.567 39 34.5 39C36.433 39 38 37.433 38 35.5C38 33.567 36.433 32 34.5 32Z" style={{ fill: `var(--type)` }}/>
46
+ <path d="M41 5C42.1046 5 43 5.89543 43 7V28.4531C42.1401 27.5419 41.1262 26.7791 40 26.2031V8H8V40H24.7529C25.1811 41.0961 25.7776 42.1076 26.5146 43H7L6.7959 42.9893C5.78722 42.887 5 42.0357 5 41V7C5 5.89543 5.89543 5 7 5H41Z" style={{ fill: `var(--type)` }}/>
47
+ <path d="M25.4756 30.5C24.941 31.4237 24.5375 32.4315 24.2891 33.5H14.5V30.5H25.4756Z" style={{ fill: `var(--type)` }}/>
48
+ <path d="M33.5 25.1045C32.8862 25.1882 32.2881 25.3194 31.7109 25.5H14.5V22.5H33.5V25.1045Z" style={{ fill: `var(--type)` }}/>
49
+ <path d="M33.5 17.5H14.5V14.5H33.5V17.5Z" style={{ fill: `var(--type)` }}/>
49
50
  </svg>
50
51
  ;
51
52
  }
@@ -6,34 +6,35 @@ interface LockProps {
6
6
  thick?: boolean;
7
7
  className?: string;
8
8
  size?: number
9
- color?: BasicColorType;
9
+ type?: BasicColorType;
10
+ fillType?: BasicColorType;
10
11
  }
11
12
 
12
13
  export const Lock = forwardRef<SVGSVGElement, LockProps>(
13
- ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary', className, ...props }, ref) => {
14
+ ({ fill = false, thick = false, size = 24, type = 'neutral-label-primary', className, ...props }, ref) => {
14
15
  if (fill && thick) {
15
16
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
16
- <path d="M24.0001 30C24.5524 30 25.0001 29.5523 25.0001 29C25.0001 28.4477 24.5524 28 24.0001 28C23.4478 28 23.0001 28.4477 23.0001 29C23.0001 29.5523 23.4478 30 24.0001 30Z" style={{ fill: `var(--${color})` }}/>
17
- <path fillRule="evenodd" clipRule="evenodd" d="M10.1289 18.8711H13.4191V13.5806C13.4191 7.73712 18.1562 3 23.9997 3C29.8432 3 34.5804 7.73712 34.5804 13.5806V18.8711H37.8708C38.9754 18.8711 39.8708 19.7665 39.8708 20.8711V42.0001C39.8708 43.1047 38.9754 44.0001 37.8708 44.0001H10.1289C9.02434 44.0001 8.12891 43.1047 8.12891 42.0001V20.8711C8.12891 19.7665 9.02434 18.8711 10.1289 18.8711ZM30.5804 13.5806V18.8711H17.4191V13.5806C17.4191 9.94625 20.3653 7 23.9997 7C27.6341 7 30.5804 9.94626 30.5804 13.5806ZM27.9356 28.9677C27.9356 30.4164 27.1593 31.6836 26 32.3763V37H22V32.4139C20.8052 31.7301 20.0001 30.443 20.0001 28.9677C20.0001 26.7764 21.7765 25 23.9679 25C26.1592 25 27.9356 26.7764 27.9356 28.9677Z" style={{ fill: `var(--${color})` }}/>
17
+ <path d="M24.0001 30C24.5524 30 25.0001 29.5523 25.0001 29C25.0001 28.4477 24.5524 28 24.0001 28C23.4478 28 23.0001 28.4477 23.0001 29C23.0001 29.5523 23.4478 30 24.0001 30Z" style={{ fill: `var(--type)` }}/>
18
+ <path fillRule="evenodd" clipRule="evenodd" d="M10.1289 18.8711H13.4191V13.5806C13.4191 7.73712 18.1562 3 23.9997 3C29.8432 3 34.5804 7.73712 34.5804 13.5806V18.8711H37.8708C38.9754 18.8711 39.8708 19.7665 39.8708 20.8711V42.0001C39.8708 43.1047 38.9754 44.0001 37.8708 44.0001H10.1289C9.02434 44.0001 8.12891 43.1047 8.12891 42.0001V20.8711C8.12891 19.7665 9.02434 18.8711 10.1289 18.8711ZM30.5804 13.5806V18.8711H17.4191V13.5806C17.4191 9.94625 20.3653 7 23.9997 7C27.6341 7 30.5804 9.94626 30.5804 13.5806ZM27.9356 28.9677C27.9356 30.4164 27.1593 31.6836 26 32.3763V37H22V32.4139C20.8052 31.7301 20.0001 30.443 20.0001 28.9677C20.0001 26.7764 21.7765 25 23.9679 25C26.1592 25 27.9356 26.7764 27.9356 28.9677Z" style={{ fill: `var(--type)` }}/>
18
19
  </svg>
19
20
  ;
20
21
  } else if (fill) {
21
22
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
22
- <path d="M24 30.5C24.8284 30.5 25.5 29.8284 25.5 29C25.5 28.1716 24.8284 27.5 24 27.5C23.1716 27.5 22.5 28.1716 22.5 29C22.5 29.8284 23.1716 30.5 24 30.5Z" style={{ fill: `var(--${color})` }}/>
23
- <path fillRule="evenodd" clipRule="evenodd" d="M10.1289 18.8711H13.4191V13.5806C13.4191 7.73712 18.1562 3 23.9997 3C29.8432 3 34.5804 7.73712 34.5804 13.5806V18.8711H37.8708C38.9754 18.8711 39.8708 19.7665 39.8708 20.8711V42.0001C39.8708 43.1047 38.9754 44.0001 37.8708 44.0001H10.1289C9.02434 44.0001 8.12891 43.1047 8.12891 42.0001V20.8711C8.12891 19.7665 9.02434 18.8711 10.1289 18.8711ZM31.5804 13.5806V18.8711H16.4191V13.5806C16.4191 9.39397 19.813 6 23.9997 6C28.1864 6 31.5804 9.39397 31.5804 13.5806ZM27.9356 28.9677C27.9356 30.616 26.9306 32.0294 25.5 32.6289V37H22.5V32.6551C21.0353 32.0715 20.0001 30.6405 20.0001 28.9677C20.0001 26.7764 21.7765 25 23.9679 25C26.1592 25 27.9356 26.7764 27.9356 28.9677Z" style={{ fill: `var(--${color})` }}/>
23
+ <path d="M24 30.5C24.8284 30.5 25.5 29.8284 25.5 29C25.5 28.1716 24.8284 27.5 24 27.5C23.1716 27.5 22.5 28.1716 22.5 29C22.5 29.8284 23.1716 30.5 24 30.5Z" style={{ fill: `var(--type)` }}/>
24
+ <path fillRule="evenodd" clipRule="evenodd" d="M10.1289 18.8711H13.4191V13.5806C13.4191 7.73712 18.1562 3 23.9997 3C29.8432 3 34.5804 7.73712 34.5804 13.5806V18.8711H37.8708C38.9754 18.8711 39.8708 19.7665 39.8708 20.8711V42.0001C39.8708 43.1047 38.9754 44.0001 37.8708 44.0001H10.1289C9.02434 44.0001 8.12891 43.1047 8.12891 42.0001V20.8711C8.12891 19.7665 9.02434 18.8711 10.1289 18.8711ZM31.5804 13.5806V18.8711H16.4191V13.5806C16.4191 9.39397 19.813 6 23.9997 6C28.1864 6 31.5804 9.39397 31.5804 13.5806ZM27.9356 28.9677C27.9356 30.616 26.9306 32.0294 25.5 32.6289V37H22.5V32.6551C21.0353 32.0715 20.0001 30.6405 20.0001 28.9677C20.0001 26.7764 21.7765 25 23.9679 25C26.1592 25 27.9356 26.7764 27.9356 28.9677Z" style={{ fill: `var(--type)` }}/>
24
25
  </svg>
25
26
  ;
26
27
  } else if (thick) {
27
28
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
28
- <path fillRule="evenodd" clipRule="evenodd" d="M26 32.3763C27.1593 31.6836 27.9356 30.4164 27.9356 28.9677C27.9356 26.7764 26.1592 25 23.9679 25C21.7765 25 20.0001 26.7764 20.0001 28.9677C20.0001 30.443 20.8052 31.7301 22 32.4139V37H26V32.3763ZM24.0001 30C24.5524 30 25.0001 29.5523 25.0001 29C25.0001 28.4477 24.5524 28 24.0001 28C23.4478 28 23.0001 28.4477 23.0001 29C23.0001 29.5523 23.4478 30 24.0001 30Z" style={{ fill: `var(--${color})` }}/>
29
- <path fillRule="evenodd" clipRule="evenodd" d="M34.5804 18.8708H37.8711C38.9757 18.8708 39.8711 19.7663 39.8711 20.8708V41.9999C39.8711 43.1045 38.9757 43.9999 37.8711 43.9999H10.1292C9.02458 43.9999 8.12915 43.1045 8.12915 41.9999V20.8708C8.12915 19.7663 9.02458 18.8708 10.1292 18.8708H13.4191V13.5806C13.4191 7.73712 18.1562 3 23.9997 3C29.8432 3 34.5804 7.73712 34.5804 13.5806V18.8708ZM30.5804 18.8708V13.5806C30.5804 9.94626 27.6341 7 23.9997 7C20.3653 7 17.4191 9.94625 17.4191 13.5806V18.8708H30.5804ZM35.8711 22.8708V39.9999H12.1292V22.8708H35.8711Z" style={{ fill: `var(--${color})` }}/>
29
+ <path fillRule="evenodd" clipRule="evenodd" d="M26 32.3763C27.1593 31.6836 27.9356 30.4164 27.9356 28.9677C27.9356 26.7764 26.1592 25 23.9679 25C21.7765 25 20.0001 26.7764 20.0001 28.9677C20.0001 30.443 20.8052 31.7301 22 32.4139V37H26V32.3763ZM24.0001 30C24.5524 30 25.0001 29.5523 25.0001 29C25.0001 28.4477 24.5524 28 24.0001 28C23.4478 28 23.0001 28.4477 23.0001 29C23.0001 29.5523 23.4478 30 24.0001 30Z" style={{ fill: `var(--type)` }}/>
30
+ <path fillRule="evenodd" clipRule="evenodd" d="M34.5804 18.8708H37.8711C38.9757 18.8708 39.8711 19.7663 39.8711 20.8708V41.9999C39.8711 43.1045 38.9757 43.9999 37.8711 43.9999H10.1292C9.02458 43.9999 8.12915 43.1045 8.12915 41.9999V20.8708C8.12915 19.7663 9.02458 18.8708 10.1292 18.8708H13.4191V13.5806C13.4191 7.73712 18.1562 3 23.9997 3C29.8432 3 34.5804 7.73712 34.5804 13.5806V18.8708ZM30.5804 18.8708V13.5806C30.5804 9.94626 27.6341 7 23.9997 7C20.3653 7 17.4191 9.94625 17.4191 13.5806V18.8708H30.5804ZM35.8711 22.8708V39.9999H12.1292V22.8708H35.8711Z" style={{ fill: `var(--type)` }}/>
30
31
  </svg>
31
32
  ;
32
33
  }
33
34
 
34
35
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
35
- <path fillRule="evenodd" clipRule="evenodd" d="M22.5001 33.1256V37H25.5001V33.1255C26.9478 32.5339 27.9678 31.1117 27.9678 29.4511C27.9678 27.2598 26.1914 25.4834 24.0001 25.4834C21.8088 25.4834 20.0323 27.2598 20.0323 29.4511C20.0323 31.1117 21.0524 32.534 22.5001 33.1256ZM24.9678 29.4511C24.9678 29.9856 24.5346 30.4189 24.0001 30.4189C23.4656 30.4189 23.0323 29.9856 23.0323 29.4511C23.0323 28.9167 23.4656 28.4834 24.0001 28.4834C24.5346 28.4834 24.9678 28.9167 24.9678 29.4511Z" style={{ fill: `var(--${color})` }}/>
36
- <path fillRule="evenodd" clipRule="evenodd" d="M23.9997 3C18.1562 3 13.4191 7.73712 13.4191 13.5806V18.8708H10.1292C9.02458 18.8708 8.12915 19.7663 8.12915 20.8708V41.9999C8.12915 43.1045 9.02458 43.9999 10.1292 43.9999H37.8711C38.9757 43.9999 39.8711 43.1045 39.8711 41.9999V20.8708C39.8711 19.7663 38.9757 18.8708 37.8711 18.8708H34.5804V13.5806C34.5804 7.73712 29.8432 3 23.9997 3ZM31.5804 18.8672V13.5806C31.5804 9.39397 28.1864 6 23.9997 6C19.813 6 16.4191 9.39397 16.4191 13.5806V18.8672H31.5804ZM11.1292 40.9999V21.8708H36.8711V40.9999H11.1292Z" style={{ fill: `var(--${color})` }}/>
36
+ <path fillRule="evenodd" clipRule="evenodd" d="M22.5001 33.1256V37H25.5001V33.1255C26.9478 32.5339 27.9678 31.1117 27.9678 29.4511C27.9678 27.2598 26.1914 25.4834 24.0001 25.4834C21.8088 25.4834 20.0323 27.2598 20.0323 29.4511C20.0323 31.1117 21.0524 32.534 22.5001 33.1256ZM24.9678 29.4511C24.9678 29.9856 24.5346 30.4189 24.0001 30.4189C23.4656 30.4189 23.0323 29.9856 23.0323 29.4511C23.0323 28.9167 23.4656 28.4834 24.0001 28.4834C24.5346 28.4834 24.9678 28.9167 24.9678 29.4511Z" style={{ fill: `var(--type)` }}/>
37
+ <path fillRule="evenodd" clipRule="evenodd" d="M23.9997 3C18.1562 3 13.4191 7.73712 13.4191 13.5806V18.8708H10.1292C9.02458 18.8708 8.12915 19.7663 8.12915 20.8708V41.9999C8.12915 43.1045 9.02458 43.9999 10.1292 43.9999H37.8711C38.9757 43.9999 39.8711 43.1045 39.8711 41.9999V20.8708C39.8711 19.7663 38.9757 18.8708 37.8711 18.8708H34.5804V13.5806C34.5804 7.73712 29.8432 3 23.9997 3ZM31.5804 18.8672V13.5806C31.5804 9.39397 28.1864 6 23.9997 6C19.813 6 16.4191 9.39397 16.4191 13.5806V18.8672H31.5804ZM11.1292 40.9999V21.8708H36.8711V40.9999H11.1292Z" style={{ fill: `var(--type)` }}/>
37
38
  </svg>
38
39
  ;
39
40
  }
@@ -6,46 +6,47 @@ interface MagicPencilProps {
6
6
  thick?: boolean;
7
7
  className?: string;
8
8
  size?: number
9
- color?: BasicColorType;
9
+ type?: BasicColorType;
10
+ fillType?: BasicColorType;
10
11
  }
11
12
 
12
13
  export const MagicPencil = forwardRef<SVGSVGElement, MagicPencilProps>(
13
- ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary', className, ...props }, ref) => {
14
+ ({ fill = false, thick = false, size = 24, type = 'neutral-label-primary', className, ...props }, ref) => {
14
15
  if (fill && thick) {
15
16
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
16
- <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--${color})` }}/>
17
- <path fillRule="evenodd" clipRule="evenodd" d="M28.2534 12.3551C29.6201 10.9874 31.8368 10.9871 33.204 12.3542L36.7378 15.8881C38.1043 17.2546 38.1047 19.47 36.7387 20.837L17.9123 39.6625C17.509 40.0657 17.0132 40.3643 16.4681 40.5322L11.2455 42.1411C8.53335 42.9766 6.00669 40.4066 6.88816 37.709L8.56463 32.5786C8.73562 32.0554 9.02761 31.5799 9.41691 31.1906L28.2534 12.3551ZM25.7889 19.0643L11.538 33.3122C11.4824 33.3678 11.4407 33.4357 11.4162 33.5105L9.73977 38.6409C9.61385 39.0262 9.9748 39.3934 10.3622 39.274L15.5849 37.6652C15.6628 37.6412 15.7336 37.5985 15.7912 37.5409L30.0297 23.3055L25.7889 19.0643ZM32.1508 21.1839L34.6166 18.7164C34.8118 18.5211 34.8117 18.2046 34.6165 18.0094L31.0826 14.4755C30.8873 14.2802 30.5707 14.2803 30.3754 14.4757L27.91 16.9427L32.1508 21.1839Z" style={{ fill: `var(--${color})` }}/>
18
- <path d="M22 39.5L41 39.5V42.5L22 42.5V39.5Z" style={{ fill: `var(--${color})` }}/>
19
- <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--${color})` }}/>
20
- <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--${color})` }}/>
17
+ <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--type)` }}/>
18
+ <path fillRule="evenodd" clipRule="evenodd" d="M28.2534 12.3551C29.6201 10.9874 31.8368 10.9871 33.204 12.3542L36.7378 15.8881C38.1043 17.2546 38.1047 19.47 36.7387 20.837L17.9123 39.6625C17.509 40.0657 17.0132 40.3643 16.4681 40.5322L11.2455 42.1411C8.53335 42.9766 6.00669 40.4066 6.88816 37.709L8.56463 32.5786C8.73562 32.0554 9.02761 31.5799 9.41691 31.1906L28.2534 12.3551ZM25.7889 19.0643L11.538 33.3122C11.4824 33.3678 11.4407 33.4357 11.4162 33.5105L9.73977 38.6409C9.61385 39.0262 9.9748 39.3934 10.3622 39.274L15.5849 37.6652C15.6628 37.6412 15.7336 37.5985 15.7912 37.5409L30.0297 23.3055L25.7889 19.0643ZM32.1508 21.1839L34.6166 18.7164C34.8118 18.5211 34.8117 18.2046 34.6165 18.0094L31.0826 14.4755C30.8873 14.2802 30.5707 14.2803 30.3754 14.4757L27.91 16.9427L32.1508 21.1839Z" style={{ fill: `var(--type)` }}/>
19
+ <path d="M22 39.5L41 39.5V42.5L22 42.5V39.5Z" style={{ fill: `var(--type)` }}/>
20
+ <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--type)` }}/>
21
+ <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--type)` }}/>
21
22
  </svg>
22
23
  ;
23
24
  } else if (fill) {
24
25
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
25
- <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--${color})` }}/>
26
- <path fillRule="evenodd" clipRule="evenodd" d="M28.2534 12.3551C29.6201 10.9874 31.8368 10.9871 33.204 12.3542L36.7378 15.8881C38.1043 17.2546 38.1047 19.47 36.7387 20.837L17.9123 39.6625C17.509 40.0657 17.0132 40.3643 16.4681 40.5322L11.2455 42.1411C8.53335 42.9766 6.00669 40.4066 6.88816 37.709L8.56463 32.5786C8.73562 32.0554 9.02761 31.5799 9.41691 31.1906L28.2534 12.3551ZM25.7889 19.0643L11.538 33.3122C11.4824 33.3678 11.4407 33.4357 11.4162 33.5105L9.73977 38.6409C9.61385 39.0262 9.9748 39.3934 10.3622 39.274L15.5849 37.6652C15.6628 37.6412 15.7336 37.5985 15.7912 37.5409L30.0297 23.3055L25.7889 19.0643ZM32.1508 21.1839L34.6166 18.7164C34.8118 18.5211 34.8117 18.2046 34.6165 18.0094L31.0826 14.4755C30.8873 14.2802 30.5707 14.2803 30.3754 14.4757L27.91 16.9427L32.1508 21.1839Z" style={{ fill: `var(--${color})` }}/>
27
- <path d="M22 39.5L41 39.5V42.5L22 42.5V39.5Z" style={{ fill: `var(--${color})` }}/>
28
- <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--${color})` }}/>
29
- <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--${color})` }}/>
26
+ <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--type)` }}/>
27
+ <path fillRule="evenodd" clipRule="evenodd" d="M28.2534 12.3551C29.6201 10.9874 31.8368 10.9871 33.204 12.3542L36.7378 15.8881C38.1043 17.2546 38.1047 19.47 36.7387 20.837L17.9123 39.6625C17.509 40.0657 17.0132 40.3643 16.4681 40.5322L11.2455 42.1411C8.53335 42.9766 6.00669 40.4066 6.88816 37.709L8.56463 32.5786C8.73562 32.0554 9.02761 31.5799 9.41691 31.1906L28.2534 12.3551ZM25.7889 19.0643L11.538 33.3122C11.4824 33.3678 11.4407 33.4357 11.4162 33.5105L9.73977 38.6409C9.61385 39.0262 9.9748 39.3934 10.3622 39.274L15.5849 37.6652C15.6628 37.6412 15.7336 37.5985 15.7912 37.5409L30.0297 23.3055L25.7889 19.0643ZM32.1508 21.1839L34.6166 18.7164C34.8118 18.5211 34.8117 18.2046 34.6165 18.0094L31.0826 14.4755C30.8873 14.2802 30.5707 14.2803 30.3754 14.4757L27.91 16.9427L32.1508 21.1839Z" style={{ fill: `var(--type)` }}/>
28
+ <path d="M22 39.5L41 39.5V42.5L22 42.5V39.5Z" style={{ fill: `var(--type)` }}/>
29
+ <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--type)` }}/>
30
+ <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--type)` }}/>
30
31
  </svg>
31
32
  ;
32
33
  } else if (thick) {
33
34
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
34
- <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--${color})` }}/>
35
- <path fillRule="evenodd" clipRule="evenodd" d="M27.8996 12.0016C29.4616 10.4386 31.995 10.4382 33.5575 12.0007L37.0913 15.5345C38.653 17.0962 38.6535 19.6282 37.0923 21.1904L18.2658 40.016C17.8048 40.4769 17.2382 40.8181 16.6152 41.01L11.3926 42.6189C8.29305 43.5737 5.40543 40.6366 6.41283 37.5537L8.08931 32.4233C8.28472 31.8253 8.61843 31.2819 9.06333 30.8371L27.8996 12.0016ZM25.7888 19.7714L11.8915 33.6658L10.215 38.7962L15.4376 37.1873L29.3225 23.3054L25.7888 19.7714ZM32.1506 20.4767L34.2629 18.363L30.729 14.8291L28.6169 16.9426L32.1506 20.4767Z" style={{ fill: `var(--${color})` }}/>
36
- <path d="M21.9999 38.9999H40.9999V42.9999H21.9999V38.9999Z" style={{ fill: `var(--${color})` }}/>
37
- <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--${color})` }}/>
38
- <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--${color})` }}/>
35
+ <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--type)` }}/>
36
+ <path fillRule="evenodd" clipRule="evenodd" d="M27.8996 12.0016C29.4616 10.4386 31.995 10.4382 33.5575 12.0007L37.0913 15.5345C38.653 17.0962 38.6535 19.6282 37.0923 21.1904L18.2658 40.016C17.8048 40.4769 17.2382 40.8181 16.6152 41.01L11.3926 42.6189C8.29305 43.5737 5.40543 40.6366 6.41283 37.5537L8.08931 32.4233C8.28472 31.8253 8.61843 31.2819 9.06333 30.8371L27.8996 12.0016ZM25.7888 19.7714L11.8915 33.6658L10.215 38.7962L15.4376 37.1873L29.3225 23.3054L25.7888 19.7714ZM32.1506 20.4767L34.2629 18.363L30.729 14.8291L28.6169 16.9426L32.1506 20.4767Z" style={{ fill: `var(--type)` }}/>
37
+ <path d="M21.9999 38.9999H40.9999V42.9999H21.9999V38.9999Z" style={{ fill: `var(--type)` }}/>
38
+ <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--type)` }}/>
39
+ <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--type)` }}/>
39
40
  </svg>
40
41
  ;
41
42
  }
42
43
 
43
44
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
44
- <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--${color})` }}/>
45
- <path fillRule="evenodd" clipRule="evenodd" d="M28.2534 12.3551C29.6201 10.9874 31.8368 10.9871 33.204 12.3542L36.7378 15.8881C38.1043 17.2546 38.1047 19.47 36.7387 20.837L17.9123 39.6625C17.509 40.0657 17.0132 40.3643 16.4681 40.5322L11.2455 42.1411C8.53335 42.9766 6.00669 40.4066 6.88816 37.709L8.56463 32.5786C8.73562 32.0554 9.02761 31.5799 9.41691 31.1906L28.2534 12.3551ZM25.7889 19.0643L11.538 33.3122C11.4824 33.3678 11.4407 33.4357 11.4162 33.5105L9.73977 38.6409C9.61385 39.0262 9.9748 39.3934 10.3622 39.274L15.5849 37.6652C15.6628 37.6412 15.7336 37.5985 15.7912 37.5409L30.0297 23.3055L25.7889 19.0643ZM32.1508 21.1839L34.6166 18.7164C34.8118 18.5211 34.8117 18.2046 34.6165 18.0094L31.0826 14.4755C30.8873 14.2802 30.5707 14.2803 30.3754 14.4757L27.91 16.9427L32.1508 21.1839Z" style={{ fill: `var(--${color})` }}/>
46
- <path d="M22 39.5L41 39.5V42.5L22 42.5V39.5Z" style={{ fill: `var(--${color})` }}/>
47
- <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--${color})` }}/>
48
- <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--${color})` }}/>
45
+ <path d="M16.8638 3.4468C17.0787 2.85107 17.9213 2.85107 18.1362 3.4468L19.5264 7.29931C19.5557 7.38044 19.6196 7.44432 19.7007 7.47359L23.5532 8.86377C24.1489 9.07874 24.1489 9.92126 23.5532 10.1362L19.7007 11.5264C19.6196 11.5557 19.5557 11.6196 19.5264 11.7007L18.1362 15.5532C17.9213 16.1489 17.0787 16.1489 16.8638 15.5532L15.4736 11.7007C15.4443 11.6196 15.3804 11.5557 15.2993 11.5264L11.4468 10.1362C10.8511 9.92126 10.8511 9.07874 11.4468 8.86377L15.2993 7.47359C15.3804 7.44432 15.4443 7.38044 15.4736 7.29931L16.8638 3.4468Z" style={{ fill: `var(--type)` }}/>
46
+ <path fillRule="evenodd" clipRule="evenodd" d="M28.2534 12.3551C29.6201 10.9874 31.8368 10.9871 33.204 12.3542L36.7378 15.8881C38.1043 17.2546 38.1047 19.47 36.7387 20.837L17.9123 39.6625C17.509 40.0657 17.0132 40.3643 16.4681 40.5322L11.2455 42.1411C8.53335 42.9766 6.00669 40.4066 6.88816 37.709L8.56463 32.5786C8.73562 32.0554 9.02761 31.5799 9.41691 31.1906L28.2534 12.3551ZM25.7889 19.0643L11.538 33.3122C11.4824 33.3678 11.4407 33.4357 11.4162 33.5105L9.73977 38.6409C9.61385 39.0262 9.9748 39.3934 10.3622 39.274L15.5849 37.6652C15.6628 37.6412 15.7336 37.5985 15.7912 37.5409L30.0297 23.3055L25.7889 19.0643ZM32.1508 21.1839L34.6166 18.7164C34.8118 18.5211 34.8117 18.2046 34.6165 18.0094L31.0826 14.4755C30.8873 14.2802 30.5707 14.2803 30.3754 14.4757L27.91 16.9427L32.1508 21.1839Z" style={{ fill: `var(--type)` }}/>
47
+ <path d="M22 39.5L41 39.5V42.5L22 42.5V39.5Z" style={{ fill: `var(--type)` }}/>
48
+ <path d="M39.4894 25.3437C39.324 24.8854 38.676 24.8854 38.5106 25.3437L37.4412 28.3072C37.4187 28.3696 37.3696 28.4187 37.3072 28.4412L34.3437 29.5106C33.8854 29.676 33.8854 30.324 34.3437 30.4894L37.3072 31.5588C37.3696 31.5813 37.4187 31.6304 37.4412 31.6928L38.5106 34.6563C38.676 35.1146 39.324 35.1146 39.4894 34.6563L40.5588 31.6928C40.5813 31.6304 40.6304 31.5813 40.6928 31.5588L43.6563 30.4894C44.1146 30.324 44.1146 29.676 43.6563 29.5106L40.6928 28.4412C40.6304 28.4187 40.5813 28.3696 40.5588 28.3072L39.4894 25.3437Z" style={{ fill: `var(--type)` }}/>
49
+ <path d="M8.51059 16.3437C8.67595 15.8854 9.32405 15.8854 9.48941 16.3437L10.5588 19.3072C10.5813 19.3696 10.6304 19.4187 10.6928 19.4412L13.6563 20.5106C14.1146 20.676 14.1146 21.324 13.6563 21.4894L10.6928 22.5588C10.6304 22.5813 10.5813 22.6304 10.5588 22.6928L9.48941 25.6563C9.32405 26.1146 8.67595 26.1146 8.51059 25.6563L7.44122 22.6928C7.41871 22.6304 7.36957 22.5813 7.30716 22.5588L4.34369 21.4894C3.88544 21.324 3.88543 20.676 4.34369 20.5106L7.30716 19.4412C7.36957 19.4187 7.41871 19.3696 7.44122 19.3072L8.51059 16.3437Z" style={{ fill: `var(--type)` }}/>
49
50
  </svg>
50
51
  ;
51
52
  }
@@ -6,42 +6,43 @@ interface MagicWandProps {
6
6
  thick?: boolean;
7
7
  className?: string;
8
8
  size?: number
9
- color?: BasicColorType;
9
+ type?: BasicColorType;
10
+ fillType?: BasicColorType;
10
11
  }
11
12
 
12
13
  export const MagicWand = forwardRef<SVGSVGElement, MagicWandProps>(
13
- ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary', className, ...props }, ref) => {
14
+ ({ fill = false, thick = false, size = 24, type = 'neutral-label-primary', className, ...props }, ref) => {
14
15
  if (fill && thick) {
15
16
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
16
- <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--${color})` }}/>
17
- <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM10.2526 34.2937L28.2697 16.2767L31.7224 19.7294L13.7053 37.7465L10.2526 34.2937ZM34.2984 10.257L30.3955 14.1599L33.8403 17.6046L37.7432 13.7018L34.2984 10.257Z" style={{ fill: `var(--${color})` }}/>
18
- <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--${color})` }}/>
19
- <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--${color})` }}/>
17
+ <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--type)` }}/>
18
+ <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM10.2526 34.2937L28.2697 16.2767L31.7224 19.7294L13.7053 37.7465L10.2526 34.2937ZM34.2984 10.257L30.3955 14.1599L33.8403 17.6046L37.7432 13.7018L34.2984 10.257Z" style={{ fill: `var(--type)` }}/>
19
+ <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--type)` }}/>
20
+ <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--type)` }}/>
20
21
  </svg>
21
22
  ;
22
23
  } else if (fill) {
23
24
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
24
- <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--${color})` }}/>
25
- <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM10.2526 34.2937L28.2697 16.2767L31.7224 19.7294L13.7053 37.7465L10.2526 34.2937ZM34.2984 10.257L30.3955 14.1599L33.8403 17.6046L37.7432 13.7018L34.2984 10.257Z" style={{ fill: `var(--${color})` }}/>
26
- <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--${color})` }}/>
27
- <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--${color})` }}/>
25
+ <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--type)` }}/>
26
+ <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM10.2526 34.2937L28.2697 16.2767L31.7224 19.7294L13.7053 37.7465L10.2526 34.2937ZM34.2984 10.257L30.3955 14.1599L33.8403 17.6046L37.7432 13.7018L34.2984 10.257Z" style={{ fill: `var(--type)` }}/>
27
+ <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--type)` }}/>
28
+ <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--type)` }}/>
28
29
  </svg>
29
30
  ;
30
31
  } else if (thick) {
31
32
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
32
- <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--${color})` }}/>
33
- <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM11.6668 34.2937L28.9768 16.9838L31.0153 19.0223L13.7053 36.3323L11.6668 34.2937ZM34.2984 11.6712L31.8097 14.1599L33.8403 16.1904L36.3289 13.7018L34.2984 11.6712Z" style={{ fill: `var(--${color})` }}/>
34
- <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--${color})` }}/>
35
- <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--${color})` }}/>
33
+ <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--type)` }}/>
34
+ <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM11.6668 34.2937L28.9768 16.9838L31.0153 19.0223L13.7053 36.3323L11.6668 34.2937ZM34.2984 11.6712L31.8097 14.1599L33.8403 16.1904L36.3289 13.7018L34.2984 11.6712Z" style={{ fill: `var(--type)` }}/>
35
+ <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--type)` }}/>
36
+ <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--type)` }}/>
36
37
  </svg>
37
38
  ;
38
39
  }
39
40
 
40
41
  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" ref={ref} className={className}>
41
- <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--${color})` }}/>
42
- <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM10.2526 34.2937L28.2697 16.2767L31.7224 19.7294L13.7053 37.7465L10.2526 34.2937ZM34.2984 10.257L30.3955 14.1599L33.8403 17.6046L37.7432 13.7018L34.2984 10.257Z" style={{ fill: `var(--${color})` }}/>
43
- <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--${color})` }}/>
44
- <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--${color})` }}/>
42
+ <path d="M15.7658 2.51554C16.0138 1.82815 16.9859 1.82815 17.234 2.51554L18.838 6.96075C18.8718 7.05435 18.9455 7.12806 19.0391 7.16184L23.4843 8.76589C24.1717 9.01393 24.1717 9.98607 23.4843 10.2341L19.0391 11.8382C18.9455 11.8719 18.8718 11.9456 18.838 12.0393L17.234 16.4845C16.9859 17.1718 16.0138 17.1718 15.7658 16.4845L14.1617 12.0393C14.1279 11.9456 14.0542 11.8719 13.9606 11.8382L9.51542 10.2341C8.82803 9.98607 8.82803 9.01393 9.51542 8.76589L13.9606 7.16184C14.0542 7.12806 14.1279 7.05435 14.1617 6.96075L15.7658 2.51554Z" style={{ fill: `var(--type)` }}/>
43
+ <path fillRule="evenodd" clipRule="evenodd" d="M35.7084 7.42368C34.9274 6.64263 33.6611 6.64263 32.88 7.42368L7.42417 32.8795C6.64312 33.6606 6.64312 34.9269 7.42416 35.7079L12.2911 40.5749C13.0722 41.356 14.3385 41.356 15.1196 40.5749L40.5754 15.1191C41.3564 14.338 41.3564 13.0717 40.5754 12.2906L35.7084 7.42368ZM10.2526 34.2937L28.2697 16.2767L31.7224 19.7294L13.7053 37.7465L10.2526 34.2937ZM34.2984 10.257L30.3955 14.1599L33.8403 17.6046L37.7432 13.7018L34.2984 10.257Z" style={{ fill: `var(--type)` }}/>
44
+ <path d="M31.4893 30.3437C31.3239 29.8854 30.6758 29.8854 30.5105 30.3437L29.4411 33.3072C29.4186 33.3696 29.3694 33.4187 29.307 33.4412L26.3436 34.5106C25.8853 34.676 25.8853 35.324 26.3436 35.4894L29.307 36.5588C29.3694 36.5813 29.4186 36.6304 29.4411 36.6928L30.5105 39.6563C30.6758 40.1146 31.3239 40.1146 31.4893 39.6563L32.5587 36.6928C32.5812 36.6304 32.6303 36.5813 32.6927 36.5588L35.6562 35.4894C36.1144 35.324 36.1144 34.676 35.6562 34.5106L32.6927 33.4412C32.6303 33.4187 32.5812 33.3696 32.5587 33.3072L31.4893 30.3437Z" style={{ fill: `var(--type)` }}/>
45
+ <path d="M39.8636 21.4468C40.0786 20.8511 40.9211 20.8511 41.1361 21.4468L42.5263 25.2993C42.5556 25.3804 42.6194 25.4443 42.7006 25.4736L46.5531 26.8638C47.1488 27.0787 47.1488 27.9213 46.5531 28.1362L42.7006 29.5264C42.6194 29.5557 42.5556 29.6196 42.5263 29.7007L41.1361 33.5532C40.9211 34.1489 40.0786 34.1489 39.8636 33.5532L38.4735 29.7007C38.4442 29.6196 38.3803 29.5557 38.2992 29.5264L34.4467 28.1362C33.8509 27.9213 33.8509 27.0787 34.4467 26.8638L38.2992 25.4736C38.3803 25.4443 38.4442 25.3804 38.4735 25.2993L39.8636 21.4468Z" style={{ fill: `var(--type)` }}/>
45
46
  </svg>
46
47
  ;
47
48
  }