Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 832 833 834 835 836 837 838 839 840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927 928 929 930 931 932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947 948 949 950 951 952 953 954 955 956 957 958 959 960 961 962 963 964 965 966 967 968 969 970 971 972 973 974 975 976 977 978 979 980 981 982 983 984 985 986 987 988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004 1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 1015 1016 1017 1018 1019 1020 1021 1022 1023 1024 1025 1026 1027 1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 1048 1049 1050 1051 1052 1053 1054 1055 1056 1057 1058 1059 1060 1061 1062 1063 1064 1065 1066 1067 1068 1069 1070 1071 1072 1073 1074 1075 1076 1077 1078 1079 1080 1081 1082 1083 1084 1085 1086 1087 1088 1089 1090 1091 1092 1093 1094 1095 1096 1097 1098 1099 1100 1101 1102 1103 1104 1105 1106 1107 1108 1109 1110 1111 1112 1113 1114 1115 1116 1117 1118 1119 1120 1121 1122 1123 1124 1125 1126 1127 1128 1129 1130 1131 1132 1133 1134 1135 1136 1137 1138 1139 1140 1141 1142 1143 1144 1145 1146 1147 1148 1149 1150 1151 1152 1153 1154 1155 1156 1157 1158 1159 1160 1161 1162 1163 1164 1165 1166 1167 1168 1169 1170 1171 1172 1173 1174 1175 1176 1177 1178 1179 1180 1181 1182 1183 1184 1185 1186 1187 1188 1189 1190 1191 1192 1193 1194 1195 1196 1197 1198 1199 1200 1201 1202 1203 1204 1205 1206 1207 1208 1209 1210 1211 1212 1213 1214 1215 1216 1217 1218 1219 1220 1221 1222 1223 1224 1225 1226 1227 1228 1229 1230 1231 1232 1233 1234 1235 1236 1237 1238 1239 1240 1241 1242 1243 1244 1245 1246 1247 1248 1249 1250 1251 1252 1253 1254 1255 1256 1257 1258 1259 1260 1261 1262 1263 1264 | 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 15x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 6x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x | import React, { CSSProperties } from "react";
import styled from "styled-components";
import { rotateReverse } from "ui/animations/animations";
const RotatingSVG = styled.svg`
animation: ${rotateReverse} 2s linear infinite;
`;
export const LoadingIcon = () => (
<RotatingSVG width="24" height="24" viewBox="0 0 24 24">
<path d="M23 12c0 1.042-.154 2.045-.425 3h-2.101c.335-.94.526-1.947.526-3 0-4.962-4.037-9-9-9-1.706 0-3.296.484-4.655 1.314l1.858 2.686h-6.994l2.152-7 1.849 2.673c1.684-1.049 3.659-1.673 5.79-1.673 6.074 0 11 4.925 11 11zm-6.354 7.692c-1.357.826-2.944 1.308-4.646 1.308-4.962 0-9-4.038-9-9 0-1.053.191-2.06.525-3h-2.1c-.271.955-.425 1.958-.425 3 0 6.075 4.925 11 11 11 2.127 0 4.099-.621 5.78-1.667l1.853 2.667 2.152-6.989h-6.994l1.855 2.681z" />
</RotatingSVG>
);
export const UpdateIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M0 12C0 18.627 5.373 24 12 24C18.627 24 24 18.627 24 12C24 5.373 18.627 0 12 0C5.373 0 0 5.373 0 12ZM19 11H14V19.5H10V11H5L12 4L19 11Z" />
</svg>
);
export const FolderIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21.604 13l-1.272 7h-16.663l-1.272-7h19.207zm-14.604-11h-6v7h2v-5h3.084c1.38 1.612 2.577 3 4.916 3h10v2h2v-4h-12c-1.629 0-2.305-1.058-4-3zm17 9h-24l2 11h20l2-11z" />
</svg>
);
export const Grid2x2Icon = ({
className,
style,
}: {
className?: string;
style?: CSSProperties;
}) => (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
className={className}
style={style}
>
<path d="M11 11h-11v-11h11v11zm13 0h-11v-11h11v11zm-13 13h-11v-11h11v11zm13 0h-11v-11h11v11z" />
</svg>
);
export const FullscreenIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21.414 18.586l2.586-2.586v8h-8l2.586-2.586-5.172-5.172 2.828-2.828 5.172 5.172zm-13.656-8l2.828-2.828-5.172-5.172 2.586-2.586h-8v8l2.586-2.586 5.172 5.172zm10.828-8l-2.586-2.586h8v8l-2.586-2.586-5.172 5.172-2.828-2.828 5.172-5.172zm-8 13.656l-2.828-2.828-5.172 5.172-2.586-2.586v8h8l-2.586-2.586 5.172-5.172z" />
</svg>
);
export const FullscreenCloseIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M16.586 19.414l-2.586 2.586v-8h8l-2.586 2.586 4.586 4.586-2.828 2.828-4.586-4.586zm-13.758-19.414l-2.828 2.828 4.586 4.586-2.586 2.586h8v-8l-2.586 2.586-4.586-4.586zm16.586 7.414l2.586 2.586h-8v-8l2.586 2.586 4.586-4.586 2.828 2.828-4.586 4.586zm-19.414 13.758l2.828 2.828 4.586-4.586 2.586 2.586v-8h-8l2.586 2.586-4.586 4.586z" />
</svg>
);
export const FolderFilledIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M11 5c-1.629 0-2.305-1.058-4-3h-7v20h24v-17h-13z" />
</svg>
);
export const DotsIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M6 12c0 1.657-1.343 3-3 3s-3-1.343-3-3 1.343-3 3-3 3 1.343 3 3zm9 0c0 1.657-1.343 3-3 3s-3-1.343-3-3 1.343-3 3-3 3 1.343 3 3zm9 0c0 1.657-1.343 3-3 3s-3-1.343-3-3 1.343-3 3-3 3 1.343 3 3z" />
</svg>
);
export const CommentIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21 0H24L14.5 24H11.5L21 0Z" />
<path d="M9.5 4.63426e-06H12.5L3 24H0L9.5 4.63426e-06Z" />
</svg>
);
export const DownloadIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path
d="M14.0556641,11 L19,11 L12,19 L5,11 L10.0871094,11 L10.0871094,0 L14.0556641,0 L14.0556641,11 Z M18.213,1.754 L17,3.353 C19.984,5.085 22,8.308 22,12 C22,17.514 17.514,22 12,22 C6.486,22 2,17.514 2,12 C2,8.308 4.016,5.085 7,3.353 L5.787,1.754 C2.322,3.857 0,7.651 0,12 C0,18.627 5.373,24 12,24 C18.627,24 24,18.627 24,12 C24,7.651 21.678,3.857 18.213,1.754 Z"
id="Shape"
/>
</svg>
);
export const FontIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M22 0h-20v6h1.999c0-1.174.397-3 2.001-3h4v16.874c0 1.174-.825 2.126-2 2.126h-1v2h9.999v-2h-.999c-1.174 0-2-.952-2-2.126v-16.874h4c1.649 0 2.02 1.826 2.02 3h1.98v-6z" />
</svg>
);
export const AngleIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path
d="m2.019 11.993c0 5.518 4.48 9.998 9.998 9.998 5.517 0 9.997-4.48 9.997-9.998s-4.48-9.998-9.997-9.998c-5.518 0-9.998 4.48-9.998 9.998zm1.5 0c0-4.69 3.808-8.498 8.498-8.498s8.497 3.808 8.497 8.498-3.807 8.498-8.497 8.498-8.498-3.808-8.498-8.498zm4.715-1.528s1.505-1.502 3.259-3.255c.147-.146.338-.219.53-.219s.384.073.53.219c1.754 1.753 3.259 3.254 3.259 3.254.145.145.217.336.216.527 0 .191-.074.383-.22.53-.293.293-.766.294-1.057.004l-1.978-1.978v6.694c0 .413-.336.75-.75.75s-.75-.337-.75-.75v-6.694l-1.978 1.979c-.29.289-.762.286-1.055-.007-.147-.146-.22-.338-.221-.53-.001-.19.071-.38.215-.524z"
fillRule="nonzero"
/>
</svg>
);
export const TileValueIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M3 7C3 4.79086 4.79086 3 7 3H17C19.2091 3 21 4.79086 21 7V17C21 19.2091 19.2091 21 17 21H7C4.79086 21 3 19.2091 3 17V7ZM12.5 15.5V8.5H19.5V9.5H14.5V11.5H17.5V12.5H14.5V15.5H12.5ZM5.5 14.5V15.5H11.5V14.5H9.5V8.5H5.5V9.5H7.5V14.5H5.5Z"
/>
</svg>
);
export const SquareRootIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M15.1578 4.50061C15.1319 4.55808 15.1039 4.63943 15.0847 4.7466L13.6438 21.1314C13.5869 21.7788 13.1195 22.316 12.4861 22.4618C11.8528 22.6076 11.1976 22.3289 10.8633 21.7716L6.65309 14.7524L6.12599 15.3512C5.57865 15.9731 4.63083 16.0335 4.00896 15.4862C3.3871 14.9388 3.32668 13.991 3.87402 13.3692L5.75748 11.2292C6.07378 10.8699 6.54261 10.6831 7.01938 10.7264C7.49615 10.7698 7.92357 11.0382 8.16982 11.4487L11.06 16.2673L12.101 4.42916C12.1038 4.39833 12.1074 4.36759 12.112 4.33699C12.2129 3.66813 12.4758 2.98661 12.9395 2.44618C13.4055 1.90317 14.1073 1.48123 14.955 1.50061H20C20.8284 1.50061 21.5 2.17218 21.5 3.00061C21.5 3.82904 20.8284 4.50061 20 4.50061H15.1578Z"
/>
</svg>
);
export const StackIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21.698 10.658l2.302 1.342-12.002 7-11.998-7 2.301-1.342 9.697 5.658 9.7-5.658zm-9.7 10.657l-9.697-5.658-2.301 1.343 11.998 7 12.002-7-2.302-1.342-9.7 5.657zm12.002-14.315l-12.002-7-11.998 7 11.998 7 12.002-7z" />
</svg>
);
export const AutoColorIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M15.07 12.528l-1.68-1.4c.497-2.361.502-3.016 2.035-4.448 1.938-1.811 7.512-6.525 7.512-6.525.129-.108.271-.155.409-.155.342 0 .654.294.654.647 0 .104-.027.214-.088.322 0 0-3.418 6.509-4.846 8.748-1.127 1.771-1.769 1.896-3.996 2.811zm-1.043 1.301l-1.839-1.535c-4.084.043-2.717 4.559-6.696 4.559l-.49-.021c1.048 1.459 2.706 2.168 4.318 2.168 2.551 0 4.988-1.778 4.707-5.171zm3.973-.39v8.561h-16v-12h9.582c.154-.754.296-1.396.517-2h-12.099v16h20v-12.176c-.641.772-1.272 1.24-2 1.615z" />
</svg>
);
export const TrashIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M19 24h-14c-1.104 0-2-.896-2-2v-16h18v16c0 1.104-.896 2-2 2m-9-14c0-.552-.448-1-1-1s-1 .448-1 1v9c0 .552.448 1 1 1s1-.448 1-1v-9zm6 0c0-.552-.448-1-1-1s-1 .448-1 1v9c0 .552.448 1 1 1s1-.448 1-1v-9zm6-5h-20v-2h6v-1.5c0-.827.673-1.5 1.5-1.5h5c.825 0 1.5.671 1.5 1.5v1.5h6v2zm-12-2h4v-1h-4v1z" />
</svg>
);
export const FlipHorizontalIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<g
transform="translate(12.000000, 12.000000) rotate(270.000000) translate(-12.000000, -12.000000) translate(1.000000, 1.000000)"
fillRule="nonzero"
>
<path d="M2.2,2.22222222 L12.87,7.77777778 L2.2,7.77777778 L2.2,2.22222222 M2.2,0 C0.99,0 0,0.888888889 0,2.22222222 L0,10 L22,10 L3.08,0.222222222 C2.75,0.111111111 2.53,0 2.2,0 L2.2,0 Z" />
<path d="M0,12 L0,19.7882151 C0,21.4571184 1.65,22.4584603 3.08,21.790899 L22,12 L0,12 Z" />
</g>
</svg>
);
export const FlipVerticalIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<g transform="translate(1.000000, 1.000000)" fillRule="nonzero">
<path d="M2.2,2.22222222 L12.87,7.77777778 L2.2,7.77777778 L2.2,2.22222222 M2.2,0 C0.99,0 0,0.888888889 0,2.22222222 L0,10 L22,10 L3.08,0.222222222 C2.75,0.111111111 2.53,0 2.2,0 L2.2,0 Z" />
<path d="M0,12 L0,19.7882151 C0,21.4571184 1.65,22.4584603 3.08,21.790899 L22,12 L0,12 Z" />
</g>
</svg>
);
export const SendToFrontIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<g fillRule="evenodd">
<path d="M20,7 C21.1045695,7 22,7.8954305 22,9 L22,20 C22,21.1045695 21.1045695,22 20,22 L9,22 C7.8954305,22 7,21.1045695 7,20 L7,9 C7,7.8954305 7.8954305,7 9,7 L20,7 Z M20,9 L9,9 L9,20 L20,20 L20,9 Z" />
<rect id="Rectangle" x="2" y="2" width="15" height="15" rx="2" />
</g>
</svg>
);
export const SendToBackIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<g fillRule="evenodd">
<path d="M20,7 C21.1045695,7 22,7.8954305 22,9 L22,20 C22,21.1045695 21.1045695,22 20,22 L9,22 C7.8954305,22 7,21.1045695 7,20 L7,15 L15,15 L15,7 L20,7 Z" />
<path d="M15,2 C16.1045695,2 17,2.8954305 17,4 L17,15 C17,16.1045695 16.1045695,17 15,17 L4,17 C2.8954305,17 2,16.1045695 2,15 L2,4 C2,2.8954305 2.8954305,2 4,2 L15,2 Z M15,4 L4,4 L4,15 L15,15 L15,4 Z" />
</g>
</svg>
);
export const OnionSkinIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<g fillRule="evenodd">
<path
d="M14,5 C18.9705627,5 23,9.02943725 23,14 C23,18.9705627 18.9705627,23 14,23 C9.02943725,23 5,18.9705627 5,14 C5,9.02943725 9.02943725,5 14,5 Z M8,1 C10.3799145,1 12.4824309,2.18768282 13.7471757,4.00267509 L14,4 C13.1029574,4 12.2335019,4.11811414 11.4063372,4.33963865 C10.5141711,3.50880379 9.31650429,3 8,3 C5.23857625,3 3,5.23857625 3,8 C3,9.31650429 3.50880379,10.5141711 4.34049558,11.4070846 C4.139084,12.1552012 4.02328838,12.9387284 4.00316272,13.7460077 C2.18768282,12.4824309 1,10.3799145 1,8 C1,4.13400675 4.13400675,1 8,1 Z"
fillRule="nonzero"
/>
</g>
</svg>
);
export const GridIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<g fillRule="evenodd">
<path
d="M24,0 L24,24 L0,24 L0,0 L24,0 Z M5,19 L2,19 L2,22 L5,22 L5,19 Z M17,19 L13,19 L13,22 L17,22 L17,19 Z M11,19 L7,19 L7,22 L11,22 L11,19 Z M22,19 L19,19 L19,22 L22,22 L22,19 Z M5,13 L2,13 L2,17 L5,17 L5,13 Z M11,13 L7,13 L7,17 L11,17 L11,13 Z M17,13 L13,13 L13,17 L17,17 L17,13 Z M22,13 L19,13 L19,17 L22,17 L22,13 Z M5,7 L2,7 L2,11 L5,11 L5,7 Z M17,7 L13,7 L13,11 L17,11 L17,7 Z M11,7 L7,7 L7,11 L11,11 L11,7 Z M22,7 L19,7 L19,11 L22,11 L22,7 Z M5,2 L2,2 L2,5 L5,5 L5,2 Z M11,2 L7,2 L7,5 L11,5 L11,2 Z M17,2 L13,2 L13,5 L17,5 L17,2 Z M22,2 L19,2 L19,5 L22,5 L22,2 Z"
fillRule="nonzero"
/>
</g>
</svg>
);
export const AnimationIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M0 1v22h24v-22h-24zm4 20h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2v-2h2v2zm14 16h-12v-8h12v8zm0-10h-12v-8h12v8zm4 10h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2v-2h2v2zm0-4h-2v-2h2v2z" />
</svg>
);
export const BackgroundIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M5 8.5c0-.828.672-1.5 1.5-1.5s1.5.672 1.5 1.5c0 .829-.672 1.5-1.5 1.5s-1.5-.671-1.5-1.5zm9 .5l-2.519 4-2.481-1.96-4 5.96h14l-5-8zm8-4v14h-20v-14h20zm2-2h-24v18h24v-18z" />
</svg>
);
export const SoundIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M9 18h-7v-12h7v12zm2-12v12l11 6v-24l-11 6z" />{" "}
</svg>
);
export const SongIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M 22.050781 0.0703125 L 7.050781 4.5 C 6.425781 4.695312 6 5.273438 6 5.929688 L 6 18.183594 C 5.507812 18.066406 5.003906 18.003906 4.5 18 C 2.015625 18 0 19.34375 0 21 C 0 22.65625 2.015625 24 4.5 24 C 6.984375 24 9 22.65625 9 21 L 9 10.046875 L 21 6.53125 L 21 15.183594 C 20.507812 15.066406 20.003906 15.003906 19.5 15 C 17.015625 15 15 16.34375 15 18 C 15 19.65625 17.015625 21 19.5 21 C 21.984375 21 24 19.65625 24 18 L 24 1.5 C 24 1.023438 23.773438 0.574219 23.386719 0.292969 C 23 0.0078125 22.503906 -0.0742188 22.050781 0.0703125 Z M 22.050781 0.0703125 " />
</svg>
);
export const DutyIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M 17.699219 17.8125 L 12.300781 17.8125 C 11.636719 17.8125 11.101562 17.28125 11.101562 16.625 L 11.101562 2.96875 L 6.898438 2.96875 L 6.898438 9.203125 C 6.898438 9.859375 6.363281 10.390625 5.699219 10.390625 L 0.300781 10.390625 C 0.132812 10.390625 0 10.257812 0 10.09375 L 0 8.90625 C 0 8.742188 0.132812 8.609375 0.300781 8.609375 L 5.101562 8.609375 L 5.101562 2.375 C 5.101562 1.71875 5.636719 1.1875 6.300781 1.1875 L 11.699219 1.1875 C 12.363281 1.1875 12.898438 1.71875 12.898438 2.375 L 12.898438 16.03125 L 17.101562 16.03125 L 17.101562 9.796875 C 17.101562 9.140625 17.636719 8.609375 18.300781 8.609375 L 23.699219 8.609375 C 23.867188 8.609375 24 8.742188 24 8.90625 L 24 10.09375 C 24 10.257812 23.867188 10.390625 23.699219 10.390625 L 18.898438 10.390625 L 18.898438 16.625 C 18.898438 17.28125 18.363281 17.8125 17.699219 17.8125 Z M 17.699219 17.8125" />
</svg>
);
export const Duty1Icon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M23.6992 11.4219C23.8672 11.4219 24 11.5547 24 11.7188V12.9062C24 13.0703 23.8672 13.2031 23.6992 13.2031H18.8984V19.4375C18.8984 20.0938 18.3633 20.625 17.6992 20.625H12.3008C11.6367 20.625 11.1016 20.0938 11.1016 19.4375V16.918C11.3931 16.9709 11.6932 17 12 17C12.3068 17 12.6069 16.9709 12.8984 16.918V18.8438H17.1016V12.6094C17.1016 11.9531 17.6367 11.4219 18.3008 11.4219H23.6992ZM11.2266 7.99609H11.8506C12.4423 7.99611 12.838 8.09607 13.0381 8.2959C13.2461 8.4879 13.3506 8.82841 13.3506 9.31641L13.3623 14.1885C13.3622 14.8362 13.2466 15.3001 13.0146 15.5801C12.7826 15.8521 12.43 15.9883 11.958 15.9883C11.6462 15.9882 11.3941 15.9397 11.2021 15.8438C11.0104 15.7478 10.8627 15.572 10.7588 15.3164C10.6628 15.0604 10.6106 14.7161 10.6025 14.2842L10.5781 9.80762C10.1943 9.80758 9.87877 9.73943 9.63086 9.60352C9.38298 9.45959 9.25891 9.22423 9.25879 8.89648C9.25879 8.63248 9.37073 8.41605 9.59473 8.24805C9.82671 8.07213 10.1468 7.98438 10.5547 7.98438C10.7147 7.98438 10.9387 7.9881 11.2266 7.99609ZM11.6992 4C12.3633 4 12.8984 4.53125 12.8984 5.1875V7.08203C12.6069 7.02912 12.3068 7 12 7C11.6932 7 11.3931 7.02912 11.1016 7.08203V5.78125H6.89844V12.0156C6.89844 12.6719 6.36328 13.2031 5.69922 13.2031H0.300781C0.132812 13.2031 0 13.0703 0 12.9062V11.7188C0 11.5547 0.132812 11.4219 0.300781 11.4219H5.10156V5.1875C5.10156 4.53125 5.63672 4 6.30078 4H11.6992Z" />
</svg>
);
export const Duty2Icon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M23.6992 11.4219C23.8672 11.4219 24 11.5547 24 11.7188V12.9062C24 13.0703 23.8672 13.2031 23.6992 13.2031H18.8984V19.4375C18.8984 20.0938 18.3633 20.625 17.6992 20.625H12.3008C11.6367 20.625 11.1016 20.0938 11.1016 19.4375V16.918C11.3931 16.9709 11.6932 17 12 17C12.3068 17 12.6069 16.9709 12.8984 16.918V18.8438H17.1016V12.6094C17.1016 11.9531 17.6367 11.4219 18.3008 11.4219H23.6992ZM11.7598 7.98438C13.9357 7.98438 15.0233 8.81192 15.0234 10.4678C15.0234 10.8518 14.9796 11.2044 14.8916 11.5244C14.8036 11.8362 14.6953 12.1005 14.5674 12.3164C14.4394 12.5242 14.2638 12.7242 14.04 12.916C13.8241 13.108 13.6197 13.2638 13.4277 13.3838C13.2358 13.5038 12.9997 13.6316 12.7197 13.7676H14.0518C14.7238 13.7676 15.0596 14.1445 15.0596 14.8965C15.0595 15.3202 14.9513 15.6237 14.7354 15.8076C14.5273 15.9836 14.1514 16.0723 13.6074 16.0723H10.3555C9.79602 16.0722 9.41215 16.0002 9.2041 15.8564C9.00417 15.7045 8.90436 15.3842 8.9043 14.8965C8.9043 14.7366 8.92018 14.6002 8.95215 14.4883C8.98415 14.3683 9.04384 14.2516 9.13184 14.1396C9.21982 14.0277 9.34029 13.9203 9.49219 13.8164C9.92408 13.5285 10.2637 13.2961 10.5117 13.1201C10.7596 12.9442 10.9996 12.7602 11.2314 12.5684C11.4713 12.3685 11.6478 12.2004 11.7598 12.0645C11.8717 11.9205 11.9716 11.76 12.0596 11.584C12.1556 11.408 12.2162 11.2317 12.2402 11.0557C12.2722 10.8797 12.2881 10.6715 12.2881 10.4316C12.288 9.98407 12.1479 9.75995 11.8682 9.75977C11.5642 9.75977 11.4122 10.0239 11.4121 10.5518C11.4121 10.8477 11.3159 11.0399 11.124 11.1279C10.932 11.2159 10.6475 11.2598 10.2715 11.2598C9.75966 11.2597 9.4115 11.1478 9.22754 10.9238C9.05166 10.6998 8.96387 10.3274 8.96387 9.80762C8.96399 9.28779 9.20841 8.85563 9.69629 8.51172C10.1922 8.15994 10.8801 7.98438 11.7598 7.98438ZM11.6992 4C12.3633 4 12.8984 4.53125 12.8984 5.1875V7.08203C12.6069 7.02912 12.3068 7 12 7C11.6932 7 11.3931 7.02912 11.1016 7.08203V5.78125H6.89844V12.0156C6.89844 12.6719 6.36328 13.2031 5.69922 13.2031H0.300781C0.132812 13.2031 0 13.0703 0 12.9062V11.7188C0 11.5547 0.132812 11.4219 0.300781 11.4219H5.10156V5.1875C5.10156 4.53125 5.63672 4 6.30078 4H11.6992Z" />
</svg>
);
export const WaveIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M 22.582031 9.6875 L 22.03125 9.523438 C 21.734375 9.433594 21.425781 9.601562 21.328125 9.902344 C 20.585938 12.238281 18.386719 16.03125 16.675781 16.03125 C 14.804688 16.03125 13.535156 12.550781 12.308594 9.1875 C 10.875 5.253906 9.390625 1.1875 6.324219 1.1875 C 3.132812 1.1875 0.636719 6.621094 0.0273438 8.5625 C -0.0195312 8.714844 -0.00390625 8.878906 0.0703125 9.019531 C 0.140625 9.164062 0.265625 9.265625 0.417969 9.3125 L 0.96875 9.476562 C 1.265625 9.566406 1.574219 9.398438 1.671875 9.097656 C 2.414062 6.761719 4.613281 2.96875 6.324219 2.96875 C 8.195312 2.96875 9.464844 6.449219 10.691406 9.8125 C 12.125 13.746094 13.609375 17.8125 16.675781 17.8125 C 19.867188 17.8125 22.363281 12.378906 22.972656 10.4375 C 23.019531 10.285156 23.003906 10.121094 22.929688 9.980469 C 22.859375 9.835938 22.734375 9.734375 22.582031 9.6875 Z M 22.582031 9.6875 " />
</svg>
);
export const Wave3Icon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M22.5301 12.3359L23.0809 12.5C23.2332 12.5469 23.3582 12.6485 23.4285 12.793C23.5027 12.9336 23.5184 13.0977 23.4715 13.25C22.8621 15.1915 20.366 20.625 17.1746 20.625C15.267 20.6248 13.9715 19.0508 12.9197 16.9141C13.5058 16.805 14.0556 16.5941 14.5506 16.2998C15.3064 17.7977 16.1495 18.8435 17.1746 18.8438C18.8855 18.8438 21.0847 15.0508 21.827 12.7148C21.9246 12.4142 22.2333 12.2463 22.5301 12.3359ZM11.6522 7.98438C12.7319 7.98438 13.54 8.15989 14.076 8.51172C14.6119 8.86364 14.8806 9.32378 14.8807 9.8916C14.8807 10.6836 14.5364 11.3161 13.8484 11.7881C14.3124 12.0361 14.6361 12.2964 14.8201 12.5684C15.012 12.8323 15.1082 13.2159 15.1082 13.7197C15.1082 14.4157 14.8321 14.9838 14.2801 15.4238C13.7362 15.8557 13.0045 16.0722 12.0848 16.0723C10.9328 16.0723 10.1044 15.9556 9.6004 15.7236C9.10448 15.4836 8.85626 15.1235 8.85626 14.6436C8.85632 14.2438 8.93656 13.9721 9.0965 13.8281C9.2565 13.6761 9.48037 13.5996 9.76837 13.5996C9.91236 13.5996 10.1363 13.6164 10.4402 13.6484C10.7442 13.6804 10.9765 13.6963 11.1365 13.6963C12.0084 13.6963 12.4442 13.5358 12.4442 13.2158C12.4441 12.9999 12.3601 12.8524 12.1922 12.7725C12.0242 12.6845 11.708 12.6396 11.244 12.6396C10.7803 12.6396 10.4525 12.5799 10.2606 12.46C10.0686 12.34 9.97249 12.116 9.97247 11.7881C9.97247 11.2921 10.3008 11.0439 10.9568 11.0439C11.3806 11.0439 11.6925 11.0244 11.8924 10.9844C12.1004 10.9444 12.2207 10.8996 12.2527 10.8516C12.2846 10.7955 12.3006 10.7075 12.3006 10.5879C12.3005 10.196 11.9364 10.0001 11.2088 10C11.0569 10 10.8486 10.0159 10.5848 10.0479C10.3288 10.0719 10.1403 10.084 10.0203 10.084C9.44436 10.084 9.15607 9.73974 9.15607 9.05176C9.15625 8.33995 9.98849 7.98441 11.6522 7.98438ZM6.82306 4C8.55901 4 9.78721 5.30384 10.7869 7.14844C10.2121 7.29171 9.67583 7.53353 9.19904 7.85645C8.50673 6.61372 7.73754 5.78125 6.82306 5.78125C5.11218 5.78183 2.91285 9.5744 2.17072 11.9102C2.07302 12.2109 1.76443 12.3789 1.46759 12.2891L0.916809 12.125C0.764627 12.0781 0.63941 11.9764 0.569153 11.832C0.495025 11.6915 0.479369 11.5273 0.526184 11.375C1.13553 9.43367 3.63184 4.00045 6.82306 4Z" />
</svg>
);
export const NoiseIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M2.04309 12C2.50295 14.8029 6.78413 17 12.0001 17C17.2161 17 21.4973 14.8029 21.9572 12H22.0001V18C21.9997 20.209 17.5227 22 12.0001 22C6.47752 22 2.00052 20.209 2.00012 18V12H2.04309ZM12.0001 3C17.5229 3.00004 22.0001 5.68632 22.0001 9C21.9998 12.3135 17.5227 15 12.0001 15C6.47744 15 2.0004 12.3136 2.00012 9C2.00012 5.68629 6.47727 3 12.0001 3Z" />
</svg>
);
export const Noise4Icon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M2.04307 14.0003C2.21451 15.0453 2.91562 16.0061 4.0001 16.8001V21.4007C4.30422 21.5626 4.63929 21.7133 5.0001 21.8548V17.4261C6.69295 18.339 8.97289 18.925 11.5001 18.9935V22.9954C11.6657 22.9987 11.8325 23.0003 12.0001 23.0003C12.1677 23.0003 12.3345 22.9987 12.5001 22.9954V18.9935C15.0274 18.925 17.3073 18.339 19.0001 17.4261V21.8548C19.361 21.7133 19.6959 21.5626 20.0001 21.4007V16.8001C21.0846 16.0061 21.7857 15.0453 21.9571 14.0003H22.0001V20.0003C21.9997 22.2093 17.5226 24.0003 12.0001 24.0003C6.4775 24.0003 2.00051 22.2093 2.0001 20.0003V14.0003H2.04307ZM12.0001 6.00031C17.5229 6.00036 22.0001 8.68663 22.0001 12.0003C21.9998 15.3138 17.5227 18.0003 12.0001 18.0003C6.47742 18.0003 2.00038 15.3139 2.0001 12.0003C2.0001 8.6866 6.47725 6.00031 12.0001 6.00031ZM12.0001 7.00031C7.02954 7.00031 3.0001 9.23888 3.0001 12.0003C3.0004 14.7616 7.02972 17.0003 12.0001 17.0003C16.9704 17.0003 20.9998 14.7616 21.0001 12.0003C21.0001 9.23891 16.9706 7.00035 12.0001 7.00031ZM13.2862 7.9964C13.87 7.99644 14.2658 8.09625 14.4737 8.2962C14.6817 8.48817 14.7862 8.8279 14.7862 9.31573V12.4837C15.13 12.5157 15.3663 12.5997 15.4942 12.7357C15.6222 12.8717 15.6856 13.0881 15.6856 13.3841C15.6856 13.688 15.6175 13.8998 15.4815 14.0198C15.3456 14.1317 15.1139 14.1999 14.7862 14.2239C14.7862 14.8559 14.6696 15.3084 14.4376 15.5804C14.2056 15.8522 13.8575 15.9876 13.3937 15.9876C12.9218 15.9876 12.5774 15.8598 12.3614 15.6038C12.1456 15.3398 12.0382 14.8834 12.0382 14.2357H9.81748C9.29767 14.2356 8.90936 14.1115 8.65342 13.8636C8.4057 13.6156 8.28233 13.2954 8.28233 12.9036C8.28239 12.4798 8.38963 12.1036 8.60557 11.7757C9.17355 10.8877 9.81353 9.92776 10.5255 8.89581C10.9415 8.28781 11.5143 7.9837 12.2423 7.9837L13.2862 7.9964ZM10.4542 12.5316H12.0255L12.0616 9.97589L10.4542 12.5316ZM8.0001 1.00031C9.10463 1.00036 10.0001 1.89577 10.0001 3.00031C9.99993 4.1047 9.10452 5.00025 8.0001 5.00031C7.57419 5.00031 7.17995 4.8659 6.85557 4.63898L1.3253 9.38019C1.11566 9.55958 0.799851 9.53498 0.620218 9.3255C0.440616 9.11588 0.465384 8.80013 0.674906 8.62042L6.20518 3.87921C6.07492 3.61376 6.00015 3.31594 6.0001 3.00031C6.0001 1.89574 6.89553 1.00031 8.0001 1.00031ZM16.0001 1.00031C17.1046 1.00039 18.0001 1.89579 18.0001 3.00031C18.0001 3.31608 17.9244 3.61367 17.794 3.87921L23.3253 8.62042C23.5347 8.80013 23.5595 9.11591 23.38 9.3255C23.2004 9.535 22.8846 9.55944 22.6749 9.38019L17.1437 4.63898C16.8194 4.86565 16.4257 5.00027 16.0001 5.00031C14.8956 5.00031 14.0003 4.10473 14.0001 3.00031C14.0001 1.89574 14.8955 1.00031 16.0001 1.00031Z" />
</svg>
);
export const AudioOnIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M9 18h-7v-12h7v12zm2-12v12l11 6v-24l-11 6z" />
</svg>
);
export const AudioOffIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M22 1.269l-18.455 22.731-1.545-1.269 3.841-4.731h-1.827v-10h4.986v6.091l2.014-2.463v-3.628l5.365-2.981 4.076-5.019 1.545 1.269zm-10.986 15.926v.805l8.986 5v-16.873l-8.986 11.068z" />
</svg>
);
export const PianoIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M10.3633 1.2627H13.6367V0H17.4541V1.2627H22C23.1044 1.2627 23.9998 2.15833 24 3.2627V22C23.9997 23.1044 23.1044 24 22 24H2C0.895584 24 0.000249458 23.1044 0 22V3.2627C0.000246021 2.15834 0.895582 1.2627 2 1.2627H6.5459V0H10.3633V1.2627ZM2.68164 3.78906C2.40573 3.78916 2.18189 4.01319 2.18164 4.28906V20.9736C2.18186 21.2495 2.40571 21.4735 2.68164 21.4736H7.63672V15.1582H6.5459V3.78906H2.68164ZM17.4541 15.1582H16.3633V21.4736H21.3184C21.5943 21.4735 21.8181 21.2495 21.8184 20.9736V4.28906C21.8181 4.01319 21.5943 3.78916 21.3184 3.78906H17.4541V15.1582ZM10.3633 15.1582H9.27246V21.4736H14.7275V15.1582H13.6367V3.78906H10.3633V15.1582Z" />
</svg>
);
export const PianoInverseIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M6 15H7.25V24H2C0.895584 24 0.000249458 23.1044 0 22V3.2627C0.000246021 2.15834 0.895582 1.2627 2 1.2627H6V15ZM14 15H15.25V24H8.75V15H10V1.2627H14V15ZM22 1.2627C23.1044 1.2627 23.9998 2.15833 24 3.2627V22C23.9997 23.1044 23.1044 24 22 24H16.75V15H18V1.2627H22Z" />
</svg>
);
export const RecordIcon = () => (
<svg
clipRule="evenodd"
fillRule="evenodd"
strokeLinejoin="round"
strokeMiterlimit="2"
viewBox="0 0 24 24"
>
<circle cx="11.998" cy="11.998" fillRule="nonzero" r="9.998" />
</svg>
);
export const MetronomeIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M13.5125 2C14.3955 2.00027 15.1739 2.58001 15.4276 3.42578L17.5331 10.4473L18.3739 9.16211C18.1393 8.83441 17.9999 8.43376 17.9999 8C17.9999 6.89548 18.8953 6.00007 19.9999 6C20.1432 6 20.2831 6.0153 20.4178 6.04395L21.3719 4.58887C21.5989 4.24249 22.0645 4.14531 22.411 4.37207C22.7575 4.59907 22.8538 5.06466 22.6268 5.41113L21.66 6.88574C21.8742 7.20426 21.9999 7.58728 21.9999 8C21.9999 9.10457 21.1044 10 19.9999 10C19.8774 9.99999 19.7579 9.98691 19.6415 9.96582L18.0965 12.3252L20.2274 19.4258C20.612 20.7087 19.6517 21.9997 18.3124 22H5.68833C4.34879 22 3.38777 20.7088 3.77232 19.4258L8.5731 3.42578C8.82689 2.57991 9.60502 2.00008 10.4881 2H13.5125ZM12.4999 6H13.4999V7H12.4999V9H13.9999V10H12.4999V12H13.4999V13H12.4999V16H13.8963L16.076 12.6719L13.87 4.73242C13.7498 4.29979 13.3561 4.00024 12.9071 4H12.4999V6ZM11.0936 4C10.6444 4.00002 10.25 4.29965 10.1297 4.73242L7.35239 14.7324C7.17543 15.3696 7.65495 16 8.31626 16H11.4999V13H10.4999V12H11.4999V10H9.99985V9H11.4999V7H10.4999V6H11.4999V4H11.0936ZM15.6893 15.999C16.3479 15.9958 16.8247 15.3679 16.6483 14.7324L16.6092 14.5947L15.6893 15.999Z" />
</svg>
);
export const ClefIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12.5491 13.1363C12.2091 13.2282 11.9024 13.4338 11.6181 13.7477C11.3338 14.0669 11.1944 14.4186 11.1944 14.7973C11.1944 15.0354 11.278 15.306 11.4397 15.5927C11.6014 15.8849 11.8467 16.0959 12.1645 16.2312C12.2704 16.2528 12.3206 16.3069 12.3206 16.3827C12.3206 16.4097 12.2815 16.4368 12.1868 16.4584C11.6794 16.334 11.2613 16.0689 10.938 15.6739C10.6146 15.2735 10.4474 14.819 10.4362 14.2996C10.453 13.7423 10.6258 13.2228 10.9547 12.7467C11.2892 12.2651 11.7185 11.9242 12.2425 11.7241L11.8578 9.80325C10.9993 10.4958 10.3024 11.2154 9.76167 11.9729C9.22091 12.725 8.94216 13.5421 8.91986 14.424C8.93101 14.819 9.01463 15.2031 9.17073 15.5711C9.32683 15.9444 9.56098 16.2799 9.87317 16.5883C10.5031 17.1997 11.3226 17.5189 12.3206 17.5514C12.6606 17.5298 13.023 17.4702 13.4132 17.3728L12.5491 13.1363ZM12.9505 13.0821L13.8202 17.243C14.6787 16.9075 15.108 16.1771 15.108 15.0625C15.0578 14.6891 14.9463 14.3537 14.7568 14.0561C14.5728 13.7531 14.3275 13.515 14.0153 13.3419C13.7031 13.1687 13.3519 13.0821 12.9505 13.0821ZM11.8077 7.45499C11.9916 7.34678 12.2035 7.1574 12.4321 6.89228C12.6606 6.63256 12.8836 6.32415 13.0955 5.97787C13.3129 5.62617 13.4857 5.26906 13.6139 4.90654C13.7422 4.54943 13.8035 4.20856 13.8035 3.89474C13.8035 3.75947 13.7923 3.6242 13.7645 3.50516C13.7422 3.31038 13.6808 3.15888 13.5749 3.05607C13.469 2.95868 13.3352 2.90457 13.1679 2.90457C12.8334 2.90457 12.5324 3.10477 12.2648 3.50516C12.0585 3.85145 11.8857 4.26267 11.7631 4.72799C11.6348 5.19872 11.5624 5.66404 11.5512 6.13478C11.5791 6.67044 11.6683 7.10871 11.8077 7.45499ZM11.4564 7.76881C11.2056 6.89228 11.0662 5.99951 11.0383 5.09051C11.0439 4.50615 11.1052 3.95967 11.2223 3.45106C11.3338 2.94245 11.4955 2.50418 11.7073 2.12543C11.9136 1.74668 12.1533 1.45991 12.4209 1.26513C12.6606 1.09198 12.8334 1 12.9282 1C13.0007 1 13.062 1.02705 13.1178 1.07575C13.1735 1.12445 13.246 1.20561 13.3352 1.31382C13.9986 2.22823 14.3331 3.33202 14.3331 4.61977C14.3331 5.23119 14.2495 5.82637 14.0822 6.42154C13.9206 7.01131 13.6808 7.57403 13.3631 8.09887C13.0397 8.62912 12.6606 9.08903 12.2202 9.48401L12.6718 11.6158C12.9171 11.5888 13.0843 11.5671 13.1791 11.5671C13.6028 11.5671 13.9819 11.6537 14.3331 11.8269C14.6843 12 14.9854 12.2327 15.2307 12.5303C15.476 12.8224 15.6655 13.1579 15.7993 13.5366C15.9275 13.9154 16 14.3104 16 14.7216C16 15.3601 15.8272 15.9444 15.4815 16.4693C15.1359 16.9941 14.6174 17.3783 13.9206 17.6272C13.9652 17.8923 14.0432 18.2764 14.1603 18.7688C14.2718 19.2666 14.3554 19.6616 14.4111 19.9538C14.4669 20.2459 14.4892 20.5273 14.4892 20.8032C14.4892 21.2307 14.3833 21.6094 14.1714 21.9449C13.954 22.2804 13.6641 22.5401 13.2962 22.7241C12.9338 22.908 12.5324 23 12.0976 23C11.4843 23 10.9491 22.8323 10.492 22.5022C10.0348 22.1667 9.78955 21.7177 9.76725 21.1441C9.78397 20.8898 9.8453 20.6517 9.95679 20.4245C10.0683 20.1972 10.2188 20.0133 10.4139 19.8726C10.6035 19.7265 10.8321 19.6508 11.0941 19.6345C11.3115 19.6345 11.5178 19.694 11.7129 19.8077C11.9024 19.9267 12.0585 20.0836 12.1756 20.2838C12.2871 20.484 12.3484 20.7059 12.3484 20.9439C12.3484 21.2632 12.2369 21.5337 12.0139 21.7555C11.7909 21.9774 11.5066 22.091 11.1666 22.091H11.0383C11.2557 22.4156 11.6125 22.5834 12.1087 22.5834C12.3596 22.5834 12.616 22.5293 12.8725 22.4319C13.1345 22.3291 13.3519 22.1938 13.5359 22.0207C13.7199 21.8475 13.8425 21.6636 13.8927 21.4688C13.9875 21.2469 14.0321 20.9385 14.0321 20.5544C14.0321 20.2946 14.0042 20.0349 13.954 19.7752C13.9038 19.5209 13.8258 19.18 13.7199 18.758C13.6139 18.3414 13.5359 18.0167 13.4913 17.7949C13.1568 17.876 12.8112 17.9193 12.4488 17.9193C11.8411 17.9193 11.2669 17.8003 10.7261 17.5568C10.1854 17.3133 9.7115 16.9779 9.29895 16.545C8.89199 16.1121 8.57422 15.6252 8.34564 15.0733C8.12265 14.5268 8.00557 13.9533 8 13.3581C8.0223 12.8062 8.12822 12.2759 8.32892 11.7782C8.52962 11.275 8.78606 10.7988 9.10383 10.3551C9.4216 9.91146 9.75052 9.50566 10.0906 9.14314C10.4362 8.78603 10.8878 8.32612 11.4564 7.76881Z" />
</svg>
);
export const StepsIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24 24H0V18H6V12H12V6H18V0H24V24Z" />
</svg>
);
export const InstrumentIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21.1393 5.37744L20.7208 4.95897L14.2795 11.4003C15.6234 12.8492 16.2159 13.9254 15.6461 15.2707C15.0809 16.6042 12.9793 16.4023 12.73 17.419C12.4812 18.4361 11.8389 21.384 10.7854 22.4378C8.56994 24.6532 5.76831 23.7501 3.01002 20.9918C0.251882 18.2336 -0.650619 15.4325 1.56473 13.2171C2.61848 12.1637 5.56562 11.5207 6.58284 11.2718C7.59973 11.0227 7.39752 8.92098 8.73109 8.35571C10.0766 7.78565 11.153 8.37864 12.6022 9.72297L19.0435 3.28167L18.6251 2.8632L20.6159 0.0340849L23.9684 3.38663L21.1393 5.37744ZM11.0444 12.9574C10.35 12.2633 9.24679 12.2403 8.58125 12.9056C7.91594 13.5712 7.93959 14.6737 8.63373 15.3681C9.32806 16.0624 10.4306 16.0859 11.0962 15.4206C11.7615 14.755 11.7387 13.6518 11.0444 12.9574Z" />
</svg>
);
export const UndoIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M17.026 22.957c10.957-11.421-2.326-20.865-10.384-13.309l2.464 2.352h-9.106v-8.947l2.232 2.229c14.794-13.203 31.51 7.051 14.794 17.675z" />{" "}
</svg>
);
export const RedoIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M6.974 22.957c-10.957-11.421 2.326-20.865 10.384-13.309l-2.464 2.352h9.106v-8.947l-2.232 2.229c-14.794-13.203-31.51 7.051-14.794 17.675z" />{" "}
</svg>
);
export const TrackerIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M22.5 0H1.5C0.671875 0 0 0.671875 0 1.5V22.5C0 23.3281 0.671875 24 1.5 24H22.5C23.3281 24 24 23.3281 24 22.5V1.5C24 0.671875 23.3281 0 22.5 0ZM21.75 21.75H2.25V2.25H21.75V21.75Z" />
<circle r="2" transform="matrix(-1 0 0 1 18 17)" />
<circle r="2" transform="matrix(-1 0 0 1 12 17)" />
<circle r="2" transform="matrix(-1 0 0 1 6 17)" />
</svg>
);
export const FXIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24.0244 9.7373L19.249 14.5117L24.0244 19.2871L21.2871 22.0244L16.5117 17.249L11.7373 22.0244L9 19.2871L13.7744 14.5117L9 9.7373L11.7373 7L16.5117 11.7744L21.2871 7L24.0244 9.7373ZM13 6H4V12H9V16H4V22H0V2H13V6Z" />
</svg>
);
export const VirtualKeyboardIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M0 3v18h24v-18h-24zm15 4h3v3h-3v-3zm1 4v3h-3v-3h3zm-5-4h3v3h-3v-3zm1 4v3h-3v-3h3zm-5-4h3v3h-3v-3zm-5 0h4v3h-4v-3zm0 4h6v3h-6v-3zm16 7h-12v-3h12v3zm4-4h-5v-3h5v3zm0-4h-3v-3h3v3z" />
</svg>
);
export const SelectionIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M11 23v-2h-4v2h4zm8-20h3v2h2v-4h-5v2zm-19 14h2v-4h-2v4zm0-6h2v-4h-2v4zm2-6v-2h3v-2h-5v4h2zm22 2h-2v4h2v-4zm0 6h-2v4h2v-4zm-2 6v2h-3v2h5v-4h-2zm-17 2h-3v-2h-2v4h5v-2zm12 2v-2h-4v2h4zm-6-20v-2h-4v2h4zm6 0v-2h-4v2h4z" />
</svg>
);
export const SaveIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M14 3h2.997v5h-2.997v-5zm9 1v20h-22v-24h17.997l4.003 4zm-17 5h12v-7h-12v7zm14 4h-16v9h16v-9z" />
</svg>
);
export const CloneIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M18 6v-6h-18v18h6v6h18v-18h-6zm-12 10h-4v-14h14v4h-10v10zm16 6h-14v-14h14v14zm-3-8h-3v-3h-2v3h-3v2h3v3h2v-3h3v-2z" />
</svg>
);
export const TargetIcon = ({
className,
style,
}: {
className?: string;
style?: CSSProperties;
}) => (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
className={className}
style={style}
>
<path d="M24 11h-2.051c-.469-4.725-4.224-8.48-8.949-8.95v-2.05h-2v2.05c-4.725.47-8.48 4.225-8.949 8.95h-2.051v2h2.051c.469 4.725 4.224 8.48 8.949 8.95v2.05h2v-2.05c4.725-.469 8.48-4.225 8.949-8.95h2.051v-2zm-11 8.931v-3.931h-2v3.931c-3.611-.454-6.478-3.32-6.931-6.931h3.931v-2h-3.931c.453-3.611 3.32-6.477 6.931-6.931v3.931h2v-3.931c3.611.454 6.478 3.319 6.931 6.931h-3.931v2h3.931c-.453 3.611-3.32 6.477-6.931 6.931zm1-7.931c0 1.104-.896 2-2 2s-2-.896-2-2 .896-2 2-2 2 .896 2 2z" />
</svg>
);
export const ExportIcon = () => (
<svg
width="24"
height="24"
fillRule="evenodd"
clipRule="evenodd"
viewBox="0 0 24 24"
>
<path d="M16 2v7h-2v-5h-12v16h12v-5h2v7h-16v-20h16zm2 9v-4l6 5-6 5v-4h-10v-2h10z" />
</svg>
);
export const PlayIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M3 22v-20l18 10-18 10z" />
</svg>
);
export const PauseIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M11 22h-4v-20h4v20zm6-20h-4v20h4v-20z" />
</svg>
);
export const StopIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M2 2h20v20h-20z" />
</svg>
);
export const DebugIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24 20.586l-2.831-2.832c.522-.79.831-1.735.831-2.754 0-2.761-2.238-5-5-5s-5 2.239-5 5 2.238 5 5 5c1.019 0 1.964-.309 2.755-.832l2.831 2.832 1.414-1.414zm-10-5.586c0-1.654 1.346-3 3-3s3 1.346 3 3-1.346 3-3 3-3-1.346-3-3zm-8.105-11.827c0-.647.535-1.173 1.193-1.173.784 0 1.354.736 1.149 1.48-.077.281-.035.58.117.829.333.553.902.895 1.646.899.733-.004 1.31-.341 1.647-.898.151-.25.193-.548.116-.829-.205-.744.364-1.481 1.149-1.481.66 0 1.191.526 1.191 1.173 0 .564-.4 1.029-.932 1.146-.267.059-.498.224-.641.456-.508.848.162 1.599.777 2.354-1.008.468-2.102.705-3.307.705-1.222 0-2.309-.232-3.312-.701.623-.767 1.295-1.501.779-2.358-.141-.231-.372-.397-.64-.456-.53-.117-.932-.582-.932-1.146zm4.105 11.827c0 2.432 1.249 4.577 3.137 5.832-.854.59-1.904 1.03-3.137 1.168-2.492-.278-4.243-1.788-5.113-3.286-.177-.304-.494-.329-.751-.216l-2.133.952c-.441.196-.962.002-1.162-.433-.2-.435-.004-.947.438-1.144l2.017-.898c.436-.195.719-.611.625-1.217-.088-.571-.577-.882-1.054-.882h-1.989c-.486 0-.878-.386-.878-.863 0-.478.392-.865.878-.865h2.002c.46 0 .941-.294 1.03-.925.068-.483-.232-.902-.645-1.062l-1.86-.723c-.45-.175-.672-.676-.494-1.12.178-.444.689-.663 1.139-.487l1.913.742c.245.095.594.064.784-.365.15-.339.32-.655.501-.954 1.423.831 2.99 1.246 4.752 1.246 1.412 0 2.723-.297 3.933-.848l.04.056c-2.344 1.131-3.973 3.519-3.973 6.292z" />
</svg>
);
export const PlayStartIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M2 3H6V21H2V3Z" />
<path d="M22 12L7 21L7 3L22 12Z" />
</svg>
);
export const NextIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M19 12l-18 12v-24l18 12zm4-11h-4v22h4v-22z" />
</svg>
);
export const PrevIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path
transform="rotate(180 12,12)"
d="M19 12l-18 12v-24l18 12zm4-11h-4v22h4v-22z"
/>
</svg>
);
export const JigsawIcon = () => (
<svg width="28" height="24" viewBox="0 0 28 24">
<path d="M3 24v-6.075c0-1.315 1-1.663 1.813-.847.399.398.73.922 1.708.922 1.087 0 2.479-1.108 2.479-3s-1.392-3-2.479-3c-.979 0-1.31.524-1.708.922-.813.816-1.813.469-1.813-.847v-6.075h6.075c1.315 0 1.663-1 .847-1.813-.398-.399-.922-.73-.922-1.708 0-1.087 1.108-2.479 3-2.479s3 1.392 3 2.479c0 .978-.524 1.309-.922 1.708-.816.813-.469 1.813.847 1.813h6.075v18h-18z" />
</svg>
);
export const PlusIcon = ({ title }: { title?: string }) => (
<svg width="24" height="24" viewBox="0 0 24 24">
{title && <title>{title}</title>}
<path d="M24 9h-9v-9h-6v9h-9v6h9v9h6v-9h9z" />
</svg>
);
export const PlusSmallIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M9.5 3H14.5V9.5H21V14.5H14.5V21H9.5V14.5H3V9.5H9.5Z" />
</svg>
);
export const MinusSmallIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M2 9.5h20v5h-20z" />
</svg>
);
export const BackspaceIcon = () => (
<svg
clipRule="evenodd"
fillRule="evenodd"
strokeLinejoin="round"
strokeMiterlimit="2"
viewBox="0 0 24 24"
>
<path
d="m22 6c0-.552-.448-1-1-1h-12.628c-.437 0-.853.191-1.138.523-1.078 1.256-3.811 4.439-4.993 5.815-.16.187-.241.419-.241.651 0 .231.08.463.24.651 1.181 1.38 3.915 4.575 4.994 5.835.285.333.701.525 1.14.525h12.626c.552 0 1-.448 1-1 0-2.577 0-9.423 0-12zm-13.628.5h12.128v11h-12.126l-4.715-5.51zm5.637 4.427 1.71-1.71c.146-.146.339-.219.531-.219.404 0 .75.324.75.749 0 .193-.073.384-.219.531l-1.711 1.711 1.728 1.728c.147.147.22.339.22.53 0 .427-.349.751-.75.751-.192 0-.384-.073-.531-.219l-1.728-1.729-1.728 1.729c-.146.146-.339.219-.531.219-.401 0-.75-.324-.75-.751 0-.191.073-.383.22-.53l1.728-1.728-1.788-1.787c-.146-.148-.219-.339-.219-.532 0-.425.346-.749.751-.749.192 0 .384.073.53.219z"
fillRule="nonzero"
/>
</svg>
);
export const ShiftIcon = () => (
<svg viewBox="0 0 24 24">
<path d="M6.97889 20.5V14.4345H1.46438L1 13.2709L11.942 2.5H12.058L23 13.2709L22.5356 14.4345H17.0211V20.5H6.97889ZM9.8 17.6875H14.2V12.2907H18.1864L18.2445 12.1713L12.058 6.04375H11.942L5.75554 12.1713L5.81359 12.2907H9.8V17.6875Z" />
</svg>
);
export const ArrowRightLineIcon = () => (
<svg viewBox="0 0 24 24">
<path d="M16.892 13.1814C16.298 13.1814 15.776 13.1814 15.326 13.1814C14.876 13.1814 14.462 13.1814 14.084 13.1814C13.706 13.1814 13.328 13.1814 12.95 13.1814C11.996 13.1814 11.051 13.1814 10.115 13.1814C9.197 13.1814 8.297 13.1814 7.415 13.1814C6.551 13.1814 5.705 13.1814 4.877 13.1814C4.427 13.1814 4.085 13.0644 3.851 12.8304C3.617 12.5784 3.5 12.2904 3.5 11.9664C3.5 11.6424 3.617 11.3634 3.851 11.1294C4.085 10.8774 4.427 10.7514 4.877 10.7514C6.713 10.7514 8.27 10.7514 9.548 10.7514C10.844 10.7514 11.978 10.7514 12.95 10.7514C13.508 10.7514 14.003 10.7514 14.435 10.7514C14.885 10.7514 15.308 10.7514 15.704 10.7514C16.1 10.7514 16.496 10.7514 16.892 10.7514C17.36 10.7514 17.702 10.8774 17.918 11.1294C18.152 11.3634 18.269 11.6424 18.269 11.9664C18.269 12.2904 18.152 12.5784 17.918 12.8304C17.702 13.0644 17.36 13.1814 16.892 13.1814ZM14.003 4.46042C14.723 5.18042 15.443 5.90042 16.163 6.62042C16.883 7.34042 17.603 8.06942 18.323 8.80742C19.007 9.47342 19.511 10.0584 19.835 10.5624C20.159 11.0664 20.321 11.5344 20.321 11.9664C20.321 12.3984 20.15 12.8664 19.808 13.3704C19.484 13.8564 18.989 14.4324 18.323 15.0984C17.621 15.8184 16.901 16.5384 16.163 17.2584C15.443 17.9784 14.723 18.6984 14.003 19.4184C13.679 19.7424 13.346 19.9044 13.004 19.9044C12.68 19.8864 12.401 19.7604 12.167 19.5264C11.933 19.2924 11.807 19.0134 11.789 18.6894C11.789 18.3474 11.951 18.0144 12.275 17.6904C12.761 17.2044 13.238 16.7274 13.706 16.2594C14.192 15.7914 14.678 15.3144 15.164 14.8284C15.65 14.3424 16.127 13.8564 16.595 13.3704C16.991 12.9744 17.288 12.6774 17.486 12.4794C17.684 12.2814 17.783 12.1104 17.783 11.9664C17.783 11.8224 17.684 11.6514 17.486 11.4534C17.288 11.2374 16.991 10.9314 16.595 10.5354C15.875 9.79742 15.155 9.06842 14.435 8.34842C13.715 7.62842 12.995 6.90842 12.275 6.18842C11.951 5.86442 11.798 5.53142 11.816 5.18942C11.834 4.84742 11.951 4.56842 12.167 4.35242C12.401 4.11842 12.68 4.00142 13.004 4.00142C13.346 3.98342 13.679 4.13642 14.003 4.46042Z" />
</svg>
);
export const ReplaceIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M19.5 2H4.5C3.39543 2 2.5 2.89543 2.5 4V7V11H0.5L5 16L9 11H7V7H15H19.5C20.6046 7 21.5 6.10457 21.5 5V4C21.5 2.89543 20.6046 2 19.5 2Z" />
<path d="M3.5 22H18.5C19.6046 22 20.5 21.1046 20.5 20V17V13H22.5L18 8L14 13H16V17H8H3.5C2.39543 17 1.5 17.8954 1.5 19V20C1.5 21.1046 2.39543 22 3.5 22Z" />
</svg>
);
export const InstantiateIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm7 14h-5v5h-4v-5h-5v-4h5v-5h4v5h5v4z" />
</svg>
);
export const PinIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M11 17h2v5l-2 2v-7zm3.571-12c0-2.903 2.36-3.089 2.429-5h-10c.068 1.911 2.429 2.097 2.429 5 0 3.771-3.429 3.291-3.429 10h12c0-6.709-3.429-6.229-3.429-10z" />
</svg>
);
export const HelpIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M10,19H13V22H10V19M12,2C17.35,2.22 19.68,7.62 16.5,11.67C15.67,12.67 14.33,13.33 13.67,14.17C13,15 13,16 13,17H10C10,15.33 10,13.92 10.67,12.92C11.33,11.92 12.67,11.33 13.5,10.67C15.92,8.43 15.32,5.26 12,5A3,3 0 0,0 9,8H6A6,6 0 0,1 12,2Z" />
</svg>
);
export const ResizeIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M6.426 10.668l-3.547-3.547-2.879 2.879v-10h10l-2.879 2.879 3.547 3.547-4.242 4.242zm11.148 2.664l3.547 3.547 2.879-2.879v10h-10l2.879-2.879-3.547-3.547 4.242-4.242zm-6.906 4.242l-3.547 3.547 2.879 2.879h-10v-10l2.879 2.879 3.547-3.547 4.242 4.242zm2.664-11.148l3.547-3.547-2.879-2.879h10v10l-2.879-2.879-3.547 3.547-4.242-4.242z" />
</svg>
);
export const MinusIcon = ({ title }: { title?: string }) => (
<svg width="24" height="24" viewBox="0 0 24 24">
{title && <title>{title}</title>}
<path d="M24 9h-24v6h24v-6z" />
</svg>
);
export const CloseIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24 20.188l-8.315-8.209 8.2-8.282-3.697-3.697-8.212 8.318-8.31-8.203-3.666 3.666 8.321 8.24-8.206 8.313 3.666 3.666 8.237-8.318 8.285 8.203z" />
</svg>
);
export const SelectIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M4 0l16 12.279-6.78 1.138 4.256 8.676-3.902 1.907-4.281-8.758-5.293 4.581z" />
</svg>
);
export const PencilIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M18.363 8.464l1.433 1.431-12.67 12.669-7.125 1.436 1.439-7.127 12.665-12.668 1.431 1.431-12.255 12.224-.726 3.584 3.584-.723 12.224-12.257zm-.056-8.464l-2.815 2.817 5.691 5.692 2.817-2.821-5.693-5.688zm-12.318 18.718l11.313-11.316-.705-.707-11.313 11.314.705.709z" />
</svg>
);
export const PersonIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M19.5 15c-2.483 0-4.5 2.015-4.5 4.5s2.017 4.5 4.5 4.5 4.5-2.015 4.5-4.5-2.017-4.5-4.5-4.5zm2.5 5h-2v2h-1v-2h-2v-1h2v-2h1v2h2v1zm-7.18 4h-14.815l-.005-1.241c0-2.52.199-3.975 3.178-4.663 3.365-.777 6.688-1.473 5.09-4.418-4.733-8.729-1.35-13.678 3.732-13.678 6.751 0 7.506 7.595 3.64 13.679-1.292 2.031-2.64 3.63-2.64 5.821 0 1.747.696 3.331 1.82 4.5z" />
</svg>
);
export const LockIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M18 10v-4c0-3.313-2.687-6-6-6s-6 2.687-6 6v4h-3v14h18v-14h-3zm-10 0v-4c0-2.206 1.794-4 4-4s4 1.794 4 4v4h-8z" />
</svg>
);
export const LockOpenIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M8 10v-4c0-2.206 1.794-4 4-4 2.205 0 4 1.794 4 4v1h2v-1c0-3.313-2.687-6-6-6s-6 2.687-6 6v4h-3v14h18v-14h-13z" />
</svg>
);
export const BrickIcon = () => (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fillRule="evenodd"
clipRule="evenodd"
>
<path d="M10 18v5h-10v-5h10zm10 0v5h-9v-5h9zm4-6v5h-7v-5h7zm-17 0v5h-7v-5h7zm9 0v5h-8v-5h8zm-6-6v5h-10v-5h10zm10 0v5h-9v-5h9zm-13-5v4h-7v-4h7zm8 0v4h-7v-4h7z" />
</svg>
);
export const PaintIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M8.997 13.985c.01 1.104-.88 2.008-1.986 2.015-1.105.009-2.005-.88-2.011-1.984-.01-1.105.879-2.005 1.982-2.016 1.106-.007 2.009.883 2.015 1.985zm-.978-3.986c-1.104.008-2.008-.88-2.015-1.987-.009-1.103.877-2.004 1.984-2.011 1.102-.01 2.008.877 2.012 1.982.012 1.107-.88 2.006-1.981 2.016zm7.981-4.014c.004 1.102-.881 2.008-1.985 2.015-1.106.01-2.008-.879-2.015-1.983-.011-1.106.878-2.006 1.985-2.015 1.101-.006 2.005.881 2.015 1.983zm-12 15.847c4.587.38 2.944-4.492 7.188-4.537l1.838 1.534c.458 5.537-6.315 6.772-9.026 3.003zm14.065-7.115c1.427-2.239 5.846-9.748 5.846-9.748.353-.623-.429-1.273-.975-.813 0 0-6.572 5.714-8.511 7.525-1.532 1.432-1.539 2.086-2.035 4.447l1.68 1.4c2.227-.915 2.868-1.04 3.995-2.811zm-12.622 4.806c-2.084-1.82-3.42-4.479-3.443-7.447-.044-5.51 4.406-10.03 9.92-10.075 3.838-.021 6.479 1.905 6.496 3.447l1.663-1.456c-1.01-2.223-4.182-4.045-8.176-3.992-6.623.055-11.955 5.466-11.903 12.092.023 2.912 1.083 5.57 2.823 7.635.958.492 2.123.329 2.62-.204zm12.797-1.906c1.059 1.97-1.351 3.37-3.545 3.992-.304.912-.803 1.721-1.374 2.311 5.255-.591 9.061-4.304 6.266-7.889-.459.685-.897 1.197-1.347 1.586z" />
</svg>
);
export const PaintBucketIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21.143 9.667c-.733-1.392-1.914-3.05-3.617-4.753-2.977-2.978-5.478-3.914-6.785-3.914-.414 0-.708.094-.86.246l-1.361 1.36c-1.899-.236-3.42.106-4.294.983-.876.875-1.164 2.159-.792 3.523.492 1.806 2.305 4.049 5.905 5.375.038.323.157.638.405.885.588.588 1.535.586 2.121 0s.588-1.533.002-2.119c-.588-.587-1.537-.588-2.123-.001l-.17.256c-2.031-.765-3.395-1.828-4.232-2.9l3.879-3.875c.496 2.73 6.432 8.676 9.178 9.178l-7.115 7.107c-.234.153-2.798-.316-6.156-3.675-3.393-3.393-3.175-5.271-3.027-5.498l1.859-1.856c-.439-.359-.925-1.103-1.141-1.689l-2.134 2.131c-.445.446-.685 1.064-.685 1.82 0 1.634 1.121 3.915 3.713 6.506 2.764 2.764 5.58 4.243 7.432 4.243.648 0 1.18-.195 1.547-.562l8.086-8.078c.91.874-.778 3.538-.778 4.648 0 1.104.896 1.999 2 1.999 1.105 0 2-.896 2-2 0-3.184-1.425-6.81-2.857-9.34zm-16.209-5.371c.527-.53 1.471-.791 2.656-.761l-3.209 3.206c-.236-.978-.049-1.845.553-2.445zm9.292 4.079l-.03-.029c-1.292-1.292-3.803-4.356-3.096-5.063.715-.715 3.488 1.521 5.062 3.096.862.862 2.088 2.247 2.937 3.458-1.717-1.074-3.491-1.469-4.873-1.462z" />
</svg>
);
export const SquareIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24 0h-24v24h24v-24z" />
</svg>
);
export const SquareIconSmall = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M20 4h-16v16h16v-16z" />
</svg>
);
export const EyeOpenIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12.015 7c4.751 0 8.063 3.012 9.504 4.636-1.401 1.837-4.713 5.364-9.504 5.364-4.42 0-7.93-3.536-9.478-5.407 1.493-1.647 4.817-4.593 9.478-4.593zm0-2c-7.569 0-12.015 6.551-12.015 6.551s4.835 7.449 12.015 7.449c7.733 0 11.985-7.449 11.985-7.449s-4.291-6.551-11.985-6.551zm-.015 3c-2.21 0-4 1.791-4 4s1.79 4 4 4c2.209 0 4-1.791 4-4s-1.791-4-4-4zm-.004 3.999c-.564.564-1.479.564-2.044 0s-.565-1.48 0-2.044c.564-.564 1.479-.564 2.044 0s.565 1.479 0 2.044z" />
</svg>
);
export const EyeClosedIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M19.604 2.562l-3.346 3.137c-1.27-.428-2.686-.699-4.243-.699-7.569 0-12.015 6.551-12.015 6.551s1.928 2.951 5.146 5.138l-2.911 2.909 1.414 1.414 17.37-17.035-1.415-1.415zm-6.016 5.779c-3.288-1.453-6.681 1.908-5.265 5.206l-1.726 1.707c-1.814-1.16-3.225-2.65-4.06-3.66 1.493-1.648 4.817-4.594 9.478-4.594.927 0 1.796.119 2.61.315l-1.037 1.026zm-2.883 7.431l5.09-4.993c1.017 3.111-2.003 6.067-5.09 4.993zm13.295-4.221s-4.252 7.449-11.985 7.449c-1.379 0-2.662-.291-3.851-.737l1.614-1.583c.715.193 1.458.32 2.237.32 4.791 0 8.104-3.527 9.504-5.364-.729-.822-1.956-1.99-3.587-2.952l1.489-1.46c2.982 1.9 4.579 4.327 4.579 4.327z" />
</svg>
);
export const ArrowIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21 12l-18 12v-24z" />
</svg>
);
export const StepIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M16 8v-4l8 8-8 8v-4h-5v-8h5zm-7 0h-2v8h2v-8zm-4.014 0h-1.986v8h1.986v-8zm-3.986 0h-1v8h1v-8z" />
</svg>
);
export const ArrowMoveIcon = ({ style }: { style?: CSSProperties }) => (
<svg width="24" height="24" viewBox="0 0 24 24" style={style}>
<path d="M16 8V4L24 12L16 20V16H12V8H16ZM10 8H6V16H10V8ZM4 8H0.0139771V16H4V8Z" />
</svg>
);
export const ArrowIdleIcon = ({ style }: { style?: CSSProperties }) => (
<svg width="24" height="24" viewBox="0 0 24 24" style={style}>
<path d="m16,8l0,-4l8,8l-8,8l0,-4l-16,0l0,-8l16,0z" />
</svg>
);
export const ArrowJumpIcon = ({ style }: { style?: CSSProperties }) => (
<svg width="24" height="24" viewBox="0 0 24 24" style={style}>
<path d="M16 15v4l8-8.035-8-7.965v4s-13.277 2.144-16 14c5.796-6.206 16-6 16-6z" />
</svg>
);
export const SearchIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M23.822 20.88l-6.353-6.354c.93-1.465 1.467-3.2 1.467-5.059.001-5.219-4.247-9.467-9.468-9.467s-9.468 4.248-9.468 9.468c0 5.221 4.247 9.469 9.468 9.469 1.768 0 3.421-.487 4.839-1.333l6.396 6.396 3.119-3.12zm-20.294-11.412c0-3.273 2.665-5.938 5.939-5.938 3.275 0 5.94 2.664 5.94 5.938 0 3.275-2.665 5.939-5.94 5.939-3.274 0-5.939-2.664-5.939-5.939z" />
</svg>
);
export const PriorityLowIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M 10.649 6.493 C 10.569 5.692 11.199 5 12 5 C 12.801 5 13.431 5.692 13.351 6.493 L 12.55 14.503 C 12.521 14.785 12.284 15 12 15 C 11.716 15 11.479 14.785 11.45 14.502 L 10.649 6.493 Z M 12 19.25 C 11.31 19.25 10.75 18.69 10.75 18 C 10.75 17.31 11.31 16.75 12 16.75 C 12.69 16.75 13.25 17.31 13.25 18 C 13.25 18.69 12.69 19.25 12 19.25 Z" />
</svg>
);
export const PriorityMediumIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M 8.17 6.493 C 8.09 5.692 8.72 5 9.521 5 C 10.322 5 10.952 5.692 10.872 6.493 L 10.071 14.503 C 10.042 14.785 9.805 15 9.521 15 C 9.237 15 9 14.785 8.971 14.502 L 8.17 6.493 Z M 9.521 19.25 C 8.831 19.25 8.271 18.69 8.271 18 C 8.271 17.31 8.831 16.75 9.521 16.75 C 10.211 16.75 10.771 17.31 10.771 18 C 10.771 18.69 10.211 19.25 9.521 19.25 Z" />
<path d="M 13.128 6.493 C 13.048 5.692 13.678 5 14.479 5 C 15.28 5 15.91 5.692 15.83 6.493 L 15.029 14.503 C 15 14.785 14.763 15 14.479 15 C 14.195 15 13.958 14.785 13.929 14.502 L 13.128 6.493 Z M 14.479 19.25 C 13.789 19.25 13.229 18.69 13.229 18 C 13.229 17.31 13.789 16.75 14.479 16.75 C 15.169 16.75 15.729 17.31 15.729 18 C 15.729 18.69 15.169 19.25 14.479 19.25 Z" />
</svg>
);
export const PriorityHighIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M 5.68 6.493 C 5.6 5.692 6.23 5 7.031 5 C 7.832 5 8.462 5.692 8.382 6.493 L 7.581 14.503 C 7.552 14.785 7.315 15 7.031 15 C 6.747 15 6.51 14.785 6.481 14.502 L 5.68 6.493 Z M 7.031 19.25 C 6.341 19.25 5.781 18.69 5.781 18 C 5.781 17.31 6.341 16.75 7.031 16.75 C 7.721 16.75 8.281 17.31 8.281 18 C 8.281 18.69 7.721 19.25 7.031 19.25 Z" />
<path d="M 10.638 6.493 C 10.558 5.692 11.188 5 11.989 5 C 12.79 5 13.42 5.692 13.34 6.493 L 12.539 14.503 C 12.51 14.785 12.273 15 11.989 15 C 11.705 15 11.468 14.785 11.439 14.502 L 10.638 6.493 Z M 11.989 19.25 C 11.299 19.25 10.739 18.69 10.739 18 C 10.739 17.31 11.299 16.75 11.989 16.75 C 12.679 16.75 13.239 17.31 13.239 18 C 13.239 18.69 12.679 19.25 11.989 19.25 Z" />
<path d="M 15.617 6.493 C 15.537 5.692 16.167 5 16.968 5 C 17.769 5 18.399 5.692 18.319 6.493 L 17.518 14.503 C 17.489 14.785 17.252 15 16.968 15 C 16.684 15 16.447 14.785 16.418 14.502 L 15.617 6.493 Z M 16.968 19.25 C 16.278 19.25 15.718 18.69 15.718 18 C 15.718 17.31 16.278 16.75 16.968 16.75 C 17.658 16.75 18.218 17.31 18.218 18 C 18.218 18.69 17.658 19.25 16.968 19.25 Z" />
</svg>
);
export const PriorityTileIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12 0l-12 12 12 12 12-12-12-12zm-1 6h2v8h-2v-8zm1 12.25c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25 1.25.56 1.25 1.25-.56 1.25-1.25 1.25z" />
</svg>
);
export const EraserIcon = () => (
<svg
width="24"
height="24"
fillRule="evenodd"
clipRule="evenodd"
viewBox="0 0 24 24"
>
<path d="M5.662 23l-5.369-5.365c-.195-.195-.293-.45-.293-.707 0-.256.098-.512.293-.707l14.929-14.928c.195-.194.451-.293.707-.293.255 0 .512.099.707.293l7.071 7.073c.196.195.293.451.293.708 0 .256-.097.511-.293.707l-11.216 11.219h5.514v2h-12.343zm3.657-2l-5.486-5.486-1.419 1.414 4.076 4.072h2.829zm.456-11.429l-4.528 4.528 5.658 5.659 4.527-4.53-5.657-5.657z" />
</svg>
);
export const WandIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M4.908 2.081l-2.828 2.828 19.092 19.091 2.828-2.828-19.092-19.091zm2.121 6.363l-3.535-3.535 1.414-1.414 3.535 3.535-1.414 1.414zm1.731-5.845c1.232.376 2.197 1.341 2.572 2.573.377-1.232 1.342-2.197 2.573-2.573-1.231-.376-2.196-1.34-2.573-2.573-.375 1.232-1.34 2.197-2.572 2.573zm-5.348 6.954c-.498 1.635-1.777 2.914-3.412 3.413 1.635.499 2.914 1.777 3.412 3.411.499-1.634 1.778-2.913 3.412-3.411-1.634-.5-2.913-1.778-3.412-3.413zm9.553-3.165c.872.266 1.553.948 1.819 1.82.266-.872.948-1.554 1.819-1.82-.871-.266-1.553-.948-1.819-1.82-.266.871-.948 1.554-1.819 1.82zm4.426-6.388c-.303.994-1.082 1.772-2.075 2.076.995.304 1.772 1.082 2.077 2.077.303-.994 1.082-1.772 2.074-2.077-.992-.303-1.772-1.082-2.076-2.076z" />
</svg>
);
export const ActorIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M19 7.001c0 3.865-3.134 7-7 7s-7-3.135-7-7c0-3.867 3.134-7.001 7-7.001s7 3.134 7 7.001zm-1.598 7.18c-1.506 1.137-3.374 1.82-5.402 1.82-2.03 0-3.899-.685-5.407-1.822-4.072 1.793-6.593 7.376-6.593 9.821h24c0-2.423-2.6-8.006-6.598-9.819z" />
</svg>
);
export const TriggerIcon = () => (
<svg
width="24"
height="24"
fillRule="evenodd"
clipRule="evenodd"
viewBox="0 0 24 24"
>
<path d="M12 .001l12 12-12 12-12-12 12-12z" />
</svg>
);
export const SpriteIcon = () => (
<svg
width="24"
height="24"
viewBox="0 -4 24 28"
fillRule="evenodd"
clipRule="evenodd"
>
<path d="M24 0v24h-24v-24h24zm-6.118 16.064c-2.293-.529-4.427-.993-3.394-2.945 3.146-5.942.834-9.119-2.488-9.119-3.388 0-5.643 3.299-2.488 9.119 1.064 1.963-1.15 2.427-3.394 2.945-2.048.473-2.124 1.49-2.118 3.269l.004.667h15.993l.003-.646c.007-1.792-.062-2.815-2.118-3.29z" />
</svg>
);
export const TriangleIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24 22h-24l12-20z" />
</svg>
);
export const SceneIcon = () => (
<svg
width="24"
height="24"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
>
<path d="M1.004 5.998l10.996-5.998 10.99 6.06-10.985 5.86-11.001-5.922zm11.996 7.675v10.327l10-5.362v-10.326l-10 5.361zm-2 0l-10-5.411v10.376l10 5.362v-10.327z" />
</svg>
);
export const NoteIcon = () => (
<svg
width="24"
height="24"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
>
<path d="M22 13v-13h-20v24h8.409c4.857 0 3.335-8 3.335-8 3.009.745 8.256.419 8.256-3zm-4-7h-12v-1h12v1zm0 3h-12v-1h12v1zm0 3h-12v-1h12v1zm-2.091 6.223c2.047.478 4.805-.279 6.091-1.179-1.494 1.998-5.23 5.708-7.432 6.881 1.156-1.168 1.563-4.234 1.341-5.702z" />
</svg>
);
export const CodeIcon = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path d="M5.485 3.567l6.488-3.279c.448-.199.904-.288 1.344-.288 1.863 0 3.477 1.629 3.287 3.616l-7.881 4.496c.118-2.088-1.173-4.035-3.238-4.545zm15.857 8.996c-.928-1.137-4.549-4.567-5.762-6.045l-8.855 5.069-1.083-1.354c1.16-.757 1.431-2.619.632-3.799-1.383-2.042-4.274-1.037-4.274 1.129 0 .653.263 1.412.909 2.225.018.023 7.109 8.25 8.531 9.873.768.874 1.081 1.8 1.061 2.71 8.836-5.572 7.833-4.958 7.996-5.065.98-.643 1.503-1.747 1.503-2.827 0-.691-.214-1.372-.658-1.916zm-13.562 5.937c-2.148 1.09-2.38 3.252-1.222 4.598.545.632 1.265.902 1.943.902 1.476 0 2.821-1.337 1.567-2.877-1.3-1.599-2.288-2.623-2.288-2.623z" />
</svg>
);
export const NumberIcon = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path d="M22.548 9l.452-2h-5.364l1.364-6h-2l-1.364 6h-5l1.364-6h-2l-1.364 6h-6.184l-.452 2h6.182l-1.364 6h-5.36l-.458 2h5.364l-1.364 6h2l1.364-6h5l-1.364 6h2l1.364-6h6.185l.451-2h-6.182l1.364-6h5.366zm-8.73 6h-5l1.364-6h5l-1.364 6z" />
</svg>
);
export const ExpressionIcon = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path d="M0.445923 0H23.5541V5.65642H19.4566V4.09756H9.22323L15.8426 12L9.22323 19.9024H19.4567V18.3436H23.5543V24H0.445923L10.4974 12L0.445923 0Z" />
</svg>
);
export const CrossIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M23 20.168l-8.185-8.187 8.185-8.174-2.832-2.807-8.182 8.179-8.176-8.179-2.81 2.81 8.186 8.196-8.186 8.184 2.81 2.81 8.203-8.192 8.18 8.192z" />{" "}
</svg>
);
export const DivideIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21 1H16L3 22.5H8L21 1Z" />
</svg>
);
export const ModuloIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21 1H16L3 22.5H8L21 1Z" />
<circle cx="2" cy="5" r="4" />
<circle cx="22" cy="19" r="4" />
</svg>
);
export const NotIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<rect x="9" y="0" width="6" height="15" rx="4"></rect>
<circle cx="12" cy="20" r="3"></circle>
</svg>
);
export const DiceIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M5 1C2.79086 1 1 2.79086 1 5V19C1 21.2091 2.79086 23 5 23H19C21.2091 23 23 21.2091 23 19V5C23 2.79086 21.2091 1 19 1H5ZM6.5 9.25C8.01878 9.25 9.25 8.01878 9.25 6.5C9.25 4.98122 8.01878 3.75 6.5 3.75C4.98122 3.75 3.75 4.98122 3.75 6.5C3.75 8.01878 4.98122 9.25 6.5 9.25ZM20.25 6.5C20.25 8.01878 19.0188 9.25 17.5 9.25C15.9812 9.25 14.75 8.01878 14.75 6.5C14.75 4.98122 15.9812 3.75 17.5 3.75C19.0188 3.75 20.25 4.98122 20.25 6.5ZM6.5 20.25C8.01878 20.25 9.25 19.0188 9.25 17.5C9.25 15.9812 8.01878 14.75 6.5 14.75C4.98122 14.75 3.75 15.9812 3.75 17.5C3.75 19.0188 4.98122 20.25 6.5 20.25ZM20.25 17.5C20.25 19.0188 19.0188 20.25 17.5 20.25C15.9812 20.25 14.75 19.0188 14.75 17.5C14.75 15.9812 15.9812 14.75 17.5 14.75C19.0188 14.75 20.25 15.9812 20.25 17.5ZM12 14.75C13.5188 14.75 14.75 13.5188 14.75 12C14.75 10.4812 13.5188 9.25 12 9.25C10.4812 9.25 9.25 10.4812 9.25 12C9.25 13.5188 10.4812 14.75 12 14.75Z"
/>
</svg>
);
export const CompassIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M14.145 8.633l-2.145-8.633-2.148 8.636c-.572.366-1.034.877-1.358 1.477l-8.494 1.887 8.494 1.887c.324.6.786 1.111 1.358 1.477l2.148 8.636 2.157-8.64c.571-.367 1.03-.879 1.353-1.479l8.49-1.881-8.492-1.884c-.324-.603-.788-1.116-1.363-1.483zm-2.145 5.367c-1.104 0-2-.896-2-2s.896-2 2-2 2 .896 2 2-.896 2-2 2zm7 5l-3.43-2.186c.474-.352.893-.771 1.245-1.245l2.185 3.431zm-3.521-11.882l3.521-2.117-2.119 3.519c-.386-.542-.86-1.015-1.402-1.402zm-6.955 9.767l-3.524 2.115 2.118-3.521c.387.543.862 1.018 1.406 1.406zm-1.34-8.453l-2.184-3.431 3.431 2.184c-.474.352-.894.772-1.247 1.247z" />
</svg>
);
export const TrueIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M21.5 2H2.5V7H9V22H15V7H21.5V2Z" />
</svg>
);
export const FalseIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M18.5 2H6V22H12V14.5H17V10.5H12V6.5H18.5V2Z" />
</svg>
);
export const VariableIcon = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path
d="M12.7148438,22.1757812 L12.714,20.229 L12.7800926,20.2258391 C13.6949267,20.1603492 14.530599,19.9802517 15.2871094,19.6855469 C16.2597656,19.3066406 17.0253906,18.7519531 17.5839844,18.0214844 C18.1425781,17.2910156 18.421875,16.40625 18.421875,15.3671875 L18.421875,15.34375 C18.421875,14.0625 18.0097656,13.0683594 17.1855469,12.3613281 C16.3613281,11.6542969 15.1484375,11.1210938 13.546875,10.7617188 L12.714,10.579 L12.714,6.513 L12.8085938,6.52539062 C13.0585938,6.56835938 13.2929688,6.6328125 13.5117188,6.71875 C13.9492188,6.890625 14.3046875,7.14257812 14.578125,7.47460938 C14.8515625,7.80664062 15.015625,8.21875 15.0703125,8.7109375 L15.0820312,8.734375 L18.1875,8.72265625 L18.1992188,8.7109375 C18.1601562,7.71875 17.8769531,6.85742188 17.3496094,6.12695312 C16.8222656,5.39648438 16.0996094,4.83203125 15.1816406,4.43359375 C14.5390625,4.1546875 13.8208789,3.97339844 13.0270898,3.88972656 L12.714,3.863 L12.7148438,1.890625 L11.3671875,1.890625 L11.367,3.856 L11.2021123,3.86429398 C10.3338638,3.9304591 9.54123264,4.11241319 8.82421875,4.41015625 C7.90234375,4.79296875 7.17578125,5.33984375 6.64453125,6.05078125 C6.11328125,6.76171875 5.84765625,7.609375 5.84765625,8.59375 L5.84765625,8.6171875 C5.84765625,9.875 6.25390625,10.8671875 7.06640625,11.59375 C7.87890625,12.3203125 9.05078125,12.859375 10.5820312,13.2109375 L11.367,13.384 L11.367,17.597 L11.2177136,17.5815529 C10.8854432,17.5394611 10.5876116,17.469308 10.3242188,17.3710938 C9.86328125,17.1992188 9.50195312,16.9511719 9.24023438,16.6269531 C8.97851562,16.3027344 8.80859375,15.921875 8.73046875,15.484375 L8.73046875,15.4609375 L5.6015625,15.4609375 L5.58984375,15.484375 C5.62890625,16.5078125 5.92773438,17.375 6.48632812,18.0859375 C7.04492188,18.796875 7.79882812,19.3359375 8.74804688,19.703125 C9.48632812,19.9887153 10.3014082,20.1632427 11.193287,20.2267072 L11.367,20.236 L11.3671875,22.1757812 L12.7148438,22.1757812 Z M11.367,10.268 L11.2575,10.2376563 C10.59,10.0464062 10.0875,9.82265625 9.75,9.56640625 C9.328125,9.24609375 9.1171875,8.84375 9.1171875,8.359375 L9.1171875,8.3359375 C9.1171875,7.9765625 9.2265625,7.65625 9.4453125,7.375 C9.6640625,7.09375 9.98828125,6.87109375 10.4179688,6.70703125 C10.6635045,6.61328125 10.9422034,6.54631696 11.2540657,6.50613839 L11.367,6.495 L11.367,10.268 Z M12.714,17.6 L12.714,13.69 L12.8831676,13.7330514 C13.6502131,13.9410834 14.201527,14.1713423 14.5371094,14.4238281 C14.9472656,14.7324219 15.1523438,15.15625 15.1523438,15.6953125 L15.1523438,15.71875 C15.1523438,16.109375 15.0371094,16.4492188 14.8066406,16.7382812 C14.5761719,17.0273438 14.2304688,17.2480469 13.7695312,17.4003906 C13.5061384,17.4874442 13.2032047,17.5496253 12.8607302,17.586934 L12.714,17.6 Z"
fillRule="nonzero"
></path>
</svg>
);
export const ConstantIcon = () => (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path d="M8.01006 4.00992C7.8413 4.02005 7.48524 4.04874 7.44473 4.05549C7.42111 4.06055 7.34517 4.07236 7.27598 4.08249C6.58747 4.18374 5.90402 4.46893 5.40282 4.86719C5.23745 4.99713 4.88475 5.35151 4.73963 5.53376C4.67719 5.61307 4.61475 5.6907 4.60125 5.70589C4.58944 5.72108 4.56412 5.75483 4.54725 5.78183C4.53206 5.80714 4.5135 5.83245 4.50843 5.83752C4.48143 5.85945 4.27387 6.1784 4.12874 6.41971C3.97011 6.68466 3.69673 7.20779 3.57186 7.49129C3.53642 7.57061 3.49085 7.67355 3.4706 7.7208C3.35079 7.98743 3.07572 8.70632 3.04872 8.82444C3.04535 8.83794 3.03522 8.88688 3.0251 8.93076C2.97953 9.1282 2.9981 9.42014 3.06391 9.54839C3.13141 9.67664 3.33729 9.71715 3.69167 9.67158C3.8908 9.64458 4.03593 9.59733 4.15405 9.51633C4.25699 9.44714 4.38356 9.31551 4.45612 9.20414C4.47975 9.16701 4.50337 9.13326 4.50843 9.1282C4.5135 9.12314 4.5405 9.08601 4.5675 9.04382C4.59619 9.00163 4.62487 8.95944 4.63162 8.95101C4.63837 8.94088 4.689 8.87338 4.74131 8.79913C4.91175 8.55781 5.13451 8.29287 5.30832 8.12749C5.79602 7.65836 6.18246 7.45754 6.77816 7.36473C6.87604 7.34785 6.98404 7.3411 7.33167 7.32254C7.64218 7.30567 7.6928 7.30735 7.76368 7.33098C7.94256 7.39004 7.96787 7.49636 7.92568 8.02287C7.92062 8.08699 7.91387 8.19837 7.90881 8.26756C7.88012 8.69957 7.83793 9.25814 7.82443 9.3982C7.79068 9.74583 7.78055 9.84034 7.75862 10.0732C7.72655 10.3938 7.70124 10.6335 7.68943 10.7229C7.68436 10.76 7.67255 10.8512 7.66411 10.9254C7.65399 10.9997 7.63543 11.1482 7.62193 11.2545C7.60842 11.3608 7.58986 11.4941 7.58142 11.5498C7.57299 11.6055 7.5578 11.7084 7.54767 11.7776C7.52236 11.9497 7.48355 12.1944 7.45148 12.3767C7.4363 12.4594 7.42111 12.5471 7.41773 12.5708C7.4093 12.6146 7.34686 12.942 7.33336 13.0011C7.31986 13.0686 7.29286 13.2036 7.28611 13.2373C7.24561 13.4365 7.16967 13.7487 7.06504 14.1402C6.81866 15.07 6.39847 15.934 5.74877 16.8571C5.70658 16.9178 5.65933 16.9853 5.64245 17.009C5.62727 17.0326 5.61039 17.0545 5.60533 17.0596C5.57664 17.0883 5.2982 17.5051 5.18345 17.6924C4.92694 18.1092 4.81388 18.3894 4.71769 18.8399C4.67212 19.0542 4.67381 19.4559 4.72106 19.6921C4.82906 20.222 5.15307 20.6321 5.62895 20.8481C6.04071 21.0337 6.55372 21.0303 7.07517 20.8397C7.20004 20.7958 7.47174 20.654 7.53417 20.6034C7.79068 20.3925 7.87168 20.3199 7.94087 20.2338C7.98643 20.1781 8.02862 20.1309 8.03368 20.1309C8.04043 20.1309 8.059 20.109 8.07418 20.0803C8.09106 20.0533 8.113 20.0212 8.12481 20.0094C8.13662 19.9976 8.16868 19.9537 8.19737 19.9115C8.50788 19.4643 8.84032 18.6864 9.02932 17.9641C9.17951 17.3903 9.35333 16.4791 9.45964 15.6927C9.57777 14.8371 9.6554 14.184 9.73302 13.4061C9.7364 13.3588 9.74315 13.2947 9.74821 13.2626C9.75665 13.1901 9.76677 13.0922 9.79884 12.7395C9.81234 12.5859 9.82753 12.4223 9.83259 12.3767C9.84103 12.2889 9.86803 11.9784 9.88321 11.8029C9.88828 11.7472 9.90009 11.6139 9.90853 11.5076C9.92371 11.3287 10.0148 10.1711 10.0351 9.89602C10.0402 9.83021 10.0469 9.72896 10.052 9.66821C10.0638 9.50958 10.0756 9.3442 10.0857 9.17039C10.0908 9.08601 10.0992 8.96957 10.1026 8.90882C10.1077 8.84807 10.1195 8.681 10.1279 8.53756C10.1903 7.5588 10.1954 7.52167 10.2545 7.42886C10.2697 7.40523 10.3186 7.36979 10.3608 7.35123C10.4401 7.3141 10.4435 7.3141 11.9859 7.30904C13.4405 7.30567 13.5367 7.30567 13.6143 7.33435C13.67 7.35629 13.7088 7.38498 13.7358 7.42379C13.7747 7.47948 13.7763 7.49298 13.7662 7.66005C13.7612 7.75792 13.7527 7.86424 13.7477 7.8963C13.7443 7.92836 13.7325 8.03468 13.7223 8.13256C13.7139 8.23043 13.6987 8.38569 13.6886 8.4785C13.6481 8.86157 13.6143 9.20414 13.5958 9.40664C13.5907 9.4522 13.584 9.52814 13.5789 9.57539C13.5553 9.80996 13.5553 9.80658 13.503 10.3601C13.4523 10.8967 13.422 11.2427 13.4101 11.3979C13.4068 11.4536 13.3983 11.5414 13.3933 11.592C13.3899 11.6426 13.3815 11.7371 13.3764 11.8029C13.3713 11.8671 13.3646 11.9582 13.3595 12.0054C13.3545 12.051 13.3477 12.1472 13.3426 12.2164C13.3089 12.699 13.2988 12.8458 13.2836 13.0804C13.2751 13.2255 13.265 13.401 13.26 13.4685C13.2549 13.536 13.2465 13.6828 13.2414 13.7942C13.2363 13.9056 13.2245 14.1638 13.2144 14.368C13.1806 15.0261 13.2245 16.2749 13.3021 16.9499C13.3123 17.0326 13.3224 17.1305 13.3275 17.1642C13.3308 17.1996 13.3426 17.279 13.3528 17.3414C13.3629 17.4055 13.373 17.4747 13.3764 17.4983C13.3815 17.5507 13.4304 17.8223 13.4507 17.9118C13.638 18.764 13.8641 19.3091 14.2354 19.7934C14.2809 19.8541 14.3299 19.9149 14.345 19.9301C14.3602 19.9436 14.399 19.9874 14.4311 20.0279C14.534 20.1545 14.8192 20.3992 15.0133 20.5291C15.5752 20.9038 16.1828 21.0506 16.8949 20.9848C17.2611 20.9493 17.7049 20.8194 18.0711 20.6371C18.2736 20.5376 18.5504 20.3671 18.6584 20.2794C19.0448 19.9588 19.2861 19.7208 19.4296 19.5183C19.4498 19.4879 19.4802 19.4491 19.4971 19.4323C19.5139 19.4137 19.5274 19.3934 19.5274 19.3867C19.5274 19.3799 19.5376 19.3631 19.5494 19.3512C19.654 19.2399 19.9156 18.7505 20.0556 18.4012C20.3206 17.7363 20.5686 16.6951 20.6176 16.0369C20.6513 15.5796 20.4168 15.2843 20.0084 15.2725C19.7299 15.2641 19.5106 15.3754 19.3789 15.5948C19.3503 15.6454 19.2912 15.7754 19.249 15.8834C19.0651 16.3728 18.9267 16.6242 18.7377 16.8166C18.5942 16.9651 18.5774 16.9786 18.4559 17.0528C18.0694 17.2857 17.5851 17.3228 17.1497 17.149C17.0316 17.1018 16.8679 17.009 16.7852 16.9415C16.7059 16.8756 16.5355 16.7018 16.4899 16.6411C16.4663 16.6107 16.4342 16.5685 16.4173 16.55C16.3616 16.4824 16.2047 16.1399 16.1541 15.9711C16.0545 15.6488 15.9921 15.2573 15.9701 14.8405C15.9398 14.2498 15.9668 12.7463 16.0258 11.7945C16.0511 11.3743 16.0866 10.8461 16.0933 10.7567C16.0984 10.701 16.1051 10.6132 16.1102 10.5626C16.176 9.78465 16.2553 9.00332 16.3296 8.411C16.4494 7.44742 16.4561 7.42379 16.6333 7.34448C16.6958 7.31579 16.8038 7.3141 18.1774 7.30567C19.4785 7.29892 19.6675 7.29385 19.7637 7.26854C19.8244 7.25335 19.9443 7.22804 20.0303 7.21285C20.1181 7.19766 20.2295 7.16729 20.2801 7.14535C20.4505 7.06941 20.5754 6.91922 20.6361 6.71672C20.6598 6.63403 20.6648 6.50071 20.6699 5.71095C20.675 5.10344 20.6716 4.75243 20.6581 4.65625C20.6243 4.3913 20.4961 4.19555 20.2936 4.09936C20.0708 3.99136 20.4455 3.99811 13.9755 4.00148C10.7405 4.00317 8.05731 4.00655 8.01006 4.00992Z" />
</svg>
);
interface ConnectIconProps {
connected: boolean;
title?: string;
}
export const ConnectIcon = ({ connected, title }: ConnectIconProps) => (
<svg width="24" height="24" viewBox="0 0 24 24">
{title && <title>{title}</title>}
<ellipse
ry="10"
id="svg_1"
cy="12"
cx="12"
strokeWidth="3"
stroke="#ccc"
fill="transparent"
/>
<circle cx="12" cy="12" r={connected ? 6 : 2} />
</svg>
);
export const CheckIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" />
</svg>
);
export const CaretDownIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M0 7.33l2.829-2.83 9.175 9.339 9.167-9.339 2.829 2.83-11.996 12.17z" />
</svg>
);
export const CaretUpIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M0 16.67l2.829 2.83 9.175-9.339 9.167 9.339 2.829-2.83-11.996-12.17z" />
</svg>
);
export const CaretRightIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M7.33 24l-2.83-2.829 9.339-9.175-9.339-9.167 2.83-2.829 12.17 11.996z" />
</svg>
);
export const StarIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12 .587l3.668 7.568 8.332 1.151-6.064 5.828 1.48 8.279-7.416-3.967-7.417 3.967 1.481-8.279-6.064-5.828 8.332-1.151z" />
</svg>
);
export const StarOutlineIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12 5.173l2.335 4.817 5.305.732-3.861 3.71.942 5.27-4.721-2.524-4.721 2.525.942-5.27-3.861-3.71 5.305-.733 2.335-4.817zm0-4.586l-3.668 7.568-8.332 1.151 6.064 5.828-1.48 8.279 7.416-3.967 7.416 3.966-1.48-8.279 6.064-5.827-8.332-1.15-3.668-7.569z" />
</svg>
);
export const UploadIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M17 22v2h-10v-2h10zm0-4h-10v2h10v-2zm-10-7v5h10v-5h6l-11-11-11 11h6z" />
</svg>
);
export const ListIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M19 11h-14v-2h14v2zm0 2h-14v2h14v-2zm0 4h-14v2h14v-2zm3-11v16h-20v-16h20zm2-6h-24v24h24v-24z" />
</svg>
);
export const BlankIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24" />
);
export const Bits8Icon = () => (
<svg width="24px" height="24px" viewBox="0 0 24 24">
<path
d="M12.140918,13.34375 C13.0194336,13.34375 13.7951172,13.2079102 14.4679688,12.9362305 C15.1408203,12.6645508 15.6651367,12.2862305 16.040918,11.8012695 C16.4166992,11.3163086 16.6045898,10.7564453 16.6045898,10.1216797 L16.6045898,10.1064453 C16.6045898,9.62910156 16.4941406,9.19746094 16.2732422,8.81152344 C16.0523437,8.42558594 15.7489258,8.10439453 15.3629883,7.84794922 C14.9770508,7.59150391 14.5352539,7.41503906 14.0375977,7.31855469 L14.0375977,7.27285156 C14.6774414,7.11542969 15.1979492,6.81962891 15.5991211,6.38544922 C16.000293,5.95126953 16.2008789,5.43457031 16.2008789,4.83535156 L16.2008789,4.82011719 C16.2008789,4.25136719 16.0282227,3.74482422 15.6829102,3.30048828 C15.3375977,2.85615234 14.8602539,2.50576172 14.2508789,2.24931641 C13.6415039,1.99287109 12.9381836,1.86464844 12.140918,1.86464844 C11.3436523,1.86464844 10.640332,1.99287109 10.030957,2.24931641 C9.42158203,2.50576172 8.94423828,2.85615234 8.59892578,3.30048828 C8.25361328,3.74482422 8.08095703,4.25136719 8.08095703,4.82011719 L8.08095703,4.83535156 C8.08095703,5.43457031 8.28027344,5.95126953 8.67890625,6.38544922 C9.07753906,6.81962891 9.59931641,7.11542969 10.2442383,7.27285156 L10.2442383,7.31855469 C9.74658203,7.41503906 9.30478516,7.59150391 8.91884766,7.84794922 C8.53291016,8.10439453 8.22949219,8.42558594 8.00859375,8.81152344 C7.78769531,9.19746094 7.67724609,9.62910156 7.67724609,10.1064453 L7.67724609,10.1216797 C7.67724609,10.7564453 7.86513672,11.3163086 8.24091797,11.8012695 C8.61669922,12.2862305 9.13974609,12.6645508 9.81005859,12.9362305 C10.4803711,13.2079102 11.2573242,13.34375 12.140918,13.34375 Z M12.140918,6.5796875 C11.7905273,6.5796875 11.4807617,6.51494141 11.2116211,6.38544922 C10.9424805,6.25595703 10.7317383,6.07695313 10.5793945,5.8484375 C10.4270508,5.61992188 10.3508789,5.35585938 10.3508789,5.05625 L10.3508789,5.04101563 C10.3508789,4.74140625 10.4270508,4.47734375 10.5793945,4.24882813 C10.7317383,4.0203125 10.9424805,3.84257813 11.2116211,3.715625 C11.4807617,3.58867188 11.7905273,3.52519531 12.140918,3.52519531 C12.4913086,3.52519531 12.7998047,3.58867188 13.0664062,3.715625 C13.3330078,3.84257813 13.5424805,4.0203125 13.6948242,4.24882813 C13.847168,4.47734375 13.9233398,4.74140625 13.9233398,5.04101563 L13.9233398,5.05625 C13.9233398,5.35585938 13.8484375,5.61992188 13.6986328,5.8484375 C13.5488281,6.07695313 13.3393555,6.25595703 13.0702148,6.38544922 C12.8010742,6.51494141 12.4913086,6.5796875 12.140918,6.5796875 Z M12.140918,11.6679688 C11.7397461,11.6679688 11.3842773,11.5956055 11.0745117,11.4508789 C10.7647461,11.3061523 10.5209961,11.1055664 10.3432617,10.8491211 C10.1655273,10.5926758 10.0766602,10.2994141 10.0766602,9.96933594 L10.0766602,9.95410156 C10.0766602,9.62402344 10.1642578,9.33076172 10.3394531,9.07431641 C10.5146484,8.81787109 10.7571289,8.61601563 11.0668945,8.46875 C11.3766602,8.32148438 11.734668,8.24785156 12.140918,8.24785156 C12.547168,8.24785156 12.9051758,8.32148438 13.2149414,8.46875 C13.524707,8.61601563 13.765918,8.81787109 13.9385742,9.07431641 C14.1112305,9.33076172 14.1975586,9.62402344 14.1975586,9.95410156 L14.1975586,9.96933594 C14.1975586,10.2994141 14.1099609,10.5926758 13.9347656,10.8491211 C13.7595703,11.1055664 13.5170898,11.3061523 13.2073242,11.4508789 C12.8975586,11.5956055 12.5420898,11.6679688 12.140918,11.6679688 Z M4.68496094,14.8722656 L4.68496094,22.2 L5.599,22.2 L7.54394531,22.2 C8.06529948,22.2 8.51048177,22.1179036 8.87949219,21.9537109 C9.2485026,21.7895182 9.53203125,21.5542318 9.73007813,21.2478516 C9.928125,20.9414714 10.0271484,20.575 10.0271484,20.1484375 L10.0271484,20.1382813 C10.0271484,19.8166667 9.96028646,19.5297526 9.8265625,19.2775391 C9.69283854,19.0253255 9.50410156,18.8196615 9.26035156,18.6605469 C9.01660156,18.5014323 8.72714844,18.4015625 8.39199219,18.3609375 L8.39199219,18.2796875 C8.62897135,18.2356771 8.8422526,18.1375 9.03183594,17.9851563 C9.22141927,17.8328125 9.37291667,17.6449219 9.48632812,17.4214844 C9.59973958,17.1980469 9.65644531,16.959375 9.65644531,16.7054688 L9.65644531,16.6953125 C9.65644531,16.3229167 9.56927083,16.0004557 9.39492188,15.7279297 C9.22057292,15.4554036 8.97174479,15.2446615 8.6484375,15.0957031 C8.32513021,14.9467448 7.93834635,14.8722656 7.48808594,14.8722656 L5.59902344,14.8722656 L5.14199219,14.8722656 L4.68496094,14.8722656 Z M5.599,15.68 L7.29511719,15.6796875 C7.74876302,15.6796875 8.10169271,15.7820964 8.35390625,15.9869141 C8.60611979,16.1917318 8.73222656,16.4803385 8.73222656,16.8527344 L8.73222656,16.8628906 C8.73222656,17.2488281 8.59257812,17.539974 8.31328125,17.7363281 C8.03398437,17.9326823 7.61673177,18.0308594 7.06152344,18.0308594 L5.599,18.031 L5.599,15.68 Z M5.599,18.818 L7.32050781,18.8179688 C7.70983073,18.8179688 8.03567708,18.8653646 8.29804688,18.9601563 C8.56041667,19.0549479 8.75761719,19.1971354 8.88964844,19.3867188 C9.02167969,19.5763021 9.08769531,19.8115885 9.08769531,20.0925781 L9.08769531,20.1027344 C9.08769531,20.522526 8.94550781,20.8424479 8.66113281,21.0625 C8.37675781,21.2825521 7.95865885,21.3925781 7.40683594,21.3925781 L5.599,21.393 L5.599,18.818 Z M12.5306641,22.2 L12.5306641,14.8722656 L11.6166016,14.8722656 L11.6166016,22.2 L12.5306641,22.2 Z M17.3142578,22.2 L17.3142578,15.6949219 L19.6755859,15.6949219 L19.6755859,14.8722656 L14.0388672,14.8722656 L14.0388672,15.6949219 L16.4001953,15.6949219 L16.4001953,22.2 L17.3142578,22.2 Z"
fillRule="nonzero"
></path>
</svg>
);
export const ColumnRightIcon = () => (
<svg width="24px" height="24px" viewBox="0 0 24 24">
<path d="M23,1 L23,23 L1,23 L1,1 L23,1 Z M21,3 L3,3 L3,21 L21,21 L21,3 Z M19,5 L19,19 L13,19 L13,5 L19,5 Z"></path>
</svg>
);
export const ColumnLeftIcon = () => (
<svg width="24px" height="24px" viewBox="0 0 24 24">
<path d="M23,1 L23,23 L1,23 L1,1 L23,1 Z M21,3 L3,3 L3,21 L21,21 L21,3 Z M11,5 L11,19 L5,19 L5,5 L11,5 Z"></path>
</svg>
);
export const NavigationIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M20 9h-17v-6h17l3 3-3 3zm-6 10h-4v5h4v-5zm0-19h-4v2h4v-2zm-10 11h17v6h-17l-3-3 3-3z" />
</svg>
);
export const Bits16Icon = () => (
<svg width="24px" height="24px" viewBox="0 0 24 24">
<path
d="M9.05214844,13.1 L9.05214844,2.10839844 L6.759375,2.10839844 L3.91816406,4.08125 L3.91816406,6.153125 L6.61464844,4.27929688 L6.75175781,4.27929688 L6.75175781,13.1 L9.05214844,13.1 Z M13.9195313,6.11123047 C14.0058594,5.62626953 14.1442383,5.20097656 14.334668,4.83535156 C14.5250977,4.46972656 14.7713867,4.1828125 15.0735352,3.97460938 C15.3756836,3.76640625 15.7400391,3.66230469 16.1666016,3.66230469 C16.4662109,3.66230469 16.7328125,3.71054688 16.9664062,3.80703125 C17.2,3.90351563 17.3993164,4.03681641 17.5643555,4.20693359 C17.7293945,4.37705078 17.8550781,4.57890625 17.9414062,4.8125 L17.971875,4.88105469 L20.2189453,4.88105469 L20.2037109,4.80488281 C20.0919922,4.23105469 19.8520508,3.72070313 19.4838867,3.27382813 C19.1157227,2.82695313 18.6472656,2.47402344 18.0785156,2.21503906 C17.5097656,1.95605469 16.8699219,1.8265625 16.1589844,1.8265625 C15.2246094,1.8265625 14.4171875,2.06015625 13.7367188,2.52734375 C13.05625,2.99453125 12.5319336,3.66611328 12.1637695,4.54208984 C11.7956055,5.41806641 11.6115234,6.46796875 11.6115234,7.69179688 L11.6115234,7.70703125 C11.6115234,8.67695313 11.7270508,9.51738281 11.9581055,10.2283203 C12.1891602,10.9392578 12.5116211,11.5283203 12.9254883,11.9955078 C13.3393555,12.4626953 13.8205078,12.8118164 14.3689453,13.0428711 C14.9173828,13.2739258 15.5115234,13.3894531 16.1513672,13.3894531 C16.9791016,13.3894531 17.709082,13.2193359 18.3413086,12.8791016 C18.9735352,12.5388672 19.4686523,12.0742188 19.8266602,11.4851563 C20.184668,10.8960938 20.3636719,10.2283203 20.3636719,9.48183594 L20.3636719,9.46660156 C20.3636719,8.77089844 20.2138672,8.15136719 19.9142578,7.60800781 C19.6146484,7.06464844 19.1957031,6.63808594 18.6574219,6.32832031 C18.1191406,6.01855469 17.4919922,5.86367188 16.7759766,5.86367188 C16.2732422,5.86367188 15.8339844,5.93857422 15.4582031,6.08837891 C15.0824219,6.23818359 14.7701172,6.43496094 14.5212891,6.67871094 C14.2724609,6.92246094 14.0794922,7.18652344 13.9423828,7.47089844 L13.793,7.471 L13.7952188,7.34582422 C13.8090313,6.91073047 13.8504688,6.49919922 13.9195313,6.11123047 Z M16.1361328,11.5613281 C15.7654297,11.5613281 15.4277344,11.4711914 15.1230469,11.290918 C14.8183594,11.1106445 14.5771484,10.865625 14.3994141,10.5558594 C14.2513021,10.2977214 14.1649034,10.0131348 14.1402181,9.70209961 L14.132,9.513 L14.1328125,9.5046875 C14.1328125,9.12382813 14.2229492,8.78740234 14.4032227,8.49541016 C14.5834961,8.20341797 14.8259766,7.97363281 15.1306641,7.80605469 C15.4353516,7.63847656 15.7755859,7.5546875 16.1513672,7.5546875 C16.5373047,7.5546875 16.8788086,7.64101563 17.1758789,7.81367188 C17.4729492,7.98632813 17.7078125,8.22119141 17.8804687,8.51826172 C18.053125,8.81533203 18.1394531,9.15683594 18.1394531,9.54277344 L18.1394531,9.55800781 C18.1394531,9.93378906 18.0493164,10.2727539 17.869043,10.5749023 C17.6887695,10.8770508 17.4475586,11.1169922 17.1454102,11.2947266 C16.8432617,11.4724609 16.5068359,11.5613281 16.1361328,11.5613281 Z M4.68496094,14.8722656 L4.68496094,22.2 L5.599,22.2 L7.54394531,22.2 C8.06529948,22.2 8.51048177,22.1179036 8.87949219,21.9537109 C9.2485026,21.7895182 9.53203125,21.5542318 9.73007813,21.2478516 C9.928125,20.9414714 10.0271484,20.575 10.0271484,20.1484375 L10.0271484,20.1382813 C10.0271484,19.8166667 9.96028646,19.5297526 9.8265625,19.2775391 C9.69283854,19.0253255 9.50410156,18.8196615 9.26035156,18.6605469 C9.01660156,18.5014323 8.72714844,18.4015625 8.39199219,18.3609375 L8.39199219,18.2796875 C8.62897135,18.2356771 8.8422526,18.1375 9.03183594,17.9851563 C9.22141927,17.8328125 9.37291667,17.6449219 9.48632812,17.4214844 C9.59973958,17.1980469 9.65644531,16.959375 9.65644531,16.7054688 L9.65644531,16.6953125 C9.65644531,16.3229167 9.56927083,16.0004557 9.39492188,15.7279297 C9.22057292,15.4554036 8.97174479,15.2446615 8.6484375,15.0957031 C8.32513021,14.9467448 7.93834635,14.8722656 7.48808594,14.8722656 L5.59902344,14.8722656 L5.14199219,14.8722656 L4.68496094,14.8722656 Z M5.599,15.68 L7.29511719,15.6796875 C7.74876302,15.6796875 8.10169271,15.7820964 8.35390625,15.9869141 C8.60611979,16.1917318 8.73222656,16.4803385 8.73222656,16.8527344 L8.73222656,16.8628906 C8.73222656,17.2488281 8.59257812,17.539974 8.31328125,17.7363281 C8.03398437,17.9326823 7.61673177,18.0308594 7.06152344,18.0308594 L5.599,18.031 L5.599,15.68 Z M5.599,18.818 L7.32050781,18.8179688 C7.70983073,18.8179688 8.03567708,18.8653646 8.29804688,18.9601563 C8.56041667,19.0549479 8.75761719,19.1971354 8.88964844,19.3867188 C9.02167969,19.5763021 9.08769531,19.8115885 9.08769531,20.0925781 L9.08769531,20.1027344 C9.08769531,20.522526 8.94550781,20.8424479 8.66113281,21.0625 C8.37675781,21.2825521 7.95865885,21.3925781 7.40683594,21.3925781 L5.599,21.393 L5.599,18.818 Z M12.5306641,22.2 L12.5306641,14.8722656 L11.6166016,14.8722656 L11.6166016,22.2 L12.5306641,22.2 Z M17.3142578,22.2 L17.3142578,15.6949219 L19.6755859,15.6949219 L19.6755859,14.8722656 L14.0388672,14.8722656 L14.0388672,15.6949219 L16.4001953,15.6949219 L16.4001953,22.2 L17.3142578,22.2 Z"
fillRule="nonzero"
></path>
</svg>
);
export const ParallaxIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M4 17.162l-2 .838v-12.972l12-5.028v2.507l-10 4.19v10.465zm18-11.162l-12 5.028v12.972l12-5.028v-12.972zm-14 3.697l10-4.19v-2.507l-12 5.028v12.972l2-.838v-10.465z" />
</svg>
);
export const PaletteIcon = () => (
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fillRule="evenodd"
clipRule="evenodd"
>
<path d="M1 12.155c2.256 3.97 4.55 7.918 6.879 11.845h-5.379c-.829 0-1.5-.675-1.5-1.5v-10.345zm2.85.859c3.278 1.952 12.866 7.658 13.121 7.805l-5.162 2.98c-.231.132-.49.201-.751.201-.549 0-1.037-.298-1.299-.75l-5.909-10.236zm1.9-12.813c-.23-.133-.489-.201-.75-.201-.524 0-1.026.277-1.299.75l-3.5 6.062c-.133.23-.201.489-.201.749 0 .527.278 1.028.75 1.3 2.936 1.695 14.58 8.7 17.516 10.396.718.413 1.633.168 2.048-.55l3.5-6.062c.133-.23.186-.488.186-.749 0-.52-.257-1.025-.734-1.3l-17.516-10.395m.25 3.944c1.104 0 2 .896 2 2s-.896 2-2 2-2-.896-2-2 .896-2 2-2" />
</svg>
);
export const CopyIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M22 6v16h-16v-16h16zm2-2h-20v20h20v-20zm-24 17v-21h21v2h-19v19h-2z" />
</svg>
);
export const AsteriskIcon = () => (
<svg version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 455 455">
<polygon
points="347.49,227 454.5,165.212 394.508,61.288 287.5,123.077 287.5,0 167.5,0 167.5,123.077 60.492,61.288
0.499,165.212 107.51,227 0.5,288.788 60.492,392.712 167.5,330.923 167.5,455 287.5,455 287.5,330.923 394.508,392.712
454.501,288.788 "
/>
</svg>
);
export const CursorHorizontalIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M6 11v-4l-6 5 6 5v-4h12v4l6-5-6-5v4z" />
</svg>
);
export const CursorVeticalIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M13 6h4l-5-6-5 6h4v12h-4l5 6 5-6h-4z" />
</svg>
);
export const CursorDiagonalIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M8.465 7.05l2.828-3.05h-7.293v7.293l3.051-2.829 8.484 8.486-2.828 3.05h7.293v-7.292l-3.051 2.828z" />
</svg>
);
export const ArrowLeftRightIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M1.5 7.5H16.4953L16.499 10.875C16.499 11.3225 16.764 11.7277 17.1745 11.9063C17.5848 12.0849 18.0618 12.0037 18.39 11.6997L23.64 6.82472C24.12 6.37941 24.12 5.6205 23.64 5.17519L18.39 0.300188C18.0622 -0.00374974 17.5851 -0.0849841 17.1745 0.0935628C16.764 0.272438 16.499 0.677625 16.499 1.12481L16.4953 4.5H1.5C0.670781 4.5 0 5.17031 0 5.95781C0 6.74531 0.670781 7.5 1.5 7.5ZM22.5 16.5H7.50469L7.5 13.0828C7.5 12.6353 7.23506 12.2302 6.82453 12.0516C6.41719 11.9156 5.93906 11.9953 5.61094 12.3L0.360937 17.175C-0.119062 17.6203 -0.119062 18.3792 0.360937 18.8245L5.61094 23.6995C5.93869 24.0035 6.41578 24.0848 6.82641 23.9061C7.2375 23.7281 7.5 23.3203 7.5 22.875L7.50469 19.5H22.5C23.3292 19.5 24 18.8292 24 18C24 17.1708 23.3297 16.5 22.5 16.5Z" />
</svg>
);
export const SlopeIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24 22h-24l24-20z" />
</svg>
);
export const InfoIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm1 18h-2v-6h-2v-2h4v8zm-1-9.75c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25 1.25.56 1.25 1.25-.56 1.25-1.25 1.25z" />
</svg>
);
export const BreakpointIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M15.728 3l5.272 5.272v7.456l-5.272 5.272h-7.456l-5.272-5.272v-7.456l5.272-5.272h7.456zm8.272 4.029v9.941l-7.029 7.03h-9.942l-7.029-7.029v-9.942l7.029-7.029h9.941l7.03 7.029zm-2 .829l-5.858-5.858h-8.284l-5.858 5.858v8.284l5.858 5.858h8.284l5.858-5.858v-8.284z" />{" "}
</svg>
);
export const SettingsIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M24 13.616v-3.232l-2.869-1.02c-.198-.687-.472-1.342-.811-1.955l1.308-2.751-2.285-2.285-2.751 1.307c-.613-.339-1.269-.613-1.955-.811l-1.021-2.869h-3.232l-1.021 2.869c-.686.198-1.342.471-1.955.811l-2.751-1.308-2.285 2.285 1.308 2.752c-.339.613-.614 1.268-.811 1.955l-2.869 1.02v3.232l2.869 1.02c.197.687.472 1.342.811 1.955l-1.308 2.751 2.285 2.286 2.751-1.308c.613.339 1.269.613 1.955.811l1.021 2.869h3.232l1.021-2.869c.687-.198 1.342-.472 1.955-.811l2.751 1.308 2.285-2.286-1.308-2.751c.339-.613.613-1.268.811-1.955l2.869-1.02zm-12 2.384c-2.209 0-4-1.791-4-4s1.791-4 4-4 4 1.791 4 4-1.791 4-4 4z" />
</svg>
);
export const CameraIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M16 16c0 1.104-.896 2-2 2h-12c-1.104 0-2-.896-2-2v-8c0-1.104.896-2 2-2h12c1.104 0 2 .896 2 2v8zm8-10l-6 4.223v3.554l6 4.223v-12z" />
</svg>
);
export const DarkBackgroundIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="m11.998 2c5.517 0 9.997 4.48 9.997 9.998 0 5.517-4.48 9.997-9.997 9.997-5.518 0-9.998-4.48-9.998-9.997 0-5.518 4.48-9.998 9.998-9.998zm0 1.5c-4.69 0-8.498 3.808-8.498 8.498s3.808 8.497 8.498 8.497z" />
</svg>
);
export const WarningIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12 1l-12 22h24l-12-22zm-1 8h2v7h-2v-7zm1 11.25c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25 1.25.56 1.25 1.25-.56 1.25-1.25 1.25z" />
</svg>
);
export const ChannelMuteIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M2.2468 3.54544H7.47124L11.9031 14.3523H12.1076L16.5394 3.54544H21.7638V21H17.6559V10.2784H17.511L13.3178 20.8892H10.6928L6.49964 10.2187H6.35476V21H2.2468V3.54544Z" />
</svg>
);
export const ChannelSoloIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M14.8338 8.77841C14.777 8.15341 14.5242 7.66762 14.0753 7.32103C13.6321 6.96876 12.9986 6.79262 12.1747 6.79262C11.6293 6.79262 11.1747 6.86364 10.8111 7.00569C10.4474 7.14773 10.1747 7.34376 9.9929 7.59376C9.81108 7.83807 9.71733 8.11932 9.71165 8.43751C9.70029 8.69887 9.75142 8.92898 9.86506 9.12785C9.98438 9.32671 10.1548 9.50285 10.3764 9.65626C10.6037 9.80398 10.8764 9.93467 11.1946 10.0483C11.5128 10.1619 11.8707 10.2614 12.2685 10.3466L13.7685 10.6875C14.6321 10.875 15.3935 11.125 16.0526 11.4375C16.7173 11.75 17.2742 12.1222 17.723 12.554C18.1776 12.9858 18.5213 13.483 18.7543 14.0455C18.9872 14.608 19.1065 15.2386 19.1122 15.9375C19.1065 17.0398 18.8281 17.9858 18.277 18.7756C17.7259 19.5653 16.9332 20.1705 15.8991 20.5909C14.8707 21.0114 13.6293 21.2216 12.1747 21.2216C10.7145 21.2216 9.44176 21.0028 8.35654 20.5653C7.27131 20.1278 6.42756 19.4631 5.82529 18.571C5.22301 17.679 4.91335 16.5511 4.89631 15.1875H8.93608C8.97017 15.75 9.12074 16.2188 9.38779 16.5938C9.65483 16.9688 10.0213 17.2528 10.4872 17.446C10.9588 17.6392 11.5043 17.7358 12.1236 17.7358C12.6918 17.7358 13.1747 17.6591 13.5724 17.5057C13.9759 17.3523 14.2855 17.1392 14.5014 16.8665C14.7173 16.5938 14.8281 16.2813 14.8338 15.929C14.8281 15.5994 14.7259 15.3182 14.527 15.0852C14.3281 14.8466 14.0213 14.6421 13.6065 14.4716C13.1974 14.2955 12.6747 14.1335 12.0384 13.9858L10.2145 13.5597C8.70313 13.2131 7.51279 12.6534 6.64347 11.8807C5.77415 11.1023 5.34233 10.0511 5.34801 8.72728C5.34233 7.64773 5.6321 6.70171 6.21733 5.88921C6.80256 5.07671 7.61222 4.44319 8.64631 3.98864C9.6804 3.5341 10.8594 3.30682 12.1832 3.30682C13.5355 3.30682 14.7088 3.53694 15.7031 3.99716C16.7031 4.45171 17.4787 5.09092 18.0298 5.91478C18.581 6.73864 18.8622 7.69319 18.8736 8.77841H14.8338Z" />
</svg>
);
export const LangIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z" />
</svg>
);
export const SunIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z" />
</svg>
);
export const MoonIcon = () => (
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z" />
</svg>
);
export const SadIcon = () => (
<svg width="1096" height="974" viewBox="0 0 1096 974" version="1.1">
<defs>
<path
d="M50,0 L846,-1.42108547e-14 C873.614237,-1.92835078e-14 896,22.3857625 896,50 L896,574 C896,684.45695 806.45695,774 696,774 L50,774 C22.3857625,774 3.38176876e-15,751.614237 0,724 L0,50 C-3.38176876e-15,22.3857625 22.3857625,5.07265313e-15 50,0 Z"
id="path-1"
/>
<filter
x="-0.6%"
y="-0.7%"
width="101.2%"
height="101.4%"
filterUnits="objectBoundingBox"
id="filter-2"
>
<feMorphology
radius="2"
operator="erode"
in="SourceAlpha"
result="shadowSpreadInner1"
/>
<feGaussianBlur
stdDeviation="0.5"
in="shadowSpreadInner1"
result="shadowBlurInner1"
/>
<feOffset
dx="0"
dy="-2"
in="shadowBlurInner1"
result="shadowOffsetInner1"
/>
<feComposite
in="shadowOffsetInner1"
in2="SourceAlpha"
operator="arithmetic"
k2="-1"
k3="1"
result="shadowInnerInner1"
/>
<feColorMatrix
values="0 0 0 0 0.415686275 0 0 0 0 0.415686275 0 0 0 0 0.415686275 0 0 0 0.5 0"
type="matrix"
in="shadowInnerInner1"
result="shadowMatrixInner1"
/>
<feMorphology
radius="2"
operator="erode"
in="SourceAlpha"
result="shadowSpreadInner2"
/>
<feGaussianBlur
stdDeviation="0.5"
in="shadowSpreadInner2"
result="shadowBlurInner2"
/>
<feOffset
dx="0"
dy="8"
in="shadowBlurInner2"
result="shadowOffsetInner2"
/>
<feComposite
in="shadowOffsetInner2"
in2="SourceAlpha"
operator="arithmetic"
k2="-1"
k3="1"
result="shadowInnerInner2"
/>
<feColorMatrix
values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.5 0"
type="matrix"
in="shadowInnerInner2"
result="shadowMatrixInner2"
/>
<feMerge>
<feMergeNode in="shadowMatrixInner1" />
<feMergeNode in="shadowMatrixInner2" />
</feMerge>
</filter>
</defs>
<g
id="Artboard"
stroke="none"
strokeWidth="1"
fill="none"
fillRule="evenodd"
>
<g
id="Group"
transform="translate(100.000000, 100.000000)"
fillRule="nonzero"
>
<g id="Rectangle-2">
<use
fill="black"
fillOpacity="1"
filter="url(#filter-2)"
xlinkHref="#path-1"
/>
<path
stroke="#979797"
strokeWidth="10"
d="M50,5 C25.1471863,5 5,25.1471863 5,50 L5,724 C5,748.852814 25.1471863,769 50,769 L696,769 C803.695526,769 891,681.695526 891,574 L891,50 C891,25.1471863 870.852814,5 846,5 L50,5 Z"
strokeLinejoin="bevel"
/>
</g>
<path
d="M819,76.9627119 L896,76.9627119 L896,104.949153 L0,104.949153 L0,76.9627119 L77,76.9627119 L77,0 L105,0 L105,76.9627119 L791,76.9627119 L791,0 L819,0 L819,76.9627119 Z"
id="Combined-Shape"
fill="#979797"
/>
<path
d="M114,193.908475 C100.192881,193.908475 89,205.101356 89,218.908475 L89,663.538983 C89,677.346102 100.192881,688.538983 114,688.538983 L662,688.538983 C742.081289,688.538983 807,623.620272 807,543.538983 L807,218.908475 C807,205.101356 795.807119,193.908475 782,193.908475 L114,193.908475 Z"
id="Rectangle"
stroke="#979797"
strokeWidth="10"
fill="#979797"
/>
</g>
<rect
id="Rectangle"
stroke="#979797"
strokeWidth="10"
fill="#FFFFFF"
fillRule="nonzero"
x="339.5"
y="354.254237"
width="417.875"
height="373.938983"
/>
<text
id=":-("
fontFamily="HelveticaNeue-Bold, Helvetica Neue"
fontSize="200"
fontWeight="bold"
fill="#979797"
>
<tspan x="450.4" y="596">
:-(
</tspan>
</text>
</g>
</svg>
);
|