feat: Add Online Drive file management components and enhance file icon handling
parent
42655a3b1f
commit
4c82c9d029
@ -0,0 +1,61 @@
|
||||
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g filter="url(#filter0_dg_9100_35711)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.93353 4.92661C2.89594 4.7923 2.875 4.65006 2.875 4.49999C2.875 3.87927 3.23334 3.39224 3.64546 3.04834C4.06181 2.70093 4.61943 2.4217 5.24258 2.20177C6.49565 1.75951 8.1777 1.5 10 1.5C11.8223 1.5 13.5044 1.75951 14.7574 2.20177C15.3806 2.4217 15.9382 2.70093 16.3545 3.04834C16.7667 3.39224 17.125 3.87927 17.125 4.49999C17.125 4.65011 17.104 4.79242 17.0664 4.92676L15.5233 14.6092C15.4517 15.1277 15.1621 15.5477 14.8098 15.867C14.456 16.1877 14.0028 16.4419 13.5123 16.6392C12.5299 17.0342 11.2752 17.2499 10 17.2499C8.72762 17.2499 7.48138 17.0419 6.50197 16.6499C5.58181 16.2816 4.63932 15.6399 4.47799 14.6173L4.47785 14.6165L2.93353 4.92661ZM15.3935 4.79995C15.1646 4.99091 14.7887 5.19651 14.2582 5.38375C13.2039 5.75583 11.6985 6 10 6C8.30148 6 6.79603 5.75583 5.7418 5.38375C5.2113 5.19651 4.83532 4.99091 4.60649 4.79995C4.35379 4.58909 4.34365 4.41936 4.60649 4.20004C4.83532 4.00908 5.2113 3.80347 5.7418 3.61624C6.79603 3.24416 8.30148 2.99998 10 2.99998C11.6985 2.99998 13.2039 3.24416 14.2582 3.61624C14.7887 3.80347 15.1646 4.00908 15.3935 4.20004C15.6535 4.41698 15.6591 4.57832 15.3935 4.79995Z" fill="url(#paint0_linear_9100_35711)"/>
|
||||
<path d="M10 1.75C11.8015 1.75 13.454 2.00701 14.6738 2.4375C15.2815 2.65197 15.8093 2.91891 16.1943 3.24023C16.5772 3.55975 16.875 3.98319 16.875 4.5C16.875 4.6265 16.8569 4.74611 16.8252 4.85938L16.8223 4.87305L16.8193 4.8877L15.2764 14.5693L15.2754 14.5752C15.2141 15.0182 14.9653 15.3882 14.6416 15.6816C14.3164 15.9764 13.8919 16.2171 13.4189 16.4072C12.4721 16.788 11.2501 17 10 17C8.75169 17 7.53815 16.7956 6.59473 16.418C5.68992 16.0559 4.86386 15.4608 4.72461 14.5781V14.5762L3.18066 4.8877L3.17773 4.87305L3.17383 4.85938L3.1377 4.68457C3.12934 4.62474 3.125 4.56323 3.125 4.5C3.125 3.98318 3.42277 3.55974 3.80566 3.24023C4.19077 2.91891 4.71851 2.65197 5.32617 2.4375C6.54607 2.00701 8.1985 1.75 10 1.75ZM10 2.75C8.28084 2.75 6.74557 2.99708 5.6582 3.38086C5.11261 3.57347 4.70632 3.79086 4.44629 4.00781C4.30195 4.12826 4.16025 4.29177 4.16309 4.50684C4.16605 4.71916 4.30918 4.87778 4.44629 4.99219C4.70632 5.20914 5.11262 5.42654 5.6582 5.61914C6.74557 6.00292 8.28084 6.25 10 6.25C11.7192 6.25 13.2544 6.00292 14.3418 5.61914C14.8874 5.42653 15.2937 5.20915 15.5537 4.99219C15.6953 4.87406 15.8424 4.71212 15.8408 4.49609C15.8391 4.2817 15.6913 4.12258 15.5537 4.00781C15.2937 3.79085 14.8874 3.57347 14.3418 3.38086C13.2544 2.99708 11.7192 2.75 10 2.75Z" stroke="white" stroke-opacity="0.01" stroke-width="0.5"/>
|
||||
</g>
|
||||
<path opacity="0.8" d="M10 9.375C9.28547 9.375 8.67149 9.8031 8.39956 10.4162C7.7401 10.5741 7.25 11.1672 7.25 11.875C7.25 12.7034 7.92157 13.375 8.75 13.375H11.5C12.1904 13.375 12.75 12.8154 12.75 12.125C12.75 11.5151 12.3132 11.0072 11.7353 10.8971C11.6236 10.0383 10.8893 9.375 10 9.375Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.93353 4.92665C2.89594 4.79234 2.875 4.6501 2.875 4.50003C2.875 4.36905 2.89096 4.24402 2.92001 4.12503C2.92424 4.14236 2.92875 4.15957 2.93353 4.17665L4.47799 13.8674C4.63931 14.8899 5.58181 15.5316 6.50197 15.8999C7.48138 16.2919 8.72762 16.5 10 16.5C11.2752 16.5 12.5299 16.2843 13.5123 15.8892C14.0028 15.692 14.456 15.4377 14.8098 15.117C15.1621 14.7977 15.4517 14.3777 15.5233 13.8592L17.0664 4.1768C17.0712 4.15967 17.0757 4.1424 17.08 4.125C17.109 4.244 17.125 4.36904 17.125 4.50003C17.125 4.65015 17.104 4.79246 17.0664 4.9268L15.5233 14.6092C15.4517 15.1277 15.1621 15.5477 14.8098 15.867C14.456 16.1877 14.0028 16.442 13.5123 16.6392C12.5299 17.0343 11.2752 17.25 10 17.25C8.72762 17.25 7.48138 17.0419 6.50197 16.6499C5.58181 16.2816 4.63931 15.6399 4.47799 14.6174L2.93353 4.92665Z" fill="#101828" fill-opacity="0.14"/>
|
||||
<defs>
|
||||
<filter id="filter0_dg_9100_35711" x="0.875" y="0.3" width="18.25" height="19.95" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dy="1"/>
|
||||
<feGaussianBlur stdDeviation="1"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0.0352941 0 0 0 0 0.0352941 0 0 0 0 0.0431373 0 0 0 0.05 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_9100_35711"/>
|
||||
<feBlend mode="normal" in="BackgroundImageFix" in2="effect1_dropShadow_9100_35711" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="5297" result="displacementX" />
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="5298" result="displacementY" />
|
||||
<feColorMatrix in="displacementX" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXRed" />
|
||||
<feColorMatrix in="displacementY" type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" />
|
||||
<feComposite in="displacementXRed" operator="arithmetic" k1="0" k2="1" k3="1" k4="0"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="sourceDisplacedAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="inputSourceAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feComposite in="sourceDisplacedAlpha" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" result="displacementAlphasMultiplied"/>
|
||||
<feComposite in="displacementAlphasMultiplied" operator="arithmetic" k1="0" k2="0" k3="-0.5" k4="0.5" result="centeringAdjustment"/>
|
||||
<feComposite in="displacementX" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXFinal" />
|
||||
<feComposite in="displacementY" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" result="displacementYFinal" />
|
||||
<feComposite in="displacementXFinal" in2="displacementYFinal" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="in" result="displacementMap" />
|
||||
<feFlood flood-color="rgb(127, 127, 127)" flood-opacity="1"/>
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="out" />
|
||||
<feComposite in2="displacementMap" operator="over" result="displacementMapWithBg"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImage" />
|
||||
<feColorMatrix in="shape" type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 127 0" result="imageOpaque" />
|
||||
<feDisplacementMap in="imageOpaque" in2="displacementMapWithBg" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImageOpaque" />
|
||||
<feColorMatrix in="displacedImage" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="displacedImageRed" />
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" />
|
||||
<feComposite in="displacedImageRed" operator="atop" result="transparencyRedMap"/>
|
||||
<feColorMatrix in="transparencyRedMap" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0" result="transparencyAlphaMap" />
|
||||
<feComposite in="displacedImageOpaque" in2="imageOpaque" operator="over" />
|
||||
<feComposite in2="transparencyAlphaMap" operator="in" result="effect2_texture_9100_35711"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_9100_35711" x1="10" y1="1.5" x2="10" y2="17.2499" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#296DFF"/>
|
||||
<stop offset="1" stop-color="#155AEF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.3 KiB |
@ -0,0 +1,61 @@
|
||||
<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g filter="url(#filter0_dg_9155_106569)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.71865 4.37937C2.68524 4.25999 2.66663 4.13355 2.66663 4.00016C2.66663 3.4484 2.98515 3.01549 3.35148 2.7098C3.72157 2.40099 4.21723 2.15279 4.77114 1.95729C5.88498 1.56417 7.38013 1.3335 8.99996 1.3335C10.6198 1.3335 12.115 1.56417 13.2288 1.95729C13.7827 2.15279 14.2784 2.40099 14.6484 2.7098C15.0148 3.01549 15.3333 3.4484 15.3333 4.00016C15.3333 4.1336 15.3146 4.26009 15.2812 4.37951L13.9096 12.9861C13.8459 13.447 13.5885 13.8203 13.2754 14.1042C12.9608 14.3892 12.558 14.6152 12.122 14.7906C11.2488 15.1417 10.1334 15.3334 8.99996 15.3334C7.86896 15.3334 6.76119 15.1485 5.8906 14.8C5.07268 14.4727 4.23491 13.9023 4.09151 12.9934L4.09139 12.9926L2.71865 4.37937ZM13.7942 4.26678C13.5908 4.43652 13.2566 4.61928 12.785 4.78572C11.8479 5.11646 10.5098 5.3335 8.99996 5.3335C7.49016 5.3335 6.15199 5.11646 5.21489 4.78572C4.74334 4.61928 4.40913 4.43652 4.20573 4.26678C3.98111 4.07936 3.97209 3.92848 4.20573 3.73353C4.40913 3.56379 4.74334 3.38103 5.21489 3.2146C6.15199 2.88386 7.49016 2.66682 8.99996 2.66682C10.5098 2.66682 11.8479 2.88386 12.785 3.2146C13.2566 3.38103 13.5908 3.56379 13.7942 3.73353C14.0253 3.92637 14.0303 4.06978 13.7942 4.26678Z" fill="url(#paint0_linear_9155_106569)"/>
|
||||
<path d="M8.99963 1.5835C10.5986 1.5835 12.0645 1.81154 13.1451 2.19287C13.6835 2.38289 14.1491 2.61917 14.4879 2.90186C14.825 3.18316 15.0836 3.55264 15.0836 4.00049C15.0836 4.11011 15.0681 4.21383 15.0406 4.31201L15.0367 4.32568L15.0348 4.34033L13.6627 12.9468L13.6617 12.9517C13.6085 13.3371 13.3916 13.6605 13.1071 13.9185C12.8211 14.1776 12.4474 14.3908 12.0289 14.5591C11.1912 14.8959 10.1081 15.0835 8.99963 15.0835C7.89281 15.0835 6.81755 14.9019 5.98303 14.5679C5.18068 14.2467 4.4599 13.7234 4.3385 12.9546V12.9526L2.96545 4.34033L2.9635 4.32568L2.95959 4.31201L2.92737 4.16064C2.92011 4.10875 2.91664 4.05535 2.91663 4.00049C2.91663 3.55274 3.17436 3.18313 3.51135 2.90186C3.85017 2.61914 4.31573 2.38291 4.85413 2.19287C5.93475 1.81147 7.40056 1.58353 8.99963 1.5835ZM8.99963 2.4165C7.46933 2.41654 6.10163 2.63659 5.13147 2.979C4.64464 3.15085 4.28017 3.34571 4.04553 3.5415C3.91579 3.64976 3.78112 3.80197 3.78381 4.00635C3.7865 4.20806 3.92243 4.35576 4.04553 4.4585C4.28015 4.65428 4.64467 4.84915 5.13147 5.021C6.10163 5.36341 7.46933 5.58346 8.99963 5.5835C10.5299 5.5835 11.8975 5.36338 12.8678 5.021C13.3547 4.84912 13.72 4.65433 13.9547 4.4585C14.0815 4.35269 14.2209 4.20184 14.2194 3.99658C14.2178 3.79281 14.0778 3.64424 13.9547 3.5415C13.72 3.34567 13.3547 3.15088 12.8678 2.979C11.8975 2.63664 10.5299 2.4165 8.99963 2.4165Z" stroke="white" stroke-opacity="0.01" stroke-width="0.5"/>
|
||||
</g>
|
||||
<path opacity="0.8" d="M8.99999 8.3335C8.36485 8.3335 7.81909 8.71403 7.57737 9.25902C6.99119 9.39939 6.55554 9.92652 6.55554 10.5557C6.55554 11.2921 7.1525 11.8891 7.88888 11.8891H10.3333C10.947 11.8891 11.4444 11.3916 11.4444 10.7779C11.4444 10.2358 11.0561 9.78432 10.5425 9.68647C10.4432 8.92308 9.79045 8.3335 8.99999 8.3335Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.71865 4.37908C2.68524 4.2597 2.66663 4.13326 2.66663 3.99986C2.66663 3.88343 2.68081 3.7723 2.70663 3.66653C2.71039 3.68194 2.7144 3.69723 2.71865 3.71241L4.09151 12.3264C4.23491 13.2353 5.07268 13.8057 5.8906 14.1331C6.76119 14.4815 7.86896 14.6665 8.99996 14.6665C10.1334 14.6665 11.2488 14.4747 12.122 14.1236C12.558 13.9483 12.9608 13.7223 13.2754 13.4372C13.5885 13.1533 13.8459 12.78 13.9096 12.3191L15.2812 3.71255C15.2855 3.69732 15.2895 3.68197 15.2933 3.6665C15.3191 3.77228 15.3333 3.88343 15.3333 3.99986C15.3333 4.1333 15.3146 4.2598 15.2812 4.37922L13.9096 12.9858C13.8459 13.4467 13.5885 13.82 13.2754 14.1039C12.9608 14.3889 12.558 14.6149 12.122 14.7903C11.2488 15.1414 10.1334 15.3331 8.99996 15.3331C7.86896 15.3331 6.76119 15.1482 5.8906 14.7997C5.07268 14.4724 4.23491 13.902 4.09151 12.9931L2.71865 4.37908Z" fill="#101828" fill-opacity="0.14"/>
|
||||
<defs>
|
||||
<filter id="filter0_dg_9155_106569" x="0.666626" y="0.133496" width="16.6666" height="18.2" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dy="1"/>
|
||||
<feGaussianBlur stdDeviation="1"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0.0352941 0 0 0 0 0.0352941 0 0 0 0 0.0431373 0 0 0 0.05 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_9155_106569"/>
|
||||
<feBlend mode="normal" in="BackgroundImageFix" in2="effect1_dropShadow_9155_106569" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="5297" result="displacementX" />
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="5298" result="displacementY" />
|
||||
<feColorMatrix in="displacementX" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXRed" />
|
||||
<feColorMatrix in="displacementY" type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" />
|
||||
<feComposite in="displacementXRed" operator="arithmetic" k1="0" k2="1" k3="1" k4="0"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="sourceDisplacedAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="inputSourceAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feComposite in="sourceDisplacedAlpha" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" result="displacementAlphasMultiplied"/>
|
||||
<feComposite in="displacementAlphasMultiplied" operator="arithmetic" k1="0" k2="0" k3="-0.5" k4="0.5" result="centeringAdjustment"/>
|
||||
<feComposite in="displacementX" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXFinal" />
|
||||
<feComposite in="displacementY" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" result="displacementYFinal" />
|
||||
<feComposite in="displacementXFinal" in2="displacementYFinal" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="in" result="displacementMap" />
|
||||
<feFlood flood-color="rgb(127, 127, 127)" flood-opacity="1"/>
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="out" />
|
||||
<feComposite in2="displacementMap" operator="over" result="displacementMapWithBg"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImage" />
|
||||
<feColorMatrix in="shape" type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 127 0" result="imageOpaque" />
|
||||
<feDisplacementMap in="imageOpaque" in2="displacementMapWithBg" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImageOpaque" />
|
||||
<feColorMatrix in="displacedImage" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="displacedImageRed" />
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" />
|
||||
<feComposite in="displacedImageRed" operator="atop" result="transparencyRedMap"/>
|
||||
<feColorMatrix in="transparencyRedMap" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0" result="transparencyAlphaMap" />
|
||||
<feComposite in="displacedImageOpaque" in2="imageOpaque" operator="over" />
|
||||
<feComposite in2="transparencyAlphaMap" operator="in" result="effect2_texture_9155_106569"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_9155_106569" x1="8.99996" y1="1.3335" x2="8.99996" y2="15.3334" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#98A2B2"/>
|
||||
<stop offset="1" stop-color="#676F83"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.5 KiB |
@ -0,0 +1,111 @@
|
||||
<svg width="20" height="19" viewBox="0 0 20 19" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g filter="url(#filter0_dg_9155_106307)">
|
||||
<path d="M11.8106 3.75L8.81065 6.75H2.5V15C2.5 15.4142 2.83579 15.75 3.25 15.75H16.75C17.1642 15.75 17.5 15.4142 17.5 15V4.5C17.5 4.08579 17.1642 3.75 16.75 3.75H11.8106Z" fill="url(#paint0_linear_9155_106307)"/>
|
||||
<path d="M16.75 4C17.0262 4 17.25 4.22386 17.25 4.5V15C17.25 15.2762 17.0262 15.5 16.75 15.5H3.25C2.97386 15.5 2.75 15.2762 2.75 15V7H8.91406L11.9141 4H16.75Z" stroke="white" stroke-opacity="0.01" stroke-width="0.5"/>
|
||||
</g>
|
||||
<g opacity="0.6" filter="url(#filter1_dg_9155_106307)">
|
||||
<path d="M3.25 2.25C2.83579 2.25 2.5 2.58579 2.5 3V5.25H8.18934L10 3.43934L8.81065 2.25H3.25Z" fill="#296DFF"/>
|
||||
<path d="M3.25 2.5H8.70703L9.64648 3.43945L8.08594 5H2.75V3C2.75 2.72386 2.97386 2.5 3.25 2.5Z" stroke="white" stroke-opacity="0.01" stroke-width="0.5"/>
|
||||
</g>
|
||||
<path d="M17.5 15C17.5 15.4142 17.1642 15.75 16.75 15.75H3.25C2.83579 15.75 2.5 15.4142 2.5 15V14.25H17.5V15Z" fill="#101828" fill-opacity="0.14"/>
|
||||
<defs>
|
||||
<filter id="filter0_dg_9155_106307" x="0.5" y="2.55" width="19" height="16.2" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dy="1"/>
|
||||
<feGaussianBlur stdDeviation="1"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0.0352941 0 0 0 0 0.0352941 0 0 0 0 0.0431373 0 0 0 0.05 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_9155_106307"/>
|
||||
<feBlend mode="normal" in="BackgroundImageFix" in2="effect1_dropShadow_9155_106307" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="8029" result="displacementX" />
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="8030" result="displacementY" />
|
||||
<feColorMatrix in="displacementX" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXRed" />
|
||||
<feColorMatrix in="displacementY" type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" />
|
||||
<feComposite in="displacementXRed" operator="arithmetic" k1="0" k2="1" k3="1" k4="0"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="sourceDisplacedAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="inputSourceAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feComposite in="sourceDisplacedAlpha" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" result="displacementAlphasMultiplied"/>
|
||||
<feComposite in="displacementAlphasMultiplied" operator="arithmetic" k1="0" k2="0" k3="-0.5" k4="0.5" result="centeringAdjustment"/>
|
||||
<feComposite in="displacementX" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXFinal" />
|
||||
<feComposite in="displacementY" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" result="displacementYFinal" />
|
||||
<feComposite in="displacementXFinal" in2="displacementYFinal" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="in" result="displacementMap" />
|
||||
<feFlood flood-color="rgb(127, 127, 127)" flood-opacity="1"/>
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="out" />
|
||||
<feComposite in2="displacementMap" operator="over" result="displacementMapWithBg"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImage" />
|
||||
<feColorMatrix in="shape" type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 127 0" result="imageOpaque" />
|
||||
<feDisplacementMap in="imageOpaque" in2="displacementMapWithBg" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImageOpaque" />
|
||||
<feColorMatrix in="displacedImage" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="displacedImageRed" />
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" />
|
||||
<feComposite in="displacedImageRed" operator="atop" result="transparencyRedMap"/>
|
||||
<feColorMatrix in="transparencyRedMap" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0" result="transparencyAlphaMap" />
|
||||
<feComposite in="displacedImageOpaque" in2="imageOpaque" operator="over" />
|
||||
<feComposite in2="transparencyAlphaMap" operator="in" result="effect2_texture_9155_106307"/>
|
||||
</filter>
|
||||
<filter id="filter1_dg_9155_106307" x="0.5" y="1.05" width="11.5" height="7.2" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||
<feOffset dy="1"/>
|
||||
<feGaussianBlur stdDeviation="1"/>
|
||||
<feComposite in2="hardAlpha" operator="out"/>
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0.0352941 0 0 0 0 0.0352941 0 0 0 0 0.0431373 0 0 0 0.05 0"/>
|
||||
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_9155_106307"/>
|
||||
<feBlend mode="normal" in="BackgroundImageFix" in2="effect1_dropShadow_9155_106307" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="8754" result="displacementX" />
|
||||
<feTurbulence type="fractalNoise" baseFrequency="9.0909090042114258 9.0909090042114258" numOctaves="3" seed="8755" result="displacementY" />
|
||||
<feColorMatrix in="displacementX" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXRed" />
|
||||
<feColorMatrix in="displacementY" type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" />
|
||||
<feComposite in="displacementXRed" operator="arithmetic" k1="0" k2="1" k3="1" k4="0"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="sourceDisplacedAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
|
||||
<feComponentTransfer result="inputSourceAlpha">
|
||||
<feFuncA type="gamma" exponent="0.2" />
|
||||
</feComponentTransfer>
|
||||
<feComposite in="sourceDisplacedAlpha" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" result="displacementAlphasMultiplied"/>
|
||||
<feComposite in="displacementAlphasMultiplied" operator="arithmetic" k1="0" k2="0" k3="-0.5" k4="0.5" result="centeringAdjustment"/>
|
||||
<feComposite in="displacementX" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1" result="displacementXFinal" />
|
||||
<feComposite in="displacementY" in2="displacementAlphasMultiplied" operator="arithmetic" k1="1" k2="0" k3="0" k4="0" />
|
||||
<feComposite in="centeringAdjustment" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1" result="displacementYFinal" />
|
||||
<feComposite in="displacementXFinal" in2="displacementYFinal" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" />
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="in" result="displacementMap" />
|
||||
<feFlood flood-color="rgb(127, 127, 127)" flood-opacity="1"/>
|
||||
<feComposite in2="displacementAlphasMultiplied" operator="out" />
|
||||
<feComposite in2="displacementMap" operator="over" result="displacementMapWithBg"/>
|
||||
<feDisplacementMap in="shape" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImage" />
|
||||
<feColorMatrix in="shape" type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 127 0" result="imageOpaque" />
|
||||
<feDisplacementMap in="imageOpaque" in2="displacementMapWithBg" scale="2.4000000953674316" xChannelSelector="R" yChannelSelector="G" width="100%" height="100%" result="displacedImageOpaque" />
|
||||
<feColorMatrix in="displacedImage" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="displacedImageRed" />
|
||||
<feColorMatrix in="shape" type="matrix" values="0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" />
|
||||
<feComposite in="displacedImageRed" operator="atop" result="transparencyRedMap"/>
|
||||
<feColorMatrix in="transparencyRedMap" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0" result="transparencyAlphaMap" />
|
||||
<feComposite in="displacedImageOpaque" in2="imageOpaque" operator="over" />
|
||||
<feComposite in2="transparencyAlphaMap" operator="in" result="effect2_texture_9155_106307"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_9155_106307" x1="10" y1="3.75" x2="10" y2="15.75" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#296DFF"/>
|
||||
<stop offset="1" stop-color="#155AEF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 9.8 KiB |
@ -0,0 +1,591 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "20",
|
||||
"height": "21",
|
||||
"viewBox": "0 0 20 21",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"filter": "url(#filter0_dg_9100_35711)"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M2.93353 4.92661C2.89594 4.7923 2.875 4.65006 2.875 4.49999C2.875 3.87927 3.23334 3.39224 3.64546 3.04834C4.06181 2.70093 4.61943 2.4217 5.24258 2.20177C6.49565 1.75951 8.1777 1.5 10 1.5C11.8223 1.5 13.5044 1.75951 14.7574 2.20177C15.3806 2.4217 15.9382 2.70093 16.3545 3.04834C16.7667 3.39224 17.125 3.87927 17.125 4.49999C17.125 4.65011 17.104 4.79242 17.0664 4.92676L15.5233 14.6092C15.4517 15.1277 15.1621 15.5477 14.8098 15.867C14.456 16.1877 14.0028 16.4419 13.5123 16.6392C12.5299 17.0342 11.2752 17.2499 10 17.2499C8.72762 17.2499 7.48138 17.0419 6.50197 16.6499C5.58181 16.2816 4.63932 15.6399 4.47799 14.6173L4.47785 14.6165L2.93353 4.92661ZM15.3935 4.79995C15.1646 4.99091 14.7887 5.19651 14.2582 5.38375C13.2039 5.75583 11.6985 6 10 6C8.30148 6 6.79603 5.75583 5.7418 5.38375C5.2113 5.19651 4.83532 4.99091 4.60649 4.79995C4.35379 4.58909 4.34365 4.41936 4.60649 4.20004C4.83532 4.00908 5.2113 3.80347 5.7418 3.61624C6.79603 3.24416 8.30148 2.99998 10 2.99998C11.6985 2.99998 13.2039 3.24416 14.2582 3.61624C14.7887 3.80347 15.1646 4.00908 15.3935 4.20004C15.6535 4.41698 15.6591 4.57832 15.3935 4.79995Z",
|
||||
"fill": "url(#paint0_linear_9100_35711)"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M10 1.75C11.8015 1.75 13.454 2.00701 14.6738 2.4375C15.2815 2.65197 15.8093 2.91891 16.1943 3.24023C16.5772 3.55975 16.875 3.98319 16.875 4.5C16.875 4.6265 16.8569 4.74611 16.8252 4.85938L16.8223 4.87305L16.8193 4.8877L15.2764 14.5693L15.2754 14.5752C15.2141 15.0182 14.9653 15.3882 14.6416 15.6816C14.3164 15.9764 13.8919 16.2171 13.4189 16.4072C12.4721 16.788 11.2501 17 10 17C8.75169 17 7.53815 16.7956 6.59473 16.418C5.68992 16.0559 4.86386 15.4608 4.72461 14.5781V14.5762L3.18066 4.8877L3.17773 4.87305L3.17383 4.85938L3.1377 4.68457C3.12934 4.62474 3.125 4.56323 3.125 4.5C3.125 3.98318 3.42277 3.55974 3.80566 3.24023C4.19077 2.91891 4.71851 2.65197 5.32617 2.4375C6.54607 2.00701 8.1985 1.75 10 1.75ZM10 2.75C8.28084 2.75 6.74557 2.99708 5.6582 3.38086C5.11261 3.57347 4.70632 3.79086 4.44629 4.00781C4.30195 4.12826 4.16025 4.29177 4.16309 4.50684C4.16605 4.71916 4.30918 4.87778 4.44629 4.99219C4.70632 5.20914 5.11262 5.42654 5.6582 5.61914C6.74557 6.00292 8.28084 6.25 10 6.25C11.7192 6.25 13.2544 6.00292 14.3418 5.61914C14.8874 5.42653 15.2937 5.20915 15.5537 4.99219C15.6953 4.87406 15.8424 4.71212 15.8408 4.49609C15.8391 4.2817 15.6913 4.12258 15.5537 4.00781C15.2937 3.79085 14.8874 3.57347 14.3418 3.38086C13.2544 2.99708 11.7192 2.75 10 2.75Z",
|
||||
"stroke": "white",
|
||||
"stroke-opacity": "0.01",
|
||||
"stroke-width": "0.5"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"opacity": "0.8",
|
||||
"d": "M10 9.375C9.28547 9.375 8.67149 9.8031 8.39956 10.4162C7.7401 10.5741 7.25 11.1672 7.25 11.875C7.25 12.7034 7.92157 13.375 8.75 13.375H11.5C12.1904 13.375 12.75 12.8154 12.75 12.125C12.75 11.5151 12.3132 11.0072 11.7353 10.8971C11.6236 10.0383 10.8893 9.375 10 9.375Z",
|
||||
"fill": "white"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M2.93353 4.92665C2.89594 4.79234 2.875 4.6501 2.875 4.50003C2.875 4.36905 2.89096 4.24402 2.92001 4.12503C2.92424 4.14236 2.92875 4.15957 2.93353 4.17665L4.47799 13.8674C4.63931 14.8899 5.58181 15.5316 6.50197 15.8999C7.48138 16.2919 8.72762 16.5 10 16.5C11.2752 16.5 12.5299 16.2843 13.5123 15.8892C14.0028 15.692 14.456 15.4377 14.8098 15.117C15.1621 14.7977 15.4517 14.3777 15.5233 13.8592L17.0664 4.1768C17.0712 4.15967 17.0757 4.1424 17.08 4.125C17.109 4.244 17.125 4.36904 17.125 4.50003C17.125 4.65015 17.104 4.79246 17.0664 4.9268L15.5233 14.6092C15.4517 15.1277 15.1621 15.5477 14.8098 15.867C14.456 16.1877 14.0028 16.442 13.5123 16.6392C12.5299 17.0343 11.2752 17.25 10 17.25C8.72762 17.25 7.48138 17.0419 6.50197 16.6499C5.58181 16.2816 4.63931 15.6399 4.47799 14.6174L2.93353 4.92665Z",
|
||||
"fill": "#101828",
|
||||
"fill-opacity": "0.14"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "defs",
|
||||
"attributes": {},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "filter",
|
||||
"attributes": {
|
||||
"id": "filter0_dg_9100_35711",
|
||||
"x": "0.875",
|
||||
"y": "0.3",
|
||||
"width": "18.25",
|
||||
"height": "19.95",
|
||||
"filterUnits": "userSpaceOnUse",
|
||||
"color-interpolation-filters": "sRGB"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFlood",
|
||||
"attributes": {
|
||||
"flood-opacity": "0",
|
||||
"result": "BackgroundImageFix"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "SourceAlpha",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",
|
||||
"result": "hardAlpha"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feOffset",
|
||||
"attributes": {
|
||||
"dy": "1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feGaussianBlur",
|
||||
"attributes": {
|
||||
"stdDeviation": "1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "hardAlpha",
|
||||
"operator": "out"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0.0352941 0 0 0 0 0.0352941 0 0 0 0 0.0431373 0 0 0 0.05 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feBlend",
|
||||
"attributes": {
|
||||
"mode": "normal",
|
||||
"in2": "BackgroundImageFix",
|
||||
"result": "effect1_dropShadow_9100_35711"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feBlend",
|
||||
"attributes": {
|
||||
"mode": "normal",
|
||||
"in": "BackgroundImageFix",
|
||||
"in2": "effect1_dropShadow_9100_35711",
|
||||
"result": "BackgroundImageFix"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feBlend",
|
||||
"attributes": {
|
||||
"mode": "normal",
|
||||
"in": "SourceGraphic",
|
||||
"in2": "BackgroundImageFix",
|
||||
"result": "shape"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feTurbulence",
|
||||
"attributes": {
|
||||
"type": "fractalNoise",
|
||||
"baseFrequency": "9.0909090042114258 9.0909090042114258",
|
||||
"numOctaves": "3",
|
||||
"seed": "5297",
|
||||
"result": "displacementX"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feTurbulence",
|
||||
"attributes": {
|
||||
"type": "fractalNoise",
|
||||
"baseFrequency": "9.0909090042114258 9.0909090042114258",
|
||||
"numOctaves": "3",
|
||||
"seed": "5298",
|
||||
"result": "displacementY"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "displacementX",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1",
|
||||
"result": "displacementXRed"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "displacementY",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementXRed",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feDisplacementMap",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"scale": "2.4000000953674316",
|
||||
"xChannelSelector": "R",
|
||||
"yChannelSelector": "G",
|
||||
"width": "100%",
|
||||
"height": "100%"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComponentTransfer",
|
||||
"attributes": {
|
||||
"result": "sourceDisplacedAlpha"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFuncA",
|
||||
"attributes": {
|
||||
"type": "gamma",
|
||||
"exponent": "0.2"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComponentTransfer",
|
||||
"attributes": {
|
||||
"result": "inputSourceAlpha"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFuncA",
|
||||
"attributes": {
|
||||
"type": "gamma",
|
||||
"exponent": "0.2"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "sourceDisplacedAlpha",
|
||||
"operator": "arithmetic",
|
||||
"k1": "1",
|
||||
"k2": "0",
|
||||
"k3": "0",
|
||||
"k4": "0",
|
||||
"result": "displacementAlphasMultiplied"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementAlphasMultiplied",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "0",
|
||||
"k3": "-0.5",
|
||||
"k4": "0.5",
|
||||
"result": "centeringAdjustment"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementX",
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "arithmetic",
|
||||
"k1": "1",
|
||||
"k2": "0",
|
||||
"k3": "0",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "centeringAdjustment",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1",
|
||||
"result": "displacementXFinal"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementY",
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "arithmetic",
|
||||
"k1": "1",
|
||||
"k2": "0",
|
||||
"k3": "0",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "centeringAdjustment",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1",
|
||||
"result": "displacementYFinal"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementXFinal",
|
||||
"in2": "displacementYFinal",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "in",
|
||||
"result": "displacementMap"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFlood",
|
||||
"attributes": {
|
||||
"flood-color": "rgb(127, 127, 127)",
|
||||
"flood-opacity": "1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "out"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "displacementMap",
|
||||
"operator": "over",
|
||||
"result": "displacementMapWithBg"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feDisplacementMap",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"scale": "2.4000000953674316",
|
||||
"xChannelSelector": "R",
|
||||
"yChannelSelector": "G",
|
||||
"width": "100%",
|
||||
"height": "100%",
|
||||
"result": "displacedImage"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"type": "matrix",
|
||||
"values": "1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 127 0",
|
||||
"result": "imageOpaque"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feDisplacementMap",
|
||||
"attributes": {
|
||||
"in": "imageOpaque",
|
||||
"in2": "displacementMapWithBg",
|
||||
"scale": "2.4000000953674316",
|
||||
"xChannelSelector": "R",
|
||||
"yChannelSelector": "G",
|
||||
"width": "100%",
|
||||
"height": "100%",
|
||||
"result": "displacedImageOpaque"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "displacedImage",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",
|
||||
"result": "displacedImageRed"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacedImageRed",
|
||||
"operator": "atop",
|
||||
"result": "transparencyRedMap"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "transparencyRedMap",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0",
|
||||
"result": "transparencyAlphaMap"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacedImageOpaque",
|
||||
"in2": "imageOpaque",
|
||||
"operator": "over"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "transparencyAlphaMap",
|
||||
"operator": "in",
|
||||
"result": "effect2_texture_9100_35711"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "linearGradient",
|
||||
"attributes": {
|
||||
"id": "paint0_linear_9100_35711",
|
||||
"x1": "10",
|
||||
"y1": "1.5",
|
||||
"x2": "10",
|
||||
"y2": "17.2499",
|
||||
"gradientUnits": "userSpaceOnUse"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "stop",
|
||||
"attributes": {
|
||||
"stop-color": "#296DFF"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "stop",
|
||||
"attributes": {
|
||||
"offset": "1",
|
||||
"stop-color": "#155AEF"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "BucketsBlue"
|
||||
}
|
||||
@ -0,0 +1,20 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './BucketsBlue.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = (
|
||||
{
|
||||
ref,
|
||||
...props
|
||||
}: React.SVGProps<SVGSVGElement> & {
|
||||
ref?: React.RefObject<React.MutableRefObject<HTMLOrSVGElement>>;
|
||||
},
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />
|
||||
|
||||
Icon.displayName = 'BucketsBlue'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,591 @@
|
||||
{
|
||||
"icon": {
|
||||
"type": "element",
|
||||
"isRootNode": true,
|
||||
"name": "svg",
|
||||
"attributes": {
|
||||
"width": "18",
|
||||
"height": "19",
|
||||
"viewBox": "0 0 18 19",
|
||||
"fill": "none",
|
||||
"xmlns": "http://www.w3.org/2000/svg"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "g",
|
||||
"attributes": {
|
||||
"filter": "url(#filter0_dg_9155_106569)"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M2.71865 4.37937C2.68524 4.25999 2.66663 4.13355 2.66663 4.00016C2.66663 3.4484 2.98515 3.01549 3.35148 2.7098C3.72157 2.40099 4.21723 2.15279 4.77114 1.95729C5.88498 1.56417 7.38013 1.3335 8.99996 1.3335C10.6198 1.3335 12.115 1.56417 13.2288 1.95729C13.7827 2.15279 14.2784 2.40099 14.6484 2.7098C15.0148 3.01549 15.3333 3.4484 15.3333 4.00016C15.3333 4.1336 15.3146 4.26009 15.2812 4.37951L13.9096 12.9861C13.8459 13.447 13.5885 13.8203 13.2754 14.1042C12.9608 14.3892 12.558 14.6152 12.122 14.7906C11.2488 15.1417 10.1334 15.3334 8.99996 15.3334C7.86896 15.3334 6.76119 15.1485 5.8906 14.8C5.07268 14.4727 4.23491 13.9023 4.09151 12.9934L4.09139 12.9926L2.71865 4.37937ZM13.7942 4.26678C13.5908 4.43652 13.2566 4.61928 12.785 4.78572C11.8479 5.11646 10.5098 5.3335 8.99996 5.3335C7.49016 5.3335 6.15199 5.11646 5.21489 4.78572C4.74334 4.61928 4.40913 4.43652 4.20573 4.26678C3.98111 4.07936 3.97209 3.92848 4.20573 3.73353C4.40913 3.56379 4.74334 3.38103 5.21489 3.2146C6.15199 2.88386 7.49016 2.66682 8.99996 2.66682C10.5098 2.66682 11.8479 2.88386 12.785 3.2146C13.2566 3.38103 13.5908 3.56379 13.7942 3.73353C14.0253 3.92637 14.0303 4.06978 13.7942 4.26678Z",
|
||||
"fill": "url(#paint0_linear_9155_106569)"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"d": "M8.99963 1.5835C10.5986 1.5835 12.0645 1.81154 13.1451 2.19287C13.6835 2.38289 14.1491 2.61917 14.4879 2.90186C14.825 3.18316 15.0836 3.55264 15.0836 4.00049C15.0836 4.11011 15.0681 4.21383 15.0406 4.31201L15.0367 4.32568L15.0348 4.34033L13.6627 12.9468L13.6617 12.9517C13.6085 13.3371 13.3916 13.6605 13.1071 13.9185C12.8211 14.1776 12.4474 14.3908 12.0289 14.5591C11.1912 14.8959 10.1081 15.0835 8.99963 15.0835C7.89281 15.0835 6.81755 14.9019 5.98303 14.5679C5.18068 14.2467 4.4599 13.7234 4.3385 12.9546V12.9526L2.96545 4.34033L2.9635 4.32568L2.95959 4.31201L2.92737 4.16064C2.92011 4.10875 2.91664 4.05535 2.91663 4.00049C2.91663 3.55274 3.17436 3.18313 3.51135 2.90186C3.85017 2.61914 4.31573 2.38291 4.85413 2.19287C5.93475 1.81147 7.40056 1.58353 8.99963 1.5835ZM8.99963 2.4165C7.46933 2.41654 6.10163 2.63659 5.13147 2.979C4.64464 3.15085 4.28017 3.34571 4.04553 3.5415C3.91579 3.64976 3.78112 3.80197 3.78381 4.00635C3.7865 4.20806 3.92243 4.35576 4.04553 4.4585C4.28015 4.65428 4.64467 4.84915 5.13147 5.021C6.10163 5.36341 7.46933 5.58346 8.99963 5.5835C10.5299 5.5835 11.8975 5.36338 12.8678 5.021C13.3547 4.84912 13.72 4.65433 13.9547 4.4585C14.0815 4.35269 14.2209 4.20184 14.2194 3.99658C14.2178 3.79281 14.0778 3.64424 13.9547 3.5415C13.72 3.34567 13.3547 3.15088 12.8678 2.979C11.8975 2.63664 10.5299 2.4165 8.99963 2.4165Z",
|
||||
"stroke": "white",
|
||||
"stroke-opacity": "0.01",
|
||||
"stroke-width": "0.5"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"opacity": "0.8",
|
||||
"d": "M8.99999 8.3335C8.36485 8.3335 7.81909 8.71403 7.57737 9.25902C6.99119 9.39939 6.55554 9.92652 6.55554 10.5557C6.55554 11.2921 7.1525 11.8891 7.88888 11.8891H10.3333C10.947 11.8891 11.4444 11.3916 11.4444 10.7779C11.4444 10.2358 11.0561 9.78432 10.5425 9.68647C10.4432 8.92308 9.79045 8.3335 8.99999 8.3335Z",
|
||||
"fill": "white"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "path",
|
||||
"attributes": {
|
||||
"fill-rule": "evenodd",
|
||||
"clip-rule": "evenodd",
|
||||
"d": "M2.71865 4.37908C2.68524 4.2597 2.66663 4.13326 2.66663 3.99986C2.66663 3.88343 2.68081 3.7723 2.70663 3.66653C2.71039 3.68194 2.7144 3.69723 2.71865 3.71241L4.09151 12.3264C4.23491 13.2353 5.07268 13.8057 5.8906 14.1331C6.76119 14.4815 7.86896 14.6665 8.99996 14.6665C10.1334 14.6665 11.2488 14.4747 12.122 14.1236C12.558 13.9483 12.9608 13.7223 13.2754 13.4372C13.5885 13.1533 13.8459 12.78 13.9096 12.3191L15.2812 3.71255C15.2855 3.69732 15.2895 3.68197 15.2933 3.6665C15.3191 3.77228 15.3333 3.88343 15.3333 3.99986C15.3333 4.1333 15.3146 4.2598 15.2812 4.37922L13.9096 12.9858C13.8459 13.4467 13.5885 13.82 13.2754 14.1039C12.9608 14.3889 12.558 14.6149 12.122 14.7903C11.2488 15.1414 10.1334 15.3331 8.99996 15.3331C7.86896 15.3331 6.76119 15.1482 5.8906 14.7997C5.07268 14.4724 4.23491 13.902 4.09151 12.9931L2.71865 4.37908Z",
|
||||
"fill": "#101828",
|
||||
"fill-opacity": "0.14"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "defs",
|
||||
"attributes": {},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "filter",
|
||||
"attributes": {
|
||||
"id": "filter0_dg_9155_106569",
|
||||
"x": "0.666626",
|
||||
"y": "0.133496",
|
||||
"width": "16.6666",
|
||||
"height": "18.2",
|
||||
"filterUnits": "userSpaceOnUse",
|
||||
"color-interpolation-filters": "sRGB"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFlood",
|
||||
"attributes": {
|
||||
"flood-opacity": "0",
|
||||
"result": "BackgroundImageFix"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "SourceAlpha",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",
|
||||
"result": "hardAlpha"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feOffset",
|
||||
"attributes": {
|
||||
"dy": "1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feGaussianBlur",
|
||||
"attributes": {
|
||||
"stdDeviation": "1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "hardAlpha",
|
||||
"operator": "out"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0.0352941 0 0 0 0 0.0352941 0 0 0 0 0.0431373 0 0 0 0.05 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feBlend",
|
||||
"attributes": {
|
||||
"mode": "normal",
|
||||
"in2": "BackgroundImageFix",
|
||||
"result": "effect1_dropShadow_9155_106569"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feBlend",
|
||||
"attributes": {
|
||||
"mode": "normal",
|
||||
"in": "BackgroundImageFix",
|
||||
"in2": "effect1_dropShadow_9155_106569",
|
||||
"result": "BackgroundImageFix"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feBlend",
|
||||
"attributes": {
|
||||
"mode": "normal",
|
||||
"in": "SourceGraphic",
|
||||
"in2": "BackgroundImageFix",
|
||||
"result": "shape"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feTurbulence",
|
||||
"attributes": {
|
||||
"type": "fractalNoise",
|
||||
"baseFrequency": "9.0909090042114258 9.0909090042114258",
|
||||
"numOctaves": "3",
|
||||
"seed": "5297",
|
||||
"result": "displacementX"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feTurbulence",
|
||||
"attributes": {
|
||||
"type": "fractalNoise",
|
||||
"baseFrequency": "9.0909090042114258 9.0909090042114258",
|
||||
"numOctaves": "3",
|
||||
"seed": "5298",
|
||||
"result": "displacementY"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "displacementX",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1",
|
||||
"result": "displacementXRed"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "displacementY",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementXRed",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feDisplacementMap",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"scale": "2.4000000953674316",
|
||||
"xChannelSelector": "R",
|
||||
"yChannelSelector": "G",
|
||||
"width": "100%",
|
||||
"height": "100%"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComponentTransfer",
|
||||
"attributes": {
|
||||
"result": "sourceDisplacedAlpha"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFuncA",
|
||||
"attributes": {
|
||||
"type": "gamma",
|
||||
"exponent": "0.2"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComponentTransfer",
|
||||
"attributes": {
|
||||
"result": "inputSourceAlpha"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFuncA",
|
||||
"attributes": {
|
||||
"type": "gamma",
|
||||
"exponent": "0.2"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "sourceDisplacedAlpha",
|
||||
"operator": "arithmetic",
|
||||
"k1": "1",
|
||||
"k2": "0",
|
||||
"k3": "0",
|
||||
"k4": "0",
|
||||
"result": "displacementAlphasMultiplied"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementAlphasMultiplied",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "0",
|
||||
"k3": "-0.5",
|
||||
"k4": "0.5",
|
||||
"result": "centeringAdjustment"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementX",
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "arithmetic",
|
||||
"k1": "1",
|
||||
"k2": "0",
|
||||
"k3": "0",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "centeringAdjustment",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1",
|
||||
"result": "displacementXFinal"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementY",
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "arithmetic",
|
||||
"k1": "1",
|
||||
"k2": "0",
|
||||
"k3": "0",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "centeringAdjustment",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 1",
|
||||
"result": "displacementYFinal"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacementXFinal",
|
||||
"in2": "displacementYFinal",
|
||||
"operator": "arithmetic",
|
||||
"k1": "0",
|
||||
"k2": "1",
|
||||
"k3": "1",
|
||||
"k4": "0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "in",
|
||||
"result": "displacementMap"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feFlood",
|
||||
"attributes": {
|
||||
"flood-color": "rgb(127, 127, 127)",
|
||||
"flood-opacity": "1"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "displacementAlphasMultiplied",
|
||||
"operator": "out"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "displacementMap",
|
||||
"operator": "over",
|
||||
"result": "displacementMapWithBg"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feDisplacementMap",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"scale": "2.4000000953674316",
|
||||
"xChannelSelector": "R",
|
||||
"yChannelSelector": "G",
|
||||
"width": "100%",
|
||||
"height": "100%",
|
||||
"result": "displacedImage"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"type": "matrix",
|
||||
"values": "1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 127 0",
|
||||
"result": "imageOpaque"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feDisplacementMap",
|
||||
"attributes": {
|
||||
"in": "imageOpaque",
|
||||
"in2": "displacementMapWithBg",
|
||||
"scale": "2.4000000953674316",
|
||||
"xChannelSelector": "R",
|
||||
"yChannelSelector": "G",
|
||||
"width": "100%",
|
||||
"height": "100%",
|
||||
"result": "displacedImageOpaque"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "displacedImage",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",
|
||||
"result": "displacedImageRed"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "shape",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacedImageRed",
|
||||
"operator": "atop",
|
||||
"result": "transparencyRedMap"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feColorMatrix",
|
||||
"attributes": {
|
||||
"in": "transparencyRedMap",
|
||||
"type": "matrix",
|
||||
"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0",
|
||||
"result": "transparencyAlphaMap"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in": "displacedImageOpaque",
|
||||
"in2": "imageOpaque",
|
||||
"operator": "over"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "feComposite",
|
||||
"attributes": {
|
||||
"in2": "transparencyAlphaMap",
|
||||
"operator": "in",
|
||||
"result": "effect2_texture_9155_106569"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "linearGradient",
|
||||
"attributes": {
|
||||
"id": "paint0_linear_9155_106569",
|
||||
"x1": "8.99996",
|
||||
"y1": "1.3335",
|
||||
"x2": "8.99996",
|
||||
"y2": "15.3334",
|
||||
"gradientUnits": "userSpaceOnUse"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"type": "element",
|
||||
"name": "stop",
|
||||
"attributes": {
|
||||
"stop-color": "#98A2B2"
|
||||
},
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"type": "element",
|
||||
"name": "stop",
|
||||
"attributes": {
|
||||
"offset": "1",
|
||||
"stop-color": "#676F83"
|
||||
},
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "BucketsGray"
|
||||
}
|
||||
@ -0,0 +1,20 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './BucketsGray.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = (
|
||||
{
|
||||
ref,
|
||||
...props
|
||||
}: React.SVGProps<SVGSVGElement> & {
|
||||
ref?: React.RefObject<React.MutableRefObject<HTMLOrSVGElement>>;
|
||||
},
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />
|
||||
|
||||
Icon.displayName = 'BucketsGray'
|
||||
|
||||
export default Icon
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,20 @@
|
||||
// GENERATE BY script
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
import * as React from 'react'
|
||||
import data from './Folder.json'
|
||||
import IconBase from '@/app/components/base/icons/IconBase'
|
||||
import type { IconData } from '@/app/components/base/icons/IconBase'
|
||||
|
||||
const Icon = (
|
||||
{
|
||||
ref,
|
||||
...props
|
||||
}: React.SVGProps<SVGSVGElement> & {
|
||||
ref?: React.RefObject<React.MutableRefObject<HTMLOrSVGElement>>;
|
||||
},
|
||||
) => <IconBase {...props} ref={ref} data={data as IconData} />
|
||||
|
||||
Icon.displayName = 'Folder'
|
||||
|
||||
export default Icon
|
||||
@ -0,0 +1,3 @@
|
||||
export { default as BucketsBlue } from './BucketsBlue'
|
||||
export { default as BucketsGray } from './BucketsGray'
|
||||
export { default as Folder } from './Folder'
|
||||
@ -0,0 +1,35 @@
|
||||
import React from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
type BreadcrumbsProps = {
|
||||
prefix: string[]
|
||||
keywords: string
|
||||
resetKeywords: () => void
|
||||
searchResultsLength: number
|
||||
}
|
||||
|
||||
const Breadcrumbs = ({
|
||||
prefix,
|
||||
keywords,
|
||||
resetKeywords,
|
||||
searchResultsLength,
|
||||
}: BreadcrumbsProps) => {
|
||||
const { t } = useTranslation()
|
||||
const isRoot = prefix.length === 0
|
||||
const isSearching = !!keywords
|
||||
|
||||
return (
|
||||
<div className='flex grow items-center py-1'>
|
||||
{isRoot && (
|
||||
<div className='system-sm-medium text-test-secondary px-[5px] py-1'>
|
||||
{t('datasetPipeline.onlineDrive.breadcrumbs.allBuckets')}
|
||||
</div>
|
||||
)}
|
||||
{!isRoot && (
|
||||
<div></div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default React.memo(Breadcrumbs)
|
||||
@ -0,0 +1,64 @@
|
||||
import React, { useState } from 'react'
|
||||
import Breadcrumbs from './breadcrumbs'
|
||||
import Input from '@/app/components/base/input'
|
||||
import { useDebounceFn } from 'ahooks'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
type HeaderProps = {
|
||||
prefix: string[]
|
||||
keywords: string
|
||||
resetKeywords: () => void
|
||||
updateKeywords: (keywords: string) => void
|
||||
searchResultsLength: number
|
||||
}
|
||||
|
||||
const Header = ({
|
||||
prefix,
|
||||
keywords,
|
||||
resetKeywords,
|
||||
updateKeywords,
|
||||
searchResultsLength,
|
||||
}: HeaderProps) => {
|
||||
const { t } = useTranslation()
|
||||
const [inputValue, setInputValue] = useState(keywords)
|
||||
|
||||
const { run: updateKeywordsWithDebounce } = useDebounceFn(
|
||||
(keywords: string) => {
|
||||
updateKeywords(keywords)
|
||||
},
|
||||
{ wait: 500 },
|
||||
)
|
||||
|
||||
const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
const keywords = e.target.value
|
||||
setInputValue(keywords)
|
||||
updateKeywordsWithDebounce(keywords)
|
||||
}
|
||||
|
||||
const handleResetKeywords = () => {
|
||||
setInputValue('')
|
||||
resetKeywords()
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='flex items-center gap-x-2 bg-components-panel-bg p-1 pl-3'>
|
||||
<Breadcrumbs
|
||||
prefix={prefix}
|
||||
keywords={keywords}
|
||||
resetKeywords={resetKeywords}
|
||||
searchResultsLength={searchResultsLength}
|
||||
/>
|
||||
<Input
|
||||
value={inputValue}
|
||||
onChange={handleInputChange}
|
||||
onClear={handleResetKeywords}
|
||||
placeholder={t('datasetPipeline.onlineDrive.breadcrumbs.searchPlaceholder')}
|
||||
showLeftIcon
|
||||
showClearIcon
|
||||
wrapperClassName='w-[200px] h-8 shrink-0'
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default React.memo(Header)
|
||||
@ -0,0 +1,41 @@
|
||||
import type { OnlineDriveFile } from '@/models/pipeline'
|
||||
import Header from './header'
|
||||
import List from './list'
|
||||
|
||||
type FileListProps = {
|
||||
fileList: OnlineDriveFile[]
|
||||
selectedFileList: string[]
|
||||
prefix: string[]
|
||||
keywords: string
|
||||
resetKeywords: () => void
|
||||
updateKeywords: (keywords: string) => void
|
||||
searchResultsLength: number
|
||||
}
|
||||
|
||||
const FileList = ({
|
||||
fileList,
|
||||
selectedFileList,
|
||||
prefix,
|
||||
keywords,
|
||||
resetKeywords,
|
||||
updateKeywords,
|
||||
searchResultsLength,
|
||||
}: FileListProps) => {
|
||||
return (
|
||||
<div className='flex h-[400px] flex-col overflow-hidden rounded-xl border border-components-panel-border bg-components-panel-bg shadow-xs shadow-shadow-shadow-3'>
|
||||
<Header
|
||||
prefix={prefix}
|
||||
keywords={keywords}
|
||||
resetKeywords={resetKeywords}
|
||||
updateKeywords={updateKeywords}
|
||||
searchResultsLength={searchResultsLength}
|
||||
/>
|
||||
<List
|
||||
fileList={fileList}
|
||||
selectedFileList={selectedFileList}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default FileList
|
||||
@ -0,0 +1,42 @@
|
||||
import React from 'react'
|
||||
import { OnlineDriveFileType } from '@/models/pipeline'
|
||||
import { BucketsBlue, Folder } from '@/app/components/base/icons/src/public/knowledge/online-drive'
|
||||
import FileTypeIcon from '@/app/components/base/file-uploader/file-type-icon'
|
||||
import { getFileType } from './utils'
|
||||
import cn from '@/utils/classnames'
|
||||
|
||||
type FileIconProps = {
|
||||
type: OnlineDriveFileType
|
||||
fileName: string
|
||||
size?: 'sm' | 'md' | 'lg' | 'xl'
|
||||
className?: string
|
||||
}
|
||||
|
||||
const FileIcon = ({
|
||||
type,
|
||||
fileName,
|
||||
size = 'md',
|
||||
className,
|
||||
}: FileIconProps) => {
|
||||
if (type === OnlineDriveFileType.bucket) {
|
||||
return (
|
||||
<BucketsBlue className={cn('size-[18px]', className)} />
|
||||
)
|
||||
}
|
||||
|
||||
if (type === OnlineDriveFileType.folder) {
|
||||
return (
|
||||
<Folder className={cn('size-[18px]', className)} />
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<FileTypeIcon
|
||||
size={size}
|
||||
type={getFileType(fileName)}
|
||||
className={cn('size-[18px]', className)}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export default React.memo(FileIcon)
|
||||
@ -0,0 +1,35 @@
|
||||
import type { OnlineDriveFile } from '@/models/pipeline'
|
||||
import Item from './item'
|
||||
|
||||
type FileListProps = {
|
||||
fileList: OnlineDriveFile[]
|
||||
selectedFileList: string[]
|
||||
}
|
||||
|
||||
const List = ({
|
||||
fileList,
|
||||
selectedFileList,
|
||||
}: FileListProps) => {
|
||||
return (
|
||||
<div className='grow overflow-y-auto p-1 pt-0'>
|
||||
<div className='flex flex-col gap-y-px px-1 py-1.5'>
|
||||
{
|
||||
fileList.map((file) => {
|
||||
const isSelected = selectedFileList.includes(file.key)
|
||||
return (
|
||||
<Item
|
||||
key={file.key}
|
||||
file={file}
|
||||
isSelected={isSelected}
|
||||
onSelect={(file) => { console.log(file) }}
|
||||
onOpen={(file) => { console.log(file) }}
|
||||
/>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default List
|
||||
@ -0,0 +1,78 @@
|
||||
import Checkbox from '@/app/components/base/checkbox'
|
||||
import Radio from '@/app/components/base/radio/ui'
|
||||
import type { OnlineDriveFile } from '@/models/pipeline'
|
||||
import React, { useCallback } from 'react'
|
||||
import FileIcon from './file-icon'
|
||||
import { formatFileSize } from '@/utils/format'
|
||||
import Tooltip from '@/app/components/base/tooltip'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import cn from '@/utils/classnames'
|
||||
|
||||
type ItemProps = {
|
||||
file: OnlineDriveFile
|
||||
isSelected: boolean
|
||||
disabled?: boolean
|
||||
isMultipleChoice?: boolean
|
||||
onSelect: (file: OnlineDriveFile) => void
|
||||
onOpen: (file: OnlineDriveFile) => void
|
||||
}
|
||||
|
||||
const Item = ({
|
||||
file,
|
||||
isSelected,
|
||||
disabled = false,
|
||||
isMultipleChoice = true,
|
||||
onSelect,
|
||||
onOpen,
|
||||
}: ItemProps) => {
|
||||
const { t } = useTranslation()
|
||||
const isBucket = file.type === 'bucket'
|
||||
const isFolder = file.type === 'folder'
|
||||
|
||||
const Wrapper = disabled ? Tooltip : React.Fragment
|
||||
|
||||
const handleSelect = useCallback(() => {
|
||||
onSelect(file)
|
||||
}, [file, onSelect])
|
||||
|
||||
const handleClickItem = useCallback((e: React.MouseEvent<HTMLDivElement>) => {
|
||||
e.stopPropagation()
|
||||
if (disabled) return
|
||||
if (isBucket || isFolder)
|
||||
onOpen(file)
|
||||
onSelect(file)
|
||||
}, [disabled, file, isBucket, isFolder, onOpen, onSelect])
|
||||
|
||||
return (
|
||||
<div
|
||||
className='flex cursor-pointer items-center gap-2 rounded-md px-2 py-[3px] hover:bg-state-base-hover'
|
||||
onClick={handleClickItem}
|
||||
>
|
||||
{!isBucket && isMultipleChoice && (
|
||||
<Checkbox className='shrink-0' id={file.key} checked={isSelected} onCheck={handleSelect} />
|
||||
)}
|
||||
{!isBucket && !isMultipleChoice && (
|
||||
<Radio className='shrink-0' isChecked={isSelected} onCheck={handleSelect} />
|
||||
)}
|
||||
<Wrapper
|
||||
popupContent={t('datasetPipeline.onlineDrive.notSupportedFileType')}
|
||||
position='top-end'
|
||||
offset={{ mainAxis: 4, crossAxis: 104 }}
|
||||
>
|
||||
<div
|
||||
className={cn(
|
||||
'flex grow items-center gap-x-1 py-0.5',
|
||||
disabled && 'opacity-30',
|
||||
)}>
|
||||
<FileIcon type={file.type} fileName={file.key} className='shrink-0' />
|
||||
<span className='system-sm-medium grow text-text-secondary'>{file.key}</span>
|
||||
{!isFolder && file.size && (
|
||||
<span className='system-xs-regular shrink-0 text-text-tertiary'>{formatFileSize(file.size)}</span>
|
||||
)}
|
||||
</div>
|
||||
</Wrapper>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default React.memo(Item)
|
||||
@ -0,0 +1,51 @@
|
||||
import { FileAppearanceTypeEnum } from '@/app/components/base/file-uploader/types'
|
||||
import { FILE_EXTS } from '@/app/components/base/prompt-editor/constants'
|
||||
|
||||
export const getFileExtension = (fileName: string): string => {
|
||||
if (!fileName)
|
||||
return ''
|
||||
const parts = fileName.split('.')
|
||||
if (parts.length <= 1 || (parts[0] === '' && parts.length === 2))
|
||||
return ''
|
||||
|
||||
return parts[parts.length - 1].toLowerCase()
|
||||
}
|
||||
|
||||
export const getFileType = (fileName: string) => {
|
||||
const extension = getFileExtension(fileName)
|
||||
|
||||
if (extension === 'gif')
|
||||
return FileAppearanceTypeEnum.gif
|
||||
|
||||
if (FILE_EXTS.image.includes(extension.toUpperCase()))
|
||||
return FileAppearanceTypeEnum.image
|
||||
|
||||
if (FILE_EXTS.video.includes(extension.toUpperCase()))
|
||||
return FileAppearanceTypeEnum.video
|
||||
|
||||
if (FILE_EXTS.audio.includes(extension.toUpperCase()))
|
||||
return FileAppearanceTypeEnum.audio
|
||||
|
||||
if (extension === 'html' || extension === 'htm' || extension === 'xml' || extension === 'json')
|
||||
return FileAppearanceTypeEnum.code
|
||||
|
||||
if (extension === 'pdf')
|
||||
return FileAppearanceTypeEnum.pdf
|
||||
|
||||
if (extension === 'md' || extension === 'markdown' || extension === 'mdx')
|
||||
return FileAppearanceTypeEnum.markdown
|
||||
|
||||
if (extension === 'xlsx' || extension === 'xls' || extension === 'csv')
|
||||
return FileAppearanceTypeEnum.excel
|
||||
|
||||
if (extension === 'docx' || extension === 'doc')
|
||||
return FileAppearanceTypeEnum.word
|
||||
|
||||
if (extension === 'pptx' || extension === 'ppt')
|
||||
return FileAppearanceTypeEnum.ppt
|
||||
|
||||
if (FILE_EXTS.document.includes(extension.toUpperCase()))
|
||||
return FileAppearanceTypeEnum.document
|
||||
|
||||
return FileAppearanceTypeEnum.custom
|
||||
}
|
||||
Loading…
Reference in New Issue