@liner-fe/icon 0.0.4 → 0.0.5

package/assets/restaurant/index.tsx

@@ -1,39 +1,40 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface RestaurantProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const Restaurant = ({ fill = false, thick = false, size = 24 }: RestaurantProps) => {
+export const Restaurant = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: RestaurantProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M24.5 19.4502C24.5 21.6891 23.0286 23.5841 21 24.2217V42.499H12V24.2217C9.97156 23.5845 8.5 21.6899 8.5 19.4512V5.80568H11.5V19.4512C11.5 20.5558 12.3954 21.4512 13.5 21.4512H15V39.499H18V21.4512H19.499C20.604 21.4509 21.5 20.5552 21.5 19.4502V5.8047H24.5V19.4502Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M35.4727 6.20997C36.8438 4.27021 39.9997 5.2066 40 7.67384V42.4981H31V28.2979C27.3374 27.4451 25.4495 23.2352 27.4121 19.8975L35.3457 6.40626L35.4727 6.20997ZM29.998 21.418C29.025 23.0728 30.0591 25.184 31.9629 25.4297C33.1274 25.5798 33.9998 26.572 34 27.7461V39.4981H37V9.51076L29.998 21.418Z" fill="currentColor"/>
-<path d="M18 18.4385H15V5.8047H18V18.4385Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M24.5 19.4502C24.5 21.6891 23.0286 23.5841 21 24.2217V42.499H12V24.2217C9.97156 23.5845 8.5 21.6899 8.5 19.4512V5.80568H11.5V19.4512C11.5 20.5558 12.3954 21.4512 13.5 21.4512H15V39.499H18V21.4512H19.499C20.604 21.4509 21.5 20.5552 21.5 19.4502V5.8047H24.5V19.4502Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M35.4727 6.20997C36.8438 4.27021 39.9997 5.2066 40 7.67384V42.4981H31V28.2979C27.3374 27.4451 25.4495 23.2352 27.4121 19.8975L35.3457 6.40626L35.4727 6.20997ZM29.998 21.418C29.025 23.0728 30.0591 25.184 31.9629 25.4297C33.1274 25.5798 33.9998 26.572 34 27.7461V39.4981H37V9.51076L29.998 21.418Z" style={{ fill: `var(--${color})` }}/>
+<path d="M18 18.4385H15V5.8047H18V18.4385Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M24.5 19.4502C24.5 21.6891 23.0286 23.5841 21 24.2217V42.499H12V24.2217C9.97156 23.5845 8.5 21.6899 8.5 19.4512V5.80568H11.5V19.4512C11.5 20.5558 12.3954 21.4512 13.5 21.4512H15V39.499H18V21.4512H19.499C20.604 21.4509 21.5 20.5552 21.5 19.4502V5.8047H24.5V19.4502Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M35.4727 6.20997C36.8438 4.27021 39.9997 5.2066 40 7.67384V42.4981H31V28.2979C27.3374 27.4451 25.4495 23.2352 27.4121 19.8975L35.3457 6.40626L35.4727 6.20997ZM29.998 21.418C29.025 23.0728 30.0591 25.184 31.9629 25.4297C33.1274 25.5798 33.9998 26.572 34 27.7461V39.4981H37V9.51076L29.998 21.418Z" fill="currentColor"/>
-<path d="M18 18.4385H15V5.8047H18V18.4385Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M24.5 19.4502C24.5 21.6891 23.0286 23.5841 21 24.2217V42.499H12V24.2217C9.97156 23.5845 8.5 21.6899 8.5 19.4512V5.80568H11.5V19.4512C11.5 20.5558 12.3954 21.4512 13.5 21.4512H15V39.499H18V21.4512H19.499C20.604 21.4509 21.5 20.5552 21.5 19.4502V5.8047H24.5V19.4502Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M35.4727 6.20997C36.8438 4.27021 39.9997 5.2066 40 7.67384V42.4981H31V28.2979C27.3374 27.4451 25.4495 23.2352 27.4121 19.8975L35.3457 6.40626L35.4727 6.20997ZM29.998 21.418C29.025 23.0728 30.0591 25.184 31.9629 25.4297C33.1274 25.5798 33.9998 26.572 34 27.7461V39.4981H37V9.51076L29.998 21.418Z" style={{ fill: `var(--${color})` }}/>
+<path d="M18 18.4385H15V5.8047H18V18.4385Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M35.0664 5.91893C36.7117 3.59038 40.5 4.71449 40.5 7.67577V43H30.5V28.6826C26.7703 27.5583 24.9163 23.1591 26.9814 19.6465L34.9141 6.15526L35.0664 5.91893ZM30.4297 21.6738C29.6386 23.0195 30.4791 24.7359 32.0273 24.9355C33.4413 25.1179 34.5 26.3224 34.5 27.748V39H36.5V11.3496L30.4297 21.6738Z" fill="currentColor"/>
-<path d="M25 19.4502C25 21.7821 23.5484 23.7736 21.5 24.5742V42.999H11.5V24.5742C9.45172 23.774 8 21.7829 8 19.4512V5.80565H12V19.4512C12 20.2796 12.6716 20.9512 13.5 20.9512H15.5V38.999H17.5V20.9512H19.499C20.3279 20.9509 21 20.279 21 19.4502V5.80467H25V19.4502Z" fill="currentColor"/>
-<path d="M18.5 18.4385H14.5V5.80467H18.5V18.4385Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M35.0664 5.91893C36.7117 3.59038 40.5 4.71449 40.5 7.67577V43H30.5V28.6826C26.7703 27.5583 24.9163 23.1591 26.9814 19.6465L34.9141 6.15526L35.0664 5.91893ZM30.4297 21.6738C29.6386 23.0195 30.4791 24.7359 32.0273 24.9355C33.4413 25.1179 34.5 26.3224 34.5 27.748V39H36.5V11.3496L30.4297 21.6738Z" style={{ fill: `var(--${color})` }}/>
+<path d="M25 19.4502C25 21.7821 23.5484 23.7736 21.5 24.5742V42.999H11.5V24.5742C9.45172 23.774 8 21.7829 8 19.4512V5.80565H12V19.4512C12 20.2796 12.6716 20.9512 13.5 20.9512H15.5V38.999H17.5V20.9512H19.499C20.3279 20.9509 21 20.279 21 19.4502V5.80467H25V19.4502Z" style={{ fill: `var(--${color})` }}/>
+<path d="M18.5 18.4385H14.5V5.80467H18.5V18.4385Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M24.5 19.4502C24.5 21.6891 23.0286 23.5841 21 24.2217V42.499H12V24.2217C9.97156 23.5845 8.5 21.6899 8.5 19.4512V5.80568H11.5V19.4512C11.5 20.5558 12.3954 21.4512 13.5 21.4512H15V39.499H18V21.4512H19.499C20.604 21.4509 21.5 20.5552 21.5 19.4502V5.8047H24.5V19.4502Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M35.4727 6.20997C36.8438 4.27021 39.9997 5.2066 40 7.67384V42.4981H31V28.2979C27.3374 27.4451 25.4495 23.2352 27.4121 19.8975L35.3457 6.40626L35.4727 6.20997ZM29.998 21.418C29.025 23.0728 30.0591 25.184 31.9629 25.4297C33.1274 25.5798 33.9998 26.572 34 27.7461V39.4981H37V9.51076L29.998 21.418Z" fill="currentColor"/>
-<path d="M18 18.4385H15V5.8047H18V18.4385Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M24.5 19.4502C24.5 21.6891 23.0286 23.5841 21 24.2217V42.499H12V24.2217C9.97156 23.5845 8.5 21.6899 8.5 19.4512V5.80568H11.5V19.4512C11.5 20.5558 12.3954 21.4512 13.5 21.4512H15V39.499H18V21.4512H19.499C20.604 21.4509 21.5 20.5552 21.5 19.4502V5.8047H24.5V19.4502Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M35.4727 6.20997C36.8438 4.27021 39.9997 5.2066 40 7.67384V42.4981H31V28.2979C27.3374 27.4451 25.4495 23.2352 27.4121 19.8975L35.3457 6.40626L35.4727 6.20997ZM29.998 21.418C29.025 23.0728 30.0591 25.184 31.9629 25.4297C33.1274 25.5798 33.9998 26.572 34 27.7461V39.4981H37V9.51076L29.998 21.418Z" style={{ fill: `var(--${color})` }}/>
+<path d="M18 18.4385H15V5.8047H18V18.4385Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };

package/assets/retry/index.tsx

@@ -1,31 +1,32 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface RetryProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const Retry = ({ fill = false, thick = false, size = 24 }: RetryProps) => {
+export const Retry = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: RetryProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M23.5 6.5C29.8688 6.5 35.4389 9.90259 38.5 14.9854V7.5H41.5V20H29V17H36.2002C33.7296 12.5278 28.9674 9.5 23.5 9.5C17.189 9.50007 11.8164 13.5333 9.8252 19.167L9.63574 19.7383C9.22259 21.0841 9 22.5149 9 24C9 32.0081 15.4919 38.4999 23.5 38.5C26.2187 38.5 28.7625 37.7505 30.9375 36.4482C30.9786 36.4236 31.0197 36.399 31.0605 36.374C34.2274 34.435 36.5934 31.3153 37.543 27.626C37.8413 26.4671 38 25.2521 38 24H41C41 25.5101 40.8079 26.9752 40.4482 28.373L40.4492 28.374C40.2811 29.0271 40.0752 29.6649 39.8359 30.2861C39.7412 30.5321 39.6405 30.7751 39.5352 31.0156C39.5146 31.0625 39.4946 31.1096 39.4736 31.1562C39.3938 31.3341 39.3101 31.5099 39.2246 31.6846C39.2033 31.7281 39.1828 31.7721 39.1611 31.8154C39.0659 32.0059 38.9672 32.1944 38.8652 32.3809C38.8611 32.3884 38.8567 32.3958 38.8525 32.4033C38.7573 32.577 38.6595 32.7489 38.5586 32.9189C38.5353 32.9581 38.5118 32.9971 38.4883 33.0361C38.3798 33.2157 38.268 33.3931 38.1533 33.5684C38.136 33.5949 38.1181 33.621 38.1006 33.6475C37.7289 34.2088 37.3257 34.7472 36.8936 35.2607C36.8656 35.294 36.8378 35.3273 36.8096 35.3604C36.533 35.6841 36.2445 35.9971 35.9453 36.2998C35.9212 36.3242 35.8983 36.3498 35.874 36.374C35.7293 36.5188 35.5813 36.6602 35.4316 36.7998C35.4018 36.8276 35.3718 36.8552 35.3418 36.8828C35.1997 37.0134 35.0555 37.1416 34.9092 37.2676C34.8638 37.3066 34.8182 37.3452 34.7725 37.3838C34.4548 37.6516 34.1275 37.9083 33.791 38.1533C33.7624 38.1742 33.7338 38.1951 33.7051 38.2158C33.531 38.341 33.3546 38.4631 33.1758 38.582C33.1568 38.5946 33.1381 38.6076 33.1191 38.6201C32.9399 38.7383 32.759 38.8541 32.5752 38.9658C32.5461 38.9835 32.5165 39.0001 32.4873 39.0176C32.3228 39.1162 32.1562 39.2114 31.9883 39.3047C31.9601 39.3203 31.9326 39.337 31.9043 39.3525C31.7186 39.4544 31.5305 39.5522 31.3408 39.6475C31.3109 39.6625 31.281 39.6775 31.251 39.6924C31.0588 39.7875 30.865 39.8796 30.6689 39.9678C30.6495 39.9765 30.6298 39.9845 30.6104 39.9932C30.4344 40.0715 30.2571 40.1471 30.0781 40.2197C30.0286 40.2398 29.9794 40.2606 29.9297 40.2803C29.9051 40.29 29.8801 40.299 29.8555 40.3086C29.7657 40.3436 29.6755 40.3776 29.585 40.4111C29.5408 40.4275 29.4965 40.4439 29.4521 40.46C28.94 40.6452 28.417 40.8078 27.8838 40.9453C27.8672 40.9496 27.8506 40.9538 27.834 40.958C27.7133 40.9887 27.5923 41.0187 27.4707 41.0469C27.4515 41.0513 27.4323 41.0552 27.4131 41.0596C27.3099 41.0831 27.2064 41.1052 27.1025 41.127C27.0463 41.1387 26.9901 41.1509 26.9336 41.1621C26.8661 41.1755 26.7983 41.1875 26.7305 41.2002C26.6632 41.2128 26.5959 41.2255 26.5283 41.2373C26.464 41.2485 26.3995 41.259 26.335 41.2695C26.2689 41.2803 26.203 41.2917 26.1367 41.3018C26.1328 41.3024 26.129 41.3041 26.125 41.3047L25.7285 41.3594C25.6922 41.364 25.6556 41.3667 25.6191 41.3711C25.5172 41.3834 25.415 41.3957 25.3125 41.4062C25.2836 41.4092 25.2546 41.4112 25.2256 41.4141C25.1246 41.4239 25.0234 41.4332 24.9219 41.4414C24.8653 41.446 24.8087 41.4511 24.752 41.4551C24.6743 41.4606 24.5965 41.4653 24.5186 41.4697C24.448 41.4738 24.3774 41.4773 24.3066 41.4805C24.2264 41.4841 24.146 41.4867 24.0654 41.4893C24.0209 41.4907 23.9763 41.4931 23.9316 41.4941C23.7882 41.4976 23.6443 41.5 23.5 41.5C13.8351 41.4999 6 33.6649 6 24C6 22.0849 6.30843 20.239 6.87891 18.5107L6.99609 18.167C9.39774 11.3721 15.8781 6.50007 23.5 6.5Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.5 6.5C29.8688 6.5 35.4389 9.90259 38.5 14.9854V7.5H41.5V20H29V17H36.2002C33.7296 12.5278 28.9674 9.5 23.5 9.5C17.189 9.50007 11.8164 13.5333 9.8252 19.167L9.63574 19.7383C9.22259 21.0841 9 22.5149 9 24C9 32.0081 15.4919 38.4999 23.5 38.5C26.2187 38.5 28.7625 37.7505 30.9375 36.4482C30.9786 36.4236 31.0197 36.399 31.0605 36.374C34.2274 34.435 36.5934 31.3153 37.543 27.626C37.8413 26.4671 38 25.2521 38 24H41C41 25.5101 40.8079 26.9752 40.4482 28.373L40.4492 28.374C40.2811 29.0271 40.0752 29.6649 39.8359 30.2861C39.7412 30.5321 39.6405 30.7751 39.5352 31.0156C39.5146 31.0625 39.4946 31.1096 39.4736 31.1562C39.3938 31.3341 39.3101 31.5099 39.2246 31.6846C39.2033 31.7281 39.1828 31.7721 39.1611 31.8154C39.0659 32.0059 38.9672 32.1944 38.8652 32.3809C38.8611 32.3884 38.8567 32.3958 38.8525 32.4033C38.7573 32.577 38.6595 32.7489 38.5586 32.9189C38.5353 32.9581 38.5118 32.9971 38.4883 33.0361C38.3798 33.2157 38.268 33.3931 38.1533 33.5684C38.136 33.5949 38.1181 33.621 38.1006 33.6475C37.7289 34.2088 37.3257 34.7472 36.8936 35.2607C36.8656 35.294 36.8378 35.3273 36.8096 35.3604C36.533 35.6841 36.2445 35.9971 35.9453 36.2998C35.9212 36.3242 35.8983 36.3498 35.874 36.374C35.7293 36.5188 35.5813 36.6602 35.4316 36.7998C35.4018 36.8276 35.3718 36.8552 35.3418 36.8828C35.1997 37.0134 35.0555 37.1416 34.9092 37.2676C34.8638 37.3066 34.8182 37.3452 34.7725 37.3838C34.4548 37.6516 34.1275 37.9083 33.791 38.1533C33.7624 38.1742 33.7338 38.1951 33.7051 38.2158C33.531 38.341 33.3546 38.4631 33.1758 38.582C33.1568 38.5946 33.1381 38.6076 33.1191 38.6201C32.9399 38.7383 32.759 38.8541 32.5752 38.9658C32.5461 38.9835 32.5165 39.0001 32.4873 39.0176C32.3228 39.1162 32.1562 39.2114 31.9883 39.3047C31.9601 39.3203 31.9326 39.337 31.9043 39.3525C31.7186 39.4544 31.5305 39.5522 31.3408 39.6475C31.3109 39.6625 31.281 39.6775 31.251 39.6924C31.0588 39.7875 30.865 39.8796 30.6689 39.9678C30.6495 39.9765 30.6298 39.9845 30.6104 39.9932C30.4344 40.0715 30.2571 40.1471 30.0781 40.2197C30.0286 40.2398 29.9794 40.2606 29.9297 40.2803C29.9051 40.29 29.8801 40.299 29.8555 40.3086C29.7657 40.3436 29.6755 40.3776 29.585 40.4111C29.5408 40.4275 29.4965 40.4439 29.4521 40.46C28.94 40.6452 28.417 40.8078 27.8838 40.9453C27.8672 40.9496 27.8506 40.9538 27.834 40.958C27.7133 40.9887 27.5923 41.0187 27.4707 41.0469C27.4515 41.0513 27.4323 41.0552 27.4131 41.0596C27.3099 41.0831 27.2064 41.1052 27.1025 41.127C27.0463 41.1387 26.9901 41.1509 26.9336 41.1621C26.8661 41.1755 26.7983 41.1875 26.7305 41.2002C26.6632 41.2128 26.5959 41.2255 26.5283 41.2373C26.464 41.2485 26.3995 41.259 26.335 41.2695C26.2689 41.2803 26.203 41.2917 26.1367 41.3018C26.1328 41.3024 26.129 41.3041 26.125 41.3047L25.7285 41.3594C25.6922 41.364 25.6556 41.3667 25.6191 41.3711C25.5172 41.3834 25.415 41.3957 25.3125 41.4062C25.2836 41.4092 25.2546 41.4112 25.2256 41.4141C25.1246 41.4239 25.0234 41.4332 24.9219 41.4414C24.8653 41.446 24.8087 41.4511 24.752 41.4551C24.6743 41.4606 24.5965 41.4653 24.5186 41.4697C24.448 41.4738 24.3774 41.4773 24.3066 41.4805C24.2264 41.4841 24.146 41.4867 24.0654 41.4893C24.0209 41.4907 23.9763 41.4931 23.9316 41.4941C23.7882 41.4976 23.6443 41.5 23.5 41.5C13.8351 41.4999 6 33.6649 6 24C6 22.0849 6.30843 20.239 6.87891 18.5107L6.99609 18.167C9.39774 11.3721 15.8781 6.50007 23.5 6.5Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M23.5 6.5C29.8688 6.5 35.4389 9.90259 38.5 14.9854V7.5H41.5V20H29V17H36.2002C33.7296 12.5278 28.9674 9.5 23.5 9.5C17.189 9.50007 11.8164 13.5333 9.8252 19.167L9.63574 19.7383C9.22259 21.0841 9 22.5149 9 24C9 32.0081 15.4919 38.4999 23.5 38.5C26.2187 38.5 28.7625 37.7505 30.9375 36.4482C30.9786 36.4236 31.0197 36.399 31.0605 36.374C34.2274 34.435 36.5934 31.3153 37.543 27.626C37.8413 26.4671 38 25.2521 38 24H41C41 25.5101 40.8079 26.9752 40.4482 28.373L40.4492 28.374C40.2811 29.0271 40.0752 29.6649 39.8359 30.2861C39.7412 30.5321 39.6405 30.7751 39.5352 31.0156C39.5146 31.0625 39.4946 31.1096 39.4736 31.1562C39.3938 31.3341 39.3101 31.5099 39.2246 31.6846C39.2033 31.7281 39.1828 31.7721 39.1611 31.8154C39.0659 32.0059 38.9672 32.1944 38.8652 32.3809C38.8611 32.3884 38.8567 32.3958 38.8525 32.4033C38.7573 32.577 38.6595 32.7489 38.5586 32.9189C38.5353 32.9581 38.5118 32.9971 38.4883 33.0361C38.3798 33.2157 38.268 33.3931 38.1533 33.5684C38.136 33.5949 38.1181 33.621 38.1006 33.6475C37.7289 34.2088 37.3257 34.7472 36.8936 35.2607C36.8656 35.294 36.8378 35.3273 36.8096 35.3604C36.533 35.6841 36.2445 35.9971 35.9453 36.2998C35.9212 36.3242 35.8983 36.3498 35.874 36.374C35.7293 36.5188 35.5813 36.6602 35.4316 36.7998C35.4018 36.8276 35.3718 36.8552 35.3418 36.8828C35.1997 37.0134 35.0555 37.1416 34.9092 37.2676C34.8638 37.3066 34.8182 37.3452 34.7725 37.3838C34.4548 37.6516 34.1275 37.9083 33.791 38.1533C33.7624 38.1742 33.7338 38.1951 33.7051 38.2158C33.531 38.341 33.3546 38.4631 33.1758 38.582C33.1568 38.5946 33.1381 38.6076 33.1191 38.6201C32.9399 38.7383 32.759 38.8541 32.5752 38.9658C32.5461 38.9835 32.5165 39.0001 32.4873 39.0176C32.3228 39.1162 32.1562 39.2114 31.9883 39.3047C31.9601 39.3203 31.9326 39.337 31.9043 39.3525C31.7186 39.4544 31.5305 39.5522 31.3408 39.6475C31.3109 39.6625 31.281 39.6775 31.251 39.6924C31.0588 39.7875 30.865 39.8796 30.6689 39.9678C30.6495 39.9765 30.6298 39.9845 30.6104 39.9932C30.4344 40.0715 30.2571 40.1471 30.0781 40.2197C30.0286 40.2398 29.9794 40.2606 29.9297 40.2803C29.9051 40.29 29.8801 40.299 29.8555 40.3086C29.7657 40.3436 29.6755 40.3776 29.585 40.4111C29.5408 40.4275 29.4965 40.4439 29.4521 40.46C28.94 40.6452 28.417 40.8078 27.8838 40.9453C27.8672 40.9496 27.8506 40.9538 27.834 40.958C27.7133 40.9887 27.5923 41.0187 27.4707 41.0469C27.4515 41.0513 27.4323 41.0552 27.4131 41.0596C27.3099 41.0831 27.2064 41.1052 27.1025 41.127C27.0463 41.1387 26.9901 41.1509 26.9336 41.1621C26.8661 41.1755 26.7983 41.1875 26.7305 41.2002C26.6632 41.2128 26.5959 41.2255 26.5283 41.2373C26.464 41.2485 26.3995 41.259 26.335 41.2695C26.2689 41.2803 26.203 41.2917 26.1367 41.3018C26.1328 41.3024 26.129 41.3041 26.125 41.3047L25.7285 41.3594C25.6922 41.364 25.6556 41.3667 25.6191 41.3711C25.5172 41.3834 25.415 41.3957 25.3125 41.4062C25.2836 41.4092 25.2546 41.4112 25.2256 41.4141C25.1246 41.4239 25.0234 41.4332 24.9219 41.4414C24.8653 41.446 24.8087 41.4511 24.752 41.4551C24.6743 41.4606 24.5965 41.4653 24.5186 41.4697C24.448 41.4738 24.3774 41.4773 24.3066 41.4805C24.2264 41.4841 24.146 41.4867 24.0654 41.4893C24.0209 41.4907 23.9763 41.4931 23.9316 41.4941C23.7882 41.4976 23.6443 41.5 23.5 41.5C13.8351 41.4999 6 33.6649 6 24C6 22.0849 6.30843 20.239 6.87891 18.5107L6.99609 18.167C9.39774 11.3721 15.8781 6.50007 23.5 6.5Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.5 6.5C29.8688 6.5 35.4389 9.90259 38.5 14.9854V7.5H41.5V20H29V17H36.2002C33.7296 12.5278 28.9674 9.5 23.5 9.5C17.189 9.50007 11.8164 13.5333 9.8252 19.167L9.63574 19.7383C9.22259 21.0841 9 22.5149 9 24C9 32.0081 15.4919 38.4999 23.5 38.5C26.2187 38.5 28.7625 37.7505 30.9375 36.4482C30.9786 36.4236 31.0197 36.399 31.0605 36.374C34.2274 34.435 36.5934 31.3153 37.543 27.626C37.8413 26.4671 38 25.2521 38 24H41C41 25.5101 40.8079 26.9752 40.4482 28.373L40.4492 28.374C40.2811 29.0271 40.0752 29.6649 39.8359 30.2861C39.7412 30.5321 39.6405 30.7751 39.5352 31.0156C39.5146 31.0625 39.4946 31.1096 39.4736 31.1562C39.3938 31.3341 39.3101 31.5099 39.2246 31.6846C39.2033 31.7281 39.1828 31.7721 39.1611 31.8154C39.0659 32.0059 38.9672 32.1944 38.8652 32.3809C38.8611 32.3884 38.8567 32.3958 38.8525 32.4033C38.7573 32.577 38.6595 32.7489 38.5586 32.9189C38.5353 32.9581 38.5118 32.9971 38.4883 33.0361C38.3798 33.2157 38.268 33.3931 38.1533 33.5684C38.136 33.5949 38.1181 33.621 38.1006 33.6475C37.7289 34.2088 37.3257 34.7472 36.8936 35.2607C36.8656 35.294 36.8378 35.3273 36.8096 35.3604C36.533 35.6841 36.2445 35.9971 35.9453 36.2998C35.9212 36.3242 35.8983 36.3498 35.874 36.374C35.7293 36.5188 35.5813 36.6602 35.4316 36.7998C35.4018 36.8276 35.3718 36.8552 35.3418 36.8828C35.1997 37.0134 35.0555 37.1416 34.9092 37.2676C34.8638 37.3066 34.8182 37.3452 34.7725 37.3838C34.4548 37.6516 34.1275 37.9083 33.791 38.1533C33.7624 38.1742 33.7338 38.1951 33.7051 38.2158C33.531 38.341 33.3546 38.4631 33.1758 38.582C33.1568 38.5946 33.1381 38.6076 33.1191 38.6201C32.9399 38.7383 32.759 38.8541 32.5752 38.9658C32.5461 38.9835 32.5165 39.0001 32.4873 39.0176C32.3228 39.1162 32.1562 39.2114 31.9883 39.3047C31.9601 39.3203 31.9326 39.337 31.9043 39.3525C31.7186 39.4544 31.5305 39.5522 31.3408 39.6475C31.3109 39.6625 31.281 39.6775 31.251 39.6924C31.0588 39.7875 30.865 39.8796 30.6689 39.9678C30.6495 39.9765 30.6298 39.9845 30.6104 39.9932C30.4344 40.0715 30.2571 40.1471 30.0781 40.2197C30.0286 40.2398 29.9794 40.2606 29.9297 40.2803C29.9051 40.29 29.8801 40.299 29.8555 40.3086C29.7657 40.3436 29.6755 40.3776 29.585 40.4111C29.5408 40.4275 29.4965 40.4439 29.4521 40.46C28.94 40.6452 28.417 40.8078 27.8838 40.9453C27.8672 40.9496 27.8506 40.9538 27.834 40.958C27.7133 40.9887 27.5923 41.0187 27.4707 41.0469C27.4515 41.0513 27.4323 41.0552 27.4131 41.0596C27.3099 41.0831 27.2064 41.1052 27.1025 41.127C27.0463 41.1387 26.9901 41.1509 26.9336 41.1621C26.8661 41.1755 26.7983 41.1875 26.7305 41.2002C26.6632 41.2128 26.5959 41.2255 26.5283 41.2373C26.464 41.2485 26.3995 41.259 26.335 41.2695C26.2689 41.2803 26.203 41.2917 26.1367 41.3018C26.1328 41.3024 26.129 41.3041 26.125 41.3047L25.7285 41.3594C25.6922 41.364 25.6556 41.3667 25.6191 41.3711C25.5172 41.3834 25.415 41.3957 25.3125 41.4062C25.2836 41.4092 25.2546 41.4112 25.2256 41.4141C25.1246 41.4239 25.0234 41.4332 24.9219 41.4414C24.8653 41.446 24.8087 41.4511 24.752 41.4551C24.6743 41.4606 24.5965 41.4653 24.5186 41.4697C24.448 41.4738 24.3774 41.4773 24.3066 41.4805C24.2264 41.4841 24.146 41.4867 24.0654 41.4893C24.0209 41.4907 23.9763 41.4931 23.9316 41.4941C23.7882 41.4976 23.6443 41.5 23.5 41.5C13.8351 41.4999 6 33.6649 6 24C6 22.0849 6.30843 20.239 6.87891 18.5107L6.99609 18.167C9.39774 11.3721 15.8781 6.50007 23.5 6.5Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11.2718 11.2721C18.3012 4.24264 29.6984 4.24264 36.7278 11.2721C37.591 12.1353 38.348 13.0664 39.0003 14.0475V7.00059H43.0003V20.0006H30.0003V16.0006H35.4896C35.0242 15.3341 34.496 14.6965 33.8997 14.1002C28.4324 8.63293 19.5682 8.63305 14.1009 14.1002C8.63354 19.5675 8.63354 28.4317 14.1009 33.899C19.5682 39.3662 28.4324 39.3663 33.8997 33.899C34.0587 33.74 34.2129 33.5781 34.3626 33.4137C35.2582 32.4283 36.0143 31.3143 36.6019 30.1031C36.6806 29.9405 36.7563 29.7768 36.8284 29.6119C36.8452 29.5736 36.8618 29.5352 36.8782 29.4967L36.9212 29.3971C36.9941 29.2228 37.0632 29.0466 37.1292 28.8688C37.3601 28.2443 37.5459 27.6066 37.6849 26.9606L37.7523 26.6266C37.9137 25.7759 38.0003 24.8982 38.0003 24.0006H42.0003C42.0003 26.5272 41.4781 28.9319 40.5384 31.1139L40.5208 31.1559C40.5177 31.1631 40.5142 31.1701 40.511 31.1774C40.4644 31.2845 40.4161 31.3907 40.3675 31.4967C40.355 31.524 40.343 31.5515 40.3304 31.5787C40.287 31.672 40.2425 31.7646 40.1976 31.857C40.1589 31.9368 40.1193 32.0161 40.0794 32.0953C40.058 32.1377 40.0367 32.1801 40.0149 32.2223C39.9883 32.2741 39.962 32.326 39.9349 32.3775C39.8277 32.5809 39.7174 32.7824 39.6028 32.9811C39.4239 33.2916 39.2344 33.5975 39.0355 33.899C38.9952 33.96 38.9553 34.0212 38.9144 34.0816C38.6845 34.421 38.4422 34.7544 38.1868 35.0807C37.3686 36.1268 36.4366 37.0794 35.4105 37.9215C35.3459 37.9745 35.2802 38.0258 35.2151 38.0777C35.167 38.1162 35.1192 38.155 35.0706 38.193C34.9977 38.25 34.9244 38.3062 34.8509 38.3619C34.8088 38.3938 34.7663 38.4252 34.7239 38.4566C34.66 38.5042 34.596 38.5516 34.5315 38.5983C34.4701 38.6427 34.4081 38.6864 34.346 38.7301C34.2711 38.7828 34.1959 38.8349 34.1204 38.8863C34.0912 38.9063 34.0619 38.9262 34.0325 38.9459C33.9302 39.0148 33.8274 39.0825 33.7239 39.149C33.7093 39.1585 33.6947 39.168 33.68 39.1774C33.5873 39.2366 33.4942 39.2948 33.4007 39.3522C33.3504 39.383 33.2999 39.4136 33.2493 39.444C33.175 39.4885 33.1005 39.5324 33.0257 39.5758C32.9837 39.6002 32.9419 39.625 32.8997 39.649C32.8179 39.6956 32.736 39.7415 32.6536 39.7867C32.5869 39.8234 32.5197 39.8593 32.4524 39.8951C32.405 39.9204 32.3575 39.9455 32.3099 39.9703C32.2243 40.0149 32.1384 40.0589 32.0521 40.1022C32.0082 40.1241 31.9643 40.146 31.9202 40.1676C31.8292 40.2123 31.7377 40.2562 31.6458 40.2994C31.6065 40.3179 31.5671 40.336 31.5276 40.3541C29.6089 41.2388 27.5085 41.7952 25.2972 41.9527C25.2916 41.9531 25.2861 41.9533 25.2806 41.9537C24.8576 41.9835 24.4308 42.0006 24.0003 42.0006C19.3936 42.0007 14.7866 40.242 11.2718 36.7272C4.24274 29.6978 4.24274 18.3014 11.2718 11.2721Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.2718 11.2721C18.3012 4.24264 29.6984 4.24264 36.7278 11.2721C37.591 12.1353 38.348 13.0664 39.0003 14.0475V7.00059H43.0003V20.0006H30.0003V16.0006H35.4896C35.0242 15.3341 34.496 14.6965 33.8997 14.1002C28.4324 8.63293 19.5682 8.63305 14.1009 14.1002C8.63354 19.5675 8.63354 28.4317 14.1009 33.899C19.5682 39.3662 28.4324 39.3663 33.8997 33.899C34.0587 33.74 34.2129 33.5781 34.3626 33.4137C35.2582 32.4283 36.0143 31.3143 36.6019 30.1031C36.6806 29.9405 36.7563 29.7768 36.8284 29.6119C36.8452 29.5736 36.8618 29.5352 36.8782 29.4967L36.9212 29.3971C36.9941 29.2228 37.0632 29.0466 37.1292 28.8688C37.3601 28.2443 37.5459 27.6066 37.6849 26.9606L37.7523 26.6266C37.9137 25.7759 38.0003 24.8982 38.0003 24.0006H42.0003C42.0003 26.5272 41.4781 28.9319 40.5384 31.1139L40.5208 31.1559C40.5177 31.1631 40.5142 31.1701 40.511 31.1774C40.4644 31.2845 40.4161 31.3907 40.3675 31.4967C40.355 31.524 40.343 31.5515 40.3304 31.5787C40.287 31.672 40.2425 31.7646 40.1976 31.857C40.1589 31.9368 40.1193 32.0161 40.0794 32.0953C40.058 32.1377 40.0367 32.1801 40.0149 32.2223C39.9883 32.2741 39.962 32.326 39.9349 32.3775C39.8277 32.5809 39.7174 32.7824 39.6028 32.9811C39.4239 33.2916 39.2344 33.5975 39.0355 33.899C38.9952 33.96 38.9553 34.0212 38.9144 34.0816C38.6845 34.421 38.4422 34.7544 38.1868 35.0807C37.3686 36.1268 36.4366 37.0794 35.4105 37.9215C35.3459 37.9745 35.2802 38.0258 35.2151 38.0777C35.167 38.1162 35.1192 38.155 35.0706 38.193C34.9977 38.25 34.9244 38.3062 34.8509 38.3619C34.8088 38.3938 34.7663 38.4252 34.7239 38.4566C34.66 38.5042 34.596 38.5516 34.5315 38.5983C34.4701 38.6427 34.4081 38.6864 34.346 38.7301C34.2711 38.7828 34.1959 38.8349 34.1204 38.8863C34.0912 38.9063 34.0619 38.9262 34.0325 38.9459C33.9302 39.0148 33.8274 39.0825 33.7239 39.149C33.7093 39.1585 33.6947 39.168 33.68 39.1774C33.5873 39.2366 33.4942 39.2948 33.4007 39.3522C33.3504 39.383 33.2999 39.4136 33.2493 39.444C33.175 39.4885 33.1005 39.5324 33.0257 39.5758C32.9837 39.6002 32.9419 39.625 32.8997 39.649C32.8179 39.6956 32.736 39.7415 32.6536 39.7867C32.5869 39.8234 32.5197 39.8593 32.4524 39.8951C32.405 39.9204 32.3575 39.9455 32.3099 39.9703C32.2243 40.0149 32.1384 40.0589 32.0521 40.1022C32.0082 40.1241 31.9643 40.146 31.9202 40.1676C31.8292 40.2123 31.7377 40.2562 31.6458 40.2994C31.6065 40.3179 31.5671 40.336 31.5276 40.3541C29.6089 41.2388 27.5085 41.7952 25.2972 41.9527C25.2916 41.9531 25.2861 41.9533 25.2806 41.9537C24.8576 41.9835 24.4308 42.0006 24.0003 42.0006C19.3936 42.0007 14.7866 40.242 11.2718 36.7272C4.24274 29.6978 4.24274 18.3014 11.2718 11.2721Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M23.5 6.5C29.8688 6.5 35.4389 9.90259 38.5 14.9854V7.5H41.5V20H29V17H36.2002C33.7296 12.5278 28.9674 9.5 23.5 9.5C17.189 9.50007 11.8164 13.5333 9.8252 19.167L9.63574 19.7383C9.22259 21.0841 9 22.5149 9 24C9 32.0081 15.4919 38.4999 23.5 38.5C26.2187 38.5 28.7625 37.7505 30.9375 36.4482C30.9786 36.4236 31.0197 36.399 31.0605 36.374C34.2274 34.435 36.5934 31.3153 37.543 27.626C37.8413 26.4671 38 25.2521 38 24H41C41 25.5101 40.8079 26.9752 40.4482 28.373L40.4492 28.374C40.2811 29.0271 40.0752 29.6649 39.8359 30.2861C39.7412 30.5321 39.6405 30.7751 39.5352 31.0156C39.5146 31.0625 39.4946 31.1096 39.4736 31.1562C39.3938 31.3341 39.3101 31.5099 39.2246 31.6846C39.2033 31.7281 39.1828 31.7721 39.1611 31.8154C39.0659 32.0059 38.9672 32.1944 38.8652 32.3809C38.8611 32.3884 38.8567 32.3958 38.8525 32.4033C38.7573 32.577 38.6595 32.7489 38.5586 32.9189C38.5353 32.9581 38.5118 32.9971 38.4883 33.0361C38.3798 33.2157 38.268 33.3931 38.1533 33.5684C38.136 33.5949 38.1181 33.621 38.1006 33.6475C37.7289 34.2088 37.3257 34.7472 36.8936 35.2607C36.8656 35.294 36.8378 35.3273 36.8096 35.3604C36.533 35.6841 36.2445 35.9971 35.9453 36.2998C35.9212 36.3242 35.8983 36.3498 35.874 36.374C35.7293 36.5188 35.5813 36.6602 35.4316 36.7998C35.4018 36.8276 35.3718 36.8552 35.3418 36.8828C35.1997 37.0134 35.0555 37.1416 34.9092 37.2676C34.8638 37.3066 34.8182 37.3452 34.7725 37.3838C34.4548 37.6516 34.1275 37.9083 33.791 38.1533C33.7624 38.1742 33.7338 38.1951 33.7051 38.2158C33.531 38.341 33.3546 38.4631 33.1758 38.582C33.1568 38.5946 33.1381 38.6076 33.1191 38.6201C32.9399 38.7383 32.759 38.8541 32.5752 38.9658C32.5461 38.9835 32.5165 39.0001 32.4873 39.0176C32.3228 39.1162 32.1562 39.2114 31.9883 39.3047C31.9601 39.3203 31.9326 39.337 31.9043 39.3525C31.7186 39.4544 31.5305 39.5522 31.3408 39.6475C31.3109 39.6625 31.281 39.6775 31.251 39.6924C31.0588 39.7875 30.865 39.8796 30.6689 39.9678C30.6495 39.9765 30.6298 39.9845 30.6104 39.9932C30.4344 40.0715 30.2571 40.1471 30.0781 40.2197C30.0286 40.2398 29.9794 40.2606 29.9297 40.2803C29.9051 40.29 29.8801 40.299 29.8555 40.3086C29.7657 40.3436 29.6755 40.3776 29.585 40.4111C29.5408 40.4275 29.4965 40.4439 29.4521 40.46C28.94 40.6452 28.417 40.8078 27.8838 40.9453C27.8672 40.9496 27.8506 40.9538 27.834 40.958C27.7133 40.9887 27.5923 41.0187 27.4707 41.0469C27.4515 41.0513 27.4323 41.0552 27.4131 41.0596C27.3099 41.0831 27.2064 41.1052 27.1025 41.127C27.0463 41.1387 26.9901 41.1509 26.9336 41.1621C26.8661 41.1755 26.7983 41.1875 26.7305 41.2002C26.6632 41.2128 26.5959 41.2255 26.5283 41.2373C26.464 41.2485 26.3995 41.259 26.335 41.2695C26.2689 41.2803 26.203 41.2917 26.1367 41.3018C26.1328 41.3024 26.129 41.3041 26.125 41.3047L25.7285 41.3594C25.6922 41.364 25.6556 41.3667 25.6191 41.3711C25.5172 41.3834 25.415 41.3957 25.3125 41.4062C25.2836 41.4092 25.2546 41.4112 25.2256 41.4141C25.1246 41.4239 25.0234 41.4332 24.9219 41.4414C24.8653 41.446 24.8087 41.4511 24.752 41.4551C24.6743 41.4606 24.5965 41.4653 24.5186 41.4697C24.448 41.4738 24.3774 41.4773 24.3066 41.4805C24.2264 41.4841 24.146 41.4867 24.0654 41.4893C24.0209 41.4907 23.9763 41.4931 23.9316 41.4941C23.7882 41.4976 23.6443 41.5 23.5 41.5C13.8351 41.4999 6 33.6649 6 24C6 22.0849 6.30843 20.239 6.87891 18.5107L6.99609 18.167C9.39774 11.3721 15.8781 6.50007 23.5 6.5Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.5 6.5C29.8688 6.5 35.4389 9.90259 38.5 14.9854V7.5H41.5V20H29V17H36.2002C33.7296 12.5278 28.9674 9.5 23.5 9.5C17.189 9.50007 11.8164 13.5333 9.8252 19.167L9.63574 19.7383C9.22259 21.0841 9 22.5149 9 24C9 32.0081 15.4919 38.4999 23.5 38.5C26.2187 38.5 28.7625 37.7505 30.9375 36.4482C30.9786 36.4236 31.0197 36.399 31.0605 36.374C34.2274 34.435 36.5934 31.3153 37.543 27.626C37.8413 26.4671 38 25.2521 38 24H41C41 25.5101 40.8079 26.9752 40.4482 28.373L40.4492 28.374C40.2811 29.0271 40.0752 29.6649 39.8359 30.2861C39.7412 30.5321 39.6405 30.7751 39.5352 31.0156C39.5146 31.0625 39.4946 31.1096 39.4736 31.1562C39.3938 31.3341 39.3101 31.5099 39.2246 31.6846C39.2033 31.7281 39.1828 31.7721 39.1611 31.8154C39.0659 32.0059 38.9672 32.1944 38.8652 32.3809C38.8611 32.3884 38.8567 32.3958 38.8525 32.4033C38.7573 32.577 38.6595 32.7489 38.5586 32.9189C38.5353 32.9581 38.5118 32.9971 38.4883 33.0361C38.3798 33.2157 38.268 33.3931 38.1533 33.5684C38.136 33.5949 38.1181 33.621 38.1006 33.6475C37.7289 34.2088 37.3257 34.7472 36.8936 35.2607C36.8656 35.294 36.8378 35.3273 36.8096 35.3604C36.533 35.6841 36.2445 35.9971 35.9453 36.2998C35.9212 36.3242 35.8983 36.3498 35.874 36.374C35.7293 36.5188 35.5813 36.6602 35.4316 36.7998C35.4018 36.8276 35.3718 36.8552 35.3418 36.8828C35.1997 37.0134 35.0555 37.1416 34.9092 37.2676C34.8638 37.3066 34.8182 37.3452 34.7725 37.3838C34.4548 37.6516 34.1275 37.9083 33.791 38.1533C33.7624 38.1742 33.7338 38.1951 33.7051 38.2158C33.531 38.341 33.3546 38.4631 33.1758 38.582C33.1568 38.5946 33.1381 38.6076 33.1191 38.6201C32.9399 38.7383 32.759 38.8541 32.5752 38.9658C32.5461 38.9835 32.5165 39.0001 32.4873 39.0176C32.3228 39.1162 32.1562 39.2114 31.9883 39.3047C31.9601 39.3203 31.9326 39.337 31.9043 39.3525C31.7186 39.4544 31.5305 39.5522 31.3408 39.6475C31.3109 39.6625 31.281 39.6775 31.251 39.6924C31.0588 39.7875 30.865 39.8796 30.6689 39.9678C30.6495 39.9765 30.6298 39.9845 30.6104 39.9932C30.4344 40.0715 30.2571 40.1471 30.0781 40.2197C30.0286 40.2398 29.9794 40.2606 29.9297 40.2803C29.9051 40.29 29.8801 40.299 29.8555 40.3086C29.7657 40.3436 29.6755 40.3776 29.585 40.4111C29.5408 40.4275 29.4965 40.4439 29.4521 40.46C28.94 40.6452 28.417 40.8078 27.8838 40.9453C27.8672 40.9496 27.8506 40.9538 27.834 40.958C27.7133 40.9887 27.5923 41.0187 27.4707 41.0469C27.4515 41.0513 27.4323 41.0552 27.4131 41.0596C27.3099 41.0831 27.2064 41.1052 27.1025 41.127C27.0463 41.1387 26.9901 41.1509 26.9336 41.1621C26.8661 41.1755 26.7983 41.1875 26.7305 41.2002C26.6632 41.2128 26.5959 41.2255 26.5283 41.2373C26.464 41.2485 26.3995 41.259 26.335 41.2695C26.2689 41.2803 26.203 41.2917 26.1367 41.3018C26.1328 41.3024 26.129 41.3041 26.125 41.3047L25.7285 41.3594C25.6922 41.364 25.6556 41.3667 25.6191 41.3711C25.5172 41.3834 25.415 41.3957 25.3125 41.4062C25.2836 41.4092 25.2546 41.4112 25.2256 41.4141C25.1246 41.4239 25.0234 41.4332 24.9219 41.4414C24.8653 41.446 24.8087 41.4511 24.752 41.4551C24.6743 41.4606 24.5965 41.4653 24.5186 41.4697C24.448 41.4738 24.3774 41.4773 24.3066 41.4805C24.2264 41.4841 24.146 41.4867 24.0654 41.4893C24.0209 41.4907 23.9763 41.4931 23.9316 41.4941C23.7882 41.4976 23.6443 41.5 23.5 41.5C13.8351 41.4999 6 33.6649 6 24C6 22.0849 6.30843 20.239 6.87891 18.5107L6.99609 18.167C9.39774 11.3721 15.8781 6.50007 23.5 6.5Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };

package/assets/rocket/index.tsx

@@ -1,35 +1,36 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface RocketProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const Rocket = ({ fill = false, thick = false, size = 24 }: RocketProps) => {
+export const Rocket = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: RocketProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M31.2499 19.0973C32.3545 19.0973 33.2499 18.2019 33.2499 17.0973C33.2499 15.9927 32.3545 15.0973 31.2499 15.0973C30.1454 15.0973 29.2499 15.9927 29.2499 17.0973C29.2499 18.2019 30.1454 19.0973 31.2499 19.0973Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M34.3613 24.7649L32.548 26.5879L32.5615 26.6128C34.6931 30.5673 34.0891 35.6066 30.7494 38.9462L27.2614 42.4343C27.0164 42.6793 26.6191 42.6793 26.374 42.4343L21.1606 37.2207L18.3322 40.0492C17.5511 40.8302 16.2848 40.8302 15.5037 40.0492L8.43267 32.9781C7.65162 32.1971 7.65163 30.9307 8.43267 30.1497L11.2606 27.3217L5.32761 21.3887C5.01124 21.0723 5.01124 20.5594 5.32761 20.243L7.77511 17.7955C11.6222 13.9484 17.4769 13.3326 21.9667 15.948L21.9717 15.9509L23.7415 14.1715C28.262 9.62657 34.1399 6.67775 40.4857 5.77121C41.7837 5.58578 42.8957 6.7022 42.7103 8.00017C41.805 14.3369 38.8753 20.2265 34.3613 24.7649ZM15.903 26.3063L25.8685 16.2871C29.5927 12.5429 34.3424 10.0045 39.5013 8.98121C38.4807 14.1421 35.9558 18.9076 32.2342 22.6493L22.2642 32.6675L20.0993 30.5026L25.0484 25.5535L22.9271 23.4322L17.978 28.3813L15.903 26.3063ZM23.6831 35.5006L26.8177 38.6353L28.6281 36.8249C30.7787 34.6743 31.3375 31.5346 30.3043 28.8701L25.414 33.7604L23.6831 35.5006ZM13.3828 29.4422L11.2611 31.5639L16.918 37.2207L19.0396 35.0991L13.3828 29.4422ZM13.0481 24.8666L19.745 18.1697C16.5162 16.6711 12.5598 17.2535 9.89643 19.9168L8.99741 20.8159L13.0481 24.8666Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31.2499 19.0973C32.3545 19.0973 33.2499 18.2019 33.2499 17.0973C33.2499 15.9927 32.3545 15.0973 31.2499 15.0973C30.1454 15.0973 29.2499 15.9927 29.2499 17.0973C29.2499 18.2019 30.1454 19.0973 31.2499 19.0973Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M34.3613 24.7649L32.548 26.5879L32.5615 26.6128C34.6931 30.5673 34.0891 35.6066 30.7494 38.9462L27.2614 42.4343C27.0164 42.6793 26.6191 42.6793 26.374 42.4343L21.1606 37.2207L18.3322 40.0492C17.5511 40.8302 16.2848 40.8302 15.5037 40.0492L8.43267 32.9781C7.65162 32.1971 7.65163 30.9307 8.43267 30.1497L11.2606 27.3217L5.32761 21.3887C5.01124 21.0723 5.01124 20.5594 5.32761 20.243L7.77511 17.7955C11.6222 13.9484 17.4769 13.3326 21.9667 15.948L21.9717 15.9509L23.7415 14.1715C28.262 9.62657 34.1399 6.67775 40.4857 5.77121C41.7837 5.58578 42.8957 6.7022 42.7103 8.00017C41.805 14.3369 38.8753 20.2265 34.3613 24.7649ZM15.903 26.3063L25.8685 16.2871C29.5927 12.5429 34.3424 10.0045 39.5013 8.98121C38.4807 14.1421 35.9558 18.9076 32.2342 22.6493L22.2642 32.6675L20.0993 30.5026L25.0484 25.5535L22.9271 23.4322L17.978 28.3813L15.903 26.3063ZM23.6831 35.5006L26.8177 38.6353L28.6281 36.8249C30.7787 34.6743 31.3375 31.5346 30.3043 28.8701L25.414 33.7604L23.6831 35.5006ZM13.3828 29.4422L11.2611 31.5639L16.918 37.2207L19.0396 35.0991L13.3828 29.4422ZM13.0481 24.8666L19.745 18.1697C16.5162 16.6711 12.5598 17.2535 9.89643 19.9168L8.99741 20.8159L13.0481 24.8666Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M31.2499 19.0973C32.3545 19.0973 33.2499 18.2019 33.2499 17.0973C33.2499 15.9927 32.3545 15.0973 31.2499 15.0973C30.1454 15.0973 29.2499 15.9927 29.2499 17.0973C29.2499 18.2019 30.1454 19.0973 31.2499 19.0973Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M34.3613 24.7649L32.548 26.5879L32.5615 26.6128C34.6931 30.5673 34.0891 35.6066 30.7494 38.9462L27.2614 42.4343C27.0164 42.6793 26.6191 42.6793 26.374 42.4343L21.1606 37.2207L18.3322 40.0492C17.5511 40.8302 16.2848 40.8302 15.5037 40.0492L8.43267 32.9781C7.65162 32.1971 7.65163 30.9307 8.43267 30.1497L11.2606 27.3217L5.32761 21.3887C5.01124 21.0723 5.01124 20.5594 5.32761 20.243L7.77511 17.7955C11.6222 13.9484 17.4769 13.3326 21.9667 15.948L21.9717 15.9509L23.7415 14.1715C28.262 9.62657 34.1399 6.67775 40.4857 5.77121C41.7837 5.58578 42.8957 6.7022 42.7103 8.00017C41.805 14.3369 38.8753 20.2265 34.3613 24.7649ZM15.903 26.3063L25.8685 16.2871C29.5927 12.5429 34.3424 10.0045 39.5013 8.98121C38.4807 14.1421 35.9558 18.9076 32.2342 22.6493L22.2642 32.6675L20.0993 30.5026L25.0484 25.5535L22.9271 23.4322L17.978 28.3813L15.903 26.3063ZM23.6831 35.5006L26.8177 38.6353L28.6281 36.8249C30.7787 34.6743 31.3375 31.5346 30.3043 28.8701L25.414 33.7604L23.6831 35.5006ZM13.3828 29.4422L11.2611 31.5639L16.918 37.2207L19.0396 35.0991L13.3828 29.4422ZM13.0481 24.8666L19.745 18.1697C16.5162 16.6711 12.5598 17.2535 9.89643 19.9168L8.99741 20.8159L13.0481 24.8666Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31.2499 19.0973C32.3545 19.0973 33.2499 18.2019 33.2499 17.0973C33.2499 15.9927 32.3545 15.0973 31.2499 15.0973C30.1454 15.0973 29.2499 15.9927 29.2499 17.0973C29.2499 18.2019 30.1454 19.0973 31.2499 19.0973Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M34.3613 24.7649L32.548 26.5879L32.5615 26.6128C34.6931 30.5673 34.0891 35.6066 30.7494 38.9462L27.2614 42.4343C27.0164 42.6793 26.6191 42.6793 26.374 42.4343L21.1606 37.2207L18.3322 40.0492C17.5511 40.8302 16.2848 40.8302 15.5037 40.0492L8.43267 32.9781C7.65162 32.1971 7.65163 30.9307 8.43267 30.1497L11.2606 27.3217L5.32761 21.3887C5.01124 21.0723 5.01124 20.5594 5.32761 20.243L7.77511 17.7955C11.6222 13.9484 17.4769 13.3326 21.9667 15.948L21.9717 15.9509L23.7415 14.1715C28.262 9.62657 34.1399 6.67775 40.4857 5.77121C41.7837 5.58578 42.8957 6.7022 42.7103 8.00017C41.805 14.3369 38.8753 20.2265 34.3613 24.7649ZM15.903 26.3063L25.8685 16.2871C29.5927 12.5429 34.3424 10.0045 39.5013 8.98121C38.4807 14.1421 35.9558 18.9076 32.2342 22.6493L22.2642 32.6675L20.0993 30.5026L25.0484 25.5535L22.9271 23.4322L17.978 28.3813L15.903 26.3063ZM23.6831 35.5006L26.8177 38.6353L28.6281 36.8249C30.7787 34.6743 31.3375 31.5346 30.3043 28.8701L25.414 33.7604L23.6831 35.5006ZM13.3828 29.4422L11.2611 31.5639L16.918 37.2207L19.0396 35.0991L13.3828 29.4422ZM13.0481 24.8666L19.745 18.1697C16.5162 16.6711 12.5598 17.2535 9.89643 19.9168L8.99741 20.8159L13.0481 24.8666Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M30.6459 19C31.7504 19 32.6459 18.1046 32.6459 17C32.6459 15.8955 31.7504 15 30.6459 15C29.5413 15 28.6459 15.8955 28.6459 17C28.6459 18.1046 29.5413 19 30.6459 19Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M33.7573 24.6675L31.7422 26.6934L31.7439 26.6971C33.6774 30.9257 32.9036 36.0887 29.4227 39.5696L26.6568 42.3355C26.4118 42.5805 26.0145 42.5805 25.7694 42.3355L20.557 37.123L17.7281 39.9519C16.9471 40.733 15.6807 40.733 14.8997 39.9519L7.82861 32.8808C7.04756 32.0998 7.04756 30.8335 7.82861 30.0524L10.657 27.224L5.44366 22.0099C5.19863 21.7648 5.19863 21.3675 5.44366 21.1225L8.15987 18.4063C11.6687 14.8975 16.8761 14.1227 21.1352 16.0818L21.1389 16.0835L23.1376 14.0741C27.6581 9.52916 33.536 6.58034 39.8818 5.6738C41.1797 5.48837 42.2917 6.60479 42.1063 7.90276C41.2011 14.2395 38.2714 20.129 33.7573 24.6675ZM16.0065 26.9156L25.9736 16.8949C29.1868 13.6643 33.1934 11.3667 37.5659 10.2164C36.4195 14.5951 34.1332 18.6174 30.9213 21.8466L27.9189 24.8652L20.9375 31.8466L19.8493 30.7584L24.798 25.8098L21.9696 22.9813L17.0209 27.93L16.0065 26.9156ZM28.6033 29.8492L23.7846 34.6939L26.2131 37.1223L26.5943 36.7412C28.4648 34.8706 29.1345 32.254 28.6033 29.8492ZM13.4855 30.0524L17.7281 34.295L16.3139 35.7093L12.0713 31.4666L13.4855 30.0524ZM13.1538 24.0632L17.9983 19.2187C15.5563 18.6608 12.8902 19.3328 10.9883 21.2347L10.6568 21.5662L13.1538 24.0632Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M30.6459 19C31.7504 19 32.6459 18.1046 32.6459 17C32.6459 15.8955 31.7504 15 30.6459 15C29.5413 15 28.6459 15.8955 28.6459 17C28.6459 18.1046 29.5413 19 30.6459 19Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M33.7573 24.6675L31.7422 26.6934L31.7439 26.6971C33.6774 30.9257 32.9036 36.0887 29.4227 39.5696L26.6568 42.3355C26.4118 42.5805 26.0145 42.5805 25.7694 42.3355L20.557 37.123L17.7281 39.9519C16.9471 40.733 15.6807 40.733 14.8997 39.9519L7.82861 32.8808C7.04756 32.0998 7.04756 30.8335 7.82861 30.0524L10.657 27.224L5.44366 22.0099C5.19863 21.7648 5.19863 21.3675 5.44366 21.1225L8.15987 18.4063C11.6687 14.8975 16.8761 14.1227 21.1352 16.0818L21.1389 16.0835L23.1376 14.0741C27.6581 9.52916 33.536 6.58034 39.8818 5.6738C41.1797 5.48837 42.2917 6.60479 42.1063 7.90276C41.2011 14.2395 38.2714 20.129 33.7573 24.6675ZM16.0065 26.9156L25.9736 16.8949C29.1868 13.6643 33.1934 11.3667 37.5659 10.2164C36.4195 14.5951 34.1332 18.6174 30.9213 21.8466L27.9189 24.8652L20.9375 31.8466L19.8493 30.7584L24.798 25.8098L21.9696 22.9813L17.0209 27.93L16.0065 26.9156ZM28.6033 29.8492L23.7846 34.6939L26.2131 37.1223L26.5943 36.7412C28.4648 34.8706 29.1345 32.254 28.6033 29.8492ZM13.4855 30.0524L17.7281 34.295L16.3139 35.7093L12.0713 31.4666L13.4855 30.0524ZM13.1538 24.0632L17.9983 19.2187C15.5563 18.6608 12.8902 19.3328 10.9883 21.2347L10.6568 21.5662L13.1538 24.0632Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M31.2499 19.0973C32.3545 19.0973 33.2499 18.2019 33.2499 17.0973C33.2499 15.9927 32.3545 15.0973 31.2499 15.0973C30.1454 15.0973 29.2499 15.9927 29.2499 17.0973C29.2499 18.2019 30.1454 19.0973 31.2499 19.0973Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M34.3613 24.7649L32.548 26.5879L32.5615 26.6128C34.6931 30.5673 34.0891 35.6066 30.7494 38.9462L27.2614 42.4343C27.0164 42.6793 26.6191 42.6793 26.374 42.4343L21.1606 37.2207L18.3322 40.0492C17.5511 40.8302 16.2848 40.8302 15.5037 40.0492L8.43267 32.9781C7.65162 32.1971 7.65163 30.9307 8.43267 30.1497L11.2606 27.3217L5.32761 21.3887C5.01124 21.0723 5.01124 20.5594 5.32761 20.243L7.77511 17.7955C11.6222 13.9484 17.4769 13.3326 21.9667 15.948L21.9717 15.9509L23.7415 14.1715C28.262 9.62657 34.1399 6.67775 40.4857 5.77121C41.7837 5.58578 42.8957 6.7022 42.7103 8.00017C41.805 14.3369 38.8753 20.2265 34.3613 24.7649ZM15.903 26.3063L25.8685 16.2871C29.5927 12.5429 34.3424 10.0045 39.5013 8.98121C38.4807 14.1421 35.9558 18.9076 32.2342 22.6493L22.2642 32.6675L20.0993 30.5026L25.0484 25.5535L22.9271 23.4322L17.978 28.3813L15.903 26.3063ZM23.6831 35.5006L26.8177 38.6353L28.6281 36.8249C30.7787 34.6743 31.3375 31.5346 30.3043 28.8701L25.414 33.7604L23.6831 35.5006ZM13.3828 29.4422L11.2611 31.5639L16.918 37.2207L19.0396 35.0991L13.3828 29.4422ZM13.0481 24.8666L19.745 18.1697C16.5162 16.6711 12.5598 17.2535 9.89643 19.9168L8.99741 20.8159L13.0481 24.8666Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M31.2499 19.0973C32.3545 19.0973 33.2499 18.2019 33.2499 17.0973C33.2499 15.9927 32.3545 15.0973 31.2499 15.0973C30.1454 15.0973 29.2499 15.9927 29.2499 17.0973C29.2499 18.2019 30.1454 19.0973 31.2499 19.0973Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M34.3613 24.7649L32.548 26.5879L32.5615 26.6128C34.6931 30.5673 34.0891 35.6066 30.7494 38.9462L27.2614 42.4343C27.0164 42.6793 26.6191 42.6793 26.374 42.4343L21.1606 37.2207L18.3322 40.0492C17.5511 40.8302 16.2848 40.8302 15.5037 40.0492L8.43267 32.9781C7.65162 32.1971 7.65163 30.9307 8.43267 30.1497L11.2606 27.3217L5.32761 21.3887C5.01124 21.0723 5.01124 20.5594 5.32761 20.243L7.77511 17.7955C11.6222 13.9484 17.4769 13.3326 21.9667 15.948L21.9717 15.9509L23.7415 14.1715C28.262 9.62657 34.1399 6.67775 40.4857 5.77121C41.7837 5.58578 42.8957 6.7022 42.7103 8.00017C41.805 14.3369 38.8753 20.2265 34.3613 24.7649ZM15.903 26.3063L25.8685 16.2871C29.5927 12.5429 34.3424 10.0045 39.5013 8.98121C38.4807 14.1421 35.9558 18.9076 32.2342 22.6493L22.2642 32.6675L20.0993 30.5026L25.0484 25.5535L22.9271 23.4322L17.978 28.3813L15.903 26.3063ZM23.6831 35.5006L26.8177 38.6353L28.6281 36.8249C30.7787 34.6743 31.3375 31.5346 30.3043 28.8701L25.414 33.7604L23.6831 35.5006ZM13.3828 29.4422L11.2611 31.5639L16.918 37.2207L19.0396 35.0991L13.3828 29.4422ZM13.0481 24.8666L19.745 18.1697C16.5162 16.6711 12.5598 17.2535 9.89643 19.9168L8.99741 20.8159L13.0481 24.8666Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };

package/assets/search/index.tsx

@@ -1,31 +1,32 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface SearchProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const Search = ({ fill = false, thick = false, size = 24 }: SearchProps) => {
+export const Search = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: SearchProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M26.6678 28.7892C24.4942 30.5052 21.749 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.7491 30.5052 24.4942 28.7892 26.6679L41.5607 39.4394L39.4393 41.5607L26.6678 28.7892ZM28.5294 18.7647C28.5294 24.1576 24.1575 28.5294 18.7646 28.5294C13.3717 28.5294 8.99994 24.1576 8.99994 18.7647C8.99994 13.3718 13.3717 9 18.7646 9C24.1575 9 28.5294 13.3718 28.5294 18.7647Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M26.6678 28.7892C24.4942 30.5052 21.749 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.7491 30.5052 24.4942 28.7892 26.6679L41.5607 39.4394L39.4393 41.5607L26.6678 28.7892ZM28.5294 18.7647C28.5294 24.1576 24.1575 28.5294 18.7646 28.5294C13.3717 28.5294 8.99994 24.1576 8.99994 18.7647C8.99994 13.3718 13.3717 9 18.7646 9C24.1575 9 28.5294 13.3718 28.5294 18.7647Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M26.6678 28.7892C24.4942 30.5052 21.749 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.7491 30.5052 24.4942 28.7892 26.6679L41.5607 39.4394L39.4393 41.5607L26.6678 28.7892ZM28.5294 18.7647C28.5294 24.1576 24.1575 28.5294 18.7646 28.5294C13.3717 28.5294 8.99994 24.1576 8.99994 18.7647C8.99994 13.3718 13.3717 9 18.7646 9C24.1575 9 28.5294 13.3718 28.5294 18.7647Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M26.6678 28.7892C24.4942 30.5052 21.749 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.7491 30.5052 24.4942 28.7892 26.6679L41.5607 39.4394L39.4393 41.5607L26.6678 28.7892ZM28.5294 18.7647C28.5294 24.1576 24.1575 28.5294 18.7646 28.5294C13.3717 28.5294 8.99994 24.1576 8.99994 18.7647C8.99994 13.3718 13.3717 9 18.7646 9C24.1575 9 28.5294 13.3718 28.5294 18.7647Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M26.2656 29.0941C24.1599 30.6258 21.5678 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.5678 30.6258 24.1599 29.094 26.2657L41.9142 39.0858L39.0858 41.9142L26.2656 29.0941ZM27.5294 18.7647C27.5294 23.6053 23.6053 27.5294 18.7646 27.5294C13.924 27.5294 9.99994 23.6053 9.99994 18.7647C9.99994 13.9241 13.924 10 18.7646 10C23.6053 10 27.5294 13.9241 27.5294 18.7647Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M26.2656 29.0941C24.1599 30.6258 21.5678 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.5678 30.6258 24.1599 29.094 26.2657L41.9142 39.0858L39.0858 41.9142L26.2656 29.0941ZM27.5294 18.7647C27.5294 23.6053 23.6053 27.5294 18.7646 27.5294C13.924 27.5294 9.99994 23.6053 9.99994 18.7647C9.99994 13.9241 13.924 10 18.7646 10C23.6053 10 27.5294 13.9241 27.5294 18.7647Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M26.6678 28.7892C24.4942 30.5052 21.749 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.7491 30.5052 24.4942 28.7892 26.6679L41.5607 39.4394L39.4393 41.5607L26.6678 28.7892ZM28.5294 18.7647C28.5294 24.1576 24.1575 28.5294 18.7646 28.5294C13.3717 28.5294 8.99994 24.1576 8.99994 18.7647C8.99994 13.3718 13.3717 9 18.7646 9C24.1575 9 28.5294 13.3718 28.5294 18.7647Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M26.6678 28.7892C24.4942 30.5052 21.749 31.5294 18.7646 31.5294C11.7149 31.5294 5.99994 25.8145 5.99994 18.7647C5.99994 11.715 11.7149 6 18.7646 6C25.8144 6 31.5294 11.715 31.5294 18.7647C31.5294 21.7491 30.5052 24.4942 28.7892 26.6679L41.5607 39.4394L39.4393 41.5607L26.6678 28.7892ZM28.5294 18.7647C28.5294 24.1576 24.1575 28.5294 18.7646 28.5294C13.3717 28.5294 8.99994 24.1576 8.99994 18.7647C8.99994 13.3718 13.3717 9 18.7646 9C24.1575 9 28.5294 13.3718 28.5294 18.7647Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };

package/assets/secret-mode/index.tsx

@@ -1,35 +1,36 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface SecretModeProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const SecretMode = ({ fill = false, thick = false, size = 24 }: SecretModeProps) => {
+export const SecretMode = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: SecretModeProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M37.9077 19.8809L32.2913 7.60357C31.3704 5.59057 28.8355 4.9273 27.0468 6.23131L23.9997 8.45261L20.9586 6.23565C19.1664 4.92916 16.6264 5.59775 15.7097 7.61729L10.1391 19.8899C8.21278 19.5222 6.29744 19.0771 4.39776 18.5547L3.60229 21.4473C7.83456 22.6112 12.1415 23.4061 16.4758 23.8321C21.6631 24.3943 26.8976 24.3753 32.0817 23.7752C36.2278 23.3372 40.347 22.5613 44.3978 21.4473L43.6023 18.5547C41.718 19.0729 39.8183 19.5149 37.9077 19.8809ZM29.5632 8.85157C29.4317 8.564 29.0695 8.46925 28.814 8.65553L23.9997 12.1651L19.1913 8.65988C18.9353 8.47323 18.5725 8.56875 18.4415 8.85725L13.2187 20.3636C14.4037 20.557 15.5926 20.7185 16.7841 20.8479C21.7617 21.3361 26.7768 21.3179 31.7517 20.7934C32.7801 20.6741 33.8063 20.5309 34.8297 20.3639L29.5632 8.85157Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M22.4834 34.698C22.2176 38.9767 18.6632 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.9727 26.001 21.068 28.3978 22.1176 31.7054C23.4078 31.4397 24.7412 31.4501 26.028 31.7369C27.1985 28.6497 30.1834 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.1813 42.8187 25.5301 39.1864 25.4993 34.6941C24.5088 34.4522 23.4734 34.4535 22.4834 34.698ZM14.3176 39.3646C17.1794 39.3646 19.4994 37.0446 19.4994 34.1828C19.4994 31.321 17.1794 29.001 14.3176 29.001C11.4557 29.001 9.13574 31.321 9.13574 34.1828C9.13574 37.0446 11.4557 39.3646 14.3176 39.3646ZM33.681 39.8187C36.5428 39.8187 38.8628 37.4987 38.8628 34.6369C38.8628 31.7751 36.5428 29.4551 33.681 29.4551C30.8191 29.4551 28.4991 31.7751 28.4991 34.6369C28.4991 37.4987 30.8191 39.8187 33.681 39.8187Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M37.9077 19.8809L32.2913 7.60357C31.3704 5.59057 28.8355 4.9273 27.0468 6.23131L23.9997 8.45261L20.9586 6.23565C19.1664 4.92916 16.6264 5.59775 15.7097 7.61729L10.1391 19.8899C8.21278 19.5222 6.29744 19.0771 4.39776 18.5547L3.60229 21.4473C7.83456 22.6112 12.1415 23.4061 16.4758 23.8321C21.6631 24.3943 26.8976 24.3753 32.0817 23.7752C36.2278 23.3372 40.347 22.5613 44.3978 21.4473L43.6023 18.5547C41.718 19.0729 39.8183 19.5149 37.9077 19.8809ZM29.5632 8.85157C29.4317 8.564 29.0695 8.46925 28.814 8.65553L23.9997 12.1651L19.1913 8.65988C18.9353 8.47323 18.5725 8.56875 18.4415 8.85725L13.2187 20.3636C14.4037 20.557 15.5926 20.7185 16.7841 20.8479C21.7617 21.3361 26.7768 21.3179 31.7517 20.7934C32.7801 20.6741 33.8063 20.5309 34.8297 20.3639L29.5632 8.85157Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M22.4834 34.698C22.2176 38.9767 18.6632 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.9727 26.001 21.068 28.3978 22.1176 31.7054C23.4078 31.4397 24.7412 31.4501 26.028 31.7369C27.1985 28.6497 30.1834 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.1813 42.8187 25.5301 39.1864 25.4993 34.6941C24.5088 34.4522 23.4734 34.4535 22.4834 34.698ZM14.3176 39.3646C17.1794 39.3646 19.4994 37.0446 19.4994 34.1828C19.4994 31.321 17.1794 29.001 14.3176 29.001C11.4557 29.001 9.13574 31.321 9.13574 34.1828C9.13574 37.0446 11.4557 39.3646 14.3176 39.3646ZM33.681 39.8187C36.5428 39.8187 38.8628 37.4987 38.8628 34.6369C38.8628 31.7751 36.5428 29.4551 33.681 29.4551C30.8191 29.4551 28.4991 31.7751 28.4991 34.6369C28.4991 37.4987 30.8191 39.8187 33.681 39.8187Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M26.7522 5.82741C28.7966 4.33711 31.6936 5.09514 32.746 7.39571L38.1985 19.3147C39.9665 18.9663 41.7248 18.5521 43.4697 18.0723L44.5303 21.9291C40.469 23.046 36.3392 23.8253 32.1825 24.267C26.9329 24.878 21.6317 24.8972 16.3789 24.3246C12.0326 23.8947 7.71385 23.0962 3.46973 21.9291L4.53035 18.0723C6.29032 18.5563 8.06382 18.9734 9.84712 19.3237L15.2545 7.41077C16.3021 5.10272 19.2049 4.33862 21.2531 5.83176L23.9997 7.83399L26.7522 5.82741Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M22.4332 35.2282C21.9199 39.2532 18.4821 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.795 26.001 20.7657 28.1704 21.9502 31.2297C23.3588 30.9293 24.8182 30.9422 26.2225 31.2684C27.5065 28.43 30.3631 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.3568 42.8187 25.8161 39.4642 25.5193 35.2154C24.5088 34.9422 23.4419 34.9465 22.4332 35.2282ZM14.3176 38.3646C16.6271 38.3646 18.4994 36.4923 18.4994 34.1828C18.4994 31.8732 16.6271 30.001 14.3176 30.001C12.008 30.001 10.1357 31.8732 10.1357 34.1828C10.1357 36.4923 12.008 38.3646 14.3176 38.3646ZM33.681 38.8187C35.9905 38.8187 37.8628 36.9464 37.8628 34.6369C37.8628 32.3273 35.9905 30.4551 33.681 30.4551C31.3714 30.4551 29.4991 32.3273 29.4991 34.6369C29.4991 36.9464 31.3714 38.8187 33.681 38.8187Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M26.7522 5.82741C28.7966 4.33711 31.6936 5.09514 32.746 7.39571L38.1985 19.3147C39.9665 18.9663 41.7248 18.5521 43.4697 18.0723L44.5303 21.9291C40.469 23.046 36.3392 23.8253 32.1825 24.267C26.9329 24.878 21.6317 24.8972 16.3789 24.3246C12.0326 23.8947 7.71385 23.0962 3.46973 21.9291L4.53035 18.0723C6.29032 18.5563 8.06382 18.9734 9.84712 19.3237L15.2545 7.41077C16.3021 5.10272 19.2049 4.33862 21.2531 5.83176L23.9997 7.83399L26.7522 5.82741Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M22.4332 35.2282C21.9199 39.2532 18.4821 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.795 26.001 20.7657 28.1704 21.9502 31.2297C23.3588 30.9293 24.8182 30.9422 26.2225 31.2684C27.5065 28.43 30.3631 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.3568 42.8187 25.8161 39.4642 25.5193 35.2154C24.5088 34.9422 23.4419 34.9465 22.4332 35.2282ZM14.3176 38.3646C16.6271 38.3646 18.4994 36.4923 18.4994 34.1828C18.4994 31.8732 16.6271 30.001 14.3176 30.001C12.008 30.001 10.1357 31.8732 10.1357 34.1828C10.1357 36.4923 12.008 38.3646 14.3176 38.3646ZM33.681 38.8187C35.9905 38.8187 37.8628 36.9464 37.8628 34.6369C37.8628 32.3273 35.9905 30.4551 33.681 30.4551C31.3714 30.4551 29.4991 32.3273 29.4991 34.6369C29.4991 36.9464 31.3714 38.8187 33.681 38.8187Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M26.7522 5.82741C28.7965 4.33711 31.6935 5.09513 32.746 7.39571L38.1985 19.3148C39.9664 18.9663 41.7247 18.5521 43.4697 18.0723L44.5303 21.9291C40.4688 23.046 36.3389 23.8253 32.1819 24.2671C26.9324 24.878 21.6312 24.8972 16.3784 24.3245C12.0323 23.8947 7.71369 23.0962 3.46973 21.9291L4.53035 18.0723C6.2903 18.5563 8.06379 18.9734 9.84708 19.3237L15.2544 7.41077C16.3021 5.10272 19.2049 4.33862 21.2531 5.83176L23.9997 7.83399L26.7522 5.82741ZM31.7394 20.2916C26.7714 20.8181 21.7627 20.8362 16.7919 20.3459C15.8411 20.242 14.8921 20.1175 13.9454 19.9725L18.8968 9.06405L23.9997 12.784L29.1085 9.05971L34.101 19.9731C33.3153 20.0934 32.5279 20.1996 31.7394 20.2916Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M22.4332 35.2282C21.9199 39.2532 18.4821 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.795 26.001 20.7657 28.1704 21.9502 31.2297C23.3588 30.9293 24.8182 30.9422 26.2225 31.2684C27.5065 28.43 30.3631 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.3568 42.8187 25.8161 39.4642 25.5193 35.2154C24.5088 34.9422 23.4419 34.9465 22.4332 35.2282ZM14.3176 38.3646C16.6271 38.3646 18.4994 36.4923 18.4994 34.1828C18.4994 31.8732 16.6271 30.001 14.3176 30.001C12.008 30.001 10.1357 31.8732 10.1357 34.1828C10.1357 36.4923 12.008 38.3646 14.3176 38.3646ZM33.681 38.8187C35.9905 38.8187 37.8628 36.9464 37.8628 34.6369C37.8628 32.3273 35.9905 30.4551 33.681 30.4551C31.3714 30.4551 29.4991 32.3273 29.4991 34.6369C29.4991 36.9464 31.3714 38.8187 33.681 38.8187Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M26.7522 5.82741C28.7965 4.33711 31.6935 5.09513 32.746 7.39571L38.1985 19.3148C39.9664 18.9663 41.7247 18.5521 43.4697 18.0723L44.5303 21.9291C40.4688 23.046 36.3389 23.8253 32.1819 24.2671C26.9324 24.878 21.6312 24.8972 16.3784 24.3245C12.0323 23.8947 7.71369 23.0962 3.46973 21.9291L4.53035 18.0723C6.2903 18.5563 8.06379 18.9734 9.84708 19.3237L15.2544 7.41077C16.3021 5.10272 19.2049 4.33862 21.2531 5.83176L23.9997 7.83399L26.7522 5.82741ZM31.7394 20.2916C26.7714 20.8181 21.7627 20.8362 16.7919 20.3459C15.8411 20.242 14.8921 20.1175 13.9454 19.9725L18.8968 9.06405L23.9997 12.784L29.1085 9.05971L34.101 19.9731C33.3153 20.0934 32.5279 20.1996 31.7394 20.2916Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M22.4332 35.2282C21.9199 39.2532 18.4821 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.795 26.001 20.7657 28.1704 21.9502 31.2297C23.3588 30.9293 24.8182 30.9422 26.2225 31.2684C27.5065 28.43 30.3631 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.3568 42.8187 25.8161 39.4642 25.5193 35.2154C24.5088 34.9422 23.4419 34.9465 22.4332 35.2282ZM14.3176 38.3646C16.6271 38.3646 18.4994 36.4923 18.4994 34.1828C18.4994 31.8732 16.6271 30.001 14.3176 30.001C12.008 30.001 10.1357 31.8732 10.1357 34.1828C10.1357 36.4923 12.008 38.3646 14.3176 38.3646ZM33.681 38.8187C35.9905 38.8187 37.8628 36.9464 37.8628 34.6369C37.8628 32.3273 35.9905 30.4551 33.681 30.4551C31.3714 30.4551 29.4991 32.3273 29.4991 34.6369C29.4991 36.9464 31.3714 38.8187 33.681 38.8187Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M37.9077 19.8809L32.2913 7.60357C31.3704 5.59057 28.8355 4.9273 27.0468 6.23131L23.9997 8.45261L20.9586 6.23565C19.1664 4.92916 16.6264 5.59775 15.7097 7.61729L10.1391 19.8899C8.21278 19.5222 6.29744 19.0771 4.39776 18.5547L3.60229 21.4473C7.83456 22.6112 12.1415 23.4061 16.4758 23.8321C21.6631 24.3943 26.8976 24.3753 32.0817 23.7752C36.2278 23.3372 40.347 22.5613 44.3978 21.4473L43.6023 18.5547C41.718 19.0729 39.8183 19.5149 37.9077 19.8809ZM29.5632 8.85157C29.4317 8.564 29.0695 8.46925 28.814 8.65553L23.9997 12.1651L19.1913 8.65988C18.9353 8.47323 18.5725 8.56875 18.4415 8.85725L13.2187 20.3636C14.4037 20.557 15.5926 20.7185 16.7841 20.8479C21.7617 21.3361 26.7768 21.3179 31.7517 20.7934C32.7801 20.6741 33.8063 20.5309 34.8297 20.3639L29.5632 8.85157Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M22.4834 34.698C22.2176 38.9767 18.6632 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.9727 26.001 21.068 28.3978 22.1176 31.7054C23.4078 31.4397 24.7412 31.4501 26.028 31.7369C27.1985 28.6497 30.1834 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.1813 42.8187 25.5301 39.1864 25.4993 34.6941C24.5088 34.4522 23.4734 34.4535 22.4834 34.698ZM14.3176 39.3646C17.1794 39.3646 19.4994 37.0446 19.4994 34.1828C19.4994 31.321 17.1794 29.001 14.3176 29.001C11.4557 29.001 9.13574 31.321 9.13574 34.1828C9.13574 37.0446 11.4557 39.3646 14.3176 39.3646ZM33.681 39.8187C36.5428 39.8187 38.8628 37.4987 38.8628 34.6369C38.8628 31.7751 36.5428 29.4551 33.681 29.4551C30.8191 29.4551 28.4991 31.7751 28.4991 34.6369C28.4991 37.4987 30.8191 39.8187 33.681 39.8187Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M37.9077 19.8809L32.2913 7.60357C31.3704 5.59057 28.8355 4.9273 27.0468 6.23131L23.9997 8.45261L20.9586 6.23565C19.1664 4.92916 16.6264 5.59775 15.7097 7.61729L10.1391 19.8899C8.21278 19.5222 6.29744 19.0771 4.39776 18.5547L3.60229 21.4473C7.83456 22.6112 12.1415 23.4061 16.4758 23.8321C21.6631 24.3943 26.8976 24.3753 32.0817 23.7752C36.2278 23.3372 40.347 22.5613 44.3978 21.4473L43.6023 18.5547C41.718 19.0729 39.8183 19.5149 37.9077 19.8809ZM29.5632 8.85157C29.4317 8.564 29.0695 8.46925 28.814 8.65553L23.9997 12.1651L19.1913 8.65988C18.9353 8.47323 18.5725 8.56875 18.4415 8.85725L13.2187 20.3636C14.4037 20.557 15.5926 20.7185 16.7841 20.8479C21.7617 21.3361 26.7768 21.3179 31.7517 20.7934C32.7801 20.6741 33.8063 20.5309 34.8297 20.3639L29.5632 8.85157Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M22.4834 34.698C22.2176 38.9767 18.6632 42.3646 14.3176 42.3646C9.79887 42.3646 6.13574 38.7015 6.13574 34.1828C6.13574 29.6641 9.79887 26.001 14.3176 26.001C17.9727 26.001 21.068 28.3978 22.1176 31.7054C23.4078 31.4397 24.7412 31.4501 26.028 31.7369C27.1985 28.6497 30.1834 26.4551 33.681 26.4551C38.1997 26.4551 41.8628 30.1182 41.8628 34.6369C41.8628 39.1556 38.1997 42.8187 33.681 42.8187C29.1813 42.8187 25.5301 39.1864 25.4993 34.6941C24.5088 34.4522 23.4734 34.4535 22.4834 34.698ZM14.3176 39.3646C17.1794 39.3646 19.4994 37.0446 19.4994 34.1828C19.4994 31.321 17.1794 29.001 14.3176 29.001C11.4557 29.001 9.13574 31.321 9.13574 34.1828C9.13574 37.0446 11.4557 39.3646 14.3176 39.3646ZM33.681 39.8187C36.5428 39.8187 38.8628 37.4987 38.8628 34.6369C38.8628 31.7751 36.5428 29.4551 33.681 29.4551C30.8191 29.4551 28.4991 31.7751 28.4991 34.6369C28.4991 37.4987 30.8191 39.8187 33.681 39.8187Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };

package/assets/send/index.tsx

@@ -1,31 +1,32 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface SendProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const Send = ({ fill = false, thick = false, size = 24 }: SendProps) => {
+export const Send = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: SendProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M41.023 22.6777C42.4873 23.4174 42.4873 25.5083 41.023 26.248L8.36711 42.7452C6.77581 43.5491 5.00741 42.0265 5.56599 40.3334L9.86135 27.314L32.5025 25.0498C32.785 25.0216 33.0001 24.7839 33.0001 24.5001C33.0001 24.2163 32.785 23.9786 32.5025 23.9503L9.8866 21.6888L5.56594 8.59227C5.00738 6.8992 6.77577 5.37663 8.36707 6.18053L41.023 22.6777Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M41.023 22.6777C42.4873 23.4174 42.4873 25.5083 41.023 26.248L8.36711 42.7452C6.77581 43.5491 5.00741 42.0265 5.56599 40.3334L9.86135 27.314L32.5025 25.0498C32.785 25.0216 33.0001 24.7839 33.0001 24.5001C33.0001 24.2163 32.785 23.9786 32.5025 23.9503L9.8866 21.6888L5.56594 8.59227C5.00738 6.8992 6.77577 5.37663 8.36707 6.18053L41.023 22.6777Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M41.0232 22.6777C42.4874 23.4174 42.4874 25.5083 41.0232 26.248L8.36723 42.7452C6.77593 43.5491 5.00754 42.0265 5.56611 40.3334L10.173 26.3697L32.5011 25.03C32.7814 25.0132 33.0002 24.781 33.0002 24.5001C33.0002 24.2192 32.7814 23.987 32.5011 23.9702L10.1979 22.632L5.56606 8.59227C5.0075 6.8992 6.77589 5.37663 8.36719 6.18053L41.0232 22.6777Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M41.0232 22.6777C42.4874 23.4174 42.4874 25.5083 41.0232 26.248L8.36723 42.7452C6.77593 43.5491 5.00754 42.0265 5.56611 40.3334L10.173 26.3697L32.5011 25.03C32.7814 25.0132 33.0002 24.781 33.0002 24.5001C33.0002 24.2192 32.7814 23.987 32.5011 23.9702L10.1979 22.632L5.56606 8.59227C5.0075 6.8992 6.77589 5.37663 8.36719 6.18053L41.0232 22.6777Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M5.566 8.59245C5.00748 6.8995 6.77557 5.37683 8.36678 6.18034L41.023 22.6774C42.4872 23.4171 42.4871 25.5079 41.023 26.2477L8.36678 42.7458C6.77561 43.5492 5.00754 42.0266 5.566 40.3337L10.5953 25.0895C10.7294 24.6827 10.7295 24.2434 10.5953 23.8366L5.566 8.59245ZM14.3551 26.4626L10.8795 36.9948L31.7271 26.4626H14.3551ZM14.3541 22.4626H31.7271L10.8795 11.9313L14.3541 22.4626Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.566 8.59245C5.00748 6.8995 6.77557 5.37683 8.36678 6.18034L41.023 22.6774C42.4872 23.4171 42.4871 25.5079 41.023 26.2477L8.36678 42.7458C6.77561 43.5492 5.00754 42.0266 5.566 40.3337L10.5953 25.0895C10.7294 24.6827 10.7295 24.2434 10.5953 23.8366L5.566 8.59245ZM14.3551 26.4626L10.8795 36.9948L31.7271 26.4626H14.3551ZM14.3541 22.4626H31.7271L10.8795 11.9313L14.3541 22.4626Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M41.0231 22.6777C42.4873 23.4174 42.4873 25.5083 41.0231 26.248L8.36717 42.7452C6.77587 43.5491 5.00748 42.0265 5.56605 40.3334L10.5952 25.0897C10.7295 24.6828 10.7295 24.2435 10.5952 23.8365L5.566 8.59227C5.00744 6.8992 6.77583 5.37663 8.36713 6.18053L41.0231 22.6777ZM34.9324 22.9619L9.17247 9.94845L13.4442 22.8966C13.4514 22.9183 13.4584 22.9401 13.4652 22.9619H34.9324ZM13.466 25.9619C13.4589 25.9845 13.4516 26.0071 13.4442 26.0297L9.17253 38.9772L34.9362 25.9619H13.466Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M41.0231 22.6777C42.4873 23.4174 42.4873 25.5083 41.0231 26.248L8.36717 42.7452C6.77587 43.5491 5.00748 42.0265 5.56605 40.3334L10.5952 25.0897C10.7295 24.6828 10.7295 24.2435 10.5952 23.8365L5.566 8.59227C5.00744 6.8992 6.77583 5.37663 8.36713 6.18053L41.0231 22.6777ZM34.9324 22.9619L9.17247 9.94845L13.4442 22.8966C13.4514 22.9183 13.4584 22.9401 13.4652 22.9619H34.9324ZM13.466 25.9619C13.4589 25.9845 13.4516 26.0071 13.4442 26.0297L9.17253 38.9772L34.9362 25.9619H13.466Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };

package/assets/setting/index.tsx

@@ -1,35 +1,36 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface SettingProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const Setting = ({ fill = false, thick = false, size = 24 }: SettingProps) => {
+export const Setting = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: SettingProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM29 24C29 26.7614 26.7614 29 24 29C21.2386 29 19 26.7614 19 24C19 21.2386 21.2386 19 24 19C26.7614 19 29 21.2386 29 24Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM38.1925 12.5826L40.9845 17.4184L36.737 20.915L36.9183 22.5315C36.9722 23.0125 37 23.5024 37 24C37 24.4978 36.9722 24.9879 36.9182 25.4691L36.7369 27.0858L40.9845 30.5826L38.1925 35.4184L33.036 33.4866L31.7255 34.4568C30.9418 35.0369 30.0915 35.5305 29.1889 35.924L27.6962 36.5747L26.792 42H21.2081L20.3039 36.5747L18.8112 35.924C17.9083 35.5304 17.0578 35.0367 16.2739 34.4563L14.9633 33.4859L9.80757 35.4174L7.01562 30.5816L11.2631 27.085L11.0818 25.4685C11.0279 24.9875 11 24.4976 11 24C11 23.5022 11.0279 23.0121 11.0819 22.5309L11.2632 20.9142L7.01562 17.4174L9.80757 12.5816L14.9641 14.5134L16.2746 13.5432C17.0583 12.9631 17.9085 12.4695 18.8112 12.076L20.3039 11.4253L21.2081 6H26.792L27.6962 11.4253L29.1889 12.076C30.0918 12.4696 30.9423 12.9633 31.7262 13.5437L33.0367 14.5141L38.1925 12.5826Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM29 24C29 26.7614 26.7614 29 24 29C21.2386 29 19 26.7614 19 24C19 21.2386 21.2386 19 24 19C26.7614 19 29 21.2386 29 24Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM38.1925 12.5826L40.9845 17.4184L36.737 20.915L36.9183 22.5315C36.9722 23.0125 37 23.5024 37 24C37 24.4978 36.9722 24.9879 36.9182 25.4691L36.7369 27.0858L40.9845 30.5826L38.1925 35.4184L33.036 33.4866L31.7255 34.4568C30.9418 35.0369 30.0915 35.5305 29.1889 35.924L27.6962 36.5747L26.792 42H21.2081L20.3039 36.5747L18.8112 35.924C17.9083 35.5304 17.0578 35.0367 16.2739 34.4563L14.9633 33.4859L9.80757 35.4174L7.01562 30.5816L11.2631 27.085L11.0818 25.4685C11.0279 24.9875 11 24.4976 11 24C11 23.5022 11.0279 23.0121 11.0819 22.5309L11.2632 20.9142L7.01562 17.4174L9.80757 12.5816L14.9641 14.5134L16.2746 13.5432C17.0583 12.9631 17.9085 12.4695 18.8112 12.076L20.3039 11.4253L21.2081 6H26.792L27.6962 11.4253L29.1889 12.076C30.0918 12.4696 30.9423 12.9633 31.7262 13.5437L33.0367 14.5141L38.1925 12.5826Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM29 24C29 26.7614 26.7614 29 24 29C21.2386 29 19 26.7614 19 24C19 21.2386 21.2386 19 24 19C26.7614 19 29 21.2386 29 24Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM38.1925 12.5826L40.9845 17.4184L36.737 20.915L36.9183 22.5315C36.9722 23.0125 37 23.5024 37 24C37 24.4978 36.9722 24.9879 36.9182 25.4691L36.7369 27.0858L40.9845 30.5826L38.1925 35.4184L33.036 33.4866L31.7255 34.4568C30.9418 35.0369 30.0915 35.5305 29.1889 35.924L27.6962 36.5747L26.792 42H21.2081L20.3039 36.5747L18.8112 35.924C17.9083 35.5304 17.0578 35.0367 16.2739 34.4563L14.9633 33.4859L9.80757 35.4174L7.01562 30.5816L11.2631 27.085L11.0818 25.4685C11.0279 24.9875 11 24.4976 11 24C11 23.5022 11.0279 23.0121 11.0819 22.5309L11.2632 20.9142L7.01562 17.4174L9.80757 12.5816L14.9641 14.5134L16.2746 13.5432C17.0583 12.9631 17.9085 12.4695 18.8112 12.076L20.3039 11.4253L21.2081 6H26.792L27.6962 11.4253L29.1889 12.076C30.0918 12.4696 30.9423 12.9633 31.7262 13.5437L33.0367 14.5141L38.1925 12.5826Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM29 24C29 26.7614 26.7614 29 24 29C21.2386 29 19 26.7614 19 24C19 21.2386 21.2386 19 24 19C26.7614 19 29 21.2386 29 24Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM38.1925 12.5826L40.9845 17.4184L36.737 20.915L36.9183 22.5315C36.9722 23.0125 37 23.5024 37 24C37 24.4978 36.9722 24.9879 36.9182 25.4691L36.7369 27.0858L40.9845 30.5826L38.1925 35.4184L33.036 33.4866L31.7255 34.4568C30.9418 35.0369 30.0915 35.5305 29.1889 35.924L27.6962 36.5747L26.792 42H21.2081L20.3039 36.5747L18.8112 35.924C17.9083 35.5304 17.0578 35.0367 16.2739 34.4563L14.9633 33.4859L9.80757 35.4174L7.01562 30.5816L11.2631 27.085L11.0818 25.4685C11.0279 24.9875 11 24.4976 11 24C11 23.5022 11.0279 23.0121 11.0819 22.5309L11.2632 20.9142L7.01562 17.4174L9.80757 12.5816L14.9641 14.5134L16.2746 13.5432C17.0583 12.9631 17.9085 12.4695 18.8112 12.076L20.3039 11.4253L21.2081 6H26.792L27.6962 11.4253L29.1889 12.076C30.0918 12.4696 30.9423 12.9633 31.7262 13.5437L33.0367 14.5141L38.1925 12.5826Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM28 24C28 26.2091 26.2091 28 24 28C21.7909 28 20 26.2091 20 24C20 21.7909 21.7909 20 24 20C26.2091 20 28 21.7909 28 24Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM37.7501 13.8162L39.6949 17.1847L35.6828 20.4876L35.9245 22.643C35.9743 23.087 36 23.5397 36 24C36 24.4605 35.9743 24.9134 35.9244 25.3577L35.6826 27.5132L39.6949 30.8162L37.7501 34.1847L32.8779 32.3594L31.1305 33.653C30.4068 34.1888 29.622 34.6443 28.7893 35.0073L26.7991 35.8749L25.9449 41H22.0552L21.201 35.8749L19.2108 35.0073C18.3778 34.6442 17.5928 34.1885 16.869 33.6526L15.1215 32.3588L10.25 34.1838L8.30521 30.8153L12.3172 27.5124L12.0756 25.357C12.0258 24.913 12 24.4603 12 24C12 23.5395 12.0258 23.0866 12.0756 22.6423L12.3174 20.4868L8.30521 17.1838L10.25 13.8153L15.1222 15.6406L16.8696 14.347C17.5933 13.8112 18.3781 13.3557 19.2108 12.9927L21.201 12.1251L22.0552 7H25.9449L26.7991 12.1251L28.7893 12.9927C29.6223 13.3558 30.4073 13.8115 31.1311 14.3474L32.8786 15.6412L37.7501 13.8162Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM28 24C28 26.2091 26.2091 28 24 28C21.7909 28 20 26.2091 20 24C20 21.7909 21.7909 20 24 20C26.2091 20 28 21.7909 28 24Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM37.7501 13.8162L39.6949 17.1847L35.6828 20.4876L35.9245 22.643C35.9743 23.087 36 23.5397 36 24C36 24.4605 35.9743 24.9134 35.9244 25.3577L35.6826 27.5132L39.6949 30.8162L37.7501 34.1847L32.8779 32.3594L31.1305 33.653C30.4068 34.1888 29.622 34.6443 28.7893 35.0073L26.7991 35.8749L25.9449 41H22.0552L21.201 35.8749L19.2108 35.0073C18.3778 34.6442 17.5928 34.1885 16.869 33.6526L15.1215 32.3588L10.25 34.1838L8.30521 30.8153L12.3172 27.5124L12.0756 25.357C12.0258 24.913 12 24.4603 12 24C12 23.5395 12.0258 23.0866 12.0756 22.6423L12.3174 20.4868L8.30521 17.1838L10.25 13.8153L15.1222 15.6406L16.8696 14.347C17.5933 13.8112 18.3781 13.3557 19.2108 12.9927L21.201 12.1251L22.0552 7H25.9449L26.7991 12.1251L28.7893 12.9927C29.6223 13.3558 30.4073 13.8115 31.1311 14.3474L32.8786 15.6412L37.7501 13.8162Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM29 24C29 26.7614 26.7614 29 24 29C21.2386 29 19 26.7614 19 24C19 21.2386 21.2386 19 24 19C26.7614 19 29 21.2386 29 24Z" fill="currentColor"/>
-<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM38.1925 12.5826L40.9845 17.4184L36.737 20.915L36.9183 22.5315C36.9722 23.0125 37 23.5024 37 24C37 24.4978 36.9722 24.9879 36.9182 25.4691L36.7369 27.0858L40.9845 30.5826L38.1925 35.4184L33.036 33.4866L31.7255 34.4568C30.9418 35.0369 30.0915 35.5305 29.1889 35.924L27.6962 36.5747L26.792 42H21.2081L20.3039 36.5747L18.8112 35.924C17.9083 35.5304 17.0578 35.0367 16.2739 34.4563L14.9633 33.4859L9.80757 35.4174L7.01562 30.5816L11.2631 27.085L11.0818 25.4685C11.0279 24.9875 11 24.4976 11 24C11 23.5022 11.0279 23.0121 11.0819 22.5309L11.2632 20.9142L7.01562 17.4174L9.80757 12.5816L14.9641 14.5134L16.2746 13.5432C17.0583 12.9631 17.9085 12.4695 18.8112 12.076L20.3039 11.4253L21.2081 6H26.792L27.6962 11.4253L29.1889 12.076C30.0918 12.4696 30.9423 12.9633 31.7262 13.5437L33.0367 14.5141L38.1925 12.5826Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fillRule="evenodd" clipRule="evenodd" d="M32 24C32 28.4183 28.4183 32 24 32C19.5817 32 16 28.4183 16 24C16 19.5817 19.5817 16 24 16C28.4183 16 32 19.5817 32 24ZM29 24C29 26.7614 26.7614 29 24 29C21.2386 29 19 26.7614 19 24C19 21.2386 21.2386 19 24 19C26.7614 19 29 21.2386 29 24Z" style={{ fill: `var(--${color})` }}/>
+<path fillRule="evenodd" clipRule="evenodd" d="M29.3334 3L30.3877 9.32595C31.5005 9.81104 32.5474 10.419 33.5113 11.1327L39.5199 8.88167L44.8532 18.1193L39.8996 22.1973C39.966 22.789 40 23.3905 40 24C40 24.6098 39.9659 25.2116 39.8995 25.8036L44.8532 29.8817L39.5199 39.1193L33.5105 36.8679C32.5468 37.5814 31.5002 38.1891 30.3877 38.674L29.3334 45H18.6667L17.6124 38.674C16.4996 38.189 15.4527 37.581 14.4887 36.8673L8.48018 39.1183L3.14685 29.8807L8.10047 25.8027C8.03412 25.211 8.00004 24.6095 8.00004 24C8.00004 23.3902 8.03415 22.7884 8.10057 22.1964L3.14685 18.1183L8.48019 8.88073L14.4896 11.1321C15.4533 10.4186 16.4999 9.81089 17.6124 9.32595L18.6667 3H29.3334ZM38.1925 12.5826L40.9845 17.4184L36.737 20.915L36.9183 22.5315C36.9722 23.0125 37 23.5024 37 24C37 24.4978 36.9722 24.9879 36.9182 25.4691L36.7369 27.0858L40.9845 30.5826L38.1925 35.4184L33.036 33.4866L31.7255 34.4568C30.9418 35.0369 30.0915 35.5305 29.1889 35.924L27.6962 36.5747L26.792 42H21.2081L20.3039 36.5747L18.8112 35.924C17.9083 35.5304 17.0578 35.0367 16.2739 34.4563L14.9633 33.4859L9.80757 35.4174L7.01562 30.5816L11.2631 27.085L11.0818 25.4685C11.0279 24.9875 11 24.4976 11 24C11 23.5022 11.0279 23.0121 11.0819 22.5309L11.2632 20.9142L7.01562 17.4174L9.80757 12.5816L14.9641 14.5134L16.2746 13.5432C17.0583 12.9631 17.9085 12.4695 18.8112 12.076L20.3039 11.4253L21.2081 6H26.792L27.6962 11.4253L29.1889 12.076C30.0918 12.4696 30.9423 12.9633 31.7262 13.5437L33.0367 14.5141L38.1925 12.5826Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };

package/assets/share/index.tsx

@@ -1,35 +1,36 @@
-import React from 'react';
+import React from 'react';import { BasicColorType } from '@liner-fe/prism';
 
 interface ShareProps {
   fill?: boolean;
   thick?: boolean;
   size?: number
+  color?: BasicColorType;
 }
 
-export const Share = ({ fill = false, thick = false, size = 24 }: ShareProps) => {
+export const Share = ({ fill = false, thick = false, size = 24, color = 'neutral-label-primary' }: ShareProps) => {
   if (fill && thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M25.499 9.62004L34.6261 18.7471L36.7474 16.6257L26.4749 6.35325C25.108 4.98642 22.892 4.98642 21.5251 6.35325L11.2526 16.6257L13.374 18.7471L22.499 9.622V32.9999H25.499V9.62004Z" fill="currentColor"/>
-<path d="M39.5 38.9999V23.9999H42.5V38.9999C42.5 40.9329 40.933 42.4999 39 42.4999H9C7.067 42.4999 5.5 40.9329 5.5 38.9999V24H8.5V38.9999C8.5 39.2761 8.72386 39.4999 9 39.4999H39C39.2761 39.4999 39.5 39.2761 39.5 38.9999Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.499 9.62004L34.6261 18.7471L36.7474 16.6257L26.4749 6.35325C25.108 4.98642 22.892 4.98642 21.5251 6.35325L11.2526 16.6257L13.374 18.7471L22.499 9.622V32.9999H25.499V9.62004Z" style={{ fill: `var(--${color})` }}/>
+<path d="M39.5 38.9999V23.9999H42.5V38.9999C42.5 40.9329 40.933 42.4999 39 42.4999H9C7.067 42.4999 5.5 40.9329 5.5 38.9999V24H8.5V38.9999C8.5 39.2761 8.72386 39.4999 9 39.4999H39C39.2761 39.4999 39.5 39.2761 39.5 38.9999Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (fill) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M25.499 9.62004L34.6261 18.7471L36.7474 16.6257L26.4749 6.35325C25.108 4.98642 22.892 4.98642 21.5251 6.35325L11.2526 16.6257L13.374 18.7471L22.499 9.622V32.9999H25.499V9.62004Z" fill="currentColor"/>
-<path d="M39.5 38.9999V23.9999H42.5V38.9999C42.5 40.9329 40.933 42.4999 39 42.4999H9C7.067 42.4999 5.5 40.9329 5.5 38.9999V24H8.5V38.9999C8.5 39.2761 8.72386 39.4999 9 39.4999H39C39.2761 39.4999 39.5 39.2761 39.5 38.9999Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.499 9.62004L34.6261 18.7471L36.7474 16.6257L26.4749 6.35325C25.108 4.98642 22.892 4.98642 21.5251 6.35325L11.2526 16.6257L13.374 18.7471L22.499 9.622V32.9999H25.499V9.62004Z" style={{ fill: `var(--${color})` }}/>
+<path d="M39.5 38.9999V23.9999H42.5V38.9999C42.5 40.9329 40.933 42.4999 39 42.4999H9C7.067 42.4999 5.5 40.9329 5.5 38.9999V24H8.5V38.9999C8.5 39.2761 8.72386 39.4999 9 39.4999H39C39.2761 39.4999 39.5 39.2761 39.5 38.9999Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } else if (thick) {
-    return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M25.999 10.8271L34.2725 19.1006L37.1009 16.2722L26.8284 5.9997C25.2663 4.4376 22.7337 4.4376 21.1716 5.9997L10.8991 16.2722L13.7275 19.1006L21.999 10.8291V32.9999H25.999V10.8271Z" fill="currentColor"/>
-<path d="M39 38.9999V23.9999H43V38.9999C43 41.2091 41.2091 42.9999 39 42.9999H9C6.79086 42.9999 5 41.2091 5 38.9999V24H9V38.9999H39Z" fill="currentColor"/>
+    return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.999 10.8271L34.2725 19.1006L37.1009 16.2722L26.8284 5.9997C25.2663 4.4376 22.7337 4.4376 21.1716 5.9997L10.8991 16.2722L13.7275 19.1006L21.999 10.8291V32.9999H25.999V10.8271Z" style={{ fill: `var(--${color})` }}/>
+<path d="M39 38.9999V23.9999H43V38.9999C43 41.2091 41.2091 42.9999 39 42.9999H9C6.79086 42.9999 5 41.2091 5 38.9999V24H9V38.9999H39Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
   } 
   
-  return <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M25.499 9.62004L34.6261 18.7471L36.7474 16.6257L26.4749 6.35325C25.108 4.98642 22.892 4.98642 21.5251 6.35325L11.2526 16.6257L13.374 18.7471L22.499 9.622V32.9999H25.499V9.62004Z" fill="currentColor"/>
-<path d="M39.5 38.9999V23.9999H42.5V38.9999C42.5 40.9329 40.933 42.4999 39 42.4999H9C7.067 42.4999 5.5 40.9329 5.5 38.9999V24H8.5V38.9999C8.5 39.2761 8.72386 39.4999 9 39.4999H39C39.2761 39.4999 39.5 39.2761 39.5 38.9999Z" fill="currentColor"/>
+  return <svg width={size} height={size} viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M25.499 9.62004L34.6261 18.7471L36.7474 16.6257L26.4749 6.35325C25.108 4.98642 22.892 4.98642 21.5251 6.35325L11.2526 16.6257L13.374 18.7471L22.499 9.622V32.9999H25.499V9.62004Z" style={{ fill: `var(--${color})` }}/>
+<path d="M39.5 38.9999V23.9999H42.5V38.9999C42.5 40.9329 40.933 42.4999 39 42.4999H9C7.067 42.4999 5.5 40.9329 5.5 38.9999V24H8.5V38.9999C8.5 39.2761 8.72386 39.4999 9 39.4999H39C39.2761 39.4999 39.5 39.2761 39.5 38.9999Z" style={{ fill: `var(--${color})` }}/>
 </svg>
 ;
 };